@charset "utf-8";

/* CSS Document */
#datospago .total {
	width: 100%;
}

#planes {
	position: relative;
}

#planes div {
	display: table-cell;
	float: none;
	/*width:auto !important;*/
	margin: 0px !important;
	vertical-align: middle;
	clear: both !important;
}

#planes ul {
	list-style-type: none;
	text-align: center;
	margin-top: 0.5em;
}

#planes ul li {
	display: table;
	width: 98%;
	padding: 1%;
	border: solid 1px #ffffff;
	margin-bottom: 3px;
}

#planes img {
	width: 70px;
	height: 70px;
	vertical-align: bottom;
}

#planes .eddb {
	width: 28%;
	text-align: center;
}

#planes .txtb {
	width: 100%;
	display: block;
}

.this {
	width: 25px;
	display: none !important;
}

.pay {
	width: 33%;
	min-width: 90px;
}

.pay p {
	margin: 0em .5em 0em .5em;
}

.detail {
	text-align: center;
}

.detail div {
	clear: both !important;
	float: left !important;
	width: 100%;
}

.detail p {
	margin: 0;
}

#planes .costo {
	font-size: 1.2em;
	font-weight: bold;
}

li.elegir {
	background: #ffffff;
}

#planes .tplan {
	font-weight: bold;
	margin: 0;
	font-size: 1.1em;
}

.price {
	font-size: 1.3em;
}

#final .price {
	font-size: 1.6em;
}

#zonaplanes {
	display: table;
	width: 100%;
	font-size: 100%;
	text-align: left;
	margin: 0 auto 0.5em auto;
	max-width: 390px;
}

#zonaplanes li {
	list-style-type: none;
	font-size: 1.1em;
	display: block;
	clear: both;
}

#zonaplanes div {
	float: left;
	text-align: left;
}

#zonaplanes .price {
	font-size: 90%;
	text-align: right;
	width: 43%;
	font-weight: normal;
	float: right;
}

#zonaplanes .tipo {
	font-weight: bold;
	font-size: 0.9em;
	width: 47%;
	margin-bottom: 0.3em;
}

#zonaplanes .tipo span {
	font-size: .9em;
	line-height: 120%;
	display: block;
	font-weight: normal;
}

#zonaplanes .costo {
	font-size: 1.1em;
	font-weight: bold;
}

#infoplan {
	background: #E4F9FA;
	text-align: center;
	margin: 1em auto 0 auto;
	padding: 0.5em;
	width: 90%;
}

#infotarjeta {
	text-align: center;
	margin-top: 1em;
}

#infotarjeta p {
	color: #666666;
	font-weight: normal;
}

.dst {
	font-weight: bold;
	font-size: 0.85em;
	line-height: 1.2em;
	color: #FF3366;
	margin-bottom: 0.5em;
}

/**/
#precio_descuento {
	display: none;
}

/**/
#datospago .promo .inputbox {
	color: #0B7B7D;
	font-weight: bold;
	text-align: center;
}

/*nuevo*/
#datospago .price,
#datospago .promo {
	font-weight: bold;
	width: 40%;
	text-align: right;
	vertical-align: bottom;
	white-space: nowrap;
	float: right !important;
	display: block !important;
}

/*nuevo*/
#datospago .titinfo {
	font-size: 1.3em;
	font-weight: bold;
	vertical-align: bottom;
	width: 60%;
}

/*nuevo*/
#datospago #promo2 {
	width: 100%;
	text-align: center;
}

.nowrap {
	white-space: nowrap;
}

/*feb2024*/
.white #datospago .titulo {
	width: 92%;
}

.separator {
	text-align: center;
	font-size: 1.1em;
	max-width: 550px;
	margin: 1em auto;
}

hr {
	display: inline-block;
	width: 80px;
	border: 2px solid #ffffff;
	color: #ffffff;
	margin: 0 5px;
	text-align: center;
}

#datospago {
	width: 100%;
	padding: 0 !important;
	float: none;
}

#pago-step2 {
	border-bottom: dotted 1px #999999;
	padding: 0.7em 0.5em;
	width: 90%;
	display: table;
	background: #E3F9FA;
	font-size: .9em;
	margin: 0 auto !important;
}

#pago-step2 .texto {
	font-size: 1.1em;
}

#pago-step2 label {
	display: block;
	width: 100%;
	float: none;
	font-size: 1.1em;
	padding: 0.35em 0em 0.35em 0em;
	line-height: 1.2em;
}

#datospago .total {
	width: 90%;
	margin: 0 auto !important;
}

#tarjetapago div,
#sepa div {
	margin-top: 0px;
	margin-bottom: 10px;
}

.desplegables,
form.user2 {
	width: 98%;
	max-width: 550px;
	margin: 0 auto;
	position: relative;
}

