/*
Theme Name:     Hello-elementor-child
Theme URI:      
Description:    Hello-elementor child theme.
Author:         Me
Author URI:     
Template:       hello-elementor
Version:        0.1.0
*/


:root {
    --red: #CA0014;
    --dark-red: #64000A;
    --padding-xl: 150px;
    --padding-lg: 80px;
    --padding-md: 60px;
}
@media (max-width: 1024px) {
    :root {
        --padding-xl: 70px;
        --padding-lg: 40px;
        --padding-md: 30px;
    }
}
@media (max-width: 767px) {
    :root {

    }
}


/** Layout */
.section-lg {
    /* max-width: 1512px !important; */
    padding-left: 80px !important;
    padding-right: 80px !important;
}
.padding-left-xl {
    padding-left: var(--padding-xl) !important;
}
.padding-right-xl {
    padding-right: var(--padding-xl) !important;
}
.padding-left-lg {
    padding-left: var(--padding-lg) !important;
}
.padding-right-lg {
    padding-right: var(--padding-lg) !important;
}
.padding-left-md {
    padding-left: var(--padding-md) !important;
}
.padding-right-md {
    padding-right: var(--padding-md) !important;
}
@media (max-width: 1024px) {
    .section-lg {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }
}
@media (max-width: 767px) {
    .section-lg {
        padding-left: 22px !important;
        padding-right: 22px !important;
    }
}





/** Padding */
/* XL */
.padding-y-xl {
    padding-top: var(--padding-xl) !important;
    padding-bottom: var(--padding-xl) !important;
}
.padding-top-xl {
    padding-top: var(--padding-xl) !important;
}
.padding-btm-xl {
    padding-bottom: var(--padding-xl) !important;
}
/* LG */
.padding-y-lg {
    padding-top: var(--padding-lg) !important;
    padding-bottom: var(--padding-lg) !important;
}
.padding-top-lg {
    padding-top: var(--padding-lg) !important;
}
.padding-btm-lg {
    padding-bottom: var(--padding-lg) !important;
}
/* MD */
.padding-y-md {
    padding-top: var(--padding-md) !important;
    padding-bottom: var(--padding-md) !important;
}
.padding-top-md {
    padding-top: var(--padding-md) !important;
}
.padding-btm-md {
    padding-bottom: var(--padding-md) !important;
}



/* .padding-top-to-header {
    padding-top: 232px !important;
} */
.padding-btm-to-footer { /* go on last section to ad space on footer */
    padding-bottom: 120px !important;
}






/** Buttons */
.elementor-button-red-18 a,
.elementor-button-red-18 button,
.elementor-button-red-18 input[type="submit"],
.elementor-button-red-20 a,
.elementor-button-red-20 button,
.elementor-button-red-20 input[type="submit"],
.elementor-button-dark-red-18 a,
.elementor-button-dark-red-18 button,
.elementor-button-dark-red-18 input[type="submit"],
.elementor-button-dark-red-20 a,
.elementor-button-dark-red-20 button,
.elementor-button-dark-red-20 input[type="submit"] {
    padding: 23px 27px 23px 27px !important;
    color: white !important;
}


.elementor-button-red-18 a,
.elementor-button-red-18 button,
.elementor-button-red-18 input[type="submit"] {
    font-size: 18px !important;
    background-color: var(--red) !important;
}
.elementor-button-red-20 a,
.elementor-button-red-20 button,
.elementor-button-red-20 input[type="submit"] {
    font-size: 20px !important;
    background-color: var(--red) !important;
}
.elementor-button-red-18 a:hover,
.elementor-button-red-18 button:hover, 
.elementor-button-red-18 input[type="submit"]:hover, 
.elementor-button-red-20 a:hover,
.elementor-button-red-20 button:hover,
.elementor-button-red-20 input[type="submit"]:hover  {
    background-color: var(--dark-red) !important;
}

.elementor-button-dark-red-18 a,
.elementor-button-dark-red-18 button,
.elementor-button-dark-red-18 input[type="submit"]  {
    font-size: 18px !important;
    background-color: var(--dark-red) !important;
}
.elementor-button-dark-red-20 a,
.elementor-button-dark-red-20 button,
.elementor-button-dark-red-20 input[type="submit"] {
    font-size: 20px !important;
    background-color: var(--dark-red) !important;
}
.elementor-button-dark-red-18 a:hover,
.elementor-button-dark-red-18 button:hover,
.elementor-button-dark-red-18 input[type="submit"]:hover,
.elementor-button-dark-red-20 a:hover,
.elementor-button-dark-red-20 button:hover,
.elementor-button-dark-red-20 input[type="submit"]:hover {
    background-color: var(--red) !important;
}


/** Card + Learn More Link (Used on Tombstone cards and Tombstone Slider Cards) */
.simple-card:hover .red-heavy-link p { /* Card red-heavy-link class */
    color: var(--red) !important;
}

.elementor-element .red-heavy-link a,
.elementor-element .red-heavy-link p {
    color: #860511;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 20px;
    text-decoration: underline 3px;
    text-underline-offset: 3px;
}
.elementor-element .red-heavy-link a:hover,
.elementor-element .red-heavy-link p:hover {
    color: var(--red);
}




/** Left Red Border (Usually for headings) */
.left-border-red {
    border-left: solid 7px var(--red) !important;
    padding-left: 20px !important;
}
.left-border-dark-red {
    border-left: solid 7px #860511 !important;
    padding-left: 10px !important;
}




/** ADA */
.screen-reader-only {
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    white-space: nowrap;
}

a.skip-link:focus {
    display: block;
    background-color: #f1f1f1;
    border: 4px solid red;
    color: #21759b;
    font-weight: 700;
    padding: 15px 23px 14px;
    text-decoration: none;
    text-transform: none;
    clip: unset;
    height: auto;
    width: auto;
    top: 10px;
    left: 10px;
    z-index: 999999999;
}




/** Components */
.twoxtwocard .card-bg {
    filter: grayscale(100%);
}
.twoxtwocard:has(a:hover) .card-bg {
    filter: none;
}


/** Hero */
.elementor-element.hero {
    min-height: 463px;
    padding-top: 138px;
    padding-bottom: 75px;
}
@media (max-width: 1024px) {
    .elementor-element.hero {
        min-height: 360px;
    }
}
@media (max-width: 767px) {
    .elementor-element.hero  {
        min-height: 300px;
    }
}