/*estilos----------------------------------------------------------------------------*/
*{font-family:Verdana, Geneva, Tahoma, sans-serif cursive; font-size: 20px; text-align: justify;}
.h1{text-align:center; color: #181010; font-size:80px; }
.h2{text-align: justify; color: orange; font-size: 60px;}
.h3{text-align: justify; color: green; font-size: 40px;}
p{text-align: justify; font-size: 20px;}
.ColorBlanco{ color: #fff;}
.marginText{margin: 20px 40px;}
.amarilloRojo{color: #f06c20;}
.center{text-align: center;}

.separador{padding-top: -100px;}/*Con esto subimos el separador*/
/*body{padding-top: 30px;} */
.nav{
    padding-top: 120px; /*Bajamos el nav*/ 
    width: 100%;   /*Anchura muy grande para rellenar*/ 
    background:#378a53; 
    position:fixed;  
    margin: -150px; /*con el margin subimos el nav*/ 
    margin-left: 0px;
    z-index: 10;
}

    
        
    

.nav__li { display: inline-block; color: #fff; padding: 12px;} /*ponemos links en misma fila y separacion*/ 
.nav__li a{color: #fff; text-decoration: none;} /*color blanco texto y sin decoracion*/ 
.logo{margin-top: -30px;} /*color blanco texto y sin decoracion*/ 
.nav__li:hover > a{color: #bbb;}/*cuando pase por texto cambia de color*/
section{margin: 40px 60px;}
article{margin: 40px 60px;}
.footer{ padding: 20px 20px; color: #fff; background: #378a53; text-align: center; width: 100%; }


.nav__li i{ /*modificamos el i que se encuentra dentro del .nav__li*/
	text-align: right; /*Aqui alineamos los iconos*/
	box-sizing:border-box;
	margin-right: 5px ;   /*realizamos un margen a los iconos 5 pixeles a la derecha*/
    
}







/*Efecto blour*/



.background-container{
    width: 100%;
    height: 100vh;
    position: relative;
    /*Al final del url decimos no repeat y center que es la posicion*/
    background:url(../../ClasesAdicionales/img/fondo1.jpeg)
    no-repeat center;
    z-index: -10;
    background-size: cover;
    display:flex;
    align-items: center;

    /*(https://images.pixexid.com/a-4k-ultra-hd-wallpaper-of-a-futuristic-cityscape-at-night-with-neon-lights-ill-u12ywmlh.jpeg)
    /*(https://img.freepik.com/foto-gratis/pintura-lago-montana-montana-al-fondo_188544-9126.jpg)*/
    
    /*(https://media.sproutsocial.com/uploads/landscape-hero-bg-1.jpg)*/
}

.card-container{
    width: 25rem;
    height: 28rem;
    border: 3px solid #fafafa10;
    margin: 0 auto;
    border-radius: 1rem;
    z-index: 0;
}

.glass-effect{
    background:#fafafa10;
    backdrop-filter: blur(0.4rem);
    -webkit-backdrop-filter: blur(0.4rem);
}