*{
margin:0px;
padding:0px;
font-family: sans-serif;

}


body {
    width:100%;
    height:100%;
    
}

/************************************************************************************************************CELULAR -iphones - androids - */

@media all and (min-width:1px) and (max-width:480px){
body{
        background-color: rgb(93, 93, 93);
        height: auto
    }
    div#pagina{
    width:90%;
    margin:auto;
    margin-top: 0px;
    }
  header{
        width: 100%;
        height: auto;
        
    }
    div#contacto{
        width:100%;
        position: relative;
    }
    #contacto ul{
        
        
        
    }
    #contacto ul li{
        width:auto;
        list-style: none;
        
        
    }
    
    #contacto ul li img{
        width:auto;
        list-style: none;
        float: left;
        width: 30%;
        margin-left: 3%;
        margin-bottom: 5%;
        
        
    }
    
    div#imagenheader img{
        width: 100%;
        clear: both;
        position: relative;
    }
    
    
    header div#logo img{
        margin: auto;
        position: relative;
        margin-top: 5%;
        margin-bottom: 5%;
        height: auto;
        float: left;
    }
    
    div#nav ul{
        width:100%;
        
    }
    div#nav ul li{
        list-style: none;
    }
    
    
    div#nav ul li img{
        float: right;
        position: relative;
        margin-right: 0.5%;
        margin-left: 0.5%;
        margin-bottom: 3%;
    }
    
    div#banner,img{
        width: 100%;
    
    }
    
    div#contenido{
        margin:auto;
        margin-top:2%;
        width:95%;
        height:auto;
        background-color: rgb(24,21,35);
        border-radius: 20px;
        position: relative;
        padding: 2%;
    }
    
    div#bordeinterno{
        width: auto;
        height: auto;    
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        border-color: rgb(255,234,179);
        position: relative;
        border-style: dashed;
        padding: 5%;
        
    
    }
    div#bordeinterno img{
        width: 29%; 
        float: left;
    
    }
        
    
    
    div#bordeinterno p{
        margin-top: -1%;
        font-family: 'Roboto Slab', serif;
        font-size: 35px;
        color: rgb(255,234,179);
        width: auto;
        
    }
    
    div#home p {
        font-family: sans-serif;
        font-size: 18px;
        margin-top: 2%;

    }
    
    
    div#botonerahome p{
        margin-top: 2%;
        
        
        
    }
    
    div#botonerahome ul{
        
    }
    
    div#botonerahome ul li {
        list-style: none;
        
        
    }
    
    div#botonerahome div{
        list-style: none;
        margin-bottom: 1%;
        margin-top: 3%; 
        
    }  
    
    
    div#uno{
    background: url(imagenes/1media1.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
    height: 210px;  
    
    }
    
    #uno:hover {
        background: url(imagenes/1hover.png);
        background-size: 100%;
        background-repeat: no-repeat;
    }
    
    div#dos{
    background: url(imagenes/2.png);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 210px;  
        
    }
    
    #dos:hover {
    background: url(imagenes/2hover.png);
    background-repeat: no-repeat;
    background-size: 100%;

    }
    
    
    div#tres{
    background: url(imagenes/3.png);
    background-repeat: no-repeat;
    height: 210px;
    background-size: 100%;
    }
    
    #tres:hover {
    background: url(imagenes/3hover.png);
    background-repeat: no-repeat;
    background-size: 100%;
    }
    
    div#cuatro{
    background: url(imagenes/4.png);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 210px;
        
    }
    
    #cuatro:hover {
        background: url(imagenes/4hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
    }
    
    div#tecnologia {
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 90%;
        padding: 5%;
        position: relative;
        clear: both;
        
        
    
    }
    
      

    
    div#tecnopanel img{
        width:100%;
        margin-top: 5%;
        margin-bottom: 5%; 
        
        
    
    }
    
   
    
    div#tecnopanel ul{
        list-style: none;
        
            
        
    }
    
    div#tecnopanel ul li{
        list-style: none;
        margin-top: 2%;
        margin-bottom: 2%;

    }
   
    
    div#tecnopanel li{
    float: left;
        margin-left: 10%;
        
    }
     
    
    
    div#panel1{
         background: url(imagenes/tecno1.png);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 250px;
         height: 375px; 
    
    }
    
    #panel1:hover {
        background: url(imagenes/tecno1hover.png);
        background-repeat: no-repeat;
        background-size: 250px;
        width: 250px;
        height: 375px;
    }
    
    div#panel2{
    background: url(imagenes/tecno2.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;
    }
    
    #panel2:hover {
    background: url(imagenes/tecno2hover.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;

    }
    
    
    div#panel3{
    background: url(imagenes/tecno3.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;
    }
    
    #panel3:hover {
    background: url(imagenes/tecno3hover.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px
    }
    
    div#bordepanel{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
    
    } 
    div#tecnopanel h1{
        font-family:'Roboto Slab', serif; 
        text-align: center;
        font-size: 30px;
    
    }
    
    div#bordezachin h1{
        font-family:'Roboto Slab', serif;
        text-align: center;
        font-size: 30px;
    
    }
    
    div#bordezachin h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 5%;
    
    }
    
    
    div#bordezachin img{
        width:90%;
        float: left;
        margin: 5%
    }
    
       div#jorgezachin img{
        width: 90%;
        
    
    }
    
    div#zachin{
    
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 90%;
        padding: 5%;
        position: relative;
        float: left;
    
    }
    
    div#bordezachin{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
    
   
    div#zachin ul{
        background-color: rgb(178, 217, 237);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        width: 90%;
        margin: 5%
        
        
    }
    
    div#zachin ul li{
        font-family: 'Roboto';
        font-weight: bolder;
        margin-right: 6%;
        margin-left: 10%;
        font-size: 15px;
        color: rgb(24,21,35);
        margin-bottom: 3%;
        
    
    
    }
    div#zachin p{
        margin-top: 5%;
        margin-bottom: 5%;
        font-size: 20px;
    
    }
    
    div#placauno{
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        clear: both;
    }
    
    div#bordeplacauno{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
    }
    
    div#bordeplacauno img{
        width:90%;
        margin-left: 5%;
        margin-top: 5%;
        margin-bottom: 5%;
            
    }
    
    div#videos{
         margin-bottom: 10%;
    
    }
  
     div#videos,h1{
          font-family:'Roboto Slab', serif;
          font-size: 40px;
          margin: 2%;
     }
    
    div#videos,h4{
        font-family: 'Roboto', sans-serif;
        font-weight: lighter;
        margin-top: 1%;
        font-size: 15px;
    
       
    }
    div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 90%;
        padding: 5%;
        clear: both;
        
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:80%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
    
    }
   
   div#curiosidades{
   position: relative;
   float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
       font-size: 20px;
       font-family: 'Roboto Slab';
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;
        font-family: 'Roboto';
        font-size: 15px;
    }
    
    div#curiosidades h3{
    margin-left: 3%;    
    margin-top: 5%;
    color: rgb(255,234,179);
    font-family: 'Roboto';
    }
    
    div#tinta p{
    margin-top: 3%;
    font-size: 15px;
    font-family: 'Roboto';
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
        float: left;
    
    } 
    


    div#comopapel h3{
        margin-top: 13%;    
    
        }
    
    div#comopapel p{
        margin-top: 3%;
        margin-left: 55%;
        font-size: 15px;
        margin-right: 3%;
    
    }
    
    div#inspiracion h3{
        margin-top: 20%;
    
    }
    
    div#inspiracion p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px;
    }
    
    
    div#editorial h3{
        margin-top: 33%;

    }  
    
    div#editorial p{
     margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
        
    }
    

    footer{
        margin:auto;
        margin-top:0;
        width:100%;
        height:auto;
        background-color: rgb(93,93,93);
        float:left;
        position: relative;
    }
    
    div#carta {
        width:100%;
        height: auto;
        background-color: rgb(93,93,93);
        margin-top: 0px;
        margin-bottom: 5px;
        text-decoration: none;
        padding-bottom:0%;

    }
    
    div#carta p{
        color: white;
        font-family: sans-serif;
        font-size: 14px;
        font-weight: 100;
        list-style: none;
        text-align: center;
        padding: 1%;
        margin-bottom: 0%;

    }
    
    div#pielogo{
        background-color: white;
        padding: 1%;
        padding-bottom: 0px;
        margin-bottom: 0%;
        border-top-right-radius: 15px;
        border-top-left-radius: 15px;
    }
    
    div#pielogo img{
        background-color: white;
        margin-left: 45%;
        width: 10%;
    }
    
    section{
        
    }
    
    
    div#caja{
        width: 90%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 5%;
        padding-bottom: 2%;
    }
    
    
    div#caja p{
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        color: white;
        font-size: 15px;
        width: auto;
        
    }
    
    div#subtituloniveluno p{
        color: rgb(185, 221, 237);
    }
    div#subtituloniveldos p{
        color: rgb(235, 151, 190);
    }
    div#niveluno{
        width: 100%;
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        background-color: rgb(24,21,35);
        clear: both;
        
        
    }
    div#niveluno p{
        color: rgb(15,154,215);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;

    }
    
    div#nivel1 ul{
        list-style: none;
        
    }
    
    div#nivel1 ul li{
        list-style: none;
        margin-top: 5%;

    }
    
    div#nivel1 li{
    }
    
    div#nivel1tp1{
         background: url(imagenes/n1tp1.svg);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 310px;
         height: 202px; 
    
    }
    
    #nivel1tp1:hover {
        background: url(imagenes/n1tp1hover.svg);
        background-repeat: no-repeat;
        background-size: 100%;
        width: 310px;
        height: 202px;
    }
    
    div#nivel1tp2{
    background: url(imagenes/n1tp2.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
    
    }
    
    #nivel1tp2:hover {
    background: url(imagenes/n1tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;

    }
    
    
    div#nivel1tp3{
    background: url(imagenes/n1tp3.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
    }
    
    #nivel1tp3:hover {
    background: url(imagenes/n1tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px
    }
  
     div#nivel1tp4{
    background: url(imagenes/n1tp4.svg);
    background-repeat: no-repeat;
   background-size: 100%;
    width: 310px;
    height: 202px
    }
    
    #nivel1tp4:hover {
    background: url(imagenes/n1tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px
        
    }
    
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 50px;
        text-align: center;

        
        
    }
    
    div#nivel2tp1{
         background: url(imagenes/n2tp1.svg);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 310;
         height: 202px; 
    
    }
    
    #nivel2tp1:hover {
        background: url(imagenes/n2tp1hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
         width: 310;
         height: 202px; 
    }
    
    div#nivel2tp2{
    background: url(imagenes/n2tp2.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310;
         height: 202px; 
    
    }
    
    #nivel2tp2:hover {
    background: url(imagenes/n2tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310;
         height: 202px; 

    }
    
    
    div#nivel2tp3{
    background: url(imagenes/n2tp3.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310;
         height: 202px; 
    }
    
    #nivel2tp3:hover {
    background: url(imagenes/n2tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310;
         height: 202px; 
    }
  
     div#nivel2tp4{
    background: url(imagenes/n2tp4.svg);
    background-repeat: no-repeat;
   background-size: 100%;
         width: 310;
         height: 202px; 
    }
    
    #nivel2tp4:hover {
    background: url(imagenes/n2tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310;
         height: 202px; 
    }
    
    
    
    div#niveldos{
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        background-color: rgb(24,21,35);
        margin-top: 5px;
        
    }
    
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;
    }

    div#grison{
        color: #838383;
    }
    
    div#jerarquía{
        font-family: 'Roboto Slab';
        font-weight: 400;
        color:#c7c7c7;
        font-size: 20px
        
    }
    
    div#jerarquía p{
        font-family: sans-serif;
        font-weight: lighter;
        color:#f0f0f0;
        
    }
    
    
    
    div#catedra{
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        background-color: rgb(24,21,35);
        clear: both;
        width: 100%;
        float: left;
        
        
    }
    
    div#catedra p{
        color: white;
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;
    }
    
    div#botoneralateralcatedra{
        width: 100%;
        float: left;
        height: auto;
        margin-top: 5%;
        
    }
    
    div#botoneralateralcatedra a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateralcatedra ul{
        width:100%;
        margin-top: 20%;
        list-style: none;
        
    }
    
    div#botoneralateralcatedra ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-bottom-left-radius: 10px;
        border-top-left-radius: 10px;
        border-bottom-right-radius: 10px;
        border-top-right-radius: 10px;
        
    }
    
    
    div#botoneralateralcatedra ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        font-size: 20px;
        text-align: center;
        
         
    }
    
    div#cajacatedra{
        width: 90%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        position: relative;
        padding: 5%;
        padding-bottom: 2%;
        margin-top: -2px
        
        
    }
    
    div#subtitulocatedra p{
        margin-top: 2%;
        margin-bottom: 5%;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        width: auto;
        color: white
        
        
    }
        
     div#objetivos p{
        color: #838383;
    }
    
    div#texto{
        color: #e2e2e2;
        font-weight: 100;
        width: 100%;
        margin-top: 3%;
        font-family: 'Roboto';
        margin-bottom: 4%;
        font-size: 15px;
    }
    
    div#objetivos img{
        clear: both;
    }
    

    div#botoneralateral{
        width: 100%;
        float: left;
        
    }
    
    div#botoneralateral a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateral ul{
        width:100%;
        list-style: none;
        margin-top: 5%;
    }
    
    div#botoneralateral ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
        
    }
    
    
    div#botoneralateral ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        text-align: center;
        
         
    }
    
    div#cianon{
        color: rgb(15,154,215);
    }
    div#magentaon{
        color: rgb(226,27,120);
    }
    
    div#textoplacas{
        width: 70%;
        clear: both;
        margin-left: 20%;
        margin-top: 5%;
        margin-bottom: 5%;
        margin-right: 10%;
        
    }
    
    div#textoplacas p{
        font-family: 'Open Sans Condensed', sans-serif;   
        font-size: 15px;
        
    }
    
    
    div#caja ul{
        line-height: 30px;
        list-style: none;
        
        
    }  
    
    div#caja ul li{
        margin-bottom: 40px;
        font-family: sans-serif;
        
            
        
    }  
    
    div#caja ul li #cajacian{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(185, 221, 237);
        position: relative;
        
    }  
    div#caja ul li #cajamagenta{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(235, 151, 190);
        position: relative;

    }
    div#caja ul li span{
        font-family: 'Roboto';
        font-size: 10x;
        color: white;
        font-weight: 100;
        position: relative;
        
    }  
    
    div#links{
        float: right;
        width:10%;
        color: rgb(168, 168, 168);
        
        
    }
    
    div#cajacian img{
        margin-left: 2%;
        width:10%;
        color: rgb(168, 168, 168);
        
        
        
    }
    
   div#cajamagenta img{
        margin-left: 2%;
        width:3.5%;
        color: rgb(168, 168, 168);
        
        
        
    }

    
    div#novedades{
        width:100%;
        margin-top: 3%;
        border-radius: 15px;
        border-color: rgb(24,21,35);
        border-style:dashed;
        background-color: white
    }
    div#novedades img{
        width:50%;
        margin: 25%;
        margin-top: 5%;
        margin-bottom: 5%;

    }
  div#n1links h1{
          font-family:'Roboto Slab', serif;
          font-size: 30px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 5%;
       
        
    }
    
   
    
    div#n1links h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    color: #9bc6dd;
    font-size: 25px;
    margin-top: 3%;
        margin-bottom: 3%
   
      
    }
    div#consejos {
    float: left;
        margin-bottom: 5%;
    
    }
    div#consejos p{
        margin-top: 1%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:right;
        width: 100%;
    }
    
   
    div#consejos img{      
        width: 100%;
        margin-top: 5%;
      
       
    }
    


div#convideo p{
margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:left;
       margin-bottom: 2%;



}
    div#dimension img{
    width: 50%;
    margin-left: 25%;
    }
    
    div#lito h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
        margin-bottom: 2%;
    color: #9bc6dd;
    font-size: 2opx;
    
    }

    div#lito p{
        float: right;
        margin-top: 1%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
        width: 100%;



}
div#lito img{
width: 100%;
    margin-top: 2%


}

    hr{
     margin-top: 5%;
     color:#189fe6;
    }
  




