@font-face {
    font-family: 'abelregular';
    src: url('abel-regular-webfont.eot');
    src: url('abel-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('abel-regular-webfont.woff2') format('woff2'),
         url('abel-regular-webfont.woff') format('woff'),
         url('abel-regular-webfont.ttf') format('truetype'),
         url('abel-regular-webfont.svg#abelregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'ralewaysemibold';
    src: url('raleway-semibold-webfont.eot');
    src: url('raleway-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('raleway-semibold-webfont.woff2') format('woff2'),
         url('raleway-semibold-webfont.woff') format('woff'),
         url('raleway-semibold-webfont.ttf') format('truetype'),
         url('raleway-semibold-webfont.svg#ralewaysemibold') format('svg');
    font-weight: normal;
    font-style: normal;

}
html{background-color:#FFFFFF;
width: 1583px;
height:auto}


#pagina1 {
    width: 70%;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0rem;
    height: 1000px;
    background-color: #FFFFFF;}

  #pagina2 {
    width: 70%;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0rem;
    height: 1800px;
    background-color: #FFFFFF;}

 #pagina3 {
    width: 70%;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0rem;
    height: 1800px;
    background-color: #FFFFFF;}

 #pagina4 {
    width: 70%;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 0rem;
    height: 2300px;
    background-color: #FFFFFF; }


body {padding: 0;
      margin: 0;
      margin: 0 auto;
      font-family: 'Roboto Condensed', sans-serif;
      
      font-size: 100%;
}



header{ width: 100%;height: 795px; position: relative;max-height: inherit;       
        background-image:url(tp/imagenes/dani1.jpg);
        background-repeat:no-repeat;
        background-position: center; position: relative; display: block;margin-top: 75px; }

nav {
    width: 100%;
    height: 80px;
    background-color: #000;
    position:fixed;
    top: 0;
    left: 0;
   
}

nav ul li {
      position:relative;
      display: inline-block;
      width: 30px;
      height: 50px;
      margin-left: 20%;
      margin-top: 6px;
      background-color:black;
     
    }


nav ul :hover {background-color:#B2D1FF;
                 }

nav ul li a {   text-decoration: none;
                color:#FFFFFF;
                font-family: "Titillium Web";
                font-size: 25px;
                font-weight: 900;
                letter-spacing: 0.1em;
   
}


.cajas {
  
    background-color: #B2D1FF;
    height: auto;
    list-style: none;
    margin: 0;
    padding: 0;
    border: 0;
    float:left;
    width: 100%;
    text-align:justify;
    margin-top: 15px;
    margin-right: 15px;
    }


#cuadro1 {
    
    width: 33%;
    height:auto;
    float:right;
    text-align: center;
    margin-top: 40px;
    margin-right: 11px;
   
         }

#cuadro1  h2 { position:relative;
              margin-top: 10px;
              text-transform: uppercase;
              color: black;
             
                 }

#cuadro1 p { position:relative;
            color: black;
             }

    
#cuadro2 {
            width: 33%;
            float: right;
            height:auto;
            text-align: center;
            background-image:url(tp/imagenes/iconomaletin.png);
            background-repeat:no-repeat;
            background-position:top;
            margin-top: 40px;
    
         }

#cuadro2 h2 {  position:relative;
               margin-top: 10px;
               text-transform: uppercase;
               color: black;
             }
#cuadro2 p { position:relative;
            color: black;
             }

#cuadro3 {
            width: 33%;
            height:auto;
            float:right;
            text-align: center;
            background-image:url(tp/imagenes/iconomegusta.png);
            background-repeat:no-repeat;
            background-position:top;
            margin-top: 40px;
    
}

 
#cuadro3 h2 { position:relative;
               margin-top: 10px;
              text-transform: uppercase;
              color: black;
             }

#cuadro3 p { position:relative;
            color: black;
             }

h2 a {
    display: block;
    color:#000000;
    text-decoration: none;
}

hr {
     width: 80%;
     margin: auto;
     border-style: double; 
}

#contenedordefotos {   width: 960px;
                       height: 350px;
                       opacity: 1;
                       margin:0 auto;
                      }



.fotoscuadradas {    width: 172px;
                     height: 172px;
                     float: right;
                     margin-top: 15px;
                     margin-right: 15px;
                    
                     list-style: none;
     
                   }


#contenedordefotos2 {  width: 960px;
                       height: 350px;
                       opacity: 1;
                       margin:0 auto;
                      }


.fotoscuadradas4 {   width: 344px;
                     height: 172px;
                     float: right;
                     margin-top: 15px;
                     margin-right: 90px;
                     vertical-align: middle;
                     list-style: none;
     
                   }

#footer1{
    width: 100%;
    min-height: 100px;
    display: block;
    position: relative;
    float: right;
    margin: 15px auto 0 auto;
    background: #000;
    font-family: sans-serif;
    font-size: 10px; 
    color: #fff;
    }


footer .legales p{ 
    color: #fff; 
    font-family:'Raleway'; 
    font-weight: 400;  
    position: relative;
    float: right;
    width: 60%;
    font-size: 0.9rem;
    margin: 3.5% 5% 3.5% 5%;
}

footer a{
    width: 10%;
    display: block;
    position: relative;
    float: left;
    margin-left: 15%;
    margin-top: 2.5%;
    text-decoration: none;
}

footer .logo{
width: 75%;    
display:block;
margin-left: 10%;   
}

footer .marca{ 
    color: #fff; 
    font-family:'Raleway'; 
    font-weight: 400;  
    position: relative;
    font-size: 0.7rem;
    text-align: center;
    margin-top: 3%;
}

}
 
#iconomegustagrande { width: 1583px;
                     height: 300px;}


#iconomegustagrande img{
                        float: left;
                          margin-left: 25%;margin-top: 25px;
}
                       
#iconomegustagrande h1 {
                        float:right;
                        margin-right: 25%;
                        margin-top: 120px; font-family: "kreon";
                        font-variant: normal;
                        font-size: 50px;
                        height: 121px;
}
                    

#iconoportfoliogrande{ width: 1583px;
                       height: 300px;}

#iconoportfoliogrande img{
                          float: left;
                          margin-left: 15%;margin-top: 25px;
}


#iconoportfoliogrande h1 {
                        float:right;
                        margin-right: 45%;
                        margin-top: 120px; font-family: "kreon";
                        font-variant: normal;
                        font-size: 50px;
}


#materiasaprobadas{ margin: 0  33% auto;
                    list-style: none;
                    padding: 0rem;
 
                        }


a {text-decoration: none}

#cursando{ margin: 0  33% auto;
           padding: 0rem; }


.materias img{ margin: 3% 3% 3% 3% ;
  
}