* {
    font-family: 'Montserrat',sans-serif;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: 1px;
    box-sizing: border-box;
}

/*
*
* Bootstrap format extras
*
*/

.text-right {
    text-align: right!important;
}

.ls-3 {
    letter-spacing: 5px;
}

.lh-2 {
    line-height: 1.3!important;
}

.lh-3 {
    line-height: 1.33!important;
}

.fw-1 {
    font-weight: 300!important;
}

.fw-2 {
    font-weight: 300!important;
}

.fw-3 {
    font-weight: 300!important;
}

.fw-4 {
    font-weight: 400!important;
}

.fw-5 {
    font-weight: 500!important;
}

.fw-6 {
    font-weight: 600!important;
}

.fw-7 {
    font-weight: 700!important;
}

.fw-8 {
    font-weight: 800!important;
}

.fw-9 {
    font-weight: 900!important;
}

.fw-10 {
    font-weight: 1000!important;
}

.pl-6 {
    padding-left: 2rem!important;
}

.py-6 {
    padding-top: 120px!important;
    padding-bottom: 120px!important;
}

.py-7 {
    padding-top: 150px!important;
    padding-bottom: 150px!important;
}

.py-10 {
    padding-top: 170px!important;
    padding-bottom: 170px!important;
}

@media screen and (min-width: 768px) {
    .py-md-6 {
        padding-top: 120px!important;
        padding-bottom: 120px!important;
    }

    .py-md-8 {
        padding-top: 150px!important;
        padding-bottom: 150px!important;
    }

    .py-md-9 {
        padding-top: 175px!important;
        padding-bottom: 175px!important;
    }

    .py-md-10 {
        padding-top: 170px!important;
        padding-bottom: 170px!important;
    }
}

.px-6 {
    padding-right: 3.5rem!important;
    padding-left: 3.5rem!important;
}

.px-7 {
    padding-right: 4rem!important;
    padding-left: 4rem!important;
}

.px-8 {
    padding-right: 4.5rem!important;
    padding-left: 4.5rem!important;
}

.px-9 {
    padding-right: 5rem!important;
    padding-left: 5rem!important;
}

.px-10 {
    padding-right: 5.5rem!important;
    padding-left: 5.5rem!important;
}

@media screen and (min-width: 768px) {
    .px-md-10 {
        padding-right: 10rem!important;
        padding-left: 10rem!important;
    }
}

.pt-100 {
    padding-top: 100px
}
.pb-100 {
    padding-bottom: 100px
}
.pl-100 {
    padding-left: 100px;
}
.pr-100 {
    padding-right: 100px;
}
.p-100 {
    padding: 100px;
}
.px-100 {
    padding-left: 100px;
    padding-right: 100px;
}
.py-50 {
    padding-top: 50px;
    padding-bottom: 50px;
}
.py-100 {
    padding-top: 100px;
    padding-bottom: 100px;
}
.pb-60 {
    padding-bottom: 60px
}
.mt-100 {
    margin-top: 100px;
}
.mb-100 {
    margin-bottom: 100px;
}

.fs-6 {
    font-size: 1.15rem!important;
}

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

.fs-8 {
    font-size: 0.8rem!important;
}

.fs-9 {
    font-size: 0.7rem!important;
}

@media screen and (min-width: 768px) {
    .fs-md-5 {
        font-size: 1.3rem!important;
    }

    .fs-md-6 {
        font-size: 1rem!important;
    }

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

    .px-lg-10 {
        padding-right: 5.5rem!important;
        padding-left: 5.5rem!important;
    }

    .pt-md-100 {
        padding-top: 100px;
    }

    .pb-md-100 {
        padding-bottom: 100px;
    }

    .px-md-100 {
        padding-left: 100px;
        padding-right: 100px;
    }

    .py-md-150 {
        padding-top: 150px;
        padding-bottom: 150px;
    }
}

.display-7 {
    font-size: 2rem!important;
    font-weight: 400;
    line-height: 1.4;
}

.display-8 {
    font-size: 1.7rem!important;
    font-weight: 400;
    line-height: 1.3;
}

.display-9 {
    font-size: 1.1rem!important;
    font-weight: 400;
    line-height: 1.2;
}

.display-lg {
    font-size: 40px !important;
}

.display-xlg {
    font-size: 60px !important;
}

.display-lg sup {
    font-size: 40%;
    top: -1.5em;
}

