
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Whisper&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css");
:root {
 --offWhite: #F4F3EE;
 --cream: #e7e5d9;
 --sand: #f1efe7;
 --lightSage: #8d917e;
 --sage: #c3c1ab;
 --darkSage: #737962;
 --fuzzyWuzzy: #C16E70;
 --darkGrey: #393c3c;
 --grey: #423E37;
}
body {
    background-color: var(--offWhite);
}
h1 {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-size: .95rem;
    font-weight: 800;
    letter-spacing: 2px;
    color: var(--darkSage);
}
@media (min-width: 768px) {
    h1 {
        font-size: 1rem;
        letter-spacing: 4px;
    }
}
h2 {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-size: 1.5rem;
    font-weight: 300;
    letter-spacing: 3px;
    color: var(--darkSage);
}
@media (min-width: 768px) {
    h2 {
        font-size: 2.25rem;
        letter-spacing: 6px;
    }  
}
    h3 {
        text-transform: uppercase;
        font-size: 1rem;
        letter-spacing: 4px;
        font-weight: 800;
        color: var(--darkSage);
    }
#headerWrapper {
    position: scroll;
    background-color: var(--fuzzyWuzzy);
    padding-top: 15px;
    padding-bottom: 5px;
}
@media (min-width: 768px) {
    #headerWrapper {
        position: fixed;
        top: 0px;
        z-index: 500;
        padding-top: 25px;
    padding-bottom: 25px;
    }
}
#logo {
    filter: saturate(0) brightness(3) contrast(3);
    -webkit-transition: all .425s linear;
-moz-transition: all .425s linear;
-ms-transition: all .425s linear;
-o-transition: all .425s linear;
transition: all .425s linear;
}
#logo:hover {
    filter: saturate(1);
}
#mainNav a:link, #mainNav a:visited {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.125rem;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--offWhite);
}
#mainNav a:hover {
    color: var(--sage);
}
.navbar-toggler {
    margin-top: -70px;
}
#videoHero {
    margin-top: 0px;
    padding: 0px;
}
@media (min-width: 768px) {
    #videoHero {
       margin-top: 70px;
    }
}
#content {
    padding-top: 75px;
    padding-bottom: 75px;
}
#content.intro {
    text-align: center;
}
#content.intro p {
    font-family: 'Montserrat', sans-serif;
    font-size: .975rem;
    font-weight: 300;
    color: var(--darkGrey);
    margin-left: 25px;
    margin-right: 25px;
}
@media (min-width: 768px) {
    #content.intro p {
        font-size: 1.125rem;
       margin-left: 150px;
        margin-right: 150px;
    }
}
#content.interior {
    margin-top: 0px;
}
@media (min-width: 768px) {
    #content.interior {
        margin-top: 90px;
    }
}
#content.interior p {
    font-family: 'Montserrat', sans-serif;
    font-size: .975rem;
    font-weight: 300;
    color: var(--darkGrey);
}
@media (min-width: 768px) {
    #content.interior p {
        font-size: 1.125rem;
    }
}
#content.interior ul {
    font-family: 'Montserrat', sans-serif;
    font-size: .975rem;
    font-weight: 300;
    color: var(--darkGrey);
    margin-bottom: 0px;
}
@media (min-width: 768px) {
    #content.interior ul {
        font-size: 1.125rem;
        margin-bottom: initial;
    }
}
#content.interior a:link, #content.interior a:visited {
    color: var(--lightSage);
    text-decoration: none;
}
#content.interior a:hover {
    color: var(--fuzzyWuzzy);
    text-decoration: underline;
}
#content a:link.btn, #content a:visited.btn {
    color: var(--fuzzyWuzzy);
    border-color: var(--fuzzyWuzzy);
    background-color: transparent;
    border-radius: 0px;
    text-transform: uppercase;
    width: 100%;
    -webkit-transition: all .425s linear;
-moz-transition: all .425s linear;
-ms-transition: all .425s linear;
-o-transition: all .425s linear;
transition: all .425s linear;
}
#content a:hover.btn {
    color: var(--offWhite);
    background-color: var(--fuzzyWuzzy);
    text-decoration: none;
}
#content .bi-bookmark {
    color: var(--lightSage);
}
#family {
    padding: 0px;
    overflow: hidden;
    background-color: var(--sand);
}
#family .col-md-5 {
    background-image: url(../images/KristineSue.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 350px;
}
@media (min-width: 768px) {
    #family .col-md-5 {
        height: initial;   
    } 
}
#family .col-md-7 {
    padding-left: 14%;
    padding-right: 14%;
    padding-top: 75px;
    padding-bottom: 70px;
}
@media (min-width: 768px) {
    #family .col-md-7 {
        padding-top: 150px;
        padding-bottom: 90px;
    } 
}
#family p {
    font-family: 'Montserrat', sans-serif;
    font-size: .95rem;
    font-weight: 300;
    color: var(--darkGrey);
}
@media (min-width: 768px) {
    #family p {
        font-family: 'Montserrat', sans-serif;
        font-size: 1rem;
        color: var(--darkGrey);
    }  
}
#family p.handwritten {
    font-family: 'Whisper', cursive;
    font-size: 2.35rem;
    color: var(--darkSage);
    line-height: 90%;
    -moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
