*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
*{
    color: rgb(204, 204, 0);
}
html{
    font-size: 62,5%;
}
body{
    background-color: rgb(0, 51, 102);
    min-height: 100vh;
}/*estilando el inicio*/
header{
    background-color:  rgb(211,211, 211);
    height: 4rem;
    padding: auto;
    margin: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top:0;
}
header img{
    width: 3rem;
    height: auto;
    margin:0.5rem;
}
.header .nav{
    list-style: none;
}
.header_li{
    display: inline-block;
    margin: 2rem;
}
.nav a{
    text-decoration: none;
    color: rgb(0, 51, 102);
    font-size: 1.1rem;
}
nav a:hover{
    color: rgb(0, 102, 204)
}
/*estilando el main*/
h1{ 
    font-size: 3rem;
    color: rgb(255, 255, 255);
    margin-bottom:2rem;
}
.que-son-las-finanzas h2{
    margin: 1rem;
}
.que-son-las-finanzas{
    margin: 2rem auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 75rem;
    margin:2rem auto;
} /*modificando el segundo y tercer article*/
.objetivo{
    display: flex;
    justify-content: center;
    height: 20rem;
    width:75rem;
    margin: 2rem auto;
    line-height: 1.6rem;
}
.img-objetivo{
    width: 35rem;
    height: 20rem;
    background-size:contain;
    margin: 0;
    background-repeat: no-repeat;
    background-image: 
    url("../img/finanzas-objetivo.png");
}
h2{
    display: flex;
    line-height: 2rem;
    font-size: 2.4rem;
    justify-content: center;
    align-items: center;
    color: rgba(255,255,255);
}
.text{
    border-radius: 0.5rem;
    padding: 1rem;
    width: 40rem;
    height: 22rem;
}
.text p{
    font-size: 1.2rem;
}
.img-descripcion{
    width: 35rem;
    height: 20rem;
    background-size:contain;
    margin: 0;
    background-repeat: no-repeat;
    background-image: 
    url("../img/Finanzas-descripcion.png");   
}
/*modificando la pag consecuencias y el main*/
.introduccion-consecuencias{
    padding: 2rem 8rem;
    font-size: 1.3rem;
}
.img-consecuencias{
    width: 50rem;
    height: 40rem;
    background-size:cover;
    margin-bottom: 3rem;
    background-position: center center;
    background-repeat: no-repeat;
    background-image:linear-gradient(0deg,
    rgba(0,0,0,0.3),
    rgba(0,0,0,0.3)),
    url("../img/Finanzas-consecuencias.jpg");
}
.consecuencias-container{
    display: flex;
    justify-content: center;
    text-align: center;
    align-items: center;
    flex-direction: column;
}
/*modificando el segundo section*/
.lista-consecuencias{
    padding: 2rem 8rem;
    display: flex;
    justify-content: center;
}
.lista-consecuencias-container{
    display: flex;
    justify-content: center;
}
.lista-consecuencias ol ul{
    padding: 0 2rem;
    font-size: 1.2rem;
}
.list{
    font-size: 1.5rem;
    color: rgb(211,211, 211);
    margin-top: 3rem;
}
/*modificando la pag importancia*/
.importancia{
    width: 75rem;
    padding: 2rem;
}
.importancia p{
    margin: 1rem auto 1.5rem;
}
.importancia-contenedor{
    display: flex;
    justify-content: center;
} 
/*modificando la tabla*/
table{
    border-collapse: collapse;
    margin:1rem 0;
}
th, td{
    text-align: center;
    justify-content: center;
    border: 0.3rem solid rgb(211,211, 211);
    height: 3.5rem;
}
th {
    background-color: rgb(0, 0, 0);
    font-weight: bold;
}
tbody tr:hover {
    background-color: rgb(0, 102, 204)
}
/*modificando el segundo section*/
.p-consejos{
    outline: 0.3rem solid rgb(211,211, 211);
    padding: 1rem;
}
.p-consejos:hover{
    background-color: rgb(0, 102, 204);
}
.consejos{
    width: 75rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.contenedor{
    display: flex;
    justify-content: center;
    margin: 0rem;
    padding: 1rem auto;
}
.consejos p{
    width: 20rem;
    font-size: 1rem;
    margin: 1.5rem;
    padding: 1.5rem;
}
h4{
    color: white;
    margin: 0;
}
.titulo-de-consejos{
    font-size: 2rem;
    width: 75rem;
    margin: 0 auto;
    display: flex;
    justify-content: center;
}
/*modificando tecnicas*/
.p-tecnicas{
    width: 60rem;
}
.contenedor-tecnicas{
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 75rem;
    margin: 0 auto;
}
.lista-de-tecnicas{
    width: 75rem;
    margin: 0 auto;
    display: flex;
    flex-flow: column wrap;
    font-size: 1.4rem;
}
h3{
    color: rgb(255, 255, 255);
    font-size: 1.9rem;
    margin: 1.5rem auto;
    margin-top: 2.5rem;
}
.lista-de-tecnicas li{
    margin:2rem auto;
}
.contenedor-tecnicas a{
    text-decoration: none;
}
.lista-de-tecnicas li:target {
    border: 0.3rem solid rgb(211,211, 211);
    background-color: rgb(0, 102, 204);
    padding: 0.5rem;
    scroll-margin-top: 20rem;
}
ul {
    list-style: none;
}
span{
    color: rgb(255, 255, 255);
}
.consejos-tecnicas{
    width:75rem ;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 1.3rem;
}
.consejos-tecnicas p{
    margin: 1.5rem;
}
.table{
    width: 100%;
    height: 100%;
    padding: 1rem;
}
.consejos-tecnicas li{
    margin: 2rem;
}
.habilidades{
    width: 75rem;
    font-size: 1.3rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto;
}
.lista-habilidades{
    width: 75rem;
    display: flex;
    flex-wrap: wrap;
}
.lista-habilidades a{
    list-style: none;
}
.lista-habilidades li{
    border: 0.3rem solid rgb(211,211, 211);
    width: 15rem;
    height: 30rem;
    padding:1rem;
    margin: 1rem;
}
.content-habilidades{
    display: flex;
    justify-content: center;
}
.planificacion{
    width: 75rem;
    margin:0 auto;
    font-size: 1.3rem;
}
.footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0;
    background-color: black;
    height: 10rem;
}
footer li{
    margin: 1rem;
}
/*menu hamburguesa*/
.nav__label {
    display: none;
}
.nav {
    display: flex;
    justify-content: space-around;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    top: -0.8rem;
}

