﻿*{
margin: 0;
padding: 0;
font-family: 'Sunflower', sans-serif;
font-weight: 300;
font-size: 16px;
color: rgb(82, 82, 82);
}



p{

}

html{

}

h1{
  font-weight: 300;
  text-align: center;
  line-height: 5em;
  color: rgb(125, 125, 125);
  font-size: 2.4em;
}
h2{
}
h3{
}

a{
text-decoration: none;
}

ol{
  padding-left: 2em;
}
li{
  margin-bottom: 0.5em;
}


/* http://sonspring.com/journal/clearing-floats */
.clear {
   clear:both;
   display:block;
   height:0;
   overflow:hidden;
   visibility:hidden;
   width:0;
}
.row:after, .clearfix:after, .container12:after, .container16:after {clear:both;}
/* For IE7. Move this to separate file when you notice some problems */
.row, .clearfix {zoom: 1;}
img, object, embed {max-width:100%;}
img {height:auto;}



::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-size: 1em;
  color: rgb(80, 80, 80);
  font-family: 'Open Sans', sans-serif;

}
::-moz-placeholder { /* Firefox 19+ */
  font-size: 1em;
  color: rgb(80, 80, 80);
  font-family: 'Open Sans', sans-serif;
}
:-ms-input-placeholder { /* IE 10+ */
  font-size: 1em;
  color: rgb(80, 80, 80);
  font-family: 'Open Sans', sans-serif;
}
:-moz-placeholder { /* Firefox 18- */
  font-size: 1em;
  color: rgb(80, 80, 80);
  font-family: 'Open Sans', sans-serif;
}

