/*RESET*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;} body {line-height: 1;}ol, ul{list-style:none;} blockquote, q{quotes:none;} blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;} :focus{outline:0;} ins{text-decoration:none;} del{text-decoration:line-through;} table{border-collapse:collapse; border-spacing:0;}

/*MAIN*/
body { 
	font-size: 1em;
	line-height: 1.25em;
	font-family: Helvetica Neue, Helvetica, Arial;
	background: #f9f9f9;
	color: #555;
}

a {

	color: #000000;
	text-decoration: none;
	font-weight: bold;

}

a:hover {

	color: #1f8ded;

}

imgx {

	width: 100%;

}

header {
	background-color: #ffffff;
	background: #ffffff;
	width: 100%;
	height: 76px;
	position: fixed;
	top: 0;
	left: 0;
	border-bottom: 4px solid #4C9CF1;
	z-index: 100;

}

#logo{
	margin: 20px;
	float: left;
	width: 200px;
	height: 45px;
	background: url(../img/logo.png) no-repeat center;
	display: block;


}

nav {

	float: right;
	padding: 20px;	
	
}


#menu-icon {

	display: hidden;
	width: 40px;
	height: 40px;
	background: #1f8ded url(../img/menu-icon.png) center;

}

a:hover#menu-icon {

	background-color: #0071bc;
	border-radius: 4px 4px 0 0;

}

ul {

	list-style: none;

}

li {

	display: inline-block;
	float: left;
	padding: 10px

}

.hoy {

	background: #E6E6E6;

}

.devolucion {

	background: #ffded7;

}

.finalizada {

	background: #b1f865;

}

.sociospanels {
    text-align: center;
    color: black;
border-spacing: 5px;
border: 1px solid black; padding: 5px;
}



.recovered {

	background: #3F9FFF;

}



.current {

	color: #000000;

}


.xmini {

	font-size: 12px;

}


section {
	background: #ffffff url(../img/bgs.png) center;
	margin: 80px auto 40px;
	max-width: 980px;
	position: relative;
	padding: 20px

}



h1 {

	font-size: 2.5em;
	color: #7f97ad;
	line-height: 1.15em;
	margin: 20px 0 ;

}

h2 {

	color: #8394a1;
	line-height: 1.45em;
	margin-bottom: 20px;

}


p {

	line-height: 1.45em;
	margin-bottom: 20px;

}

p2 {
	font-size: 1.2em;
	color: #8394a1;
	line-height: 1.45em;
	margin-bottom: 20px;

}


m {
	font-size: 1.7em;
	color: #ffffff;
	line-height: 1.45em;
	margin-bottom: 20px;

}

zx {
	color: #ffffff;
}


.fdate {

	font-size: 10px;
   	 color: #000000;

}


.newmid {

	font-size: 0.7em;
	color: BLACK;
		padding: 5px;
}

.newtitle {

	font-size: 1em;
	color: BLACK;
 font-weight: 600;
		padding: 10px;

}


.simplex {

	font-size: 1em;
	color: green;
}



.cupon_code {

	width: 350px;
	height: 55px;
	text-align: center;
	font-size: 40px;
	background-color: #ffffff;
	border: solid 1px #c9dff3;
	border-radius:3px;
   	 color: #000000;

}

.cupon_send {

	width: 180px;
	height: 55px;
	text-align: center;
	font-size: 40px;
	background-color: #1f8ded;
	border: solid 1px #1f8ded;
	border-radius:3px;
   	 color: #ffffff;
	margin-bottom: 10px;

}


.cupon_sendmini {

	width: 180px;
	height: 40px;
	text-align: center;
	font-size: 18px;
	background-color: #1f8ded;
	border: solid 1px #1f8ded;
	border-radius:3px;
   	 color: #ffffff;
	margin-bottom: 10px;

}



.optionEX {

	margin: 20px auto 10px;
   	color: #000000;
	width: 800px;
	height: 30px;
	text-align: center;
	background-color: #ffffff;
	border: solid 2px #000000;
	border-radius:20px;
	margin-bottom: 5px;
}



.optionE {


	margin: 20px auto 10px;


   	 color: #000000;
	width: 1280px;
	height: 40px;
	text-align: center;
	background-color: #ffffff;
	border: solid 5px #ffffff;
	border-radius:10px;
   	 color: #000000;
	margin-bottom: 10px;

}


.optionD {


	margin: 100px auto 10px;


   	 color: #000000;
	width: 300px;
	height: 40px;
	text-align: center;
	background-color: #ffffff;
	border: solid 5px #ffffff;
	border-radius:10px;
   	 color: #000000;
	margin-bottom: 10px;

}