sup {
    font-size: 50%;
    top: -1em;
}

@media screen and (min-width: 576px) {
    .display-sm-6 {
        font-size: calc(1.375rem + 1.5vw);
        font-weight: 400;
        line-height: 1.2;
    }
}

.bg-orange {
    background-color: #ff7228!important;
}

.green {
    background: #00a159;
    background: linear-gradient(45deg, rgba(126,172,0,1) 0%, rgba(144,196,1,1) 100%);
}

.gradient {
    background: rgb(254,254,254);
    background: linear-gradient(45deg, rgba(200,200,200,1) 0%, rgba(149,156,161,1) 50%, rgba(127,123,116,1) 100%);
}

.gray {
    background: rgb(167,163,174);
    background: linear-gradient(45deg, rgba(167,163,174,1) 0%, rgba(123,129,129,1) 100%);
}

.trees-bg {
    background-image: url("///img.oathlifesystems.com/trees-bg.webp");
    background-size: cover;
    background-repeat: none;
    background-position: top;
    background-color: rgba(0,0,0,0.5);
}

.videos {
    background-image: url("///img.oathlifesystems.com/video-bg.webp");
    background-size: cover;
    background-repeat: none;
    background-attachment: fixed;
    background-position: center;
    background-color: rgba(0,0,0,0.5);
}

.custom-border {
    border: solid 4px #8f8a9b;
}

.link-orange {
    color: #ff7228!important;
}

.text-justify {
    text-align: justify !important;
}

@media screen and (min-width: 768px) {
    .text-md-justify {
        text-align: justify!important;
    }
    .text-md-left {
        text-align: left!important;
    }
}

h1,h2,h3,h4,h5,h6 {
    font-weight: 400!important;
}

/*
*
* Main CSS
*
*/

