

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

    /*first section
    =================================*/

    .header__nav {
        margin-top: 15px;
    }

    .slider-content{
        min-height: 680px;
    }

    h1 {
        font-size: 40px;
    }

    h1 > span {
        font-size: 80px;
    }

    .triangle__desc {
        margin-top: 30px;
    }

   .triangle {
        height: 460px;
        padding: 80px 35px 0 35px;
    }
    
    .triangle_back:before{
        top: 60px;
    }

    h1 {
        margin-top: 30px;
        line-height: 40px;
    }
    .triangle__desc {
        margin-top: 0;
    }
    .mouse-click {
        bottom: -10px;
    }
    .bullet-item {
        margin-left: 5px;
        margin-right: 5px;
    }

    .slick-slider:hover .slick-prev{
        left: 20px;
    }

    .slick-slider:hover .slick-next{
        right: 20px;
    }


}

@media only screen and (max-width: 1400px) {
    .services__slider .left {
        width: 40%;
    }

    .characters__link{
        padding: 50px 20px;
    }

    .comments__desc{
        padding: 0 100px;
    }

}

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

    .services__slider .left {
        width: 100%;
        padding: 90px 0 120px 0;
    }

    .block-description{
        padding: 50px 10%;
    }

    .slide-description {
        max-width: 60%;
        text-align: center;
        margin: 0 auto;
    }

    .slide__title {
        font-size: 40px;
        line-height: 42px;
    }

    .slide__desc {
        font-size: 14px;
        line-height: 26px;
    }

    .services__slider .right {
        display: none;
    }

    .brands__list {
        flex-flow: row wrap;
    }

    .brands__item {
        width: 25%;
    }

    .characters__title{
        font-size: 20px;
        line-height: 1.23;
    }

    .examples_hover{
        font-size: 30px;
        line-height: 1.23;
    }

    .discount h3{
        font-size: 40px;
        line-height: 1.23;
    }

    .comments__desc{
        padding: 0;
    }

}

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

    .characters__link {
        padding: 60px 10px;
    }

    .characters__link {
        padding-top: 40px;
    }

    .inner-discount{
        height: 150px;
    }

    .block-description {
        padding: 30px 15px;
    }

    .discount h3{
        font-size: 30px;
    }

    h2 {
        font-size: 40px;
        line-height: 42px;
    }

    .description__text {
        font-size: 14px;
        line-height: 28px;
    }

    .column-img {
        height: 420px;
    }
    .telephone {
        font-size: 30px;
    }
    .contacts {
        padding: 20px;
    }

    .characters__item{
        width: 50%;
        border-bottom: 1px solid rgba(22,34,64,.1);
    }

    .characters__list{
        flex-wrap:wrap;
    }

}

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

    
}

