@charset "UTF-8";
/* CSS Document */


/* REGISTRO
---------------------------------------------------------------------------------------------*/
.registro #container {
	background: url('../images/sombra-registro.png') no-repeat center 675px;
}
.registro #header,
.registro #main { margin:30px 0 170px 0; }

.registro #header {
	position: inherit;
	float: left;
	width: 480px;
	height: 645px;
	border: none;
	text-align: center;
	box-shadow: none;
	background: url('../images/carta-sombra.png'), url('../images/carta2.png');
	background-repeat: no-repeat, no-repeat;
	background-position: right center, center center;
}
.registro #header .content {
	width: 360px;
	height: auto;
	margin: 180px auto 0 auto;
}
.registro #header .content h1 {
	display: block;
	width: 230px;
	height: 56px;
	margin: 5px auto;
	background: url('../images/logo-toovari.png') no-repeat;
}
.registro #header .content h2 {
	font-size: 36px;
	color: #1786b5;
	font-weight: 100;
	margin: 0 0 10px 0;
}
.registro .content h3 {
	font-size: 30px;
	color: #da5b3a;
	font-weight: 100;
	margin: 0 0 10px 0;
}
.registro .content h4 {
	font-size: 18px;
	color: #654;
	font-weight: 100;
	margin: -5px 0 15px 0;
}
.registro #header .content p.rojo {
	font-size: 18px;
	color: #da5b3a;
	font-weight: 300;
	margin: 0 0 20px 0;
}

.registro #main {
	float: right;
	width: 480px;
	height: 645px;
	text-align: center;
	background: url('../images/carta-brillo.png'), url('../images/carta2.png');
	background-repeat: no-repeat, no-repeat;
	background-position: left center, center center;
}
.registro #main .content {
	width: 360px;
	margin: 70px auto 0 auto;
}
.registro #main .content p { font-size:16px; }

.registro #main .content .botones {
	overflow: hidden;
	margin: 10px 0 0 0;
}


/* Paso 0 - Inicio */
.registro.paso0 #header {
	background: url('../images/carta-sombra.png'), url('../images/carta1.png');
	background-repeat: no-repeat, no-repeat;
	background-position: right center, center center;
}
.registro.paso0 #main .content {
	margin: 190px auto 0 auto;
}
.registro.paso0 #main .content h3 {
	font-size: 42px;
	color: #da5b3a;
	font-weight: 100;
	margin: 0 0 5px 0;
}
.registro.paso0 #main .content .descripcion {
	height: 220px;
	margin: 0 auto;
}


/* Texto legal */
.registro #main .content .check-input {
	width: 316px;
	margin: 10px auto 5px auto;
	padding: 0 0 0 20px;
	text-indent: -20px;
	line-height: 17px;
	font-size: 14px;
	text-align: left;
}





/* ALUMNO
---------------------------------------------------------------------------------------------*/
/* Paso 2 */
.alumno.registro.paso2 #header .content h2 {
	font-size: 28px;
}
.alumno.registro.paso2 #main .content {
	margin: 205px auto 0 auto;
}
.alumno.registro.paso2 #main .content .botones { margin:50px 0 0 0; }


/* Pasos 1 y 3 */
.alumno.registro.paso1 #main .content { margin-top:160px; }
.alumno.registro.paso3 #main .content { margin-top:205px; }

.alumno.registro.paso1 #main .content .botones { margin:10px 0 0 0; }
.alumno.registro.paso3 #main .content .botones { margin:55px 0 0 0; }


/* Paso 4 */
.alumno.registro.paso4 #header .content h2 {
	font-size: 32px;
}
.alumno.registro.paso4 #main .content h3 {
	font-size: 24px;
	font-weight: 300;
}
.alumno.registro.paso4 #main .content {
	margin: 160px auto 0 auto;
}
.alumno.registro.paso4 #main .content .descripcion {
	width: 330px;
	margin: 0 auto;
	height: 170px;
}
.alumno.registro.paso4 #main .content .boton {
	width: 330px;
	margin: 0 auto 5px auto;
}
.alumno.registro.paso4 #main .content .boton.verde { font-size:21px; }


