html, body, section {
  margin: 0%;
  padding: 0%;
  width: 100%;
  height: 100%;
}

#container {
  min-height:100%;
  position:relative;
}



/**************
FONTS
***************/


@font-face{ 
	font-family: 'muchacho';
	src: url('../fonts/muchacho.eot');
	src: url('../fonts/muchacho.eot#iefix') format('embedded-opentype'),
	     url('../fonts/muchacho.woff') format('woff'),
	     url('../fonts/muchacho.ttf') format('truetype'),
	     url('../fonts/muchacho.svg#webfont') format('svg');
}

/***ABRILFATFACE***/
@font-face {
    font-family: 'AbrilFatface';
    src: url('/fonts/AbrilFatface-Regular/AbrilFatface-Regular.eot');
    src: url('/fonts/AbrilFatface-Regular/AbrilFatface-Regular.eot?#iefix') format('embedded-opentype'),
         url('/fonts/AbrilFatface-Regular/AbrilFatface-Regular.woff') format('woff'),
         url('/fonts/AbrilFatface-Regular/AbrilFatface-Regular.ttf') format('truetype'),
    url('/fonts/AbrilFatface-Regular/AbrilFatface-Regular.svg#AbrilFatface') format('svg');
}

.font-family-AbrilFatface {
  font-family: 'AbrilFatface',Helvetica,Arial,sans-serif;
  font-weight: normal;
  font-style: normal;
}

html {
  font-size:14px;
}

html h1 {
  margin:0px 0 0px 0;
}

html h2 {
  margin:0px 0 0px 0;
}

body {
  font-size: 100%;
}

h1, h2 {
  font-family: 'muchacho';
  font-weight: lighter; 
  color: #F7996B;
  margin:1em 0 1em 0;
}



/**************
INTRO TEXT
***************/

#intro {
    text-align: center;
    z-index: 1;
    width: 100%;
    position:absolute;
}

#intro h1 {
    font-size: 1.3em;
    letter-spacing: 0.13em;
    color: #ffffff; 
    left: 0;
    right: 0;
    top: 2%
}

.text {
  position:relative;
  top: 38%;
}


#intro .text #cielo img {
  max-width:120px;
  margin:-13px;
  margin-bottom: -7px;
}

#intro .text button img {
  max-width:60px;
  float:left;
}



/**************
FOOTER
***************/


FOOTER {
  clear:both;
}

#outro {
    position: fixed; 
    bottom: 0;
    left: 0;
    right: 0;
    height: 45px;
    text-align: center;
    z-index: 1;
    width: 100%;
    background-color:black;
}


iframe {
  overflow:hidden;
  border:0;
}


/**************
BIO
***************/

#header_bio {
  background-color: rgba(247, 153, 107, 0.2);
  padding-top:30px;
  padding-bottom:30px;
  min-height:100%;  
}

#logo img {
  width:80%;
  max-width:800px;
  display:block;
  margin: auto auto 30px auto;  
}

#texto_bio {
  width:80%;
  max-width:1000px;
  display:block;
  margin: auto;
  text-align:justify;
  font-size: 16px;
  font-family: 'calibri';
}

#texto_bio p {
  margin-bottom:0;  
}

span {
  color: #F7996B;
}


/**************
COMUNICADO
***************/

#titulo {
  width:80%;
  max-width:1000px;
  display:block;
  margin: 15px auto 30px auto;
  text-align:center;
  font-size: 20px;  
  font-family: 'calibri';
  font-weight:bolder;
  color:black;
}


#subtitulo h2 {
  width:80%;
  max-width:1000px;
  display:block;
  margin: auto;
  text-align:left;
  font-size: 14px;  
  font-family: 'calibri';
  font-weight:lighter;
  font-style:italic;
  color:black;
}

#subtitulo a {
    text-decoration:none;
}

/**************
RIDER
***************/

#titulo_rider {
width:80%;
  max-width:1000px;
  display:block;
  margin: 15px auto 30px auto;
  text-align:center;
  font-size:40px;

}
  
#subtitulo_rider h2 {
  width:80%;
  max-width:1000px;
  display:block;
  margin: auto;
  text-align:left;
  font-size: 16px;  
  color:black;
}

#backline {
  width:80%;
  max-width:1000px;
  display:block;
  margin: auto;
  text-align:justify;
  font-size: 16px;
  font-family: 'calibri';
}


/**************
CONCURSO
***************/
a {
    text-decoration:none;
    color:#FC593D;
    position:relative;
    z-index:1;
    outline:0;
    font-style:italic;
}

a:visited {
  outline:none;
}

a:hover {
  text-decoration:none;
  color:rgba(262, 89, 61, 0.8);
  outline:none;
}

a:active {
  outline:none;
}

a:focus {
  outline:0 !important;
}


#header_concurso {
  background-color: #FFFFFF;
  padding-top:30px;
  padding-bottom:30px;
  min-height:100%;  
}

#texto_concurso {
  width:80%;
  max-width:800px;
  display:block;
  margin: auto;
  text-align:justify;
  font-size: 16px;
  font-family: 'futura';
  font-weight:300;
}

#barra {
  display:block;
  margin: 10px -13% 10px -13%;
  background-color:#FC593D;
  height:25px;
}

#listado  {
  list-style:none;
  margin:0;
  padding:0;
}

.paso {
  position: absolute;
  margin-top:5px;
  width:15%;
}

#listado li {
  height:auto;
  position:relative;
}

#listado li p {
  margin-left: 20%;
  margin-right:0%;
  text-align:justify;
}


#listado h2 {
  margin-left:5%;
  color: #FC593D;
  font-family: 'futura';
  font-size:1.8em;
  font-weight:500;
  text-align:center;
}

#outro_concurso {
    position: fixed; 
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 1;
    width: 100%;
}


/***************
FOTOS
***************/

ul.galeria {
	list-style: none;
	font-size: 0px;
	margin-left: -5%; /* should match li left margin */
	margin-top: 60px;
}
ul.galeria li {
	display: inline-block;
	padding: 10px;
	margin: 0 0 5% 5%;
	background: #fff;
	border: 1px solid #ddd;
	font-size: 16px;
	font-size: 1rem;
	vertical-align: top;
	box-shadow: 0 0 5px #ddd;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width: 42.5%;
}
ul.galeria li img {
	max-width: 100%;
	height: auto;
	margin: 0;
}
ul.galeria li h3 {
	margin: 0 0 5px;
}
ul.galeria li p {
	font-size: .3em;
	line-height: 1.5em;
	color: #999;
	margin: 0;
}

ul.galeria .fila_unica li {
	width: 90%;
}


/********************
DESTRUYENDO EL SOL
*********************/

/*img fondo*/
img#backimg {
    height: 100vh;
    width: 100vw;
    z-index: -1;
    position: absolute;
    object-position: 50% 50%;
    object-fit: cover;
}

h1, h2, h3, p, label {
    color: #fcdc00;
}