/*________GoogleFonts__lo primero_____*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap');

/*_____________WEBSITE__________*/



a{text-decoration: none; color: #303030; outline:none;}
a:hover, a:focus {text-decoration: none; color: #303030; outline:none;}/*cambia color*/
footer, header, article, section, div, h1, h2, h3, h4, h5, p, form, input, textarea, img, span, td{margin:0; padding:0; background:transparent}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {display: block; background:transparent;outline:none;padding-inline-start: 0px; padding-inline-end: 0px; margin-block-start: 0px; margin-block-end: 0px; margin:0;}
id, class, div, section {outline:none;}
h1,h2,h3,h4,h5,h6{font:inherit}
img{border:none;}
svg{overflow:hidden; vertical-align:middle}
svg {height: 100%; max-width: 100%;}
video {width:100%; height:auto; border:0;}
html {font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; scroll-behavior: smooth; /*scroll mov suave*/}
sup, sub{font-size: 0.75em;}
b,strong{font-weight:bold}
label {margin-bottom: .25rem !important; display: inline-block;}

ul {display: block; list-style-type: square; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; padding-inline-start: 20px;}
ol {display: block; list-style-type: decimal; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; padding-inline-start: 20px;}

ul.sin-estilo, ol.sin-estilo {padding-inline-start: 0px; list-style-type: none; margin-block-start: 0px; margin-block-end: 0px;}

acronym, abbr {text-decoration: underline; text-decoration: underline dotted; cursor: help; border-bottom: 0; text-decoration-skip-ink: none;}


/*________Scrolltop_______*/

.scrolltop{position:fixed; color:#c50000; bottom:20px; right:20px; display:none; background:#ec0c4e; z-index:100; padding:6px 15px 8px 13px;font-size:0.6875em;}
a.scrolltop, a:hover .scrolltop , a:focus .scrolltop {color:white;}


/*_________________selecciones___________________*/

/* webkit, opera, IE9 */
::selection { background:#ec0c4e;  color:#ffffff; text-shadow: none;}
/* mozilla firefox */
::-moz-selection { background:#ec0c4e; color:#ffffff; text-shadow: none}

/*________FLEX_______*/

.centradovertical{height:100%; display:flex; align-items: center; justify-content: center;}
.centradovertical.columna{flex-direction: column; align-items: start;}
.centradovertical.fila{flex-direction: row;}
.d-flex {display: -webkit-box!important; display: -ms-flexbox!important; display: flex!important;}
.push {margin-left: auto; display: inline-flex;}
.center-flex{align-items: center !important; }/*centrado vertical*/

.flex-wrap {-ms-flex-wrap:wrap!important; flex-wrap:wrap!important}/*los contenidos los pone en bloque uno debajo de otro*/
.flex-fill { -ms-flex:1 1 auto!important; flex:1 1 auto!important}
.flex-row{-ms-flex-direction:row!important; flex-direction:row!important}
.flex-column{-ms-flex-direction:column!important; flex-direction:column!important}
.flex-row-reverse{-ms-flex-direction:row-reverse!important; flex-direction:row-reverse!important}
.flex-column-reverse{-ms-flex-direction:column-reverse!important; flex-direction:column-reverse!important}

.flex-grow-1 {flex-grow: 1!important;}

.d-inline-flex{display:-webkit-inline-box!important; display:-ms-inline-flexbox!important; display:inline-flex!important}

.flex-start-end {display: flex; justify-content: space-between;}/* distribuir items uniformemente. El primer item al inicio, el último al final */

.flex-izq{flex: 1; display: flex; justify-content: flex-start; align-items: center;}
.flex-izq img{align-items: center;}
.flex-center{flex: 1; display: flex; justify-content: center; align-items: center;}
.flex-der{flex: 1; display: flex; justify-content: flex-end; align-items: center;}

.align-self-auto{align-self: auto!important;}
.align-self-start{align-self: flex-start!important;}
.align-self-end{align-self: flex-end!important;}
.align-self-center{align-self: center!important;}
.align-self-baseline{align-self: baseline!important;}
.align-self-strech{align-self: stretch!important;}

.inline-icon{display: flex; align-items: center;}
.inline-icon i, .inline-icon img{padding:0rem 0.10rem;}

.align-start{-ms-flex-line-pack:start!important; align-content:flex-start!important}
.align-end{-ms-flex-line-pack:end!important; align-content:flex-end!important}
.align-center{-ms-flex-line-pack:center!important; align-content:center!important}
.align-between{-ms-flex-line-pack:justify!important; align-content:space-between!important}
.align-around{-ms-flex-line-pack:distribute!important; align-content:space-around!important}
.align-stretch{-ms-flex-line-pack:stretch!important; align-content:stretch!important}

.align-items-start {align-items: flex-start!important;}
.align-items-center {align-items: center!important;}
.align-items-end {align-items: flex-end!important;}
.align-items-stretch {align-items: stretch!important;}

.justify-start{-ms-flex-pack:start!important; justify-content:flex-start!important}
.justify-end{-ms-flex-pack:end!important; justify-content:flex-end!important}
.justify-center{-ms-flex-pack:center!important; justify-content:center!important}
.justify-between{-ms-flex-pack:justify!important; justify-content:space-between!important}
.justify-around{-ms-flex-pack:distribute!important; justify-content:space-around!important}
.justify-stretch{-ms-flex-pack:justify !important; justify-content:stretch!important}


/*__________CUSTOM_____________*/

body {
  color: #303030;
  background-image: url(../images/fondo-pattern.jpg);
  background-position-y: 63px;
  min-height:100%;
  height:100%;
}

/*@media (max-width: 991px) {
	body{background-image:none}
}*/


.bold{font-weight:bold;}
.semibold{font-weight:500;}

.mr{margin-right:0.5rem!important}
.ml{margin-left:0.5rem!important}
.mt{margin-top:1.2rem!important}
.mb{margin-bottom:1.2rem!important}
.mtb{margin:0.5rem 0px !important;}

.mb-s-size{margin-bottom:0.5rem!important}

.ml-l-size{margin-left:2rem!important}
.mr-l-size{margin-right: 2rem!important;}

.mt-s-size{margin-top:10px}

.sombra {box-shadow: 1px 1px 9px -2px rgb(0 0 0 / 58%); -webkit-box-shadow: 1px 1px 9px -2px rgb(0 0 0 / 58%); -moz-box-shadow: 1px 1px 9px -2px rgb(0 0 0 / 58%);}
.sombra-texto {text-shadow: 0px 1px 2px #00000052;}

.d-none{display:none !important;}

/*colores*/
.colordest{color:#ec0c4e !important}
.gris{color:#666666;}
.gris-oscuro{color:#303030;}
.gris-claro{color:#808080;}
.verde{color:#60B760;}
.blanco{color:#ffffff;}
.rosa{color:#ff77ac;}
.rosa-claro{color:#ffa1c1}
.rojo{color:#ec0c4e;}

/*textos*/
.titpromo{font-family: 'Poppins', sans-serif; font-size:1.375em; color:#000; font-weight:500; margin-bottom:40px; line-height:140%}
.titpromo.blanco{color:white;}
.titpromo.normal{font-weight:400;}
.titpromo .edad{font-size:0.9em; color:#fff;font-weight:400;}
.titpromo.nomargin{margin:0px;}

@media (max-width: 991px) {
	.titpromo{font-size:1em;}
}

.txtmin{font-size: 0.875em; color: #808080; line-height: 140%; text-decoration: none;}
.txtmin a, .txtmin a:hover, .txtmin a:focus {color: #364a63;}
.txtmin.s-size{font-size:0.8125em;}
.txtmin.xs-size{font-size:0.6875em;}

/*botones*/
.btn {border:0px solid;}

.btn-colordest, .btn-colordest a{background:#ec0f4e; color:#fff; border-color:#ec0f4e; border: 0px solid #ec0f4e;}
.btn-colordest a:hover, .btn-colordest a:focus{background:#ec0f4e; color:#fff; border-color:#ec0f4e; border: 0px solid #ec0f4e;}

.btn-azul, .btn-azul a, a.btn-azul{background:#6AAEE7; color:#fff; border-color:#6AAEE7; border: 0px solid #6AAEE7;}
.btn-azul a:hover, .btn-azul a:focus{background:#6AAEE7; color:#fff; border-color:#6AAEE7; border: 0px solid #6AAEE7;}

.btn-verde a{background:#86c102; color:#fff; border-color:#86c102; border: 0px solid #86c102;box-shadow: 0px 3px 6px #88C02566; height:40px}
.btn-verde a:hover, .btn-verde a:focus{background:#86c102; color:#fff; border-color:#86c102; border: 0px solid #86c102;}

.btn-cuadrado{padding: 25px 10px; height: 104px; width: 104px; text-align: center; box-shadow: 0px 3px 6px #6AAEE766;}
.btn-cuadrado a{
	padding:0px;
}
.btn-cuadrado img{width:20px; margin:5px auto;}

.btn-verde.s-size a{font-size: 12px; height: 32px; padding:0px 5px; line-height:32px}

/*contenido centrado flex*/
.contenido-centrado-flex{min-height:100vh; display:flex; align-items: center; justify-content: center;}

/*contenido centrado flex*/
.fullscreen-wrap {display: flex; flex-direction: column; min-height: 100vh; z-index:1}
.fullscreen-content {padding: 0 !important; min-height: 100vh; display: flex; flex-direction: column;}
.fullscreen-block {margin-bottom: auto; padding: 1.25rem;}
.fullscreen-header{margin-bottom: auto; background: #fff; padding: 15px; text-align:center; color:black; box-shadow: 0px 3px 6px #EC0C4E29;}
.fullscreen-no-header{margin-bottom: auto;}
.fullscreen-footer{margin-top: auto; background: #fff; border-top: 1px solid #e5e9f2; padding: 5px 6px;}

@media (max-width: 991px) {
	.fullscreen-content {min-height: 90vh;}
}


/*contenido centrado upload foto*/
.contenedor-100x100{position:absolute; width:100%;height:100%;}
.contenido-centrado{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index:1000}
.overlay {height: 100%; width: 100%; position: fixed; left: 0; top: 0; background-color: rgba(0,0,0,0.7); overflow-x: hidden; z-index: 500; display: inherit;}


.caja-container{height: 100%; width: 100%; position: fixed; left: 0; top: 0; overflow-x: hidden; z-index: 1002;}
.caja-zone{display: flex; -ms-flex-align: center; align-items: center; min-height: calc(100% - (.5rem * 2)); max-width: 820px; margin: 0 auto; z-index: 1001; position: relative;}

.caja-upload{width: 95%; background:white; position:relative; padding:40px 20px 35px 20px; border-radius:6px; max-width:400px; min-width:320px; font-family: 'Poppins', sans-serif; font-size:16px; font-weight:500; display: block; margin: 40px auto;}

.zona-circulo{position:absolute; left:44%; right:44%; top:-25px; z-index:502;}
.zona-circulo i{font-size:1.25em;}

/*cajas*/
.zona-maxwidth-pc{width:80%; margin:0 auto;}
@media (max-width: 991px) {
	.zona-maxwidth-pc{width:100%;}

}
.contenedor-promo{margin:0 auto;  max-width:640px;}
.contenedor-promo.alta{background:#fff; padding:20px; border-radius:4px; box-shadow: 1px 1px 9px -2px rgb(0 0 0 / 58%); -webkit-box-shadow: 1px 1px 9px -2px rgb(0 0 0 / 58%); -moz-box-shadow: 1px 1px 9px -2px rgb(0 0 0 / 58%);}
.contenedor-promo.s-size{max-width:450px;}

.img70 {width: 70px;}

.zona-encontrados{margin:15px 0px;}
.zona-encontrados.centro{margin-left:30px;}

.borde-foto{border:2px solid #ec0c4e;}
.posicion-abajo{position: absolute; bottom:5px; left:5px; z-index: 1;}
.elipsis {right:5px}/*añadido a elipsis*/
.txtuser{font-size:0.75em; text-shadow: 2px 2px 4px rgba(0,0,0,0.3);}

/*swipe*/
.swipe-cards{position:relative;}
.card{/*background-color:white; padding:4px; border-radius:4px;*/ max-width:340px; margin:0 auto;}
.card-img{position:relative;}
.card-img img.img-swipe{border-radius: 16px; width:100%;box-shadow: 0px 3px 6px #EC0C4E3D;border: 1px solid #FFFFFF;}

.card-img img.img-swipe{height: 55vh; object-fit: cover; object-position: center;}/*AÑADIDO*/

.card-txt{padding:15px 10px; position:absolute; bottom:50px; text-align:center;left:0; right:0;}
.zona-votos{position:absolute; bottom:-50px; left:0; right:0; margin-left: auto; margin-right: auto; left: 0; right: 0; text-align: center; z-index:2;}
.zona-votos img{padding:0 15px}
.card-debajo{position:absolute; background:white; padding:4px; border-radius:4px; padding-bottom:40px}
.card-debajo.izq1{z-index:-2; top:50px; left:25px;}
.card-debajo.izq2{z-index:-1; top:20px; left:40px;}
.card-debajo.der1{z-index:-2; top:50px; right:25px;}
.card-debajo.der2{z-index:-2; top:20px; right:40px;}

.hide-info{visibility:visible; display:inherit;}
.hide-info-top{visibility:hidden; display:none;}

.match{position:absolute; bottom:-5px; left:0; background:#ec0c4e; color:white; font-size:0.75em; line-height:1; padding:2px 2px; text-align:center; border-radius:3px; width:100%;}

@media only screen and (max-height: 575.98px) and (orientation: landscape) {
    .card-img img.img-swipe{height: auto;}/*AÑADIDO*/
}

@media (max-width: 480px) {
	.hide-info{visibility:hidden !important; display:none !important;}
	.hide-info-top{visibility:visible !important; display:inherit !important;}
	.fullscreen-block.alta{padding:0px;}
	.contenedor-promo.alta{width:95%;}
	/*.zona-encontrados.centro{margin:0px;}*/
}


/*SWIPE AÑADIDO*/

.ajuste-a-contenido {
    /*width: 100%;*/
    height: 100%;
    object-fit: contain;
}

.contenedor-detalle {
    position: fixed;
    margin-top: 0px;
    inset: 0px;
    /*background: rgb(255, 255, 255);*/
    z-index: 10;
    display: flex;
    flex-direction: row;
    height:100%;
    width:100%;
}

.detalle-centrado {
    flex: 1 0 100%;
    padding: 0;
    max-width: 100%;
    /*background: rgb(0, 0, 0);*/
    position: relative;
    overflow: hidden;
}

.contenedor-imagen-detalle {
    width: 100%;
    height: 100%;
    height: calc(100% - 120px);/*le restamos los 60px del footer y los 60px del header*/
    top:60px;/*le sumamos los 60px del header*/
    overflow: hidden;
    position: relative;
    /*background-color: rgba(22, 24, 35, 0.06);*/
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
}

.header-promo{
	display: flex;
    justify-content: space-around;
    box-shadow: 0px 3px 6px #EC0C4E29;
    height: 60px;
    width: 100%;
    top: 0px;
    position: fixed;
    -webkit-box-align: center;
    align-items: center;
    background: rgba(255,255,255,1);
    z-index: 20;
}

.footer-promo {
    display: flex;
    justify-content: space-around;
    box-shadow: 0px 0px 8px #EC0C4E52;
    height: 60px;
    width: 100%;
    bottom: 0px;
    position: fixed;
    -webkit-box-align: center;
    align-items: center;
    background: rgba(255,255,255,1);
    z-index: 20;
}


/*/SWIPE AÑADIDO*/



/*animaciones swipee*/
.rotate-right {
  transform: rotate(30deg) scale(0.8);
  transition: 1s;
  margin-left: 400px;
  cursor: e-resize;
  opacity: 0;
  z-index: 10;
}
.rotate-left {
  transform: rotate(-30deg) scale(0.8);
  -webkit-transform: rotate(-30deg) scale(0.8);
  transition: 1s;
  transition-duration: 1s;
  opacity: 0;
  margin-left: -400px;
  cursor: w-resize;
  z-index: 10;
}

.kk{display:none;}

.card-3 {position: absolute; transform: scale(0.86); z-index: -3; top: -48px; left: 0; right: 0;}
.card-3.zoom-front{transform: scale(0.95);transition: 0.5s; z-index:-1; top:-20px; left:0; right:0}

.card-2{position:absolute; transform: scale(0.95); z-index:-2; top:-20px; left:0; right:0}
.card-2.zoom-front{transform: scale(1); transition: 0.5s; cursor: w-resize; z-index: 1; top:0}

/*formularios*/
input:not([type="checkbox"]),input, textarea, select { 
       -webkit-appearance: none; /* remove shadow in iOS*/
       -webkit-border-radius:0; /* remove border-radius in iOS*/
       border-radius: 0; 
}

.formulario{margin-bottom:15px; height:40px!important}
select, .formulario {padding:10px!important}

.formulario:focus {
	border-color:none !important; outline: 0 !important;
	-webkit-box-shadow: none !important;
          box-shadow: none !important;
}

.zona-checkbox{display:flex; font-size:0.6875em; color:black; line-height: 140%;}
input[type=checkbox] {position: relative; cursor: pointer;width: 50px; top: -5px;}
input[type=checkbox]:before {content: ""; display: block; position: absolute; width: 20px; height: 20px; top: 0; left: 0; background: #fff; border: 1px solid #ccc;}
input[type=checkbox]:checked:before {content: ""; display: block; position: absolute; width: 20px; height: 20px; top: 0; left: 0; background-color:#1579FB; border-color:#1579FB}
input[type=checkbox]:checked:after {content: ""; display: block; width: 5px; height: 10px; border: solid white; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 4px; left: 7px;}


/*barra carga*/
.zona-carga{max-width:360px; height:16px; background:#fbcedc; border-radius:18px; margin:0 auto; position:relative;}
.barra-carga {top: 2px; left:20px; position: absolute; width: 61px; height: 12px; background: #EC0C4E; border-radius: 8px; -webkit-animation: linear infinite; -webkit-animation-name: run; -webkit-animation-duration: 2s;}

@-webkit-keyframes run {
  0% {
    left: 0;
  }
  50% { 
    left: calc(100% - 63px); 
   }
  100% {
    left: 0;     
  }
}

/*flexible añadido*/
.col01-xxs,.col10-xxs,.col11-xxs,.col12-xxs,.col02-xxs,.col03-xxs,.col04-xxs,.col05-xxs,.col06-xxs,.col07-xxs,.col08-xxs,.col09-xxs, .col5col-xxs {position:relative;min-height:1px;padding-right:15px;padding-left:15px}

@media (min-width:250px){
 
 .col01-xxs,.col10-xxs,.col11-xxs,.col12-xxs,.col02-xxs,.col03-xxs,.col04-xxs,.col05-xxs,.col06-xxs,.col07-xs,.col08-xs,.col09-xs{float:left;  z-index:1}
 .col12-xxs{width:100%}
 .col11-xxs{width:91.66666667%}
 .col10-xxs{width:83.33333333%}
 .col09-xxs{width:75%}
 .col08-xxs{width:66.66666667%}
 .col07-xxs{width:58.33333333%}
 .col06-xxs{width:50%}
 .col05-xxs{width:41.66666667%}
 .col04-xxs{width:33.33333333%}
 .col03-xxs{width:25%}
 .col02-xxs{width:16.66666667%}
 .col01-xxs{width:8.33333333%}
 
 /*empujar hacia la derecha*/
 .col12-xxs-pull{right:100%}
 .col11-xxs-pull{right:91.66666667%}
 .col10-xxs-pull{right:83.33333333%}
 .col09-xxs-pull{right:75%}
 .col08-xxs-pull{right:66.66666667%}
 .col07-xxs-pull{right:58.33333333%}
 .col06-xxs-pull{right:50%}
 .col05-xxs-pull{right:41.66666667%}
 .col04-xxs-pull{right:33.33333333%}
 .col03-xxs-pull{right:25%}
 .col02-xxs-pull{right:16.66666667%}
 .col01-xxs-pull{right:8.33333333%}
 .col00-xxs-pull{right:auto}
 
 /*tirar hacia la izquierda*/
 .col12-xxs-push{left:100%}
 .col11-xxs-push{left:91.66666667%}
 .col10-xxs-push{left:83.33333333%}
 .col09-xxs-push{left:75%}
 .col08-xxs-push{left:66.66666667%}
 .col07-xxs-push{left:58.33333333%}
 .col06-xxs-push{left:50%}
 .col05-xxs-push{left:41.66666667%}
 .col04-xxs-push{left:33.33333333%}
 .col03-xxs-push{left:25%}
 .col02-xxs-push{left:16.66666667%}
 .col01-xxs-push{left:8.33333333%}
 .col00-xxs-push{left:auto}
 
 /*desplazar cualquier columna hacia la derecha*/
 .col12-xxs-offset{margin-left:100%}
 .col11-xxs-offset{margin-left:91.66666667%}
 .col10-xxs-offset{margin-left:83.33333333%}
 .col09-xxs-offset{margin-left:75%}
 .col08-xxs-offset{margin-left:66.66666667%}
 .col07-xxs-offset{margin-left:58.33333333%}
 .col06-xxs-offset{margin-left:50%}
 .col05-xxs-offset{margin-left:41.66666667%}
 .col04-xxs-offset{margin-left:33.33333333%}
 .col03-xxs-offset{margin-left:25%}
 .col02-xxs-offset{margin-left:16.66666667%}
 .col01-xxs-offset{margin-left:8.33333333%}
 .col00-xxs-offset{margin-left:0}
 
 /*5columnas*/
 .col5col-xxs {width: 20%; float: left;}
 
}