html {
    box-sizing: border-box;
}

*, *:before, *:after {
    box-sizing: inherit;
}

body {
    margin: 0;
}

/* Header */

header {
    display: table;
    min-width: 100%;
    table-layout: fixed;
    background-color: white;
}

header .logo {
    max-width: 40%;
    height: 50px;
    display: table-cell;
    font-family: 'Playfair Display', serif;
    font-size: 18pt;
    font-weight: 700;
    letter-spacing: 0px;
    vertical-align: middle;
}

header a{
    text-decoration: none;
    color: black;
}

.logo img {
    height: 60px;
    display: inline-block;
    vertical-align: middle;
    padding: 10px;
}

header span {
    display: inline-block;
    margin: 0;
    padding: .5em;
    vertical-align: middle;
}

header nav {
    display: table-cell;
    text-align: right;
    vertical-align: middle;
}

header nav ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

header nav li {
    display: inline-block;
    max-width: 40%;
    text-align: left;
}

.nav-item {
    font-family: 'Open Sans', sans-serif;
    font-size: 11pt;
    display: inline-block;
    overflow: hidden;
    padding: 10px 12px;
    vertical-align: middle;
    color: rgba(0, 0, 0, .7);
}

.nav-item:hover {
    color: rgba(0, 0, 0, 1);
}

.current {
    font-weight: 700;
    color: rgba(0, 0, 0, 1);
}

.nav-item a {
    text-decoration: inherit;
    color: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    display: inline-block;
    max-width: 240px;
    position: relative;
    vertical-align: top;
    cursor: pointer;
}

/* Section */

section {
    padding: 10px 200px;
}

section.normal {
    background-color: white;
}

.banner {
    height: 360px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.banner .title {
    padding: 10px;
    border-radius: 20px;
    /* background-color: peachpuff; */
    
}

.banner .title p {
    margin: 0;
    text-align: center;
}

.background{
    position: absolute;
    height: 100%;
    width: 100%;
    background-position: center center;
    background-image: url('images/banner1.png');
    background-size: cover;
    z-index: -1;
}

.left_image {
    width: 33%;
    display: inline-block;
    vertical-align: middle;
}

.left_image img {
    width: 100%;
}

.right_text {
    padding: 20px;
    width: 66%;
    display: inline-block;
    vertical-align: middle;
}

p.a {
    font-family: Alegreya, Arial;
    font-weight: 500;
    vertical-align: baseline;

    font-size: 22pt; /*Maybe put this in a media query.*/
}

.learn_more {
    display: flex;
    align-items: center;
    justify-content: center;
}

.learn_more button {
    /* margin: auto; */
    color: white;
    background-color: purple;
    border-radius: 20px;
    font-family: Alegreya;
    font-size: 22pt;
    padding: 5px;
    cursor: pointer;
    box-shadow: 8px 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}

.learn_more button:hover {
    box-shadow: 8px 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
}

p.b {
    font-family: 'Open Sans', sans-serif;
    font-size: 18pt;
    text-align: center;
}