.optionA {



	margin: 10px auto 40px;

   	 color: #ffffff;
	width: 300px;
	height: 180px;
	text-align: center;
	background-color: #8100bd;
	border: solid 5px #b006ff;
	border-radius:10px;
   	 color: #ffffff;
	margin-bottom: 10px;

}

.optionB {
   	 color: #ffffff;
	width: 300px;
	height: 180px;
	text-align: center;
	background-color: #9fbc00;
	border: solid 5px #bbdd01;
	border-radius:10px;
   	 color: #ffffff;
	margin-bottom: 10px;

}

.optionC {
   	 color: #ffffff;
	width: 300px;
	height: 180px;
	text-align: center;
	background-color: #01a1bb;
	border: solid 5px #01c2e1;
	border-radius:10px;
   	 color: #ffffff;
	margin-bottom: 10px;

}

.optionF {
   	 color: #ffffff;
	width: 300px;
	height: 180px;
	text-align: center;
	background-color: #ff006c;
	border: solid 5px #ff4f9a;
	border-radius:10px;
   	 color: #ffffff;
	margin-bottom: 10px;

}


.optionPanel {
   	 color: #ffffff;
	width: 300px;
	height: 180px;
	text-align: center;
	background-color: #FF7400;
	border: solid 5px #FF9B48;
	border-radius:10px;
   	 color: #ffffff;
	margin-bottom: 10px;

}


.optionG {
   	 color: #000000;
	width: 300px;
	height: 100px;
	text-align: center;
	background-color: #ffffff;
	border: solid 5px #ffffff;
	border-radius:10px;
   	 color: #000000;
	margin-bottom: 10px;

}

.optionX {
   	 color: #ffffff;
	width: 300px;
	height: 180px;
	text-align: center;
	background-color: #ffe300;
	border: solid 5px #fffc00;
	border-radius:10px;
   	 color: #ffffff;
	margin-bottom: 10px;

}


.generar_code {

	width: 350px;
	height: 55px;
	text-align: center;
	font-size: 40px;
	background-color: #ffffff;
	border: solid 1px #c9dff3;
	border-radius:3px;
   	 color: #000000;

}

.generar_code_mini {

	width: 50px;
	height: 55px;
	text-align: center;
	font-size: 40px;
	background-color: #ffffff;
	border: solid 1px #c9dff3;
	border-radius:3px;
   	 color: #000000;

}

.solicitarsoporte {

	width: 200px;
	height: 25px;
	text-align: center;
	font-size: 18px;
	background-color: #7BE7FF;
	border: solid 1px #7BE7FF;
	border-radius:3px #7BE7FF;
   	 color: #000000;

}


.solicitarsoportex {

	width: 200px;
	height: 25px;
	text-align: center;
	font-size: 18px;
	background-color: #FFD689;
	border: solid 1px #FFD689;
	border-radius:3px #FFD689;
   	 color: #000000;

}


.buscar_email {

	width: 50%;
	height: 55px;
	text-align: center;
	font-size: 25px;
	background-color: #ffffff;
	border: solid 1px #c9dff3;
	border-radius:3px;
   	 color: #000000;

}


.z {

	font-size: 25px;
	background-color: #000000;
   	 color: RED;
	margin-bottom: 25px;
}


.peque {

color: #000000;
	font-size: 12px;
}

.pequex {

color: #0391ff;
	font-size: 11px;
}

.pequez {

color: #000000;
	font-size: 9px;
}

.titlesx {

color: #000000;
	font-size: 16px;
	background-color: #F2F2F2;
	border-collapse: separate;
	border-spacing: 5px;
	border: 1px solid #A4A4A4;
}

.titlesy {

	font-size: 14px;
	background-color: #F2F2F2;
	border-collapse: separate;
	border-spacing: 5px;
	border: 1px solid #A4A4A4;
}

.titlesz {

	font-size: 14px;
	background-color: #FBEFF2;
	border-collapse: separate;
	border-spacing: 5px;
	border: 1px solid #A4A4A4;
}





/*MEDIA QUERY*/
@media only screen and (max-width : 690px) {

	header {

		position: absolute;

	}

	#menu-icon {

		display:inline-block;

	}

	nav ul, nav:active ul { 

		display: none;
		position: absolute;
		padding: 20px;
		background: #fff;
		border: 5px solid #444;
		right: 20px;
		top: 60px;
		width: 50%;
		border-radius: 4px 0 4px 4px;

	}

	nav li {

		text-align: center;
		width: 100%;
		padding: 10px 0;
		margin: 0;

	}

	nav:hover ul {

		display: block;

	}