/*termina cambio nivel 1*/
/*empeza cambio nivel 2*/

      div#nivel2link h1{        
           color: rgb(235, 151, 190);
          font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;          
          margin-bottom: 5%;
   
   } 
    
    div#nivel2link h3{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px;   
    
    }
    
    div#nivel2link h4{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 20px;
        
    }
    
    
    div#nconsejos p{
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 50%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
    
    
    }
    div#consejos img{
        width: 30%;
    
    
    }

   div#videos2 p{
    float:left;
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
       width: 
   
   }

  div#ayuda h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px; 
      color: rgb(235, 151, 190);
      
  
  }
  
 

 
    
div#ayuda ul{
    list-style: none;
    float: left;
    width: 100%;
        
            
        
    }
    
    div#ayuda ul li{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 1%;
        margin-left: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 100%;

    }
    
     div#ayuda ul li p{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 50%;

    }
     div#ayuda ul li img{
        list-style: none;
        margin-bottom: 2%;
         margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: left;
        width: 40%;

    }
    
      /*css del nuevo html consejos*/ 
  div#subtituloconsejo{
  clear: both;
  
  
  } 

  div#subtituloconsejo h1{
       font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 5%;
      
  } 


  div#nivel1consejo h3{     
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: #9bc6dd;
    font-size: 25px;
      
   
   }
 
div#nivel1consejo p{
        margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 100%;
    

}



div#nivel1consejo img{
      width: 100%;
    margin-bottom: 3%;
    margin-top: 2%;

}

/*css del nuevo html consejosnivel2*/   


div#subtituloconsejo2 h1{
     font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color:rgb(235, 151, 190);
          margin-bottom: 5%;


}

   div#nivel1consejo2 h3{     
    float: left;
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: rgb(235, 151, 190);
    font-size: 25px;
       width: 100%
      
   
   }

   div#nivel1consejo2 p{
      margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 100%;
       margin-top: 7%;
    
   }


  div#nivel1consejo2 img{
      width: 100%;
    margin-bottom: 3%;
    margin-top: 2%;
      margin-left: 2%;
}

/*fin css del nuevo html consejos*/   
    
    /* novedades */

    div#novedades{
        width:98%;
        clear: both;
        
    }
    div#novedades img{
        width:75%;
        margin: 13%;
        margin-top: 5%;
        margin-bottom: 5%;        

    }

    div#novedades h3{
    font-family: 'Roboto', sans-serif;
    margin-left: 12%;
    margin-top: 3%;
    font-size: 20px;
    color: rgb(24,21,35);
    
    
    }    
    
    div#novedades p{
        margin-left: 12%;
        margin-bottom: 2%
            
    
    }

 div#fecha{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

 div#fecha2{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

    div#cajatps{
        width: 90%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 5%;
        padding-bottom: 0px;
        
    }
    
    
   
   /* Vídeos */
    div#videos{
    margin-bottom: 10%;}
  
div#videos,h1{
    font-size: 20px;
}
    div#videos h3{
    font-size: 25px;
    margin-left: 3%;
    margin-top: 4%;
       
    }
    


}
.YTvideos {
    width:100%;
    margin-top: 5%;
    position: relative;
   height: 400px; overflow: hidden;
}
 
.YTvideos iframe,
.YTvideos object,
.YTvideos embed {
    position: relative;
    width: 100%;
    height: 100%;
} 
  
      div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
   
   div#curiosidades{
   position: relative;
   float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;    
    }
    
    div#curiosidades h3{
    margin-left: 3%;    
    margin-top: 5%;
    color: rgb(255,234,179);    
    }
    
    div#tinta p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
} 
    


        
div#comopapel h3{
margin-top: 13%;    
    
}
div#comopapel p{
    margin-top: 3%;
    margin-left: 55%;
    font-size: 15px;
    margin-right: 3%;


}

   


div#inspiracion h3{
margin-top: 20%;
}

div#inspiracion p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
}




div#editorial h3{
margin-top: 33%;

}    
div#editorial p{
     margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;


}

div#crocian{
    background-image: url(imagenes/cronogramamedia.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
    height: 1860px;
       
}

div#cromag{
    background-image: url(imagenes/cronogramamedia2.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 80%;
    height: 1700px;
        margin-left:10%;
        margin-right:10%
        
       }

/************************************************************************************************CELULAR MAS GRANDE*/

@media all and (min-width:481px) and (max-width:640px){
    body{
        background-color: rgb(93, 93, 93);
        height: auto
    }
    div#pagina{
    width:90%;
    margin:auto;
    margin-top: 0px;
    }
  header{
        width: 100%;
      height: 120px;
        
    }
    div#contacto{
        width:15%;
        margin-top:3% ;
        float: left;
    }
    #contacto ul{
        
        
    }
    #contacto ul li{
        width:auto;
        list-style: none;
        margin-bottom: 25%;
        
        
    }
    
    #contacto ul li img{
        list-style: none;
        width: 100%;
        
        
    }
    
    div#imagenheader img{
        width: 100%;
        clear: both;
        position: relative;
    }
    
    
    header div#logo img{
        width: 50%;
        margin: auto;
        position: relative;
        margin-top: 3%;
        margin-bottom: 5%;
        height: auto;
        clear: both;
        float: left
    }
    
    div#nav ul{
        width:35%;
        float: right;
        margin-top: 3%;
        
    }
    div#nav ul li{
        list-style: none;
    }
    
    
    div#nav ul li img{
        width: 100%;
        position: relative;
        margin-bottom: 5%;
    }
    
    div#banner img{
        width: 100%;
    
    }
    
    div#contenido{
        margin:auto;
        margin-top:2%;
        width:95%;
        height:auto;
        background-color: rgb(24,21,35);
        border-radius: 20px;
        position: relative;
        padding: 2%;
    }
    
    div#bordeinterno{
        width: auto;
        height: auto;    
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        border-color: rgb(255,234,179);
        position: relative;
        border-style: dashed;
        padding: 5%;
        
    
    }
    div#bordeinterno img{
        width: 20%; 
    
    }
        
    
    
    div#bordeinterno p{
        font-family: 'Roboto Slab', serif;
        font-size: 35px;
        color: rgb(255,234,179);
        width: auto;
        
    }
    
    div#home p {
        font-family: sans-serif;
        font-size: 18px;
        margin-top: 2%;

    }
    
    
    div#botonerahome p{
        margin-top: 2%;
        
        
        
    }
    
    div#botonerahome ul{
        
    }
    
    div#botonerahome ul li {
        list-style: none;
        
        
    }
    
    div#botonerahome div{
        list-style: none;
        margin-top: 3%; 
        float: left;
        margin-left: 2%;
        margin-right: 2%;
        margin-top: 5%;
        
    }  
    
    
    div#uno{
    background: url(imagenes/1media1.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width:45%;
    height: 155px;
    
    }
    
    #uno:hover {
        background: url(imagenes/1hover.png);
        background-size: 100%;
        background-repeat: no-repeat;
    }
    
    div#dos{
    background: url(imagenes/2.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width:45%;
    height: 155px;
        
    }
    
    #dos:hover {
    background: url(imagenes/2hover.png);
    background-repeat: no-repeat;
    background-size: 100%;

    }
    
    
    div#tres{
    background: url(imagenes/3.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width:45%;
    height: 155px;  
    }
    
    #tres:hover {
    background: url(imagenes/3hover.png);
    background-repeat: no-repeat;
    background-size: 100%;
    }
    
    div#cuatro{
    background: url(imagenes/4.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width:45%;
    height: 155px;
        
    }
    
    #cuatro:hover {
        background: url(imagenes/4hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
    }
    
    div#tecnologia {
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 90%;
        padding: 5%;
        position: relative;
        clear: both;
     
    }
    
    
    div#tecnopanel img{
        width:100%;
        margin-top: 5%;
        margin-bottom: 5%; 
        
        
    
    }
    
   
    
    div#tecnopanel ul{
        list-style: none;
        
            
        
    }
    
    div#tecnopanel ul li{
        list-style: none;
        margin-top: 2%;
        margin-bottom: 2%;
        margin-left: 25%;
        margin-right: 25%

    }
   
    
    div#tecnopanel li{
    float: left;
        
    }
     
    
    
    div#panel1{
         background: url(imagenes/tecno1.png);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 250px;
         height: 375px; 
    
    }
    
    #panel1:hover {
        background: url(imagenes/tecno1hover.png);
        background-repeat: no-repeat;
        background-size: 250px;
        width: 250px;
        height: 375px;
    }
    
    div#panel2{
    background: url(imagenes/tecno2.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;
    }
    
    #panel2:hover {
    background: url(imagenes/tecno2hover.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;

    }
    
    
    div#panel3{
    background: url(imagenes/tecno3.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;
    }
    
    #panel3:hover {
    background: url(imagenes/tecno3hover.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px
    }
    
    div#tecnopanel img {
        width: 90%;
        margin: 5%;
    }
    
    div#bordepanel{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
    
    } 
    div#tecnopanel h1{
        font-family:'Roboto Slab', serif; 
        text-align: center;
        font-size: 30px;
    
    }
    
    div#bordezachin h1{
        font-family:'Roboto Slab', serif;
        text-align: center;
        font-size: 30px;
    
    }
    
    div#bordezachin h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    
    }
    
    
    div#bordezachin img{
        width:90%;
        float: left;
        margin: 5%
    }
    
    div#jorgezachin img{
        width: 90%;
        
    
    }
    
    div#zachin{
    
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 90%;
        padding: 5%;
        position: relative;
        float: left;
    
    }
    
    div#bordezachin{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
    
   
    div#zachin ul{
        background-color: rgb(178, 217, 237);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        width: 90%;
        margin: 5%
        
        
    }
    
    div#zachin ul li{
        font-family: 'Roboto';
        font-weight: bolder;
        margin-right: 6%;
        margin-left: 10%;
        font-size: 15px;
        color: rgb(24,21,35);
        margin-bottom: 3%;
        
    
    
    }
    div#zachin p{
        margin-top: 5%;
        margin-bottom: 5%;
        font-size: 20px;
    
    }
    
    div#placauno{
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        clear: both;
    }
    
    div#bordeplacauno{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
    }
    
    div#bordeplacauno img{
        width:90%;
        margin-left: 5%;
        margin-top: 5%;
        margin-bottom: 5%;
            
    }
    
    
    div#videos{
         margin-bottom: 10%;
    
    }
  
     div#videos,h1{
          font-family:'Roboto Slab', serif;
          font-size: 40px;
          margin: 2%;
     }
    
    div#videos,h4{
        font-family: 'Roboto', sans-serif;
        font-weight: lighter;
        margin-top: 1%;
        font-size: 15px;
    
       
    }
    div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 90%;
        padding: 5%;
        clear: both;
        
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:80%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
    
    }
   
   div#curiosidades{
   position: relative;
   float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
       font-size: 20px;
       font-family: 'Roboto Slab';
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;
        font-family: 'Roboto';
        font-size: 15px;
    }
    
    div#curiosidades h3{
    margin-top: 5%;
    margin-left: 3%;
    color: rgb(255,234,179);
    font-family: 'Roboto';
    }
    
    div#tinta p{
    margin-top: 3%;
    font-size: 15px;
    font-family: 'Roboto';
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
        float: left;
    
    } 
    


    div#comopapel h3{
        margin-top: 13%;    
    
        }
    
    div#comopapel p{
        margin-top: 3%;
        margin-left: 55%;
        font-size: 15px;
        margin-right: 3%;
    
    }
    
    div#inspiracion h3{
        margin-top: 20%;
    
    }
    
    div#inspiracion p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px;
    }
    
    
    div#editorial h3{
        margin-top: 33%;

    }  
    
    div#editorial p{
     margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
        
    }
    

    footer{
        margin:auto;
        margin-top:0;
        width:100%;
        height:auto;
        background-color: rgb(93,93,93);
        float:left;
        position: relative;
    }
    
    div#carta {
        width:100%;
        height: auto;
        background-color: rgb(93,93,93);
        margin-top: 0px;
        margin-bottom: 5px;
        text-decoration: none;
        padding-bottom:0%;

    }
    
    div#carta p{
        color: white;
        font-family: sans-serif;
        font-size: 14px;
        font-weight: 100;
        list-style: none;
        text-align: center;
        padding: 1%;
        margin-bottom: 0%;

    }
    
    div#pielogo{
        background-color: white;
        padding: 1%;
        padding-bottom: 0px;
        margin-bottom: 0%;
        border-top-right-radius: 15px;
        border-top-left-radius: 15px;
    }
    
    div#pielogo img{
        background-color: white;
        margin-left: 45%;
        width: 10%;
    }
    
    section{
        
    }
    
    
    div#caja{
        width: 90%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 5%;
        padding-bottom: 2%;
    }
    
    div#caja img{
        width: 100%;
        
    }
    
    div#caja p{
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        color: white;
        font-size: 15px;
        width: auto;
        
    }
    
    div#subtituloniveluno p{
        color: rgb(185, 221, 237);
        font-size: 30px;
    }
    div#subtituloniveldos p{
        color: rgb(235, 151, 190);
        font-size: 30px;
    }
    div#niveluno{
        width: 100%;
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        background-color: rgb(24,21,35);
        clear: both;
        
        
    }
    div#niveluno p{
        color: rgb(15,154,215);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;

    }
    
    div#nivel1 ul{
        list-style: none;
        
    }
    
    div#nivel1 ul li{
        list-style: none;
        margin-top: 5%;

    }
    
    div#nivel1 li{
        width: auto;
    }
    
    div#nivel1tp1{
         background: url(imagenes/n1tp1.svg);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 310px;
         height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    
    }
    
    #nivel1tp1:hover {
        background: url(imagenes/n1tp1hover.svg);
        background-repeat: no-repeat;
        background-size: 100%;
        width: 310px;
        height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    }
    
    div#nivel1tp2{
    background: url(imagenes/n1tp2.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    
    }
    
    #nivel1tp2:hover {
    background: url(imagenes/n1tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
        margin-left: 20%;
        margin-right: 20%;

    }
    
    
    div#nivel1tp3{
    background: url(imagenes/n1tp3.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    }
    
    #nivel1tp3:hover {
    background: url(imagenes/n1tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    }
  
     div#nivel1tp4{
    background: url(imagenes/n1tp4.svg);
    background-repeat: no-repeat;
   background-size: 100%;
    width: 310px;
    height: 202px;
         margin-left: 20%;
        margin-right: 20%;
    }
    
    #nivel1tp4:hover {
    background: url(imagenes/n1tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
        margin-left: 20%;
        margin-right: 20%;
        
    }
    
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 50px;
        text-align: center;

        
        
    }
    
    div#nivel2tp1{
         background: url(imagenes/n2tp1.svg);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 310px;
         height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    
    }
    
    #nivel2tp1:hover {
        background: url(imagenes/n2tp1hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
         width: 310px;
         height: 202px; 
        margin-left: 20%;
        margin-right: 20%;
    }
    
    div#nivel2tp2{
    background: url(imagenes/n2tp2.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310px;
         height: 202px; 
        margin-left: 20%;
        margin-right: 20%;
    
    }
    
    #nivel2tp2:hover {
    background: url(imagenes/n2tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310;
         height: 202px; 
        margin-left: 20%;
        margin-right: 20%;

    }
    
    
    div#nivel2tp3{
    background: url(imagenes/n2tp3.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310px;
         height: 202px; 
        margin-left: 20%;
        margin-right: 20%;
    }
    
    #nivel2tp3:hover {
    background: url(imagenes/n2tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310px;
         height: 202px; 
        margin-left: 20%;
        margin-right: 20%;
    }
  
     div#nivel2tp4{
    background: url(imagenes/n2tp4.svg);
    background-repeat: no-repeat;
   background-size: 100%;
         width: 310px;
         height: 202px; 
         margin-left: 20%;
        margin-right: 20%;
    }
    
    #nivel2tp4:hover {
    background: url(imagenes/n2tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310px;
         height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    }
    
    
    
    div#niveldos{
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        background-color: rgb(24,21,35);
        margin-top: 5px;
        
    }
    
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;
    }

    div#grison{
        color: #838383;
    }
    
    div#jerarquía{
        font-family: 'Roboto Slab';
        font-weight: 400;
        color:#c7c7c7;
        font-size: 20px
        
    }
    
    div#jerarquía p{
        font-family: sans-serif;
        font-weight: lighter;
        color:#f0f0f0;
        
    }
    
    
    
    div#catedra{
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        background-color: rgb(24,21,35);
        clear: both;
        width: 100%;
        float: left;
        
        
    }
    
    div#catedra p{
        color: white;
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;
    }
    
    div#botoneralateralcatedra{
        width: 100%;
        float: left;
        height: auto;
        margin-top:3%;
        
    }
    
    div#botoneralateralcatedra a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateralcatedra ul{
        width:100%;
        margin-top: 13%;
        list-style: none;
        
    }
    
    div#botoneralateralcatedra ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-bottom-left-radius: 10px;
        border-top-left-radius: 10px;
        border-bottom-right-radius: 10px;
        border-top-right-radius: 10px;
        
    }
    
    
    div#botoneralateralcatedra ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        font-size: 20px;
        text-align: center;
        
         
    }
    
    div#cajacatedra{
        width: 90%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        position: relative;
        padding: 5%;
        padding-bottom: 2%;
        margin-top: 2%;
        
        
    }
    
    div#subtitulocatedra p{
        margin-top: 2%;
        margin-bottom: 5%;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        width: auto;
        color: white;
        
        
    }
        
     div#objetivos p{
        color: #838383;
         margin-left: 5%;
    }
    
    div#texto{
        color: #e2e2e2;
        font-weight: 100;
        width: 90%;
        margin-top: 3%;
        font-family: 'Roboto';
        margin-bottom: 4%;
        font-size: 15px;
        margin-left: 5%;
        margin-right: 5%;
    }
    
    div#objetivos img{
        clear: both;
        width: 90%;
        margin-left: 5%;
        margin-right: 5%;
    }
    

    div#botoneralateral{
        width: 100%;
        float: left;
        
    }
    
    div#botoneralateral a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateral ul{
        width:100%;
        list-style: none;
        margin-top: 5%;
    }
    
    div#botoneralateral ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
        
    }
    
    
    div#botoneralateral ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        text-align: center;
        
         
    }
    
    div#cianon{
        color: rgb(15,154,215);
    }
    div#magentaon{
        color: rgb(226,27,120);
    }
    
    div#textoplacas{
        width: 70%;
        clear: both;
        margin-left: 20%;
        margin-top: 5%;
        margin-bottom: 5%;
        margin-right: 10%;
        
    }
    
    div#textoplacas p{
        font-family: 'Open Sans Condensed', sans-serif;   
        font-size: 15px;
        
    }
    
    
    div#caja ul{
        line-height: 30px;
        list-style: none;
        
        
    }  
    
    div#caja ul li{
        margin-bottom: 40px;
        font-family: sans-serif;
        
            
        
    }  
    
    div#caja ul li #cajacian{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(185, 221, 237);
        position: relative;
        
    }  
    div#caja ul li #cajamagenta{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(235, 151, 190);
        position: relative;

    }
    div#caja ul li span{
        font-family: 'Roboto';
        font-size: 10x;
        color: white;
        font-weight: 100;
        position: relative;
        
    }  
    
    div#links{
        float: right;
        width:10%;
        color: rgb(168, 168, 168);
        
        
    }
    
    div#cajacian img{
        margin-left: 2%;
        width:10%;
        color: rgb(168, 168, 168);
        
        
        
    }
    
   div#cajamagenta img{
        margin-left: 2%;
        width:3.5%;
        color: rgb(168, 168, 168);
        
        
        
    }

    
    div#novedades{
        width:100%;
        margin-top: 3%;
        border-radius: 15px;
        border-color: rgb(24,21,35);
        border-style:dashed;
        background-color: white
    }
    div#novedades img{
        width:50%;
        margin: 25%;
        margin-top: 5%;
        margin-bottom: 5%;

    }
   div#n1links h1{
          font-family:'Roboto Slab', serif;
          font-size: 30px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 5%;
       
        
    }
    
   
    
    div#n1links h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    color: #9bc6dd;
    font-size: 25px;
    margin-top: 3%;
        margin-bottom: 3%
   
      
    }
    div#consejos {
    float: left;
        margin-bottom: 5%;
    
    }
    div#consejos p{
        margin-top: 1%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:right;
        width: 100%;
    }
    
   
    div#consejos img{      
        width: 100%;
        margin-top: 5%;
      
       
    }
    


