html{
    box-sizing: border-box;
    padding: 0;
    scroll-behavior: smooth;
}

*, *::before, *::after{
    margin: 0;
    padding: 0;
    box-sizing: inherit;
}

/* UTILITY */

.primary {
    color: #0C2141;
}

.secondary {
    color: #D69C27;
}

.accent{
    color: #46AFF9;
}

.light{
    color: #E6E8E6;
}

.flex{
    display: flex;
}

.row, .mobile-row{
    flex-direction: row;
}

.col{
    flex-direction: column;
}

.xl{
    font-size: 70px;
}

.large{
    font-size: 60px;
}

.med-large{
    font-size: 50px;
}

.medium{
    font-size: 35px;
}

.med-small{
    font-size: 25px;
}

.small{
    font-size: 18px;
}

.center{
    text-align: center;
}

.ul{
    text-decoration: underline;
}

.highlight {
    background: #FFFF00;
}

.extralight-wt{
    font-weight: 200;
}

.light-wt{
    font-weight: 300;
}

.reg-wt{
    font-weight: 400;
}

.med-bold{
    font-weight: 500;
}

.semi-bold{
    font-weight: 600;
}

.bold{
    font-weight: 700;
}

.extrabold{
    font-weight: 800;
}

.box-shadow{
    box-shadow: 2px 2px 10px rgba(19, 27, 29, 0.4);
}

.bs-inset{
    box-shadow: 0 5px 12px inset rgba(19, 27, 29, .8);
}

.gap{
    gap: 1rem;
}

.gap-2{
    gap: 2rem;
}

.start{
    margin-top: 0;
}

.mt-2{
    margin-top: 2rem;
}

.mt-4{
    margin-top: 4rem;
}

.mb-2{
    margin-bottom: 1.5rem;
}

.mb-0{
    margin-bottom: 0;
}

.mb-4{
    margin-bottom: 4rem;
}

.m-auto{
    margin: 0 auto !important;
}

.f-center{
    justify-content: center;
}

.align-center{
    align-items: center;
}

.around{
    justify-content: space-around;
}

.self-start {
    align-self: flex-start;
}

.self-center{
    align-self: center;
}

.self-end{
    align-self: flex-end;
}

.between{
    justify-content: space-between;
}

.f-start{
    justify-content: flex-start;
}

.wrap{
    flex-wrap: wrap;
}

.m-display{
    display: none;
}

.w-25{
    width: 25%;
}

.w-50{
    width: 50%;
}

.w-75{
    width: 75%;
}

.w-100{
    width: 100%;
}

.xl-close{
    line-height: 3.6rem;
}

.large-close{
    line-height: 55px;
}

.medlarge-close{
    line-height: 50px;
}

.med-close{
    line-height: 30px;
}

.medsmall-close{
    line-height: 25px;
}

/* END UTILITY STYLES */

/* ANIMATIONS */

@keyframes pulse {
    0% {
        transform: scale(1)
    }

    100% {
        transform: scale(.9);
        box-shadow: 1px 2px 2px rgba(0,0,0,.3);
    }
}

.pulse{
    animation: pulse 1s alternate-reverse infinite;
}

@keyframes slideRight{
    0%{
        background-position-x: center, center center;
    }
    100%{
        background-position-x: center, 300px;
    }
}

.slideRight{
    animation: slideRight 30s alternate infinite;
}

@keyframes slide{
    100%{
        opacity: 1;
        left: 0;
    }
}

@keyframes bounce{
    100%{
        opacity: 1;
        top: 0;
    }
}

.bounce{
    position: relative;
    top: -25px;
    opacity: 0;
    animation: bounce .75s alternate infinite ease-in-out;
}

/* END ANIMATIONS */

/* COMPONENT STYLES */

.cta_btn {
    background: #D69C27;
    border: 1px solid #FFA737;
    color: #FFFFFF;
    font-family: gravesend-sans, sans-serif;
    font-weight: 700;
    letter-spacing: 2px;
    padding: 10px;
    min-width: 200px;
    display: block;
    font-size: 16px;
    transition: all .2s ease-in-out;
    letter-spacing: 4px;
}

.cta_btn:hover{
    background: #e97612;
    color: #ffffff;
    cursor: pointer;
    transform: scale(.95);
    box-shadow: 1px 1px 5px #3a3a3a;
    
}

.card{
    width: 338px;
}

.list{
    list-style-type: none;
}

.list li {
    padding: 0;
}
/* END COMPONENT STYLES */

/* FONT STYLES */

.text{
    font-family: nimbus-sans, sans-serif;
}

.heading{
    font-family: gravesend-sans, sans-serif;
}

/* END FONT STYLES */

/* CONTAINER STYLES */

.container{
    max-width: 65%;
    width: 1223px;
    min-width: 1223px;
    margin: 0 auto;
}

.cta-form_container{
    width: 500px;
    padding: 2.5rem;
    background: #FFFFFF;

}

.p2-form_container {
    width: 800px;
    padding: 2.5rem;
    background: #FFFFFF;
}

/* END CONTAINER STYLES */

/* NAV STYLES */

