@charset "utf-8";
/*@font-face {
	font-family: "Oswald-Light";
	src: url("fonts/Oswald-Light.eot");
		src: url("fonts/Oswald-Light.eot?#iefix") format("embedded-opentype"),
		url("fonts/Oswald-Light.woff") format("woff"),
		url("fonts/Oswald-Light.ttf") format("truetype"),
		url("fonts/Oswald-Light.svg#Oswald-Light") format("svg");
	font-weight: normal;
	font-style: normal;
}*/
@font-face {
	font-family: "AmsiPro";
	src: url("fonts/AmsiPro.eot");
		src: url("fonts/AmsiPro.eot?#iefix") format("embedded-opentype"),
		url("fonts/AmsiPro.woff") format("woff"),
		url("fonts/AmsiPro.ttf") format("truetype"),
		url("fonts/AmsiPro.svg#AmsiPro") format("svg");
	font-weight: normal;
	font-style: normal;
}
*{-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box}
header, section, footer, aside, nav, article, figure, figcaption, hgroup, div{display:block;}
a{text-decoration:none; color: inherit;}
html{min-height:100% !important;}
body{margin:0px 0px;min-height:100% !important;font-size:10pt;font-family:AmsiPro,"Century Gothic", "Trebuchet MS", Verdana, sans-serif;}
.nada{clear:both;}
.wrapper1{width:1200px;margin:0px auto;}

#main{background-color:#000000; height:60px; width:100%;}
#main>div div{float:right; margin:14px 10px; text-align:center; }
#main>div ul{padding:0px; float:left; display: none; font-size: 1em;}
#main>div ul a li{color:#ffffff;}
#main>div li{display:inline-block; list-style: none; height:35px; line-height:35px; margin-left:2px; margin-right:2px; color:#ffffff;}
#main>div li:hover {border-bottom:#63c7df 2px solid;}

