@charset "UTF-8"; 

/*== COMMON ==*/
*,*:after,*:before{
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  -ms-box-sizing:border-box;
}

html{
  height:100%;
}

body{
  min-height:100%;
}

body,html{
  color:#333333;
  font-family:'Roboto', serif;
  font-size:16px;
  /* display: block; */
}

ul,ul > li, li{
  list-style:none;
}

h1,h2,h3,h4,h5,h6{
  font-family:'knileregular',serif;
  color:#333333;
  font-weight:normal;
}

.title-section{
  color:#0b6312;
  font-size:2.2rem;
  text-transform:uppercase;
  position:relative;
}

.title-section.leaf:after{
  content:"";
  background:url(../assets/icon-decor-hojita.png) no-repeat center;
  background-size:contain;
  position:absolute;
  width:25px;
  height:20px;
  top:-2rem;
  left:0;right:0;
  margin:auto;
}

h2.title-section{
  text-align:center;
  line-height:2.25rem;

  margin-top:3rem;
}

.button.registro{
  height:auto;
  font-family:'Roboto',sans-serif;
  font-weight:bold;
  text-transform:uppercase;
  background:#71AA53;
  color:#fefefe;
  border:none;
  font-size:14px;
  border-radius:0px;

  padding:0.5rem 1.25rem;
}

/*==  HEADER ==*/

/* NAV */ 
.navbar{
  font-family:'knilesemibold',serif;
}

.navbar-end > .navbar-item .green-txt{
  color:#71AA53;
}

.hero.header{
  background-image:url('../assets/img-fondo-header.jpg');
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}

.participantes{
  width:80%;
  margin:0 auto;
  border-radius:0.25rem;
  background:#fefefe;
  text-align:center;
}

/*== horas ==*/
.countdown-cont{
  display:flex;
  align-content:center;
  justify-content:center;
  flex-direction:column;
  flex-wrap:wrap;
}

.countdown-cont h3{
  font-family:'Roboto', sans-serif;
  color:#fefefe;
  font-weight:300;
  font-size:1.75rem;
  text-transform:uppercase;
}

.countdown{
  color:#fefefe;
  font-family:'knilebold',serif;
  font-weight:bold;
  font-size:3rem;
  text-align:center;
  display:block;
}

  .countdown > div{
    display:inline-block;
    width:120px;
    margin-left:-10px;
    position:relative;
  }
  
  .countdown > div > span{
    display:block;
    font-family:'roboto',sans-serif;
    font-size:1rem;
    margin-top:10px;
  }
  
    .countdown > div:after{
      content:"";
      position:absolute;
      width:1px;
      height:110%;
      background:#fefefe;
      transform: skewX(-20deg);

      opacity:0.5;
      top:-5%;
      left:0;
    }

    .countdown > div:first-child:after{
      opacity:0;
    }

.hero .button.registro{
  display:inline-block;
  margin:10px auto;
  text-align:center;
}


div.reg-modal{ 
  display: none ; 
  position:absolute;
  background:#ffffff;
  padding:16px 12px;
  left:0px;
  width:400px;
  max-width:600px;
  min-width:300px;
  z-index: 10;
  box-shadow: 0px 5px 16px 0px rgba(0,0,0,0.3); 
}

button.simple-close-button.uk-modal-close {
    border-radius: unset;
    background: #825d16;
    color: white;
    position: absolute;
    right:2.5%;
    width:25px;
    cursor: pointer;
    z-index: 1;
}

/*== CONTENT == */