#tarjeta,
#domiciliacion {
	box-sizing: border-box;
	width: 100%;
	margin: 0 auto;
	background: #ffffff;
	border-radius: 4px;
	margin-bottom: 1em;
	position: relative;
}

#cvcinfo {
	width: 100%;
	margin: 0 !important;
}

#tarjeta1 {
	vertical-align: top;
	padding: 0px;
}

#tarjeta2 img {
	float: left;
	padding-right: 10px;
}

.padtar,
#desplegable-dom {
	padding: 0em 1.3em 1em 1.3em;
}

#datospago .metodos {
	display: flex;
	width: 100%;
	color: #555555;
	font-size: 1.18em;
	padding: 0.45em;
	box-sizing: border-box;
	align-items: center;
	border-radius: 4px;
	border: none;
	background: #ffffff;
}

.metodos img {
	padding: 0 6px 0 24px;
}

#seguridad img {
	max-height: 16px;
	vertical-align: bottom;
	padding: 0 5px 0 0;
}

#frmReg span,
.jsvalidation {
	font-size: .85em;
	line-height: 110%;
	color: #CC0000;
	left: 0px;
	background: #ffffff;
	position: absolute;
	margin: 2px 0px 4px 0px;
}

.user div.val,
.user2 div.fix,
.fix2 {
	display: inline-block;
	width: 62%;
	padding: 0.4em 0 0.4em 0 !important;
}

.val {
	position: relative;
	padding: 0em 0 0.35em 0 !important;
}

/*14-3-2024*/
#tarjetapago .fix,
#sepa .fix {
	margin-top: 0px !important;
	margin-bottom: 3px;
	float: none;
	width: 100%;
	box-sizing: border-box;
	padding: 0px !important;
}

.inputbox[type="text"],
.inputbox[type="password"] {
	width: 100%;
	box-sizing: border-box;
}

.promo .inputbox {
	width: 110px;
}

/*8-3-2024*/
.inputbox,
input[type="text"].jsrequired,
textarea.jsrequired,
input[type="password"].jsrequired {
	font-size: 1.1em;
	/*color: #999999;*/
	border-radius: 0px;
}

/*8-3-2024*/
.select,
select.select-notfirst,
.user select {
	font-size: 1.1em;
	background: #ffffff;
	border-radius: 0px;
}

/* Ocultar las cajas al principio */
.box {
	display: none;
}

.desplegables div > input[type="radio"]{
    position: absolute;
    margin-top: 18px;
    margin-left: 10px;
    width: 16px;
    height: 16px;
  }

.desplegables>label {
	padding: 0 !important;
	margin: 0 0 0.75em 0;
}

/* Mostrar la caja siguiente cuando su radio correspondiente esté seleccionado */

.desplegables div input[type="radio"]:checked + label + .box {
    display: block;
  }

/* Estilos básicos para las cajas */
.box {
	margin-top: -1em;
	margin-bottom: 1em;
	background: #ffffff;
}

/* Estilos para colocar los elementos en columna */
.desplegables input[type="radio"],
.desplegables label {
	display: block;
}

/*12-3-2024*/
.loading {
	position: absolute !important;
	text-align: center;
	padding: 15px 0;
	z-index: 10;
	background: #ffffff;
	width: 100%;
	margin: -15px 0% 0 0%;
	left: 0;
	display: none;
}

/*14-3-2024*/
#loadingG {
	top: 0;
	padding: 1px 0 0 0;
	background: #e3f9fa;
	left: -1px;
	right: 0px;
	width: 101%;
}

.padtar .aviso {
	margin-top: 1em;
	color: red;
	border-top: dotted 1px #999999;
	padding: 0.7em 0;

}

#ext #datospago {
	box-sizing: border-box;
	width: 100%;
	padding: 0 !important;
}

#ext #datospago #pago-step2 {
	width: 100%;
	box-sizing: border-box;
}

/*8-3-2024*/
#reply {
	margin: 1em auto !important;
	width: 100%;
	width: initial;
}

/** Añadido por Fran estilo al texto miCuenta->Suscripcion
 *  Cuotra de xxx€ cada xX meses
 *
 */
#plazos_cuotas {
	font-size: 0.8em;
	width: 100%;
	text-align: center;
	max-width: 390px;
	margin: 0 auto 0.5em auto
}

.precio_calculado {
	color: #0B7B7D;
}

