html,
body {   
  width: 100%;
  display: table;
  margin: 0 auto;
  
  /* ACTIVAR Y PERSONALIZAR*/
  background-color:#3f1d4c;


}
#chat2-negro{
	background-color:#000;
	background-image:url(../jpg/chat-negro.gif);
	background-repeat:no-repeat;
	background-position:5px 5px;
	width:110px;
	height:32px;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	float:right;
	margin-top:7px;
	color:#FFF;
	font-size:13px;
	padding-right:10px;
	font-weight:700;
	cursor:pointer;
	opacity:0.7;
	position:fixed;
	padding-top:13px;
	right:0;
	bottom:0;
	z-index:10;
	text-align:right;
	webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.30);
	-moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.30);
	box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.30);
	-webkit-transition:  all .5s ease;
	-moz-transition:  all .5s ease;
	-o-transition:  all .5s ease;
	transition: all .5s ease;
}
#chat2-conectado{
	background-color:#6ba801;
	background-image:url(../jpg/chat-conectado.gif);
	background-repeat:no-repeat;
	background-position:5px 5px;
	width:110px;
	height:32px;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	float:right;
	margin-top:7px;
	color:#FFF;
	font-size:13px;
	padding-right:10px;
	font-weight:700;
	cursor:pointer;
	opacity:0.7;
	position:fixed;
	padding-top:13px;
	right:0;
	bottom:0;
	z-index:10;
	text-align:right;
	webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.30);
	-moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.30);
	box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.30);
	-webkit-transition:  all .5s ease;
	-moz-transition:  all .5s ease;
	-o-transition:  all .5s ease;
	transition: all .5s ease;
	
	visibility:hidden;
	display:none;
}
#chat2-negro p, #chat2-espera p{
	color:#fff;
	font-weight:400;
	visibility:hidden;
	display:none;
	padding:0;
	margin:0;
	margin-top:10px;
	font-size:13px;
	text-align:left;
	width:calc(100% - 10px);
	padding-left:10px;
	padding-right:10px;
	margin-right:-10px;
	background-color:#e13a03;
	height:76px;
	padding-top:15px;
	border-top:2px;
	border-top-color:#fc7446;
	border-top-style:solid;
	-webkit-transition:  all .5s ease;
	-moz-transition:  all .5s ease;
	-o-transition:  all .5s ease;
	transition: all .5s ease;
}
#chat2-negro:hover p, #chat2-espera:hover p{
	visibility:visible;
	display:block;
	-webkit-transition:  all .5s ease;
	-moz-transition:  all .5s ease;
	-o-transition:  all .5s ease;
	transition: all .5s ease;
}
#chat2-negro:hover{
	/*width:140px;*/
	height:120px;
	opacity:100;
	-webkit-transition:  all .5s ease;
	-moz-transition:  all .5s ease;
	-o-transition:  all .5s ease;
	transition: all .5s ease;
}
#chat2-espera:hover{
	/*width:140px;*/
	height:110px;
	opacity:100;
	-webkit-transition:  all .5s ease;
	-moz-transition:  all .5s ease;
	-o-transition:  all .5s ease;
	transition: all .5s ease;
}
#chat2-espera{
	visibility:hidden;
	display:none;
	
	background-color:#f05a28;
	background-image:url(../jpg/chat-espera.gif);
	background-repeat:no-repeat;
	background-position:5px 5px;
	width:140px;
	height:32px;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	float:right;
	margin-top:7px;
	color:#FFF;
	font-size:13px;
	padding-right:10px;
	font-weight:700;
	cursor:pointer;
	opacity:0.8;
	position:fixed;
	padding-top:13px;
	right:0;
	bottom:0;
	z-index:10;
	text-align:right;
	webkit-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.30);
	-moz-box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.30);
	box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.30);
	-webkit-transition:  all .5s ease;
	-moz-transition:  all .5s ease;
	-o-transition:  all .5s ease;
	transition: all .5s ease;
}
#chat2-blanco{
	background-color:#ece9e4;
	background-image:url(../jpg/chat-blanco.gif);
	background-repeat:no-repeat;
	background-position:5px 5px;
	width:80px;
	height:32px;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	float:right;
	margin-top:7px;
	color:#FFF;
	font-size:13px;
	padding-right:10px;
	font-weight:700;
	cursor:pointer;
	margin-left:5px;
	opacity:0.7;
	position:fixed;
	padding-top:13px;
	right:0;
	bottom:0;
	z-index:10;
	text-align:right;
	-webkit-transition:  all .5s ease;
	-moz-transition:  all .5s ease;
	-o-transition:  all .5s ease;
	transition: all .5s ease;
}
#chat2-blanco p{
	color:#fff;
	font-weight:400;
	visibility:hidden;
	display:none;
	padding:0;
	margin:0;
	text-align:left;
	margin-top:10px;
	font-size:12px;
}
#chat2-blanco:hover p{
	visibility:visible;
	display:block;
}
#chat2-blanco:hover{
	width:120px;
	height:90px;
	opacity:100;
	-webkit-transition:  all .5s ease;
	-moz-transition:  all .5s ease;
	-o-transition:  all .5s ease;
	transition: all .5s ease;
}
#titu-general{
	/*width:auto;*/
	text-align:left;
	float:left;


}
#titu-general h1{
	font-size:20px;
	font-weight:700;
	color:#fff; /*Personalizado*/
	text-transform:uppercase;
	
	
	padding:0px;
	border:0px;
	border-style:solid;
	border-color:#FFF;
	letter-spacing:6px;
	font-family: 'Lora', sans-serif;!important /*Indico la fuente solo una vez*/ /*Personalizado*/
	


}/*Utilizado para el titu de Solicitar clave*/
.titu-general{
	width:100%;
	text-align:left;
	
}
.titu-general h1{
	font-size:20px;
	font-weight:700;
	color:#fff; /*Personalizado*/
	text-transform:uppercase;
	
	padding:0px;
	border:0px;
	border-style:solid;
	border-color:#FFF;
	letter-spacing:3px;
	font-family: 'Lora', sans-serif;!important /*Indico la fuente solo una vez*/ /*Personalizado*/
	
	margin:0px;
	/*padding:0px;*/
	float:left;
	

}
#titu-general2{
	width:80%;
	text-align:left;
	margin-top:120px;
	clear:left;
	margin-left:10%;!important /*Utilizado para el titulo del carrito*/

}
#titu-general2 h1{
	font-size:20px;
	font-weight:700;
	color:#fff; /*Personalizado*/
	text-transform:uppercase;
	
	padding:0px;
	border:0px;
	border-style:solid;
	border-color:#FFF;
	letter-spacing:3px;
	font-family: 'Lora', sans-serif;!important /*Indico la fuente solo una vez*/ /*Personalizado*/
	
	margin:0px;
	/*padding:0px;*/
	float:left;
	
	

}

