/*
Theme Name: GDG Gabinet Disseny Gràfic
Theme URI: https://gdg.cat
Author: GDG
Author URI: gdg.cat 
Description: Web corporation 
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: Gabinet Disseny Grafic, Agència Publicitat, Web i Branding Girona
*/

/* INPUT FILE */

/*input[type="file"] {
    display: none;
}

.custom-file-label{background-color:#22CBFF; color:white !important; padding:10px 20px; width: 120px;}*/


/*SIZES*/
h1{font-size: 2em}
h2{font-size: 1.6em}
h3{font-size: 1.45em;}
h4{font-size: 1.2em;}
.bold{font-weight: bold;}
/**/
.whiteBkg{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #ffffff;
    padding: 50px;
    box-shadow: 0px 0px 10px 5px #ccc;
    width: 600px;
    max-width: 90%;
}

.login_form{display: flex; flex-direction: column; padding:0 30px;}
.login_form_item{width: 100%;}
.login_form input{width:515px; max-width: 100%; margin:10px auto; padding: 10px;}
.login_form button{width: 100%; margin:10px auto; padding: 10px; border:0; background-color:#db1a1a; color:white;}
.login_form_logo{display: flex; width:70%; margin:0 auto; }
.whiteBkg h1{margin: 50px 0 10px 0;}

.alert-danger{background-color: #c74242;
    padding: 5px;
    color: white;
    text-align: center;}


.defaultCurriculumFileLabel{margin:0; padding:20px;}
.activeCurriculumFileLabel{margin:0; padding:20px;}
.c-form form .item-button-file input[type=file]{
    appearance: none;
    display: inline-block;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 70px;
    top: 0;
    left: 0;
    opacity: 0;
    cursor: pointer;
}

.c-form form .item-button-file .item-label{
    position: relative;
    z-index: 0;
    display: inline-block;
    width: 300px;
    cursor: pointer;
    font-weight: bold;
    background-color: #22CBFF;
    border-radius: 3px;
    color: white;
   /* background-image: url(../assets/img/icon-upload.svg);*/
    background-position: 98% center;
    background-repeat: no-repeat;
}

.custom-file-label{display: none;}

.dropify-wrapper .dropify-message p{
    font-size:20px;
}
.c-form input[type=submit]{margin-top: 10px;}

.success {
    text-align: center;
    margin-bottom: 30px;
    background-color: #22CBFF;
    color: white;
    padding: 10px;
    width: 100%;
}

.work_mail_recaptcha{
    text-align: center;
    margin-bottom: 30px;
    background-color: #D19026;
    color: white;
    padding: 10px;
    width: 100%;
}

.work_mail_error{
    text-align: center;
    margin-bottom: 30px;
    background-color: #C1492B;
    color: white;
    padding: 10px;
    width: 100%;
}

.mobile_video{display: none;}

.embed-container_desktop { position: relative; padding-bottom: 43.25%; height: 0; overflow: hidden; max-width: 100%; }
.embed-container_desktop iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.embed-container_mobile { position: relative; padding-bottom: 78.25%; height: 0; overflow: hidden; max-width: 100%; }
.embed-container_mobile iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.post-separator-container {
    margin-top: 20px;
    margin-bottom: 45px;
    position: relative;
}

.post-separator-line {
    height: 1px;
    background-color: #22CBFF;
}

.post-separator-plus {
    position: absolute;
    margin: -10px auto auto;
    padding-left: 10px;
    padding-right: 10px;
    width: 40px;
    overflow: hidden;
}

.post-separator-plus>div {
    margin: auto;
    color: #22CBFF;
    border: 1px solid #22CBFF;
    width: 20px;
    height: 20px;
    line-height: 16px;
    border-radius: 50px;
    font-size: 18px;
}

.blog-widget {
    /*margin-top: 36px;*/
    margin-left:30px;
}

.blog-widget>ul {
    margin-top: 10px;
    margin-left: 0;
    padding-left: 0;
}

.blog-widget li {
    padding-left: 10px;
}

.blog-widget>ul>li>a {
    font-family: Roboto;
    font-size: 14px;
    color: #000;
    cursor:pointer;
}
.blog-widget>ul>li>a:hover {
    color: #22CBFF;
}
.blog-widget>span {
    font-family: Roboto;
    font-size: 19px;
}
#main-menu ul, .blog-widget>ul {
    list-style: none;
}

.blog-widget>ul>li:before {
    content: "-";
    padding-right:10px;
}

.list-inline li{
    display: inline;
}