.navbar-custom {
    background: url('///img.oathlifesystems.com/nav-bg.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.navbar-custom .navbar-toggler {
    box-shadow: none;
}

.fixed-top {
    position: fixed!important;
}

@media (min-width: 768px) {
    .fixed-top {
        position: relative!important;
        top: auto;
    }
    .navbar-collapse {
        max-height: none;
    }
    body {
        margin: 0;
    }
}

.navbar-brand img {
    width: 40px;
    margin-left: 50px;
    height: auto;
}

nav a.nav-link {
    color: #fff !important;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 15px;
    letter-spacing: 3px;
    margin-left: 25px;
    margin-top: 3px;
}

nav a.nav-link:hover, nav a.nav-link:visited:hover {
    color: #312e1f !important;
}

nav a.nav-link:visited {
    color: #fff !important;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 14px;
    letter-spacing: 3px;
    margin-left: 25px;
}

@media (min-width: 992px) and (max-width: 1067px) {
    nav a.nav-link.nav-hide {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    .navbar-collapse .nav-button {
        padding-top: 15px;
    }
}

a.basic, a.basic:visited, a.basic:hover {
    color: inherit;
    text-decoration: none;
}

.mini-hr {
    width: 50px;
}

.call {
    box-shadow: inset 0 0 0 2px #fff;
}

@media screen and (max-width: 768px) {
    .call {
        box-shadow: inset 0 0 0 2px #fff;
        text-align: center;
    }    
}

.home-headline {
    font-weight: 500;
    line-height:1.4;
    font-size: 1.2rem;
}

.home-headline a {
    color: black;
    text-decoration: none;
}

.rounded {
    border-radius: 25px;
}

.shadow {
    box-shadow: #000000fa 0 0 15px;
}

.top {
    background: url('///img.oathlifesystems.com/hero-back.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

a.intro:link, a.intro:visited, a.intro:focus {
    text-decoration: none;
    background-color: #ece9daad;
}

a.intro:hover {
    text-decoration: underline;
    background-color: transparent;
}

.icon-heart {
    color: red;
}

.top-left img {
    height: 275px;
}

.top-right img {
    height: 471px;
}

.btn-starry, .btn-starry:visited {
    background-image: url('///img.oathlifesystems.com/starry_microbes-animated-short_loop.gif');
    background-position: center;
    background-size: cover;
    border: 1px solid #fff;
    border-radius: 4px;
    box-shadow: 0px 3px 7px 1px #00000075;
    color: #fff;
    outline: 0;
    width: fit-content;
}

.btn-starry:hover, .btn-starry:focus {
    opacity: 85%;
    color: #fff;
}

.shopify-buy__btn {
    background-image: url('///img.oathlifesystems.com/starry_microbes-animated-short_loop.gif');
    background-position: center;
    background-size: cover;
    border: 1px solid #fff;
    border-radius: 4px;
    box-shadow: 0px 3px 7px 1px #00000075;
    color: #fff;
    outline: 0;
    width: fit-content;
    padding: 10px 30px;
    text-transform: uppercase;
}

.shopify-buy__btn:hover, .shopify-buy__btn:focus {
    opacity: 85%;
    color: #fff;
}

.shopify-buy__option-select-wrapper, .shopify-buy__option-select__select, .shopify-buy__select-icon {
    display: none;
}

.btn-white, .btn-white:visited {
    border: 1px solid #ffffff94;
    background: transparent;
    letter-spacing: 3px;
    text-transform: uppercase;
    text-decoration: none;
    color: #fff;
    width: fit-content;
    outline: 0;
}

.btn-white:hover, .btn-white:focus {
    background-image: url('///img.oathlifesystems.com/starry_microbes-animated-short_loop.gif');
    background-position: center;
    color: #fff;
}

.btn-white2 {
    background-image: url('///img.oathlifesystems.com/starry_microbes-animated-short_loop.gif');
    background-position: center;
}

.btn-white2:hover {
    opacity: 80%;
    color: #fff;
}

.btn-main {
    font-size: 1rem;
    padding: .7rem 1.2rem!important;
}

.btn.active {
    background-image: url('///img.oathlifesystems.com/starry_microbes-animated-short_loop.gif');
    background-position: center;
    background-size: cover;
    color: #fff;
}

.empower {
    background: url('///img.oathlifesystems.com/sister-bg.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size:cover;
}

.img-tree {
    height: 92px
}

.img-kiss {
    height: 158px;
}

.img-leaf {
    max-height: 300px;
}

@media screen and (max-width: 768px) {
    .img-leaf {
        max-height: 150px;
    }
}

ul.list-basic {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

table.arborist tr {
    border-color: #ffffff59;
}

.helpful-card a {
    text-decoration: none;
}

.footer {
    background: url('///img.oathlifesystems.com/nav-bg.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.footer a:link, .footer a:visited {
    text-decoration: none;
    color: #fff;
}

.support a:hover {
    text-decoration: underline;
}

.top-all {
    padding-top: 125px!important;
    padding-bottom: 50px!important;
}

.top-decks {
    padding-top: 125px!important;
    padding-bottom: 0px!important;
}

.top-review-carousel {
    padding-top: 50px!important;
    padding-bottom: 75px!important;
}

@media screen and (min-width: 768px) {
    .top-all {
        padding-top: 250px!important;
        padding-bottom: 250px!important;
    }
    .top-review-carousel {
        padding-top: 125px!important;
        padding-bottom: 175px!important;
    }
}

.top-oath-life-system {
    background: url('///img.oathlifesystems.com/grassy_field3.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 275px!important;
    padding-bottom: 275px!important;
}

.top-our-part {
    background: url('///img.oathlifesystems.com/topforest.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.top-about {
    background: url('///img.oathlifesystems.com/about.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.bar {
    background: url('///img.oathlifesystems.com/nav-bg.jpg');
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
}

.bar img {
    max-height: 85px;
    width: auto;
}

h6 {
    letter-spacing: 3px;
}

.soil-boxes {
    background: url('///img.oathlifesystems.com/content-bg.jpg');
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
}

.soil-boxes .card {
    background: #fffffff0;
    border: 0;
}

a.read-more {
    text-decoration: none;
    color: #fff;
    letter-spacing: 1px;
    font-size: 12px;
    text-transform: uppercase;
    background: transparent;
    padding: 10px 20px;
    text-align: center;
    border: 1px solid #fff;
}

a.read-more:visited {
    text-decoration: none;
    color: #fff;
    letter-spacing: 1px;
    text-transform: uppercase;
    background: transparent;
    text-align: center;
    border: 1px solid #fff;
}

a.read-more:hover {
    text-decoration: none;
    color: #fff;
    background-image: url('///img.oathlifesystems.com/starry_microbes-animated-short_loop.gif');
    background-position: center;
    letter-spacing: 1px;
    text-transform: uppercase;
    text-align: center;
    border: 1px solid #fff;
}

.featured {
    background: rgb(57,61,78);
    background: linear-gradient(180deg, rgba(57,61,78,1) 0%, rgba(58,62,79,1) 34%, rgba(69,78,97,0.8365721288515406) 100%);
}

img.osl {
    width: 275px;
    height: auto;
}

@media screen and (min-width: 768px) {
    img.osl {
        width: 475px;
        height: auto;
    }
}

.soil-text {
    min-height: 80px;
}

.reviews {
    background-image: radial-gradient(circle at top right, #ece9d8d1, white, #242333b0);
}

.carousel-item {
    height: 23rem;
}

@media (min-width: 768px) {
    .carousel-item {
        height: 18rem;
    }
}

.verified-buyer {
    height: 1rem;
}

.buy-text {
    font-size: 50px;
    color: #000;
    letter-spacing: 3px;
    text-transform: uppercase;
}

/* Using transitions only on desktop to avoid the navbar toggler CLS issue */
@media (min-width: 768px) {
    .slide-in-right {
        -webkit-animation: slide-in-right 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;
                animation: slide-in-right 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;
    }
    @-webkit-keyframes slide-in-right {
        0% {
        -webkit-transform: translateX(30px);
                transform: translateX(30px);
        opacity: 0;
        }
        100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
        }
    }
    @keyframes slide-in-right {
        0% {
        -webkit-transform: translateX(30px);
                transform: translateX(30px);
        opacity: 0;
        }
        100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
        }
    }

    .slide-in-left {
        -webkit-animation: slide-in-left 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;
                animation: slide-in-left 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) ;
    }

    @-webkit-keyframes slide-in-left {
        0% {
        -webkit-transform: translateX(-30px);
                transform: translateX(-30px);
        opacity: 0;
        }
        100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
        }
    }
    @keyframes slide-in-left {
        0% {
        -webkit-transform: translateX(-30px);
                transform: translateX(-30px);
        opacity: 0;
        }
        100% {
        -webkit-transform: translateX(0);
                transform: translateX(0);
        opacity: 1;
        }
    }
}

a.text-links:link, a.text-links:visited, a.text-links:focus {
    color: #2c3034;
    padding: 0 5px;
}

a.text-links:hover {
    text-decoration: underline;
    background-color: transparent;
}

.overlay {
    background: #00000078;
}

.how {
    background: url('///img.oathlifesystems.com/how.jpg');
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    background-attachment: fixed;
}

.graph img.icon {
    width: 115px;
}

.graph ul {
    list-style-position: inside;
}

.how-it-works .btn-white {
    min-width: 100%;
    text-align: center;
}

#plant ol {
    list-style-position: inside;
    padding-left: 0;
}

img.climate-facts {
    width: 300px;
}

img.climate-facts-solution {
    width: 600px;
}

@media screen and (min-height: 600px) {
     .arborist-main {
        min-height: 500px;
    }
}

img.ots-arborist {
    width: 400px;
    padding-bottom: 300px;
}

.deck-image {
    width: 300px;
}

.connection {
    background: url('///img.oathlifesystems.com/connection.jpg');
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    background-attachment: fixed;
}

.arborist-body .card {
    background-color: #ffffffad;
    border-color: #eeebdb7d;
}

.list-arborist .list-group-item {
    background-color: transparent;
    border-bottom: 1px solid #ffffff38;
    border-radius: 0;
    color: #fff;
}

img.application {
    max-height: 240px;
}

img.hero {
    max-height: 275px;
}

.landing-titles {
    letter-spacing: 1px;
}

.landing-icons {
    width: 100px;
    height: auto;
}

.landing-btn {
    background: #fff;
    padding: 10px 25px;
}

a.landing-btn {
    text-decoration: none;
    color: #000;
    text-transform: uppercase;
    font-weight: 600;
}

.about-body {
    background: url('///img.oathlifesystems.com/hero-back.jpg');
    background-position: center;
}

textarea#message.form-control {
    height: 100px!important;
}

#referralForm textarea {
    height: 150px!important;
}

.contact picture {
    max-height: 446px;
}

@media screen and (max-width: 768px) {
    .store h5:first-child {
        padding-left: 35px;
    }
}

.store .carousel {
    height: 600px;
}

.store .carousel-inner {
    height: 525px;
}

.store .carousel-inner img {
    height: 471px;
}

.store .carousel {
    position: relative;
}

.store .carousel-indicators {
    position: absolute;
    top: 480px;
    height: 105px;
    margin: 0;
}

.store .carousel-indicators li {
    text-indent: 0;
    display: inherit;
    float: left;
    border: 0!important;
    width: inherit!important;
    height: 0px!important;
    opacity: 0.8!important;
}

.store .carousel-indicators li img {
    height: 75px;
    border: 2px solid #ccc;
    padding: 2px;
    margin: 0 auto;
}

.store .carousel-indicators .active img {
    border: 2px solid #4a2f28;
}

@media (min-width: 768px) {
    .store .modal img {
        height: 90vh;
    }
}

.back-to-top {
    padding: 10px; 
    text-align: center; 
    background: #ffffff87;
    position: fixed;
    bottom: 30px;
    right: 30px;
    display: none;
    border: 1px solid #7a7a7a61;
}
   
.back-to-top:hover {
    background: #ffffffcc;
}

.back-to-top img {
    width: 30px;
}

/* Styling for Map, panel, and Autocomplete search bar */
#location-map {
    height:100%;
    width: 100%;
}

#store-locator {
    height: 600px;
}

#store-locator .card {
    height: 150px;
    white-space: nowrap;
    text-align: center;
    margin: 1em 0;
}

#store-locator .helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

#store-locator .card img {
    vertical-align: middle;
    max-height: 150px;
}