/* PANELISTAS  */
.list-panelistas,
.list-moderadores{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

/*
.six-per-row{
  display:grid;
  grid-template-columns: repeat(6, 1fr);
}

.five-per-row{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
}
*/

.un-panelista,
.un-moderador{
  text-align:center;
  margin-top:2rem;

  position:relative;
}
  .un-panelista h4,
  .un-moderador h4{
    font-size:1.2rem;
    line-height:1.5rem;
    font-family:'knileregular',serif;
  }

  .un-panelista p,
  .un-moderador p{
    font-size:1rem;
    font-family:'Roboto',sans-serif;
    font-weight:300;
    line-height:1.25rem;
  }

/*==  AGENDA ==*/
.agenda{
  background-image:url('../assets/img-fondo-agenda.jpg');
  background-size:cover;
  font-family:'knileregular',serif;
  
  margin-top:60px;
}

.agenda .hero-body .container{
  background:#fefefe;
  box-shadow:0 3px 6px rgba(0,0,0,0.16);
  padding:40px ;
}

.agenda h2{ color:#010101; text-align:left; margin-top:0px;}

.agenda h4,
.agenda h5{
  font-size:1rem;
}

.agenda-download{
  font-size:0.75rem;
  text-transform:uppercase;
  text-align:right;
}

  .agenda-download > span{
    margin-left:10px;
    position:relative;
  }
  
  .agenda-download > span:after{
    content:"";
    position:absolute;
    background:#010101;
    width:2px;
    height:80%;
    top:3%;
    left:-6px;
  }

  .agenda-download > span:first-child:after{
    background:transparent;
  }

.info-agenda li{
  display:flex;
}

.info-agenda li > span{
 font-size:1rem; 
}

  .info-agenda li > span:first-child{
    min-width:130px;
    margin-right:1rem;
    text-align:left;
  }

  .info-agenda li > span:first-child,
  .info-agenda li > span > h4{
    font-family:'knilebold',sans-serif;
  }

  .info-agenda li > span:last-child{
    text-align:left;
    width:auto;
  }

.info-agenda li > span > span{
  font-size:0.75rem;
  line-height:1.5rem;
  display:block;
}

  .info-agenda li > span > span:last-child{
    margin-bottom:1.25rem;  
  }

li > span > data{
  display:none;
  width:0px;
}


/*== LUGAR  ==*/
.lugar{
  justify-content:center;
  align-items:center;

  text-align:center;
  font-family:'knileregular',serif;


}

.lugar p{
  width:60%;
  margin:10px auto;
}
.lugar h3{
  margin-bottom:3rem;
}
.lugar .decor img{
 margin:4rem; 
}

/*== HELPER CLASSES ==*/

.margin-80{
  content:"";
  background:transparent;
  width:0px;
  height:80px;
}

.shadow-bottom-right{
  -webkit-box-shadow: #0b6312;
  -moz-box-shadow: #0b6312;
  box-shadow: #0b6312;
}

.Nota{padding-bottom:40px;}
.Nota p{line-height: 1.3em;font-weight: bold;margin-top: 5px;}
.Nota img{display:block;}

.cara-persona img{max-width: 200px;}

/*== QUERIES ==*/
@media screen and (max-width:768px){
  .navbar-end{
    margin-top:10px;
    width:100%;
    text-align:center;
  }

  .navbar-item > .green-txt{
    font-weight:bolder;
  }

  .hero.header > .hero-body{
    padding:1.5rem 1rem;
  }
  
  .countdown > div{
    width:100px;
    font-size:2rem;
  }  
  .countdown > div > span{
    margin-top:0.25rem;
    font-size:0.75rem;
  }

  .countdown > div{
    width:80px;
  }

  .agenda h4{
    line-height:1.25rem;
  }

  .agenda .hero-body .container{
    padding:20px;
  } 

  .agenda-download{
    padding:0px;
    text-align:left !important;
  }

  .info-agenda li > span:first-child{
    min-width:60px;
    margin-right:0.75rem;
    text-align:left;
  }

  .header-agenda h2{
    font-size:1.5rem;
    padding:0px;
    margin:0px;
    line-height:1.5rem;
  }
  
  li > span > data{
    font-family:"knilebold", serif;
    display:inline !important;
    width:auto;
  }

  li > span:first-child{
    display:none;
    width:0px;
  }

  .lugar{
    margin-top:4rem;
  }

  .lugar .decor img{
   width:60%; 
  }

  .list-panelistas > .un-panelista:nth-child(even) .reg-modal{
    left:initial ;
    right:0;
  }

  .list-panelistas > .un-panelista:nth-child(odd) .reg-modal{
    left:0 ;
    right:initial;
  }


}
