html, body {
    --air-superiority-blue: #6399bbff;
    --antique-white: #ffeeddff;
    --celadon-blue: #457b9dff;
    --champagne-pink: #e6ccbeff;
    --ghost-white: #f8f7ffff;
    --gunmetal: #0d272fff;
    --hookers-green: #496f5dff;
    --imperial-red: #e63946ff;
    --isabelline: #f9f3f0ff;
    --midnight-green-eagle-green: #164350ff;
    --pale-cerulean: #9cbed3ff;
    --prussian-blue: #1d3557ff;
    --that-grey: rgb(243, 245, 248);
    --unbleached-silk: #ffd8beff;
    --dark-text: rgb(73, 80, 87);
    --dark-charcoal: rgb(51, 51, 51);
}

body {
    background-color: var(--that-grey);
    color: var(--dark-charcoal);
}

a {
    color: white;
}

div.external-link-icon > a > i {
    color: var(--dark-charcoal);
}

a:hover {
    color: var(--prussian-blue);
}

a.navbar-brand > span.landing-brand {
    color: var(--midnight-green-eagle-green);
    font-weight: bold;
    font-size: 42px;
}

div.branding-area > a.navbar-brand, div.header > div.container {
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}

.header-content {
    height: 46px;
}

.header {
    padding-top: 20px;
    padding-bottom: 20px;
    box-shadow: none !important;
}


div.landing-signup > div > a > button.landing-signup-btn {
    background-color: var(--midnight-green-eagle-green);
    border-color: var(--gunmetal);
}

div.landing-signup > div > a > button.landing-signup-btn:hover {
    background-color: var(--prussian-blue);
    border-color: var(--gunmetal);
}

div.landing-signup > div.col > a.landing-mobile-sign-in-link {
    font-size: 16px;
    line-height: 40px;
    padding-left: 20px;
    color: var(--ghost-white);
}

.pace .pace-progress, .pace-active > div.pace-activity {
    display: none;
}

ul.navbar-nav.navbar-right li.dropdown.navbar-user {
    margin-right: auto;
    padding-right: 20px;
}


div.branding-area a.navbar-brand img {
    margin-top: 0;
    margin-bottom: 0;
}

.p-l-4-p {
    padding-left: 4% !important;
}

.p-r-4-p {
    padding-right: 4% !important;
}

.p-r-3-p {
    padding-right: 3% !important;
}

.p-r-5-p {
    padding-right: 5% !important;
}

.p-l-6-p {
    padding-left: 6% !important;
}

.p-b-80 {
    padding-bottom: 80px;
}

.dark-bg {
    background-color: var(--gunmetal);
}

.light-bg {
    background-color: var(--that-grey);
}

.white-bg {
    background-color: var(--ghost-white);
}

.shadow-border {
    border: 1px solid rgb(212, 220, 229);
    border-radius: 10px;
}

/* how it works section*/
div.section-content div > h2.content-title {
    color: var(--dark-text);
}

div.section-content div > ul > li {
    color: var(--dark-text);
}

.use-case-wrapper-color {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    width: 100%;
    height: 100%;
    padding: 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    background-image: url("../../img/landing/noise.ab4dcb5783cf.png"), url("../../img/landing/color-background-image.fdc2fe2bee6a.svg");
    background-position: 0 0, 100% 100%;
    background-size: 18.75rem, 87.5rem;
    background-repeat: repeat, no-repeat;
    background-attachment: scroll, fixed
}

.article-card-icons-playback-controls.row {
    margin-left: 0;
    margin-right: 0;
}

/* End how it works*/


.max-width-none {
    max-width: none;
}

.link-pointer {
    cursor: pointer;
}

.header .navbar-nav > li.nav-item > a.landing-sign-in-link.nav-link {
    padding-right: 0;
    font-size: 16px;
}

.header .navbar-nav > li.nav-item > a {
    color: var(--midnight-green-eagle-green);
    font-weight: bold;
}

.header .navbar-nav > li.nav-item > a.nav-link > button {
    background-color: var(--midnight-green-eagle-green);
    font-weight: bold;
}

