/* DESKTOP 1024PX */
@media only screen and (max-width: 1024px) {
     .section-text {
        font-size: 1.8VW;
    }

    .img-shaped-text-container{
        width: 80vw;
    }

    .img-clipped:first-of-type{
        max-height: 220px;
    }
    .img-shaped-text__text{
        font-size: 16px;
        padding-top: 0px;
    }
    .img-shaped-text__text--first{
        padding-left: 12px;
        padding-top: 10px;
    }

    /* CIRCULOS */
    .circle-text-item{
        padding-right: 25px;
        padding-left: 25px;
    }
    .circle-img{
        width: 75px;
    }
    .circle-text-item:after{
        font-size: 11px;
    }
    .circle-text-item:hover:after{
        padding-top: 5px;
    }

    /* IMAGENES */
    .pepe{
        -webkit-shape-margin: 11px;
        -webkit-shape-margin: 11px;
        shape-margin: 26px;
    }
    .pepe-right{
        -webkit-shape-margin: 0px;
        -moz-shape-margin: 0px;
        shape-margin: 0px;
    }
    .img-paint{
        margin-bottom: 20px;
    }

    /* .img-paint img{
        height: 55px;
    } */
    .last-text{
        padding-top: 20px;
        margin-bottom: 60px;
    }

    /* FOOTER */
    .footer-container{
        width: 95vw;
        padding: 30px 80px;
    }
}
/*BIG TABLET */
@media only screen and (max-width: 980px) {

    .img-left img{
        max-height: 250px;
    }
    .img-clipped--last{
        max-height: 254px;
    }
    .img-paint-know{
        margin-bottom: 40px;
    }

    .img-shaped-text__text{
        font-size: 14px;
    }
    .brand-slogan{
        margin-left: 20px;
    }
    /* .img-paint img{
        height: 60px;
    } */
}