.nav {
    position: relative;
    
    padding: .5rem;
    z-index: 999;
}

.nav_brand  {
    width: 400px;
}

/* END NAV STYLES */

/* BODY STYLES */
body{
    margin: 0;
    padding: 0;
}

/* END BODY STYLES */

/* CTA SECTION STYLES */

.cta_section{
    background: linear-gradient(to right, rgba(255,255,255,.9), rgba(255,255,255,0)), url("../images/background.jpg");
    background-size: cover;
    min-height: 886px;
    padding: 5rem 2rem;
}

.card_img{
    max-width: 400px;
}

/* END CTA SECTION STYLES */

/* FORM STYLES */

#cta-form{
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

input:not([type="checkbox"], [type="radio"]){
    appearance: none;
    padding: .5rem;
    border: 1px solid #8c8c8a;
    font-family: nimbus-sans, sans-serif;
}

.input-block{
    display: flex;
    flex-direction: column;
}

.label{
    font-family: gravesend-sans, sans-serif;
    font-style: normal;
}

div.form-select-block{
    position: relative;
}

div.form-select-block::after{
    content: '';
    width: 0;
    height: 0;
    display: inline-block;
    position: absolute;
    right: 10px;
    top: 17px;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    border-top: 5px solid #2B3D41;
}

.dropdown {
    position: relative;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    font-size: 12px;
    padding: .5rem;
    font-family: nimbus-sans, sans-serif;
    border: 1px solid #8c8c8a;
}

.submit-block{
    margin-top: 1rem;
}

.error {
    font-family: nimbus-sans, sans-serif;
    color: red;
    font-size: 13px;
    top: 55px;
}

.tcpa {
    font-family: nimbus-sans, sans-serif;
    color: #0C2141;
    font-size: 8px;
}

/* END FORM STYLES */

/* SECONDARY SECTION STYLES */

.secondary_section{
    padding: 4rem 2rem;;
    
}

/* END SECONDARY SECTION STYLES */

/* FOOTER STYLES */

.footer{
    background: #272E5C;
    padding: 2rem;
}

.footer a{
    color: #46AFF9;
    text-decoration: none;
}

/* END FOOTER STYLES */


/* LINKOUT PAGE STYLES */

.article_container {
    width: 100%;
    background: #FFFFFF;
}

.article_container:hover .article-thumb_container img.article_img {
    transform: scale(1.1);
}

.article-thumb_container {
    padding: 2rem;
    width: 33.3%;
    height: 100%;
    overflow: hidden;
}

.article_img {
    display: block;
    margin: auto 0;
    width: 100%;
    height: auto;
    transition: all .3s ease-in-out;
}

.article-excerpt_container {
    width: 66.7%;
    padding: 2rem;
}

.article-excerpt_container div ul{
    list-style-type: none;
}

.article-excerpt_container div ul{
    padding-bottom: .75rem;
}

@media screen and (max-width: 1250px){
    .row{
        flex-direction: column;
    }

    .cta_section .row{
        flex-direction: column-reverse;
    }

    .cta_section{
        max-width: 100%;
        padding: 2rem 1rem;
    }

    .cta_section .container{
        justify-content: center;
        align-items: center;
    }

    .article-thumb_container {
        width: 100%;
    }

    .article-excerpt_container {
        text-align: center;
        width: 100%;
    }

    .article-excerpt_container ul{
        text-align: left;
    }

    .article-excerpt_container .cta_btn {
        margin: 0 auto;
    }

    .heading{
        text-align: center;
    }

    .cta_section img{
        margin: 0 auto;
    }

    .nav .container{
        justify-content: center;
        align-items: center;
    }

    .container{
        min-width: 100%;
        padding: 1rem;
    }

    .cta-content_container,
    .cta-form_container, 
    .secondary_section div, 
    .secondary_section img, 
    .container{
        margin: 0 auto;
    }

    .secondary_section .container{
        gap: 1rem;
    }
}

@media screen and (max-width: 824px){
    .large{
        font-size: 40px
    }

    .large-close{
        line-height: 40px;
    }

    .med-large{
        font-size: 30px;
    }

    .medlarge-close{
        line-height: 30px;
    }

    .secondary_section br{
        display: none;
    }

    .p2-form_container{
        width: 100%;
    }
}

@media screen and (max-width: 565px) {
    .secondary_section img{
        width: 100%;
    }

    .cta_section img{
        width: 100%;
    }

    .cta-form_container{
        width: 100%;
    }
    
}

@media screen and (max-width: 414px) {
    .cta-form_container{
        width: 100%;
    }

    .nav_brand{
        width: 250px;
    }
    .container{
        padding: 0;
    }
    .secondary_section{
        padding: 1rem;
    }
    .large{
        font-size: 25px;
    }

    .large-close{
        line-height: 25px;
    }

    .gap-2{
        gap: 1rem;
    }

    .med-small{
        font-size: 18px;
    }

    .med-large{
        font-size: 20px;
    }

    .medium{
        font-size:30px;
        line-height: 30px;
    }

    .medlarge-close{
        line-height: 20px;
    }
}