body {
    font-family: 'ABeeZee', sans-serif;
    padding:0px;
    margin:0px;
    font-size:22px;
}

header {
    display:flex;
    padding:50px 10px 0px 10px;
}

    header .branding {
        width:60%;
    }
        .branding img {
            width:100%;
        }

    header .cta {
        width:40%;
        text-align:center;
    }
        .cta button {
            width: 350px;
            height: 60px;
            border-radius: 100px;
            background: transparent;
            border-color: #1f4ea0;
            color: #1f4ea0;
            box-shadow: none;
            cursor:pointer;
            font-size:24px;
            margin-top:75px;
        }
        .cta button:hover {
            opacity:.75;
        }

        .showcase {
            padding:50px 100px 50px 100px;
        }
.showcase h2 {
    font-size:42px;
    font-weight:400;
}

.showcase h2 span {
    font-weight:bold;
    font-size:50px;
    color:#1f4ea0;
}

.subfeature {
    display:flex;
    background:#eeeeee;
    flex-grow:1;
    padding:0px;
    overflow:hidden;
}
.subleft {
    width:40%;
    padding:50px 50px 50px 100px;
}

.subleft h2 {
    color:#1f4ea0;
    font-size:48px;
}
    .subleft button {
        max-width: 400px;
        width:100%;
        height: 60px;
        border-radius: 100px;
        background: #1f4ea0;
        color: #ffffff;
        border:none;
        box-shadow: none;
        cursor:pointer;
        font-size:20px;
        font-weight:bold;
        display:block;
        margin:auto;
    }
    .subleft button:hover {
        opacity:.8;
    }

.subright {
    width:60%;    
    background:url('texture.jpg');
    background-size:cover;
}
.subrightoverlay {
    background:linear-gradient(to right, #eeeeee, rgba(238,238,238,.95) 30px);
    padding:100px 100px 50px 100px;
    height:100%;
}

.subright i {
    margin-right:8px;
    margin-left:-30px;
    color:#1f4ea0;
}

footer {
    padding: 25px;
    text-align: center;
    font-size: 16px;
    color: #afafaf;
    max-width: 600px;
    display: block;
    margin: auto;
}


@media(max-width:970px) {
    header {
        flex-direction:column;
        text-align:center;
    }
    header > * {
        width:100% !important;
    }
}

@media(max-width:850px) {
    .showcase {
        padding:50px;
    }
    .subfeature {
        flex-direction:column;
    }
    .subfeature > * {
        display:block;
        margin:auto;
        width:90%;
    }
    .subleft {
        padding:25px;
    }
    .subrightoverlay {
        padding:50px;
    }
}