.nav li a {
    text-decoration: none;
    color: white;
    font-size: 18px;
}
nav li:hover{
    background-color:rgb(0, 102, 204);
    border-radius: 0.3rem;
    padding: 0.3rem;
    font-size: 1.3rem;
}
@media screen and (max-width: 415px) {
    .que-son-las-finanzas, .objetivo{
        width: 300px;
    }
.nav__label {
    display: block;
    cursor: pointer;
    width: 40px;
    height: 40px;
    margin-right: 20px;
    }
#menu{
    visibility: hidden;
}
.nav {
    display: none;
    flex-direction: column;
    background-color: #333333;
    width: 100%;
    height: 100vh;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    }
.que-son-las-finanzas h2{
    line-height: 50px;
}
.nav li a {
    display: block;
    padding: 20px;
    border-bottom: 1px solid white;
    }
    #menu:checked + .nav {
    display: flex;
    }
    .img-objetivo, .img-descripcion{
        display: none;
    }
    .objetivo{
        margin: 30px 20px;
    }
    .objetivo{
        display: none;
    }
    /*pag consecuencias*/
    .img-consecuencias{
        display: none;
    }
    .introduccion-consecuencias {
        padding: 0;
        margin: 30px 20px;
    }
    .lista-consecuencias-container, .lista-consecuencias, .list{
        padding: 0;
    }
    /*pag importancia*/
    .contenedor{
        display: none;
    }
    .importancia table td{
        padding: 0.2rem;
    }
    /*pag tecnicas*/
    .tecnicas_p{
        display: none;
    }
    .contenedor-tecnicas table{
        display: none;
    }
    .consejos-tecnicas{
        display: none;
    }
    .contenedor-tecnicas h1{
        font-size: 2rem;
        margin: 1rem;
    }
    h3{
        font-size: 1.4rem;
        margin: 1rem;
    }
    .planificacion, .habilidades{
        width:23rem;
    }
    .lista-de-tecnicas{
        width: 25rem;
    }
}