.header .navbar-nav > li.nav-item > a.landing-sign-in-link.nav-link:hover {
    color: var(--gunmetal)
}

.header .navbar-nav > li.nav-item > a.landing-sign-in-link.nav-link:visited {
    color: var(--prussian-blue);
}

div.container ul.nav.navbar-nav.navbar-start {
    margin-right: auto;
}

div.container ul.nav.navbar-nav {
    flex-direction: row;
}

/* Navbar signup link */

.page-header-fixed {
    padding-top: 0;
}

/* Top of Fold */
.main-content, .main-content-container, .landing-visual {
    padding-top: 45px;
    /*background-size: 100%;*/
    /*background-size: auto;*/
    background-size: contain;
    background-repeat: no-repeat;
}

.landing-visual {
    padding-right: 3%;
    padding-left: 6%
}

/* Top of Fold Old */
.header .navbar-nav > li > a, div.page-container > div.landing-above-fold {
    font-weight: 600;
}

.header.navbar-default .navbar-nav > li > a, .header .navbar-nav > li > a:visited {
    color: white;
}

.header .navbar-nav > li > a:hover {
    color: var(--prussian-blue);
}

h3.landing-hook {
    font-size: 48px;
    color: var(--ghost-white);
}

.landing-screenshot {
    margin-left: -50px;
    margin-right: 30px;
}

h4.landing-subtitle {
    font-size: 20px;
    line-height: 30px;
    color: var(--ghost-white);
}

div.landing-social-proof > div > p.customer-title {
    padding-right: 20px;
    font-size: 13px;
    text-align: end;
}

div.landing-social-proof > div > p.customer-quote {
    font-size: 18px;
    line-height: 150%;
    text-align: center;
    margin-bottom: 0;
    padding-bottom: 10px;
}

div.landing-social-proof > div > img.customer-testimonial {
    width: 65px;
    height: 65px;
    border-width: 2px;
    border-style: solid;
    border-color: var(--prussian-blue);
    -webkit-border-radius: 30px;
    border-radius: 65px
}

span.big-quote {
    font-size: 32px;
    margin-right: 0;
    margin-left: -2px;
    font-family: cursive;
    color: var(--midnight-green-eagle-green);
}

div.landing-social-proof > p.landing-star-count {
    font-size: 14px;
    font-weight: 500;
}

div.landing-social-proof > img.user-icon {
    margin-left: -10px;
    margin-right: 0;
}

div.landing-social-proof > i.fa-star {
    font-size: 20px;
    color: gold;
}

div.landing-visual > p.landing-visual-title {
    font-size: 18px;
    font-weight: 600;
}

/* Call to action */
button.landing-signup-btn {
    background-color: var(--midnight-green-eagle-green);
    border-color: var(--gunmetal);
}

/* YT Embed*/
iframe[src*="youtube-nocookie.com"] {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}


div.header {
    /*background: var(--prussian-blue);*/
}

.landing-footer {
    padding: 3.75rem 0;
    background: var(--gunmetal);
    text-align: center;
    font-size: 30px;
}

.landing-footer > div.row {
    display: block;
}

.landing-footer > div.row > div.footer-links > a.footer-links {
    line-height: 0;
}

.landing-footer .footer-brand-logo {
    display: block;
    margin: 0 auto .625rem;
    width: 1.875rem;
    border: 20px solid;
    border-color: #00acac #007979 #004646;
    -webkit-border-radius: 6px;
    border-radius: 6px
}

.footer .footer-brand {
    font-size: 1.53125rem;
    font-weight: 300;
    margin-bottom: 1.875rem
}

.footer-brand.landing-brand {
    color: var(--ghost-white);
}

.footer-links {
    font-size: 14px;
}

.footer-links.contact-us {
    font-size: 18px;
}

a.footer-links:hover {
    color: var(--hookers-green);
    text-decoration: none;

}


