/* FUENTE DE GOOGLE */


@import url('https://fonts.googleapis.com/css?family=Fira+Sans+Condensed&display=swap'); /* <===================== TODO SITIO CAMBIAR  */

@import url('https://fonts.googleapis.com/css?family=Bangers&display=swap'); /* <===================== CAMBIAR  */


@import "https://fonts.googleapis.com/css?family=Khand:300,400,600"; /* <===================== SLIDER Y CATALOGO */


/****************************************GENERAL**************************************/
.info-general-florsis { /*Contenedor texto emergencia NO CAMBIAR*/
	background-color: #E4EA1C;
	color:#000;
	margin-bottom:0px;
	border-radius: 20px;
	max-width:700px;
	padding:5px;
	margin-left:10px;
	margin-right:10px;

}

body {
	
  font-family: 'Fira Sans Condensed', sans-serif; /* <===================== CAMBIAR  */
  letter-spacing: 0px; 
  padding-top: 0px;
  padding-bottom: 0px;
  overflow-x: hidden; /*eliminio el scroll horizontal*/
}

/*.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../img/loading_pagina.gif') 50% 50% no-repeat rgb(249,249,249);
    opacity: .9;
}
*/


.letra_titulo_catalogo {
font-family: 'Khand', cursive; /* <===================== CAMBIAR  */
font-size: 30px; /* <===================== CAMBIAR  */
color:#FF2222;
letter-spacing:1px;
}




/***********************color de todos link */
a {
    color:#1F315F;
}

.centrar_horizontal_vertical  {

    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);

}

.cover_imagen {
   object-fit: cover;
   width: 100%;
   height: 100%; 
   position: 50% 50%;
}


/*Saco negrita a todos los lavel*/
label {
    font-weight: normal !important;
}

/*Saco bordes a imagenes thubnail*/
.img-thumbnail{
	border:none;
	padding:0;
}

/*Escondo recaptcha logo*/
.grecaptcha-badge{
display:none !important;
}


.sombra {
-webkit-box-shadow: 10px 10px 5px -8px rgba(161,161,161,1);
-moz-box-shadow: 10px 10px 5px -8px rgba(161,161,161,1);
box-shadow: 10px 10px 5px -8px rgba(161,161,161,1);
}

/*icons como @ */
.inner-addon { 
    position: relative; 
}

/* style icon */
.inner-addon .glyphicon {
  position: absolute;
  padding: 10px;
  pointer-events: none;
}

/* align icon */
.left-addon .glyphicon  { left:  0px;}
.right-addon .glyphicon { right: 0px;}

/* add padding  */
.left-addon input  { padding-left:  30px; }
.right-addon input { padding-right: 30px; }

/************/


/* loading animado para carga de proceso en espera ajax*/
.animar_loading {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 .7s infinite linear;
	color:#009933; /****************************** <=====   CAMBIAR AQUI  */
	
}

@-webkit-keyframes spin2 {
    from { -webkit-transform: rotate(0deg);}
    to { -webkit-transform: rotate(360deg);}
}

@keyframes spin {
    from { transform: scale(1) rotate(0deg);}
    to { transform: scale(1) rotate(360deg);}
}
/****************************************************************************/


.info-general { /*Contenedor texto emergencia*/
	background-color:#FF2222;
	color:#FFFFFF;
	margin-bottom:0px;
	border-radius: 20px;
	max-width:500px;
	padding:5px;
	margin-left:10px;
	margin-right:10px;

}




.fondo_cabecera {
	background-color:#FFFFFF;  /* <===================== CAMBIAR  */
	color: #666;
}

/****************************************FIN GENERAL**************************************/










/***********************************CARRO**********************************************/

.circulo_items_carro { /*Se muestra el total de items comprados*/
position:absolute;
top:20px;
left:20px;
margin-right:5px;
margin-left:5px;
width: 1rem;
height: 1rem;
border-radius: 50%;
background:#FFD7D7; /*******************<===== CAMBIAR AQUI **************/
display: flex;
justify-content: center;
align-items: center;
text-align: center;
margin:0px auto;
padding:10px;
color:#666;
text-decoration:none;
}

.liston_subtotal_carro{
background-color:#000028;  /* <===================== CAMBIAR  */
color:#FFFFFF;  /* <===================== CAMBIAR  */
padding:20px;

}