/* TABLET */
@media only screen and (max-width: 768px) {
    .section-text {
        font-size: 16px;
    }
    .text-right ,.texto-left{
        font-size: 13px;
        width: 100%;
        padding-bottom: 20px;
    }

    .text-right{
        width: 56%;
    }
    .menu-item{
        padding-right: 0px;
        font-size: 3.5vw;
        padding-bottom: 15px;
    }
    .menu-item--img{
        display: none;
    }
    .menu-item:after{
        content: none;
    }

    .nav-menu-header{
        flex-direction: column;
        align-items: center;
    }
    .menu{
        justify-content: space-between;
        flex-direction: column;
        height: auto;
        right: -90px;
        position: absolute;
        top: 60px;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
        display: none;
    }
    .menu.is-open{
        right: 0;
        display: flex;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
        background: rgba(255, 255, 255, 0.5);
        padding: 10px;

    }

    /* MENU HAMBURGUESA */

    .menu-burguer-container{
        display: block;
    }


    .circle-text-item:first-of-type{
        border: 0;
    }
    .circle-text-item:after{
        content: none !important;
        width: 0;
    }
    .main-container{
        display: flex;
        flex-direction: column;
    }
    .img-big{
        max-height: 463px;
        background-image: url('../img/header-mobile.jpg')
    }

    .img-left img{
        /* max-height: 276px; */
        max-height: 50vw;
        -webkit-clip-path: polygon(0% 0%, 50% 0%, 100% 68%, 100% 100%, 0 100%);
        -moz-clip-path: polygon(0% 0%, 50% 0%, 100% 68%, 100% 100%, 0 100%);
        clip-path: polygon(0% 0%, 50% 0%, 100% 68%, 100% 100%, 0 100%);
    }
    .img-right img{
        max-height: 50vw;
    }
    .img-shaped-text-container{
        width: 100%;
        display: flex;
        flex-direction: column;
        padding: 0 10px;
    }
    .img-shaped-text__text{
        margin-bottom: 20px;
        order:2;
        font-size: 3.5vw
    }
    .img-shaped-text__text--first{
        width: 100%;
        padding: 0;
        padding-top: 10px;
        font-size: 3.5vw;
    }
    .img-paint{
        order:3;
    }
    .img-paint--mobile{
        order: 2;
        justify-content: center;
        align-self: center;
    }
    .pepe-right{
        order: 3;
    }
    .pepe{
        order: 4;
    }
    .section-text{
        font-size: 7vw;
        order:2;
    }
    .section-icon-left{
        order: 1;
    }
    .section-icon{
        order: 1;
        align-self: flex-start;
    }
    .section-main-icon{
        order: 1;
        margin-right: 10px;
        max-height: 46px;
    }
    .last-text{
        width: 100%;
        padding-top: 20px;
        margin-bottom: 20px;
        order: 2;
        font-size: 3.5vw;
    }

    .footer-container{
        flex-direction: column;
        padding: 30px;
    }
    .footer-section{
        width: 100%;
        order: 6;
    }
    .footer-legal{
        padding-left: 30px;
        width: 60%;
        justify-content: flex-start;
    }
    .footer-legal-list{
        flex-wrap: wrap;
    }
    .footer-contact{
        order: 1;
    }
    .footer-social{
        order: 2;
        text-align: left;
        align-items: flex-start;
    }
    .footer-social-icons{
        display: flex;
        justify-content: flex-start;
    }
    .footer-location{
        order:3;
    }
    .footer-block{
        display: flex;
        flex-direction: column;
    }
    .footer-item{
        margin-bottom: 20px;
        border-bottom: 1px solid white;
        padding-bottom: 20px;
        border-right: 0;
    }

    .flex-center{
        display: flex;
        justify-content: center;
        flex-direction: column;
        width: 100%;
        padding: 0 20px;
        align-items: center;
    }
    .text-img-wrapper{
        padding: 0 10px;
        display: flex;
        justify-content: center;
        flex-direction: column;
    }
    .texto-left-subtitle{
        padding-left: 0;
    }
    .circle-container{
        order: 5;
    }
    .circle-text-item{
        width: 100%;
        border: 0;
    }
    .circle-subtitle{
        margin-bottom: 10px;
    }
    .no-mobile{
        display: none;
    }
    .only-mobile{
        display: block;
        border-bottom: 1px solid #399190;
        padding-bottom: 10px;
    }
    .only-mobile-paint{
        display: block;
    }
    .separator{
        width: 90%;
    }

    .img-right , .img-left{
        display: flex;
        justify-content: center;
    }
    .img-desktop{
        display: none;
    }
    .img-mobile{
        display: block;
        width: 100%;
    }
    .slogan-text{
        font-size: 13px;
    }
    .logo-brand{
        font-size: 4vw;
        /* line-height: 25px; */
    }
    .logo-container{
        display: block;
        padding-left: 0;
        left: 10%;
        bottom: 10%;
        width: 41%;
        padding: 0;
    }
    .logo-container img{
        width: 20%;
    }
    .brand-slogan{
        margin-left: 0;
        width: 86%;
    }
    .subtitle{
        display: none;
    }
    .big-part .nav-header{
        justify-content: flex-end;
    }
    .img-clipped:first-of-type{
        -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 30% 100%, 0 40%);
        -moz-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 30% 100%, 0 40%);
        clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 30% 100%, 0 40%);
        max-height: 50vw;
    }
    .img-clipped--last{
        -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 30% 100%, 0 40%);
        -moz-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 30% 100%, 0 40%);
        clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 30% 100%, 0 40%);
        max-height: 276px;
    }

    .separator-know {
        margin-bottom: 40px;
    }
    .separator-project{
        margin-top: 40px;
    }
    .separator-blog{
        margin-top: 0;
    }
}
/* MOBILE */
@media only screen and (max-width:440px){
    .logo-brand {
        font-size: 4vw;
        line-height: 20px;
    }
    .img-right img{
        max-width: 100%;
    }
    .img-left img{
        max-width: 100%;
    }
                
}

@media screen and (max-width: 360px), (min-device-width: 260px) and (max-device-width: 640px) and (orientation : portrait) {
    .img-right img{
        max-width: 100%;
      /*  max-height: 200px; */
        
        
    } 
    .img-clipped{
        max-width: 100%;
     /*   max-height: 200px; */
    }
    .img-clipped--last{
      /*  max-height: 200px; */
    }
    .img-left img{
        max-width: 100%;
    /*    max-height: 200px;   */
                
    } 
}

/* LARGE DESKTOP 1800PX */
@media only screen and (min-width: 1800px) {

    .img-right img{
        max-height: 100%;
        max-height: 20vw;
    }
    .img-left img{
        max-height: 100%;
        max-height: 20vw;
    }
    .img-clipped:first-of-type{
        max-height: 100%;
        max-height: 20vw;
    }

    .circle-img{
        width: 9vw;
    }
    .circle-subtitle{
        font-size: 17px;
    }
    .circle-text-item:after{
        font-size: 17px;
    }
}