/* Paso 5 - Fin */
.alumno.registro.paso5 #header {
	float: right;
	background: url('../images/carta-brillo.png'), url('../images/carta1.png') !important;
	background-repeat: no-repeat, no-repeat !important;
	background-position: left center, center center !important;
}
.alumno.registro.paso5 #main {
	float: left;
	background: url('../images/carta-sombra.png'), url('../images/carta2.png') !important;
	background-repeat: no-repeat, no-repeat !important;
	background-position: right center, center center !important;
}
.alumno.registro.paso5 #main .content {
	margin: 125px auto 0 auto;
}
.alumno.registro.paso5 #main .content .descripcion {
	height: 360px;
	margin: 0 auto;
}
.alumno.registro.paso5 #main .content .boton {
	float: none;
}





/* PROFESOR
---------------------------------------------------------------------------------------------*/
/* Paso 1 */
.profesor.registro.paso1 #main .content {
	margin: 205px auto 0 auto;
}
.profesor.registro.paso1 #main .content .botones {
	margin: 55px 0 0 0;
}


/* Paso 2 */
.profesor.registro.paso2 #main .content {
	margin: 115px auto 0 auto;
}
.profesor.registro.paso2 #main .content .botones {
	margin: 55px 0 0 0;
}
.profesor.registro.paso2b #main .content {
	margin: 160px auto 0 auto;
}
.profesor.registro.paso2b #main .content .botones {
	margin: 55px 0 0 0;
}


/* Paso 3 */
.profesor.registro.paso3 #main .content {
	margin: 100px auto 0 auto;
}
.profesor.registro.paso3 #main .content .avatares {
	overflow: hidden;
}
.profesor.registro.paso3 #main .content .avatares a {
	overflow: hidden;
	float: left;
	display: block;
	width: 108px;
	height: 108px;
	margin: 5px;
	transition: none;
	border: 1px solid #1786B5;
	border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px;
}
.profesor.registro.paso3 #main .content .avatares a img {
	width: 108px;
	height: 108px;
	margin: 0;
}
.profesor.registro.paso3 #main .content .avatares a.active,
.profesor.registro.paso3 #main .content .avatares a:hover {
	width: 104px;
	height: 104px;
	border: 3px solid #654;
}
.profesor.registro.paso3 #main .content .avatares a.active img,
.profesor.registro.paso3 #main .content .avatares a:hover img {
	width: 108px;
	height: 108px;
	margin: -2px;
}

.profesor.registro.paso3 #main .content .botones {
	margin: 20px 0 0 0;
}


/* Paso 4 - Fin */
.profesor.registro.paso4 #header {
	float: right;
	background: url('../images/carta-brillo.png'), url('../images/carta1.png') !important;
	background-repeat: no-repeat, no-repeat !important;
	background-position: left center, center center !important;
}
.profesor.registro.paso4 #main {
	float: left;
	background: url('../images/carta-sombra.png'), url('../images/carta2.png') !important;
	background-repeat: no-repeat, no-repeat !important;
	background-position: right center, center center !important;
}
.profesor.registro.paso4 #main .content {
	margin: 125px auto 0 auto;
}
.profesor.registro.paso4 #main .content .descripcion {
	height: 360px;
	margin: 0 auto;
}
.profesor.registro.paso4 #main .content .boton {
	float: none;
}




/* FORMULARIO
---------------------------------------------------------------------------------------------*/
.registro .form-item { height:40px; margin-bottom:5px; }

.registro .form-item label { display:none; }

.registro .check-input label {
	display: inline !important;
}