.pasos_redondos{
background-color:#FF2222;  /* <===================== CAMBIAR  */
font-size:24px;
color:#FFFFFF; 
text-align:center;
padding:10px;
height:40px;
width:40px;
border-radius:200px;
float: left;
display: flex;
justify-content: center;
align-items: center;
text-align: center;

}

/*************************************************************************************/










/****************************************SLIDER*************************************/

.letra_titulo_slider {
font-family: 'Khand', cursive; /* <===================== CAMBIAR  */
font-size: 40px; /* <===================== CAMBIAR  */
color:#FFF;
}


.letra_resumen_slider {
font-family: 'Khand', cursive; /* <===================== CAMBIAR  */
font-size: 18px; /* <===================== CAMBIAR  */
color:#FF2222;

}

.btn_slider {
    border: solid 2px #fff;/* <===================== CAMBIAR  */
	background-color:#FF2222; /* <===================== CAMBIAR  */
	color: #fff;/* <===================== CAMBIAR  */
	font-size: 16px;
	text-transform: uppercase;
	font-weight: 400;
	margin: 5px 0 0;
	font-weight: 600;
	transition: all 0.3s ease 0s;
}

.btn_slider:hover {
	 border: solid 2px #fff;/* <===================== CAMBIAR  */
	background: none;
	color:#fff;  /* <===================== CAMBIAR  */
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
}



/*FONDO CAPTION CARRUSEL */
.carousel-caption {
   /*background: rgba(0, 0, 0, 0.4); 
	top:5%;*/
    max-width: 500px;
		
}

/*imagen ajustable CARRUSEL */
/* .carousel-inner .item{
	
    width: 100%;
    height: 500px;  <===================== CAMBIAR  
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	cursor: pointer;
 
}*/

/*******************CONTROL LEFT Y RIGHT***/
.control_slider {
	font-size: 40px;
	-webkit-transition: all 0.6s;
	transition: all 0.6s;
	color: #fff;/* <===================== CAMBIAR  */
	

}

/*******************SACAR SOMBRA A FLECHAS DE CARRUSEL***/
.carousel-control {
    background-image:none !important;
    filter:none !important;
}

.oscuridad_slider {
 position:absolute;
 background-color: rgba(0,0,0,0); /*****0.2  hacia arriba para dar oscuridad**/
 filter:brightness(0);
 width:100%;
 height:100%;
 
}

/*****************************************FIN SLIDER*************************************/











/*******************************CONTROL RESPONSIVE********************************/
/* al achicarse */
@media (max-width:600px) {

	.letra_titulo_slider {
	font-size: 16px;
	}

	.letra_resumen_slider {
	font-size: 12px;
	}
	
	.btn_slider  {
	font-size:10px;
    }

	.ver_controles {
	display:none;
	}
	
	.carousel-caption {
	top:0;	
    }

	

}



/* al agrandarse */
@media screen and (min-width:993px) {

		#enlaces_pie {
		display:none;
		}
		
		#cabecera {
		display:block;
		}

		/*SEPARACION DE ELEMENTOS AL TOP */
		.separacion_top {
		margin-top:80px;
		}	
		
		

}
		
/*********************************************+++ AL ACHICARSE LA PAGINA */
@media screen and (max-width:992px) {

			#cabecera {
			display:none;
			}
			
			#enlaces_pie {
			display:block;
			}	

			/*SEPARACION DE ELEMENTOS AL TOP */
			.separacion_top {
			margin-top:63px;
			}
			
			#menu_lateral_fijo_contenedor {
			display:none;
			}
			
			
			#menu_lineas { /**************MENU DE LINEAS DEL MENU RESPONSIVE*****/
			display:none;
			}
			
			
 }

/*******************************FIN CONTROL RESPONSIVE********************************/












/***********************************************PIE DE PAGINA*/
footer {
	/*background-image:url(../img/fondo_pie.jpg);*/
	/*degrade 
    background: -webkit-linear-gradient(#464646,#353535); 
    background: -o-linear-gradient(#464646,#353535); 
    background: -moz-linear-gradient(#464646,#353535); 
    background: linear-gradient(#464646,#353535); 
	*/
	background-color: #CB299A; /* <===================== CAMBIAR  */

    color: #fff; /* <===================== CAMBIAR  */
    min-height:100px;
    padding-top:20px;
    padding-bottom:10px;
	margin-top:80px;
	
}
footer .nav>li>a {
    padding:3px;
    color:#FFF; /* <===================== CAMBIAR  */
	 padding-bottom:10px;
	
}

