/* THEME: BIRTHOFCOOL */

@color1: #fff; /*blanco*/
@color2: #f85f0c; /*naranja*/
@color3: #000000; /*negro*/
@color4: #969696; /*gris*/
@color5: #FFF; /*blanco*/

/* BACKGROUND */

@body-bkgnd: @color1;														/* Background Body */
@body-bkgnd-img: none;														/* Background Image */
@header-bkgnd: transparent;	 												/* Background Header */
@header-topbar-bkgnd: fade(@color3, 15%);									/* Background Header TopBar */
@nav-top-bkgnd: transparent;												/* Background Menu */
@navbar-top-bkgnd: transparent;												/* Background Menu Inner */
@navbar-item-bkgnd: transparent;											/* Background item de menu */
@footer-bkgnd: fade(@color3, 99%);											/* Background Footer */
@price-promo-bkgnd: transparent;											/* Background fondo precio en promo */
@product-detailed-bkgnd:transparent;										/* Background Listado de Producto y relacionado */
@product-detailed-bkgnd-hover: @color1;										/* Background Listado de Producto y relacionado en Hover*/
@button-checkout-bkgnd: @color2;											/* Background Btn Checkout */
@button-checkout-bkgnd-hover: darken(@button-checkout-bkgnd, 10%);			/* Background Btn Hover Checkout */
@button-add-bkgnd: fade(@color4, 90%);										/* Background Agregar Producto */
@button-add-bkgnd-hover: @color4;											/* Background Agregar Producto Hover */
@button-buy-bkgnd: @color1;													/* Background Boton Comprar en listado */
@button-buy-hover-bkgnd: @color2;											/* Background Boton Comprar Hover en listado */
@button-apply-bkgnd: @color2;												/* Background Boton Código o Descuento */
@button-apply-bkgnd-hover: darken(@button-apply-bkgnd, 10%);				/* Background Color para hover de apply */
@header-cart-bkgnd: transparent;											/* Background para carrito de compras en header */
@header-cart-bkgnd-hover: @color1;											/* Background hover para carrito en header */
@header-search-box: transparent;											/* Background input de search */
@header-cart-button-bkgnd: @color1;								/* background botón en carrito desplegable */
@header-cart-button-bkgnd-hover: darken(@color4,30%);						/* background botón hover en carrito desplegable */
@header-checkout-button-bkgnd: darken(@color4,20%);							/* background botón en carrito desplegable */
@header-checkout-button-bkgnd-hover: darken(@color4,30%);					/* background botón hover en carrito desplegable */
@header-search-box-btn-color-bkgnd: transparent;							/* Background btn search header */
@slideshow-info-bkgnd: fade(@color1, 50%);									/* Background para info de slideshow */
@slideshow-info-bkgnd-hover: @color1;
@slideshow-product-btn-bkgnd: @color2;										/* Background para boton de comprar slideshow */
@slideshow-product-btn-bkgnd-hover: darken(@color2, 10%);					/* Background hover para boton compra slideshow */
@slideshow-product-promo-price-bkgnd: transparent;							/* Fondo de precio de promo */
@slideshow-product-oldprice-bkgnd: transparent;								/* Fondo de precio de promo */
@social-icon-bkgnd: fade(@color3, 30%);										/* Background para iconos sociales */
@social-icon-bkgnd-hover: fade(@color3, 80%);								/* Background hover para iconos sociales */
@menu-nav-bkgnd: transparent;												/* Background menu nav */
@menu-nav-drop-bkgnd: darken(@color1,3%);									/* Background menu dropdown 0.9 transparencia */
@menu-nav-item-active: @color2;												/* Background item activo */
@menu-nav-item-hover: transparent;											/* Background item hover */
@menu-info-item-active: fade(@color3, 10%);
@menu-nav-inner-bkgnd-color-hover: @color2;									/* Background link dropdown */
@product-info-bkgnd: @color4;
@outstock-bkgnd: @color3;													/* Background sin stock listado prod */
@cocarda-bkgnd: @color3;													/* Background Cocarda */
@filter-bkgnd: transparent;													/* Background filtro de listado */
@filter-handler-bkgnd: fade(@color1, 90%);									/* Background handler de filtro */
@filter-range-bkgnd: @color3;												/* Background filtro con slider */
@filter-input-border-color-hover: @color3;									/* Background hover para input de filtro */
@filter-selected-background: fade(@color3, 10%);							/* Background para filtro seleccionado */
@filter-selected-background-close: @color3;									/* Background para botón Close de filtro seleccionado */
@filter-range-line-bkgnd: fade(@color3, 60%);								/* Background línea inferior en handler de filtro */
@box-content-bkgnd: transparent;											/* Background para Box Content General */
@section-0-bkgnd: transparent;												/* Background section X */
@section-1-bkgnd: transparent;												/* Background section X */
@section-2-bkgnd: transparent;												/* Background section X */
@section-3-bkgnd: transparent;												/* Background section X */
@section-0-box-content-bkgnd: transparent;									/* Background box content para section X */
@section-1-box-content-bkgnd: transparent;									/* Background box content para section X */
@section-2-box-content-bkgnd: transparent;									/* Background box content para section X */
@section-3-box-content-bkgnd: transparent;									/* Background box content para section X */
@form-paragraph-bkgnd: fade(@color3, 10%);									/* Background parrafo de contacto */
@category-bkgnd-hover: @color4;												/* Background Categoria Hover*/
@pagination-bkgnd: fade(@color3, 5%);										/* Background pagination*/
@pagination-active-bkgnd: lighten(@color1, 5%);								/* Background pagination boton activo*/
@pagination-hover-bkgnd: fade(@color3, 10%);								/* Background pagination boton hover*/
@product-ask-bkgnd: transparent;											/* Background consultar btn */
@product-ask-bkgnd-hover: transparent;										/* Background consultar btn hover*/
@button-continue-shop: transparent;											/* background botón seguir comprando*/
@button-continue-shop-hover: transparent;									/* background hover botón seguir comprando*/
@form-input: @color5;														/* Background input de form */
@button-checkout-gnal-bkgnd: @color2;										/* Background input Checkout */
@button-checkout-gnal-bkgnd-hover: darken(@color2, 10%);					/* Background input Checkout Hover*/
@product-shadow-hover: darken(@color4,50%);
@button-category-bkgnd: @color1;											/* Background Boton de categoría */
@button-category-hover-bkgnd: @color2;										/* Background Boton de categoría Hover */
@pager-color-bkgnd: @color1;												/* Background para link en pager */
@image-hover-bkgnd: transparent;											/* Background para efecto de hover en imagen */
@category-link-bkgnd: transparent;											/* Color de fondo de link de categoria */
@category-title-background: transparent;									/* Color de resaltado de link de categoria */
@image-span-bkgnd: transparent;												/* Color para fondo de texto en imagen */
@image-paragraph-span-bkgnd: transparent;									/* Color de fondo para párrafo en imagen */
@slideshow-product-title-background: transparent;							/* Fondo nombre de producto en slideshow */
@slideshow-product-description-background:transparent;						/* Fondo descripcion de producto en slideshow */
@button-image-bkgnd:@color3;
@button-image-hover-bkgnd:@color1;
@product-social-background-color: transparent;								/* Fondo icono social en producto */
@product-social-background-color-hover: darken(@color1, 10%);				/* Fondo icono social en producto en hover*/
@category-over-color: @color5;												/* Fondo de color para efecto over en Categoria */
@product-over-color: @color5;												/* Fondo de color para efecto over en Producto */
@image-over-color: @color5;
@newsletter-button-background: @color1;										/* Fondo Color de botón para newsletter */
@newsletter-button-background-hover: darken(@color1, 30%);					/* Fondo Color de botón para newsletter en hover */
@newsletter-input-background-color: @color1;								/* Fondo color input para newsletter */ @footer-credits-background-color: transparent;								/* Fondo para créditos en footer */
@image-bkgnd-p: transparent;                                                /* Fondo de parrafo para elemento imagen */ 
@image-bkgnd-p-icon: @image-bkgnd-p;                                        /* Icono Fondo de parrafo para elemento imagen */



