/*Common CSS*/
#acornclub body {
    padding: 0;
    font-family: 'Open-Sans', sans-serif;
    color: #444;
}
#acornclub h1, #acornclub h2, #acornclub h3, #acornclub h4, #acornclub p, #acornclub a, #acornclub span {
    margin: unset;
}
#acornclub h1, #acornclub h2, #acornclub h3 {
    font-family: 'Nunito', sans-serif;
    font-weight: 800;
}
/*
Bootstrap Overide
#acornclub .container-fluid {
    padding: unset;      
}
*/
/*Common Classes*/
.bg-lightgrey {
    background-color: #f6f8fa;
}
.bg-white {
    background-color: white
}
.img-fluid {
    width: 100%;
    height: auto;
}
.bg-green {
    background-color: #47a447;
}
.bg-gold {
    background-color: #aa7f4b;
}
.white {
    color: #fff;
}
#acornclub {
    padding-left: 0;
    padding-right: 0;
}
#acornclub .red-button {
    font-weight: 700;
    color: white;
    display: flex;
    background-color: #8F023D;
    padding: 1rem 4rem;
    text-transform: uppercase;
    border-radius: 4rem;
}
#acornclub .red-button:hover {
    background-color: #aa7f4b;
}
#acornclub .small-line {
    height: 1px;
    background-color: #444;
    opacity: 0.2;
}
#acornclub .trim-p {
    max-width: 64rem;
    margin: 0 auto;
}
/*FlexBox Common*/
.d-flex {
    display: flex;
}
.flex-row {
    flex-direction: row;
}
.flex-column {
    flex-direction: column;
}
.align-items-center {
    align-items: center;
}
.align-items-end {
    align-items: flex-end;
}
.align-self-center {
    align-self: center;
}
.aligns-self-start {
    align-self: start;
}
.aligns-self-end {
    align-self: flex-end;
}
.text-center {
    text-align: center;
}
.text-underline {
    text-decoration: underline;
}
.justify-content-center {
    justify-content: center;
}
.justify-content-around {
    justify-content: space-around;
}
.justify-content-between {
    justify-content: space-between;
}
.justify-content-end {
    justify-content: flex-end;
}
.justify-content-start {
    justify-content: flex-start;
}
/*Perks Grid*/
.perks-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 1fr 1fr;
}
@media (max-width: 480px) {
    .perks-grid {
        display: grid;
        grid-template-columns: 1fr;
        grid-auto-rows: 1fr;
    }
}
/*Spacing Common*/
.card {
    /*    border-radius: 20px;*/
    overflow: hidden;
    box-shadow: 2px 4px 6px 0px #00000066;
}
.new-banner {
    background: #A97F4F;
    top: 0;
    left: 0;
    transform: rotate(-45deg) translate(-0.55rem, -1.75rem);
    color: white;
    padding: 1.5rem 1.5rem;
    border-radius: 50%;
}
@media (max-width: 1120px) {
    .new-banner h2 {
        font-size: 1.4rem !important;
    }
    .new-banner {
        background: #A97F4F;
        top: 0;
        left: 0;
        transform: rotate(-45deg) translate(-0.55rem, -1.75rem);
        color: white;
        padding: 1.5rem 1.5rem;
        border-radius: 50%;
    }
}
.margin-block-off {
    margin-block-start: 0;
    margin-block-start: 0;
}
.gap-1 {
    grid-gap: 1rem;
}
.gap-2 {
    grid-gap: 2rem;
}
.gap-3 {
    grid-gap: 3rem;
}
.grid-gap-1 {
    grid-gap: 1rem;
}
.grid-gap-2 {
    grid-gap: 2rem;
}
.grid-gap-3 {
    grid-gap: 3rem;
}
.pt-top {
    padding-top: 1rem;
}
.pl-1 {
    padding-left: 1rem;
}
.py-1 {
    padding-left: 1rem;
    padding-right: 1rem;
}
.py-2 {
    padding-left: 2rem;
    padding-right: 2rem;
}
.px-1 {
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.px-2 {
    padding-top: 2rem;
    padding-bottom: 2rem;
}
.px-3 {
    padding-top: 3rem;
    padding-bottom: 3rem;
}
/*Mobile Responsiveness*/
@media (max-width:800px) {
    .m-flex-row {
        flex-direction: row;
    }
    .m-flex-column {
        flex-direction: column;
    }
    .m-text-center {
        text-align: center;
    }
    .m-align-self-center {
        align-self: center;
    }
}
#hero-banner {
    background-color: #8f023d;
}
#hero-banner img {
    width: 100%;
    height: auto;
    margin: 0 auto;
}
#hero-banner2 {
    background-color: #8f023d;
    padding: 4rem 0;
}
#stairsafe {
    padding-left: 0;
    padding-right: 0;
}
#stairsafe .header {
    color: #444;
    font-family: 'Nunito', sans-serif;
}
#stairsafe .sub-header {
    color: #444;
    font-family: 'Nunito', sans-serif;
}
#stairsafe .span {
    font-family: 'Nunito', sans-serif;
}
/*Common Class */
#stairsafe .acorn-primary {
    background-color: #8f023d;
    border-radius: 20px;
}
#stairsafe .acorn-secondary {
    background: #008000;
    border-radius: 20px;
    min-width: 20rem
}
#stairsafe .card {
    background: #FFFFFF;
    /*    border-radius: 2rem;*/
    /*    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);*/
    overflow: hidden;
}
#stairsafe .red-card-title {
    font-family: 'Nunito', sans-serif;
    font-weight: 700;
    background-color: #8f023d;
    color: white;
    margin: 0;
    padding: 2rem 1rem;
}
#stairsafe .card-p {
    background: #FFFFFF;
    /*    border-radius: 2rem;*/
    /*    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);*/
    padding: 2rem;
}
.light {
    font-weight: 300;
}
.medium {
    font-weight: 700;
}
.bold {
    font-weight: 800;
}
.red {
    color: #8f023d;
}
.white {
    color: white;
}
.ml-auto, .mx-auto {
    margin-left: auto;
}
.mb-1 {
    margin-bottom: 1rem;
}
.mb-2 {
    margin-bottom: 2rem;
}
.mr-auto, .mx-auto {
    margin-right: auto;
}
.mx-1 {
    margin: 0 1rem;
}
.ml-2 {
    margin-left: 2rem;
}
.m-2 {
    margin: 2rem;
}
.my-2 {
    margin-bottom: 2rem;
    margin-top: 2rem
}
.mr-2 {
    margin-right: 2rem;
}
.w-20 {
    width: 20%;
}
.w-30 {
    width: 30%;
}
.w-40 {
    width: 40%;
}
.w-50 {
    width: 50%;
}
.w-60 {
    width: 60%;
}
.w-70 {
    width: 70%;
}
@media (max-width: 800px) {
    .w-20 {
        width: 20%;
    }
    .sm-w-30 {
        width: 30%;
    }
    .sm-w-40 {
        width: 40%;
    }
    .sm-w-50 {
        width: 50%;
    }
    .sm-w-60 {
        width: 60%;
    }
    .sm-w-70 {
        width: 70%;
    }
    .sm-w-80 {
        width: 80%;
    }
    .sm-w-90 {
        width: 90%;
    }
    .sm-w-100 {
        width: 100%;
    }
    .sm-align-items-center {
        align-items: center;
    }
}
#stairsafe .mb-0 {
    margin-bottom: 0;
}
#stairsafe .px-1 {
    padding: 1rem 0;
}
#stairsafe .px-2 {
    padding: 2rem 0;
}
#stairsafe .padding-1-2 {
    padding: 1rem 3rem;
}
#stairsafe .padding-2-1 {
    padding: 2rem 3rem;
}
#stairsafe .p-0 {
    padding: 0;
}
#stairsafe .padding-30 {
    padding-left: 35%;
}
#stairsafe .w-50 {
    width: 50%;
}
#stairsafe .w-60 {
    width: 60%;
}
#stairsafe .w-100 {
    width: 100%;
}
#stairsafe .no-decoration {
    text-decoration: unset;
    list-style: none;
}
#stairsafe .grey-divider {
    height: 100%;
    border: 1px solid #d8d8d8;
}
#stairsafe .red-button {
    font-weight: 700;
    color: white;
    display: flex;
    background-color: #8F023D;
    padding: 1rem 4rem;
    text-transform: uppercase;
    border-radius: 4rem;
}
#stairsafe .red-button:hover {
    background-color: #aa7f4b;
}
.black {
    color: black;
}
.position-r {
    position: relative;
}
.position-a {
    position: absolute;
}
/*Hero*/
#hero {
    background-color: #8f023d;
}
#hero img {
    width: 100%;
    height: auto;
    margin: 0 auto;
}
#hero2 {
    background-color: #8f023d;
}
#hero2 img {
    padding: 4rem 0;
}
#design-for-you {
    background-color: #f6f8fa;
    padding: 6rem 0;
}
#stairsafe-detects {
    padding: 6rem 0;
}
#stairsafe-includes {
    background-color: #f6f8fa;
    padding: 8rem 0;
}
#phone2 {
    left: 18%;
    top: 50%;
    height: calc(80% + 5vw);
    transform: translate(-50%, -50%);
}
@media (max-width: 992px) {
    .flex-m-column {
        flex-direction: column;
    }
    .flex-m-row {
        flex-direction: row;
    }
    #stairsafe .w-60 {
        width: unset;
    }
    #stairsafe .padding-30 {
        padding: 1rem 2rem;
    }
    .order-1 {
        order: -1;
    }
    .m-xs-auto {
        margin: 0 auto;
    }
    #stairsafe .padding-1-2 {
        padding: 2rem 6rem;
    }
    .m-text-center {
        text-align: center;
    }
    .m-text-left {
        text-align: left;
    }
    .flex-wrap {
        flex-wrap: wrap;
    }
    .m-j-content-center {
        justify-content: center;
    }
    #stairsafe .m-w-100 {
        width: 100%;
    }
    #stairsafe .m-row {
        flex-direction: row;
    }
    #stairsafe .m-row-reverse {
        flex-direction: row-reverse;
    }
    #stairsafe .for-you-card {
        flex-wrap: wrap-reverse;
    }
    #phone2 {
        left: 50%;
        top: -30%;
        transform: translate(-50%, -50%);
        height: 55%;
    }
    .m-grid-gap {
        grid-gap: 0.6rem;
    }
    #hero-content {
        padding: 4vw 0;
    }
    #design-for-you {
        background-color: #f6f8fa;
        padding: 2rem 0;
    }
    #stairsafe-detects {
        padding: 2rem 0;
    }
    #stairsafe-includes {
        background-color: #f6f8fa;
        padding: 40rem 0 2rem 0;
    }
}