/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */
/*********** FUENTE ICONOS ITCY CUSTOM *********************/
@font-face {
  font-family: 'icomoon';
  src:  url('../fonts/icomoon.eot?x7ckpa');
  src:  url('../fonts/icomoon.eot?x7ckpa#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?x7ckpa') format('truetype'),
    url('../fonts/icomoon.woff?x7ckpa') format('woff'),
    url('../fonts/icomoon.svg?x7ckpa#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-itcy-"], [class*=" icon-itcy-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-itcy-fa-24horas:before {
  content: "\e900";
}
.icon-itcy-fa-ubicacion:before {
  content: "\e901";
}
.icon-itcy-fa-tarjeta:before {
  content: "\e902";
}
/******FIN FUENTE ICONOS CUSTOM *******/

:root {
    --black:                black;
    --black-light:          #1a171b;
    --black-lighter:        #161616;
    --black-lightest:       #262626;
    --gray:                 #2e2e2e;
    --main-color-darker:    #7c242e;
    --main-color:           #b01b2d;
    --main-color-lighter:   #e79ca5;
    --main-color-lightest:  #f7ddd9;
    --white-darker:         #dcdcdc;
    --white:                white;
  }

/* Cabezera */
.layerslider-wrapper {
    padding: 0px !important;
}

.leo-megamenu .navbar-nav > li > a {
  border: 0px;
  padding: 12px 12px !important;

}

.container  {
   padding-left: 0px !important;
   padding-right: 0px !important;
}

.box-header-nav {
    background-color: var(--black-light) !important;
    margin-right: 0px;
    margin-left: 0px;
}

#header {
    background: transparent;
}

.header-top .container .inner {
    background-color: var(--main-color);
}

#header_user_info a:hover {
    color: var(--main-color);
}

.leo-megamenu .navbar-nav > li.active > a, .leo-megamenu .navbar-nav > li:hover > a, .leo-megamenu .navbar-nav > li:focus > a {
    color: var(--black-lighter)!important;
    background-color: transparent;
}

#header #click_show_search { 
    background-image: none !important;
}

#click_show_search:hover {
    color: var(--black-lighter) !important;
}

#_desktop_cart {
    width: 40%;
    left: 26px;
    background-color: var(--main-color);
    border-radius: 0px;
    bottom: 18px;
}

#_desktop_cart:after {
    border-right: 10px solid transparent;
    right: 0;
    width: 15px;
    height: 0px;
    border-top: 10px solid var(--black-light);
    content: "";
    position: absolute;
    bottom: -10px;
}

#_desktop_cart:before {
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -16px;
    left: -32px;
    border: solid 16px transparent;
    border-right-color: var(--main-color);
    z-index: 1;
}

@media (max-width: 767px) {
    #_desktop_cart {
        position: absolute;
        right: 15px;
        top: 10px;
        box-shadow: none;
        bottom: auto;
        left: auto;
        border-radius:3px;
    }

    #_desktop_cart:before {
        border:0px;
    }
}



/* Footer */

.cont-izquierda {
    margin-top:15px !important;
    margin-left: 35% !important;
}

.cont-derecha {
    margin-top:15px !important;
    margin-right: 35% !important;
}

.cont-social {
    position:absolute;
    right: 0px;
    margin: 32px 20px;
z-index:10;
}

.contact-us li {
    display: flex;
    align-items: center;
    line-height: 1em;
    margin-bottom: 0px !Important;
}

.ApColumn .block-social {
    position: absolute;
    right: 0px;
    text-align: left;
}

.icon-box {
    background-color: var(--white);
    border-radius: 47%;
    padding: 7px;
    margin: 10px 12px;
    width: 31px;
}

.icon-box i {
    color: var(--gray);
    padding: 2px 2px;
}


.footer-center .container .inner .row .col-xl-6 .block {
    margin: 0 auto;
    width: 60%;
}

@media (max-width: 767px) {
    .footer-center .container .inner .row .col-xl-6 .block {
        margin: 0 auto;
        width: 100%;
    }

    .cont-izquierda {
        margin-top:15px !important;
        margin-left: 0% !important;
    }
    
    .cont-derecha {
        margin-top:15px !important;
        margin-right: 0% !important;
    }
    .cont-social {
        right: 10px;
    }
}

.footer-center { background:none; }
.footer-center .container { background-color: var(--black); }
.footer-center .container .inner {  background-color: var(--black-lightest); }


.footer-copyright:before { background:none; }
.footer-copyright { padding: 25px 25px; }
.footer-copyright div { margin-top: 20px; }


.footer-fila1 .col-xl-12 { background-color: var(--main-color) !important; z-index:1 }


.footer-container { line-height: 0.5em }
.footer-container .block .title_block { padding: 12px 0px;}


.social li { display: inline-flex; }
.social .icon-box { margin: 10px 4px; }
.social .icon-box .fa-instagram{ margin: 0px 1px; }
.social .icon-box .fa-facebook { padding: 2px 4px; }