/* Campo texto */
.registro .text-input input,
.registro .pw-input input {
	width: 350px;
	height: 40px;
	padding: 0 5px;
	font-family: "Gotham Rounded", Arial, sans-serif;
	font-weight: 300;
	font-size: 21px;
	color: #1786b5;
	line-height: 40px;
	border: none;
	background-color: rgba(255,255,255,0.7);
	transition:0.3s all; -moz-transition:0.3s all; -webkit-transition:0.3s all; -ms-transition:0.3s all; -o-transition:0.3s all;
	border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px;
}
.registro .text-input input:focus,
.registro .pw-input input:focus { color:#654; background-color:rgba(255,255,255,1); }

/* Campo select */
.registro .select select {
	float: left;
	width: 360px;
	height: 40px;
	padding: 7px 5px;
	margin: 0 5px 0 0;
	font-family: "Gotham Rounded", Arial, sans-serif;
	font-weight: 300;
	font-size: 21px;
	color: #1786b5;
	line-height: 40px;
	border: none;
	background-color: rgba(255,255,255,0.7);
	transition:0.3s all; -moz-transition:0.3s all; -webkit-transition:0.3s all; -ms-transition:0.3s all; -o-transition:0.3s all;
	border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px;
}
.registro .select select:focus { color:#654; background-color:rgba(255,255,255,1); }

.alumno.registro .select.box1 select { width:360px; margin:0; }
.alumno.registro .select.box2 select { width:177px; }
.alumno.registro .select.box2 select:last-child { margin:0; }

.profesor.registro .select.box1 select { width:360px; margin:0; }
.profesor.registro .select.box2 select { width:190px; }
.profesor.registro .select.box2 select:last-child { width:165px; margin:0; }

/* Checkboxes */
.registro .checkbox label {
	display: inline;
	font-size: 18px;
	line-height: 40px;
	margin: 0 10px 0 0;
	padding: 0 0 0 3px;
}
.registro .checkbox label:last-child { margin:0; }


/* Botones al pie */
.registro .form-item.botones input {
	float:left;
	width: 175px;
	margin: 0 0 0 10px;
}
.registro .botones a.boton {
	float:left;
	width: 145px;
	margin: 0 0 0 10px;
}
.registro .form-item.botones input:first-child, .registro .botones a.boton:first-child { margin:0; }


/* Mensajes de error */
#error {
	visibility: hidden;
	position: absolute;
	z-index: 1000;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.8);
}

#error #message {
	position: absolute;
	top: 210px;
	left: 0;
	width: 50%;
	margin: 0 20%;
	padding: 100px 5%;
	background-color: rgba(255,255,255,0.8);
	border-radius:20px; -moz-border-radius:20px; -webkit-border-radius:20px; -ms-border-radius:20px; -o-border-radius:20px;
	box-shadow:0 0 90px rgba(102,85,68,0.5); -moz-box-shadow:0 0 90px rgba(102,85,68,0.5); -webkit-box-shadow:0 0 90px rgba(102,85,68,0.5); -ms-box-shadow:0 0 90px rgba(102,85,68,0.5);
}
#error #message p {
	font-size: 16px;
	color: #654;
	text-align: center;
	margin: 0;
}
#error #message .boton {
	display: block;
	width: 150px;
	margin: 30px auto 0 auto;
}




/* SUSCRIPCIÓN
---------------------------------------------------------------------------------------------*/
.alumno.registro.suscripcion #header .content,
.alumno.registro.suscripcion #main .content {
	width: 380px;
	text-align: left;
}
.alumno.registro.suscripcion #header .content h2 { font-size:30px; text-align:center; color:#73bb1e; }

.alumno.registro.suscripcion #header .content img { display:inherit; }

.alumno.registro.suscripcion #main .content .botones .boton {
	width: 155px;
}


/* Tabla */
.suscripcion .content table {
	margin: 10px -10px;
	border-collapse: separate;
	border-spacing: 10px 0;
}
.suscripcion .content table th, .suscripcion .content table td { width:120px; }
	
.suscripcion .content table th {
	height: 50px;
	font-weight: 500;
	font-size: 15px;
	color: #FFF;
	line-height: 16px;
	text-align: center;
	background: #665544 url('../images/bg-marron.png') center;
	background-size: 100% 100%;
	border-radius:4px 4px 0 0; -moz-border-radius:4px 4px 0 0; -webkit-border-radius:4px 4px 0 0; -ms-border-radius:4px 4px 0 0; -o-border-radius:4px 4px 0 0;
}

.suscripcion .content table tbody td {
	width: 110px;
	padding: 3px 5px;
	font-size: 13px;
	font-weight: 300;
	color: #654;
	line-height: 14px;
	text-align: center;
	background-color: rgba(228,211,181,0.35);
}
.suscripcion .content table tbody td.big { font-size:16px; }
.suscripcion .content table tbody tr:first-child td { padding-top:7px; }
.suscripcion .content table tbody tr:last-child td { padding-bottom:7px; }

