@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&display=swap');

body {
    background-color: darkgray;
    font-family: Arial, Helvetica, sans-serif;
    margin: 0px;
    
}
#principal {
    text-shadow: rgba(37, 37, 37, 0.349) 5px 5px 5px ;
    font-size: 70px;
    font-family: "Instrument Serif", serif;
    font-weight: bold;
    
}
header {
    background-color: rgb(209, 208, 208);
    border-radius: 4px;
    margin: 5px 5px 5px 5px;
    padding: 5px;
    text-align: center;
}
nav {
    background-color: white;
    padding: 3px;
    border-radius: 4px;
    text-align: center;
    box-shadow: 3px 7px 20px 5px rgba(0, 0, 0, 0.5);
    
    
}
main {
    background-color: rgb(240, 240, 240);
    padding: 10px;
    margin: 10px;
    border-radius: 4px;

}
footer {
    background-color: black;
    color: white;
    text-align: center;
    font-weight: bold;
    padding: 4px;

}

footer > p {
    margin: 0px;
}

article {
    background-color: rgb(94, 92, 92);
    border-radius: 4px;
    padding: 4px;

    
}
article > aside {
    background-color: aliceblue;
    border-radius: 4px;
    padding-left: 1px;
}

nav > a {
    text-decoration: none;
    color: rgb(59, 90, 90);
    margin-right: 30px;
    font-weight: bold;
    
}
nav > a:hover {
    color: rgb(179, 160, 160);
    background-color: rgba(255, 0, 0, 0.082);
}

#section {
    font-family: Arial, Helvetica, sans-serif;
    text-shadow: none;
}
article > aside:hover {
    background-color: rgb(138, 140, 141);
    color: black;
}
article > aside:hover > .hover {
    color: rgb(0, 0, 0);
    display: inline;
}
.hover {
    display: none;
}
a {
    text-decoration: none;
    color: inherit;
}
p > a:hover {
    text-decoration: underline;
    color: rgb(214, 211, 210);
}
.menu {
    text-align: start;
    
}