/*COLORES*/

@title-color: @color2;														/* Color h1 */
@subtitle-color: @color3;													/* Color h2 */
@subtitle2-color: @color3;													/* Color h3 */
@paragraph-color: @color3;													/* Color P */
@link-color: @color2;														/* Color a */
@link-color-hover: darken(@link-color, 10%);								/* Color a:hover */
@link-color-active: @link-color;											/* Color a:active */
@link-menu-nav-color: @color3;												/* Color link nav */
@link-menu-nav-color-hover: @color2;										/* Color link nav hover */
@link-menu-nav-color-active: @color1;										/* Color link nav .active */
@link-menu-nav-inner-color: @color3;										/* Color link en dropdown */
@link-menu-nav-inner-color-hover: @color5;									/* Color link en dropdown en hover */
@menu-nav-arrow-color: @color3;												/* Color flecha de menu */
@autocomplete-color-hover: @color1;											/* Color autocomplete hover */
@product-link-color: @color3;												/* Color del nombre del producto*/
@price-color: @color3;														/* Color Precio */
@price-promo-color: fade(@color3, 75%);										/* Color Precio de promo */
@footer-company-data: @color4;												/* Color texto de empresa en footer */
@footer-data: @color1;														/* Color texto info de footer */
@slideshow-product-title-color: @color3;									/* Color nombre de producto en slideshow */
@slideshow-product-description-color:@color2;
@slideshow-product-price-color: @color3;									/* Color para precio de producto en slideshow */
@slideshow-text-color: @color3;												/* Color de texto en slideshow */
@slideshow-product-btn-color-hover: @color1;								/* Color de hover de texto de botón */
@slideshow-product-btn-color: @color1;										/* Color de texto de boton en slideshow */
@slideshow-control-color: fade(@color3, 20%);								/* Color flecha en slideshow */
@slideshow-control-color-active: @color2;									/* Color flecha activo en slideshow */
@slideshow-control-color-hover: @color3;									/* Color hover flecha en slideshow */
@slideshow-arrow-color:@color3;
@slideshow-product-promo-price-color: @color2;								/* Color de precio de promo */
@social-icon-color: #FFF;													/* Color para iconos de social */
@social-icon-color-hover: #F0F;
@button-add-color: @color1;													/* Color de boton agregar */
@button-add-disbled-color: @color4;											/* Color de boton agregar */
@icon-facebook: #3b5999;													/* Color icono facebook */
@icon-twitter: #00bbf5;														/* Color icono twitter */
@icon-pinterest: #f13434;													/* Color icono pinterest */
@icon-youtube: #fe0000;														/* Color icono youtube */
@icon-google-plus: #252223;													/* Color icono gplus */
@icon-linked-in: #1385c4;													/* Color icono linked in */
@icon-instagram: #457399;													/* Color icono instagram */
@icon-facebook-hover: #3b5999;												/* Color icono facebook en hover */
@icon-twitter-hover: #00bbf5;												/* Color icono twitter en hover */
@icon-pinterest-hover: #f13434;												/* Color icono pinterest en hover */
@header-search-icon: @color4;												/* Color icono buscador */
@header-cart-count: darken(@color4,20%);									/* Color conteo fondo */
@header-cart-count-color: @color1;											/* Color conteo */
@header-cart-link-color: darken(@color4,20%);	 							/* Color link carrito en header */
@header-cart-link-color-tocart: darken(@color4,20%);	 					/* Color link carrito en header desplegado*/
@header-cart-color: @color4;												/* Color texto carrito */
@header-cart-icon-color: @color2;											/* Color icono carrito */
@header-cart-name-color: @color3;											/* Color nombre del producto en carrito */
@header-cart-delete-color: @color3;											/* Color item borrar en carrito */
@header-cart-button-color: @color3;											/* Color link botón de ver carrito */
@header-cart-button-hover-color: @color1;									/* Color link botón de ver carrito en hover*/
@header-checkout-button-color: @color1;										/* Color link botón de ver carrito */
@header-checkout-button-hover-color: @color1;								/* Color link botón de ver carrito en hover*/
@header-search-box-btn-color: @color4;								 		/* Color lupa buscador */
@header-search-box-btn-color-hover: @color2;						 		/* Color lupa hover buscador */
@header-search-box-color: darken(@color4,10%);								/* Color texto y placeholder en buscador */
@form-paragraph-color: @color4;												/* Color de texto en parrafo de contacto */
@form-title-color: @color3;													/* Color título en parrafo de contacto */
@form-paragraph-link-color: @color3;										/* Color para link en parrafo de contacto */
@form-paragraph-link-color-hover: @color2;									/* Color para hover de link en parrafo de contacto */
@footer-copyright-color: @color1;											/* Color Copyright en Footer */
@button-buy-link-color: @color2;											/* Color link en listado de producto */
@button-buy-link-color-hover: @color1;										/* Color link hover en listado de producto */
@footer-list-link: @color1;													/* Color para links en lista de Footer */
@footer-list-link-hover: darken(@color1,50%);								/* Color para links hover en lista de Footer */
@footer-legal-link: @color1;												/* Color para links en lista de Footer */
@footer-legal-link-hover: darken(@color1,50%);								/* Color para links hover en lista de Footer */
@remove-color-hover: darken(@link-color, 10%);								/* Color de hover para icono de remover en Checkout */
@product-label: @color4;													/* Color para labels en front de producto */
@product-related-control-color: @color3;									/* Color control productos relacionados */
@product-related-control-color-hover: @color4;								/* Color control hover productos relacionados */
@category-color-link: @color3;												/* Color de link en categoria */
@breadcrumb-link-color: lighten(@color3,40%);								/* Color link de breadcrumb */
@breadcrumb-link-hover-color: darken(@breadcrumb-link-color, 10%);			/* Color hover de link en breadcrumb */
@breadcrumb-divider-color: lighten(@color3,40%);							/* Color divisor de breadcrumb */
@breadcrumb-link-active-color: @color3;										/* Color para link activo en breadcrumb */
@pagination-color: @color3;													/* Color para texto en pagination */
@product-info-color: @color1;
@button-outstock-color: fade(@color4, 18%);
@filter-color-link: fade(@color3,50%);										/* Color para link en filtros */
@filter-color-link-hover: darken(@color4, 20%);								/* Color para link en filtros */
@filter-title-color: darken(@color3,20%);									/* Color para título en filtros */
@filter-selected-close: @color1;											/* Color para botón de cerrar en filtro seleccionado */
@form-input-color: @color3;													/* Color para texto en input */
@form-label-color: @color3;													/* Color para label de form */
@pager-color-inactive: @color4;												/* Color para item de pager inactivo */
@pager-color-active: @color2;												/* Color para item de pager activo */
@outstock-color: @color1;													/* Color de texto de fuera de stock */
@button-category-link-color: @color2;										/* Color link en categoría */
@button-category-link-color-hover: @color1;									/* Color link hover en categoría */
@image-hover-color: @color3;												/* Color para título en efecto de hover en imagen */
@image-paragraph-color: @color3;											/* Color para párrafo en imagen */
@cocarda-color: @color1;													/* Color para cocarda */
@button-image-link-color:@color1;
@button-image-link-color-hover:@color3;
@button-checkout-gnal-color: @color3;										/* Color input Checkout */
@product-social-color: @color4;												/* Color link social en producto */
@product-social-color-hover: @color3;										/* Color link social en producto en hover */
@product-ask-color: fade(@color4, 60%);										/* Color botón de consultar producto */
@product-ask-color-hover: @color4;											/* Color botón de consultar producto hover*/
@button-continue-shop-color: fade(@color4, 60%);							/* Color botón seguir comprando*/
@button-continue-shop-color-hover: @color4;									/* Color hover botón seguir comprando*/
@newsletter-form-label: @color1;											/* Color texto label newsletter form */
@newsletter-button-color: @color3;											/* Color texto de botón */
@newsletter-input-color: @color4;											/* Color texto input para newsletter */
@footer-credits-color: @color1;												/* Color texto créditos en footer */