footer .nav>li>a:hover {
    background-color: transparent; /*AL PASAR EL MOUSE POR EL MUNU DE PIE DE PAGINA */
	
	color:#fff;/* <===================== CAMBIAR  */
	
}

footer .nav>li> a:focus {
  background-color: transparent;
  
}


/***************************************FIN PIE ***************************************/












/*********************************************TITULOS **********************************/

.precio {
	font-size: 26px;
	text-align:center;
	color: #666; 
	
	}
.precio_agregamas {
	font-size: 24px;
	text-align:center;
	color: #999; 
	
	}
	
.Estilo_nombre {	
	font-size: 12px;
	color: #666666;
}


.agotado  {
	color:#FF2222;  /* <===================== CAMBIAR  */
	border-radius:0;
	font-size:14px;
}


.terecomendamos {
    
	color: #F09;/* <===================== CAMBIAR  */
	font-size:16px;
	
	
}

.titulos_pie {
	margin-top:10px;
	margin-bottom:10px;
	
}
/*********************************************FIN TITULOS **********************************/














/**********************************ESTILO PAGINACION ************/

.pagination2>li>a,
.pagination2>li>span {
  
  color: #FF2222;  /* <===================== CAMBIAR  */
  background-color:#fff;  /* <===================== CAMBIAR  */
}
.pagination2 > li > a:focus,
.pagination2 > li > a:hover,
.pagination2 > li > span:focus,
.pagination2 > li > span:hover {
   
    color: #FFF;  /* <===================== CAMBIAR  */
    background-color: #FF2222;  /* <===================== CAMBIAR  */
   
}

/********************************** FIN ESTILO PAGINACION ************/












/********************************************************* BOTONES */

/* BOTON QUE APARECE AL BAJAR SCROLL */
.arrowtop{
	width: 60px;
	height: 60px;
	position: fixed;
	bottom: 40%;
	right: 20px;
	display: none;
	text-indent: -9999px;
	background: url(../img/up.png) no-repeat;
	cursor: pointer;
	z-index:1002;
}

.btn_comprar  {  /* <===================== CAMBIAR  */
	color: #3399FF;
	border-color:#3399FF;
	border-radius:10;
	font-size:14px;
	background-color:#FFF;
	
}

.btn_comprar:hover {   /* <===================== CAMBIAR  */

	background-color: #3399FF;
	color: #FFF;
	 -webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}


.btn_ver_detalles  {
	border: solid 1px #909;/* <===================== CAMBIAR  */
	color: #000028;/* <===================== CAMBIAR  */
	background: none;
	border-radius:0px;
	font-size: 14px;
	text-transform: uppercase;
	margin: 5px 0 0;
	font-weight: 600;
	transition: all 0.3s ease 0s;
	z-index:1;
	}

.btn_ver_detalles:hover {  /* <===================== CAMBIAR  */
	color: #FFF;
	background-color: #909;
	border:0px;
	 -webkit-transition: all ease 0.9s;
	-moz-transition: all ease 0.9s;
	transition: all ease 0.9s;
	
}

.btn_comprar_sin_registro {
    border: solid 1px #909;/* <===================== CAMBIAR  */
	color: #000028;/* <===================== CAMBIAR  */
	background: none;
	font-size: 24px;
	font-weight: 400;
	margin: 5px 0 0;
	font-weight: 600;
	transition: all 0.3s ease 0s;
}

.btn_comprar_sin_registro:hover {
	background-color: #390; /* <===================== CAMBIAR  */
	color:#FFF;  /* <===================== CAMBIAR  */
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
}


.btn_redes_sociales {  /* <===================== CAMBIAR  */
	font-size: 24px;
	-webkit-transition: all 0.6s;
	transition: all 0.6s;
	color:#FFF ;/* <===================== CAMBIAR  */
	background:#909;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	line-height: 40px;
	margin-bottom:5px;	
	
}

.btn_redes_sociales:hover {  /* <===================== CAMBIAR  */
	background-color: #FC0;
	color: #fff;	
}

