@import url('https://fonts.googleapis.com/css?family=Fira+Sans:200,400,900');
header {background: #f4f3d9 ;}

*{margin: 0}
header {background: url(../img/7.jpg);
    box-shadow: 2px 2px 2px 2px #c4c4c4;
    box-shadow: 10px 10px 8px rgba(181, 172, 172, 0.46);
    text-align: center
}


body {background: 0000 ;
font-family: 'Fira Sans', sans-serif;
    

}

title {font-family: }



/*Menu de navegación*/

nav { background:  url(../img.jpg)
      
    
    ;}

nav ul {padding: 3.5rem;
        text-align: center;
        box-shadow: 2px 2px 2px 2px rgba(77, 42, 42, 0.13);
;}

nav ul li {  
             text-align: center; list-style-type: none;
             display:inline-block;
             margin: 0%; padding: 0%;
             font-size: 

                    }
nav ul li:hover {background: rgba(255, 0, 0, 0.65) ; 
                 color: #000000; 
                border-radius: 10rem;
                }


nav ul li a { color: rgb(255, 255, 255);
              text-decoration: none;
              text-align: center;         
              font-size: 1rem;
              align-content: space-between;
              padding: 0.5rem;
              display: inline-block;
              background: rgba(245, 11, 11, 0.65);
              border-radius: 0.5rem;

}


/* HS */

h1 {
    font-size: 2.5rem;
    text-align: center;
    margin-top: 2%;
    color: #cb3838;
    padding: 0.5rem;
    
    }

h2 {
    padding: 1rem;
    color: #000000;
    margin-left: 2%;
    margin-bottom: 2%;
    font-size: 1rem;
    font-weight: 400 

    }

h4 {
    margin-left: 0%;
    margin-top: 0%;
    font-size: 1.2rem;
    padding: 0.5rem;
    margin-bottom: 2%;
    display: inline-block;
    background-color: #cb3838;

    }

/*TEXTO*/
.materias {display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
    align-content: space-between;

}

.nivel1{
    position: relative;
    width: 260px;
    height: 190px;
    margin: 20px;
    background-color: #f1245f;
    box-shadow:  5px 5px 10px -2px rgba(0,0,0,0.5);
    transform: scale(1);
    transition: transform 0.5s;
}

.nivel1:hover{
    transform: scale(1.05);
}
.nivel1 .fondo{
    position: absolute;
    top: 30px;
    left: 30px;
    width: 260px;
    height: 190px;
    margin: 20px;
    background-color: black;
    z-index: 1;
    box-shadow:  5px 5px 10px -2px rgba(0,0,0,0.5) 
}

.nivel1 h3{
    padding: 0.5rem;
    margin-top: 2%;
    margin-bottom: 2%;
    display: inline-block;
    background-color: #0a0a0a;
    text-transform: uppercase;
    color: white;
    position: absolute;
    top: -11px;
    left: -7px;
}

.nivel1 p{
    position: relative;
    top: 44px;
    left: 20px;
    text-transform: uppercase;
    font-weight: bold;
    color: black;
}
.nivel1 p span{
    color: white;
    font-weight: 400;
    text-transform: none;
}

.nivel2{
    background-color: red;
    margin: 20px;
    width: 260px;
    height: 190px;
}


p { 
    font-weight: 2400; 
    text-align: 

    }

p span { color:#cb3838; }

.imagen-titulo img {
     border-radius: 8rem;
     box-shadow: 2px 2px 2px 2px #c4c4c4;
     box-shadow: 10px 10px 8px rgba(181, 172, 172, 0.46);
     padding: 0.5rem;    
margin-top: 20px;
}

.datosobligatorios {
    padding: 1rem;
    text-align: left;
    font-size: 0.8rem;
}

footer {font-size: 1rem; 
        font-weight: 200; 
        margin-top: 1rem;
        margin-bottom: 1rem;
        margin-left: 1%;
}

.imagen-titulo{
    text-align: center;
}

.galeria{
    padding: 20px;
}


.galeria h4{
    padding: 0.5rem;
    margin-top: 2%;
    margin-bottom: 2%;
    display: inline-block;
    background-color: #0a0a0a;
    text-transform: uppercase;
    color: white;
}


/*RESPONSIVE*/