﻿/** For the Landing Page. **/

.landing-bg {
    width: 100%;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    align-items: center;
    display: flex;
}

.max-z {
    position: relative;
    z-index: 9995;
}

div.landing-titles {
    display: flex;
    flex-direction: column;
    color: #FFFFFF;
}

h1.landing-title,
h2.landing-title {
    display: block;
    font-weight: bold;
    /*text-transform: uppercase;*/
    text-wrap: pretty;
    line-height: 1.1;
    text-align:left !important; 
}

h2.landing-lede,
h3.landing-lede {
    display: block;
    order: -1;
    font-size: 20px;
    line-height: 1.5;
    text-align: left !important;
    font-weight: bold;
}

h2.landing-subtitle,
h3.landing-subtitle {
    display: block;
    font-size: 20px;
    line-height: 1.5;
    text-align: left !important;
    font-weight: bold;
    margin-bottom:0px;
}

.font-adjust h2 {
    font-size: 36px;
}

@media(min-width:1200px) {
    .landing-bg {
        min-height: 617px;
        padding-bottom:105px;
    }
}


@media(min-width:1200px) {
    h2.landing-title,
    h1.landing-title {
        font-size: 290%;
    }
}

@media(max-width:1199px) {
    h2.landing-title,
    h1.landing-title {
        font-size: 225%;
    }

    .landing-bg {
        padding-top: 40px;
        padding-bottom: 133px;
    }

}

@media(max-width:992px) {
    h2.landing-title,
    h1.landing-title {
        font-size: 150% !important;
    }

    h2.landing-subtitle,
    h3.landing-subtitle{
        margin-bottom:1.5rem;
    }
}

@media(min-width:992px){
    .landing-bg .row {
        display: flex;
        align-items: center;
    }
}

div.row.landing-info{
    color:#fff !important;
}

div.row.landing-info div.col-xs-12{
    line-height: 135%;
}

    .landing-info a {
        color: #fff000;
    }

        .landing-info a:hover {
            color: #FFFAB3 !important;
        }

@media(max-width:300px){
    .display-xxs{
        display:initial;
    }

    .hide-xxs{
        display:none;
    }
}

@media(min-width:301px){
    .display-xxs{
        display:none;
    }

    .hide-xxs{
        display:initial;
    }
}

/* Dark overlay */
.bg-gradient {
    position: relative;
}

    .bg-gradient:after {
        position: absolute;
        content: "";
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+32,0.5+34,0.5+34,0+100 */
        background-color:rgba(0,0,0,0.5)
    }

/* Forms (Contact / Employment / Rental / Etc) */

.landing-bg .app-form{
    margin-bottom:0 !important;
}

.app-form .card {
    /*margin-bottom: 1.5rem;*/
    background-color: rgba(0,0,0,0.65) !important;
    border-radius:10px;
}

.app-form .card-body {
    padding: 2rem;
}

    .app-form .card-body h2{
        text-align:center !important;
        font-size:32px;
        color:#fff !important;
        padding:2rem;
    }

    .app-form .card-body .btn, 
    .app-form .card-body .btn:visited {
        background-color: #de1818;
        font-weight:bold !important;
        border-color: #c41515;
    }

        .app-form .card-body .btn:hover,
        .app-form .card-body .btn:has(:hover) {
            background-color: #ba1515 !important;
            border-color: #c41515 !important;
        }

.app-form .card-body label {
    font-size: 20px;
    line-height: 150%;
    margin-bottom: 0.25rem;
    color:#fff !important;
}

@media(min-width:768px){
    div.row.mb-10 div.col-xs-12.col-sm-8{
        padding-right: 10px;
    }

    div.row.mb-10 div.col-xs-12.col-sm-4 {
        padding-left: 10px;
    }
}

@media(max-width:767px){
    .app-form .card-body input{
        margin-bottom:15px;
    }
}