@charset 'UTF-8';

:root{
	--verde-claro: #b1c738;

	--turquesa: #26b5c6;

	--gris-medio: #474747;
}


/*Text*/

*{
	font-family: 'Manrope', sans-serif;
	color: var(--gris-medio);
}

p{
	font-size: .9em;
}

h2{
	font-family: 'Montagu Slab', serif;
	font-weight: 800;
	font-size: 2em;
}

h3{
	font-size: 1.5em;
	font-weight: 700;
	line-height: 1.5em;
}



/*Menu*/
.logo-menu{
	height: 30px;
}

/*Header*/

#header{
	background-image: url('../img/header-bg.jpg');
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
}

.barra{
	height: 10px;
	background-image: url('../img/barra-color.jpg');
	background-size: cover;
	background-position: center;
}

.barra.inv{
	background-image: url('../img/barra-inv.jpg');
}

h1{
	font-size: 1.2em;
	color: white;
	font-weight: 400;
	font-family: 'Manrope', sans-serif;
}

h1 span{
	background-color: var(--verde-claro);
	border-radius: 5px;
	color: white;
}

a.participa{
	color: white;
	text-decoration: none;
	border-bottom: solid 2px white;
	transition-duration: .3s;
	font-size: 1.7em;
	font-weight: 800;
}

a.participa:hover{
	color: white;
	padding-bottom: 5px;
}




/*Premios*/

#premios{
	background-image: url('../img/premios-bg.jpg');
	background-size: cover;
	background-position: center;
}

.premio-puesto span{
	background-color: var(--turquesa);
	border-radius: 7px;
	color: white;
	font-weight: 800;
}


/*Jurado*/

#jurado{
	background-image: url('../img/bg-jurado.jpg');
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
}

.jurado-img{
	border-radius: 25px;
}

h4{
	font-size: 1.5em;
}

h4 b{
	color: white;
	font-weight: 700;
}



/*Edicion anterior*/

#anterior, #ganadores{
	background-image: url('../img/bg-anterior.jpg');
	background-size: cover;
	background-position: center;
}

.badge-anteriores{
	width: 190px;
	color: white;
	background-color: var(--verde-claro);
	border-radius: 15px;
	border-bottom-left-radius: 0;
	font-weight: 700;
	margin-bottom: -25px;
	position: relative;
	z-index: 100;
}

.ganador-img{
	height: 270px;
	width: 100%;
	background-size: 120%;
	background-position: center;
	border-radius: 25px;
	text-decoration: none;
	transition-duration: .5s;
}

.ganador-img:hover{
	background-size: 130%;
}

.ganador-img.abstraccion{
	background-image: url('../img/thumb-abstraccion.jpg');
}

.ganador-img.aprension{
	background-image: url('../img/thumb-aprension.jpg');
}

.ganador-nombre{
	font-size: 1.3em;
	font-weight: 400;
}

.ganador-obra{
	color: white;
	font-weight: 700;
	font-size: 1.5em;
}

.menciones .ganador-obra, .seleccionados .ganador-obra{
	font-size: 1.2em;
}

.menciones .ganador-nombre, .seleccionados .ganador-nombre{
	font-size: 1.1em;
}

.menciones .ganador-ciudad, .seleccionados .ganador-ciudad{
	font-size: 1em;
}

.ganador-ciudad{
	font-weight: 400;
	font-size: 1.1em;
}

.subtitulo-ganadores{
	background-color: var(--verde-claro);
	border-radius: 15px;
	border-bottom-left-radius: 0;
}



/*Participar*/

#instrucciones{
	background-image: url('../img/bg-instrucciones.jpg');
	background-size: cover;
	background-position: top;
	background-attachment: fixed;
}

.instruccion-texto{
	font-size: 1em;
}

.instruccion-numero{
	font-size: 3em;
	font-family: 'Montagu Slab', serif;
	font-weight: 500;
	line-height: .8em;
}

.instr-boton{
	font-size: 1.2em;
	font-weight: 600;
	color: white;
	text-decoration: none;
	border-bottom: solid 2px white;
	transition-duration: .3s;
}

.instr-boton:hover{
	padding-bottom: 5px;
}

/*Footer*/

.logo-footer{
	max-width: 100px;
}

.logo-concurso{
	max-width: 230px;
}

.texto-footer{
	font-size: .9em;
}

.texto-footer b{
	text-transform: uppercase;
	font-weight: 800;
}

.texto-footer span{
	font-style: italic;
	font-weight: 300;
}



/*Animations*/



.spin{
	animation-name: spin;
  animation-duration: 5000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear; 
}

.delay-1{
	animation-delay: .1s;
	transition-delay: .1s;
}

.delay-2{
	animation-delay: .2s;
	transition-delay: .2s;
}

.delay-3{
	animation-delay: .3s;
	transition-delay: .3s;
}

.delay-4{
	animation-delay: .4s;
	transition-delay: .4s;
}

.delay-5{
	animation-delay: .5s;
	transition-delay: .5s;
}

.animated{
	visibility: hidden;
}


/*
==============================================
slideUp
==============================================
*/


.slideUp{
	animation-name: slideUp;
	-webkit-animation-name: slideUp;	

	animation-duration: 1s;	
	-webkit-animation-duration: 1s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;

	visibility: visible !important;			
}

@keyframes slideUp {
	0% {
		transform: translateY(100%);
		opacity: 0;
	}		
	100% {
		transform: translateY(0%);
		opacity: 1;
	}	
}

@-webkit-keyframes slideUp {
	0% {
		-webkit-transform: translateY(100%);
		opacity:0
	}		
	100% {
		-webkit-transform: translateY(0%);
		opacity: 1;
	}	
}



@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}

@-webkit-keyframes spin{
	from {
		-webkit-transform: rotate(0deg);
	}

	to{
		-webkit-transform: rotate(360deg);
	}
}











/*RESPONSIVE*/

@media (min-width: 992px){

	.logo-menu{
		height: 50px;
	}

	h1{
		font-size: 1.5em;
	}

	h2{
		font-size: 4.2em;
	}

	.ganador-img{
		height: 500px;
		width: 100%;
	}

	.premio-numero{
		font-weight: 800;
		font-size: 2em;
	}

	.premio-puesto{
		font-size: 1.9em;
	}

	.badge-anteriores{
		font-size: 1.3em;
		margin-bottom: -30px;
	}

	.logo-footer{
		max-width: 170px;
	}
}

@media (min-width: 1400px){
	#instrucciones h2{
		font-size: 4.9em;
	}
}