.btn_ws {  /* <===================== CAMBIAR  */
	font-size: 24px;
	-webkit-transition: all 0.6s;
	transition: all 0.6s;
	color:#fff ;/* <===================== CAMBIAR  */
	background: #3DA831;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	line-height: 40px;
	margin-bottom:5px;	
	
}

.btn_ws:hover {  /* <===================== CAMBIAR  */
	background-color: #DCFAF5;
	color: #3DA831;	
}








/**************************************BUSCADORES***********/

.btn_buscar  {  /* <===================== CAMBIAR  */
	background-color:transparent;
	
}


.btn_buscar:hover {  /* <===================== CAMBIAR  */
	
	background-color:transparent;
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}


.caja_buscar_modal{
	
	font-size:24px;
	border-color: #909; /* <===================== CAMBIAR  */
	color:#909; /* <===================== CAMBIAR  */
	height:50px;
	border-radius:0;
	text-align:center;

}



.li_buscar_principal{
	
	margin-top:15px;
	font-size:16px;
	color:#909; /* <===================== CAMBIAR  */

}



#buscar1{
	
width:350px; 


}







/********************************************************/




.btn_servicio {  /* <===================== CAMBIAR  */
	background-color: #018A29;
	color: #fff;
	border-radius:0;
	font-size:14px;

}

.btn_servicio:hover {  /* <===================== CAMBIAR  */
	background-color:#9BC04A;
	color: #FFF;
	 -webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}

.close  {
	color: #000;
	font-size:36px;
}


.btn_agotado {
	color: #FF2222;  /* <===================== CAMBIAR  */
	background-color: transparent;
	text-decoration:none;
	font-size:14px;

}

.btn_agotado:hover {

	text-decoration:none;
	
}

.btn_categorias_sidebar {
	color: #909;  /* <===================== CAMBIAR  */
	/*border-color:#FFF;*/
	border: solid 1px #909;/* <===================== CAMBIAR  */
	font-size:24px;
	background-color: transparent;  /* <===================== CAMBIAR  */
	
}


.btn_categorias_sidebar:hover {

	background-color: transparent;  /* <===================== CAMBIAR  */
	color: #000;  /* <===================== CAMBIAR  */
	-webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}

/*********************************************************FIN  BOTONES */












/**************************** DESTACADOS Y DESCUENTOS CONTENEDOR PRODUCTO / LISTON IMAGENES CATEGORIAS ******************/

.liston_oferta_producto{
position:absolute;
color:#FFF;  /* <===================== CAMBIAR  */
margin-right:5px;
margin-left:5px;
font-size:10px; 
margin-top:0px; 
z-index:1;
background-color: #F06;   /* <===================== CAMBIAR  */
padding:2px;
text-align:center;
display: flex;
justify-content: center;
align-items: center;
padding:2px;
width:50px;
height:30px;

}

.liston_descuento_producto{
position:absolute; 
right:10%;
margin-top:30%; 
background-color: #FF8306;  /* <===================== CAMBIAR  */
color:#FFFFFF;  /* <===================== CAMBIAR  */
z-index:1;
text-align:center;
display: flex;
justify-content: center;
align-items: center;
padding:2px;
width:50px;
height:30px;

}
   
.liston_descuento_categoria{
position:absolute; 
right:10%;
margin-top:30%; 
background-color:#FF8306;  /* <===================== CAMBIAR  */
color:#FFFFFF;  /* <===================== CAMBIAR  */
z-index:1;
text-align:center;
display: flex;
justify-content: center;
align-items: center;
padding:2px;
width:50px;
height:30px;
}

/********************************************************************************/









/*********************************SECCION CATEGORIAS CON IMAGENES*************/

.liston_descuento_categoria_seccion{
position:absolute; 
right:0;
margin-top:0; 
background-color:#FF8306;  /* <===================== CAMBIAR  */
font-size:24px;
color:#FFFFFF;  /* <===================== CAMBIAR  */
z-index:1;
text-align:center;
display: flex;
justify-content: center;
align-items: center;
padding:2px;
width:auto;

}


.liston_nombre_categoriaOK SIN MARCO{
position:absolute; 
z-index:2; 

font-family: 'Bangers', cursive; /* <===================== CAMBIAR  */
font-size: 18px; /* <===================== CAMBIAR  */
color:#00CCFF;

    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);

}