/*BORDES*/

@border-product-color: @color3;												/* Borde de Productos */
@border-product-button-color: @color2;										/* Borde de botón de producto */
@border-product-button-color-hover: @color2;								/* Borde de botón de producto en hover */
@footer-separate-color: fade(@color3, 15%);									/* Borde para líneas de footer */
@category-border: @color4;													/* Borde para item de categoria */
@category-border-hover: @color4;											/* Borde para item de categoria */
@border-tabs: fade(@color3, 15%);											/* Borde para tabs */
@filter-border: fade(@color3, 30%);											/* Borde filtro de listado */
@filter-handler-border: fade(@color3, 20%);									/* Borde handler de filtro */
@filter-input-border-color: @color3;										/* Borde input de filtros */
@header-cart-border: @color3;												/* Borde para carrito en header */
@header-search-border: fade(@color3, 10%); 									/* Borde para buscador en header */
@header-border-bottom: fade(@color4,50%);									/* Borde inferior para navbar en responsive*/
@slideshow-product-border-color:@color3;									/* Borde btn en carusel */
@slideshow-product-border-color-hover: @color3;								/* Borde btn en hover en carusel */
@input-border: fade(@color3, 20%); 											/* Borde para inputs */
@border-category-button-color: @color2;										/* Borde botón de categoría */
@border-category-button-color-hover: @color2;								/* Borde botón de categoría */
@link-menu-nav-border: @color3;												/* Borde de item de menú */
@link-menu-nav-border-active: @color2;										/* Borde de item de menú activo */
@border-product-color-hover: @color4;
@slideshow-border: @color3;													/* Borde para info en carousel */
@slideshow-border-hover: @color3;											/* Borde para info en carousel */
@image-hover-border: @color3;												/* Borde efecto hover img */
@image-border: @color4;
@border-image-button-color: @color3;
@border-image-button-color-hover:@color4;
@form-button-border: @color2;												/* Borde de botón de formulario */
@form-button-border-hover: @color2;											/* Borde de botón de formulario en hover*/
@product-social-icon-border: fade(@color3, 15%);							/* Borde botón social en producto */
@product-social-icon-border-hover: fade(@color3, 20%);						/* Borde botón social en producto hover */
@product-ask-border: fade(@color4, 70%);									/* Borde botón consultar producto */
@product-ask-border-hover: @color4;											/* Borde botón consultar producto hover */
@border-continue-shop-color: fade(@color4, 60%);							/* Borde Seguir Comprando */
@border-continue-shop-color-hover: @color4;									/* Borde hover Seguir comprando */
@button-add-border: fade(@color4, 90%);										/* Borde botón agregar producto */
@button-add-border-hover: @color4;											/* Borde botón agregar producto hover*/
@line-separate-product: fade(@color4,50%);									/* Borde color línea en producto */
@product-tag-border: fade(@color4,70%);										/* Borde de selector de atributos en producto */
@product-tag-border-span: fade(@color4,50%);								/* Borde de selector de atributos en producto */
@newsletter-input-border-color: transparent;								/* Borde input newsletter */
@header-cart-button-border: @color3;										/* Borde botón para ir a carrito en header */
@header-checkout-button-border: @color3;									/* Borde botón para ir a checkout en header */