#panel {
    height: 500px;
    width: 300px;
    float: left;
    margin-right: 10px;
}
  
#panel .feature-filter label {
    width: 130px;
}

#pac-card {
    background-color: #ffffffc7;
    border-radius: 2px 0 0 2px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    box-sizing: border-box;
    font-family: Roboto;
    margin: 10px 10px 0 0;
    -moz-box-sizing: border-box;
    outline: none;
}

#pac-container {
    padding-top: 12px;
    padding-bottom: 12px;
    margin-right: 12px;
}

#pac-input {
    background-color: #fff;
    font-family: Roboto;
    font-size: 15px;
    font-weight: 300;
    margin-left: 12px;
    padding: 0 11px 0 13px;
    text-overflow: ellipsis;
    border: 1px solid #81898b;
    width: 94%;
}

#pac-input:focus {
    border-color: #4d90fe;
}

#title {
    color: #fff;
    background-color: #81898b;
    font-size: 18px;
    font-weight: 400;
    padding: 6px 12px;
}

.hidden {
    display: none;
}

#panel {
    height: 100%;
    background-color: white;
    position: absolute;
    z-index: 1;
    overflow-x: hidden;
    transition: all .2s ease-out;
}

#panel .list-group-item {
    cursor: pointer;
}

.open {
    width: 250px;
}