/* -- Seccion Principal -- */

   /* Cambio color flechas filas */
.owl-theme .owl-buttons div { background-color: var(--main-color)!important; }
.owl-theme .owl-buttons div.owl-prev:after { border-right: 9px solid var(--main-color) !important; }
.owl-theme .owl-buttons div.owl-next:after { border-left: 9px solid var(--main-color)!important;}
   /* Cambio color bloque menu */
.leo-verticalmenu .title_block { background: var(--main-color); }
   /* Elimianar icono al lado texto */
.right-column .title_block:before { content: "" !important; }

.products_block .title_block { color: var(--black-lightest); }

.products_block .alert-info {
    background-color: var(--main-color-lightest);
    border-color: var(--main-color-lighter);
    color: var(--main-color-darker);
}

.card-odd {
    background-color: var(--main-color);
    padding: 10px 20px;
    color: var(--white) !important;
    margin-bottom: 10px !important;
}

.card-odd h4 {
    color: var(--white);
    font-size: 28px;
    font-weight: 600;
}

.card-odd p {
    font-size: 20px;
    font-weight: 300;
    line-height: 1.35em;
}

.card-even {
    background-color: var(--black);
    padding: 10px 20px;
    color: var(--white) !important;
    margin-bottom: 10px !important;
}

.card-even h4 {
    color: var(--white);
    font-size: 28px;
    font-weight: 600;
}

.card-even p {
    font-size: 20px;
    font-weight: 300;
    line-height: 1.35em;
}

.best-seller .title_block {
    margin-top: 10px;
    color: var(--white);
    background: var(--main-color);
    font-size: 18px;
    position: relative;
    text-transform: uppercase;
    font-weight: 800;
    white-space: nowrap;
    letter-spacing: 0;
    padding: 15px 10px;
}

.new-products .title_block {
    color: var(--white);
    background: var(--main-color);
    font-size: 18px;
    position: relative;
    text-transform: uppercase;
    font-weight: 800;
    white-space: nowrap;
    letter-spacing: 0;
    padding: 15px 10px;
}

.new-products .owl-wrapper {
    width: 100% !important;
}
.new-products .owl-item {
    width: 100% !important;
}

.new-products .thumbnail-container {
    margin-bottom: 0px !important;
}

.product-image {
    padding: 10px;
}

.product-thumbnail:before {
    top: 100%;
    margin-top: 5px;
    margin-bottom: 15px;
}

.leo-list-product-reviews {
    display:none;
}

.thumbnail-container .product-meta {
    padding: 20px 15px 10px 15px !important;
}

.product-flags .product-flag {
    background: var(--main-color);

}

.product-flags .product-flag.discount {
    background: var(--main-color);

}

.product-flags .product-flag.new:before {
    border-left: 10px solid var(--main-color);
}

.product-flags .product-flag.pack:before {
    border-left: 10px solid var(--main-color);
}

.product-flags .product-flag.discount:before {
    border-right: 10px solid var(--main-color);
}

.leo-bt-cart-content {
    font-weight:600;
}

.page-home {
    padding: 0px 20px;
}

.thumbnail-container .functional-buttons > div .btn-product {
    width: 32px;
}

#back-top a { background: var(--main-color); }

.footer-container li a:hover {
    color: var(--white-darker);
}

div.verticalmenu ul li a:hover .menu-title, div.verticalmenu ul li a:focus .menu-title, .thumbnail-container .product-title a:hover {
    color: var(--main-color);
}

.btn {
    background: var(--main-color);
}

.thumbnail-container:hover {
    border: 1px solid var(--main-color);
}

.btn:hover {
    color: var(--main-color);
    border-color: var(--main-color);
}

.thumbnail-container .functional-buttons > div .btn-product:hover {
    background-color: var(--main-color);
    border-color: var(--main-color);
}

.leo-fly-cart-icon-wrapper .leo-fly-cart-icon {
    background: var(--main-color);
}

.leo-fly-cart-icon-wrapper .leo-fly-cart-total {
    color: var(--main-color);
    border-color: var(--main-color);
}

.leo-cart-item-info .leo-bt-product-quantity:hover {
    background: var(--main-color);
    border-color: var(--main-color);
}

.product-actions .add-to-cart {
    background: var(--main-color);
    border-color: var(--main-color);
}

.product-actions .add-to-cart:hover {
    background: var(--main-color-darker);
    border-color: var(--main-color-darker);
}

.product-tabs.tabs .nav-tabs .nav-link.active {
    color: var(--main-color);
}

.leo-fly-cart-cssload-loader:after {
    border: 1px solid var(--main-color-lighter);
    -moz-box-shadow: inset 0 0 10px var(--main-color-lighter);
    -webkit-box-shadow: inset 0 0 10px var(--main-color-lighter);
    -o-box-shadow: inset 0 0 10px var(--main-color-lighter);
    -ms-box-shadow: inset 0 0 10px var(--main-color-lighter);
    box-shadow: inset 0 0 10px var(--main-color-lighter);
}