#IrArriba{
	display:none;
position: fixed;
z-index:2;
bottom: 140px; /* Distancia desde abajo */
right: 10px; /* Distancia desde la derecha */

}
#IrArriba span {
width: 50px; /* Ancho del botón */
height: 50px; /* Alto del botón */
display: block;
background-image:url(../jpg/icon_top.png);
background-repeat:no-repeat;
background-position:center;

}
#total2{
	background-color:#cc0000; /*Personalizado*/
	border-top-left-radius:0px;
	border-bottom-left-radius:0px;
	-moz-border-top-left-radius:0px;
	-moz-border-bottom-left-radius:0px;
	-webkit-border-top-left-radius:0px;
	-webkit-border-bottom-left-radius:0px;
	position: fixed;
	bottom: 45%;
	right: 0px;
	font-size:17px;
	font-weight:bold;
	color:#FFF; /*Personalizado*/
	line-height:20px;
	text-align:center;
	padding:15px;
}
#aviso-enlista{
	background-color:#38a971; /*Personalizado*/
	border-top-left-radius:20px;
	border-bottom-left-radius:20px;
	-moz-border-top-left-radius:20px;
	-moz-border-bottom-left-radius:20px;
	-webkit-border-top-left-radius:20px;
	-webkit-border-bottom-left-radius:20px;
	position: fixed;
	bottom: 35%;
	right: 0px;
	font-size:15px;
	font-weight:400;
	color:#FFF; /*Personalizado*/
	line-height:20px;
	text-align:center;
	padding:15px;
}

@media only screen and (max-width: 1200px) {	
#titu-general2{
	width:80%;
	text-align:left;
	margin-top:160px;
	clear:left;
	margin-left:10%;!important /*Utilizado para el titulo del carrito*/

}	
}

@media (max-width: 860px) {

#titu-general2{
	width:80%;
	text-align:left;
	margin-top:160px;
	clear:left;
	margin-left:10%;!important /*Utilizado para el titulo del carrito*/

}
}
@media (max-width: 768px) {
#chat2-negro, #chat2-espera{
	width:80px;
	height:32px;
	
}
#chat2-negro:hover, #chat2-espera:hover{
	width:80px;
	height:32px;
	
}
#titu-general2{
	width:80%;
	text-align:left;
	margin-top:160px;
	clear:left;
	margin-left:10%;!important /*Utilizado para el titulo del carrito*/

}
#chat2-negro p, #chat2-negro:hover p, #chat2-espera p, #chat2-espera:hover p, #chat2-blanco p, #chat2-blanco:hover p, #chat2-conectado p, #chat2-conectado:hover p{
	visibility:hidden;
	display:none;
}
}
@media (max-width: 600px) {
	
#IrArriba {
position: fixed;
bottom: 70px; /* Distancia desde abajo */
right: 5px; /* Distancia desde la derecha */
}
}
@media (max-width: 420px) {
	
#titu-general2{
	width:90%;
	text-align:left;
	margin-top:160px;
	clear:left;
	margin-left:5%;!important /*Utilizado para el titulo del carrito*/

}
#titu-general2 h1{
	font-size:17px;
	font-weight:400;

}
.titu-general h1{
	font-size:17px;
	font-weight:400;
	margin:0px;
	padding:0px;
	float:left;

}
#titu-general h1{
	font-size:17px;

}
}