.place {
    font-size: 1.4em;
    font-weight: 500;
    margin-block-end: 0px;
    padding-left: 18px;
    padding-right: 18px;
}

.addressText {
    font-size: 1em;
    margin-block-start: 0.25em;
    padding-left: 18px;
    padding-right: 18px;
    margin-bottom: 0;
    color: #4c4c4c;
}

.distanceText {
    color: silver;
    font-size: 1em;
    font-weight: 400;
    margin-block-start: 0.25em;
    padding-left: 18px;
    padding-right: 18px;
    margin-bottom: 0;
}

/* helpful crowd */
@media screen and (min-width: 768px) {
    .hc-product-rating {
        max-width: 280px;
    }
}

.hc-widget .hc-icon.hc-icon--lg {
    font-size: 175%!important;
}

/*
 * DOM element rendering detection
 * https://davidwalsh.name/detect-node-insertion
 */
 @keyframes chartjs-render-animation {
	from { opacity: 0.99; }
	to { opacity: 1; }
}

.chartjs-render-monitor {
	animation: chartjs-render-animation 0.001s;
}

/*
 * DOM element resizing detection
 * https://github.com/marcj/css-element-queries
 */
.chartjs-size-monitor,
.chartjs-size-monitor-expand,
.chartjs-size-monitor-shrink {
	position: absolute;
	direction: ltr;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	overflow: hidden;
	pointer-events: none;
	visibility: hidden;
	z-index: -1;
}

.chartjs-size-monitor-expand > div {
	position: absolute;
	width: 1000000px;
	height: 1000000px;
	left: 0;
	top: 0;
}

.chartjs-size-monitor-shrink > div {
	position: absolute;
	width: 200%;
	height: 200%;
	left: 0;
	top: 0;
}