/*==========  Desktop First Method  ==========*/
@media only screen and (max-width : 1600px){
    
}

@media only screen and (max-width : 1440px){
    
}
/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {

}

@media only screen and (max-width : 1199px){
    .services .item .title{
        font-size: 18px;
    }
    
    .footer .left{
        width: 100%;
        float: none;
        padding-right: 0;
        
    }
    
    .footer .right{
        width: 100%;
        float: none;
        text-align: left;
    }
}

@media only screen and (max-width : 1024px){

    .intro{
        background-position: 65% top;
    }
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
    .header .left{
        width: 50%;    
    }
    
    .header .center{
        width: 0;
        float: none;
    }
    
    .header .right{
        width: 50%;
    }
    
    .nav{
        width: 320px;
        padding: 25px 15px;
        background: #fff;  
        position: absolute;
        top: 100%;
        left: 0px;   
        display: none;   
    }
    
    .nav li{
        width: 100%;
        margin: 15px 0;
    }
    
    .burger{
        display: inline-block;
        margin-left: 25px;
    }
    
    .intro .inner{
        padding-top: 50px;
        padding-bottom: 100px;
    }
    
    .advantages .inner,
    .part .inner{
        padding-bottom: 30px;
    }
    
    .advantages .item{
        width: 50%;
    }
    
    .services .inner,
    .price .inner,
    .product .inner,
    .popular .inner,
    .projects .inner,
    .partners .inner,
    .ques .inner{
        padding-top: 30px;
        padding-bottom: 30px;
    }
    
    .services .item{
        width: 33.33%;
    }
    
    .catalog .item .bottom{
        padding-left: 15px;
        padding-right: 15px;
    }
    
    .part .item{
        width: 33.33%;
    }
    
    .part .container{
        padding: 30px 15px 30px;
    }
    
    .popular .pic{
        width: 300px;
    }
    
    .popular .right{
        margin-left: 300px;
    }
    
    .slider{
        padding-top: 55px;
        padding-left: 0;
        padding-right: 0;
    }
    
    .bx-wrapper .bx-controls-direction a{
        top: -55px;
        margin-top: 0;
    }
    
    .bx-wrapper .bx-prev{
        left: 0px;
    }
    
    .bx-wrapper .bx-next{
        right: 0px;
    }
    
    .footer .item{
        width: 100%;
        margin-left: 0;
        margin-top: 5px;
        margin-bottom: 5px;
    }
    
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
    
}

@media only screen and (max-width : 767px){
    .header .left{
        width: 100%;
        float: none;  
        text-align: center;  
    }
    
    .header .right{
        width: 100%;
        float: none;  
        text-align: center;  
    }
    
    .intro h1{
        font-size: 40px;
    }
    
    .intro .subtitle{
        
    }
    
    .intro .subtitle br{
        display: none;
    }
    
    .intro{
        background-position: left top;
    }
    
    .intro .col{
        width: 100%;
        float: none;
    }
    
    .services .item{
        width: 50%;
    }
    
    .discount .left{
        width: 75px;
    }
    
    .discount .right{
        margin-left: 75px;
    }
    
    .catalog .item{
        width: 100%;
        float: none;
    }
    
    .part .item{
        width: 50%;
    }
    
    .product .item .option{
        width: 50%;
        margin-bottom: 20px;             
    }
    
    .product .item .option:nth-child(3){
        border-left: 0;
    }
    
    .popular .pic{
        width: 100%;
        max-width: 380px;
        float: none;
        margin: 0 auto 30px;
    }
    
    .popular .right{
        margin-left: 0;
        padding-left: 0;
    }
    
    .list li{
        font-size: 16px;
        margin-bottom: 15px;
    }
    
    .projects .item{
        padding: 15px;
    }
    
    .ques .cols{
        max-width: 480px;
        margin: 0 auto 30px;
    }
    
    .ques .col{
        width: 100%;
        float: none;
        padding: 0;
    }
    
}

@media only screen and (max-width : 600px){
    
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
   
    
    .header .logo img{
        width: 200px;
    }
    
    .intro .subtitle{
        font-size: 18px;
    }
    
    .intro h1 {
        font-size: 38px;
    }
    
    .advantages .item{
        width: 100%;
        float: none;
    }
    
    .title_block{
        margin-bottom: 30px;
        font-size: 32px;

    }
    
    .sub_block{
        font-size: 20px;
    }
    
    .services .item{
        width: 100%;
        float: none;
    }
    
    .part .item{
        width: 100%;
        float: none;        
    }
    
    .part .item > div{
        min-height: 0;
    }
    
    .product .item .sub_title{
        font-size: 18px;
    }
    
    .product .item .option{
        width: 100%;
        float: none;
        margin-bottom: 0;
        border-left: none;
        border-bottom: 1px dotted #ccd0d3;             
    }
    
    .projects .item .pic{
        width: 100%;
        float: none;
    }
    
    .projects .item .pic img{
        width: auto;
        max-width: 100%;
    }
    
    .projects .item .right{
        margin-left: 0;
        padding-left: 0;
    }
    
    .personal{
        float: none;
        width: 100%;
        margin-top: 15px;
    }
}

@media only screen and (max-width : 430px) {
    .popup{
        width: 100%;
        padding: 35px 15px 50px;
        
    }
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}


/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {

}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {

}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {

}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {

}

 /* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

}