.suscripcion .content table tfoot td a.boton.verde {
	display: block;
	width: 90px;
	height: 43px;
	margin: 0;
	padding: 22px 0 0 30px;
	font-weight: 500;
	font-size: 18px;
	color: #FFF;
	text-align: center;
	line-height: normal;
	background: url('../images/icon-shop.png'), url('../images/bg-verde.png');
	background-repeat: no-repeat, no-repeat;
	background-position: 10px center, center center;
	background-size: 25px 24px, 100% 100%;
	border-radius:0 0 4px 4px; -moz-border-radius:0 0 4px 4px; -webkit-border-radius:0 0 4px 4px; -ms-border-radius:0 0 4px 4px; -o-border-radius:0 0 4px 4px;
}
.suscripcion .content table tfoot td.oferta a.boton.verde {
	height: 56px;
	padding-top: 9px;
	font-size: 21px;
	line-height: 20px;
}
.suscripcion .content table tfoot td.oferta a.boton.verde .old { display:block; font-size:15px; text-decoration:line-through; color:rgba(255,255,255,0.6); }

/* Oferta */
.suscripcion .content .oferta { font-size:13px; }
.suscripcion .content .oferta strong { font-size:15px; }

/* Banner */
.suscripcion .content .banner {
	overflow: hidden;
	height: 70px;
	margin-top: 10px;
	box-shadow:0 1px 5px rgba(102,85,68,0.5); -moz-box-shadow:0 1px 5px rgba(102,85,68,0.5); -webkit-box-shadow:0 1px 5px rgba(102,85,68,0.5); -ms-box-shadow:0 1px 5px rgba(102,85,68,0.5);
	border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; -ms-border-radius:4px; -o-border-radius:4px;
}
.suscripcion .content .banner a:hover { opacity:0.5; }

/* Texto legal */
.suscripcion .content .legal { margin:10px 0; font-size:13px; }


/* Suscripcion en pop-up */
#popup-wrap #popup.suscripcion .content {
	text-align: center;
}
#popup-wrap #popup.suscripcion table { margin:0 auto 20px auto; }

#popup-wrap table.opciones-suscripcion.cols1 th, #popup-wrap table.opciones-suscripcion.cols1 td { width:280px; }
#popup-wrap table.opciones-suscripcion.cols3 th, #popup-wrap table.opciones-suscripcion.cols3 td { width:180px; }
#popup-wrap table.opciones-suscripcion.cols4 th, #popup-wrap table.opciones-suscripcion.cols4 td { width:142px; }

#popup-wrap #popup.suscripcion table tbody td { background-color:#fdf8ec; }
#popup-wrap #popup.suscripcion table tfoot td a.boton.verde {
	display: block;
	width: 80%;
	height: 47px;
	margin: 0;
	padding: 18px 0 0 20%;
	font-weight: 500;
	font-size: 27px;
	color: #FFF;
	text-align: center;
	line-height: normal;
	background-size: 25px 24px, 100% 100%;
	background-position: 20% center, center center;
}
#popup-wrap #popup.suscripcion table tfoot td.oferta a.boton.verde {
	height: 57px;
	padding-top: 8px;
	line-height: 20px;
}

/* Posición/tamaño del carrito en función del nº de columnas */
#popup-wrap #popup.suscripcion table.cols1 th { font-size:18px; }
#popup-wrap #popup.suscripcion table.cols1 tbody td { font-size:15px; }
#popup-wrap #popup.suscripcion table.cols1 tfoot td a.boton.verde { background-size:50px 48px, 100% 100%; background-position:28% center, center center; }
#popup-wrap #popup.suscripcion table.cols3 tfoot td a.boton.verde { background-position:24% center, center center; }
#popup-wrap #popup.suscripcion table.cols4 tfoot td a.boton.verde { background-position:15% center, center center; }




