body {
    display: grid;
    grid-template-areas:
    'header header header header header header header header header header header header'
    'nav nav nav main main main main main main main main main'
    'nav nav nav aside aside aside aside section1 section1 section2 section2 section2'
    'nav nav nav footer footer footer footer footer footer footer footer footer'
    ;
    gap: 10px;
    padding: 5px;
    background-color: rgb(231, 240, 255);
    font-family: Arial, Helvetica, sans-serif;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
  }
  .header {
    grid-area: header;
}

header div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #0a2855;
}

header div input {
    border-radius: 5px;
    height: 25px;
    width: 250px;
    text-align: center;
}

.nav {
    grid-area: nav;
    background-color: #0f52ba;
    font-weight: bold;
    display: flex;
    flex-direction: column;
    border-radius: 5px;
    gap: 43px;

}

nav a {
    color: white;
    text-decoration: none;
    font-size: 18px;
    padding: 15px;
    text-align: center;
    padding: 1rem;
}

nav a:hover:not(.active) {
    background-color: rgb(18, 18, 18);
    transition: background-color 0.3s ease-in-out;
}

nav a.color1 {
    color: rgb(101, 212, 255);
}

nav a.color2 {
    color: #cb9345;
}

.main {
    grid-area: main;
    background-color: #0f52ba;
    border-radius: 5px;
    display: flex;
    justify-content: space-between;
    padding: 1px 40px;
}

main h1 {
    color: white;
    align-items: center;
    font-family: 'Times New Roman', Times, serif;
}

main p {
    color: white;
    
}

main img {
    
    border-radius: 100%;
    width: 120px;
    height: 120px;
    position: relative;
    top: 30px;
    right: 80px;
}

.aside {
    grid-area: aside;
    background-color: white;
    border-radius: 5px;
    display: inline-block;
    text-align: center;
}

aside h3 {
    text-align: start;
    padding: 1rem 6rem;
}

.section1 {
    grid-area: section1;
    background-color: white;
    border-radius: 5px;
    
}

.section1 div {
    background-color: rgb(231, 240, 255) ;
    border-radius: 7px;
    margin: 10px;
    text-align: center;
    padding-top: 1px;
    padding-bottom: 1px;
}

.section1 h3 {
    padding: 3px 10px;
}

.section1 div p {
    color: #0f52ba;
}

.section2 {
    grid-area: section2;
    background-color: white;
    border-radius: 5px;
}

.section2 h3 {
    padding: 3px 10px;
} 

.section2 div {
    background-color: rgb(231, 240, 255) ;
    border-radius: 7px;
    margin: 10px;
    text-align: center;
    padding-top: 1px;
    padding-bottom: 1px;
}

.section2 div p {
    color: #0f52ba;
    font-weight: bold;
}

.footer {
    grid-area: footer;
    border-radius: 5px;
    background-color: white;
}

footer div {
    background-color: rgb(231, 240, 255) ;
    border-radius: 7px;
    margin: 10px;
    padding-top: 1px;
    padding-bottom: 1px;
}

footer h3 {
    padding: 5px 20px;
}

footer div a {
    font-weight: bold;
    color: #0f52ba;
}

footer div {
    border-radius: 7px;
    margin: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

footer div p {
    position: relative;
    left: 20px;
}