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

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
    .box_cap_xs{position: relative;padding-bottom:10px;overflow: hidden;clear: both;}
    .buscador_petit{display: block;margin-bottom: 5px;float:none;}
    .buscador_petit form{display: block;margin:0 auto;}
    .flash_offers{display: block;}
    #boton_cambiar_idioma{margin-left:5px !important;}
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 400px) {
    .flash_offers{float:left;}
    .buscador_petit{float:right;margin:0;padding:0;}
}

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

    #header{min-height:40px;}

    .items-mosaic .col-sm-5{width:20%;}

    .items-columns-3 .item:nth-child(4n+1) {
        clear:both;
    }

    .items-columns-5 .item:nth-child(5n+1) {
        clear:both;
    }

    .linkhovereffect:hover img {
        -ms-transform:scale(1.2);
        -webkit-transform:scale(1.2);
        transform:scale(1.2);
    }

    .linkhovereffect:hover .overlay {
        opacity:1;
        filter:alpha(opacity=100);
    }

    .linkhovereffect:hover h4,.linkhovereffect:hover a.info {
        opacity:1;
        filter:alpha(opacity=100);
        -ms-transform:translatey(0);
        -webkit-transform:translatey(0);
        transform:translatey(0);
    }

    .linkhovereffect:hover a.info {
        -webkit-transition-delay:.2s;
        transition-delay:.2s;
    }

    #ico_contacte{float:left;}
    #ico_contacte .ico_contacte{margin-top:-4px;font-size:16px;margin-right:5px;}

    #xarxes_socials{position:absolute;right:0;bottom:0;}
    #xarxes_socials a{float:left;margin-left:12px;}

    #header_menu{min-height:168px;}

    #logo_benito_small{display:none;}
    #logo_benito_menu{position:absolute;right:15px;width:auto;height:30px;top:13px;color:#f00;display:none;}
    #logo_benito_menu * {
        stroke-color:#009A75;
        color:#009A75;
        fill:#009A75;
    }

    .logo_menu{position:relative;clear:both;margin:0;min-height:82px;}
    .logo_menu .logo{float:left;}
    .logo_menu .logo img#logo{float:left;margin:0;padding:0;}

    #contacte_cap .links{position:absolute;right:15px;top:0;}
    #contacte_cap .links a{float:left;font-size:14px;color:#000;line-height:40px;margin-left:20px;font-weight:600;}

    #mobnav-btn{display:none;}
    .mobnav-subarrow{display:none;}

    .pcertificaciones{position:absolute;top:0;right:15px;margin:0;padding:0;}
    .pcertificaciones form{float:right;}
    .pcertificaciones input[type="submit"]{line-height:34px;height:34px;margin:0;padding:0 15px;font-size:15px;background:#444242;margin-bottom:10px;float:right;clear:both;margin-left:10px;font-family: 'Open Sans', sans-serif;transition:0.3s;}
    .pcertificaciones input[type="submit"]:hover{background:#009763;}

    .hovereffect{display:table;height:192px;}
    .gallery-container .hovereffect{height:auto;}
    .hovereffect .img_principal{display:table-cell;height:100% !important;vertical-align:middle;}
    .hovereffect .img_principal img{max-height:192px;}
    .items-columns-5 .hovereffect .img_principal img{max-height: none !important;}

}

/* Medium Devices, Desktops */
@media only screen and (min-width : 1024px) {
    .container_menu{padding:0;}
    #menu.fixat{position:fixed;top:0;left:0;width:100%;z-index:10000000;background:#EDF5F0;}
    #menu.fixat .container_menu{position:relative;clear:both;max-width:1280px;padding:0 15px;}
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    /*#menu.fixat{position:fixed;top:0;left:50%;margin-left:-625px;width:1250px;z-index:10000;background:#fff;}*/
}



/*==========  Non-Mobile First Method  ==========*/

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

}