.animation{
    position: relative;
    display: inline-block;
    margin-top: 18px;
}
.animation img{
    max-width: 609px;
    width: 100%;
}
.animation ul.icons-list{
    list-style: none;
    padding: 0;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.animation ul.icons-list li{
    position: absolute;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    transform: scale(0);
    
    -webkit-animation: zoomin 1.5s cubic-bezier(1, .02, 0, .99) forwards;
    -moz-animation: zoomin 1.5s cubic-bezier(1, .02, 0, .99) forwards;
    animation: zoomin 1.5s cubic-bezier(1, .02, 0, .99) forwards;
}
.animation ul.icons-list li a{
    display: inline-block;
    width: 55px;
    height: 55px;
    background-color: #ffffff;
    border-radius: 200px;
    padding-top: 16px;
}
.animation ul.icons-list li a .fa{
    font-size: 20px;
    color: #1f8ded;
}
.animation ul.icons-list li:nth-child(1){
    left: 0;
    top: 17%;
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    animation-delay: 1s;
}
.animation ul.icons-list li:nth-child(2){
    left: 10%;
    top: 42%;
    -webkit-animation-delay: 1.2s;
    -moz-animation-delay: 1.2s;
    animation-delay: 1.2s;
}
.animation ul.icons-list li:nth-child(3){
    left: 23%;
    top: 52%;
    -webkit-animation-delay: 1.4s;
    -moz-animation-delay: 1.4s;
    animation-delay: 1.4s;
}
.animation ul.icons-list li:nth-child(4){
    right: 23%;
    top: 52%;
    -webkit-animation-delay: 1.6s;
    -moz-animation-delay: 1.6s;
    animation-delay: 1.6s;
}
.animation ul.icons-list li:nth-child(5){
    right: 10%;
    top: 42%;
    -webkit-animation-delay: 1.8s;
    -moz-animation-delay: 1.8s;
    animation-delay: 1.8s;
}
.animation ul.icons-list li:nth-child(6){
    right: 0;
    top: 17%;
    -webkit-animation-delay: 2s;
    -moz-animation-delay: 2s;
    animation-delay: 2s;
}
@keyframes zoomin{
    0% {
        -webkit-transform: scale(0) translateY(60px);
        -moz-transform: scale(0) translateY(60px);
        transform: scale(0) translateY(60px);
    }
    100% {
        -webkit-transform: scale(1) translateY(0px);
        -moz-transform: scale(1) translateY(0px);
        transform: scale(1) translateY(0px);
    }
}
.animation ul.icons-list li a:hover{
    background-color: #1f8ded;
}
.animation ul.icons-list li a:hover .fa{
    color: #ffffff;
}
.animation #hand-animation{
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -79px;
    margin-left: -13%;
    width: 26% !important;
    height: inherit !important;
}







button.wh-ap-btn {
	outline: none;
    width:  60px;
    height:  60px;
    border:  0;
    background-color: #2ecc71;
    padding:  0;
    border-radius:  100%;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    cursor:  pointer;
    transition:  opacity 0.3s, background 0.3s, box-shadow 0.3s;
}

button.wh-ap-btn::after {
    content: '';
    background-image: url('//i.imgur.com/cAS6qqn.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 48%;
    width:  100%;
    height:  100%;
    display:  block;
    opacity: 1;
}

button.wh-ap-btn:hover {
    opacity:  1;
    background-color: #20bf6b;
    box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}

.wh-api {
    position:  fixed;
    bottom:  0;
    left:  0;
}

.wh-fixed {
    margin-left:  15px;
    margin-bottom:  15px;
}

.wh-fixed>a {
    display:  block;
    text-decoration:  none;
}
button.wh-ap-btn::before {
    content: 'Whatsapp';
    display:  block;
    position:  absolute;
    margin-left: 70px;
    margin-top: 16px;
    height: 25px;
    background-color:  #333;
    color:  #fff;
    border-radius:  3px;
    width:  0;
    opacity:  0;
    padding:  0;
    transition: opacity 0.4s, width 0.4s, padding 0.5s;
    padding-top:  7px;
}

.wh-fixed>a:hover button.wh-ap-btn::before {
    opacity:  1;
    width:  auto;
    padding-top: 7px;
    padding-left: 10px;
    padding-right: 10px;
    width:  80px;
}