@media (prefers-color-scheme: dark) {
    @media (max-width: 991.98px) {
        body {
            color: white !important;
        }
    }

    body {
        background-color: var(--gunmetal);
        color: var(--dark-charcoal);
    }

    .header .navbar-nav > li.nav-item > a {
        color: var(--ghost-white);
        font-weight: bold;
    }

    .header a.navbar-brand > span.landing-brand {
        color: var(--ghost-white);
    }

    .navbar-brand > span, #display-name-nav-span, .header-profile-img > b.caret {
        color: var(--ghost-white);
    }

    .header.navbar-default .navbar-nav > li > a, .header .navbar-nav > li > a:visited {
        color: var(--pale-cerulean);
    }

    .header .navbar-nav > li > a:hover {
        color: var(--air-superiority-blue);
    }

    div.landing-social-proof > img {
        border-color: var(--ghost-white);
    }

    div.landing-signup > div.col > a.landing-mobile-sign-in-link {
        color: var(--ghost-white);
        text-decoration: none;
    }

    div.landing-signup > div.col > a.landing-mobile-sign-in-link:hover {
        color: var(--midnight-green-eagle-green);
    }

    span.big-quote {
        color: var(--unbleached-silk);
    }
}

ul.convincing-information li:before {
    font-family: 'FontAwesome';
    content: '\f00c';
    position: absolute;
}

ul {
    list-style-type: none;
}

@media (max-width: 991.98px) {
    .header .navbar-brand {
        padding: 0;
    }

    .main-content-container {
        background-image: none !important;
    }

    body {
        color: var(--dark-charcoal);
    }

    .landing-visual {
        padding-left: 0;
        padding-right: 6%;
    }

    .landing-screenshot {
        margin-left: 0;
        margin-right: 0;
    }

}

@media (max-width: 768px) {
    .page-header-fixed {
        padding-top: 0;
    }
}

@media (min-width: 479px) {
    h2.content-title {
        font-size: 19.5px;
    }

    p.content-desc {
        font-size: 16px
    }

    ul.convincing-information > li {
        font-size: 13px;
    }
}

ul li:before {
    margin: 0 10px 0 -25px;
}

@media (min-width: 768px) {
    h2.content-title {
        font-size: 24px;
    }

    p.content-desc {
        font-size: 16px
    }

    ul.convincing-information > li {
        font-size: 16px;
    }

    ul li:before {
        margin: 0 10px 0 -30px;
    }
}

@media (min-width: 999px) {
    div.landing-signup > div.col > a.landing-mobile-sign-in-link {
        display: none;
    }

    h2.content-title {
        font-size: 30px;
    }

    p.content-desc {
        font-size: 20px
    }

    ul.convincing-information > li {
        font-size: 20px;
    }


}


@font-face {
    font-family: 'Futura';
    src: url("../../fonts/futura/futura_std_book.4c8b91058476.ttf") format('truetype');
    src: url("../../fonts/futura/futura_std_book.f1ad9413a1c6.woff") format('woff');
}

.futura-font {
    font-family: Futura, serif;
}

/* Image stuff*/

img.image-shadow-effect {
    transform: perspective(1500px) rotateY(-10deg);
    border-radius: .5rem;
    box-shadow: rgba(0, 0, 0, 0.25) 0 25px 50px -12px;
    transition: transform 1s ease 0s;
}

/* Audio Player Top of Fold */
#demo-player > div.plyr {
    display: none;
}

@media only screen and (hover: none) and (pointer: coarse) {
    img.image-shadow-effect {
        transform: none;
        transition: none;
    }

    img.image-shadow-effect:hover {
        transform: none;
    }
}

@media (prefers-color-scheme: dark) {
    h2.content-title {
        color: var(--ghost-white);
    }

    .landing-hook, .landing-subtitle {
        color: var(--ghost-white);
    }

    .header .navbar-nav > li.nav-item > a.landing-sign-in-link.nav-link:visited {
        color: var(--ghost-white);
    }

    img.image-shadow-effect {
        box-shadow: 0 2px 0 #000, 0 2px 5px #000;
    }

    div.external-link-icon > a > i {
        color: var(--ghost-white);
    }
}

img.image-shadow-effect:hover {
    transform: perspective(3000px) rotateY(5deg);
}