.liston_nombre_categoria{
position:absolute; 
z-index:2; 

	border: solid 1px #fff;/* <===================== CAMBIAR  */
	color: #fff;/* <===================== CAMBIAR  */
	
	background-color: rgba(0,0,0,0.2);
	
	font-size: 16px;
	text-transform: uppercase;
	font-weight: 400;
	margin: 5px 0 0;
	font-weight: 600;
	transition: all 0.3s ease 0s;
	padding:10px;

    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
	
	
	

}

/*********************************FIN SECCION CATEGORIAS CON IMAGENES*************/








/**************************************BUSQUEDA AUTO COMPLETA BUSQUEDA PRINCIPAL*/

#sugerencias1 {
box-shadow: 2px 2px 8px 0 rgba(0,0,0,.2);
height: auto;
position: absolute;
top: 45px;
z-index: 9999;
max-width:500px;
    					
}
 
#sugerencias1 .sugerencia-element1 {
background-color: #FFF;
border-top: 1px solid #d6d4d4;
cursor: pointer;
padding: 8px;
width: 100%;
float: left;
}

/*************************************************************************************/



/**************************************BUSQUEDA AUTO COMPLETA MODAL*/

#sugerencias {
box-shadow: 2px 2px 8px 0 rgba(0,0,0,.2);
height: auto;
position: absolute;
top: 45px;
z-index: 9999;
max-width:300px;
    					
}
 
#sugerencias .sugerencia-element {
background-color: #FFF;
border-top: 1px solid #d6d4d4;
cursor: pointer;
padding: 8px;
width: 100%;
float: left;
}

/*************************************************************************************/











/***********************INPUT ORDENAR DE MAYOR A MENOR********************** */

.caja_ordenar {
	height:40px;
	/*width:200px; */
	text-align:center;
	border-radius:0;
    color:#999;
}

/*************************************************************/











/************************CONTENEDOR ICONOS MOVILES PIE DE PAGINA */
div#enlaces_pie 
{
bottom: 0;
background-color:#FFF;
position:fixed;
padding:10px;
width:100%;
font-size:30px;
z-index:1001;
}

/************************ FIN CONTENEDOR ICONOS MOVILES PIE DE PAGINA */












/************************ESTILOS MAS Y MENOS CANTIDAD PRODUCTO FICHA**************************/
  
.caja_cantidad {
	height:40px;
	width:10px;
	text-align:center;
	border-radius:0;
    color:#666;	
}

input[readonly].caja_cantidad{
  background-color:transparent;
  border: 0;
  font-size:18px;
  
}

/************************FIN ESTILOS MAS Y MENOS CANTIDAD PRODUCTO FICHA**************************/






/***************************************CHECK Y RADIO SITIO********************/
.switch_sis {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
  
}
/* Hide default HTML checkbox */
.switch_sis input {display:none;}

/* The slider */
.slider_sis {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider_sis:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider_sis {
  background-color:#FF2222; /* COLOR FONDO */  /* <===================== CAMBIAR  */
}

input:focus + .slider_sis {
  box-shadow: 0 0 1px #018A29; 
}

input:checked + .slider_sis:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider_sis.round {
  border-radius: 34px;
}

.slider_sis.round:before {
  border-radius: 50%;
}

/***************************************FIN CHECK Y RADIO SITIO********************/









/********************************DIV QUE CONTIENE BOTON ATRAS Y PAGAR EN LA FICHA Y FORMULARIO***********************/

div#pie_ficha 
{
bottom:0;
position:fixed;
margin-top:20px;
margin-bottom:20px;
width:100%;
z-index:102;

}

/****************************************************************************************/











/********************************************************* TOLTIP */
/* Tooltip container */
.tooltip1 {
  position: relative;
  display: inline-block;
  /*border-bottom: 1px dotted black;  If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip1 .tooltiptext1 {
  visibility: hidden;
  width: 120px;
  background-color: #CCC;  /************ <------ CAMBIAR AQUI   */
  color: #000;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;

  /* Position the tooltip text */
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;

  /* Fade in tooltip */
  opacity: 0;
  transition: opacity 0.3s;
}

/* Tooltip arrow */
.tooltip1 .tooltiptext1::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #ccc transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip1:hover .tooltiptext1 {
  visibility: visible;
  opacity: 1;
}

/****************************************************************************/










/********************EFECTO INPUT ANIMACION LABEL SE DESPLAZA*************/
fieldset {
  margin: 0;
  padding: 0;
  border: 0;
}

