.imageContainer {
    height: 500px;
    width: 100%;
    background-size: 100% 100%;
}

.div50 {
    width: 50%;
    float: left;
}

.callOutBorder {
    margin: 50px;
    border: 4.5px #fff solid;
    width: 175px;
    height: 115px;
    text-align: center;
    background-color: rgba(0,0,0,0.2);
}

    .callOutBorder a {
        font-family: interstate light condensed;
        vertical-align: middle;
        color: white !important;
        width: 100%;
        height: 100%;
        display: block;
        font-weight: 900 !important;
        font-size: 45px;
        letter-spacing: 2.5px;
        text-transform: uppercase;
        line-height: 115px;
    }

        .callOutBorder a:hover {
            color: #e7810b !important;
        }

    .callOutBorder:hover {
        background-color: rgba(0,0,0,0.6);
        /*background-color: #862633;*/
    }

.rightCalloutBorder {
    color: white;
    float: right;
    font-family: interstate light condensed;
    font-size: 45px;
    font-weight: 900;
    letter-spacing: 2.5px;
    line-height: 45px;
    margin: 70px 50px 0 0;
    text-transform: uppercase;
    text-align: right;
}

.mainContainer {
    position: relative;
    width: 100%;
}

.wrapper {
    position: relative;
    width: 100%; /* <-- just a default, can be anything. */
}

.three-by-two.aspect-ratio {
    padding-bottom: 66.666%;
}

.four-by-three.aspect-ratio {
    padding-bottom: 75%;
}

.sixteen-by-nine.aspect-ratio {
    padding-bottom: 56.25%;
}

.content {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0 24px; /* Optional padding for content area */
}

.five-hundred {
    padding-bottom: 54.56%;
}

