/*Libre Franklin font */
@import url('https://fonts.googleapis.com/css2?family=Libre+Franklin:ital,wght@0,100;0,200;0,300;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

html {
    position: relative;
    min-height: 100%;
}

body {
    font-family: 'Libre Franklin', sans-serif;
    padding-bottom: 25px;
}

footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 25px;
    background-color: #FFF;
    z-index: 100000;
}

/*Modal Show*/
.modalOpen {
    overflow: hidden;
}

/* Custom Colors */
.text-ot-orange {
    color: #F58231;
}

.text-ot-dkgreen {
    color: #5F773C;
}

.text-ot-ltgreen {
    color: #AEDA82;
}

.text-ot-ltgrey {
    color: #EAEAEB;
    opacity: .4;
}

.text-ot-dkgrey {
    color: #99999A;
}

.bg-ot-orange {
    background-color: #F58231;
}

.bg-ot-green {
    background-color: #7f9f58;
}

.bg-ot-dkgreen {
    background-color: #5f773c;
}

.bg-ot-ltgreen {
    background-color: #AEDA82;
}

.bg-ot-tintgreen {
    background-color: #e9f7db; /*rgba(210,238,182,1)*/
}

.bg-ot-ltgrey {
    background-color: #EAEAEB;
}

.bg-ot-ltgrey-opacity {
    background-color: rgba(234, 234, 235, .4);
}

.bg-ot-dkgrey {
    background-color: #99999A;
}

.bg-ot-gradient-delay-ltgreen {
    background: linear-gradient(0deg, rgba(210,238,182,.5) 0%, #FFF 50%);
}

.bg-ot-gradient-ltgreen {
    background: linear-gradient(0deg, #e9f7db 0%, #FFF 100%);
}

.border-color-dkgrey {
    border-color: #99999A;
}

.svg-ot-ltgreen {
    filter: invert(92%) sepia(19%) saturate(839%) hue-rotate(33deg) brightness(91%) contrast(87%);
}

.filter-ot-ltgreen {
    filter: invert(92%) sepia(14%) saturate(282%) hue-rotate(50deg) brightness(150%) contrast(94%);
}

/* general */
.pageContent {
    margin-top: 70px;
}

.nowrap {
    white-space: nowrap;
}

.fw-75rem {
    font-size: .75rem;
}

.w-30px {
    width: 30px;
}
.w-185px {
    width: 185px;
}
.w-225px {
    width: 225px;
}

.h-100px {
    height: 100px;
}

.h-300px {
    height: 300px;
}

.p-20px {
    padding: 20px;
}

.py-50px {
    padding-top: 50px;
    padding-bottom: 50px;
}

.my-75px {
    margin-top: 75px;
    margin-bottom: 75px;
}

.mw-275px {
    max-width: 275px;
}

.mw-450px {
    max-width: 450px;
}

.fs-18px {
    font-size: 18px;
}

.fs-25px {
    font-size: 25px;
}

.fs-7 {
    font-size: .75rem !important;
}

.text-decoration-none {
    text-decoration: none;
}

textarea.noresize {
    resize: none;
}

input, textarea {
    border: none;
    height: 32px;
    padding-left: 7px;
    padding-right: 7px;
}

textarea {
    padding-top: 7px;
}

.downArrowRow {
    position: absolute;
    width: 100%;
    bottom: 0px;
    height: 0px;
    border-bottom: 2px solid #7f9f58;
    z-index: 400;
}

.downArrowHolder {
    position: relative;
}

.downArrow {
    position: absolute;
    left: 50%;
    margin-top: -20px;
    margin-left: -20px;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    color: #FFF;
    padding-top: 7px;
}

.iconLogo {
    max-width: 16px;
    max-height: 16px;
}

.scheduleDemo {
    width: fit-content;
    text-decoration: none;
    white-space: nowrap;
}

/* Header & Menu */
header {
    width: 100vw;
    position: fixed;
    z-index: 500;
    top: 0;
}

    header > nav {
        width: 100%;
    }

@media (min-width: 576px) {
    .active-nav-link {
        border-top: 4px solid #AEDA82;
        border-bottom: 4px solid white;
        font-weight: 600;
    }

    .inactive-nav-link {
        border-top: 4px solid white;
        border-bottom: 4px solid white;
    }

        .inactive-nav-link:hover {
            border-top: 4px solid #AEDA82;
        }
}

@media (max-width: 575px) {
    .active-nav-link {
        background-color: #AEDA82;
        font-weight: 700;
    }

    .inactive-nav-link:hover {
        background-color: #e2f7ce;
        transition: .05s;
    }

    .inactive-nav-link:active {
        background-color: #9cd864;
    }
}

/* blocks with image fade to text on the right side */
.sideTextBlock {
    justify-content: end;
    background-position: center;
    background-repeat: no-repeat;
}

    .sideTextBlock:after {
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        width: 75%;
        height: 100%;
    }

@media (max-width: 767px) {
    .sideTextBlock {
        background-image: none;
        justify-content: center;
    }

        .sideTextBlock > .text-center {
            margin-right: 0px;
        }

        .sideTextBlock:after {
            background: linear-gradient(270deg, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 80%);
        }
}

@media (min-width: 768px) {
    .sideTextBlock > .text-center {
        margin-right: 25px;
    }

    .sideTextBlock:after {
        background: linear-gradient(270deg, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 80%);
    }
}

@media (min-width: 1200px) {
    .sideTextBlock > .text-center {
        margin-right: 50px;
    }

    .sideTextBlock:after {
        background: linear-gradient(270deg, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 80%);
    }
}

@media (min-width: 1600px) {
    .sideTextBlock > .text-center {
        margin-right: 100px;
    }

    .sideTextBlock:after {
        background: linear-gradient(270deg, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 80%);
    }
}

/* Statistics */
@media (min-width: 1245px) {
    .mid-stats {
        border-left: solid 1.5px #AEDA82;
        border-right: solid 1.5px #AEDA82;
    }
}

/* Contact Form */
.contactForm {
    z-index: 25;
}

@media (min-width: 499px) {
    .cfInputInfo {
        width: 48%;
        margin: 4px;
    }

    .cfInputMsg {
        width: 98.5%;
        margin: 4px;
    }
}

@media (max-width: 498px) {
    .cfInputInfo {
        width: 98.5%;
        margin: 4px;
    }

    .cfInputMsg {
        width: 98.5%;
        margin: 4px;
    }
}