-o-transform: rotate(-2deg);
-ms-transform: rotate(-2deg);
transform: rotate(-2deg);
}
@media (min-width: 768px) {
    #family p.handwritten {
        font-size: 3.125rem;
    }   
}
#family p.handwritten span {
    display: block;
}
#family .btn {
    color: var(--fuzzyWuzzy);
    border-color: var(--fuzzyWuzzy);
    background-color: transparent;
    border-radius: 0px;
    text-transform: uppercase;
    -webkit-transition: all .425s linear;
-moz-transition: all .425s linear;
-ms-transition: all .425s linear;
-o-transition: all .425s linear;
transition: all .425s linear;
}
#family .btn:hover {
    color: var(--offWhite);
    background-color: var(--fuzzyWuzzy);
}
#cta {
    text-align: center;
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: var(--fuzzyWuzzy);
    color: var(--offWhite);
}
#cta h3 {
    color: var(--offWhite);
}
#cta p.talk {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-size: 2.75rem;
    font-weight: 300;
    letter-spacing: 8px;
    margin-top: -10px;
}
@media (min-width: 768px) {
    #cta p.talk {
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
        font-size: 3rem;
        letter-spacing: 10px;
        margin-top: -10px;
    } 
}
#cta p.handwritten {
    font-family: 'Whisper', cursive;
    font-size: 1.75rem;
    line-height: 90%;
    -moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
-o-transform: rotate(-2deg);
-ms-transform: rotate(-2deg);
transform: rotate(-2deg);
}
@media (min-width: 768px) {
    #cta p.handwritten {
        font-size: 2rem;
    }
}
#cta a:link, #cta a:visited {
    text-decoration: none;
    color: var(--offWhite);
    font-family: 'Montserrat', sans-serif;
    font-size: .975rem;
    font-weight: 700;
    letter-spacing: 3px;
    display: block;
    margin-top: -15px;
}
@media (min-width: 768px) {
    #cta a:link, #cta a:visited {
        font-size: 1.25rem;
        margin-top: -20px;
    } 
}
#cta a:hover {
    opacity: .5;
}
#communities {
    text-align: center;
    padding-top: 90px;
    padding-bottom: 90px;
}
#communities h3 {
    color: var(--darkSage);
}
#communities p {
    font-family: 'Montserrat', sans-serif;
    font-size: .975rem;
    font-weight: 300;
    color: var(--darkGrey);
    margin-left: 25px;
    margin-right: 25px;
}
@media (min-width: 768px) {
    #communities p {
        font-size: 1.125rem;
       margin-left: 75px;
        margin-right: 75px;
    }
}
#communities .btn {
    color: var(--fuzzyWuzzy);
    border-color: var(--fuzzyWuzzy);
    background-color: transparent;
    border-radius: 0px;
    text-transform: uppercase;
    -webkit-transition: all .425s linear;
-moz-transition: all .425s linear;
-ms-transition: all .425s linear;
-o-transition: all .425s linear;
transition: all .425s linear;
}
#communities .btn:hover {
    color: var(--offWhite);
    background-color: var(--fuzzyWuzzy);
}
#logos {
    background-color: var(--sand);
    text-align: center;
    padding-top: 50px;
    padding-bottom: 50px;
}
#logos img {
    margin-top: 10px;
    margin-bottom: 10px;
    opacity: 1;
        -webkit-transition: all .425s linear;
-moz-transition: all .425s linear;
-ms-transition: all .425s linear;
-o-transition: all .425s linear;
transition: all .425s linear;

}
#logos img:hover {
    opacity: .5;
}
#map {
    padding: 0px;
    max-height: 520px;
    overflow: hidden;
}
#footer {
    background-color: var(--grey);
    color: var(--offWhite);
    text-align: center;
    padding-top: 35px;
    padding-bottom: 35px;
}
#footer p:nth-child(2) {
    font-family: 'Montserrat', sans-serif;
    font-size: .95rem;
}

#footer p:nth-child(n+3) {
    font-size: .85rem;
}

#footer a:link, #footer a:visited {
    text-decoration: none;
    color: var(--offWhite);
}
#footer a:hover {
    opacity: .5;
}
#footer a:link.btn, #footer a:visited.btn {
    text-decoration: none;
    border-color: var(--offWhite);
    color: var(--offWhite);
    border-radius: 0px;

}
#footer a:hover.btn {
    opacity: .5;
}
.line {
    display: block;
    width: 150px;
    height: 5px;
    background-color: var(--lightSage);
    margin-top: 25px;
    margin-bottom: 25px;
}