/* Paso 1 */
.registro.suscripcion.paso1 #header .content {
	margin-top: 70px;
}
.registro.suscripcion.paso1 #main .content {
	margin-top: 60px;
	text-align:center;
}
.registro.suscripcion.paso1 #main .content h4 {
	margin: -10px 0 10px 0;
}
.registro.suscripcion.paso1 #main .content .botones {
	margin-top: 10px;
}




/* SUSCRIPCION MAS INFORMACION - Paso 2
---------------------------------------------------------------------------------------------*/
.registro.suscripcion.paso2 #header .content {
	margin-top: 70px;
}
.registro.suscripcion.paso2 #main .content {
	margin-top: 80px;
}
.registro.suscripcion.paso2 #main .content .botones {
	margin-top: 30px;
}

.registro.suscripcion.paso2 .content h3 {
	font-size: 24px;
	color: #73bb1e;
	font-weight: 300;
}


/* Izda */
.registro.suscripcion.paso2 #header .content h3 {
	margin: 0 0 3px 0;
	padding: 0;
	font-size: 18px;
	text-align: center;
}
.registro.suscripcion.paso2 #header .content h4 {
	margin: 0 0 10px 0;
	font-size: 15px;
	font-weight: 300;
	text-align: center;
}
.registro.suscripcion.paso2 #header .content p {
	margin: 0 0 7px 0;
	padding: 0 0 0 90px;
	font-size: 13px;
}


/* Decha */
.registro.suscripcion.paso2 #main .content h3 {
	margin: 15px 0 3px 0;
	padding: 0 0 0 90px;
}
.registro.suscripcion.paso2 #main .content p {
	padding: 0 0 0 90px;
	font-size: 15px;
}


/* Botones paginación */
.registro.suscripcion .content .botones a.boton.left,
.registro.suscripcion .content .botones a.boton.right {
	float: left;
	width: 57px !important;
	background-color: #73bb1e;
	background-size: auto, 100% 100%;
	background-position: center center;
	background-repeat: no-repeat, no-repeat;
}
.registro.suscripcion .content .botones a.boton.left { background-image: url('../images/icon-left-blanco.png'), url('../images/bg-verde.png'); }
.registro.suscripcion .content .botones a.boton.right { background-image: url('../images/icon-right-blanco.png'), url('../images/bg-verde.png'); }


/* Capturas */
.registro.suscripcion.paso2 .content .agrandar {
	display: block;
	position: relative;
	overflow: hidden;
	float: left;
	width: 80px;
	height: 54px;
	margin: 5px 10px 0 -90px;
	box-shadow: 0 1px 6px #654; -moz-box-shadow: 0 1px 6px #654; -webkit-box-shadow: 0 1px 6px #654; -ms-box-shadow: 0 1px 6px #654;
}
.registro.suscripcion.paso2 .content .agrandar .captura {
	width: 80px;
	height: 54px;
}
.registro.suscripcion.paso2 .content .agrandar .lupa {
	position: absolute;
	opacity: 0;
	z-index: 10;
	left: 0px;
	top: 0px;
	width: 34px;
	height: 34px;
	padding: 10px 23px;
	background-color: rgba(0,0,0,0.15);
	transition:0.2s all; -moz-transition:0.2s all; -webkit-transition:0.2s all; -ms-transition:0.2s all; -o-transition:0.2s all;
}
.registro.suscripcion.paso2 .content .agrandar:hover .lupa { opacity:1; }




/* SUSCRIPCION MAS INFORMACION - Paso 3
---------------------------------------------------------------------------------------------*/
.registro.suscripcion.paso3 #header .content {
	margin-top: 70px;
	text-align: center;
}
.registro.suscripcion.paso3 #main .content {
	margin-top: 76px;
	text-align: center;
}
.registro.suscripcion.paso3 #main .content .botones {
	margin-top: 20px;
}

.registro.suscripcion.paso3 .content h3 {
	margin: 20px 0 5px 0;
	font-size: 24px;
	color: #73bb1e;
	font-weight: 300;
}
.registro.suscripcion.paso3 #main .content h4 {
	margin: 10px 0 0 0;
	font-size: 18px;
	color: #73bb1e;
	font-weight: 500;
}
.registro.suscripcion.paso3 #main .content p {
	font-size: 14px;
}