@media only screen and (max-width: 767px) {
    
    .btn_nav {
        display: block;
    }
    .inner-header {
        padding: 0 15px;
    }
    .navigation {
        position: fixed;
        height: 100vh;
        background-color: transparent;
        top: 0;
        right: -100%;
        margin-top: 0;
        padding: 0;
        z-index: 2;
        -webkit-transition: all 0.5s;
        -o-transition: all 0.5s;
        transition: all 0.5s;
    }
    .navigation.active {
        right: 0;
    }
    .nav__list {
        background-color: #162240;
        padding: 60px 40px 10px 40px;
        
    }


    .nav__item {
        margin-left: 0;
        margin-bottom: 25px;
        text-align: center;
    }


    .header .header__logo a {
        width: 189px;
        height: 35px;
        background:  url(../images/logo.png) 0 0 no-repeat;
    }


    .current:after {
        top: 25px;
    }

    .nav__list {
        flex-flow: column nowrap;
    }
    
    .inner-header {
        flex-flow: row nowrap;
        height: 60px !important;
        justify-content: space-between;
        align-items: center;
    }
    .header {
        position: fixed;
        transform: translateY(0);
        background: #162240;
        -webkit-transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -ms-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
        padding-top: 0;
    }

    .slider__item, .slider-content, .first-section {
        background-position: left;
        height: auto;
    }
    .mouse-click {
        display: none;
    }
    .triangle  {
        padding-top: 75px;
        height: auto;
        padding-bottom: 30px;
    }
    .triangle:before, .triangle:after {
        display: none;
        
    }


    h1 {
        display: block;
        position: static;
        transform: translateX(0); 
        width: auto;
    }
    .triangle_back{
        display: none;
    }
    h1 > span {
        font-size: 54px;
        line-height: 1.2;
    }
    .triangle {
        width: 100%;
        background-color: transparent;
        
    }

    .column-wrapper {
        flex-flow: column nowrap;
    }
    .left, .right {
        width: 100%;
        order: initial;
    }
    .block-description {
        padding: 50px 15px;
    }

    .slick-prev,
    .slick-slider:hover .slick-prev{
        left: 15px;
    }
    .slick-next,
    .slick-slider:hover .slick-next {
        right: 15px;
    }
    .slick-prev:hover {
        left: 15px;
    }
    .slide-description {
        max-width: 75%;
        min-height: 300px;
    }

    .comments {
        padding: 0 55px; 
    }

    .discount .description__btn {
        margin-top: 5px;
        margin-left: 10px;
    }

    .social_list  {
        display: table;   
        width: 100%;
    }
    .social_list li {
        display: table-cell;
        border: 1px solid #e0e2e9;
        width: 17%;
    }
    .social_list a {
        width: 100%;
    }
    .social_list li:last-child {
        border-bottom: 1px solid #e0e2e9;
    }

    .contacts {
        text-align: center;
        height: auto;
        padding: 50px 20px 90px;
    }

    .email{
        margin-top: 0;
    }

    .brands__item {
        width: 33.333333%;
    }

    .mfp-arrow-left {
        left: 15px;
    }
    .mfp-arrow-right {
        right: 15px;
    }
    
    .examples__item {
        width: 50%;
    }

    #map{
        height: 300px;
    }

    .description__btn{
        margin-top: 30px;
    }

    img.mfp-img{
        padding: 50px 0 20px;
    }

    .mfp-bottom-bar{
        top: 8px;
    }

    .mfp-title{
        font-size: 18px;
        line-height: 20px;
    }
}

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

    body,html{min-width: 320px;}
    .header__logo {
        position: relative;
        z-index: 3;
    }
    h1 > span {
        font-size: 44px;
        line-height: 50px;
    }
    .social_list a {
        height: 50px;
        padding: 10px;
        line-height: 30px;
        font-size: 22px;
    }

    .slick-prev, .slick-slider:hover .slick-prev{
        left: 5px;
    }
    .slick-next, .slick-slider:hover .slick-next{
        right: 5px;
    }

    .comments {
        padding: 0 35px; 
    }
    .comments__desc {
        font-size: 18px;
        line-height: 30px;
    }
    .comments__name {
        margin-top: 30px;
    }

    .mfp-arrow-left {
        left: 5px;
    }
    .mfp-arrow-right {
        right: 5px;
    }


    .characters__list {
        flex-flow: column nowrap;
    }

    .characters__item {
        width: 100%;
        border-right: none;
    }

    .characters__list {
        flex-flow: column nowrap;
    }

    .characters__item {
        width: 100%;
        border-right: none;
    }

    .examples__item{
        width: 100%;
    }

    .brands__item{
        width: 100%;
    }

    .inner-discount{
        -webkit-flex-flow: column wrap;
        -moz-flex-flow: column wrap;
        -ms-flex-flow: column wrap;
        -o-flex-flow: column wrap;
        flex-flow: column wrap;
        text-align: center;
        height: auto;
        padding: 35px 0;
    }

    .discount h3{margin-bottom: 20px;}
    
    .triangle {
      padding-left: 0px;
      padding-right: 0px;
    }

    .slide__title {
        font-size: 30px;
        line-height: 30px;
    }


}
