﻿/*
	Descripción: PAREJAS.NET - PROMO
	Versión: 3.5
*/

/*________Import____________*/

@import url('flexible.css');
@import url('textos.css');
@import url('formularios.css');

@import url('animaciones.css');
@import url('glyphicons.css');


/*_____________WEBSITE__________*/

a {color: #333333; text-decoration: none;}

a:hover {color: #000000; text-decoration: none;}
div, h1, h2, h3, h4, p, form, input, textarea, img, span, td{margin:0; padding:0;}/*label,*/

h1,h2,h3{font:inherit}

img{border:none}

ul{margin:0; padding:0; list-style-type:none; list-style: none;}

html {font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}


/*________Resolución_______*/

#dimensions {
  position: fixed;
  left: 10px;
  bottom: 0px;
  background:#000\9; background-color:rgba(0, 0, 0, 0.8);
  font-size: 13px;
  color: #fff;
  padding: 5px 10px;
  z-index:1000
}

/*________SCROLLTOP APARECE_______*/

.scrolltop{
	width:49px;
	height:49px;			
	text-indent:-9999px;
	opacity:0.5;
	position:fixed;
	bottom:40px;
	right:10px;
	display:none;			
	background: url('../images/top.png') no-repeat;
	z-index:1000;
}

/*_________________selecciones___________________*/

/* webkit, opera, IE9 */
::selection { background:#d22929;  color:#fff;}
/* mozilla firefox */
::-moz-selection { background:#d22929; color:#fff;}


/*__________PÁGINA_WEB_____________*/

.limpiar{clear:both; font-size:0; line-height:0; float:none;}

.separa{width:100%;	height:10px; font-size:0; clear:both;}
.separa-min{width:100%;height:5px; font-size:0; clear:both;}
.separa1{width:100%; height:25px; font-size:0; clear:both;}
.separa2{width:100%; height:40px; font-size:0; clear:both;}

.izq{float:left}
.der{float:right}

.septop{margin-top:10px;}
.sepbot{margin-bottom:10px;}
.separabajo{padding-bottom:15px}
.sepder{margin-right:5px}
.sepizq{margin-left:5px}
.septopbot{padding:30px 0 20px 0;}
.septopbotder{padding:5px 10px 5px 0;}

.center{text-align:center;}
.right{text-align:right;}
.enlinea{display:inline-block; }
.centrado{margin:0 auto; display:block; text-align:center}
.full{width:100%}

.relative{position:relative}
.absolute{position:absolute}
.pointer{cursor:pointer}

.tachado{text-decoration:line-through;}


.linea {display:block; margin:16px 0 16px 0; width: 100%; height:1px; background:#cbcbcb;}
.linea1 {display:block; margin:26px 0 26px 0; width: 100%; height:1px; background:#cecece;}
.linea-min {display:block; margin:12px auto; width: 100%; height:1px; background:#585858;}

.linea2 {display:inline-block; margin:23px 0 23px 0; width: 100%; height:1px; background:#404040;}

.redondo{border-radius:5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;}
.redondo-top{border-radius: 10px 10px 0px 0px; -moz-border-radius: 10px 10px 0px 0px;-webkit-border-radius: 10px 10px 0px 0px;}
.redondo-bottom{border-radius: 0px 0px 10px 10px ; -moz-border-radius: 0px 0px 10px 10px ;-webkit-border-radius: 0px 0px 10px 10px ;}

.visible_en_movil{visibility:hidden; display:none}

.wrapper{background:#fff; display:table; margin:0 auto;}/*caja contenedora (envoltura)*/

.mayusculas{text-transform:uppercase}

@media (max-width: 991px) {
	.invisible{visibility:hidden; display:none}
}

@media (max-width: 767px) {
		.invisible_en_movil{visibility:hidden; display:none}
		.visible_en_movil{visibility:visible; display:inline-block;}
		.wrapper{display:block;}
}

.capa1{z-index:1;/*importante*/}


/*__________FONDOS__________*/

.sombra{
	-webkit-box-shadow: 0px 0px 18px -2px rgba(0,0,0,0.18);
	-moz-box-shadow: 0px 0px 18px -2px rgba(0,0,0,0.18);
	box-shadow: 0px 0px 18px -2px rgba(0,0,0,0.18);
}

.fontop{background:#dc2929 url('../images/fontop.jpg') repeat-x; margin-bottom:20px}

.fonbot{background:#262728 url('../images/fonaba.jpg') repeat; padding:20px 0; margin-top:20px; color:#808080; border-top:5px solid #d84748;}


/*___________TOP____________*/



.zona-top{
	width:100%; height:80px; overflow:hidden; text-align:center; padding-top:10px 
}

.zona-top p{color:#f6e290; font-size:1.214em; font-family:'Fjalla One', sans-serif; margin-top:5px}

.zona-top img{display:inline-block}



/*_________ZONAS_Y_CAJAS_______*/

.zona-caja-texto{border:1px solid #ebcbcc; background:#fff;/*f9f3f3*/ padding:20px; margin:0 auto; /*width:94%*/ }

.post-image {float:left; margin-bottom:10px;}
.post-texto{ display:block; overflow: hidden; padding: 0px 0 0px 10px;}



/*_____________TUBE____________*/

.thumb{width: 100%; display: inline-block;	vertical-align: top; /*margin: 10px 1px;*/}
.thumb-link{width: 100%; height: auto; display: block; position: relative; margin-bottom:5px}
.img-thumb {width: 100%; height: auto; border: 1px solid #ebcbcc;}

.hover{
	width: 100%;
	height: auto;
	position: absolute;
	top: 0;
	z-index: 999;
	opacity: 0;
}
.etiquetader {position: absolute; right:1px; top:1px; z-index: 50;}
.thumb-link:hover .hover{opacity: 1;}

.detalle{padding: 5px; font-size: 13px;text-align:left; height:50px; overflow:hidden; margin-bottom:20px}


/*_____________ANIMACIONES____________*/

.rotarin_img {overflow: hidden;border: 1px solid #ebcbcc;}
.rotarin_img > img {
  -webkit-transition: -webkit-transform 0.6s;
  -moz-transition: -moz-transform 0.6s;
  -o-transition: -o-transform 0.6s;
  transition: transform 0.6s;
}
@media (min-width: 768px) {
  .portfolio-rotarin:hover .rotarin_img > img {
    -webkit-transform: rotate(-14deg) scale(1.4, 1.4);
    -ms-transform: rotate(-14deg) scale(1.4, 1.4);
    transform: rotate(-14deg) scale(1.4, 1.4);
    
  }
}


/*___________ICONOS SOBRE THUMBS___________*/

.cuenta {
	position: absolute; left:40px; top:10px; z-index:1000;
	font-size: 1.286em; line-height:1.231em; padding:2px 4px 4px 4px; float:left; background:#222\8; background-color:rgba(0, 0, 0, 0.7);
}

.estado {
	position: absolute; left:10px; top:10px; z-index:1000; color:#fff;
	font-size: 1.143em; line-height:1.231em; padding:2px 4px 4px 4px; float:left; background:#258165\8; background-color:rgba(0, 107, 0, 0.6);
}

.online{
	position: absolute; right:10px; bottom:10px; z-index:1000; color:#fff;
	font-size: 1em; line-height:1.231em; padding:2px 4px 4px 4px; float:left; background:#b00612\8; background-color:rgba(176, 6, 18, 0.6);
}

@media (max-width: 480px) {
	.online, .estado, .cuenta{font-size:0.929em;}
}

.caja-top-foto{position:absolute; top:5px; right:5px;}
.caja-bottom-foto{position:absolute; bottom:5px; left:5px;}

.icono-top {display: block; font-size: 1.231em; line-height:1.231em; padding:2px 4px 4px 4px; float:left; background:#222\9; background-color:rgba(0, 0, 0, 0.7); margin-left:5px; cursor:help;}
.icono-top.inherit{font-size:inherit;}

.estados li{display: inline; list-style-type: none; margin-right: 2px; font-size:0.769em; text-align:center; color:#fff; cursor:help; border:none;}
.estados li.fonrojo{background:#dc0000\9; background-color:rgba(220, 0, 0, 0.8);border:none; padding:0 4px}
.estados li.fonverde {background:#007800\9; background-color:rgba(0, 120, 0, 0.8);border:none; padding:0 4px;}
.estados li.fonazul{background:#2b5c86\9; background-color:rgba(43, 92, 134, 0.8);border:none; padding:0 4px}

.estados li img{background:none; text-decoration:none; border:none}



/*__________LISTAS_________*/

.lnkchk  { margin:5px 0 2px 0; font-size:1.071em; color:#d1e6a8;}
.lnkchk li {
	display:inline;
	width:100%;
	float:left;
	color:#fff;
	line-height: 1.143em;
	margin-bottom:8px;
	background: url(../images/check.png) no-repeat 0px 6px;
	padding:4px 0 0 25px;
}
.lnkchk li a{ color:#d1e6a8; text-decoration:none;}
.lnkchk li a:hover {text-decoration:none; color:#d1e6a8}


/*_____________POPUP____________*/

.fondo-trans{
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.6);
  transition: opacity 500ms;
  /*visibility: hidden;*/
  /*opacity: 0;*/
  opacity:1;
  z-index:5000
}
.fondo-trans:target {visibility: visible; opacity: 1;}


.popup {
  padding: 8px 10px 10px 10px;
  background: #343434 url('../images/fondopop.jpg') repeat-x;
  width: 40%;
  z-index:10000;
  color:#fff;
}

.popup {
    margin: 0 auto;
    top: 50%; left:50%; position: absolute;
    margin-left: -160px; /*es la mitad de 320*/
    /*margin-top: -176px; es la mitad 352*/
    margin-top: -197px; /*es la mitad 394*/
}



.popup.login {width:320px; border-radius:8px; 
	background-color: #343434;
	border: 3px solid rgb(255,255,255);
	border: 3px solid rgba(255,255,255, 0.3);
	-moz-background-clip: padding; -webkit-background-clip: padding; background-clip: padding-box; 
}

.popup h2 {color: #fef7ac; font-family: Arial, Helvetica, sans-serif; font-size:1.286em; text-align:center; text-transform:uppercase}

.popup .cerrar {
  position: absolute;
  top: 10px;
  right: 5px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #fff;
}

.popup .contenido {margin-top:10px; /*max-height: 100px; overflow: auto;*/ padding:5px 10px}

.popup .contenido a{
	color:#fff
}

/*@media screen and (max-width: 420px){.popup{top:40%}}*/


/*_____________MENSAJES_ADMIN___________*/


.msg-form{
  position: relative;
  display:inline-block;
  margin: 5px 0px 7px 0px;
  padding:10px;
  /*min-width:180px;*/
}

.msg-form.azul{background:#edf7f8; border:1px solid #d2eaed; color:#2b5c86; padding:10px; font: normal 0.923em Arial, Helvetica, sans-serif; line-height:130%; }
.msg-form.verde{background:#f1f9f7; border:1px solid #e0f1e9; color:#1d9d74; padding:10px; font: normal 0.923em Arial, Helvetica, sans-serif; line-height:130%;}
.msg-form.rojo{background:#f9f2f4; border:1px solid #f2e2e6; color:#a61919; padding:10px; font: normal 0.923em Arial, Helvetica, sans-serif; line-height:130%;}
.msg-form.amarillo{background:#f9f1c7; border:1px solid #f6deac; color:#af8640; padding:10px; font: normal 0.923em Arial, Helvetica, sans-serif; line-height:130%;}


/*.posicion-mensajes{position: fixed;  right: 15px; top: 20px; z-index:5000;width:50%;}*/

.posicion-mensajes{position:fixed; z-index:1000000; top:15px; right:20px; /*max-width:500px;*/width:50%;
	right: calc(50% - 600px + 20px); /*la mitad del tamaño máximo de pantalla definido en flexible*/
}

@media all and (max-width: 1200px){.posicion-mensajes {right: 20px;}}
@media (max-width: 480px) {.posicion-mensajes {right: 10px;max-width:400px; font-weight:normal}}
@media (max-width: 768px) {.posicion-mensajes{width:90%;}}


/*mensaje ok*/
.mensaje {
	color:#fff;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
	background: url("../images/mensaje_correcto.png") left 7px top 12px no-repeat;
	background-color: #5ebd5e;
    border: 1px solid #43a543;
	padding: 10px 15px 15px 30px;
	margin: 3px;
	display:block;
	font-size:1.077em;
	/*min-width:200px;
	max-width:500px;*/
	border-radius:4px;
}

.mensaje a{color:#fff}
.mensaje a:hover{color:#fff}


/*aviso*/
.aviso {
	color:#333;
	text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.3);
	background: url("../images/mensaje_aviso.png") left 7px top 13px no-repeat;
	background-color: #ffae10/*f4b04f*/;
    border: 1px solid #f19a1f;
	padding: 10px 15px 15px 30px;
	margin: 3px;
	font-size:1.077em;
	border-radius:4px;
}

.aviso a{color:#333;}
.aviso a:hover{color:#000;}

/*error ko*/
.error {
	color:#fff;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
	background: url("../images/mensaje_error.png") left 7px top 12px no-repeat;
	background-color: #e66454;
    border: 1px solid #df3c28;
	padding: 10px 15px 15px 30px;
	margin: 3px;
	font-size:1.077em;
	border-radius:4px;
}

.error a{color:#fff}
.error a:hover{color:#fff}



.btn-cerrar{text-align:center; margin-left:5px; position:relative; vertical-align: middle;}
.btn-cerrar a {
	display: block;
	font: bold 1em Arial, Helvetica, sans-serif;
	color: #000; padding:4px 8px; text-decoration: none;
	background:#fff\9; background-color:rgba(255, 255, 255, 0.4);
	border-radius:inherit; text-shadow:none; border-radius:4px;
}
.btn-cerrar a:hover {color: #000; text-decoration: none;background-color:rgba(255, 255, 255, 0.8) }