div#convideo p{
margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:left;
       margin-bottom: 2%;



}
    div#dimension img{
    width: 50%;
    margin-left: 25%;
    }
    
    div#lito h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
        margin-bottom: 2%;
    color: #9bc6dd;
    font-size: 2opx;
    
    }

    div#lito p{
        float: right;
        margin-top: 1%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
        width: 100%;



}
div#lito img{
width: 100%;
    margin-top: 2%


}

    hr{
     margin-top: 5%;
     color:#189fe6;
    }
  


    
  


/*termina cambio nivel 1*/
/*empeza cambio nivel 2*/

      div#nivel2link h1{        
           color: rgb(235, 151, 190);
          font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;          
          margin-bottom: 5%;
   
   } 
    
    div#nivel2link h3{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px;   
    
    }
    
    div#nivel2link h4{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 20px;
        
    }
    
    
    div#nconsejos p{
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 50%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
    
    
    }
    div#consejos img{
        width: 30%;
    
    
    }

   div#videos2 p{
    float:left;
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
       width: 
   
   }

  div#ayuda h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px; 
      color: rgb(235, 151, 190);
      
  
  }
  
 

 
    
div#ayuda ul{
    list-style: none;
    float: left;
    width: 100%;
        
            
        
    }
    
    div#ayuda ul li{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 1%;
        margin-left: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 100%;

    }
    
     div#ayuda ul li p{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 50%;

    }
     div#ayuda ul li img{
        list-style: none;
        margin-bottom: 2%;
         margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: left;
        width: 40%;

    }
    
      /*css del nuevo html consejos*/ 
  div#subtituloconsejo{
  clear: both;
  
  
  } 

  div#subtituloconsejo h1{
       font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 5%;
      
  } 


  div#nivel1consejo h3{     
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: #9bc6dd;
    font-size: 25px;
      
   
   }
 
div#nivel1consejo p{
        margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 100%;
    

}



div#nivel1consejo img{
      width: 100%;
    margin-bottom: 3%;
    margin-top: 2%;

}

/*css del nuevo html consejosnivel2*/   


div#subtituloconsejo2 h1{
     font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color:rgb(235, 151, 190);
          margin-bottom: 5%;


}

   div#nivel1consejo2 h3{     
    float: left;
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: rgb(235, 151, 190);
    font-size: 25px;
       width: 100%
      
   
   }

   div#nivel1consejo2 p{
      margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 100%;
       margin-top: 7%;
    
   }


  div#nivel1consejo2 img{
      width: 100%;
    margin-bottom: 3%;
    margin-top: 2%;
      margin-left: 2%;
}

/*fin css del nuevo html consejos*/   
    
    /* novedades */

    div#novedades{
        width:100%;
        clear: both;
        
    }
    div#novedades img{
        width:75%;
        margin: 13%;
        margin-top: 5%;
        margin-bottom: 5%;        

    }

    div#novedades h3{
    font-family: 'Roboto', sans-serif;
    margin-left: 12%;
    margin-top: 3%;
    font-size: 20px;
    color: rgb(24,21,35);
    
    
    }    
    
    div#novedades p{
        margin-left: 12%;
        margin-bottom: 2%
            
    
    }

 div#fecha{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

 div#fecha2{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

    div#cajatps{
        width: 90%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 5%;
        padding-bottom: 0px;
        
    }
    
    div#crocian{
    background-image: url(imagenes/cronogramamedia.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 80%;
    height: 1700px;
        margin-left:10%;
        margin-right:10%
        
       }
    
    div#cromag{
    background-image: url(imagenes/cronogramamedia2.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 80%;
    height: 1700px;
        margin-left:10%;
        margin-right:10%
        
       }
   
   /* Vídeos */
    div#videos{
    margin-bottom: 10%;}
  
div#videos,h1{
    font-size: 20px;
}
    div#videos h3{
    font-size: 25px;
    margin-left: 3%;
    margin-top: 4%;
       
    }
    


}
.YTvideos {
    width:100%;
    margin-top: 5%;
    position: relative;
   height: 400px; overflow: hidden;
}
 
.YTvideos iframe,
.YTvideos object,
.YTvideos embed {
    position: relative;
    width: 100%;
    height: 100%;
} 
  
      div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
   
   div#curiosidades{
   position: relative;
   float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;    
    }
    
    div#curiosidades h3{
    margin-top: 5%;
    color: rgb(255,234,179);    
    }
    
    div#tinta p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
} 
    


        
div#comopapel h3{
margin-top: 13%;    
    
}
div#comopapel p{
    margin-top: 3%;
    margin-left: 55%;
    font-size: 15px;
    margin-right: 3%;


}

   


div#inspiracion h3{
margin-top: 20%;
}

div#inspiracion p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
}




div#editorial h3{
margin-top: 33%;

}    
div#editorial p{
     margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
  
}


/********************************************************************************************TABLET*/