/*14-4-2025*/
.info5{
    width: 100%;
    padding: 0.25em 0;
    margin-bottom: 1px;
	display: table;
	max-width: 390px;
	margin: 1px auto;
}
.info5 div {
	width: auto;
    display: table-cell;
    color: #666666;
    vertical-align: middle;
    text-align: left;
    padding:0 0.25em;
}
#metodo-principal .info5{
	max-width: none;
}
#metodo-guardado-alert .info5{
	width: auto;
}
.info5 .ico-tar{
	vertical-align: middle;
	padding: 0 0.25em;
}
#sin-metodo .info5 .ico-tar,
#metodo-principal .info5 .ico-tar{
	text-align: center;
}
.info5 .ico-tar .logo-tar {
	border:solid 1px #cccccc;
	/* padding: 3px 2px; */
	border-radius: 3px;
	background: #ffffff;
	margin: 0px;
	vertical-align: middle;
}
.info5 .edit{
	vertical-align: top;
	width: 26px;
}
.info5 .eliminar{
	vertical-align: bottom;
	width: 26px;
}
.info5 .edit img,
.info5 .eliminar img{
	text-align: right;
	margin: 2px 0px;
	width: 26px;
	height: 26px;
	vertical-align: top;
}
.info5 span img{
	vertical-align: bottom;
	margin: 0 8px;
}
.edit a,
.eliminar a{display: block;}
.eliminar a img{
    background: transparent url(/imgs/ico-eliminar-off.png) no-repeat 0% 0%;
	background-size: 26px 26px;
}
.eliminar a img:hover {
    background: transparent url(/imgs/ico-eliminar-on.png) no-repeat 0% 0%;
	background-size: 26px 26px;
}
.edit a img{
    background: transparent url(/imgs/ico-seleccionar-off.png) no-repeat 0% 0%;
	background-size: 26px 26px;
}
.edit a img:hover {
    background: transparent url(/imgs/ico-seleccionar-on.png) no-repeat 0% 0%;
	background-size: 26px 26px;
}

@media (min-width: 760px) {
	#infotarjeta p {
		font-size: 1.1em;
		text-align: left;
	}

	/*nuevo*/
	#datospago .txtb {
		width: 70%;
	}

	#datospago .price,
	#datospago .promo {
		width: 30%;
	}

	/*feb2024*/
	#datospago {
		width: 50%;
		float: left;
		clear: none;
		margin-bottom: 1em;
		margin-top: 1em;
		padding: 0 3.5% 0 3.5% !important;
	}

	#datospago .total {
		width: 100%;
	}

	.white #datospago .titulo {
		width: 100%;
	}

	#pago-step2 {
		width: 100%;
	}

	#datospago a.metodos {
		font-size: 1.4em;
	}

	.desplegables,
	form.user2 {
		max-width: 550px;
		margin: 0 auto;
	}
}

@media (min-width: 985px) {

	/*PAGO PLANES*/
	#datos {
		width: 30%;
	}

	#datospago {
		width: 57%;
		padding-right: 2%;
	}

	#planes div {
		display: block;
		width: 100% !important;
		margin: 0px !important;
	}

	/*nuevo*/
	#planes ul {
		display: table;
		border-collapse: separate;
		border-spacing: 5px 0px;
	}

	#planes ul li {
		/*float:left;*/
		display: table-cell;
		width: 21%;
		margin: 1% 0.6%;
		border: solid 2px #ffffff;
		padding: 1%;
		font-size: 1.1em;
		min-width: 116px;
	}

	#planes img {
		width: 100%;
		height: auto;
		max-width: 113px;
	}

	.detail div {
		float: none !important;
	}

	#planes .tplan {
		font-weight: bold;
		font-size: 100%;
		margin: 0.2em 0;
	}

	#planes .txtplan {
		font-weight: normal;
		font-size: 100%;
		margin: 0.2em 0;
	}

	#final .price {
		font-size: 1.8em;
	}

	#zonaplanes .tipo {
		font-size: 1em;
		width: 55%;
	}

	#zonaplanes .tipo span {
		display: inline;
	}

	#zonaplanes .price {
		width: 30%;
	}

	p.dst {
		margin-top: 0.5em;
		margin-bottom: 0.5em;
	}

	/*nuevo*/
	#datospago .titinfo {
		width: 70%;
	}

	#datospago .price,
	#datospago .promo {
		width: 30%;
	}

	/*feb2024*/

	#pago-step2 .box label {
		display: block;
		width: 32%;
		float: left;
		padding: 0.35em 0.5em 0.35em 0em !important;
		line-height: 1.2em;
		text-align: right;
	}

	/*14-3-2024*/
	#tarjetapago .fix,
	#sepa .fix {
		width: 62%;
		margin-bottom: 10px;
	}
}

@media (min-width: 1020px) {
	hr {
		display: inline-block;
		width: 215px;
		border: 2px solid #ffffff;
		margin: 0 5px;
		text-align: center;
	}

	#cvcinfo {
		max-width: 320px;
	}
}