#main>div>ul li{margin-left:2px; margin-right: 2px;}
div.b1{background-color:#f68c4d; border-radius:4px; color:#ffffff; height:32px; line-height:28px; cursor: pointer; width:140px;}
div.b2{background-color:#ffffff; border-radius:4px; color:#f68c4d; border:#f68c4d 2px solid; height:32px; line-height:24px; cursor: pointer; width:140px;}
div.b3{background-color:#ffffff; border-radius:4px; color:#009a00; border:#009a00 2px solid; height:32px; line-height:24px; cursor: pointer; width:140px; float: left !important;}
div.b3>img{float: left;}
div.b3>span{float: left; display: block; height: 28px; line-height: 28px;}
#main.sigue{position:fixed; top:0px; left:0px; right:0px; z-index: 1000;}
#main.sigue>div>ul{display: block;}

#menup{display:block; width:100%; height:110px; position:relative; z-index:10;box-shadow: 0 10px 2px -2px rgba(0,0,0,0.2);}
#cabecera{display:block;top:0px;width:1200px; height:110px; margin:0px auto; background-color: #ffffff}
#cabecera #nombrecab{display:block;float:left;width:175px; height:70px; background:url(img/logo.png) no-repeat; background-size:100%; margin-top:20px;}
#navegador{display:block; float:right; width:auto; height:35px;text-align:left; font-weight:bold; margin-right:20px;}
#navegador ul{padding:0px;margin-top:35px;float:left; font-size:12pt;}
#navegador ul a li{color:#63c7df; background-color:#ffffff;}
#navegador li{display:inline-block; list-style: none; height:35px; line-height:35px;background-color:#E51C15; margin-left:10px; margin-right:10px; color:#ffffff;}
#navegador li:hover, #navegador li.sel{border-bottom:#63c7df 2px solid;}


#fondo1{background: url(img/bg.jpg); background-size: cover; width: 100%; height: auto;}
#fondo1>div, #prueba{width:1200px; margin:0px auto; z-index:1; position: relative; max-width: 100%;}
#fondo1 img, #prueba img{width:100%; height:auto;}
.info{position: absolute; width: 50%; font-size: 1em; left: 0px; top: 0px; margin-left: 5%;text-shadow: 0px 0px 4px rgba(0,0,0,0.9);}
.info h1{height: 40%; line-height: 150%; font-size: 3em; color: #ffffff; margin-top: 10%; text-align: left;}
.info ul{height: 40%; line-height: 200%; font-size: 1.4em; color: #ffffff; margin: 0px; list-style:none; padding: 0px;}
.info li{padding: .0em 0 0em 1.7em; background:url(img/bullet.png) no-repeat; background-position: 0px 0.5em; margin: 0px;}


.ventajas1{background: #ff1744 !important; color: #ffffff; margin-top: -2px;}
.ventajas1 .wrapper1{white-space: nowrap;}
.ventajas1 article{display: inline-block; width: 33%; margin:0px; margin-bottom: 40px; padding: 20px; font-size: 1em; text-align: center; white-space: normal; vertical-align: top;}

.ventajas{background: #00a2f6; color: #ffffff;}
.ventajas .wrapper1{white-space: nowrap;}
.ventajas article{width: 100%; display: flex; justify-content:center;flex-wrap: wrap; margin:0px; padding: 20px; font-size: 1em; text-align: center; white-space: normal;}
.ventajas article div{flex: 1 1 25%; padding-left: 10px; padding-right: 10px;}

.ventajas1 article img, .ventajas article img, .nube article img{max-width: 100%; height: auto;}

.nube{background: #F531D6; color: #ffffff;}
/*.nube .wrapper1{white-space: nowrap;}*/
.nube article{width: 100%; display: flex; justify-content:center;flex-wrap: wrap; margin:0px; padding: 20px; font-size: 1em; text-align: center; white-space: normal;}
.nube article div{flex: 1 1 33%; padding-left: 10px; padding-right: 10px;}


.info2{position: absolute; width: 50%; font-size: 1.2em; right: 0px; top: 0px; margin-right: 5%;}
.info2 h2{height: 40%; line-height: 150%; font-size: 2em; color: #ffffff; margin-top: 10%; text-align: right;}
.info2 h2 span{font-size: 1.5em;}
.info2 .b1{float: right; text-align: center; background-color: #ff8e00;}

.planes h1{color:rgba(255, 99, 102, 1); font-size:3em; text-align:center; margin-bottom: 0px;}

#ventajas h2{text-align: center; color: #63c7df; margin-top: 0px;}
#ventajas section {display:flex; justify-content:space-around; flex-wrap: wrap;}
#ventajas section article{flex:0 0 270px; text-align:center; margin-top: 15px; margin-bottom: 15px;}
#ventajas section article figcaption{font-weight:bold; margin-top:20px; font-size:1.3em;}
#ventajas .b1{width:140px; text-align:center; margin:0px auto;}

.planes{margin-top:40px; margin-bottom: 20px;}
.planes section {display:flex; justify-content:center;flex-wrap: wrap;}
.planes section article{flex:0 0 200px; text-align:center; margin:2px; margin-bottom: 40px; padding: 10px; font-size: 0.8em;}
.planes section article strong{color: #ff6b17; text-decoration: underline;}
.planes section article h2{width:100%; height:30px; line-height:30px; color:#ffffff; margin-top: 0px;}
.planes section article:nth-child(1) h2{background-color:#63c7df;}
.planes section article:nth-child(2) h2{background-color:#f68c4d;}
.planes section article:nth-child(3) h2{background-color:#fdd367;}
.planes section article:nth-child(4) h2{background-color:#bed73e;}
.planes section article:nth-child(5) h2{background-color:#222222;}
.planes section article>span{font-size:4em; color:#333333; position:relative; font-weight:bold; }
.planes section article>span:before {position:absolute; content:"US$"; font-size:0.25em; top:14px; left:-30px; display:block;}
.planes section article>span:after {position:absolute; content:"00 + IGV \A \A al año"; font-size:0.25em; top:16px; right:-100px; text-align:left;white-space: pre; display:block; line-height:1em; width:100px;}
.planes section article div{margin-top:4px; background-color:#efefef; height:30px; line-height:30px;}
.planes section article div>span{font-size: 0.8em; border-bottom: #E0C300 2px double;}
.planes label.b1{background-color:#f68c4d; border-radius:4px; color:#ffffff; height:32px; line-height:32px; width: 120px; margin: 0px auto; display: block; margin-top: 40px; cursor: pointer;}

.planes section.precios article{border: rgba(255, 99, 102, 0.2) 1px solid; margin: 5px;}
.planes section article.mejor{border: #bed73e 4px solid; position: relative;}
.planes section article.mejor::after{position: absolute; right: 0px; top: 0px; content: url(img/mejor.png)}
.planes section article.autoh{flex: 0 0 320px !important;}
.planes section article.autoh div, .planes section article.autoh h2{height: auto;}
.planes section article.autoh h2{color:#fff !important;}
#ventajas article.autoh .b1 {position: absolute; bottom: 10px; left: 50%; transform: translateX( -50% );}

#contacto{margin-top:40px; margin-bottom: 40px;}
#contacto section {display:flex; justify-content:space-around; background:url(img/fondo3.jpg); background-size:cover; }
#contacto section aside{flex:0 0 50%; text-align:center; padding:0px;}
#contacto section aside:nth-child(1){padding:40px; padding-top:20px;}
#contacto section aside:nth-child(1) h1{color:#ffffff; text-align:left;}
#contacto section aside:nth-child(1) h2{color:#ffffff; text-align:right;}
#contacto_form{font-size: 0.8em}
form{padding:30px; text-align:left; margin:0px;background-color: rgba(255, 255, 255, 0.7);}
form label{width:100%; display:block; font-size:1.5em; margin-top:1em; margin-bottom:0.2em;position: relative;}
form input[type=text],form input[type=password], form input[type=email]{width:100%; background:none; border:none; border-bottom:#999999 1px solid; padding:10px; font-size:1.2em;}
form textarea{width:100%; height:100px; background:none; border:#999999 1px solid; padding:5px;}
form input.b1{background-color:#00a2f6; border-radius:4px; height:32px; line-height:32px; border:none; width:160px; margin-top:30px;  margin-bottom:40px;float:right; color: #ffffff;}
form.chico{font-size: 0.8em; padding-top:0px; padding-bottom: 0px;}
form label.bien::after{content: url(img/check.png); position: absolute; right: -10px;}
form label.mal{color: #FF4141}
form label.mal::after{content: url(img/bad.png); position: absolute; right: -10px;}
form .cancela{margin-top:-30px; float:right; color: #EB3F42; text-decoration: underline; cursor: pointer; text-align: right; font-size: 1.2em;}
form .recuerda{position: absolute;color: #EB3F42; text-decoration: underline; cursor: pointer; text-align: right; font-size: 1.2em; bottom: 0px; right: 10px;}
form .cancelaa{margin-top:-30px; float:left; color: #EB3F42; text-decoration: underline; cursor: pointer; text-align: left; font-size: 1.2em;}

footer{background-color:#000000; height:110px; line-height:105px; padding-left:20px; padding-right:20px; border-top:#333333 5px solid;}
footer img{margin-top:25px;}
footer span{color:#999999; float:right; }

.fondoPopup{position:fixed; top:0px; left:0px; right:0px; bottom:0px; background-color:rgba(20,20,20,0.5); z-index:10000; box-shadow: 0px 8px 32px rgba(31,34,38,0.12), 0px 2px 6px rgba(31,34,38,0.08);}
.fondoPopup #popup{background-color:#ffffff; border:#eeeeee 2px solid; position:absolute; overflow:visible; padding:0px; left: 50%; top: 50%; border-radius: 8px; transform: translateY( -50% )}
.fondoPopup #popup .cierra{content:''; background: url(img/a_close16.png); width: 16px; height: 16px; position: absolute; top: 6px; right: 6px; cursor: pointer; z-index: 20;}
#popup .spinner:after{color:#bbbbbb;}
#popup h1{color: #63c7df}
iframe#popupIFR{border: #222222 4px solid; box-shadow: 2px 2px 4px 5px rgba(2,2,2,0.4); position: relative; max-width: 100%; max-height: 100%;}
#antiguo{position: relative; padding-bottom: 40px;}

.modal{display:none;position:fixed;z-index:90;top:0;left:0;height:100%;width:100%;background:rgba(24,31,39,.8 )}
body.loading{overflow: hidden;}
body.loading .modal{display: block;}
.spinner {font-size: 100px;width: 75px;height: 100px;position: absolute;display:block;list-style: none;}
.spinner li {width: .2em;height: .2em;position: absolute;}
.spinner li:nth-child(1) {background: #00a8c9;top: 0;left: 50%;margin-left: -.1em;transform-origin: 50% 250%;animation:rota 1.13s linear infinite;} /* Blue */
.spinner li:nth-child(2) {background: #ff5e6d;top: 50%; right: 0;margin-top: -.1em;transform-origin: -150% 50%;animation:rota 1.86s linear infinite;} /* Red */
.spinner li:nth-child(3) {background: #8c76b6;bottom: 0;left: 50%;margin-left: -.1em;transform-origin: 50% -150%;animation:rota 1.45s linear infinite;} /* Yellow */
.spinner li:nth-child(4) {background: #669900;top: 50%; left: 0;margin-top: -.1em;transform-origin: 75% 75%;animation:rota 1.72s linear infinite;} /* Green */
.spinner li:nth-child(5) {background: #ff9100;top: 50%;left: 0;margin-top: -.1em;transform-origin: 75% -125%;animation:rota 1.92s linear infinite}

.tooltips:after{content: ''}
.tooltip{width: auto;height: auto;max-width: 50%;position: absolute;display: block;background-color: rgba(255,254,170,0.8);border: #B19106 1px solid;z-index: 100000;padding: 10px;text-align: justify; font-size: 8pt;}
.tooltip:after{display: block;content: '';width: 0px;border-width: 12px 0 0 12px;border-style: solid;border-color: #B19106 transparent;position: absolute;z-index: 99999;bottom: -12px;right: -1px;}
.tooltip.abajo:after{top:0px;}
.tooltip.izquierda:after{left:-1px; right: auto; border-width: 12px 12px 0 0px;}

.csCombo{width: 100%; height: 32px; background-color: #00a2f6; display:inline-block; position: relative; color:#222222; vertical-align: bottom; border-radius: 4px; margin-top: 20px}
#registro .csCombo{margin-top: 0px;}
.csCombo>div div {padding-left: 10px; padding-right: 10px; line-height: 32px; cursor: pointer; max-width: 100%; overflow: hidden;}
.csCombo>div:first-child{width: 100%; height: 100%; color: #ffffff; position: relative;}
.csCombo>div:first-child>div::after{width: 8px; height:8px; position: absolute; right: 8px; bottom: 8px; border: #ffffff solid; border-width: 0 2px 2px 0; content: ''}
.csCombo>div:first-child>div.sel::after, .csCombo>div:first-child:hover>div::after{border-color: #EBBD1F}
.csCombo>div:nth-child(2){position: absolute; top: 32px; background-color: #ffffff; border: #cccccc 1px solid; min-width: 100%; max-height: 300px; overflow-x: hidden; overflow-y: auto;box-shadow: 2px 2px 4px 2px rgba(200,200,200,0.5); z-index: 100; max-width: 100% !important;}
.csCombo>div:nth-child(2)>div{height: 32px; white-space: nowrap; text-overflow: ellipsis; max-width: 100%;}
.csCombo>div:nth-child(2)>div:hover{background-color: #eeeeff;}
.csCombo>div:nth-child(2)>div.sel{background-color:#222222; color: #ffffff;}

#capchaimg{margin-left: 10px; cursor: pointer;}

.detalles {padding: 20px; padding-top: 0px; font-size: 0.9em; }
.detalles h1{text-align: left; height: 2em; line-height: 2em; font-size: 2em; color: #ffffff; padding-left: 10px; margin-left: -10px;}
.detalles .c1{background-color: #63c7df;}
.detalles .c2{background-color: #f68c4d;}
.detalles .c3{background-color: #fdd367;}
.detalles .c4{background-color: #bed73e;}
.detalles table{margin-top: 5px; margin-bottom: 5px; width: auto;}
.detalles table td{height: 16px; line-height: 16px; border: #d4d4d4 1px solid;border-collapse: collapse; padding-left: 5px; padding-right: 5px; width: auto;}
.detalles table tr:nth-child(2)>td{background-color: #dddddd;}
.detalles table tr:nth-child(1)>td, .detalles table tr>td:nth-child(1){background-color: #262626; color: #ffffff; text-align: center;}
.detalles div{border: #d4d4d4 1px solid; padding: 5px;}

#dominioAlerta{font-size: 0.8em; padding-left: 20px; color: #FF6366}
#total{position: relative; color: #EB3F42;}
#igv{position: absolute; bottom: -20px; height: 20px; right: 0px; font-size: 0.6em;}
#enano{zoom:0.2; right: 0px; display: none;}
#buscaDominio{position: absolute; right: 0px; cursor: pointer;}
#buscaDominio::after{position: absolute; right: 0px; content: url(img/a_busca24.png); width: 24px; height: 24px; top: 36px;}
#buscaDominio.ok::before{position: absolute; right: -18px; content: url(img/check.png); width: 16px; height: 16px; top: 36px;}
#buscaDominio.ko::before{position: absolute; right: -18px; content: url(img/bad.png); width: 16px; height: 16px; top: 36px;}
#dominio{width: calc( 100% - 32px);}

.error{color: #ff0000; text-decoration: underline; text-align: center;}

#popupAlerta{display: block; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; z-index: 10000; text-align: center; height: 100%;}
#popupAlerta:before{content:''; display: inline-block; width: 0; height: 100%; vertical-align: middle; background-color: #ff0000;}
#popupAlerta h4{color: #00a2f6; margin: 0px; font-size: 2em;}
#popupAlerta>div{display: inline-block; width: 480px; max-width: 100%; height: auto; vertical-align: middle; background-color: #ffffff; padding: 20px; border-radius: 20px; box-shadow: 2px 2px 40px 10px rgba(0,0,0,0.4); border-left: #00a2f6 20px solid;}
#popupAlerta h1{display: inline-block; width: 70px; height: 64px; background: url(img/profeAviso.png); margin: 0px;}
#popupAlerta .mensaje, #popup .mensaje{text-align: justify; color: #444444;}
#popupAlerta>div>div{max-height: 400px; overflow-y: auto;}
#popupAlerta>div>div pre{text-align: left; font-size: 0.8em; padding: 10px; white-space: pre-wrap;}
#popupAlerta .boton, #popup .boton, .boton{padding: 10px; margin: 20px; margin-bottom: 0px; background-color: #00a2f6; width: auto; display: inline-block; color: #ffffff; min-width: 150px; border-radius: 8px; box-shadow: 0px 10px 20px 5px rgba(0,0,0,0.4); cursor: pointer; vertical-align: middle;}
#popupAlerta ul{text-align: left}

.inputbox {position: relative; border: #225588 3px solid;}
.inputbox .h1{font-size:11pt;background-color: #00a2f6;color:#ffffff;border-bottom: #00a2f6 5px solid; padding:10px; padding-top: 15px; padding-left: 5px; margin-bottom: 10px;}
.inputbox div.img{text-align: center}
.inputbox .texto{ text-align: center; margin: 10px; padding: 10px;}
.inputbox input {width:100%; height: 24px; border: #ccc 1px solid; line-height: 24px; padding-left: 10px; padding-right: 10px;}
.inputbox button{position:absolute; right: 0px; bottom: -40px; background-color: #00a2f6; text-align: center; color: #ffffff; border: none; font-size: 1em; width: 140px; height: 30px; line-height: 30px;}
.inputbox button.cancelar{background-color: #999999; right: 145px;}
.inputbox>div pre{text-align: left; font-size: 0.7em; padding: 10px; white-space: pre-wrap;max-height: 400px; overflow-y: auto; background-color: #222222; color: #ffffff; display: none;}

#textito{
	display: none;
	position: absolute;
}
#textito.activo{
	display: block;
}
#textito.activo label{
	background-color: #222222;
	overflow: hidden; border-right: .15em solid orange; white-space: nowrap; margin: 0 auto;
	letter-spacing: .15em; /* Adjust as needed */
	animation:  typing 3.5s steps(40, end), link-caret .75s step-end infinite;
}

/* The typing effect */
@keyframes typing {
  from { width: 0 }
  to { width: 100% }
}

/* The typewriter cursor effect */
@keyframes blink-caret {
  from, to { border-color: transparent }
  50% { border-color: orange; }
}


@keyframes rota {
    to { transform: rotate(360deg); }
}
@media screen and (max-width: 1200px) {
	.wrapper1, #cabecera, #menup, #fondo1, #prueba{width:100%;}
	.info, .info2{font-size: 0.8em; width: 70%;}
}
@media screen and (max-width: 800px) {
	#cabecera #nombrecab{width:90px; height:40px; margin-top:40px;}
	#cabecera #navegador ul{font-size:11pt;}
	.info, .info2{font-size: 0.5em; width: 70%;}
	.info li{background-size: 10px 10px;}
}
@media screen and (max-width: 600px) {
	#cabecera, #menup{height:45px;}
	#cabecera #navegador ul{font-size:9pt; margin:0px;}
	#cabecera #navegador li{margin-left:5px; margin-right: 5px;}
	#cabecera #nombrecab{width:60px; height:40px; margin-top:10px;}
	#navegador{margin-right:5px; float: none; text-align: center;}
	#contacto section {display:block;}
	#contacto section aside{width: 100%;}
	.ventajas .wrapper1,.ventajas1 .wrapper1{white-space: normal;}
	.ventajas1 article, ventajas article{ width: 100%;}
	footer{height:50px; line-height:45px;padding-left:5px; padding-right:5px;}
	footer img{width: 60px; height: auto;}
	footer span{font-size: 1em;}
	.info h1, .info2 h2{margin-top: 4%;}
	.info h1{font-size: 2em}
	.info2 .b1{font-size: 2em;}
	#ventajas article.autoh .b1{position: static; margin: 10px auto; transform: none;}
	#main.sigue>div>ul{display: none;}
}
@media screen and (max-width: 480px) {
	#cabecera #nombrecab{display: none;}	
	#cabecera, #menup, #navegador{height: auto;}
	#cabecera #navegador ul{font-size:8pt;}
	#cabecera #navegador li{margin-left:2px; margin-right: 2px;}
	.info, .info2{font-size: 0.45em; width: 80%;}
	.info2 .b1{font-size: 2em; margin-top: -10px;}
	.nube article{display: block;}
	.ventajas article{display: block;}
}