@media all and (min-width:641px) and (max-width:800px){
    body{
        background-color: rgb(93, 93, 93);
        height: auto
    }
    
    div#pagina{
        width:70%;
        margin:auto;
        margin-top: 0px;
    }
    
    header{
        width: 100%;
        height: 120px;
        
    }
    div#contacto{
        width:15%;
        margin-top:3% ;
        float: left;
    }
    #contacto ul{
        
        
    }
    #contacto ul li{
        width:auto;
        list-style: none;
        margin-bottom: 25%;
        
        
    }
    
    #contacto ul li img{
        list-style: none;
        width: 100%;
        
        
    }
    
    div#imagenheader img{
        width: 100%;
        clear: both;
        position: relative;
    }
    
    
    header div#logo img{
        width: 50%;
        margin: auto;
        position: relative;
        margin-top: 3%;
        margin-bottom: 5%;
        height: auto;
        clear: both;
        float: left
    }
    
    div#nav ul{
        width:35%;
        float: right;
        margin-top: 3%;
        
    }
    div#nav ul li{
        list-style: none;
    }
    
    
    div#nav ul li img{
        width: 100%;
        position: relative;
        margin-bottom: 5%;
    }
    
    div#banner img{
        width: 100%;
    
    }
    
    div#contenido{
        margin:auto;
        margin-top:2%;
        width:95%;
        height:auto;
        background-color: rgb(24,21,35);
        border-radius: 20px;
        position: relative;
        padding: 2%;
    }
    
    div#bordeinterno{
        width: auto;
        height: auto;    
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        border-color: rgb(255,234,179);
        position: relative;
        border-style: dashed;
        padding: 5%;
        
    
    }
    div#bordeinterno img{
        width: 20%; 
    
    }
        
    
    
    div#bordeinterno p{
        font-family: 'Roboto Slab', serif;
        font-size: 35px;
        color: rgb(255,234,179);
        width: auto;
        
    }
    
    div#home p {
        font-family: sans-serif;
        font-size: 18px;
        margin-top: 2%;

    }
    
    
    div#botonerahome p{
        margin-top: 2%;
        
        
        
    }
    
    div#botonerahome ul{
        
    }
    
    div#botonerahome ul li {
        list-style: none;
        
        
    }
    
    div#botonerahome div{
        list-style: none;
        margin-top: 3%; 
        float: left;
        margin-left: 2%;
        margin-right: 2%;
        margin-top: 5%;
        
    }  
    
    
    div#uno{
        background: url(imagenes/1media1.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 190px;
    
    }
    
    #uno:hover {
        background: url(imagenes/1hover.png);
        background-size: 100%;
        background-repeat: no-repeat;
    }
    
    div#dos{
        background: url(imagenes/2.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 190px;
        
    }
    
    #dos:hover {
        background: url(imagenes/2hover.png);
        background-repeat: no-repeat;
        background-size: 100%;

    }
    
    
    div#tres{
        background: url(imagenes/3.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 190px;  
    }
    
    #tres:hover {
        background: url(imagenes/3hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
    }
    
    div#cuatro{
        background: url(imagenes/4.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 190px;
        
    }
    
    #cuatro:hover {
        background: url(imagenes/4hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
    }
    
    div#tecnologia {
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 90%;
        padding: 5%;
        position: relative;
        clear: both;
     
    }
    
    
    div#tecnopanel img{
        width:100%;
        margin-top: 5%;
        margin-bottom: 5%; 
        
        
    
    }
    
   
    
    div#tecnopanel ul{
        list-style: none;
        
            
        
    }
    
    div#tecnopanel ul li{
        list-style: none;
        margin-top: 2%;
        margin-bottom: 2%;
        margin-left: 25%;
        margin-right: 25%

    }
   
    
    div#tecnopanel li{
        float: left;
        
    }
     
    
    
    div#panel1{
         background: url(imagenes/tecno1.png);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 250px;
         height: 375px; 
    
    }
    
    #panel1:hover {
        background: url(imagenes/tecno1hover.png);
        background-repeat: no-repeat;
        background-size: 250px;
        width: 250px;
        height: 375px;
    }
    
    div#panel2{
        background: url(imagenes/tecno2.png);
        background-repeat: no-repeat;
        background-size: 250px;
        width: 250px;
        height: 375px;
    }
    
    #panel2:hover {
        background: url(imagenes/tecno2hover.png);
        background-repeat: no-repeat;
        background-size: 250px;
        width: 250px;
        height: 375px;

    }
    
    
    div#panel3{
        background: url(imagenes/tecno3.png);
        background-repeat: no-repeat;
        background-size: 250px;
        width: 250px;
        height: 375px;
    }
    
    #panel3:hover {
        background: url(imagenes/tecno3hover.png);
        background-repeat: no-repeat;
        background-size: 250px;
        width: 250px;
        height: 375px
    }
    
    div#tecnopanel img {
        width: 90%;
        margin: 5%;
    }
    
    div#bordepanel{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
    
    } 
    div#tecnopanel h1{
        font-family:'Roboto Slab', serif; 
        text-align: center;
        font-size: 30px;
    
    }
    
    div#bordezachin h1{
        font-family:'Roboto Slab', serif;
        text-align: center;
        font-size: 30px;
    
    }
    
    div#bordezachin h4{
        font-family: 'Roboto', sans-serif;
        font-weight: lighter;
        margin-left: 2%;
        margin-top: 2%;
    
    }
    
    
    div#bordezachin img{
        width:90%;
        float: left;
        margin: 5%
    }
    
    div#jorgezachin img{
        width: 90%;
        
    
    }
    
    div#zachin{
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 90%;
        padding: 5%;
        position: relative;
        float: left;
    
    }
    
    div#bordezachin{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
    
   
    div#zachin ul{
        background-color: rgb(178, 217, 237);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        width: 90%;
        margin: 5%;
        float: right
        
        
    }
    
    div#zachin ul li{
        font-family: 'Roboto';
        font-weight: bolder;
        margin-right: 6%;
        margin-left: 10%;
        font-size: 15px;
        color: rgb(24,21,35);
        margin-bottom: 4%;
        margin-top:4%; 
        
    
    
    }
    div#zachin p{
        margin-top: 5%;
        margin-bottom: 5%;
        font-size: 20px;
    
    }
    
    div#placauno{
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        clear: both;
    }
    
    div#bordeplacauno{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
    }
    
    div#bordeplacauno img{
        width:90%;
        margin-left: 5%;
        margin-top: 5%;
        margin-bottom: 5%;
            
    }
    
    
    div#videos{
         margin-bottom: 10%;
        height: 200px;
    
    }
  
     div#videos,h1{
          font-family:'Roboto Slab', serif;
          font-size: 40px;
          margin: 2%;
         height: auto;
     }
    
    div#videos,h4{
        font-family: 'Roboto', sans-serif;
        font-weight: lighter;
        margin-top: 1%;
        font-size: 15px;
    
       
    }
    div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 90%;
        padding: 5%;
        clear: both;
        
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:80%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
    
    }
   
   div#curiosidades{
       position: relative;
       float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
       font-size: 20px;
       font-family: 'Roboto Slab';
    }
     
    div#curiosidades h4{
        margin-left: 3%;
        margin-right: 3%;
        font-family: 'Roboto';
        font-size: 15px;
    }
    
    div#curiosidades h3{
        margin-left: 3%;
        margin-top: 5%;
        color: rgb(255,234,179);
        font-family: 'Roboto';
    }
    
    div#tinta p{
        margin-top: 3%;
        font-size: 15px;
        font-family: 'Roboto';
    }
    
    
   
    .curiosidadesvid{
        float: left;
        width: 50%;    
        margin-left: 3%; 
        margin-top: 3%;
        margin-bottom: 5%;
        position: relative;
        padding-bottom: 35%;
        height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
        position: relative;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        float: left;
    
    } 
    
    div#comopapel h3{
        margin-top: 13%;    
    
        }
    
    div#comopapel p{
        margin-top: 3%;
        margin-left: 55%;
        font-size: 15px;
        margin-right: 3%;
    
    }
    
    div#inspiracion h3{
        margin-top: 20%;
    
    }
    
    div#inspiracion p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px;
    }
    
    
    div#editorial h3{
        margin-top: 33%;

    }  
    
    div#editorial p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px;
        
    }
    

    footer{
        margin:auto;
        margin-top:0;
        width:100%;
        height:auto;
        background-color: rgb(93,93,93);
        float:left;
        position: relative;
    }
    
    div#carta {
        width:100%;
        height: auto;
        background-color: rgb(93,93,93);
        margin-top: 0px;
        margin-bottom: 5px;
        text-decoration: none;
        padding-bottom:0%;

    }
    
    div#carta p{
        color: white;
        font-family: sans-serif;
        font-size: 14px;
        font-weight: 100;
        list-style: none;
        text-align: center;
        padding: 1%;
        margin-bottom: 0%;

    }
    
    div#pielogo{
        background-color: white;
        padding: 1%;
        padding-bottom: 0px;
        margin-bottom: 0%;
        border-top-right-radius: 15px;
        border-top-left-radius: 15px;
    }
    
    div#pielogo img{
        background-color: white;
        margin-left: 45%;
        width: 10%;
    }
    
    section{
        
    }
    
    
    div#caja{
        width: 90%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 5%;
        padding-bottom: 2%;
    }
    
    div#caja img{
        width: 100%;
        
    }
    
    div#caja p{
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        color: white;
        font-size: 15px;
        width: auto;
        
    }
    
    div#subtituloniveluno p{
        color: rgb(185, 221, 237);
        font-size: 30px;
    }
    div#subtituloniveldos p{
        color: rgb(235, 151, 190);
        font-size: 30px;
    }
    div#niveluno{
        width: 100%;
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        background-color: rgb(24,21,35);
        clear: both;
        
        
    }
    div#niveluno p{
        color: rgb(15,154,215);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;

    }
    
    div#nivel1 ul{
        list-style: none;
        
    }
    
    div#nivel1 ul li{
        list-style: none;
        margin-top: 5%;

    }
    
    div#nivel1 li{
        width: auto;
    }
    
    div#nivel1tp1{
         background: url(imagenes/n1tp1.svg);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 310px;
         height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    
    }
    
    #nivel1tp1:hover {
        background: url(imagenes/n1tp1hover.svg);
        background-repeat: no-repeat;
        background-size: 100%;
        width: 310px;
        height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    }
    
    div#nivel1tp2{
    background: url(imagenes/n1tp2.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    
    }
    
    #nivel1tp2:hover {
    background: url(imagenes/n1tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
    margin-left: 20%;
    margin-right: 20%;

    }
    
    
    div#nivel1tp3{
    background: url(imagenes/n1tp3.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
    margin-left: 20%;
    margin-right: 20%;
    }
    
    #nivel1tp3:hover {
    background: url(imagenes/n1tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
    margin-left: 20%;
    margin-right: 20%;
    }
  
     div#nivel1tp4{
         background: url(imagenes/n1tp4.svg);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 310px;
         height: 202px;
         margin-left: 20%;
         margin-right: 20%;
    }
    
    #nivel1tp4:hover {
    background: url(imagenes/n1tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 310px;
    height: 202px;
        margin-left: 20%;
        margin-right: 20%;
        
    }
    
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 50px;
        text-align: center;

        
        
    }
    
    div#nivel2tp1{
         background: url(imagenes/n2tp1.svg);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 310px;
         height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    
    }
    
    #nivel2tp1:hover {
        background: url(imagenes/n2tp1hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
         width: 310px;
         height: 202px; 
        margin-left: 20%;
        margin-right: 20%;
    }
    
    div#nivel2tp2{
    background: url(imagenes/n2tp2.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310px;
         height: 202px; 
        margin-left: 20%;
        margin-right: 20%;
    
    }
    
    #nivel2tp2:hover {
    background: url(imagenes/n2tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310;
         height: 202px; 
        margin-left: 20%;
        margin-right: 20%;

    }
    
    
    div#nivel2tp3{
    background: url(imagenes/n2tp3.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310px;
         height: 202px; 
        margin-left: 20%;
        margin-right: 20%;
    }
    
    #nivel2tp3:hover {
    background: url(imagenes/n2tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310px;
         height: 202px; 
        margin-left: 20%;
        margin-right: 20%;
    }
  
     div#nivel2tp4{
    background: url(imagenes/n2tp4.svg);
    background-repeat: no-repeat;
   background-size: 100%;
         width: 310px;
         height: 202px; 
         margin-left: 20%;
        margin-right: 20%;
    }
    
    #nivel2tp4:hover {
    background: url(imagenes/n2tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 310px;
         height: 202px;
        margin-left: 20%;
        margin-right: 20%;
    }
    
    
    
    div#niveldos{
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        background-color: rgb(24,21,35);
        margin-top: 5px;
        
    }
    
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;
    }

    div#grison{
        color: #838383;
    }
    
    div#jerarquía{
        font-family: 'Roboto Slab';
        font-weight: 400;
        color:#c7c7c7;
        font-size: 20px
        
    }
    
    div#jerarquía p{
        font-family: sans-serif;
        font-weight: lighter;
        color:#f0f0f0;
        
    }
    
    
    
    div#catedra{
        border-top-left-radius: 15px;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        background-color: rgb(24,21,35);
        clear: both;
        width: 100%;
        float: left;
        
        
    }
    
    div#catedra p{
        color: white;
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;
    }
    
    div#botoneralateralcatedra{
        width: 100%;
        float: left;
        height: auto;
        margin-top:3%;
        
    }
    
    div#botoneralateralcatedra a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateralcatedra ul{
        width:100%;
        margin-top: 13%;
        list-style: none;
        
    }
    
    div#botoneralateralcatedra ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-bottom-left-radius: 10px;
        border-top-left-radius: 10px;
        border-bottom-right-radius: 10px;
        border-top-right-radius: 10px;
        
    }
    
    
    div#botoneralateralcatedra ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        font-size: 20px;
        text-align: center;
        
         
    }
    
    div#cajacatedra{
        width: 90%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        position: relative;
        padding: 5%;
        padding-bottom: 2%;
        margin-top: 2%;
        
        
    }
    
    div#subtitulocatedra p{
        margin-top: 2%;
        margin-bottom: 5%;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        width: auto;
        color: white;
        
        
    }
        
     div#objetivos p{
        color: #838383;
         margin-left: 5%;
    }
    
    div#texto{
        color: #e2e2e2;
        font-weight: 100;
        width: 90%;
        margin-top: 3%;
        font-family: 'Roboto';
        margin-bottom: 4%;
        font-size: 15px;
        margin-left: 5%;
        margin-right: 5%;
    }
    
    div#objetivos img{
        clear: both;
        width: 90%;
        margin-left: 5%;
        margin-right: 5%;
    }
    

    div#botoneralateral{
        width: 100%;
        float: left;
        
    }
    
    div#botoneralateral a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateral ul{
        width:100%;
        list-style: none;
        margin-top: 5%;
    }
    
    div#botoneralateral ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
        
    }
    
    
    div#botoneralateral ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        text-align: center;
        
         
    }
    
    div#cianon{
        color: rgb(15,154,215);
    }
    div#magentaon{
        color: rgb(226,27,120);
    }
    
    div#textoplacas{
        width: 70%;
        clear: both;
        margin-left: 20%;
        margin-top: 5%;
        margin-bottom: 5%;
        margin-right: 10%;
        
    }
    
    div#textoplacas p{
        font-family: 'Open Sans Condensed', sans-serif;   
        font-size: 15px;
        
    }
    
    
    div#caja ul{
        line-height: 30px;
        list-style: none;
        
        
    }  
    
    div#caja ul li{
        margin-bottom: 40px;
        font-family: sans-serif;
        
            
        
    }  
    
    div#caja ul li #cajacian{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(185, 221, 237);
        position: relative;
        
    }  
    div#caja ul li #cajamagenta{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(235, 151, 190);
        position: relative;

    }
    div#caja ul li span{
        font-family: 'Roboto';
        font-size: 10x;
        color: white;
        font-weight: 100;
        position: relative;
        
    }  
    
    div#links{
        float: right;
        width:10%;
        color: rgb(168, 168, 168);
        
        
    }
    
    div#cajacian img{
        margin-left: 2%;
        width:10%;
        color: rgb(168, 168, 168);
        
        
        
    }
    
   div#cajamagenta img{
        margin-left: 2%;
        width:3.5%;
        color: rgb(168, 168, 168);
        
        
        
    }

    
    div#novedades{
        width:100%;
        margin-top: 3%;
        border-radius: 15px;
        border-color: rgb(24,21,35);
        border-style:dashed;
        background-color: white
    }
    div#novedades img{
        width:50%;
        margin: 25%;
        margin-top: 5%;
        margin-bottom: 5%;

    }
        div#n1links h1, h3{
        color: #98dcff;
        margin-left: 3%;     
    }
    
    div#n1links h1{
          font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 5%;
        text-align: center;
       
        
    }
    
   
    
    div#n1links h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-top: 1%;
    color: #9bc6dd;
    font-size: 20px;
        float: left
   
      
    }
    
    div#subtituloref{
        font-family: 'Roboto', sans-serif;
        font-weight: lighter;
        margin-top: 1%;
        color: #9bc6dd;
        font-size: 25px;
        float: left
    }
    
    div#videosref{
        width: 50%;
        float: left;
    }
    
    div#consejos {
    float: left;
        width: 100%;
        margin-bottom: 3%;
    
    }
    div#consejos p{
        margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:right;
        width: 65%;
    }
    
   
    div#consejos img{ 
        float: left;
        margin-left:3%;
        margin-top: 3%;

    }
    
    div#convideo{
        
    }
    
    div#columnatexto{
    
    }
    
    div#columnatexto p{
    margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:left;
       margin-bottom: 2%;
        width: 30%

}
    div#dimension img{
    width: 50%;
    margin-left: 25%;
    }
    
    div#lito{
        width: 100%;
        height: auto;
        
    }
    
    div#lito h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
        margin-bottom: 2%;
    color: #9bc6dd;
    font-size: 20px;
        float: left;
        clear: both;
    
    }

    div#columnatexto p{
        float:right;
        margin-top: 1%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
        width: 50%



}
div#lito img{
width: 40%;
float: left;
    margin: 


}

    
  


/*termina cambio nivel 1*/
/*empeza cambio nivel 2*/

      div#nivel2link h1{        
           color: rgb(235, 151, 190);
          font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;          
          margin-bottom: 5%;
   
   } 
    
    div#nivel2link h3{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px;   
    
    }
    
    div#nivel2link h4{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 20px;
        
    }
    
    
    div#nconsejos p{
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 50%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
    
    
    }
    div#consejos img{
        width: 30%;
    
    
    }

   div#videos2 p{
    float:left;
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
       width: 
   
   }

  div#ayuda h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px; 
      color: rgb(235, 151, 190);
      
  
  }
  
 

 
    
div#ayuda ul{
    list-style: none;
    float: left;
    width: 100%;
        
            
        
    }
    
    div#ayuda ul li{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 1%;
        margin-left: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 100%;

    }
    
     div#ayuda ul li p{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 50%;

    }
     div#ayuda ul li img{
        list-style: none;
        margin-bottom: 2%;
         margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: left;
        width: 40%;

    }
    
      /*css del nuevo html consejos*/ 
  div#subtituloconsejo{
  clear: both;
  
  
  } 

  div#subtituloconsejo h1{
       font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 5%;
      
  } 


  div#nivel1consejo h3{     
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: #9bc6dd;
    font-size: 25px;
      
   
   }
 
div#nivel1consejo p{
        margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 100%;
    

}



div#nivel1consejo img{
      width: 100%;
    margin-bottom: 3%;
    margin-top: 2%;

}

/*css del nuevo html consejosnivel2*/   


div#subtituloconsejo2 h1{
     font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color:rgb(235, 151, 190);
          margin-bottom: 5%;


}

   div#nivel1consejo2 h3{     
    float: left;
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: rgb(235, 151, 190);
    font-size: 25px;
       width: 100%
      
   
   }

   div#nivel1consejo2 p{
      margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 100%;
       margin-top: 7%;
    
   }


  div#nivel1consejo2 img{
      width: 100%;
    margin-bottom: 3%;
    margin-top: 2%;
      margin-left: 2%;
}

/*fin css del nuevo html consejos*/   
    
    /* novedades */

    div#novedades{
        width:100%;
        clear: both;
        
    }
    div#novedades img{
        width:75%;
        margin: 13%;
        margin-top: 5%;
        margin-bottom: 5%;        

    }

    div#novedades h3{
    font-family: 'Roboto', sans-serif;
    margin-left: 12%;
    margin-top: 3%;
    font-size: 20px;
    color: rgb(24,21,35);
    
    
    }    
    
    div#novedades p{
        margin-left: 12%;
        margin-bottom: 2%
            
    
    }

 div#fecha{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

 div#fecha2{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

    
    div#cajatps{
        width: 90%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 5%;
        padding-bottom: 0px;
        
    }
    
    div#crocian{
    background-image: url(imagenes/cronogramamedia.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 80%;
    height: 1700px;
        margin-left:10%;
        margin-right:10%
        
       }
    
    div#cromag{
    background-image: url(imagenes/cronogramamedia2.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 80%;
    height: 1700px;
        margin-left:10%;
        margin-right:10%
        
       }
   
   /* Vídeos */
    div#videos{
    margin-bottom: 10%;}
    
    div#videos,h1{
    font-size: 20px;
    
    }
    div#videos h3{
    font-size: 25px;
    margin-left: 3%;
    margin-top: 4%;
       
    }
    
    
    .YTvideos {
    width:100%;
    margin-top: 5%;
    position: relative;
   height: 400px; overflow: hidden;

    }
 

    .YTvideos iframe,
    .YTvideos object,
    .YTvideos embed {
    position: absolute;
    width: 100%;
    height: 100%;
    } 
  
    div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
   
   
    div#curiosidades{
        position: relative;
        float: left;
    }
   
    div#curiosidades h1{
       margin-left: 3%;
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;    
    }
    
    div#curiosidades h3{
    margin-top: 5%;
    margin-left: 3%;
    color: rgb(255,234,179);    
    }
    
    div#tinta p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    } 
    

    div#comopapel h3{
        margin-top: 13%;    

    }

    div#comopapel p{
    margin-top: 3%;
    margin-left: 55%;
    font-size: 15px;
    margin-right: 3%;

    }

   
    div#inspiracion h3{
        margin-top: 20%;

    }


    div#inspiracion p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;

    }

    div#editorial h3{
        margin-top: 33%;


    }    

    div#editorial p{
     margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
    

    }
}
    


/********************************************************************************************TABLET mas grande - IPAD*/

