* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

a {
    text-decoration: none;
    color: #fff;
}

html {
    font-family: 'Open Sans', sans-serif;
}

/* Navbar Section */

#navbar {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 0.75rem;
    padding: 0.5rem auto;
    width: 100%;
    height: 100px;
}

#navbar img {
    max-width: 300px;
}

.background {
    background: url("../images/background.png") no-repeat;
    background-size: cover;
    position: absolute;
    width: 100%;
}

/* About Section */

.items {
    display: grid;
    grid-template-columns: auto auto auto;
    justify-content: center;
    align-items: center;
    margin: auto;
}

.items .item {
    margin: 1rem;
    background: rgba(255,255,255,0.4);
    border-radius: 5px;
    padding: 1.45rem;
    height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.items .item:hover {
    background: rgba(255,255,255,1);
}

.items .item:hover h2 {
    background: none;
    color: rgba(255, 136, 0, 1);
}

.items .item img {
    max-width: 300px;
    border-radius: 3%;
}

.items .item h2 {
    text-align: center;
    background: rgba(255, 136, 0, 0.575);
    color: #fff;
    border-radius: 5px;
}

#contact {
    border-radius: 5px;
    padding: 1rem;
    background: rgba(255,255,255,0.8);
}

#contact:hover {
    background: rgba(255,255,255,0.9);
}

#contact .contact-form {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
}

#contact .contact-form h4 {
    color: rgba(255, 136, 0, 1);
}

#contact .contact-form ul {
    list-style: none;
    display: flex;
    margin-top: 1rem;
    align-self: center;
}

#contact .contact-form ul li a {
    padding: 1rem;
    font-size: 2rem;
    color: rgba(255, 136, 0, 0.5);
}

#contact .contact-form ul li a:hover {
    color: rgba(255, 136, 0, 1);
}