/*===== VIAM CSS

AUTHOR: JCM
DATE CREATED: 05.05.2021
--

COLOR PALETTE:
    Red: #730403
    Gray: #222

FONTS:
    Noto Serif: 400
    Open Sans: 400, 700
======*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif&family=Open+Sans:wght@400;700&display=swap');

html {
    scroll-behavior: smooth;
}
body {
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: 400;
 color: #222;
    background-image: url(https://image.aulrs.oneamericaemailservices.com/lib/fe5215707d6c00747c12/m/1/e2551dd7-b409-455b-ad2b-203b5e1eb806.jpg);
    background-repeat: repeat;
    background-attachment: fixed;
    
}

/*=====SHARED AREA STYLES=====*/
nav {
    background: #fff;
    box-shadow: 0 2px 3px rgb(0,0,0,.5);
}
section {
    background: #fff;
}
strong {
    font-weight: 700;
}
h1 {
    font-family: 'Noto Serif', serif;
    font-weight: 400;
    font-size: 68px;
    color: #fff;
}
h2 {
    font-family: 'Noto Serif', serif;
    font-size: 28px;
    color: #fff;
    position: relative;
    top: -14px;
}
h3 {
    font-family: 'Noto Serif', serif;
    font-size: 30px;
    color: #730403;
    border-bottom: 6px double;
    padding-bottom: 10px;
    margin-bottom: 20px;
    margin-top: 50px
}
p {
    font-size: .95em;
    line-height: 1.5em;
    text-align: left;
}
a, a:visited, a:active {
    color: #333;
}

a:hover {
    text-decoration: none;
 cursor: pointer;
    color: #333;
}
.card {
    background: #fff;
    box-shadow: 2px 3px 6px rgb(0,0,0,.55);
    margin-bottom: 40px;
    min-height: 80px;
    border: 0;
    border-radius: 0;
    overflow: hidden;
}
.card p {
    padding: 20px 15px 0;
}
.card img {
    width: 100%;
}
.anchor {
    display: block;
    padding-top: 60px;
    margin-top: -60px;
}

/*=====NAV AREA STYLES=====*/

nav {
    box-shadow: 2px 3px 6px rgb(0,0,0,.55);
}
.navbar img{
    height: 60px;
}
.navbar a{
    font-weight: 700;
    padding: 5px 10px;
    border: 2px solid #fff;
    margin: 0 5px
}
.navbar a:hover {
    border: 2px solid #730403;
}
.login a, .login a:active, .login a:visited {
    background: #730403;
    border: 2px solid #730403;
    color: #fff;
}
.login a:hover {
    background: #fff;
    border: 2px solid #730403;
    color: #730403;
}

/*=====HERO AREA STYLES=====*/

.hero {
    height: 450px;
    background-image: url(https://image.aulrs.oneamericaemailservices.com/lib/fe5215707d6c00747c12/m/1/9cfd13f6-77b6-4f0a-bcfb-8aab5c3db14f.jpg);
    background-size: cover;
    background-position: center center;
}



/*=====PLAN INFO AREA STYLES=====*/

.planinfo img {
    position: absolute;
    left: 30px;
    width: 180px;
    z-index: 10;
    transform: rotate(-5deg);
    box-shadow: 2px 3px 6px rgb(0,0,0,.55);
}
.planinfo img:hover {
    box-shadow: 2px 3px 10px rgb(0,0,0,.35);
    left: 28px;
}
.planinfo .card {
    position: relative;
    width: 75%;
    padding-left: 100px;
    left: 20%;
    top: 60px;
}
.planinfo .card:hover {
    opacity: 80%;
}
.video {
    padding-top: 100px
}

/*=====QUOTE AREA STYLES=====*/

.quote {
    padding-top: 50px
}
.quote p{
    padding: 30px 20%;
}
.doubleborder {
    height: 30px; 
    background: #730403;
    padding-top: 5px;
    border: 0;
}
hr {
    border-top: 2px solid #fff;
    margin: 5px 0;
}

/*=====EDUCATIONAL TOPICS STYLES=====*/

.education img:hover {
    transform: scale(1.1);
    transition: transform .3s;
}
.education p {
    background: #fff;
    padding-top: 25px;
    z-index: 10;
}
.education img {
    z-index: 1;
}
.education .card p:hover {
    opacity: 75%;
}


/*=====RETIREMENT TOOLS AREA STYLES=====*/
.tools {
    padding-bottom: 50px
}
.tools i {
    color: #fff;
    background: #730403;
    padding: 20px;
    font-size: 40px;
    position: absolute;
}
.tools p {
    position: absolute;
    left: 80px;
    top: 10px;
    overflow: hidden;
}
.tools .card:hover {
    opacity: 75%;
}


/*=====FOOTER AREA STYLES=====*/
footer {
    background: #222;
    padding: 40px 0px;
}

footer .row {
    padding: 0px 20px;
}

footer p, .disclosure {
    color: #fff;
    font-size: 14px;
}

.oa-logo {
    text-align: center;
    width: 100%;
}
.oa-logo img {
    max-width: 250px;
 margin: 30px;
}


/*=====BEGIN SCREEN SIZE < 991px STYLES=====*/
@media (max-width: 991px) {
    
    .navbar img {
        height: 45px;
    }
    .nav-item {
        text-align: right;
        padding: 15px 0;
    }
    .navbar a:hover {
    border: 2px solid #fff;
    }
    .login a, .login a:active, .login a:visited {
        background: #FFF;
        border: 2px solid #fff;
        color: #730403;
    }
    .login a:hover {
        background: #fff;
        border: 2px solid #fff;
        color: #730403;
    }
    h1 {
        text-align: right;
        font-size: 49px;
    }
    h2 {
        text-align: right;
        font-size: 20px
    }
    .hero {
        height: 350px;
    }
    .planinfo {
        height: 300px;
    }
    .anchor {
        display: block;
        padding-top: 250px;
        margin-top: -250px;
    }
}


/*=====BEGIN SCREEN SIZE < 767px STYLES=====*/
@media (max-width: 767px) {

    h1 {
        text-align: right;
        font-size: 34px;
    }
    h2 {
        text-align: right;
        font-size: 14px;
        top: -10px;
    }
    h3 {
        margin-top: 50px;
    }
    .hero {
        height: 250px;
    }
    .planinfo img {
        width: 140px;
        top: 140px
    }
    .planinfo {
        height: 270px;
    }

}



/*======BEGIN OVERLAY WINDOW STYLES=====*/


h5, .close {
    color: #730403;
}

.close:hover {
    color: #222;
    
}