@media all and (min-width:801px) and (max-width:1024px){
    body{
        background-color: rgb(93, 93, 93);
        height: auto
    }
    div#pagina{
    width:90%;
    margin:auto;
    margin-top: 0px;
    }
  header{
        width: 100%;
        height: 230px;
        
    }
    div#contacto{
        width:100%;
        position: relative;
    }
    #contacto ul{
        width:10%;
        height: auto;
        float: right;
        margin-left:70%; 
        margin-top: -160px;
        
    }
    #contacto ul li{
        list-style: none;
         margin-top: 2%;
         float:right; 
        
        
    }
    #contacto ul li img{
        width: 50%;
        margin: 

        
    }
    
    
    div#imagenheader img{
        width: 81%;
        float: right;
        clear: both;
        position: relative;
        margin-top: 0;
    }
    
    
    header div#logo img{
        width: 17%;
        margin: auto;
        position: relative;
        margin-top: 0;
        height: auto;
        float: left;
    }
    
    div#nav ul{
        width:100%;
        
    }
    div#nav ul li{
        list-style: none;
    }
    
    
    div#nav ul li img{
        width: 19%;
        float: right;
        margin-top: 2%;
        position: relative;
        margin-right: 0.5%;
        margin-left: 0.5%;
        margin-bottom: 3%;
    }
    
    div#banner{
        width: 100%;
        margin-top: 3%
    
    }
    
    div#contenido{
        margin:auto;
        margin-top:2%;
        width:70%;
        height:auto;
        background-color: rgb(24,21,35);
        border-radius: 20px;
        position: relative;
        padding: 2%;
    }
    
    div#bordeinterno{
        width: auto;
        height: auto;        
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        border-color: rgb(255,234,179);
        position: relative;
        border-style: dashed;
        padding: 2%;
        
    
    }
    div#bordeinterno img{
        margin-top: 6%;
        width: 29%; 
        float: left;
    
    }
        
    
    
    div#bordeinterno p{
        margin-top: -1%;
        margin-left: 31%;
        margin-right: 2%;
        font-family: 'Roboto Slab', serif;
        font-size: 35px;
        color: rgb(255,234,179);
        width: auto;
        
    }
    
    div#home p {
        font-family: sans-serif;
        font-size: 18px;
        margin-top: 2%;

    }
    
    
    div#botonerahome p{
        margin-top: 2%;
        
        
        
    }
    
    div#botonerahome ul{
        
    }
    
    div#botonerahome ul li {
        list-style: none;
        
        
    }
    
    div#botonerahome div{
        list-style: none;
        margin-top: 3%; 
        float: left;
        margin-left: 2%;
        margin-right: 2%;
        margin-top: 5%;
        
    }  
    
    
    div#uno{
        background: url(imagenes/1media1.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 250px;
    
    }
    
    #uno:hover {
        background: url(imagenes/1hover.png);
        background-size: 100%;
        background-repeat: no-repeat;
    }
    
    div#dos{
        background: url(imagenes/2.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 250px;
        
    }
    
    #dos:hover {
        background: url(imagenes/2hover.png);
        background-repeat: no-repeat;
        background-size: 100%;

    }
    
    
    div#tres{
        background: url(imagenes/3.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 250px;  
    }
    
    #tres:hover {
        background: url(imagenes/3hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
    }
    
    div#cuatro{
        background: url(imagenes/4.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 250px;
        
    }
    
    #cuatro:hover {
        background: url(imagenes/4hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
    }
    
        div#tecnologia {
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 95%;
        padding: 2%;
        margin-left: 0.5%; 
        position: relative;
        
        
    
    }
    
      

    
    div#tecnopanel img{
        width:94%;
        margin-left: 3%;
        margin-top: 5%;
        margin-bottom: 5%; 
        
        
    
    }
    
   
    
    div#tecnopanel ul{
        list-style: none;
        
            
        
    }
    
    div#tecnopanel ul li{
        list-style: none;
       

    }
    
    div#tecnopanel li{
    float: left;
        margin-left: 2%;
        margin-right: 2%;
        margin-top: 2%;
    }
     
    
    
    div#panel1{
         background: url(imagenes/tecno1.png);
         background-repeat: no-repeat;
         background-size: 250px;
         width: 250px;
         height: 375px; 
    
    }
    
    #panel1:hover {
        background: url(imagenes/tecno1hover.png);
        background-repeat: no-repeat;
        background-size: 250px;
        width: 250px;
        height: 375px;
    }
    
    div#panel2{
    background: url(imagenes/tecno2.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;
    }
    
    #panel2:hover {
    background: url(imagenes/tecno2hover.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;

    }
    
    
    div#panel3{
    background: url(imagenes/tecno3.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;
    }
    
    #panel3:hover {
    background: url(imagenes/tecno3hover.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px
    }
    
    div#bordepanel{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
    
    } 
    div#tecnopanel h1{
        font-family:'Roboto Slab', serif; 
    
    }
    
    div#bordezachin h1{
        font-family:'Roboto Slab', serif;
    
    }
    
    div#bordezachin h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    
    }
    
    
    div#bordezachin img{
        width:22.5%;
        margin-left: 3%;
        margin-bottom: 4%;
        margin-top: 2%;
        float: left;
    }
    
       div#jorgezachin img{
        width: 45%;
        
    
    }
    
    div#zachin{
    
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordezachin{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
    
   
    div#zachin ul{
        background-color: rgb(178, 217, 237);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        margin-right: 3%;
        margin-left: 75%;
        
        
    }
    
    div#zachin ul li{
        font-family: 'Roboto';
        font-weight: bolder;
        margin-right: 6%;
        margin-left: 10%;
        font-size: 15px;
        color: rgb(24,21,35);
        margin-bottom: 3%;
        
    
    
    }
    div#zachin p{
        margin-left: 75%;
        margin-top: 2%;
        margin-bottom: 1%;
        font-size: 18px;
    
    }
    
    div#videos{
         margin-bottom: 10%;
    
    }
  
     div#videos h1{
          font-family:'Roboto Slab', serif;
          font-size: 20px;
          margin-left: 2%;
          margin-top: 2%;
     }
    
    div#videos,h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
        font-size: 18px;
    
       
    }
    

    footer{
        margin:auto;
        margin-top:0;
        width:100%;
        height:auto;
        background-color: rgb(93,93,93);
        float:left;
        position: relative;
    }
    
    div#carta {
        width:100%;
        height: auto;
        background-color: rgb(93,93,93);
        margin-top: 0px;
        margin-bottom: 5px;
        text-decoration: none;
        padding-bottom:0%;

    }
    
    div#carta p{
        color: white;
        font-family: sans-serif;
        font-size: 14px;
        font-weight: 100;
        list-style: none;
        text-align: center;
        padding: 1%;
        margin-bottom: 0%;

    }
    
    div#pielogo{
        background-color: white;
        padding: 1%;
        padding-bottom: 0px;
        margin-bottom: 0%;
        border-top-right-radius: 15px;
        border-top-left-radius: 15px;
    }
    
    div#pielogo img{
        background-color: white;
        margin-left: 45%;
        width: 10%;
    }
    
    section{
        
    }
    
    div#placauno{
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
    }
    
    div#bordeplacauno{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
    }
    
    div#bordeplacauno img{
        width:90%;
        margin-left: 5%;
        margin-top: 5%;
        margin-bottom: 5%;
            
    }
    
    div#caja{
        width: 75%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 2%;
        margin-top: -2px;
    }
    
    
    
    div#caja p{
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        color: white;
        font-size: 30px;
        width: auto;
        
    }
    
    div#caja img{
        width: 100%
    }
    div#subtituloniveluno p{
        color: rgb(185, 221, 237);
    }
    div#subtituloniveldos p{
        color: rgb(235, 151, 190);
    }
    div#niveluno{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveluno p{
        color: rgb(15,154,215);
        font-family: 'Roboto Slab', serif;
        font-size: 50px;
        text-align: center;

        
        
    }
    
    
   
    
    div#nivel1 ul{
        list-style: none;
        
            
        
    }
    
    div#nivel1 ul li{
        list-style: none;
        margin-top: 2%;
        margin-bottom: 2%;
        margin-left: 3%;

    }
    
    div#nivel1 li{
        
        
    }
     
    
    
    div#nivel1tp1{
         background: url(imagenes/n1tp1.svg);
         background-repeat: no-repeat;
         background-size: 100%;
         width: 100%;
         height: 150px;
        float: 
    
    }
    
    #nivel1tp1:hover {
        background: url(imagenes/n1tp1hover.svg);
        background-repeat: no-repeat;
        background-size: 100%;
         width: 100%;
         height: 150px; 
    }
    
    div#nivel1tp2{
    background: url(imagenes/n1tp2.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 100%;
         height: 150px; 
    
    }
    
    #nivel1tp2:hover {
    background: url(imagenes/n1tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 100%;
         height: 150px; 

    }
    
    
    div#nivel1tp3{
    background: url(imagenes/n1tp3.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 100%;
         height: 150px; 
    }
    
    #nivel1tp3:hover {
    background: url(imagenes/n1tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 100%;
         height: 150px; 
    }
  
     div#nivel1tp4{
    background: url(imagenes/n1tp4.svg);
    background-repeat: no-repeat;
   background-size: 100%;
         width: 100%;
         height: 150px; 
    }
    
    #nivel1tp4:hover {
    background: url(imagenes/n1tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 100%;
         width: 100%;
         height: 150px; 
    }
    
    
    div#niveldos{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 50px;
        text-align: center;

        
        
    }
    
    div#nivel2tp1{
         background: url(imagenes/n2tp1.svg);
         background-repeat: no-repeat;
         background-size: 370px;
         width: 370px;
         height: 202px; 
    
    }
    
    #nivel2tp1:hover {
        background: url(imagenes/n2tp1hover.png);
        background-repeat: no-repeat;
        background-size: 370px;
        width: 370px;
        height: 202px;
    }
    
    div#nivel2tp2{
    background: url(imagenes/n2tp2.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px;
    
    }
    
    #nivel2tp2:hover {
    background: url(imagenes/n2tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px;

    }
    
    
    div#nivel2tp3{
    background: url(imagenes/n2tp3.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    #nivel2tp3:hover {
    background: url(imagenes/n2tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
  
     div#nivel2tp4{
    background: url(imagenes/n2tp4.svg);
    background-repeat: no-repeat;
   background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    #nivel2tp4:hover {
    background: url(imagenes/n2tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    
    div#caja{
        width: 75%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 2%;
    }
    
    
    
    div#caja p{
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        color: white;
        font-size: 30px;
        width: auto;
        
    }
    
    div#caja img{
        width: 100%
    }
    div#subtituloniveluno p{
        color: rgb(185, 221, 237);
    }
    div#subtituloniveldos p{
        color: rgb(235, 151, 190);
    }
    div#niveluno{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveluno p{
        color: rgb(15,154,215);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;

        
        
    }
    
    div#niveldos{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;

        
        
    }

    
    div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
   
   div#curiosidades{
   position: relative;
   float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;    
    }
    
    div#curiosidades h3{
    margin-top: 5%;
    color: rgb(255,234,179);
    margin-left: 3%;
    }
    
    div#tinta p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    } 
    


    div#comopapel h3{
        margin-top: 13%;    
    
        }
    
    div#comopapel p{
        margin-top: 3%;
        margin-left: 55%;
        font-size: 15px;
        margin-right: 3%;
    
    }
    
    div#inspiracion h3{
        margin-top: 20%;
    
    }
    
    div#inspiracion p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px;
    }
    
    
    div#editorial h3{
        margin-top: 33%;

    }  
    
    div#editorial p{
     margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
        
    } 
   
    div#grison{
        color: #838383;
    }
    
    div#jerarquía{
        font-family: 'Roboto Slab';
        font-weight: 400;
        color:#c7c7c7;
        font-size: 20px
        
    }
    
    div#jerarquía p{
        font-family: sans-serif;
        font-weight: lighter;
        color:#f0f0f0;
        
    }
    
    div#nivel1{
        width: 100%;
        height: auto;
    }
    
    div#nivel1 ul{
        height: auto;
        width:90;
    }
    
    div#nivel1 ul li{
        width: 40%;
        margin-left: 28%;
        margin-top: 2%;
        margin-bottom: 2%;
        list-style: none;
    }
    
    div#nivel1 ul li p{
        font-family: 'Roboto Condensed';
        font-size: 10px;
        margin-bottom: 4%;
        text-align: center;
        
        
    }
    
    div#nivel1 ul li img{
        width: 100%;
        
    }
    
    
    div#fotolateral img{
        width: 100%;
        height: auto;
        margin-top: 1%;
        float: left;
    }
    
    div#catedra{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    
    div#catedra p{
        color: white;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        text-align: center;
    }
    
    div#botoneralateralcatedra{
        width: 30%;
        float: left;
        height: 500px;
        
    }
    
    div#botoneralateralcatedra a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateralcatedra ul{
        width:100%;
        margin-top: 20%;
        list-style: none;
        
    }
    
    div#botoneralateralcatedra ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-bottom-left-radius: 10px;
        border-top-left-radius: 10px;
        
    }
    
    
    div#botoneralateralcatedra ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        font-size: 15px;
        
         
    }
    div#subtitulocatedra p{
        font-family: 'Roboto Slab', serif;
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        width: auto;
        margin-bottom: 3%
    }
    
     div#objetivos p{
        color: #838383;
    }
    
    div#texto{
        
        color: #e2e2e2;
        font-weight: 100;
        width: 100%;
        margin-top: 3%;
        font-family: 'Roboto';
        margin-bottom: 4%;
    }
    
    div#objetivos img{
        clear: both;
        width: 100%
    }
    

    div#botoneralateral{
        width: 21%;
        float: left;
        height: 500px;
        
    }
    
    div#botoneralateral a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateral ul{
        width:100%;
        margin-top: 20%;
        list-style: none;
        
    }
    
    div#botoneralateral ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        
    }
    
    
    div#botoneralateral ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        
         
    }
    
    div#cianon{
        color: rgb(15,154,215);
    }
    div#magentaon{
        color: rgb(226,27,120);
    }
    
    div#textoplacas{
        width: 70%;
        clear: both;
        margin-left: 20%;
        margin-top: 5%;
        margin-bottom: 5%;
        margin-right: 10%;
        
    }
    
    div#textoplacas p{
        font-family: 'Open Sans Condensed', sans-serif;   
        font-size: 15px;
        
    }
    
    div#cajacatedra{
        width: 66%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 2%;
        margin-top: -2px
        
        
    }
    
    div#subtitulocatedra p{
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        width: auto;
        color: white
        
        
    }
    div#caja ul{
        line-height: 30px;
        list-style: none;
        
        
    }  
    
    div#caja ul li{
        margin-bottom: 40px;
        font-family: sans-serif;
        
            
        
    }  
    
    div#caja ul li #cajacian{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(185, 221, 237);
        position: relative;
        
    }  
    div#caja ul li #cajamagenta{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(235, 151, 190);
        position: relative;

    }
    div#caja ul li span{
        font-family: 'Roboto';
        font-size: 10x;
        color: white;
        font-weight: 100;
        position: relative;
        
    }  
    
    div#links{
        float: right;
        width:10%;
        color: rgb(168, 168, 168);
        
        
    }
    
    div#cajacian img{
        margin-left: 2%;
        width:3.5%;
        color: rgb(168, 168, 168);
        
        
        
    }
    
   div#cajamagenta img{
        margin-left: 2%;
        width:3.5%;
        color: rgb(168, 168, 168);
        
        
        
    }

    
    div#novedades{
        width:100%;
        margin-top: 3%;
        border-radius: 15px;
        border-color: rgb(24,21,35);
        border-style:dashed;
        background-color: white
    }
    div#novedades img{
        width:50%;
        margin: 25%;
        margin-top: 5%;
        margin-bottom: 5%;

    }
      div#n1links h1{
          font-family:'Roboto Slab', serif;
          font-size: 30px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 5%;
       
        
    }
    
   
    
    div#n1links h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    color: #9bc6dd;
    font-size: 25px;
    margin-top: 3%;
        margin-bottom: 3%;
        width: 100%;
   
      
    }
    div#consejos {
    float: left;
        margin-bottom: 5%;
    
    }
    div#consejos p{
        margin-top: 1%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:right;
        width: 100%;
    }
    
   
    div#consejos img{      
        width: 100%;
        margin-top: 5%;
      
       
    }
    


div#convideo p{
margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:left;
       margin-bottom: 2%;



}
    div#dimension img{
    width: 50%;
    margin-left: 25%;
    }
    
    div#lito h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
        margin-bottom: 2%;
    color: #9bc6dd;
    font-size: 2opx;
    
    }

    div#lito p{
        float: right;
        margin-top: 1%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
        width: 100%;



}
div#lito img{
width: 100%;
    margin-top: 2%


}

    hr{
     margin-top: 5%;
     color:#189fe6;
    }
  



/*termina cambio nivel 1*/
/*empeza cambio nivel 2*/

      div#nivel2link h1{        
           color: rgb(235, 151, 190);
          font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;          
          margin-bottom: 5%;
   
   } 
    
    div#nivel2link h3{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px;   
    
    }
    
    div#nivel2link h4{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 20px;
        
    }
    
    
    div#nconsejos p{
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 50%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
    
    
    }
    div#consejos img{
        width: 30%;
    
    
    }

   div#videos2 p{
    float:left;
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
       width: 
   
   }

  div#ayuda h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px; 
      color: rgb(235, 151, 190);
      
  
  }
  
 

 
    