input {
 display: block;
  width: 100%;
  max-width:600px;
  background: transparent;
  height: 3em;
  padding: 16px 8px;
  border: 0;
  border-radius: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  outline: 0;
 border-bottom: 1px solid #CC0099; /**************<===CAMBIAR */
}

.form-label fieldset {
  position: relative;
}
.form-label fieldset:first-child input {
  border-radius: 4px 4px 0 0;
}
.form-label fieldset:last-child input {
  border-radius: 0 0 4px 4px;
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.15);
}
.form-label fieldset + fieldset {
  border-top: 0px solid #ddd;
}
.form-label label {
  position: absolute;
  top: 15px;
  left: 8px;
  color: #909090;
  -webkit-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
  transition: all 0.2s ease-in-out;
}

.form-css-label input[data-empty="false"], .form-css-label input:valid, .form-css-label input:focus {
  padding: 22px 8px 10px;
}
.form-css-label input:focus {
  outline: 0;

  border-bottom: 1px solid #CC0099; /*************<=== CAMBIAR AQUÍ */
  
 -webkit-transition :  border-bottom 250ms ease-in-out;
 -moz-transition:  border-bottom 250ms ease-in-out;
 transition :  border-bottom 250ms ease-in-out;
  
  
}


.form-css-label input[data-empty="false"] + label, .form-css-label input:valid + label, .form-css-label input:focus + label {
  /*color: #999; color texto animado*/
  
  
  font-weight: 700;
  font-size: 12px;
  -webkit-transform: translate3d(0, -10px, 0);
  transform: translate3d(0, -10px, 0);
}

*,
*:before,
*:after {
  box-sizing: border-box;
}


/***************************************************************************************/













/**********************TICKET ANIMADO OK PARA VENTANAS DE EXITO**********/

.checkmark__circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke: #7ac142;
  fill: none;
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.checkmark {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: #fff;
  stroke-miterlimit: 10;
  margin: 2% auto;
  box-shadow: inset 0px 0px 0px #7ac142;
  animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.checkmark__check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes scale {
  0%, 100% {
    transform: none;
  }
  50% {
    transform: scale3d(1.1, 1.1, 1);
  }
}
@keyframes fill {
  100% {
    box-shadow: inset 0px 0px 0px 30px #7ac142;
  }
}

/*******************************************************************************************************/










/**************************ESTILO PARA INPUT CHECK ACEPTA CONDICIONES, MISMOS DATOS Y MOSTRAR FACTURA**************/
.contendor_check {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
   
}

/* Hide the browser's default checkbox */
.contendor_check input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
  
}

/* Create a custom checkbox */
.checkmark_form {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  
}

/* On mouse-over, add a grey background color */
.contendor_check:hover input ~ .checkmark_form {
  background-color: #ccc;
  
}

/* When the checkbox is checked, add a blue background */
.contendor_check input:checked ~ .checkmark_form {
  background-color: #FF2222;   /*********************** <======= CAMBIAR AQUI */
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark_form:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.contendor_check input:checked ~ .checkmark_form:after {
  display: block;
}

/* Style the checkmark/indicator */
.contendor_check .checkmark_form:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/*****************************************************************************************/




/*******************************************EFECTO HOVER IMAGEN */

.view-sixth img {
   -webkit-transition: all 0.4s ease-in-out 0.5s;
   -moz-transition: all 0.4s ease-in-out 0.5s;
   -o-transition: all 0.4s ease-in-out 0.5s;
   -ms-transition: all 0.4s ease-in-out 0.5s;
   transition: all 0.4s ease-in-out 0.5s;
}
.view-sixth .mask {
   background: rgba(255,255,255,0.8);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.3s ease-in 0.4s;
   -moz-transition: all 0.3s ease-in 0.4s;
   -o-transition: all 0.3s ease-in 0.4s;
   -ms-transition: all 0.3s ease-in 0.4s;
   transition: all 0.3s ease-in 0.4s;
}

.view-sixth:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}
.view-sixth:hover img {
   -webkit-transition-delay: 0s;
   -moz-transition-delay: 0s;
   -o-transition-delay: 0s;
   -ms-transition-delay: 0s;
   transition-delay: 0s;
}


