body {
   width:100%;
   margin:0;
   padding:0;
   font-family: var(--font);
   
}

#respuesta{
   position:fixed;
   left:10px;
   top:110px;
   font-family: Bauhaus-Md-Medium;
   font-size: 16px;
   color:#2ea3f2;
}


#clear{clear: both;}
.div_overflow {overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

.modal{
   width:100%; 
   height:100%; 
   background: rgba(0,0,0,.8);
   position:fixed; 
   top:0;
   left:0;
   display:none;
   z-index:100;
   overflow: auto;
}

.ventana_modal{
   /* ventana donde se mostrara la informacion modal */
   text-align:left; 
   position: absolute;
   background: #c4c4c4;
   border: 8px solid rgba(0,0,0,0.5);
   padding:10px;
   border-radius: 20px;
   font-family: Aldosemibold;
   font-size: 30px;
}

.boton_cerrar_modal{
   width: 40px;
   height: 40px;
   color: #fff;
   float: right;
   font-weight: bold;
   font-family: Arial;
   cursor: pointer;
   margin-top: -40px;
   border: 8px solid #626262;
   text-align: center;
   border-radius: 28px;
   margin-right: -30px;
   position: absolute;
   right: 0;
   line-height: 40px;
   background: #202020;
}


.titulo{
   font-family: var(--titulo-font);
   font-weight: var(--titulo-font-b);
   font-style: var(--titulo-font-i);
   text-decoration: var(--titulo-font-u);
   font-size: var(--titulo-font-size);
   color:var(--titulo-font-color);
   text-align: center;
   width: 100%;
   height: 30px;
   
}

.titulo a{
   color:#000000;
   text-decoration: none;
}

.titulo a:hover{
   color:#000000;
   text-decoration:underline;
}

.container-sup {
   overflow: hidden;
   white-space: nowrap;
   height: 30px;
   background-image: linear-gradient(to left, #EEBF47,#FEEB91, #A76621,#EEBF47);
   font-family: 'Lato', sans-serif !important;   
   color: aliceblue;
   width: 100%;
   font-size: 12px;
   font-weight: 400;
}

.scrolling {
  animation: marquee 6s linear infinite;
  display: inline-block;
  padding-right: 10px;
  margin-top:8px
}

.over {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contenido{
   width: 1280px;
   overflow: hidden;
   font-size: 24px;
   font-family: Bauhaus-Md-Medium;
   text-align: left;
   margin: 0px auto;
   /* background-color: bisque;*/
   
}

/* Barra de titulo */
.titulo{
   font-family: Bauhaus-Lt-Light;
   font-weight: bold;
   font-style: normal;
   text-decoration: none;
   font-size: 24px;
   background-color: #3557ab;
   color: white;
   padding: 5px;
   margin:10px auto;
   width: 100%;
}

.sub_titulo{
   font-family: verdana,tahoma,arial;
   font-size: 24px;
   text-align: center;
   margin-top: 100px;
   margin-bottom: 10px;
}


@media (max-width: 1400px) {
   .contenido{width: 1024px;font-size: 22px;margin: auto;}

   .sub_titulo{
      font-family: verdana,tahoma,arial;
      font-size: 22px;
      margin-top: 100px;
      margin-bottom: 10px;
   }

}

@media (max-width: 1024px) {
   .contenido{
      width: 800px;
      font-size: 20px;
      font-family: Bauhaus-Md-Medium;
      text-align: left;
      margin: auto;
   }

   .sub_titulo{
      font-family: verdana,tahoma,arial;
      font-size: 20px;
      margin-top: 100px;
      margin-bottom: 10px;
   }
}

@media (max-width: 800px) {
   .contenido{
      width: 600px;
      overflow: hidden;
      font-size: 18px;
      font-family: Bauhaus-Md-Medium;
      text-align: left;
      margin: -50px auto;
   }

   .sub_titulo{
      font-family: verdana,tahoma,arial;
      font-size: 18px;
      margin-top: 100px;
      margin-bottom: 10px;
   }
}

@media (max-width: 500px) {
   .contenido{
      width: 100%;
      overflow: hidden;
      font-size: 16px;
      font-family: Bauhaus-Md-Medium;
      text-align: left;
      margin: -50px auto;
   }

   .sub_titulo{
      font-family: verdana,tahoma,arial;
      font-size: 16px; 
      margin-top: 100px;
      margin-bottom: 10px;
   }
}