div#ayuda ul{
    list-style: none;
    float: left;
    width: 100%;
        
            
        
    }
    
    div#ayuda ul li{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 1%;
        margin-left: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 100%;

    }
    
     div#ayuda ul li p{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 50%;

    }
     div#ayuda ul li img{
        list-style: none;
        margin-bottom: 2%;
         margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: left;
        width: 40%;

    }
    
      /*css del nuevo html consejos*/ 
  div#subtituloconsejo{
  clear: both;
  
  
  } 

  div#subtituloconsejo h1{
       font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 5%;
      
  } 


  div#nivel1consejo h3{     
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: #9bc6dd;
    font-size: 25px;
      
   
   }
 
div#nivel1consejo p{
        margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 60%;
    float: right;
    

}



div#nivel1consejo img{
      width: 35%;
    margin-bottom: 20%;
    margin-top: 2%;

}

/*css del nuevo html consejosnivel2*/   


div#subtituloconsejo2 h1{
     font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color:rgb(235, 151, 190);
          margin-bottom: 5%;


}

   div#nivel1consejo2 h3{     
    float: left;
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: rgb(235, 151, 190);
    font-size: 25px;
      
   
   }

   div#nivel1consejo2 p{
      margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 60%;
    float: right;
       margin-top: 7%;
    
   }


  div#nivel1consejo2 img{
      width: 35%;
    margin-bottom: 20%;
    margin-top: 2%;
}

/*fin css del nuevo html consejos*/   
    
    /* novedades */

    div#novedades{
        width:100%;
        
    }
    div#novedades img{
        width:75%;
        margin: 13%;
        margin-top: 5%;
        margin-bottom: 5%;        

    }

    div#novedades h3{
    font-family: 'Roboto', sans-serif;
    margin-left: 12%;
    margin-top: 3%;
    font-size: 20px;
    color: rgb(24,21,35);
    
    
    }    
    
    div#novedades p{
        margin-left: 12%;
        margin-bottom: 2%
            
    
    }

 div#fecha{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

 div#fecha2{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

   /* fin novedades */  
    
    div#cajatps{
        width: 75%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 0px;
        padding-top: 1.5%;
        
    }
    
    div#crocian{
    background-image: url(imagenes/cronograma1-01.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
        
       }
    
    div#cromag{
    background-image: url(imagenes/cronograma2-01-01.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
        
       }
    
    
    
   
   /* Vídeos */
    div#videos{
    margin-bottom: 10%;}
  
div#videos,h1{
    font-size: 40px;
     margin-left: 2%;
    margin-top: 2%;
}
    div#videos h3{
    font-size: 25px;
    margin-left: 3%;
    margin-top: 4%;
       
    }
    



.YTvideos {
    width: 50%;
    margin-left: 25%; 
    margin-top: 5%;
    position: relative;
    padding-bottom: 30%;
   height: 0; overflow: hidden;
    
}
 
.YTvideos iframe,
.YTvideos object,
.YTvideos embed {
    position: relative;
    width: 100%;
    height: 100%;
    margin-bottom: 5%;
    float: left;
} 
  
      div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
   
   div#curiosidades{
   position: relative;
   float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;    
    }
    
    div#curiosidades h3{
    margin-top: 5%;
    margin-left: 3%;
    color: rgb(255,234,179);    
    }
    
    div#tinta p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    } 
    div#comopapel h3{
        margin-top: 13%;    
    }
    
    div#comopapel p{
    margin-top: 3%;
    margin-left: 55%;
    font-size: 15px;
    margin-right: 3%;
    
    }
   
    
    div#inspiracion h3{
        margin-top: 20%;
    }

    div#inspiracion p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px
    }
    
    div#editorial h3{
        margin-top: 33%;
    
    }    
    
    div#editorial p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px;
    }

}
    


/************************************************************************************************PC*/

@media all and (min-width:1025px) and (max-width:1280px){

body{
        background-color: rgb(93, 93, 93);
        height: auto
    }
    div#pagina{
    width:80%;
    margin:auto;
    margin-top: 0px;
    }
  header{
        width: 100%;
        height: 280px;
        
    }
    div#contacto{
        width:100%;
        position: relative;
    }
    #contacto ul{
        width:10%;
        height: auto;
        float: right;
        margin-left:70%; 
        margin-top: -180px;
        
    }
    #contacto ul li{
        list-style: none;
         margin-top: 2%;
         float:right; 
        
        
    }
    #contacto ul li img{
        width: 50%;
        margin: 

        
    }
    
    
    div#imagenheader img{
        width: 81%;
        float: right;
        clear: both;
        position: relative;
        margin-top: 0;
    }
    
    
    header div#logo img{
        width: 17%;
        margin: auto;
        position: relative;
        margin-top: 0;
        height: auto;
        float: left;
    }
    
    div#nav ul{
        width:100%;
        
    }
    div#nav ul li{
        list-style: none;
    }
    
    
    div#nav ul li img{
        width: 19%;
        float: right;
        margin-top: 3%;
        position: relative;
        margin-right: 0.5%;
        margin-left: 0.5%;
    }
    
    div#banner img{
        width: 100%;
    
    }
    
    div#contenido{
        margin:auto;
        margin-top:2%;
        width:70%;
        height:auto;
        background-color: rgb(24,21,35);
        border-radius: 20px;
        position: relative;
        padding: 2%;
    }
    
    div#bordeinterno{
        width: auto;
        height: auto;        
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        border-color: rgb(255,234,179);
        position: relative;
        border-style: dashed;
        padding: 2%;
        
    
    }
    div#bordeinterno img{
        margin-top: 6%;
        width: 29%; 
        float: left;
    
    }
        
    
    
    div#bordeinterno p{
        margin-top: -1%;
        margin-left: 31%;
        margin-right: 2%;
        font-family: 'Roboto Slab', serif;
        font-size: 35px;
        color: rgb(255,234,179);
        width: auto;
        
    }
    
    div#home p {
        font-family: sans-serif;
        font-size: 18px;
        margin-top: 2%;

    }
    
    
    div#botonerahome ul{
        
    }
    
    div#botonerahome ul li {
        list-style: none;
        
        
    }
    
    div#botonerahome div{
        list-style: none;
        margin-top: 3%; 
        float: left;
        margin-left: 2%;
        margin-right: 2%;
        margin-top: 5%;
        
    }  
    
    
    div#uno{
        background: url(imagenes/1media1.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 300px;
    
    }
    
    #uno:hover {
        background: url(imagenes/1hover.png);
        background-size: 100%;
        background-repeat: no-repeat;
    }
    
    div#dos{
        background: url(imagenes/2.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 300px;;
        
    }
    
    #dos:hover {
        background: url(imagenes/2hover.png);
        background-repeat: no-repeat;
        background-size: 100%;

    }
    
    
    div#tres{
        background: url(imagenes/3.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 300px;  
    }
    
    #tres:hover {
        background: url(imagenes/3hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
    }
    
    div#cuatro{
        background: url(imagenes/4.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 300px;
        
    }
    
    #cuatro:hover {
        background: url(imagenes/4hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
    }
    
        div#tecnologia {
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 95%;
        padding: 2%;
        margin-left: 0.5%; 
        position: relative;
        
        
    
    }
    
      

    
    div#tecnopanel img{
        width:94%;
        margin-left: 3%;
        margin-top: 5%;
        margin-bottom: 5%; 
        
        
    
    }
    
   
    
    div#tecnopanel ul{
        list-style: none;
        
            
        
    }
    
    div#tecnopanel ul li{
        list-style: none;
       

    }
    
    div#tecnopanel li{
    float: left;
        margin-left: 3%;
        margin-right: 4%;
        margin-top: 2%;
    }
     
    
    
    div#panel1{
         background: url(imagenes/tecno1.png);
         background-repeat: no-repeat;
         background-size: 250px;
         width: 250px;
         height: 375px; 
    
    }
    
    #panel1:hover {
        background: url(imagenes/tecno1hover.png);
        background-repeat: no-repeat;
        background-size: 250px;
        width: 250px;
        height: 375px;
    }
    
    div#panel2{
    background: url(imagenes/tecno2.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;
    }
    
    #panel2:hover {
    background: url(imagenes/tecno2hover.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;

    }
    
    
    div#panel3{
    background: url(imagenes/tecno3.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;
    }
    
    #panel3:hover {
    background: url(imagenes/tecno3hover.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px
    }
    
    div#bordepanel{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
    
    } 
    div#tecnopanel h1{
        font-family:'Roboto Slab', serif; 
    
    }
    
    div#bordezachin h1{
        font-family:'Roboto Slab', serif;
    
    }
    
    div#bordezachin h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    
    }
    
    
    div#bordezachin img{
        width:22.5%;
        margin-left: 3%;
        margin-bottom: 4%;
        margin-top: 2%;
        float: left;
    }
    
       div#jorgezachin img{
        width: 45%;
        
    
    }
    
    div#zachin{
    
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordezachin{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
    
   
    div#zachin ul{
        background-color: rgb(178, 217, 237);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        margin-right: 3%;
        margin-left: 75%;
        
        
    }
    
    div#zachin ul li{
        font-family: 'Roboto';
        font-weight: bolder;
        margin-right: 6%;
        margin-left: 10%;
        font-size: 15px;
        color: rgb(24,21,35);
        margin-bottom: 3%;
        
    
    
    }
    div#zachin p{
        margin-left: 75%;
        margin-top: 2%;
        margin-bottom: 1%;
        font-size: 18px;
    
    }
    
    div#videos{
         margin-bottom: 10%;
    
    }
  
     div#videos h1{
          font-family:'Roboto Slab', serif;
          font-size: 40px;
          margin-left: 2%;
          margin-top: 2%;
     }
    
    div#videos h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
        font-size: 16px;
    
       
    }
    

    footer{
        margin:auto;
        margin-top:0;
        width:100%;
        height:auto;
        background-color: rgb(93,93,93);
        float:left;
        position: relative;
    }
    
    div#carta {
        width:100%;
        height: auto;
        background-color: rgb(93,93,93);
        margin-top: 0px;
        margin-bottom: 5px;
        text-decoration: none;
        padding-bottom:0%;

    }
    
    div#carta p{
        color: white;
        font-family: sans-serif;
        font-size: 14px;
        font-weight: 100;
        list-style: none;
        text-align: center;
        padding: 1%;
        margin-bottom: 0%;

    }
    
    div#pielogo{
        background-color: white;
        padding: 1%;
        padding-bottom: 0px;
        margin-bottom: 0%;
        border-top-right-radius: 15px;
        border-top-left-radius: 15px;
    }
    
    div#pielogo img{
        background-color: white;
        margin-left: 45%;
        width: 10%;
    }
    
    section{
        position: relative
        
    }
    
    div#placauno{
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 5%;
        margin-top: 1%
    }
    
    div#bordeplacauno{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
    }
    
    div#bordeplacauno img{
        width:90%;
        margin-left: 5%;
        margin-top: 5%;
        margin-bottom: 5%;
            
    }
    
    div#caja{
        width: 75%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 2%;
        margin-top: -2px;
    }
    
    
    
    div#caja p{
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        color: white;
        font-size: 30px;
        width: auto;
        
    }
    
    div#caja img{
        width: 100%
    }
    div#subtituloniveluno p{
        color: rgb(185, 221, 237);
    }
    div#subtituloniveldos p{
        color: rgb(235, 151, 190);
    }
    div#niveluno{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveluno p{
        color: rgb(15,154,215);
        font-family: 'Roboto Slab', serif;
        font-size: 50px;
        text-align: center;

        
        
    }
    
    
   
    
    div#nivel1 ul{
        list-style: none;
        
            
        
    }
    
    div#nivel1 ul li{
        list-style: none;
        margin-top: 2%;
        margin-bottom: 2%;
        margin-left: 3%;

    }
    
    div#nivel1 li{
    float: left;
        
    }
     
    
    
    div#nivel1tp1{
         background: url(imagenes/n1tp1.svg);
         background-repeat: no-repeat;
         background-size: 370px;
         width: 370px;
         height: 202px; 
    
    }
    
    #nivel1tp1:hover {
        background: url(imagenes/n1tp1hover.svg);
        background-repeat: no-repeat;
        background-size: 370px;
        width: 370px;
        height: 202px;
    }
    
    div#nivel1tp2{
    background: url(imagenes/n1tp2.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px;
    
    }
    
    #nivel1tp2:hover {
    background: url(imagenes/n1tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px;

    }
    
    
    div#nivel1tp3{
    background: url(imagenes/n1tp3.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    #nivel1tp3:hover {
    background: url(imagenes/n1tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
  
     div#nivel1tp4{
    background: url(imagenes/n1tp4.svg);
    background-repeat: no-repeat;
   background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    #nivel1tp4:hover {
    background: url(imagenes/n1tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    
    div#niveldos{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 50px;
        text-align: center;

        
        
    }
    
    div#nivel2tp1{
         background: url(imagenes/n2tp1.svg);
         background-repeat: no-repeat;
         background-size: 370px;
         width: 370px;
         height: 202px; 
    
    }
    
    #nivel2tp1:hover {
        background: url(imagenes/n2tp1hover.png);
        background-repeat: no-repeat;
        background-size: 370px;
        width: 370px;
        height: 202px;
    }
    
    div#nivel2tp2{
    background: url(imagenes/n2tp2.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px;
    
    }
    
    #nivel2tp2:hover {
    background: url(imagenes/n2tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px;

    }
    
    
    div#nivel2tp3{
    background: url(imagenes/n2tp3.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    #nivel2tp3:hover {
    background: url(imagenes/n2tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
  
     div#nivel2tp4{
    background: url(imagenes/n2tp4.svg);
    background-repeat: no-repeat;
   background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    #nivel2tp4:hover {
    background: url(imagenes/n2tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    
    div#caja{
        width: 75%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 2%;
    }
    
    
    
    div#caja p{
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        color: white;
        font-size: 30px;
        width: auto;
        
    }
    
    div#caja img{
        width: 100%
    }
    div#subtituloniveluno p{
        color: rgb(185, 221, 237);
    }
    div#subtituloniveldos p{
        color: rgb(235, 151, 190);
    }
    div#niveluno{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveluno p{
        color: rgb(15,154,215);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;

        
        
    }
    
    div#niveldos{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;

        
        
    }

    
    div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
   
   div#curiosidades{
   position: relative;
   float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;    
    }
    
    div#curiosidades h3{
    margin-top: 5%;
    margin-left: 3%;    
    color: rgb(255,234,179);    
    }
    
    div#tinta p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    } 
    


    div#comopapel h3{
        margin-top: 13%;    
    
        }
    
    div#comopapel p{
        margin-top: 3%;
        margin-left: 55%;
        font-size: 15px;
        margin-right: 3%;
    
    }
    
    div#inspiracion h3{
        margin-top: 20%;
    
    }
    
    div#inspiracion p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px;
    }
    
    
    div#editorial h3{
        margin-top: 33%;

    }  
    
    div#editorial p{
     margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
        
    } 
   
    div#grison{
        color: #838383;
    }
    
    div#jerarquía{
        font-family: 'Roboto Slab';
        font-weight: 400;
        color:#c7c7c7;
        font-size: 20px
        
    }
    
    div#jerarquía p{
        font-family: sans-serif;
        font-weight: lighter;
        color:#f0f0f0;
        
    }
    
    div#nivel1{
        width: 100%;
        height: auto;
    }
    
    div#nivel1 ul{
        height: auto;
        width:90;
    }
    
    div#nivel1 ul li{
        width: 40%;
        margin-left: 28%;
        margin-top: 2%;
        margin-bottom: 2%;
        list-style: none;
    }
    
    div#nivel1 ul li p{
        font-family: 'Roboto Condensed';
        font-size: 10px;
        margin-bottom: 4%;
        text-align: center;
        
        
    }
    
    div#nivel1 ul li img{
        width: 100%;
        
    }
    
    
    div#fotolateral img{
        width: 100%;
        height: auto;
        margin-top: 1%;
        float: left;
    }
    
    div#catedra{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    
    div#catedra p{
        color: white;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        text-align: center;
    }
    
    div#botoneralateralcatedra{
        width: 30%;
        float: left;
        height: 500px;
        
    }
    
    div#botoneralateralcatedra a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateralcatedra ul{
        width:100%;
        margin-top: 20%;
        list-style: none;
        
    }
    
    div#botoneralateralcatedra ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-bottom-left-radius: 10px;
        border-top-left-radius: 10px;
        
    }
    
    
    div#botoneralateralcatedra ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        font-size: 15px;
        
         
    }
    div#subtitulocatedra p{
        font-family: 'Roboto Slab', serif;
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        width: auto;
        margin-bottom: 3%
    }
    
     div#objetivos p{
        color: #838383;
    }
    
    div#texto{
        
        color: #e2e2e2;
        font-weight: 100;
        width: 100%;
        margin-top: 3%;
        font-family: 'Roboto';
        margin-bottom: 4%;
    }
    
    div#objetivos img{
        clear: both;
        width: 100%;
    }
    

    div#botoneralateral{
        width: 21%;
        float: left;
        height: 500px;
        
    }
    
    div#botoneralateral a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateral ul{
        width:100%;
        margin-top: 20%;
        list-style: none;
        
    }
    
    div#botoneralateral ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        
    }
    
    
    div#botoneralateral ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        
         
    }
    
    div#cianon{
        color: rgb(15,154,215);
    }
    div#magentaon{
        color: rgb(226,27,120);
    }
    
    div#textoplacas{
        width: 70%;
        clear: both;
        margin-left: 20%;
        margin-top: 5%;
        margin-bottom: 5%;
        margin-right: 10%;
        
    }
    
    div#textoplacas p{
        font-family: 'Open Sans Condensed', sans-serif;   
        font-size: 15px;
        
    }
    
    div#cajacatedra{
        width: 66%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 2%;
        margin-top: -2px
        
        
    }
    
    div#subtitulocatedra p{
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        width: auto;
        color: white
        
        
    }
    div#caja ul{
        line-height: 30px;
        list-style: none;
        
        
    }  
    
    div#caja ul li{
        margin-bottom: 40px;
        font-family: sans-serif;
        
            
        
    }  
    
    div#caja ul li #cajacian{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(185, 221, 237);
        position: relative;
        
    }  
    div#caja ul li #cajamagenta{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(235, 151, 190);
        position: relative;

    }
    div#caja ul li span{
        font-family: 'Roboto';
        font-size: 10x;
        color: white;
        font-weight: 100;
        position: relative;
        
    }  
    
    div#links{
        float: right;
        width:10%;
        color: rgb(168, 168, 168);
        
        
    }
    
    div#cajacian img{
        margin-left: 2%;
        width:3.5%;
        color: rgb(168, 168, 168);
        
        
        
    }
    
   div#cajamagenta img{
        margin-left: 2%;
        width:3.5%;
        color: rgb(168, 168, 168);
        
        
        
    }

    
    div#novedades{
        width:100%;
        margin-top: 3%;
        border-radius: 15px;
        border-color: rgb(24,21,35);
        border-style:dashed;
        background-color: white
    }
    div#novedades img{
        width:50%;
        margin: 25%;
        margin-top: 5%;
        margin-bottom: 5%;

    }
    div#n1links h1{
          font-family:'Roboto Slab', serif;
          font-size: 30px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 2%;
       
        
    }
    
   
    
    div#n1links h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    color: #9bc6dd;
    font-size: 25px;
    margin-top: 2%;
        margin-bottom: 3%
   
      
    }
    div#consejos {
    float: left;
        margin-bottom: 5%;
    
    }
    div#consejos p{
        margin-top: 1%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:right;
        width: 50%;
    }
    
   
    div#consejos img{      
        width: 30%;
        float: left;
        margin-left: 5%;
        margin-top: 2%;
       
       
    }
    


