* {
    box-sizing: border-box;

}

body{
    font-family: arial,Helvetica,Sans-serif;
    margin: 0;
    background: #f1f1f1;

}

header {
    text-align: center;
    background-color: rgb(45, 190, 226);
    padding: 20px;
}

header h1 {
    font-family: Arial;
    font-size: 50px;
    color: white;
    

}

nav ul {
    list-style-type: none;
    background-color: rgb(7, 109, 122);
    overflow: hidden;
    margin: 0px;
    padding: 0px;

}

nav a{
    color: white;
    text-decoration: none;
    padding: 16px;
    display: block;

}

nav li{
    float: left;

}

nav a:hover {
    background-color: white;
    color:  rgb(7, 109, 122);
}

.row {
    padding: 0 20px;
    display: table;
    width: 100%;


}

section {
    float: left;
    width: 85%;

}
aside {
    float: left;
    width: 15%;
    padding-left: 20px;

}

aside img {
width: 100%;
background-color: white;
    padding: 20px;
    margin-top: 20px;

}
.card {
    background-color: white;
    padding: 20px;
    margin-top: 20px;

}

footer {
    padding: 20px;
    background-color: rgb(7, 109, 122);
    color: white;
    margin-top: 20px;
    display: table;
    width: 100%;

}

footer dl, footer p {
    display: table-cell;
    vertical-align: middle;

}

footer dt {
    font-weight: bold;

}

footer dd {
    margin-left:0%;

}

footer p {
    text-align:right;
    font-weight: bold;
    font-size: 25px;
    

}

#sobre h2 {
    font-family: Impact, fantasy;
    text-align: left;
    font-size: 30px;
    color: rgba(120, 120, 120, 0.9)

}

#sobre p {
    font-family: 'comic sans', cursive;
    text-align: justify;

}

mark {
    background-color:aquamarine;
    color: rgb(76, 16, 240);

}
/* configuraçao para Tablets*/
@media screen and (max-width: 768px ) {
    section, aside {
        width: 100%;
    }
}

/*configuração para telemoveis*/
@media screen and (max-width: 600px) {
    nav li {
        float: none;
        text-align: center;
        width: 100%;
    }
    footer p {
        display: none;
    }
}