
:root {
    --colorfondo: #e6e6fe;
    --colorprincipal: #00008b;
    --colorsecundario: #3838b3;
    --colorfondo2: #f7f7ff;
    --negro: black;
    --blanco: white;
}
body{
    font-family: Arial, Helvetica, sans-serif;
    display: grid;
   align-items: center;
   
   
}
body header{
    width: 1350px;
}
body header {
    display: grid;
    color: var(--blanco);
    background-color: var(--colorprincipal);
    grid-template-columns: 1fr 1fr;
    align-items: center;
    height: 100px;
    margin: auto;


}

body header nav ul{
  list-style: none;  
}
body header nav ul li{
    display: inline;
}
body header nav ul li a{
    text-decoration: none;
    color: var(--blanco);
    
}
body header form {
    float: right;
    
}
body header form button{
    color: var(--blanco);
    background-color: var(--colorprincipal);
    border: 0px;
    
}
body main{
    background-color: var(--blanco);
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: auto;
    justify-items: center;
    width: auto;
    

}
main div{
    background-color: var(--colorprincipal);
    
    float: right;
}
main div h3{
    color: var(--blanco);
    text-decoration: none;
    list-style: none;}
main div ul li{
    color: var(--blanco);
    text-decoration: none;
    list-style: none;}
main div ul li a{
        color: var(--blanco);
        text-decoration: none;
        list-style: none;
}
main section {
    width: auto;
    background-color: var(--colorfondo2);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;

}
main section article div{
    background-color: var(--colorfondo2)!important; 

}
footer{
    background-color: var(--negro);
    color: var(--blanco);
}
footer nav ul{
    
    list-style: none;

}
footer nav ul li{
   
    display: inline;
}
footer nav ul li a{
    text-decoration: none;
    color: var(--blanco);
    
}