div#convideo p{
margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:left;
       margin-bottom: 2%;



}
    div#dimension img{
    width: 50%;
    margin-left: 25%;
    }
    
    div#lito h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
        margin-bottom: 2%;
    color: #9bc6dd;
    font-size: 2opx;
    
    }

    div#lito p{
        float: right;
        margin-top: 1%;
        margin-right: 5%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
        width: 60%;



}
div#lito img{
width: 30%;
    margin-bottom:6%;
    margin-left: 2%;
    margin-top: 2%


}

    hr{
     margin-top: 5%;
     color:#189fe6;
    }
  


  


/*termina cambio nivel 1*/
/*empeza cambio nivel 2*/

      div#nivel2link h1{        
           color: rgb(235, 151, 190);
          font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;          
          margin-bottom: 5%;
   
   } 
    
    div#nivel2link h3{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px;   
    
    }
    
    div#nivel2link h4{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 20px;
        
    }
    
    
    div#nconsejos p{
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 50%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
    
    
    }
    div#consejos img{
        width: 30%;
    
    
    }

   div#videos2 p{
    float:left;
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
       width: 
   
   }

  div#ayuda h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px; 
      color: rgb(235, 151, 190);
      
  
  }
  
 

 
    
div#ayuda ul{
    list-style: none;
    float: left;
    width: 100%;
        
            
        
    }
    
    div#ayuda ul li{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 1%;
        margin-left: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 100%;

    }
    
     div#ayuda ul li p{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 50%;

    }
     div#ayuda ul li img{
        list-style: none;
        margin-bottom: 2%;
         margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: left;
        width: 40%;

    }
    
      /*css del nuevo html consejos*/ 
  div#subtituloconsejo{
  clear: both;
  
  
  } 

  div#subtituloconsejo h1{
       font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 5%;
      
  } 


  div#nivel1consejo h3{     
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: #9bc6dd;
    font-size: 25px;
      
   
   }
 
div#nivel1consejo p{
        margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 50%;
    float: right;
    

}



div#nivel1consejo img{
      width: 45%;
    margin-bottom: 3%;
    margin-top: 2%;

}

/*css del nuevo html consejosnivel2*/   


div#subtituloconsejo2 h1{
     font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color:rgb(235, 151, 190);
          margin-bottom: 5%;


}

   div#nivel1consejo2 h3{     
    float: left;
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: rgb(235, 151, 190);
    font-size: 25px;
      
   
   }

   div#nivel1consejo2 p{
      margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 50%;
    float: right;
       margin-top: 7%;
    
   }


  div#nivel1consejo2 img{
      width: 45%;
    margin-bottom: 3%;
    margin-top: 2%;
}

/*fin css del nuevo html consejos*/   
    
    /* novedades */

    div#novedades{
        width:100%;
        
    }
    div#novedades img{
        width:75%;
        margin: 13%;
        margin-top: 5%;
        margin-bottom: 5%;        

    }

    div#novedades h3{
    font-family: 'Roboto', sans-serif;
    margin-left: 12%;
    margin-top: 3%;
    font-size: 20px;
    color: rgb(24,21,35);
    
    
    }    
    
    div#novedades p{
        margin-left: 12%;
        margin-bottom: 2%
            
    
    }

 div#fecha{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

 div#fecha2{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

   /* fin novedades */  
    
    div#cajatps{
        width: 75%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 0px;
        padding-top: 1.5%;
        
    }
    
    div#crocian{
    background-image: url(imagenes/cronograma1-01.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
        
       }
    
    div#cromag{
    background-image: url(imagenes/cronograma2-01-01.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
        
       }
    
    
    
   
   /* Vídeos */
    div#videos{
    margin-bottom: 10%;}
  
div#videos,h1{
    font-size: 40px;
     margin-left: 2%;
    margin-top: 2%;
}
    div#videos h3{
    font-size: 25px;
    margin-left: 3%;
    margin-top: 4%;
       
    }
    



.YTvideos {
    width: 50%;
    margin-left: 25%; 
    margin-top: 5%;
    position: relative;
    padding-bottom: 30%;
   height: 0; overflow: hidden;
    
}
 
.YTvideos iframe,
.YTvideos object,
.YTvideos embed {
    position: relative;
    width: 100%;
    height: 100%;
    margin-bottom: 5%;
    float: left;
} 
  
      div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
   
   div#curiosidades{
   position: relative;
   float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;    
    }
    
    div#curiosidades h3{
    margin-top: 5%;
    color: rgb(255,234,179);    
    }
    
    div#tinta p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    } 
    div#comopapel h3{
        margin-top: 13%;    
    }
    
    div#comopapel p{
    margin-top: 3%;
    margin-left: 55%;
    font-size: 15px;
    margin-right: 3%;
    
    }
   
    
    div#inspiracion h3{
        margin-top: 20%;
    }

    div#inspiracion p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px
    }
    
    div#editorial h3{
        margin-top: 33%;
    
    }    
    
    div#editorial p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px;
    }

}
    

/************************************************************************************************PC*/

