@media (min-width: 760px) and (max-width: 767px) {
    .posrel {
        padding: 8px 0 10px;
    }
    .box-buscar {
        right:80px;
        position:fixed;
        width: 50%;
    }
    .btnbuscar {
        top: 7px;
        right: 70px !important;
    }

    .clientes {
        float: right;
        display: block !important;
    }

    ul.menu li a {
        padding: 8px !important;
    }

    

    #site-canvas {
        width: 100%;
        height: 100%;
        position: relative;
        -webkit-transition: all .4s ease;
        transition: all .4s ease;
        left: 0;
    }

    #site-menu {
        width: 300px;
        height: 100%;
        position: fixed;
        top: 0;
        left: -304px;
        background-color: #F2F2F1;
        box-shadow: 0 5px 10px rgba(0,0,0,.2);
        padding: 15px;
        z-index: 8888;
        box-shadow: 2px 2px 4px rgba(0,0,0,.2);
        -webkit-transform: translateX(0);
        transform: translateX(0);
        -webkit-transition: all .4s ease;
        transition: all .4s ease;
    }

    aside#filtros {
        max-width: 100% !important;
        position: relative;
        background-color: #f2f2f1;
        border: 0;
        height: 100vh;
        top: 0;
    }
        aside#filtros ul.dropdown-menu {
            background-color:transparent;
        } 
        
        header .logo {
            margin: 0;
            padding: 0;
            left: 20px !important;
            position: absolute;
            transform: scale(0.6);
            transform-origin: 0px 0px 0px;
            padding: 10px;
            z-index: 2;
        }
    .grid-wrapper {
        grid-template-columns: 1fr 1fr 1fr;
    }
    ul.menu {
        /*margin: 0;
        padding: 0;
        text-align: center;
        font-size: 1.5em;*/
        margin: 0;
        padding: 20vh 0;
        text-align: center;
        font-size: 3.5em;
        flex-direction: column;
    }

        ul.menu li {
            display: block;
        }

            ul.menu li a {
                color: #fff;
                width: 100%;
                display: block;
            }

                ul.menu li a:focus, ul.menu li a:active, ul.menu li a:hover {
                    color: #fff;
                    background: 0;
                    text-decoration: underline;
                }
    svg.button-menu {
        display: block !important;
        top: -2px !important;
        fill: transparent !important;
        transition: none;
        -webkit-transition: none;
    }
        svg.button-menu.active {
            right: 60px !important;
            fill: transparent !important;
            transition:none;
            -webkit-transition: none;
        }
    section.dircontacto, section.contacto {
        padding:0;
    }
    section.redes {
        float:none;
        text-align:center;
        margin:0 auto;
    }
    .iso li {
        padding: 15px;
    }
    .accesoclientes .container {
        width: 100%;
    }
    header a.btn-cont {
        padding: 5px;
        margin: 5px;
        display: inline-block;
        text-align: center;
        left: 160px;
        position: fixed;
    }
    header .btn-cont + a {
        display: none;
    }
    .salir .btn-cont {
        display: none;
    }
    .accesoclientes li.salir {
        margin-left: 90px;
    }
    .bloquecesta, .bloquecestaport {
        left:-20px;
    }
    .flex {
        -webkit-flex-basis: 50%;
        max-width: 50%;
        flex-basis: 50%;
        -ms-flex-preferred-size: 50%;
    }
    .logo img {        
        height:80px!important;
    }
   
}
    /* Portrait tablet to landscape and desktop*/
    @media (min-width: 768px) and (max-width: 979px) {
            .col-sm-offset-8 {
            margin-left: 68.66666667%;
          }
            .visibleElement .col-sm-offset-8 {
            margin-left: 61.66666667%;
          }
        .accesoclientes .container {
            padding:0;
        }
         .accesoclientes ul {       
            font-size: 0.665em;
        }
         .accesoclientes li:nth-child(-n+2) a {      
             text-indent:-3000px;
        }
        .bloquecestaport .articulo > a {
            font-size: 1.2em;
            transform: scale(.5) !important;
            transform-origin: 0 20%;
        }
        .bg-header {
            width: auto;
        }

        ul.menu li a {
            padding: 8px !important;
        }

        #servicios .box {
            min-height: 310px;
        }

        .figcaption {
            left: 0;
            transform: translate(0, -50%);
            -webkit-transform: translate(0, -50%);
        }
        .buscar {
            width:65%;
        }
        .buscar input {
            max-width: 100px;
        }

        .btn-button {
            font-size: inherit;
        }

        #carousel {
            min-width: 1024px;
        }

        #soluciones .imagen img.clip {
            margin: 0;
        }

        .box-attcliente li {
            margin: 5px 30px 100px;
        }

        footer .box-attcliente li {
            margin: 0;
        }

        .btnbuscar {
            /*! top: 7px; */
        }

        .posrel {
            padding: 8px 0 20px;
            margin:0;
            width: 100%;
        }


        .box-articulo figure {
            min-height: 285px;
        }

        .iso li {
            padding: 15px !important;
        }

        #site-canvas {
            width: 100%;
            height: 100%;
            position: relative;
            -webkit-transition: all .4s ease;
            transition: all .4s ease;
            left: 0;
        }

        #site-menu {
            width: 300px;
            height: 100%;
            position: fixed;
            top: 0;
            left: -304px;
            background-color: #F2F2F1;
            box-shadow: 0 5px 10px rgba(0,0,0,.2);
            padding: 15px;
            z-index: 8888;
            box-shadow: 2px 2px 4px rgba(0,0,0,.2);
            -webkit-transform: translateX(0);
            transform: translateX(0);
            -webkit-transition: all .4s ease;
            transition: all .4s ease;
        }

        .dropdown-menu {
            position: static;
        }

        aside#filtros {
            position: relative;
            background-color: #f2f2f1;
            border: 0;
            max-height: 100vh;
            top: 0;
            width: 100%;
        }

            aside#filtros ul.dropdown-menu {
                background-color: #f2f2f1;
            }

        #footer {
            width: 100% !important;
            margin-left: 0 !important;
            margin-bottom: -620px;
            height: 620px;
        }

        li.clientes {
            margin: 0 !important;
        }

        .clientes a {
            padding: 2px;
        }

        section.redes {
            text-align: center;
            margin: 0 auto;
            float: none;
        }

        footer section.contacto {
            padding: 0;
            text-align:center;
        }

        .visibleElement ul.menu {
            /*! left: 45%; */
        }

        .visibleElement .bloquecestaport {
            left: 8px !important;
            padding: 8px 0 0;
        }

        .visibleElement .buscar {
            right: 85px;
        }

        .visibleElement .btnbuscar {
            right: 90px;
        }
        .visibleElement .vita {
            transform:scale(.8) !important;
            transform-origin:0 20%;
            left:18px !important;
        }
        svg.button-menu {
            display: none !important;
        }

        .flex {
            -webkit-flex-basis: 50%;
            max-width: 50%;
            flex-basis: 50%;
            -ms-flex-preferred-size: 50%;
        }

        .btn-pasos ol li a.active::before {
            margin-top: -38px;
        }

        .grid-wrapper h2 {
            font-size: inherit !important;
        }

        .bgw {
            width: 100% !important;
            margin-bottom: 15px;
        }
        .grid-wrapper {
            grid-template-columns: 1fr 1fr 1fr;
        }
        .accesoclientes .container {
            width:100%;
        }
        .outlet, .outletColor, .new {
            transform: scale(0.84);
            transform-origin: 0 0;
            -webkit-transform: scale(0.84);
            -webkit-transform-origin: 0 0;
        }
        ul.menu {
            margin: 0;
            left: 38%;
            font-size: 0.856em;
            padding: 12px 0 0;
        }
        .relacionados {    
    transform: translate(0,0);
            padding:0;
}
.relacionados h4 {
    float:left;
    
}
        .logo img {        
        height:80px!important;
    }
         p#icex {
        font-size: 0.8em;  
    }

    }

    @media (min-width: 979px) and (max-width: 1366px) {
        .bg-header {
            width: auto;
        }
.accesoclientes li:nth-child(-n+2) a {
    text-indent: -3000px;
  }
        ul.menu {
            margin: 0;
            left: 30%;
            font-size: 0.856em;
            padding-top: 12px;
        }



        #servicios .box {
            min-height: 310px;
        }

        .figcaption {
            left: 0;
            transform: translate(0, -50%);
            -webkit-transform: translate(0, -50%);
        }

        .buscar input {
            max-width: 100px;
        }

        .btn-button {
            font-size: inherit;
        }

        #carousel {
            min-width: 1024px;
        }

        #soluciones .imagen img.clip {
            margin: 0;
        }

        .box-attcliente li {
            margin: 5px 30px 100px;
        }

        footer .box-attcliente li {
            margin: 0;
        }

        footer section.contacto {
            padding: 0;
            margin-left: -30px;
        }

        section.redes {
            padding: 0;
            float: none;
            transform: scale(0.8);
            -webkit-transform: scale(0.8);
        }

        .iso li {
            padding: 15px 30px;
        }

        

        .clientes a {
            padding: 2px;
        }

        .box-articulo figure {
            min-height: 366px;
        }

        aside#filtros ul.dropdown-menu {
            padding: 0 !important;
        }

        aside#filtros li {
            font-size: 0.8em;
        }

        #footer {
            width: 100% !important;
            margin-left: 0 !important;
        }

        .visibleElement .bloquecestaport {
            left: 0px!important; 
        }

        .visibleElement .buscar {
            right: 185px;
        }

        .visibleElement .btnbuscar {
            right: 195px;
        }
        .visibleElement .vita {
            transform:scale(.8) !important;
            transform-origin:0 20%;
            left: 0px!important; 
        }  
        .bloquecestaport .articulo > a {
            font-size: 1.2em;
            transform: scale(.65) !important;
            transform-origin: 0 20%;
        }
        svg.button-menu {
            display: none !important;
        }

        .btn-pasos ol li a.active::before {
            margin-top: -38px;
        }

        .grid-wrapper h2 {
            font-size: inherit !important;
        }
        .outlet, .outletColor, .new {
            transform: scale(0.51);
            transform-origin: 0 0;
            -webkit-transform: scale(0.51);
            -webkit-transform-origin: 0 0;
        }
          .relacionados {   
    transform: none;
              padding:0;
}
.relacionados h4 {
    float:left;
    
}
          .logo img {        
        height:80px!important;
    }

    }