/* Medium Devices, Desktops */
@media only screen and (max-width : 1024px) {
    #menu ul.menu-principal > li > a{font-size:14px;padding:16px 8px 17px 8px;}
    #menu ul.menu-principal ul li a{font-size:14px;}
    .container{width:100%;}
    #body{min-width:100% !important;width:100% !important;}
}

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

    #categoria_solicita_presupost .marcar_tots{float:none;clear: both;text-align: center;}
    #categoria_solicita_presupost .marcar_tots label{margin:0;padding:0;}
    #categoria_solicita_presupost #marcar_tots{float:none;}

    #categoria_solicita_presupost .box{text-align: center;padding-bottom: 10px;}
    #categoria_solicita_presupost .box a.btn{display: inline-block;margin:0 auto;float: none;}

    .tabla_solicitud td input{max-width:200px;}
    .tabla_solicitud td select{max-width:200px;}

    .box_benito3dplan{height:300px !important;}

    body{min-width:100%;width:100%;padding-top:60px;}
    #body{min-width:100%;width:100%;}
    #footer{width:100%;min-width:100%;}
    #footer h2{margin-top:30px;}
    #header_menu{min-width:100%;width:100%;min-height:auto;height:auto !important;}
    .container{max-width:100%;width:100%;}
    .container img{max-width:100%;}

    /*#ico_contacte{position:absolute;top:10px;left:0;}*/
    #ico_contacte span{font-size:12px;}
    #ico_registrar{position:absolute;top:5px;right:-10px;}
    #ico_registrar i{font-size:20px;}

    .fons{display:none;}
    .superior{position:relative;min-height:63px;}

    .buscador_gran{dislay:none !important;}
    #menu{height:auto;min-height:0 !important;}
    #menu .container{margin:0 !important;padding:0 !important;}

    h2.sm{text-align:center;float:none;position:relative;clear:both;}
    h2.sm span{position:relative !important;top:auto;left:auto;display:block;text-align:center;clear:both;margin-bottom:10px;}

    .categories{height:auto;position:relative;overflow:hidden;clear:both;margin-bottom:30px;}
    .categories > ul > li button.active{border:none;}
    .masonry-container .grid-item{width:100% !important;float:none;clear:both;position:relative;min-height:auto !important;height:auto !important;}

    #menu ul.menu-principal > li > a{font-size:16px;padding:16px 13px 17px 13px;}
    #menu ul.menu-principal ul li a{font-size:16px;}

    .items-mosaic .item:nth-child(2n+1) {
        clear:both;
    }

    .bxslider{margin-top:20px !important;}
    #bxSlider{margin-top:0 !important;}

    h2.titulo{font-size:15px;letter-spacing:0;padding:20px 0;}

    .apartats_benito{display:none !important;}

    .linkhovereffect:hover .overlay{opacity:0;}

    .amagar_mobil{display:none !important;}

    .bx-wrapper .bx-caption h1{font-size:30px !important;}
    .bx-wrapper .bx-caption h2{font-size:18px !important;}

    .menu-carousel{margin:0;padding:0;}
    .menu-ficha li a{min-width:120px;text-align:center;}
    .anadir-lista:hover{color:#fff;text-decoration:underline;}

    .pcertificaciones input{width:100%;}

    .masproductos{margin-top:40px;}
    .masproductos .contenedor_categoria{display:block;margin:0 auto;margin-bottom:80px;}
    .masproductos .contenedor_categoria a{text-align:center;display:block;font-size:24px;}
    .masproductos .contenedor_categoria img{display:block;margin:0 auto;}

    .select_ordenar_por{display:block;margin:0 auto;position:relative;margin:20px 0 10px 0;}
    .ordernarpor{position:relative;overflow:hidden;clear:both;display:block;margin:0 auto;top:auto;right:auto;left:auto;}

    .botonproducto{background:none;display:block;margin:0 auto !important;color:#fff;border-radius:0;background:#009A75;border:none;margin-bottom:10px !important;}
    .anadir-lista{background:none;display:block;margin:0 auto !important;color:#fff;border-radius:0;background:#009A75;border:none;margin-bottom:10px !important;}
    .certificacion{margin-top:30px;}

    .idioma{width:100%;position:relative;}
    .idioma{margin-left:0;}
    .idioma .nombre_idioma img{margin-left:0;}

    #apartats_benito_peu{display:block;width:180px;margin-bottom:40px;}
    #logo_benito_menu{display:none;}

    #cambiar_idioma{width:100%;top:66px;}

    .imagen-ficha{width:100%;display:block;float:none;padding:10px;margin-bottom:20px;display:block;}
    .imagen-ficha img{display:block;margin:0 auto;}

    .games_productes a{display:block;}
    .games_productes a img{display:block;margin:0 auto;}
    .games_productes a h3{text-align:center;}

    .listado-productos{display:block;width:100%;height:auto;}
    .listado-productos-body{display:block;width:100%;}
    .listado-productos .listado-titulo{display:block;width:100%;height:auto;margin:0;}
    .listado-productos .listado-titulo .titulo_h3{display:block;width:100%;position:relative;margin:0 auto;height:auto;padding:10px 20px;text-align:center;}
    .listado-productos .productos{display:block;width:100%;overflow:hidden;height:auto;}
    .listado-productos .productos .producto{width:100%;display:block;margin:0 auto;position:relative;padding:0;margin-bottom:60px;}
    .caja-cumplimiento{float:none;display:block;margin:0 auto;margin-bottom:20px;width:100%;}

    .homologaciones{height:auto;min-height:auto;display:block;overflow:hidden;clear:both;}
    .homologaciones .logos_homologacion{display:block;width:100%;float:none;height:auto;}
    .homologaciones .logos_homologacion img{width:100%;}

    #myvideo{width:100%;height:auto;}

    .formulario_contacto{width:100%;}
    .formulario_contacto select{width:100%;}
    .contacto_sobre{width:100%;padding:0;display:none;}
    .contacto_sobre img{width:100%;}


    #logo_benito_small{color:#fff;stroke-color:#fff;color:#fff;fill:#fff;position:absolute;top:13px;left:10px;height:36px;}


    #covers{margin-bottom:0;}
    #covers .row > div{float:left;margin-bottom:60px;}
    #covers svg{max-width:80% !important}

    .clear{clear:both;display:block;height:1px;overflow:hidden;}

    .items-gallery .item{margin-bottom:80px;}

    .bxSliderProjectes .bx-caption h2{font-size:16px !important;}

    img.logos{margin-bottom:40px;}

    .logo_benito{display:none !important;}
    .logo_menu{background:none;padding:0;margin:0;height:auto;width:100%;}
    #xarxes_socials{position:relative;margin:0 auto;clear:both;display:block;text-align:center;width:100%;margin-bottom:10px;}
    #xarxes_socials a{display:inline-block;margin:0 10px;}
    #xarxes_socials a i{color:#000;font-size:24px;}

    #contacte_cap .links{position:relative;clear:both;padding:14px 0;float:left;}
    #contacte_cap .links a{line-height:20px;float:left;margin-right:10px;}
    #contacte_cap .container{height:auto;}

    /** Menú **/

    #box_menu {
        position:fixed;top:0;left:0;width:100%;z-index:10000;margin:0;background:#fff;overflow:auto;max-height: 100%;box-shadow: 0px 5px 10px 0px rgba(50, 50, 50, 0.1);
    }
    #menu{min-height:60px;border:none;}
    #top #informacio{background:#fff;}
    #top #informacio ul li a{color:#01387C;}

    #box_menu .sf-menu ul{
        box-shadow: none;
    }
    #box_menu ul.menu-principal ul{float:none;width:100%;background:none;}
    #box_menu ul.menu-principal ul ul{margin:0;padding:0;width:100%;}
    #box_menu .sf-menu a {
        border-top:none;
        border-left:none;
        margin:0;
        padding: 10px 15px;
        border-bottom:1px solid rgba(0, 0, 0, 0.15);
        background:none !important;
        font-family: 'Open Sans', sans-serif;
        color:#fff;
        font-size:15px;
        line-height:24px;
        width:100%;
    }
    #menu ul.menu-principal > li > a{color:#fff;padding-top:14px;padding-bottom:14px;}
    #menu ul.menu-principal > li:first-child a{padding-left:15px;}
    #box_menu .sf-menu a:hover {
        background:none !important;color:#000 !important;
    }
    #box_menu{background:#009763;}
    #menu li li{
        background: rgba(0, 0, 0, 0.15);
    }
    #box_menu .sf-menu li li a{
        line-height:53px;
        min-height:53px;
        padding-top:0 !important;
        padding-bottom:0 !important;
    }

    #box_menu .sf-menu li a{padding-left:20px;}
    #box_menu .sf-menu li li a{padding-left:40px;}
    #box_menu .sf-menu li li li a{padding-left:60px;}

    h1.titol_nav{font-size:22px;line-height:48px;margin:0;padding:0;color:#fff;margin:5px 10px;text-transform:uppercase;}
    #mobnav-btn {
        font-size:20px;
        cursor:pointer;
        margin:5px;
        float:right;
    }
    #mobnav-btn i.fa-square{color:#009763;}
    .mobnav-subarrow {
        position:absolute;
        top:0;
        right:0;
        z-index:10000000;
        font-size:20px;
        padding:0 15px;
        line-height:44px;
        background: rgba(0, 0, 0, 0.15);
        height:53px;
        width:53px;
        text-align:center;
        cursor:pointer;
    }
    .mobnav-subarrow i{
        color:#fff;
        font-size:24px;
        line-height:53px;
    }
    .sf-menu {
        width: 100%!important;
        display: none;
        margin:0;
    }
    .sf-menu.xactive {
        display: block!important;
    }
    .sf-menu li {
        float: none!important;
        display: block!important;
        width: 100%!important;
    }
    .sf-menu li a {
        float: none!important;
    }
    .sf-menu ul {
        position:static!important;
        display: none!important;
    }
    .xpopdrop > ul {
        display: block!important;
    }

    /* Superfish */
    /*** ESSENTIAL STYLES ***/
    .sf-menu, .sf-menu * {
        margin: 0;
        padding: 0;
        list-style: none;
    }
    .sf-menu li {
        position: relative;
    }
    .sf-menu ul {
        position: absolute;
        display: none;
        top: 100%;
        left: 0;
        z-index: 99;
    }
    .sf-menu > li {
        float: left;
    }
    .sf-menu li:hover > ul,
    .sf-menu li.sfHover > ul {
        display: block;
    }

    .sf-menu a {
        display: block;
        position: relative;
    }
    .sf-menu ul ul {
        top: 0;
        left: 100%;
    }


    /*** DEMO SKIN ***/
    .sf-menu {
        float: left;
        margin-bottom: 1em;
    }
    .sf-menu ul {
        min-width: 12em; /* allow long menu items to determine submenu width */
        *width: 12em; /* no auto sub width for IE7, see white-space comment below */
    }
    .sf-menu a {
        border-left: 1px solid #fff;
        border-top: 1px solid #dFeEFF; /* fallback colour must use full shorthand */
        border-top: 1px solid rgba(0,0,0,.5);
        padding: .75em 1em;
        text-decoration: none;
        zoom: 1; /* IE7 */
    }
    .sf-menu a {
        color: #13a;
    }
    .sf-menu li {
        white-space: nowrap; /* no need for Supersubs plugin */
        *white-space: normal; /* ...unless you support IE7 (let it wrap) */
        -webkit-transition: background .2s;
        transition: background .2s;
    }
    .sf-menu ul li {
    }
    .sf-menu ul ul li {
    }
    .sf-menu li:hover,
    .sf-menu li.sfHover {
        /* only transition out, not in */
        -webkit-transition: none;
        transition: none;
    }

    /*** arrows (for all except IE7) **/
    .sf-arrows .sf-with-ul {
        padding-right: 2.5em;
        *padding-right: 1em; /* no CSS arrows for IE7 (lack pseudo-elements) */
    }
    /* styling for both css and generated arrows */
    .sf-arrows .sf-with-ul:after {
        content: '';
        position: absolute;
        top: 50%;
        right: 1em;
        margin-top: -3px;
        height: 0;
        width: 0;
        /* order of following 3 rules important for fallbacks to work */
        border: 5px solid transparent;
        border-top-color: #000; /* edit this to suit design (no rgba in IE8) */
        border-top-color: rgba(0,0,0,.5);
    }
    .sf-arrows > li > .sf-with-ul:focus:after,
    .sf-arrows > li:hover > .sf-with-ul:after,
    .sf-arrows > .sfHover > .sf-with-ul:after {
        border-top-color: white; /* IE8 fallback colour */
    }
    /* styling for right-facing arrows */
    .sf-arrows ul .sf-with-ul:after {
        margin-top: -5px;
        margin-right: -3px;
        border-color: transparent;
        border-left-color: #dFeEFF; /* edit this to suit design (no rgba in IE8) */
        border-left-color: rgba(0,0,0,.5);
    }
    .sf-arrows ul li > .sf-with-ul:focus:after,
    .sf-arrows ul li:hover > .sf-with-ul:after,
    .sf-arrows ul .sfHover > .sf-with-ul:after {
        border-left-color: black;
    }


}


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

}

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

}