

body{
  padding: 0;
  margin: 0;
  font-family: 'Titillium Web', sans-serif;
}

/* Bloque izquierda */
.bloque__izquierda{
  height: 100%;
  min-height: calc(100vh - 20px);
  padding: 10px 660px 10px 60px;
  background-color: #ABD8D2;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.bloque__izquierda_bl {padding:20px 100px;}

/* Bloque cabecera */
.bloque__cabecera{
  padding: 0 0 0 60px;
  margin: 0px 0 40px;
  position: relative;
}
.bloque__cabecera img{
  max-width: 400px;
  width: 100%;
}
/* Bloque video */
.bloque__video{
  margin:0;
  padding:0;
  position:relative;
  padding-bottom:calc(56.25%);
}
.bloque__video iframe {
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100%; 
  background-color:#003885;
}
/* Bloque logos */
.bloque__logos--logos {
  padding: 0 0 0 60px;
  margin: 0px 0;
  background-color: #fff;
  /*display: flex;*/
  text-align: center;
}

.bloque__logos--logos .logos {width:600px; max-width: 100%; }


/* Bloque derecha */
.bloque__derecha{
  width: calc(600px - 120px);
  height: calc(100vh - 120px);
  background-color: #ffffff;
  position: fixed;
  top: 0;
  right: 0;
  padding: 60px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;

}
/* Bloque fecha */
.bloque__logo_idis_conecta{
  width: 100%;
  height: 250px;
}
.bloque__logo_idis_conecta p{
  font-size: 24px;
  background-color: #2F282B;
  color: #ffffff;
  padding: 5px 10px;
  display: inline-block;
  margin: 0 0 10px 0;
}
.bloque__logo_idis_conecta img {margin-bottom:30px;}
.bloque__logo_idis_conecta .bot_chat,
.bloque__logo_idis_conecta .bot_programa {
  color: #008DD8;
  display: inline-block;
  cursor: pointer;
  margin-right: 2px;
  padding:2px 20px;
  font-size: 18px;
  background-color: #EEF3F6;
   border-radius: 2px;
}

.bloque__logo_idis_conecta .bot_chat.active,
.bloque__logo_idis_conecta .bot_programa.active { background-color:#008DD8;  color: #fff;  }

/* Bloque twitter */
.bloque__chat{
  margin: 30px 0;
  width: 100%;
  height: calc(100vh - 250px);
}

.bloque__chat iframe {height: calc(100vh - 300px); width: 100%; display: none;}
.bloque__chat .bloque_programa {display: none; height: calc(100vh - 300px); width: 100%; padding-right: 20px; overflow: auto;}
.bloque__chat  span.hora {display: block; color: #008DD8; padding-bottom: 10px; }
.bloque__chat  span.ponente {display: block; padding: 5px 0 ;}
.bloque__chat .bloque_programa .bloque  {padding-bottom:20px;  font-size:16px; }
.bloque__chat .bloque_programa strong {display: block; font-size:18px; font-weight: 600;}

.bloque__chat .active {display: block!important;}

.bl_preguntas {display: none;}
.bl_preguntas.active {display: block!important;}
.bl_preguntas span {display: block;}
.bl_preguntas  input, .bl_preguntas  textarea {width: 90%; padding: 10px; background: #f9f9f9; border:1px solid #cdcdcd; margin-top: 5px; margin-bottom: 20px;}
.bl_preguntas  input.bot {width: auto; padding: 10px 30px; color: #fff; background: #29C6EE; border:0px;}

.nueva_pregunta {margin-top: 20px; font-weight: bold; color: #29C6EE; cursor: pointer;}


/*Blas*/

.bloque__izquierda .bloque__cabecera .logo_fecha {position: absolute; right: 20px; bottom: 0px; max-width: 160px;}

.bloque__izquierda {background:transparent url(img/fondo_idis.jpg) no-repeat center center; background-size: cover;}
.bloque__izquierda_bl {  padding: 20px 60px;}
.bloque__logos--logos {padding-top: 15px;}
.bloque__izquierda iframe  {box-shadow: 0 0px 40px 0px rgba(0,0,0,.4); /*border:12px solid #fff; border-radius: 4px; width: calc(100% - 24px);*/}

@media only screen and (max-width: 1600px) {

.bloque__cabecera img {max-width: 350px;}
.bloque__izquierda_bl {padding:20px 0px;}
.bloque__derecha { width: calc(500px - 120px);}
.bloque__izquierda { padding: 10px 560px 10px 60px;}
}

@media only screen and (max-width: 1500px) {
.bloque__logo_idis_conecta p { font-size: 18px;}
.bloque__cabecera{  margin: 0px 0 25px;}
}

@media only screen and (max-width: 1240px) {

  /* Bloque izquierda */
  .bloque__izquierda{
    padding: 10px 460px 10px 60px;
  }

  /* Bloque logos */
  .bloque__logos--logos > div > div {
    margin: auto;
    width: 65%; 
  }

  /* Bloque derecha */
  .bloque__derecha{
    width: calc(400px - 120px);
    
  }

}
@media only screen and (max-width: 1240px) {

.bloque__logos--logos, 
.bloque__cabecera {   padding-left:30px;}

}

@media only screen and (max-width: 1024px) {


  /* Bloque izquierda */
  .bloque__izquierda{
    padding:  0 30px;
    min-height: auto;
  }

  /* Bloque logos */
  .bloque__logos--logos {
    position: relative;
    padding: 15px ; 
  }
  .bloque__logos--logos > div > div {
    width: 100%;
  }

  /* Bloque derecha */
  .bloque__derecha{
    padding: 30px 30px;
    width: calc(100% - 60px);
    height: auto;
    display: block;
    position: relative;
  }

}

@media only screen and (max-width: 768px) {



  .bloque__cabecera img {max-width: 280px;}

  /* Bloque izquierda */
  .bloque__izquierda{
    padding: 25px;
  }

  /* Bloque cabecera */
  .bloque__cabecera{
    padding: 0;
    margin: 20px 0;
  }

  /* Bloque logos */
  .bloque__logos--logos {
    flex-wrap: wrap;
    max-width: 80%;
    margin: 0;
    padding: 30px 15px 0px;
  }




}




@media only screen and (max-width: 576px) {

  .bloque__logo_idis_conecta img {
    max-width: 150px;}

    .bloque__logo_idis_conecta {height: auto;}

  .bloque__izquierda .bloque__cabecera .logo_fecha {display: none;}

  .bloque__izquierda iframe  {box-shadow: 0 0px 40px 0px rgba(0,0,0,.1); border:0px solid #fff; border-radius: 0px; width: calc(100% - 0px);}
  
  .bloque__izquierda{
    padding: 25px 0;
  }
  .bloque__izquierda_bl {  padding: 0px;}
  .bloque__cabecera {padding: 0 25px;}

  /* Bloque logos */
  .bloque__logos--logos {
    max-width: 100%;
    padding: 10px 20px 10px;
  }
  .bloque__logos--logos-grupo-logo a img{
    max-height: 30px;
  }

    /* Bloque derecha */
  .bloque__derecha{
    padding: 30px 25px;
    width: calc(100% - 50px);
  }

}