header{
  display: flex;
  width: 100%;
  height: 450px;
  background-image: url(img/fondo-header.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size:cover;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}

.seccion-logoup{
  display: flex;
  width: 1400px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.logo-up{
  display: block;
  width: 350px;
  margin-top: 1em;
}

.seccion-titulo-evento{
  display: flex;
  width: 1400px;
  align-items:flex-start;
  flex-direction: column;
  justify-content: flex-end;

}

.titulo-evento{
  display: block;
  width: 700px;
}

.primer-nota{
  display: flex;
  width: 100%;
  background-color: #c8cdcd;
}

.segunda-nota{
  display: none;
}

.contendor-primera-nota{
  display: flex;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
}

.foto-presidente{
  width: 1000px;
  display: flex;
  align-items: flex-end;
  align-content: flex-end;
  justify-content: flex-end;
  margin: 0;
  margin-bottom: -3px;
}

.info1{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  color: #4d4d4d;
  box-sizing: border-box;
  padding: 3em;
}

.titulo-keynote{
  font-size: 1.6em;
  color: #ffffffff;
  font-weight: 700;
  display: block;
  margin-top: 0.5em;
  line-height: 1em;
  margin-bottom: 0.3em;
}

.linea-bajo-titulo1{
  display: block;
  width: 30px;
  height: 3px;
  background-color: #ffffffff;
}

.nombre-presidente{
  font-size: 1.3em;
  color: #009b8c;
}

.bajada-presidente{
  color: #ffffffff;
}

.contenedor-datos{
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  margin-top: 1em;
  box-sizing: border-box;
  flex-wrap: wrap;
  padding: 2em;
}

.dato{
  width: 33.33333%;
}

.dato-lugar{
  width: 33.33333%;
}

.dato-lugar, .dato{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  box-sizing: border-box;
  flex-direction: column;
  text-align: center;
}

.icono-dato{
  display: block;
  width: 60px;
}

.info-dato{
  padding-left: 1em;
  padding-right: 1em;
}

section{
  display: block;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  border-bottom: 1px solid rgba(0, 0, 0, 0.25);
  padding-bottom: 1em;
}

.contenedor-fotos{
  display: flex;
  width: 100%;
  box-sizing: border-box;
  flex-wrap: wrap;
  justify-content: center;
}

.expositores{
  width: 20%;
  display: block;
  margin: 1em;
}

.bajada-expositores{
  box-sizing: border-box;
  padding: 0.5em;
  text-align: center;
}

.nombre-expositor{
  font-size: 1.2em;
  text-align: center;
  display: block;
  color: #009b8c;
  text-transform: uppercase;
}

.seccion-formulario{
  display: block;
  width: 100%;
}







.formulario{
  display: flex;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  flex-wrap: wrap;
  justify-content: space-between;
  box-sizing: border-box;
  padding: 2em;
  text-align: center;
  border-bottom: 1px solid rgba(0, 0, 0, 0.25);
}


.campo-inscripcion, .campo-lista{
  display: block;
  width: 49%;
  margin-bottom: 0.6em;
  margin-top: 0.6em;
  height: 40px;
  box-sizing: border-box;
  padding-left: 1em;
  line-height: 1.5em;
  border: none;
  background-color: rgba(0, 0, 0, 0.1) ;
  color:rgb(80, 80, 80) ;
  -webkit-border-radius: 8px 8px 8px 8px;
  border-radius: 8px 8px 8px 8px;
}

.autorizaciones{
  display: flex;
  width: 100%;
  margin-bottom: 0.5em;
  flex-wrap: wrap;
  margin-top: 1em;
}

.autorizacion{
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  box-sizing: border-box;
  margin-bottom: 0.5em;
  text-align: left;
}

.texto-autorizacion{
  font-size: 0.8em;
  display: block;
  width: 45%;
}

.marcar-autorizaciones{
  display:flex;
  flex-wrap: wrap;
  font-size: 0.8em;
}

#seccion-botones{
  display: block;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}

.btn-enviar{
  width: 50%;
  display: block;
  background-color: #2d2e83;
  color: #ffffffff;
  border: none;
  margin: 0 auto;
  height: 40px;
  font-weight: 700;
  font-size: 0.9em;
  -webkit-border-radius: 5px 5px 5px 5px;
  border-radius: 5px 5px 5px 5px;
  margin-top: 1em;
  margin-bottom: 1em;
}

footer{
  display: block;
  width: 100%;
  padding-bottom: 3em;
}

.contenedor-logos{
  display: flex;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  flex-wrap: wrap;
  padding: 1em;
  box-sizing: border-box;
  justify-content:flex-start;
  align-items: center;
}

.titulo-organizador{
  display: block;
  width: 100%;
  box-sizing: border-box;
}

.logo-organizan{
  display: block;
  width: 180px;
  margin: 1em;
}

.logo-organizan2{
  display: block;
  width: 300px;
  margin: 1em;
}


.gracias{
  display: block;
  width: 100%;
  text-align: center;
  font-size: 2em;
  color: #009b8c;
}

.btn-enviar a:link{
}

.cierre{
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 3em;
  font-size: 0.9em;
  color: #848484;
}

.titulo-register{
  display: block;
  width: 100%;
}

.seccion-boton-inscripcion{
  display: flex;
  width: 100%;
  justify-content:center;
  padding-top: 1.6em;
}

.btn-inscripciones a:link{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#005f51+0,04002d+100 */
  background: #005f51; /* Old browsers */
  background: -moz-linear-gradient(left, #005f51 0%, #04002d 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #005f51 0%,#04002d 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #005f51 0%,#04002d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#005f51', endColorstr='#04002d',GradientType=1 ); /* IE6-9 */
  color: #ffffffff;
  text-transform: uppercase;
  padding-right: 3em;
  padding-left: 3em;
  font-size: 1.5em;
  -webkit-border-radius: 8px 8px 8px 8px;
  border-radius: 8px 8px 8px 8px;
  padding-top: 0.3em;
  padding-bottom: 0.3em;
  -webkit-box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.2);
  box-shadow: 1px 1px 4px 1px rgba(0,0,0,0.2);
}

.btn-inscripciones a:visited{
  color: #ffffffff;
}

.btn-inscripciones a:hover{
  color: #ffffffff;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#008b51+0,040f57+100 */
background: #008b51; /* Old browsers */
background: -moz-linear-gradient(left, #008b51 0%, #040f57 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #008b51 0%,#040f57 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #008b51 0%,#040f57 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008b51', endColorstr='#040f57',GradientType=1 ); /* IE6-9 */
}

.btn-inscripciones a:active{
}


@media screen and (max-width:1500px){
  *{
  font-size: 15px;
  }
  header{
    height: 400px;
  }

  .seccion-logoup, .seccion-titulo-evento{
    width: 1350px;
  }
  .contendor-primera-nota, .formulario, .contenedor-logos, section{
    max-width: 1350px;
  }

  .foto-presidente{
    width: 850px;
  }
  .logo-organizan{
    width: 150px;
  }
  .logo-organizan2{
    width: 270px;
  }

}
@media screen and (max-width:1400px){
  *{
  font-size: 14px;
  }
  header{
    height: 300px;
  }
  .logo-up{
    width: 280px;
  }
  .titulo-evento{
    width: 540px;
  }
  .seccion-logoup, .seccion-titulo-evento{
    width: 1200px;
  }
  .contendor-primera-nota, .formulario, .contenedor-logos, section{
    max-width: 1200px;
  }
  .foto-presidente{
    width: 750px;
  }
  .icono-dato{
    width: 50px;
  }
  .logo-organizan{
    width: 120px;
  }
  .logo-organizan2{
    width: 240px;
  }


}

@media screen and (max-width:1300px){
  *{
  font-size: 13px;
  }
  header{
    height: 250px;
  }
  .logo-up{
    width: 250px;
  }
  .titulo-evento{
    width: 500px;
  }
  .seccion-logoup, .seccion-titulo-evento{
    width: 1100px;
  }
  .contendor-primera-nota, .formulario, .contenedor-logos, section{
    max-width: 1100px;
  }
  .foto-presidente{
    width: 650px;
  }
  .icono-dato{
    width: 40px;
  }
  .logo-organizan{
    width: 100px;
  }
  .logo-organizan2{
    width: 220px;
  }
  .info1{
    padding-top: 2em;
    padding-bottom: 2em;
  }
}
@media screen and (max-width:1100px){
  *{
  font-size: 12px;
  }
  header{
    height: 200px;
  }
  .logo-up{
    width: 250px;
  }
  .titulo-evento{
    width: 400px;
  }
  .seccion-logoup, .seccion-titulo-evento{
    width: 950px;
  }
  .contendor-primera-nota, .formulario, .contenedor-logos, section{
    max-width: 950px;
  }
  .foto-presidente{
    width: 650px;
  }
  .icono-dato{
    width: 40px;
  }
  .logo-organizan{
    width: 80px;
  }
  .logo-organizan2{
    width: 200px;
  }
}
@media screen and (max-width:900px){
  header{
    height: 300px;
  }
  .logo-up{
    width: 250px;
  }
  .titulo-evento{
    width: 400px;
  }
  .seccion-logoup, .seccion-titulo-evento{
    width: 95%;
  }
  .contendor-primera-nota, .formulario, .contenedor-logos, section{
    max-width: 95%;
  }
  .foto-presidente{
    width: 50%;
  }
  .info1{
    display: block;
    width: 50%;
  }

  .icono-dato{
    width: 30px;
  }
  .logo-organizan{
    width: 60px;
  }
  .logo-organizan2{
    width: 190px;
  }


  .contenedor-datos{
    flex-direction: row;
  }
  .dato {
    width: 30%;
    flex-direction: column;
  }

  .dato-lugar {
    width: 40%;
    flex-direction: column;
  }


  .info-dato{
    padding-left: 1em;
    display: block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
  }
  .expositores{
    width: 30%;
    display: block;
    margin: 0.5em;
  }

  h1{
    font-size: 2em;
  }
}
@media screen and (max-width:690px){
  header{
    height: 160px;
  }
  .logo-up{
    width: 200px;
  }
  .titulo-evento{
    width: 400px;
  }
  .foto-presidente{
    width: 40%;
  }
  .info1{
    display: block;
    width: 60%;
  }

  .expositores{
    width: 25%;
    display: block;
    margin: 0.5em;
  }
}
@media screen and (max-width:500px){
  header{
    height: 220px;
  }
  .titulo-evento{
    width: 90%;
  }
  .primer-nota{
    display: none;
  }

  .segunda-nota{
    display: flex;
    width: 100%;
    background-color: #c8cdcd;
    flex-wrap: wrap;
  }

  .texto1-2{
    display: block;
    width: 100%;
    padding: 1em;
    text-align: justify;
  }
  .contenedor-fotos{
    display: block;
  }
  .expositores{
    width: 100%;;
    display: flex;
    margin: 0;
    flex-wrap: wrap;
    align-items: center;
  }

  .foto-expositor{
    display: block;
    width: 30%;
  }

  .bajada-expositores{
    box-sizing: border-box;
    padding: 0.5em;
    text-align: left;
    display: block;
    width: 70%;
  }

  .nombre-expositor{
    font-size: 1.2em;
    text-align: left;
    display: block;
    color: #009b8c;
    text-transform: uppercase;
  }
  .campo-inscripcion, .campo-lista{
    width: 100%;
  }
  .texto-autorizacion{
    font-size: 0.8em;
    display: block;
    width: 75%;
  }
}
@media screen and (max-width:350px){
}