.sep2 li{margin-right:2em !important;}
.mt50{margin-top:50px;}
.tag{color: #337ab7;}
.tagList{padding:0;}
.tagList li{margin-right:10px;}



#map{height:400px !important;}
.sac{align-self: center;}
.news a{text-decoration: none !important;}
.post-date{font-weight: bold;}
.newsReadMore{color:#337ab7;}
.footer-mobile{display: none;}
.footer-tablet{display: none;}
.footer-mobile .footer__address ul{list-style: none;}
.footer-mobile h4{display: inline; font-family: Roboto, sans-serif; font-size: 20px; font-weight: 400}
.footer-mobile a{text-decoration: none; text-align: center;}
.footer-mobile figure img{margin-left: auto; margin-right:auto;}
.footer-mobile .footer__address{text-align: center;}
.footer-mobile ul{ padding: 0;}
.footer-mobile .footer__grid{margin-bottom:50px;}
.footer-mobile .c-social{margin-bottom:10px;}
.footer-mobile .footer__container{width:95%; max-width:2560px; margin-right: auto; margin-left: auto;}

.legalMenu{display: flex; flex-wrap: wrap; width: 100%; justify-content: center;  margin:10px 0; margin-top: 30px;}
/*.legalMenu::after{content:''; flex-grow: 1;}*/
.legalMenuItem{width: 140px; max-width: 100%; text-align: center;}
.legalMenuItem a{color: white; font-size: 15px;}

.desktop-width{padding:0 7vw;}
.accordion-container{position:relative; width: 100%;}

.accordion {
    background-color: #ffffff;
    color: #444;
    cursor: pointer;
    padding: 18px;
    padding-top:0;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
}
.accordion h4{text-align: center;}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
    background-color: #ffffff;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
    background-color: white;
    display: none;
    overflow: hidden;
    position: absolute;
    z-index: 100;
    width: 100%;
    padding:0;
    padding-left: 20px;
    padding-bottom:15px;
}
.panel-first{display: block;}
.panel ul{
    list-style: none;
    text-align: left;
    margin-bottom: 0 !important;
}

button.accordion:after {
    content: '\002B';
    color: #777;
    font-weight: bold;
    float: right;
    margin-left: 5px;
    margin-top:5px;
}
.sidebar-news ul a{
    text-decoration: none;
}

.post-body{display: flex; flex-wrap: wrap; gap: 20px; margin: 50px 0;}
.asc{align-self: center;}

.footer-tablet .footer__grid{
    display: flex;
    flex-wrap: wrap;
    gap:50px;
}
.footer-tablet .footer__column{
    flex: 1;
    padding: 20px;
    min-width: 150px;
    position: relative;
}

.footer .footer__column{
    min-width: 250px !important;
}

.footer-tablet .footer__column::after {
    content: "";
    display: block;
    position: absolute;
    right: -5%;
    top: 5%;
    height: 70%;
    width: 1px;
    background-color: #1D1D1B;
}

.footer-tablet ul { list-style:none; }
.footer-tablet ul a { text-decoration:none; }
.footer-tablet h4 a{text-decoration: none;}
.footer-tablet h4{font-weight: 400;}
.footer-tablet .accordion h4{display: inline; font-weight: 400;}
.footer-tablet h5 a{text-decoration: none;}
.footer-tablet .accordion h5{display: inline; font-family:Roboto, sans-serif;  font-weight: 400;}
.footer-tablet .footer__bottom{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.footer-tablet .footer__container{width:95%; max-width:2560px; margin-right: auto; margin-left: auto;}
.footerLogos{margin: 15px;}



/*GPRecambios*/


/*MARGINS*/
.m80{margin:80px 0;}
.m30{margin:30px 0;}
.mb30{margin-bottom:30px;}
.mt30{margin-top:30px;}

/*HEADER*/


.social_icon{color: white;}
#header{
    background-color:#1c1c1c;
    padding:15px 50px;

}

.header__logo{align-self: center;}
.header__logo img{width: 280px; max-width:100%;}
.header .header__column--right{align-self: center; flex-direction: column;}

.hidden_search_form{opacity:0; visibility: hidden; display: none; position: absolute; top: 143px; background-color: #1d1d1b; width: 30%; right: 0; transition:visibility 0.3s linear,opacity 0.3s linear;}
.search-form{padding:10px; display: flex; justify-content: center; margin:0 20px;}
.customInput{flex-grow: 1; padding:5px; border:0; color: black; margin: 0 10px; }
.customInput:focus {outline: 0;}
.search-button{background-color: #b82828; padding: 8px; border:0; color: white;}
.trigger_search{cursor: pointer;}
#search_trigger_btn{cursor: pointer;}
#search_trigger_btn i{color: white;}
.fa-search{padding:13px 0; float: none !important;}

.c-menu-topbar{display: flex; flex-wrap:wrap;}
.c-menu-topbar{margin-bottom: 15px; margin-right: 42px;}
.c-menu-topbar__list{display: inline; color: white; align-self: center; margin:0; padding: 0;}
.c-menu-topbar__list li{display: inline; margin:0 5px;}
.c-menu-topbar .fa-phone{border:solid 1px white; padding:7px; border-radius: 100%;}
.c-menu-topbar .call-action-item{padding: 0 10px; align-self: center;}
.c-menu-topbar .menu-call-action{color: white; background: linear-gradient(-65deg, transparent 14%, #cf3126 11%, #530303 90%, transparent 90%); padding: 5px 35px; display: flex;}
.c-menu-topbar .call-action-content p{margin:0; padding: 0; font-size:12px; font-weight: bold;}

.diagonal{border-top: 1px solid rgb(255 255 255);transform: rotate(-60deg);transform-origin: left;display: block;width: 55px;top: 15px;position: absolute; padding:15px}
.c-menu .c-menu__list > li{margin: 0 0.2em; align-self: center;}

.c-menu a{ color:white;}
.c-menu .fa-phone{border:solid 1px white; padding:7px; border-radius: 100%;}
.c-menu .call-action-item{padding: 0 10px; align-self: center;}
.c-menu .menu-call-action{color: white; background: linear-gradient(-65deg, transparent 14%, #cf3126 11%, #530303 90%, transparent 90%); padding: 5px 35px; display: flex;}
.c-menu .call-action-content p{margin:0; padding: 0; font-size:12px;}

/*INTRO*/
.intro{
    background-color: #9b3030;
    color: white;
    padding: 50px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.intro_col{
    width: 45%;
    padding: 10px;
}

/*HOME CATEGORIES*/
/*HOME*/
.banner_body{font-size: 85px;font-weight: 500;text-transform: uppercase;width: 600px; max-width: 100%; margin-bottom: 20px;}
.banner_title{text-transform: uppercase;}
figcaption .banner_btn{ border: solid 1px white; padding: 10px 50px; color: white;text-decoration: none;}
/**/
.family_link{width: calc(20% - 10px); background-color: #f0f0f0; margin:5px; text-align: center; padding: 45px; position: relative; text-decoration: none; border: solid 10px #f0f0f0;}
.extra_family{width: calc(16.6% - 10px);}
.family_link:hover{background-color:#530303; transition:0.5s; color:white; cursor:pointer; border: solid 10px #b82828;}
.img_icon_negative{display: none;}
.family_link:hover .img_icon_negative{display: block;}
.family_link:hover .img_icon{display: none;}


.families_item{/*width: 20%; background-color: #f0f0f0; margin:5px; text-align: center; padding: 45px; position: relative;*/}
.families_item:hover{/*background-color:#530303; transition:0.5s; color:white; cursor:pointer; border: solid 10px #b82828;*/}
.families_item a{text-decoration: none;}
.families_link:hover {color: white;}
.families_link:hover h4{color: white;}
.img_icon_negative{display: none;}
/*.families_item:hover .img_icon_negative{display: block;}
.families_item:hover .img_icon{display: none;}*/
.families_item img{margin-right: auto; margin-left: auto;}
.families{ display: flex;
    flex-wrap: wrap;
    justify-content: center;}
.sectionTitle h1{text-align:center; margin:50px 0;}

/* EXPERIENCIAS */
.experiencias{width: 100%; padding:150px 0; background-color:#530303; text-align: center; color: white;background-image: url('../images/home/experiencias.jpg');background-size: cover;}
.experiencias h1{font-size: 60px;}
.experiencias img{margin-left: auto; margin-right: auto; margin-bottom: 20px;}
.experiencias_img{width: 200px; max-width: 100%;}

/*NEWS*/
.news{display: flex; flex-wrap: wrap; justify-content: center; margin:0 5vw;}
.news_item{width: 30%; margin: 10px; display: flex; flex-direction: column; flex-grow: 1; justify-content: space-between;}
.news_item p{margin:0;}
.news_item img{width: 100%; margin-bottom: 15px;}
.news_date{color: #530303; font-weight: bold;}
.newsImage img{/*width: 800px;*/ margin-right: auto; margin-left: auto; max-width: 100%;}
.btn_read_more{border:1px solid #ccc; padding: 5px 20px; align-self: flex-start;}
.news_title{display: flex; margin: 30px 0;}
.news_title h2{margin-left: 20px; align-self: center;}
.news_detail_info{margin: 30px 0;}
.news_detail_title_section{margin: 30px 0;}


/*FOOTER*/
/*---MARCAS*/
.marcas_compatibles{background-color: #f0f0f0; text-align: center; padding: 50px 50px 20px 50px;}
.marcas{ display: flex; flex-wrap: wrap; justify-content: center; width: 1200px; max-width: 100%; margin-left: auto; margin-right: auto;}
.marca_item{width: calc(12% - 10px); margin:5px;}
.marca_item img{width: 100%;}
/*---FOOTER PRODUCTS*/
footer{color: white;}
.footer_products{display: flex; flex-wrap: wrap; justify-content: space-evenly;}
.footer_products_col{width: 48%;}
.footer_products_list{display: flex; flex-wrap: wrap; padding: 0 50px;}
.footer_products_list ul{
    column-count: 2;
}
.footer_products_list ul li{
    margin-right: 15px;
}
.footer_products_list ul>li>p{margin: 0; padding: 0;}
.footer_products_list .first{margin-right: 30px;}
.footer_title{color: #b82828; text-align: center; }
.colored{color: #b82828; }
.separator{width: 100%; height: 2px; border-bottom: 1px solid #b82828; margin-bottom: 15px;}
/*---FOOTER*/
.footer{
    background-color:#1c1c1c;
    padding:30px 50px;
    color:white;
}
.footer p{font-size: 14px;}
.footer_grid{display: flex; flex-wrap: wrap; justify-content: center;}
.footer_col{width: 20%; margin: 0 20px;}
.footer_col_1{width: 30%; margin: 0 20px;}
.footer_col_2{width: 10%; margin: 0 20px;}
.footer_col_3{width: 15%; margin: 0 20px;}
.footer_col_4{width: 20%; margin: 0 20px;}
.footerLinks li a{color: white;}
.footer_text{padding: 0 20px; font-size: 14px;}
.footer_logo{width: 200px; max-width: 100%; margin-bottom: 15px;}
.footer_social{margin-bottom: 20px !important;}
.footer_social i{color: white}
.footer_social ul{display: inline; list-style: none;}
.footer_social li{display: inline; margin:0 5px;}
.footer input{ background-color: #b82828; color: white; padding:10px 20px; border:none;}
.footer ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: white;
    opacity: 1; /* Firefox */
}

.footer :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: white;
}

.footer ::-ms-input-placeholder { /* Microsoft Edge */
    color: white;
}

.popular_footer_products_list ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
}

.popular_footer_products_list ul li{
    width:40%;
    margin:0 20px;
}

.popular_footer_products_list ul li a{
    text-decoration: none;
}

.popular_footer_products_list ul li a:hover,
.popular_footer_products_list ul li a:focus{
    text-decoration: underline;
}

.newsletter{display: flex; width: 100%;}
.newsletter_email{flex-grow: 1; width: 100%; margin-right: 10px;}
.newsletter_submit{width: 20%;}

/*PRODUCTS*/

.banner_products{background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/productos/banner_productos.jpg'); background-size: cover; height:400px; position: relative; background-position:center;}
.banner_products h1 {color:white;position: absolute; bottom: 10px; left:50px; font-size: 50px;}
.breadcrumb{background-color: #b82828; color: white; padding: 7px 50px;}
.breadcrumb p{margin:0;}
.breadcrumb a{color: white; text-decoration: none;}
.breadcrumb a:hover{color: black; text-decoration: dotted; text-decoration-color: rgba(255,255,255,.5)}
.products_list{display: flex; flex-wrap: wrap;}
.products_list_col_1{width: 20%; margin-right: 15px;}
.products_list_col_2{width: 75%;}
.productInfo{/*display: flex; flex-wrap: wrap; justify-content: space-around;*/ margin: 20px 0;}
.productInfo p{margin:0;}
.productInfo p .span_iva{font-size: 80%;}
.grid {display:flex; flex-wrap: wrap; justify-content: flex-start; align-items: stretch;}
.grid .products_grid_item{width: 25%; /*align-self: end;*/ margin: 20px 30px; padding:10px;position: relative;}
.grid .products_grid_item:hover{border:solid 1px #ccc; }
.product_info_col.product_info_col_1{width: 50%;}
.product_info_col.product_info_col_2{width: 50%;display: flex; flex-direction: column; align-items: end}
.btn_prod_detail{background-color: #b82828;padding: 7px 20px;text-decoration: none; color: white; margin: 10px 0;}
.prod_separator{width: 100%; height: 2px; border-bottom: 1px solid #ccc; margin: 15px 0; position: absolute; bottom: -16px; left:0;}
.prod_detail_separator{width: 100%; height: 2px; border-bottom: 1px solid #ccc; margin: 15px 0;}
.discontinued{
    display: inline-block;
    background-color: #b82828;
    color: white;
    padding: 0 10px;
    margin-left: 10px;
    font-size: 80%;
}

.detail_title_section .discontinued{
    margin-left: 0;
    margin-top: 10px;
}
.product_description{display: none;}
.layout_select{margin-left: auto;}
.layout_select i{cursor:pointer;}
.products_grid.grid.grid_elements_2{justify-content: flex-start;}
.mlgrid .products_grid_item{margin-left:auto;}

.layout_select{float: right;}
.layout_select{display: inline;}
.layout_select{align-self: end; margin-bottom: 12px;}

.column_grid{}
.column_product_info{}
.product_detail_header{display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%;}
.detail_layout_select{align-self: end;margin-bottom:15px;}

.product_detail_content{display: flex; flex-wrap: wrap; justify-content: space-between;}
.product_detail_content figure{width: 50%; padding: 0 20px; align-self: end;}
.product_detail_content .product_detail_info{width: 50%; padding:0 20px; align-self: end;}
.product_detail_content p{margin: 0}

.detail_extra{display:flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 50px;}
.detail_extra_col{width: 50%; padding: 0 20px;}

.gallery img { width: 150px;}
.gallery{display: flex;flex-wrap: wrap;}

.detail_product_title{font-size:30px;}

.related_products{display: flex; flex-wrap: wrap;}
.related_product{width: 25%; margin: 0 20px; padding: 15px;}

.title_separator {width: 100%; height: 2px; border-bottom: 1px solid #000000; margin-bottom: 25px;}

.detail_title_section{display: flex; flex-wrap: wrap;}
.detail_title{width: 70%; margin-bottom: 5px !important;}
.detail_navigation{margin-left: auto;}

.bordered{border:solid 1px #ccc; padding: 5px 10px; margin: 0 2px;}

.transparent_link{margin-bottom: -40px !important; width: 80% !important; height: 40px; opacity:0 !important; cursor: pointer }
.s3-parts:hover + .s3-parts-btn{color: #b82828 !important;}
.chasis:hover + .chasis-btn{color:#b82828 !important;}
.motor:hover + .motor-btn{color:#b82828 !important;}
.fibra-de-carbono:hover + .fibra-de-carbono-btn{color:#b82828 !important;}
.parte-electrica:hover + .parte-electrica-btn{color:#b82828 !important;}
.recambio-clasicas:hover + .recambio-clasicas-btn{color:#b82828 !important;}
.gpr-parts:hover + .gpr-parts-btn{color:#b82828 !important;}
.sil-lubricants-motoline:hover + .sil-lubricants-motoline-btn{color:#b82828 !important;}

.turbo-progress-bar {
    height: 5px;
    background-color: #b82828;
}

.dropdown-btn{font-weight: bold;}
.sidenav{overflow:hidden; height: auto;}

.sidenav .dropdown-container{display: none;}
.sidenav .dropdown-container.on{display: block !important;}
.sidenav .dropdown-container.off{display: none !important;}

.sidenav .mobile_dropdown-container.on{display: block !important;}
.sidenav .mobile_dropdown-container.off{display: none !important;}

.servicios{width: 100%; padding:150px 0; background-color:#530303; text-align: center; color: white;background-image: url('../images/productos/servicios.jpg');background-size: cover; background-position: center;}
.servicios h1{font-size: 60px;}
.servicios img{margin-left: auto; margin-right: auto; margin-bottom: 20px;}
.servicios_img{width: 300px; max-width: 100%;}

.d-flex{display: flex;}
.spinnerMinus{ cursor:pointer; margin: 0 10px; /*border-radius: 100%;*/ border: 0; background-color: #2c2c2c; color: #ffffff; font-weight: bold; padding: 5px 12px; font-size: 18px;}
.spinnerMinus:hover{ color: #b82828;}
.spinnerPlus{ cursor:pointer; margin: 0 10px; /*border-radius: 100%;*/ border: 0; background-color: #2c2c2c; color: #ffffff; font-weight: bold; padding: 5px 12px; font-size: 18px;}
.spinnerPlus:hover{ color: #b82828;}
.spinnerMinusDetail{ cursor:pointer; margin: 0 10px; /*border-radius: 100%;*/ border: 0; background-color: #2c2c2c; color: #ffffff; font-weight: bold; padding: 5px 12px; font-size: 18px;}
.spinnerMinusDetail:hover{ color: #b82828;}
.spinnerPlusDetail{ cursor:pointer; margin: 0 10px; /*border-radius: 100%;*/ border: 0; background-color: #2c2c2c; color: #ffffff; font-weight: bold; padding: 5px 12px; font-size: 18px;}
.spinnerPlusDetail:hover{ color: #b82828;}

.cart_table .cart_table_product_row #numProduct{
    min-width: 27px;
    text-align: center;
}

#numProduct{align-self: center;}
.cartControls{display: flex; }
.btnAfegir{  margin: 0 10px; background-color: #b82828; padding: 5px 20px; color: white; font-weight: 500; cursor: pointer;}

/*CART*/
.cart_table {width: 100%;}
.cart_table th{text-align: left;}

.cart_table .cart_table_head {

}

.cart_table .cart_table_product_row {

}

.cart_table .cart_table_mobile_title,
.orders_table .order_table_mobile_title,
.orders_table .order_table_mobile_price {
    display:none;
}

.cart_table .cart_table_actions {

}






.btnRecalcular{background-color: #b82828; border: 0; padding: 10px 20px; color: white;}
.btnComanda{background-color: #1d1d1b; border: 0; padding: 10px 20px; color: white;}


/*CONTACT*/

.banner_contact{background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/contacto/contacto_banner.jpg'); background-size: cover; height:400px; position: relative; background-position:center;}
.banner_contact h1 {color:white;position: absolute; bottom: 10px; left:50px; font-size: 50px;}
.contact_form{display: flex; flex-wrap: wrap; justify-content: center;}
#contact_form input{width:100%; margin: 10px; padding: 10px; border:none; background-color: #f3f3f3;}
#contact_form textarea{width:100%; margin: 10px; padding: 10px; border:none; background-color: #f3f3f3;}
input#contact_checkbox{width: 20px;height: 20px; display: inline;}
.checkbox p{display: inline; align-self: center;}
.btn_enviar{background-color: #b82828 !important; width: 150px !important; float: right;}
.contact_form .checkbox{display: flex;}
.checkbox p{margin: 0;}

/*NEWS*/

.banner_news{background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/noticias/noticias_banner.jpg'); background-size: cover; height:400px; position: relative; background-position:center;}
.banner_news h1 {color:white;position: absolute; bottom: 10px; left:50px; font-size: 50px;}
.news_list{display: flex; flex-wrap:wrap; justify-content: center;}
.noticia_grid_item{width: 30%; margin: 10px; position: relative;}
.noticia_date { background-color: #b82828; color: white; width: 60px; text-align: center; margin: 5px 0; padding-top: 10px; padding-bottom: 10px;}
.date_day{font-size: 24px; font-weight: bold; margin:0}
.date_month{font-size: 13px; margin: 0; margin-top: -10px;}
.noticiaInfo{display: flex; justify-content: space-between; margin: 10px 0;}
.noticia_info_col_1{ width: 16%; }
.noticia_info_col_2{ display: flex;flex-direction: column;justify-content: center; align-items: end; width: 70%; text-align: right; }
.noticia_info_col_2 p{ margin-bottom:10px; }
.btn_news_detail{text-decoration: none; border: solid 1px #ccc; padding: 5px 10px;font-size: 13px;}
.news_frame{display: flex;}
.news_frame_col{margin: 0 15px;}
.news_frame_col_1{width: 20%;}
.news_frame_col_2{width: 75%;}
.news_separator{width: 100%; height: 2px; border-bottom: 1px solid #ccc; margin: 15px 0; position: absolute; bottom: -20px;}

/*GALLERY*/

.banner_gallery{background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/galeria/galeria_banner.jpg'); background-size: cover; height:400px; position: relative; background-position:center;}
.banner_gallery h1 {color:white;position: absolute; bottom: 10px; left:50px; font-size: 50px;}
.gallery_list{display: flex; flex-wrap: wrap;}
.gallery_grid_item{width: 30%; margin: 10px; position: relative;}
.gallery_separator{width: 100%; height: 2px; border-bottom: 1px solid #ccc; margin: 15px 0; position: absolute; bottom: -20px;}
.imageGalleryInfo { margin: 10px 0;}
.galleryImg:hover{cursor: pointer;}


/*COMPANY*/
.banner_company{background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/company/company_banner.jpg'); background-size: cover; height:400px; position: relative; background-position:center;}
.banner_company h1{color:white;position: absolute; bottom: 10px; left:50px; font-size: 50px;}
.company_frame{display: flex;}
.company_frame_col{margin: 0 15px;}
.company_frame_col_1{width: 20%;}
.company_frame_col_2{width: 75%;}



/*TEST HEADER MENU*/

.header_menu nav {
    display: flex;
    justify-content: center;
}

.header_menu ul {
    list-style: none;
    margin: 0;
    padding-right: 42px;
}

.header_menu nav > ul > li {
    display: inline-block;
    float: left;
    box-sizing: border-box;
    min-width: 60px;
    margin-top: 5px;
    margin-bottom: 0 !important;
    text-align: center;
}

.header_menu li{
    margin-bottom: 0 !important;
}

.header_menu .hidden li{
    position: relative;
}

.header_menu a {
    text-decoration: none;
    border-right: 1px solid white;
    display: block;
    color: white;
    min-width: 100px;
    padding: 13px 15px;
    text-align: center;
    font-size: 14px;
    box-sizing: border-box;
}
.header_menu .hidden a{
    border:none;
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

.header_menu .last_hidden_item{
    border-bottom: solid 10px white;
}

.header_menu .first_header{
    border-left: solid 1px white;
}

.header_menu a:hover {
    /*background-color: #f93e3e; */
    color: #b82828;
}
.header_menu .dim:hover{
    opacity:1;
    transition: none;
}

.header_menu nav > ul > li > a { transform: skew(-20deg); }

.header_menu nav > ul > li > a > span {
    display: block;
    transform: skew(20deg);
}

.header_menu .hidden li:nth-child(odd) a {
    transform: skew(-25deg);
    /*background-image: linear-gradient(185deg, rgba(0,0,0,0.5), #2d3f56 30%)*/
    background-color: #b82828;
    color: white;
}

.header_menu .hidden li:nth-child(even) a {
    transform: skew(-25deg);
    /*background-image: linear-gradient(175deg, rgba(0,0,0,0.5), #2d3f56 30%)*/
    background-color: #b82828;
    color: white;
}

.header_menu .hidden li:nth-child(odd) a:hover {
    background-color: #530303;
}

.header_menu .hidden li:nth-child(even) a:hover {
    background-color: #530303;
}

.header_menu .hidden li:nth-child(even) span {
    display: block;
    transform: skew(25deg);
}

.header_menu .hidden li:nth-child(odd) span {
    display: block;
    transform: skew(25deg);
}

.header_menu .hidden li:nth-child(even) a, .header_menu .hidden li:nth-child(odd) a  {
    position: relative;
    left: -5px;
    min-width: 200px;
    white-space: nowrap;
    width: 100%;
}

.header_menu .hidden { display: none; position: absolute; }

.header_menu .hidden li > a { position: absolute; text-align: left;}

.header_menu .hidden_item_last:after{
    content: "";
    position: absolute;
    height: 8px;
    background-color: white;
    transform: skew(-25deg);
    width: 100%;
    left:-18px;
}


.header_menu a .cartBadge,
.c-btn-menu-mobile a .cartBadgeMobile {
    background-color: red;
    padding: 0px 8px 0px 7px;
    font-size: 12px;
    font-weight: bold;
    border-radius: 20px;
    position: absolute;
    transform: translate(-10px, -10px);
    text-align: center;
    opacity: 0;
}

.header_menu a .cartBadge.visible,
.c-btn-menu-mobile a .cartBadgeMobile {
    opacity:1 ;
}

.header_menu a:hover .cartBadge,
.c-btn-menu-mobile a:hover .cartBadgeMobile {
    color: white;
}

/*END TEST HEADER MENU*/




/*MOBILE*/

/*MENU MOBILE*/

.zeynep .c-search {
    padding: 0 20px 5px 20px;
}

.c-search form {
    max-width: 100%;
    margin-left: 0;
}

.c-search--long form legend {
    width: 1060px;
    position: relative;
    max-width: 90%;
    margin: 2em auto 1em;
}

.c-search form legend input {
    padding: 10px 5px 10px 30px;
    width: 100%;
    border-radius: 5px;
    border: 0;
    outline: 0;
    background-color: #e7e7e7;
    color: black;
}
.c-search--long form legend input {
    max-width: 100%;
    padding-left: 40px;
}
.c-search button {
    background-color: transparent;
    padding: 0;
    border: 0;
    border-radius: 0;
    color: inherit;
    line-height: inherit;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    text-decoration: none;
}
.c-search form legend button {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(8px, -50%);
    cursor: pointer;
}

.zeynep.right {
    left: auto;
    right: 0;
}

.zeynep.right:not(.opened) {
    transform: translateX(100%);
}

.zeynep {
    background-color: #ffffff;
    color: black;
    width: 295px;
}

.zeynep ul{
    list-style-type: none;
    padding: 0;
    padding-left: 10px;
    margin:30px 0 100px 0;
}

.zeynep .c-search {
    padding: 0 20px 5px 20px;
}
.zeynep ul > li {
    display: block;
    text-transform: uppercase;
}

.zeynep ul > li {
    display: block;
    text-transform: uppercase;
}

.zeynep ul > li.has-submenu > a {
    background-image: url(../images/submenu-arrow.svg);
    background-position: right 20px center;
    background-repeat: no-repeat;
    background-size: 8px 14px;
}

.zeynep ul > li > a {
    color: black;
    display: block;
    font-size: 15px;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
    transition: all 150ms;
    font-weight: 400;
}

.zeynep .submenu {
    background-color: #ffffff;
    left: 295px;
    z-index:1;
}

.zeynep .submenu {
    bottom: 0;
    min-height: 100%;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
    pointer-events: none;
    position: fixed;
    top: 0;
    width: 100%;
}

.zeynep .submenu-header {
    background-image: url(../images/menu-back.svg);
    background-position: left 20px center;
    background-repeat: no-repeat;
    background-size: 8px 14px;
    cursor: pointer;
    position: relative;
    margin-top: 19px;
    padding-left: 10px;
    margin-left: 10px;
}

.zeynep .submenu-header > a {
    color: black;
    display: block;
    font-size: 15px;
    padding: 5px 20px;
    padding-left: 30px;
    text-decoration: none;
}

.zeynep .submenu-header > a:before {
    background-image: url(../images/submenu-arrow.svg);
    background-position: right 20px center;
    background-repeat: no-repeat;
    background-size: 8px 14px;
    content: "";
    height: 100%;
    left: 26px;
    position: absolute;
    top: 0;
    transform: rotate(-180deg);
    width: 20px;
}

.zeynep .submenu > label {
    color: #b82828;
    display: block;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 19px;
    margin-top: 19px;
    opacity: 1;
    padding-left: 30px;
    width: 100%;
}

.header .c-btn-menu-mobile .item-burger {
    background: transparent;
    margin: 0px;
    z-index: 99;
    padding: 0;
}
.is-active .c-btn-menu-mobile .item-navicon {
    cursor: pointer;
    display: block;
    width: 42px;
    height: 2px;
    background: white !important;
    position: relative;
}
.is-active .c-btn-menu-mobile .item-navicon::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: white !important;
    top: 12px;
    border-radius: 15px;
    position: absolute;
    transition: all 0.3s ease-in-out;
}
.is-active .c-btn-menu-mobile .item-navicon::after {
    content: "";
    border-radius: 15px;
    display: block;
    width: 100%;
    height: 100%;
    background: white !important;
    top: -12px;
    position: absolute;
    transition: all 0.3s ease-in-out;
}

.header  .c-btn-menu-mobile .item-navicon {
    cursor: pointer;
    display: block;
    width: 42px;
    height: 2px;
    background: #b82828;
    position: relative;
}
.header  .c-btn-menu-mobile .item-navicon::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #b82828;
    top: 12px;
    border-radius: 15px;
    position: absolute;
    transition: all 0.3s ease-in-out;
}
.header .c-btn-menu-mobile .item-navicon::after {
    content: "";
    border-radius: 15px;
    display: block;
    width: 100%;
    height: 100%;
    background: #b82828;
    top: -12px;
    position: absolute;
    transition: all 0.3s ease-in-out;
}
.header .c-btn-menu-mobile .item-menu-btn {
    display: none;
}
.header .c-btn-menu-mobile .item-menu-icon {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
}


.header__btn-menu-mobile {

    padding: 7px;
}
.item-burger {
    margin: 0px;
    z-index: 99;
    padding: 0;
}

.item-navicon {
    cursor: pointer;
    display: block;
    width: 42px;
    height: 2px;
    position: relative;
}

.item-navicon::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    top: 12px;
    border-radius: 15px;
    position: absolute;
    transition: all 0.3s ease-in-out;
}

.item-navicon::after {
    content: "";
    border-radius: 15px;
    display: block;
    width: 100%;
    height: 100%;
    top: -12px;
    position: absolute;
    transition: all 0.3s ease-in-out;
}

.item-menu-btn {
    display: none;
}

.item-menu-icon {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
}

.social-menu{
    display: flex;
    justify-content: flex-start;
    padding: 20px 10px;
}
.social-menu-item {
    padding: 0 10px;
}

.noshow{
    position: absolute;
    top: 30px;
    color: transparent !important;
    background: none !important;
}
.noshow_2{
    position: absolute;
    top: 122px;
    color: transparent !important;
    background: none !important;
}

.c-btn-menu-mobile{
    position: fixed;
    top:23px !important;
    right: 50px !important;
}
.categories_mobile_menu{display: none;}
.categories_btn{align-self: center; background: transparent; color: white; border: 0; width: 100%; text-align: left; padding: 20px; text-transform: uppercase; letter-spacing: 1px;}
.bottom-nav{display: none; position: fixed; bottom:0; width: 100%;}
.categories_bottom{ overflow-y: scroll; z-index:1000; display: none; position:fixed; background-color:rgba(255, 255, 255, 0.95); width: 100%; height: 100%; top:0; left:0;}
.close_btn{padding: 10px 30px; background-color: transparent; border: none; float: right; font-size: 30px; }
.slickgallery{display: none;}
.slick-slider{display: none;}
.servicios h1{font-size: 35px;}

input[type=checkbox]:checked{background-color:#1D1D1B !important;}

.footer_kitDigital{background-color: #d1d1d1;padding: 30px 3rem;}
.footer_kitDigital .logos_container{width: 600px; max-width: 90%; margin-left: auto; margin-right: auto; display: flex; justify-content: space-evenly; flex-wrap:wrap;}
.footer_kitDigital .kit_col_child{padding: 0 10px;}
.footer_kitDigital .kit_logo{width: 200px; max-width: 100%;}


.language_switcher{ background-color: white; border-radius: 100px; width:55px; font-size: 13px; position: relative;}
/*.language_switcher::after{ position:absolute;
    content:'';
    left:80px;
    top:8px;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 8px solid black;}*/

.language_switcher a{text-decoration: none; padding:0 10px;}
.dropdown {
    position: relative;
    display: inline-block;
}

/* -------------------------------- */

#totop {
    color: white;
    position: fixed;
    bottom: 7px;
    right: 20px;
    width: 32px;
    height: 32px;
    background-color: #9b3030;
    z-index: 9990;
    display: none;
    margin-bottom: 30px;
    text-align: center;
    padding-left: 7px;
    box-shadow: 1px 1px 5px black;
}
#totop:hover{
    color:#FFF;
}
#totop i{
    width: 100%;
    height: 100%;
    text-align: center;
    line-height: 32px;
    font-size:18px;

}

/* -------------------------------- */

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    text-align: center;
}

.dropdown:hover .dropdown-content { display: block;}
.language_list{padding: 0; width: 100%;}
.language_list li{display:block !important; margin: 0; padding:3px 10px;}
.language_list li:hover{background-color:#530303 !important;}
.language_list li:hover a{color:white !important;}
.language_arrow{position: absolute; right: 2px; top: 5px; font-size: 9px;}

.topbar_item{margin: 0 4px; align-self: center;}
.icon_container { width: 20px; height: 20px; background-color: white; border-radius: 100%; text-align: center; font-size: 12px;}
.fa-brands{color: black; margin-top: 4px;}
.c-menu-topbar__list{display: flex;}
.family_name{padding-right: 20px;}
.privacyTable{border-collapse: collapse;}
.privacyTable td{border: solid 1px black;}




.topbarSearch {

}

.topbarSearch form input,
.topbarSearch form button{
    font-size: 14px;
    padding: 0 20px;
}

.topbarSearch form input {
    border-bottom-left-radius: 25px;
    border-top-left-radius: 25px;
    width: 250px;
    margin-right: 0;
}


.topbarSearch form button {
    border-bottom-right-radius: 25px;
    border-top-right-radius: 25px;
}

.topbarSearch form button span fa.fa-search {
   padding: 5px 0;
}



.topHeaderBar {
    background: linear-gradient(-90deg, #cf3126 0%, #530303 100%);

}

.topHeaderBar > div {
    width: 95%;
    max-width: 2048px;
    padding: 5px 42px;
    font-size: 12px;
    color: white;
}

.topHeaderBar > div a {
    color: white;
    text-decoration: none;
}

.topHeaderBar > div a:hover {
    color: white;
    text-decoration: underline;
}



@media only screen and (max-width: 1750px){
    .desktop-width{padding:0 16px;}
    .c-projects{max-width: 1400px;}
}

@media only screen and (max-width: 1400px){
    .row{padding:10px 40px;}

    .family_link{
        width: calc(25% - 10px);
    }
}

@media only screen and (max-width: 1230px) {
    .header__logo img{width:200px;}
}

@media only screen and (max-width: 1200px){
    .old_img{width:40% !important;}

    .header_menu a {
        min-width: inherit;
        padding: 5px 10px;
    }
    .fa-search {
        padding: 7px 0;
     }

    .product_description{
        display: none !important;
    }

    .layout_select{
        display: none;
    }

    .products_grid_item{display: block;}

    .productInfo{/*display:flex !important;*/ width:100% !important;}
    .dropdown-btn{font-size: 18px !important;}
    .sidenav a{font-size: 18px !important;}

}

@media only screen and (min-width:850px) and (max-width: 1200px){
    .products_grid_item{width: 40% !important;}
    .noticia_grid_item{width: 40% !important;}
    .gallery_grid_item{width: 40% !important;}
}

@media only screen and (max-width: 1145px){
    .c-menu-topbar{display: none;}
    .header_menu{display: none;}

    .topHeaderBar {
        display: none;
    }

    .c-btn-menu-mobile{
        /*display: block;*/
        display: flex;
        align-items: center;
    }
    .header__logo img{width:145px;}
    .footer_products_col{width: 100%; margin:10px 0;}
    .separator{width: 90%;}
    #header{position: fixed;}

    #header {
        padding: 15px 15px;
    }
    .c-btn-menu-mobile {
        right: 20px !important;
    }
    .c-btn-menu-mobile .header_login a {
        position: relative;
        color: white !important;
    }

    .header .c-btn-menu-mobile .item-menu-icon {
        width: 20px;
        height: 20px;
    }

    .header .c-btn-menu-mobile .item-navicon {
        width: 20px;
    }

    .header .c-btn-menu-mobile .item-navicon::before {
        top: 10px;
    }
    .header .c-btn-menu-mobile .item-navicon::after {
        top: -10px;
    }

    .zeynep ul > li.redLink > a {
        color: #b82828 !important;
    }

    button.categories_btn > i.opened,
    button.mobile-dropdown-btn > i.opened {
        display: none;
    }
}

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

    .footer {
        padding: 30px 0 80px 0;
    }
}

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

    .family_link{
        width: calc(33% - 10px);
    }
}

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

    .family_link{width: 40%;}
    .news_frame_col_1{display: none;}
    .company_frame_col_1{display: none;}
    .news_frame_col_2{width: 100%;}
    .company_frame_col_2{width: 100%;}
    .gallery_list{justify-content: center;}
    .footer{padding:30px 0;}
    .products_list_col_1{display: none;}
    .products_list_col_2{width: 100%;}
}

@media only screen and (max-width: 900px) {
    .marca_item{width: 20%;}
}

@media only screen and (max-width:850px){
    .products_list_col_1{display: none;}
    .products_list_col_2{width: 100%;}
    .categories_mobile_menu{display: flex; position: fixed; bottom: 0; z-index: 100000; background-color: #0e0e0e; width: 100%; color: white;}
    .products_grid_item{
        width: calc(50% - 20px) !important;
        margin: 10px 10px !important;
    }
    .noticia_grid_item{
        width: calc(50% - 20px) !important;
        margin: 10px 10px !important;
    }
    .gallery_grid_item{
        width: calc(50% - 20px) !important;
        margin: 10px 10px !important;
    }
    .layout_select{display: none;}
    .detail_layout_select{display: none;}
    .product_detail_info{width: 100% !important;}
    .product_detail_content figure{width: 100% !important;}
    .related_product{width: 40%;}

    .detail_extra_col {
        width: 100%;
    }
}

@media only screen and (max-width: 800px) {
    .news_item{width: 100%;}
    .contact_form{justify-content: flex-start;}
    .contact_form .form_input{width: 95%;}
    .footer_col_1{width: 100%; text-align: left;}
    .footer_col_2{width: 20%;}
    .footer_col_3{width: 25%;}
    .footer_col_4{width: 25%;}
}

@media only screen and (max-width: 768px){
    .family_link{
        width: calc(50% - 10px);
        padding: 25px;
    }
}


@media only screen and (max-width: 700px) {
    .marca_item{width: 25%;}
    .footer_col_1{width: 100%;}
    .footer_col_2{width: 100%; margin: 10px 0;}
    .footer_col_3{width: 100%; margin: 10px 0;}
    .footer_col_4{width: 100%; margin: 10px 0;}
    .footer_grid{text-align: left;}
    .footer_col_2, .footer_col_3, .footer_col_4 {padding:0 20px;}
    .footer p{margin:0;}
    .footer_col{margin: 10px 0;}
}


@media only screen and (max-width: 649px) {
    .banner_body {
        font-size: 65px;
    }
    .mobile_video{display: block;}
    .desktop_video{display: none;}
    .mobileFooter{ margin:15px 0;}
    .row{padding:0 1rem;}
    .old_img{width:80% !important; margin-left:auto; margin-right: auto;}
    .desktop-width{padding:0 16px;}
    .popular_footer_products_list ul li{width: 100%;}
    .footer_products_list ul{width: 100%;}
    .footer_products_list {padding: 0 20px;}
    .servicios{padding:55px;}
    .servicios h1 {
        font-size: 23px;
    }
    .marcas_compatibles{padding: 30px; }
    .banner_body{font-size: 60px}
    .banner_products{background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/productos/banner_productos_mobile.jpg'); background-size: cover; height:400px; position: relative; background-position:center;}
    .banner_news{background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/noticias/noticias_banner_mobile_2.jpg'); background-size: cover; height:400px; position: relative; background-position:center;}
    .banner_contact{background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/contacto/contacto_banner_mobile.jpg'); background-size: cover; height:400px; position: relative; background-position:center;}
    .banner_company{background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../images/company/company_mobile.jpg'); background-size: cover; height:400px; position: relative; background-position:center;}
    .contact_form{justify-content: flex-start;}
    .contact_form .form_input{width: 95%;}
    .footer_col_1{margin: 0;}
    .footer_col_2{display: none;}
    .footer_grid{text-align: left;}
    .footer_col_3, .footer_col_4 {padding:0 20px;}
    .footer p{margin:0;}
    .footer_col{margin: 10px 0;}
    .product_detail_info{margin: 20px 0;}
    .whiteBkg{max-width: 90% !important; padding: 50px 10px !important;}
    .whiteBkg h1{font-size: 25px !important;}
    .whiteBkg .login_form input{width: 290px !important; max-width: 92% !important;}
    .main{min-height: auto !important;}
    .btnAfegir{margin:0;}
    .table_list_col_2{overflow-x: auto;}
    .fold-table{width: 550px;}

    #products_list{
        padding-top: 60px;
    }

    #products_list .cart_table .cart_table_product_row:first-child {
        border-top: none;
    }

    .cart_col_2 {overflow-x: auto;}

    .cart_table,
    .orders_table {
        width: 550px;
        max-width: 100%;
    }

    .order_detail_table {
        width: 100%;
        max-width: 100%;
    }


    .cart_table .cart_table_head,
    .orders_table .orders_table_head,
    .order_detail_table .order_detail_table_head {
        display: none;
    }

    .orders_table .fold-content {
        padding:0;
    }

    .order_detail_table {
        font-size: small;
    }

    .cart_table .cart_table_product_row {
        display: flex;
        flex-direction: column;
        border-top:1px solid #dddddd;
        font-size: 14px;
    }

    .orders_table .order_view {
        display: flex;
        flex-direction: row;
        border-top: 1px solid #dddddd;
        font-size: 14px;
        flex-wrap: wrap;
    }

    .cart_table .cart_table_product_row .spinnerMinus {
        margin-left:0px;
    }

    .cart_table .cart_table_mobile_title,
    .orders_table .order_table_mobile_title,
    .orders_table .order_table_mobile_price{
        display:inline-block;
        font-weight: bold;
    }

    .cart_table .cart_table_actions {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        border-top:1px solid #dddddd;
    }

    table.fold-table.orders_table > tbody > tr.view td:first-child,
    table.fold-table.orders_table > tbody > tr.view th:first-child {
        position: relative;
        padding: 0.4em;
    }

    table.fold-table.orders_table > tbody > tr.view td,
    table.fold-table.orders_table > tbody > tr.view th {
        padding: 0.4em;
        width: 50%;
    }

    .hideOnMobile {
        display: none;
    }

    .fullWhideOnMobile {
        width: 100%
    }

    .cartProductTitle {
        color: #b82828 !important;
        font-weight: bold;
    }


    .btnComanda{width: 180px;}
    .legalMenuItem{width: 100%; text-align: left; padding: 5px 20px;}


/* ADDED */

    .products_grid_item{width: 100% !important;}
    .noticia_grid_item{width: 100% !important;}
    .gallery_grid_item{width: 100% !important;}
    .products_grid{justify-content: center !important;}
    .related_product{width: 40%; margin: 0 15px; padding: 5px;}
    .detail_extra{flex-direction:column-reverse !important;}
    .product_detail_content figure{
        /*display: none;*/
    }
    .slickgallery{display: block; max-width: 100%; width: 100%;}

    .gallery{display: none;}

    .product_detail .detail_extra .gallery {
        display: flex;
    }

    .detail_extra_col{width: 100%;}
    .slick-slider{display: block;}
    figcaption{padding: 0 20px !important; top: 50.3% !important;}



}

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

    .intro_col {
        width: 100%;
    }

    .experiencias h1 {
        font-size: 40px;
    }

    .footer_products_list ul{
        column-count: 1;
    }
    .marca_item{width: 30%;}

    .family_link{
        width: calc(50% - 10px);
        padding: 0;
    }
}

@media only screen and (max-width: 585px) {
    .footer_kitDigital .kit_logo{width: 250px; max-width: 100%; margin: 15px 0;}
}

@media only screen and (max-width: 450px) {
    .experiencias{padding:50px;}
}

@media only screen and (max-width: 350px) {
    .experiencias{padding:20px;}
    h4{font-size: 30px !important;}
}


/* MEGAMENU */
#header { position: relative; }
.header_menu nav > ul > li.has-megamenu { position: static; }

.megamenu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background-color: #1c1c1c;
    padding: 25px 50px 30px;
    z-index: 999;
    box-shadow: 0 8px 20px rgba(0,0,0,0.5);
    transform: translateY(-20px);
}

.header_menu nav > ul > li.has-megamenu:hover .megamenu {
    display: block;
}

.megamenu__inner {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 30px;
}

.megamenu__col {
    flex: 0 0 220px;
    max-width: 250px;
}

.megamenu__col-title {
    display: block;
    font-weight: bold;
    color: white !important;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid #b82828;
    border-right: none !important;
    padding: 0 0 6px !important;
    margin-bottom: 8px;
    min-width: unset !important;
    text-align: left;
}

.megamenu__col-title:hover {
    color: #b82828 !important;
}

.megamenu__col ul {
    list-style: none;
    margin: 0;
    padding: 0 !important;
}

.megamenu__col li {
    margin-bottom: 2px;
}

.megamenu__col li a {
    color: #aaa !important;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 0 !important;
    border: none !important;
    min-width: unset !important;
    text-align: left;
}

.megamenu__col li a:hover {
    color: #ffffff !important;
}

.megamenu__ver-mas a {
    color: #ffffff !important;
    font-size: 11px;
    font-style: italic;
    border: none !important;
    padding: 4px 0 0 !important;
    min-width: unset !important;
    display: inline-block;
}

.megamenu__ver-mas a:hover {
    color: white !important;
    text-decoration: underline;
}

/* MEGAMENU — two-column sections */
.megamenu__sections {
    display: flex;
    gap: 0;
    align-items: flex-start;
}

.megamenu__section--categories {
    flex: 0 0 66.666%;
    padding-right: 30px;
    border-right: 1px solid #AAA;
}

.megamenu__section--brands {
    flex: 0 0 33.333%;
    padding-left: 30px;
}

.megamenu__section-title {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    /* border-bottom: 1px solid #2e2e2e; */
    padding: 5px;
    margin-bottom: 12px;
    background-color: #b82828;
    border-radius: 50px;
    color: white;
}

/* MEGAMENU — family icons */
.megamenu__col-title {
    display: flex !important;
    align-items: baseline;
    gap: 4px;
    justify-content: space-between;
    flex-direction: row-reverse;
}

.megamenu__col-icon {
    height: 50px;
    width: auto;
    flex-shrink: 0;
    opacity: 0.9;
}

.megamenu__col-icon--sm {
    height: 20px;
}

.megamenu__section--brands .megamenu__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 20px;
}

/* MEGAMENU — multi-column flow (no flex/grid) */
.megamenu__section--categories .megamenu__inner,
.megamenu__section--brands .megamenu__inner {
    display: block;
    column-gap: 25px;
}

.megamenu__section--categories .megamenu__inner {
    column-count: 3;
}

.megamenu__section--brands .megamenu__inner {
    column-count: 2;
}

.megamenu__section--categories .megamenu__col,
.megamenu__section--brands .megamenu__col {
    break-inside: avoid;
    max-width: none;
    margin-bottom: 16px;
}

/* ============================================================
   ÀREA DISTRIBUÏDORS — Afegir al cistell (llistat de productes)
   ============================================================ */

.cart-add-wrapper {
    padding: 4px 0 2px;
    text-align: center;
}

.btnAfegirList {
    background-color: #b82828;
    border: 0;
    padding: 6px 16px;
    color: white;
    font-weight: 500;
    cursor: pointer;
    font-size: 13px;
    width: 100%;
    transition: background-color 0.25s;
}

.btnAfegirList:hover { background-color: #1d1d1b; }

.btnAfegirList.cart-added,
.btnAfegir.cart-added {
    background-color: #2e7d32;
}

/* ============================================================
   ÀREA DISTRIBUÏDORS — Cistell
   ============================================================ */

.cart_unit_qty {
    align-self: center;
    min-width: 27px;
    text-align: center;
    display: inline-block;
}

.cart_remove_col {
    text-align: right;
    vertical-align: middle;
}

.btnRemoveCartUnit {
    background: none;
    border: none;
    cursor: pointer;
    color: #aaa;
    font-size: 15px;
    padding: 4px 8px;
    transition: color 0.2s;
}

.btnRemoveCartUnit:hover { color: #b82828; }

.cart_observacions {
    margin-top: 24px;
}

.cart_observacions label {
    display: block;
    font-weight: 500;
    margin-bottom: 6px;
}

.cart_observacions textarea {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #ddd;
    font-family: inherit;
    font-size: 14px;
    resize: vertical;
    box-sizing: border-box;
}

.cart_form_actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
    flex-wrap: wrap;
    gap: 12px;
}

.cart_continue_link {
    color: #666;
    font-size: 14px;
    text-decoration: none;
}

.cart_continue_link:hover { color: #b82828; }

.cart_header_row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.cart_orders_link {
    font-size: 13px;
    color: #666;
    text-decoration: none;
    padding-bottom: 4px;
}

.cart_orders_link:hover { color: #b82828; }

.cart_empty {
    padding: 40px 0;
    text-align: center;
}

.cart_empty_msg {
    font-size: 18px;
    color: #666;
    margin-bottom: 20px;
}

.cart_empty_btn {
    display: inline-block;
    background-color: #b82828;
    color: white;
    padding: 10px 28px;
    text-decoration: none;
    font-weight: 500;
}

.cart_empty_btn:hover { background-color: #1d1d1b; color: white; }

/* ============================================================
   ÀREA DISTRIBUÏDORS — Historial de comandes
   ============================================================ */

.order_status_badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background-color: #e8e8e8;
    color: #555;
}

.order_status_badge.order_status_pendiente {
    background-color: #fff3cd;
    color: #856404;
}

.order_status_badge.order_status_procesado,
.order_status_badge.order_status_completado {
    background-color: #d1e7dd;
    color: #0a3622;
}

.order_detail_obs {
    padding: 8px 10px;
    background: #f9f9f9;
    border-left: 3px solid #b82828;
    margin-bottom: 10px;
    font-size: 13px;
}


/* ── Cart Drawer ─────────────────────────────────────────────────────────── */
.cart-drawer-wrapper {
    position: fixed;
    inset: 0;
    z-index: 1050;
    visibility: hidden;
    pointer-events: none;
}
.cart-drawer-wrapper.is-open {
    visibility: visible;
    pointer-events: auto;
}
.cart-drawer-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.cart-drawer-wrapper.is-open .cart-drawer-overlay {
    opacity: 1;
}
.cart-drawer-panel {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 360px;
    max-width: 92vw;
    background: #fff;
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s ease;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.18);
    z-index: 1;
}
.cart-drawer-wrapper.is-open .cart-drawer-panel {
    transform: translateX(0);
}
.cart-drawer-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border-bottom: 1px solid #eee;
    flex-shrink: 0;
}
.cart-drawer-title {
    font-weight: 700;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #111;
}
.cart-drawer-close-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: #888;
    font-size: 17px;
    padding: 4px 6px;
    line-height: 1;
    transition: color 0.2s;
}
.cart-drawer-close-btn:hover { color: #b82828; }
.cart-drawer-body {
    flex: 1;
    overflow-y: auto;
    padding: 8px 20px;
}
.cart-drawer-item {
    padding: 10px 0;
    border-bottom: 1px solid #f0f0f0;
}
.cart-drawer-item:last-child { border-bottom: none; }
.cart-drawer-item-name {
    font-size: 13px;
    font-weight: 600;
    color: #222;
    margin-bottom: 4px;
    line-height: 1.35;
}
.cart-drawer-item-meta {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: #999;
}
.cart-drawer-item-qty {
    font-weight: 700;
    color: #b82828;
}
.cart-drawer-footer {
    padding: 16px 20px;
    border-top: 1px solid #eee;
    flex-shrink: 0;
}
.cart-drawer-view-btn {
    display: block;
    text-align: center;
    background: #b82828;
    color: #fff !important;
    padding: 13px 16px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 13px;
    transition: background 0.2s;
    text-decoration: none !important;
}
.cart-drawer-view-btn:hover { background: #962020; }
body.cart-drawer-open { overflow: hidden; }