@charset "utf-8";
@font-face{
    font-family: LogoMC;
    src: url("fuentes/DGA_JennaSue.ttf")
 }
 @font-face{
    font-family: TextoDGA;
    src: url("fuentes/OpenSans.ttf")
 }

 @font-face{
   font-family: FuenteIconos;
   src:url("fuentes/iconosWeb.otf");
}

.izquierda{
   width: 30%;
   background-image:url(../imag/fondoingredientes.png);
   padding: 20px 1px 1px 40px;
   text-align: left;
}

.izquierda li{
   margin: 1px 30px;
}

.derecha{
   width: 70%;
   min-height: 65vh;
   background-image: url(../imag/robottrans.png);
   background-size: auto;
   background-position: center;
   background-repeat: no-repeat;
   padding: 20px 0px 0px 40px;
   text-align: left;
}

.recursos li:hover{
   background: rgba(0,0,0,.3);
   font-weight: bold;
}

.txtimg{
   float:right;
   padding: 10px;
   max-width: 90%;
}





/*********************************************************************/
/*--------------------- Pantallas Tabletas-------------------------- */
/*********************************************************************/

@media (min-width: 768px) and (max-width: 1199px) and (orientation: landscape){ 

}

@media (min-width: 768px) and (max-width: 1199px) and (orientation: portrait){ 

}

/*********************************************************************/
/*--------------------- Pantallas Móbiles-------------------------- */
/*********************************************************************/

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

   .izquierda{
      width: 100%;
      padding: 10px 0 10px 35px;
      text-align: left;

   }

   .izquierda a{
      font-size: .7rem;
   }
   
   .derecha{
      width: 100%;
      text-align:left;
   }

   .parrafos p{
       font-size: .7rem;
      /* display:none; */
   }
   
   .parrafos p:target{
      display:block;
      color: rgba(0, 0, 0,1);
   }

   .titulorecursos{
      max-width: 95%;
      font-family: LogoMC, sans-serif;
      font-size: 3rem;
      padding: 5px;
   }
   
}

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

   .izquierda{
      width: 100%;
      padding: 10px 0 10px 35px;
      text-align: left;
      font-size: 1rem;
   }

   .izquierda a{
      font-size: 1rem;
   }
   
   .derecha{
      width: 100%;
      text-align: left;
   }
   .parrafos p{
      font-size: 1rem;
      /* display:none; */
   }
   
   .parrafos p:target{
      display:block;
      color: rgba(0, 0, 0,1);
   }

   .titulorecursos{
      max-width: 95%;
      font-family: LogoMC, sans-serif;
      font-size: 3rem;
      padding: 5px;
   }
   
}