/* BORDE IMAGEN */
.view {
   width: auto;
   height: auto;
   margin: 0px;
   border: 0px;
   /*border: 1px solid #CCC; */
   overflow: hidden;
   position: relative;
   text-align: center;
   
   /*
   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6;
   */
   cursor: default;
   background: #fff;
}
.view .mask,.view .content {
   width: 100%;
   height: 100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view img {
   display: block;
   position: relative;
  
}

/***********************************************************FIN MASCARA IMAGEN/


/****************************RESPONSIVE IFRAME */
.responsive-video {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 60px; overflow: hidden;
}

.responsive-video iframe,
.responsive-video object,
.responsive-video embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/***************************FIN RESPONSIVE IFRAME***************/


/************************BOTON COMPRAR WEBPAY PRUEBA**********/

.btn_WEBPAYPRUEBA {
	color: #FFF;
	border-radius:0;
	font-size:18px;
	background-color:#F06;
}

.btn_WEBPAYPRUEBA :hover {

	background-color:#E41438;
	color: #FFF;
	 -webkit-transition: all ease 0.8s;
	-moz-transition: all ease 0.8s;
	transition: all ease 0.8s;
	
}










/********************************************MENU LATERAL FIJO*******************************************/
#menu_lateral_fijo {
	max-width:250px;
    top: 0;
    /*left: -250px; */
	background-color:#FFF;/*<========= CAMBIAR  */
    color: #fff;
    transition: all 0.3s;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}

#menu_lateral_fijo.active {
    left: 0;
}

/********************************TITULO DEL MENU*****/
#menu_lateral_fijo .menu_lateral_fijo-header {
    padding: 20px;
	background-color:#FFF;/*<========= CAMBIAR  */
    
}

/********************************FIN TITULO DEL MENU*****/

#menu_lateral_fijo ul.components {
    padding: 20px 0;
}


#menu_lateral_fijo ul li a {
    padding:10px;
	color:#000028; /*<========= CAMBIAR  */
    font-size: 0.8em;
    display: block;
	text-decoration:none;
}
#menu_lateral_fijo ul li a:hover {
    color:#FFF; /*<========= CAMBIAR  */
    background:#00CCFF; /*<========= CAMBIAR  */
	text-decoration:none;
}

/************TITULO CATEGORIA PRINCIPAL*********/
#menu_lateral_fijo ul li.active > a, a[aria-expanded="true"] {
    color: #fff; /*<========= CAMBIAR  */
    background: #FF2222; /*<========= CAMBIAR  */
	text-decoration:none;
}


a[data-toggle="collapse"] {
    position: relative;
}

a[aria-expanded="false"]::before, a[aria-expanded="true"]::before {
    content: '\e259';
    display: block;
    position: absolute;
    right: 20px;
    font-family: 'Glyphicons Halflings';
    font-size: 0.9em;
}
a[aria-expanded="true"]::before {
    content: '\e260';
}

/*********************************SUB MENU********/
ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #FFF; /*<========= CAMBIAR  */
}






/************************************* CONTROL DE SLIDER PARA PC Y MOVIL */

@media screen and (min-width:701px) { /********* AL AGRANDARSE LA PAGINA */
  #slider_grande {
    display: block;
  }
  
  #slider_chico {
    display: none;
  }

}
		

@media screen and (max-width:700px) { /*********** AL ACHICARSE LA PAGINA */
	
#slider_chico {
    display: block;
  }
  
  #slider_grande {
    display: none;
  }
  
  .carousel-caption {
  
	top:50%;
			
}
	
}



.colores_ficha{
font-size:18px;
color:#FFFFFF; 
text-align:center;
padding:10px;
height:40px;
width:40px;
border-radius:200px;
float: left;
display: flex;
justify-content: center;
align-items: center;
text-align: center;

}



.colores_chicos{
font-size:18px;
color:#FFFFFF; 
text-align:center;
padding:10px;
height:10px;
width:10px;
border-radius:200px;
float: left;
display: flex;
justify-content: center;
align-items: center;
text-align: center;

}




/******************************RADIO COLORES FICHA********/

/* Customize the label (the container) */
.container_color {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 12px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.container_color input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.checkmark_color {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container_color:hover input ~ .checkmark_color {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.container_color input:checked ~ .checkmark_color {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark_color:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.container_color input:checked ~ .checkmark_color:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.container_color .checkmark_color:after {
  top: 9px;
  left: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
}