@media all and (min-width:1281px) and (max-width:1680px){

body{
        background-color: rgb(93, 93, 93);
        height: auto
    }
    div#pagina{
    width:80%;
    margin:auto;
    margin-top: 0px;
    }
  header{
        width: 100%;
        height: 300px;
        
    }
    div#contacto{
        width:100%;
        position: relative;
    }
    #contacto ul{
        width:10%;
        height: auto;
        float: right;
        margin-left:70%; 
        margin-top: -180px;
        
    }
    #contacto ul li{
        list-style: none;
         margin-top: 2%;
         float:right; 
        
        
    }
    #contacto ul li img{
        width: 50%;
        margin: 

        
    }
    
    
    div#imagenheader img{
        width: 81%;
        float: right;
        clear: both;
        position: relative;
        margin-top: 0;
    }
    
    
    header div#logo img{
        width: 17%;
        margin: auto;
        position: relative;
        margin-top: 0;
        height: auto;
        float: left;
    }
    
    div#nav ul{
        width:100%;
        
    }
    div#nav ul li{
        list-style: none;
    }
    
    
    div#nav ul li img{
        width: 19%;
        float: right;
        margin-top: 3%;
        position: relative;
        margin-right: 0.5%;
        margin-left: 0.5%;
    }
    
    div#banner img{
        width: 100%;
    
    }
    
    div#contenido{
        margin:auto;
        margin-top:2%;
        width:70%;
        height:auto;
        background-color: rgb(24,21,35);
        border-radius: 20px;
        position: relative;
        padding: 2%;
    }
    
    div#bordeinterno{
        width: auto;
        height: auto;        
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        border-color: rgb(255,234,179);
        position: relative;
        border-style: dashed;
        padding: 2%;
        
    
    }
    div#bordeinterno img{
        margin-top: 6%;
        width: 29%; 
        float: left;
    
    }
        
    
    
    div#bordeinterno p{
        margin-top: -1%;
        margin-left: 31%;
        margin-right: 2%;
        font-family: 'Roboto Slab', serif;
        font-size: 35px;
        color: rgb(255,234,179);
        width: auto;
        
    }
    
    div#home p {
        font-family: sans-serif;
        font-size: 18px;
        margin-top: 2%;

    }
    
    
    div#botonerahome ul{
        
    }
    
    div#botonerahome ul li {
        list-style: none;
        
        
    }
    
    div#botonerahome div{
        list-style: none;
        margin-top: 3%; 
        float: left;
        margin-left: 2%;
        margin-right: 2%;
        margin-top: 5%;
        
    }  
    
    
    div#uno{
        background: url(imagenes/1media1.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 320px;
    
    }
    
    #uno:hover {
        background: url(imagenes/1hover.png);
        background-size: 100%;
        background-repeat: no-repeat;
    }
    
    div#dos{
        background: url(imagenes/2.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 320px;;
        
    }
    
    #dos:hover {
        background: url(imagenes/2hover.png);
        background-repeat: no-repeat;
        background-size: 100%;

    }
    
    
    div#tres{
        background: url(imagenes/3.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 320px;  
    }
    
    #tres:hover {
        background: url(imagenes/3hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
    }
    
    div#cuatro{
        background: url(imagenes/4.png);
        background-repeat: no-repeat;
        background-size: 100%;
        width:45%;
        height: 320px;
        
    }
    
    #cuatro:hover {
        background: url(imagenes/4hover.png);
        background-repeat: no-repeat;
        background-size: 100%;
    }
    
        div#tecnologia {
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 95%;
        padding: 2%;
        margin-left: 0.5%; 
        position: relative;
        
        
    
    }
    
      

    
    div#tecnopanel img{
        width:94%;
        margin-left: 3%;
        margin-top: 5%;
        margin-bottom: 5%; 
        
        
    
    }
    
   
    
    div#tecnopanel ul{
        list-style: none;
        
            
        
    }
    
    div#tecnopanel ul li{
        list-style: none;
       

    }
    
    div#tecnopanel li{
    float: left;
        margin-left: 3%;
        margin-right: 4%;
        margin-top: 2%;
    }
     
    
    
    div#panel1{
         background: url(imagenes/tecno1.png);
         background-repeat: no-repeat;
         background-size: 250px;
         width: 250px;
         height: 375px; 
    
    }
    
    #panel1:hover {
        background: url(imagenes/tecno1hover.png);
        background-repeat: no-repeat;
        background-size: 250px;
        width: 250px;
        height: 375px;
    }
    
    div#panel2{
    background: url(imagenes/tecno2.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;
    }
    
    #panel2:hover {
    background: url(imagenes/tecno2hover.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;

    }
    
    
    div#panel3{
    background: url(imagenes/tecno3.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px;
    }
    
    #panel3:hover {
    background: url(imagenes/tecno3hover.png);
    background-repeat: no-repeat;
    background-size: 250px;
    width: 250px;
    height: 375px
    }
    
    div#bordepanel{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
    
    } 
    div#tecnopanel h1{
        font-family:'Roboto Slab', serif; 
    
    }
    
    div#bordezachin h1{
        font-family:'Roboto Slab', serif;
    
    }
    
    div#bordezachin h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    
    }
    
    
    div#bordezachin img{
        width:22.5%;
        margin-left: 3%;
        margin-bottom: 4%;
        margin-top: 2%;
        float: left;
    }
    
       div#jorgezachin img{
        width: 45%;
        
    
    }
    
    div#zachin{
    
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordezachin{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
    
   
    div#zachin ul{
        background-color: rgb(178, 217, 237);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        margin-right: 3%;
        margin-left: 75%;
        
        
    }
    
    div#zachin ul li{
        font-family: 'Roboto';
        font-weight: bolder;
        margin-right: 6%;
        margin-left: 10%;
        font-size: 15px;
        color: rgb(24,21,35);
        margin-bottom: 3%;
        
    
    
    }
    div#zachin p{
        margin-left: 75%;
        margin-top: 2%;
        margin-bottom: 1%;
        font-size: 18px;
    
    }
    
    div#videos{
         margin-bottom: 10%;
    
    }
  
     div#videos h1{
          font-family:'Roboto Slab', serif;
          font-size: 40px;
          margin-left: 2%;
          margin-top: 2%;
     }
    
    div#videos h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
        font-size: 16px;
    
       
    }
    

    footer{
        margin:auto;
        margin-top:0;
        width:100%;
        height:auto;
        background-color: rgb(93,93,93);
        float:left;
        position: relative;
    }
    
    div#carta {
        width:100%;
        height: auto;
        background-color: rgb(93,93,93);
        margin-top: 0px;
        margin-bottom: 5px;
        text-decoration: none;
        padding-bottom:0%;

    }
    
    div#carta p{
        color: white;
        font-family: sans-serif;
        font-size: 14px;
        font-weight: 100;
        list-style: none;
        text-align: center;
        padding: 1%;
        margin-bottom: 0%;

    }
    
    div#pielogo{
        background-color: white;
        padding: 1%;
        padding-bottom: 0px;
        margin-bottom: 0%;
        border-top-right-radius: 15px;
        border-top-left-radius: 15px;
    }
    
    div#pielogo img{
        background-color: white;
        margin-left: 45%;
        width: 10%;
    }
    
    section{
        position: relative
        
    }
    
    div#placauno{
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 5%;
        margin-top: 1%
    }
    
    div#bordeplacauno{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
    }
    
    div#bordeplacauno img{
        width:90%;
        margin-left: 5%;
        margin-top: 5%;
        margin-bottom: 5%;
            
    }
    
    div#caja{
        width: 75%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 2%;
        margin-top: -2px;
    }
    
    
    
    div#caja p{
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        color: white;
        font-size: 30px;
        width: auto;
        
    }
    
    div#caja img{
        width: 100%
    }
    div#subtituloniveluno p{
        color: rgb(185, 221, 237);
    }
    div#subtituloniveldos p{
        color: rgb(235, 151, 190);
    }
    div#niveluno{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveluno p{
        color: rgb(15,154,215);
        font-family: 'Roboto Slab', serif;
        font-size: 50px;
        text-align: center;

        
        
    }
    
    
   
    
    div#nivel1 ul{
        list-style: none;
        
            
        
    }
    
    div#nivel1 ul li{
        list-style: none;
        margin-top: 2%;
        margin-bottom: 2%;
        margin-left: 3%;

    }
    
    div#nivel1 li{
    float: left;
        
    }
     
    
    
    div#nivel1tp1{
         background: url(imagenes/n1tp1.svg);
         background-repeat: no-repeat;
         background-size: 370px;
         width: 370px;
         height: 202px; 
    
    }
    
    #nivel1tp1:hover {
        background: url(imagenes/n1tp1hover.svg);
        background-repeat: no-repeat;
        background-size: 370px;
        width: 370px;
        height: 202px;
    }
    
    div#nivel1tp2{
    background: url(imagenes/n1tp2.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px;
    
    }
    
    #nivel1tp2:hover {
    background: url(imagenes/n1tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px;

    }
    
    
    div#nivel1tp3{
    background: url(imagenes/n1tp3.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    #nivel1tp3:hover {
    background: url(imagenes/n1tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
  
     div#nivel1tp4{
    background: url(imagenes/n1tp4.svg);
    background-repeat: no-repeat;
   background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    #nivel1tp4:hover {
    background: url(imagenes/n1tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    
    div#niveldos{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 50px;
        text-align: center;

        
        
    }
    
    div#nivel2tp1{
         background: url(imagenes/n2tp1.svg);
         background-repeat: no-repeat;
         background-size: 370px;
         width: 370px;
         height: 202px; 
    
    }
    
    #nivel2tp1:hover {
        background: url(imagenes/n2tp1hover.png);
        background-repeat: no-repeat;
        background-size: 370px;
        width: 370px;
        height: 202px;
    }
    
    div#nivel2tp2{
    background: url(imagenes/n2tp2.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px;
    
    }
    
    #nivel2tp2:hover {
    background: url(imagenes/n2tp2hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px;

    }
    
    
    div#nivel2tp3{
    background: url(imagenes/n2tp3.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    #nivel2tp3:hover {
    background: url(imagenes/n2tp3hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
  
     div#nivel2tp4{
    background: url(imagenes/n2tp4.svg);
    background-repeat: no-repeat;
   background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    #nivel2tp4:hover {
    background: url(imagenes/n2tp4hover.svg);
    background-repeat: no-repeat;
    background-size: 370px;
    width: 370px;
    height: 202px
    }
    
    
    div#caja{
        width: 75%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 2%;
    }
    
    
    
    div#caja p{
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        color: white;
        font-size: 30px;
        width: auto;
        
    }
    
    div#caja img{
        width: 100%
    }
    div#subtituloniveluno p{
        color: rgb(185, 221, 237);
    }
    div#subtituloniveldos p{
        color: rgb(235, 151, 190);
    }
    div#niveluno{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveluno p{
        color: rgb(15,154,215);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;

        
        
    }
    
    div#niveldos{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    div#niveldos p{
        color: rgb(226,27,120);
        font-family: 'Roboto Slab', serif;
        font-size: 40px;
        text-align: center;

        
        
    }

    
    div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
   
   div#curiosidades{
   position: relative;
   float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;    
    }
    
    div#curiosidades h3{
    margin-top: 5%;
    color: rgb(255,234,179);    
    }
    
    div#tinta p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    } 
    


    div#comopapel h3{
        margin-top: 13%;    
    
        }
    
    div#comopapel p{
        margin-top: 3%;
        margin-left: 55%;
        font-size: 15px;
        margin-right: 3%;
    
    }
    
    div#inspiracion h3{
        margin-top: 20%;
    
    }
    
    div#inspiracion p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px;
    }
    
    
    div#editorial h3{
        margin-top: 33%;

    }  
    
    div#editorial p{
     margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
        
    } 
   
    div#grison{
        color: #838383;
    }
    
    div#jerarquía{
        font-family: 'Roboto Slab';
        font-weight: 400;
        color:#c7c7c7;
        font-size: 20px
        
    }
    
    div#jerarquía p{
        font-family: sans-serif;
        font-weight: lighter;
        color:#f0f0f0;
        
    }
    
    div#nivel1{
        width: 100%;
        height: auto;
    }
    
    div#nivel1 ul{
        height: auto;
        width:90;
    }
    
    div#nivel1 ul li{
        width: 40%;
        margin-left: 28%;
        margin-top: 2%;
        margin-bottom: 2%;
        list-style: none;
    }
    
    div#nivel1 ul li p{
        font-family: 'Roboto Condensed';
        font-size: 10px;
        margin-bottom: 4%;
        text-align: center;
        
        
    }
    
    div#nivel1 ul li img{
        width: 100%;
        
    }
    
    
    div#fotolateral img{
        width: 100%;
        height: auto;
        margin-top: 1%;
        float: left;
    }
    
    div#catedra{
        border-top-left-radius: 15px;
        border-top-right-radius: 0px;
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 0px;
        background-color: rgb(24,21,35);
        margin-top: -2px;
        
        
    }
    
    div#catedra p{
        color: white;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        text-align: center;
    }
    
    div#botoneralateralcatedra{
        width: 30%;
        float: left;
        height: 500px;
        
    }
    
    div#botoneralateralcatedra a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateralcatedra ul{
        width:100%;
        margin-top: 20%;
        list-style: none;
        
    }
    
    div#botoneralateralcatedra ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-bottom-left-radius: 10px;
        border-top-left-radius: 10px;
        
    }
    
    
    div#botoneralateralcatedra ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        font-size: 15px;
        
         
    }
    div#subtitulocatedra p{
        font-family: 'Roboto Slab', serif;
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        width: auto;
        margin-bottom: 3%
    }
    
     div#objetivos p{
        color: #838383;
    }
    
    div#texto{
        
        color: #e2e2e2;
        font-weight: 100;
        width: 100%;
        margin-top: 3%;
        font-family: 'Roboto';
        margin-bottom: 4%;
    }
    
    div#objetivos img{
        clear: both;
        width: 100%;
        position: relative;
    }
    

    div#botoneralateral{
        width: 21%;
        float: left;
        height: 500px;
        
    }
    
    div#botoneralateral a{
        text-decoration: none;
        
        
    }
    
    div#botoneralateral ul{
        width:100%;
        margin-top: 20%;
        list-style: none;
        
    }
    
    div#botoneralateral ul li{
        list-style: none;
        float: left;
        width: 100%;
        background-color: rgb(24,21,35);
        margin-bottom: 5%;
        border-top-left-radius: 10px;
        border-bottom-left-radius: 10px;
        
    }
    
    
    div#botoneralateral ul li a{
        width: 90%;
        float: left;
        margin-bottom: 8%;
        text-decoration: none;
        font-family:'Roboto';
        color: white;
        margin: 2%;
        padding-left: 5%;
        
         
    }
    
    div#cianon{
        color: rgb(15,154,215);
    }
    div#magentaon{
        color: rgb(226,27,120);
    }
    
    div#textoplacas{
        width: 70%;
        clear: both;
        margin-left: 20%;
        margin-top: 5%;
        margin-bottom: 5%;
        margin-right: 10%;
        
    }
    
    div#textoplacas p{
        font-family: 'Open Sans Condensed', sans-serif;   
        font-size: 15px;
        
    }
    
    div#cajacatedra{
        width: 66%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 2%;
        margin-top: -2px
        
        
    }
    
    div#subtitulocatedra p{
        margin-top: 2%;
        margin-left: 2%;
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        width: auto;
        color: white
        
        
    }
    div#caja ul{
        line-height: 30px;
        list-style: none;
        
        
    }  
    
    div#caja ul li{
        margin-bottom: 40px;
        font-family: sans-serif;
        
            
        
    }  
    
    div#caja ul li #cajacian{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(185, 221, 237);
        position: relative;
        
    }  
    div#caja ul li #cajamagenta{
        font-family: 'Roboto Slab', serif;
        font-size: 30px;
        color: rgb(235, 151, 190);
        position: relative;

    }
    div#caja ul li span{
        font-family: 'Roboto';
        font-size: 10x;
        color: white;
        font-weight: 100;
        position: relative;
        
    }  
    
    div#links{
        float: right;
        width:10%;
        color: rgb(168, 168, 168);
        
        
    }
    
    div#cajacian img{
        margin-left: 2%;
        width:3.5%;
        color: rgb(168, 168, 168);
        
        
        
    }
    
   div#cajamagenta img{
        margin-left: 2%;
        width:3.5%;
        color: rgb(168, 168, 168);
        
        
        
    }

    
    div#novedades{
        width:100%;
        margin-top: 3%;
        border-radius: 15px;
        border-color: rgb(24,21,35);
        border-style:dashed;
        background-color: white
    }
    div#novedades img{
        width:50%;
        margin: 25%;
        margin-top: 5%;
        margin-bottom: 5%;

    }
    div#n1links h1{
          font-family:'Roboto Slab', serif;
          font-size: 30px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 2%;
       
        
    }
    
   
    
    div#n1links h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    color: #9bc6dd;
    font-size: 25px;
    margin-top: 2%;
        margin-bottom: 3%
   
      
    }
    div#consejos {
    float: left;
        margin-bottom: 5%;
    
    }
    div#consejos p{
        margin-top: 1%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:right;
        width: 50%;
    }
    
   
    div#consejos img{      
        width: 30%;
        float: left;
        margin-left: 5%;
        margin-top: 2%;
       
       
    }
    


div#convideo p{
margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px; 
        float:left;
       margin-bottom: 2%;



}
    div#dimension img{
    width: 50%;
    margin-left: 25%;
    }
    
    div#lito h4{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
        margin-bottom: 2%;
    color: #9bc6dd;
    font-size: 2opx;
    
    }

    div#lito p{
        float: right;
        margin-top: 1%;
        margin-right: 5%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
        width: 60%;



}
div#lito img{
width: 30%;
    margin-bottom:6%;
    margin-left: 2%;
    margin-top: 2%


}

    hr{
     margin-top: 5%;
     color:#189fe6;
    }
  


  


/*termina cambio nivel 1*/
/*empeza cambio nivel 2*/

      div#nivel2link h1{        
           color: rgb(235, 151, 190);
          font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;          
          margin-bottom: 5%;
   
   } 
    
    div#nivel2link h3{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px;   
    
    }
    
    div#nivel2link h4{
    color: rgb(235, 151, 190);
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 20px;
        
    }
    
    
    div#nconsejos p{
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 50%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
    
    
    }
    div#consejos img{
        width: 30%;
    
    
    }

   div#videos2 p{
    float:left;
        margin-top: 1%;
        margin-left: 2%;
        margin-right: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 16px;        
        margin-bottom: 2%;
       width: 
   
   }

  div#ayuda h3{
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 2%;
    font-size: 25px; 
      color: rgb(235, 151, 190);
      
  
  }
  
 

 
    
div#ayuda ul{
    list-style: none;
    float: left;
    width: 100%;
        
            
        
    }
    
    div#ayuda ul li{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 1%;
        margin-left: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 100%;

    }
    
     div#ayuda ul li p{
        list-style: none;
        margin-bottom: 2%;
        margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: right;
        width: 50%;

    }
     div#ayuda ul li img{
        list-style: none;
        margin-bottom: 2%;
         margin-top: 3%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 14px; 
        float: left;
        width: 40%;

    }
    
      /*css del nuevo html consejos*/ 
  div#subtituloconsejo{
  clear: both;
  
  
  } 

  div#subtituloconsejo h1{
       font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color: #9bc6dd;
          margin-bottom: 5%;
      
  } 


  div#nivel1consejo h3{     
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: #9bc6dd;
    font-size: 25px;
      
   
   }
 
div#nivel1consejo p{
        margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 50%;
    float: right;
    

}



div#nivel1consejo img{
      width: 45%;
    margin-bottom: 3%;
    margin-top: 2%;

}

/*css del nuevo html consejosnivel2*/   


div#subtituloconsejo2 h1{
     font-family:'Roboto Slab', serif;
          font-size: 35px;
          margin-left: 2%;
          color:rgb(235, 151, 190);
          margin-bottom: 5%;


}

   div#nivel1consejo2 h3{     
    float: left;
    font-family: 'Roboto', sans-serif;
    font-weight: lighter;
    margin-left: 2%;
    margin-top: 1%;
    color: rgb(235, 151, 190);
    font-size: 25px;
      
   
   }

   div#nivel1consejo2 p{
      margin: 2%;
        color: #fff;
        font-family:'Roboto'; 
        font-size: 13px;        
    width: 50%;
    float: right;
       margin-top: 7%;
    
   }


  div#nivel1consejo2 img{
      width: 45%;
    margin-bottom: 3%;
    margin-top: 2%;
}

/*fin css del nuevo html consejos*/   
    
    /* novedades */

    div#novedades{
        width:100%;
        
    }
    div#novedades img{
        width:75%;
        margin: 13%;
        margin-top: 5%;
        margin-bottom: 5%;        

    }

    div#novedades h3{
    font-family: 'Roboto', sans-serif;
    margin-left: 12%;
    margin-top: 3%;
    font-size: 20px;
    color: rgb(24,21,35);
    
    
    }    
    
    div#novedades p{
        margin-left: 12%;
        margin-bottom: 2%
            
    
    }

 div#fecha{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

 div#fecha2{
     background-color: white;
     border-top-left-radius:0px;
     border-top-right-radius: 0px;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
     margin-left: 13%;
     margin-right: 12%;
     margin-top:3%;
     
 }

   /* fin novedades */  
    
    div#cajatps{
        width: 75%;
        height: auto;
        float: right;
        background-color: rgb(24,21,35);
        border-radius: 15px;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        position: relative;
        padding: 2%;
        padding-bottom: 0px;
        padding-top: 1.5%;
        
    }
    
    div#crocian{
    background-image: url(imagenes/cronograma1-01.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
        
       }
    
    div#cromag{
    background-image: url(imagenes/cronograma2-01-01.png);
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
        
       }
    
    
    
   
   /* Vídeos */
    div#videos{
    margin-bottom: 10%;}
  
div#videos,h1{
    font-size: 40px;
     margin-left: 2%;
    margin-top: 2%;
}
    div#videos h3{
    font-size: 25px;
    margin-left: 3%;
    margin-top: 4%;
       
    }
    



.YTvideos {
    width: 50%;
    margin-left: 25%; 
    margin-top: 5%;
    position: relative;
    padding-bottom: 30%;
   height: 0; overflow: hidden;
    
}
 
.YTvideos iframe,
.YTvideos object,
.YTvideos embed {
    position: relative;
    width: 100%;
    height: 100%;
    margin-bottom: 5%;
    float: left;
} 
  
      div#curiosidadesplaca{
    
        background-color: rgb(24,21,35);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        height: auto;
        width: 96%;
        padding: 2%;
        position: relative;
        float: left;
    
    }
    
    div#bordecuriosidades{
        border-style: dashed;
        width:100%;
        color: rgb(255,234,179);
        border-bottom-left-radius: 15px;
        border-bottom-right-radius: 15px;
        position: relative;
        float: left;
    
    }
   
   div#curiosidades{
   position: relative;
   float: left;
   }
    
   div#curiosidades h1{
       margin-left: 3%;
    }
     
    div#curiosidades h4{
    margin-left: 3%;
    margin-right: 3%;    
    }
    
    div#curiosidades h3{
    margin-top: 5%;
    color: rgb(255,234,179);    
    }
    
    div#tinta p{
    margin-top: 3%;
    margin-left: 55%;
    margin-right: 3%;
    font-size: 15px;
    }
    
    
   
    .curiosidadesvid{
    float: left;
    width: 50%;    
    margin-left: 3%; 
    margin-top: 3%;
    margin-bottom: 5%;
    position: relative;
    padding-bottom: 35%;
    height: 0; overflow: hidden;  
        
    }
    
    .curiosidadesvid iframe,
    .curiosidadesvid object,
    .curiosidadesvid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    } 
    div#comopapel h3{
        margin-top: 13%;    
    }
    
    div#comopapel p{
    margin-top: 3%;
    margin-left: 55%;
    font-size: 15px;
    margin-right: 3%;
    
    }
   
    
    div#inspiracion h3{
        margin-top: 20%;
    }

    div#inspiracion p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px
    }
    
    div#editorial h3{
        margin-top: 33%;
    
    }    
    
    div#editorial p{
        margin-top: 3%;
        margin-left: 55%;
        margin-right: 3%;
        font-size: 15px;
    }

}