/*BORDES ANCHO*/

@border-product-button-width: 1px;											/*Ancho para botón de producto*/
@border-menu-width:1px;
@border-category-height:1px;
@border-product-button-height:1px;


/*EDITOR*/

@editor-border-main-over: @color1;											/* Borde para elemento principal en hover */
@editor-border-element: @color1;											/* Borde para elementos internos cuando principal esta en hover */
@editor-border-element-hover: @color1;										/* Borde para elemento interno en hover */


/*RESPONSIVE*/

@menu-nav-bkgnd-responsive: @color1;										/* Background menu nav en responsive */
@menu-nav-color-responsive: @color2;										/* Color de link en responsive */
@menu-nav-color-responsive-active: @color2;									/* Color de link en responsive para activo */
@header-cart-count-responsive: darken(@color4,20%);							/* Color de círculo cantidad en responsive */
@header-cart-count-color-responsive: @color1;								/* Color de cantidad en responsive */
@header-cart-link-color-responsive: darken(@color4,20%);					/* Color carrito en responsive */

/* OPACIDAD */

@category-over-opacity: 0.6;												/* Opacidad para over en categoría */
@product-over-opacity: 0.6;													/* Opacidad para over en producto */
@image-over-opacity: 0.6;
@medio-pago-transparencia: 0.6;                                               /* Transparencia default medios de pago */

/* BORDER RADIUS */

@button-border-radius: 3px;													/* Valor de borde redondeado de botones */

/* FIXED HEADER */

@header-fixed-background-color: @color1;									/* Color bkgnd para header en fixed */
@header-fixed-scroll-background-color: @color1;								/* Color bkgnd para header en fixed con scroll */
@header-fixed-border: @color1;												/* Color borde inferior para header en fixed */
@header-fixed-shadow: fade(@color3, 20%);									/* Color sombra inferior para header en fixed */