.leo-fly-cart-cssload-loader:before {
    border: 1px solid var(--main-color-lighter);
    -moz-box-shadow: inset 0 0 10px var(--main-color-lighter);
    -webkit-box-shadow: inset 0 0 10px var(--main-color-lighter);
    -o-box-shadow: inset 0 0 10px var(--main-color-lighter);
    -ms-box-shadow: inset 0 0 10px var(--main-color-lighter);
    box-shadow: inset 0 0 10px var(--main-color-lighter);
}

.breadcrumb li a:hover {
    color: var(--main-color);
}

.products-selection .display > div.selected a {
    background: var(--main-color);
}
.products-selection .display > div.selected a:hover {
    background: var(--main-color-darker);
    color: var(--white);

}


.products-selection .display > div a:hover {
    color: var(--main-color);
}

#search_filters a:hover {
    color: var(--main-color);
    text-decoration: none;
}

.facet-label a:hover {
    color: var(--main-color);
    text-decoration: none;
}

.sidebar .block .title_block a:hover {
    color: var(--main-color);
}

.products-sort-order .select-list:hover {
    background: var(--main-color);
}


::-webkit-scrollbar-thumb {
    background-color: var(--main-color);
    border-radius: 0;
    background-image: -webkit-linear-gradient(0deg , rgba(255, 255, 255, 0.5) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0.5) 75%, transparent 75%, transparent);
}

.btn-primary:active:hover, .btn-primary:active:focus, .btn-primary:active.focus, .btn-primary.active:hover, .btn-primary.active:focus, .btn-primary.active.focus, .open > .btn-primary.dropdown-toggle:hover, .open > .btn-primary.dropdown-toggle:focus, .open > .btn-primary.dropdown-toggle.focus {
    background-color: var(--main-color-darker);
    color:var(--white) !important;
}

.btn-outline:hover, .btn-outline:focus, .btn-outline:active, .btn-outline.active {
    background-color: var(--main-color-darker);
    border-color: var(--main-color-darker);
    color:var(--white) !important;

}

.leo-remove-from-cart {
    color: var(--main-color);
}

.leo-remove-from-cart:hover {
    color: var(--main-color-darker);
}

.leo-dropdown-cart-content a i, .leo-dropdown-cart-content a.leo-dropdown-customization, .leo-dropdown-cart-content a.leo-dropdown-combination {
    color: var(--main-color);
}

.leo-dropdown-cart-content a:hover i {
    color: var(--main-color-darker);
}

.btn-default:hover, .bootstrap-touchspin .btn-touchspin:hover, .btn-default:focus, .bootstrap-touchspin .btn-touchspin:focus {
    color: var(--white);
    border: 1px solid var(--main-color);
}

.bootstrap-touchspin .btn-touchspin:hover {
    background-color: var(--main-color);
}

.group-span-filestyle .btn-default, .group-span-filestyle .bootstrap-touchspin .btn-touchspin, .bootstrap-touchspin .group-span-filestyle .btn-touchspin {
    background: var(--main-color);
}

.cart-grid-body a.label:hover {
    color: var(--main-color);
}

.popup-over .popup-title:hover {
    color: var(--main-color) !important;
}
.popup-over .popup-content a:hover {
    color: var(--main-color) !important;
}

#authentication [data-action="show-password"]:hover {
    background: var(--main-color);
}


.custom-radio input[type="radio"]:checked + span {
    background-color: var(--main-color);
}

li.product-flag.pack:after {
    border-left: 10px solid transparent;
    left: 0;
}

li.product-flag.pack:before {
    border-left: 10px solid var(--main-color);
    right: -10px;
}

li.product-flag.pack {
    left: -10px;
    z-index: 99;
    top: 39px;
}

/**para que se vea entero el titulo del producto en los thumbnails**/
.thumbnail-container .product-title {
  overflow: visible !important;
  display: inline-table !important;
}

/**ficha de producto - selector de peso o lo que sea **/
.product-variants > .product-variants-item select {
    width: 320px !important;
}

/** ficha de producto, poner el precio por unidad al lado del precio real**/
.current-price {
float: left;
}
.product-unit-price {
   float: left;
    vertical-align: middle;
    margin-top: 0.5em;
    margin-left: 0.5em;
    font-size: 0.6em !important;
}


.unit-price-cart {
    font-size: 0.6em !important;
}

.tabs.ui-tabs.ui-widget.ui-widget-content{
max-width: 100% !important;
border:none !important;
background: transparent !important;
}
.ui-tabs-panel.ui-widget-content{
max-width: 100% !important;
border:none !important;
background: transparent !important;
}

.ui-tabs-nav.ui-helper-reset.ui-helper-clearfix.ui-widget-header{
background: transparent !important;
border:none !important;
}

.tab-content {
    border: 1px solid #dfe0e1;
    padding: 10px 20px;
}

@media (min-width: 992px) {
  .footer-center .bg-left-footer::before {
    width: 0%;
    background-color: #ffffff !important;
  }
}