.admissionsContainer {
    background: linear-gradient(rgba(0,0,0, 0.35) 1%, rgba(0,0,0, 0.1) 40%, rgba(0, 0, 0, 0) 100%);
    background: -moz-linear-gradient(rgba(0,0,0, 0.35) 1%, rgba(0,0,0, 0.1) 40%, rgba(0, 0, 0, 0) 100%);
    background: -webkit-linear-gradient(rgba(0,0,0, 0.35) 1%, rgba(0,0,0, 0.1) 40%, rgba(0, 0, 0, 0) 100%);
    background: -o-linear-gradient(rgba(0,0,0, 0.35) 1%, rgba(0,0,0, 0.1) 40%, rgba(0, 0, 0, 0) 100%);
    background: -ms-linear-gradient(rgba(0,0,0, 0.35) 1%, rgba(0,0,0, 0.1) 40%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

@media (min-width:750px) {
    .noneFull {
        display: none;
    }
}

@media (max-width:749px) {
    .rightCalloutBorder {
        float: left;
        font-weight: 900;
        width: calc(100% - 50px);
        margin: 15px 0 0 50px;
        font-size: 20px;
        line-height: 20px;
        display: block;
        letter-spacing: 2.5px;
        font-family: interstate light condensed;
        color: white;
        text-align:left;
        text-transform: uppercase;
    }

    .div50 {
        width: 100%;
        float: left;
        display: block;
    }

    .callOutBorder {
        border: 4.5px #fff solid;
        width: 160px;
        height: 80px;
        margin: 20px 0 0 50px;
        display: inline-block;
        text-align: center;
    }

        .callOutBorder a {
            line-height: 80px;
        }

    .none {
        display: none;
    }
}
/***********COLORS************/
.maroon {
    background-color: #862633;
}

.blue {
    background-color: #365777;
}

.darkGrey {
    background-color: #AFAEAA;
}

.lightGrey {
    background-color: #e1e0db;
}

.whiteTitle {
    color: #fff!important;
}

span .maroonTitle {
    color: #862633!important;
}

.goldTitle {
    color: #e7810b!important;
}

.blueTitle {
    color: #365777!important;
}

.whiteFont {
    color: #fff;
}

.darkGreyFont {
    color: #39383b;
}
/**************END COLORS************/



/******************WIDTHS****************/
.aHalf {
    width: 50%;
}

.aThird {
    width: 33.333333%;
}

.aWhole {
    width: 100%;
}
/********END WIDTHS*********/
.mainContainer {
    float: left;
    width: 100%;
}

.smallContainer {
    font-family: interstate;
    height: 175px;
    float: left;
}

.leftCallToAction {
    width: 33.33%;
    float: left;
    height: 100%;
    display: block;
    vertical-align: middle;
}

    .leftCallToAction span {
        text-align: right;
        display: block;
        font-size: 55px;
        font-family: Interstate Light Condensed;
        margin: 0;
        text-transform: uppercase;
        letter-spacing: 2.5px;
        line-height: 175px;
    }

.halfLeftCallToAction {
    width: calc(100% - 50px);
    float: left;
    margin: 20px 0 0 50px;
    height: calc(50% - 20px);
    display: block;
    vertical-align: middle;
}

    .halfLeftCallToAction span {
        font-size: 57px;
        font-family: interstate light condensed;
        text-align: left;
        line-height: 70px;
        text-transform: uppercase;
        letter-spacing: 2.5px;
        vertical-align: bottom;
    }

.halfRightContent {
    display: block;
    float: left;
    margin: 10px 10px 0 50px;
    width: calc(100% - 60px);
    height: calc(50% - 10px);
}

    .halfRightContent p {
        font-size: 13px;
        margin: 0 0 5px 0;
        line-height: 18px;
    }

.rightContent {
    display: block;
    color: white;
    float: left;
    width: calc(66.66% - 130px);
    height: 100px;
    margin: 40px 80px 35px 50px;
}

    .rightContent a {
        text-transform: uppercase;
        text-decoration: none;
        line-height: 20px;
        font-size: 15px;
        font-family: interstate black;
    }

.halfRightContent a:hover, .thirdRightContent a:hover {
    color: #862633;
}

.rightContent p {
    font-size: 25px;
    margin: 0 0 10px 0;
    color: #fff;
    line-height: 35px;
}

.thirdLeftCallToAction {
    width: calc(100% - 50px);
    float: left;
    margin: 10px 0 0 50px;
    height: calc(45% - 10px);
    display: block;
    vertical-align: middle;
}

    .thirdLeftCallToAction span {
        font-size: 57px;
        font-family: interstate light condensed;
        text-align: left;
        line-height: 75px;
        text-transform: uppercase;
        letter-spacing: 2.5px;
        vertical-align: bottom;
    }

.thirdRightContent {
    display: block;
    color: white;
    float: left;
    margin: 5px 20px 0 50px;
    width: calc(100% - 70px);
    font-family: interstate;
    height: calc(55% - 15px);
}

    .thirdRightContent p {
        font-size: 13px;
        margin: 0 0 5px 0;
        line-height: 20px;
    }

    .thirdRightContent a, .halfRightContent a {
        font-size: 13px;
        margin: 0;
        font-family: interstate black;
        text-transform: uppercase;
        line-height: 20px;
    }



@media (max-width:1007px) and (min-width:750px) {
    .halfLeftCallToAction span, .thirdLeftCallToAction span {
        font-size: 42px;
    }

    .thirdRightContent p {
        font-size: 11px;
    }

    .rightContent p {
        font-size: 21px;
    }
}

@media (max-width:749px) {
    .aThird, .aHalf {
        width: 100%;
    }

    .leftCallToAction span, .thirdLeftCallToAction span, .halfLeftCallToAction span {
        font-size: 45px;
        line-height: 45px;
    }

    .thirdLeftCallToAction, .leftCallToAction, .halfLeftCallToAction {
        width: calc(100% - 50px);
        float: left;
        margin: 30px 0 0 47px;
        height: calc(45% - 35px);
        display: block;
        vertical-align: middle;
    }

        .leftCallToAction span, .halfLeftCallToAction span .thirdLeftCallToAction span {
            font-family: interstate light condensed;
            text-align: left;
            line-height: 45px;
            margin: 0;
            letter-spacing: 2.5px;
            vertical-align: bottom;
        }

    .rightContent, .halfRightContent {
        display: block;
        color: white;
        float: left;
        margin: 7px 20px 0 50px;
        width: calc(100% - 70px);
        font-family: interstate;
        height: calc(55% - 7px);
    }

        .rightContent p, .halfRightContent p {
            font-size: 13px;
            margin: 0 0 5px 0;
            line-height: 20px;
        }

        .rightContent a, .halfRightContent a {
            font-size: 13px;
            margin: 0;
            font-family: interstate black;
            text-transform: uppercase;
            line-height: 20px;
        }
}

.maroonLink {
    color: #862633 !important;
}

    .maroonLink:hover {
        color: #e7810b!important;
    }

.yellowLink, yellowLinkDark {
    color: #e7810b !important;
}

    .yellowLink:hover {
        color: #862633 !important;
    }

.yellowLinkDark:hover {
    color: #e3a863!important;
}
