/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
html {
    color: #2f2f2f;
    font-size: 1em;
    line-height: 1.4
}

::selection {
    background: #b3d4fc;
    text-shadow: none
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0
}

textarea {
    resize: vertical
}

.browserupgrade {
    margin: .2em 0;
    background: #ccc;
    color: #000;
    padding: .2em 0
}

a {
    text-decoration: none
}

ol {
    padding-left: 20px
}

section {
    clear: both;
    overflow: hidden
}

* {
    box-sizing: border-box
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 20px 0 10px
}

h1 {
    font-size: 48px;
    line-height: 52px
}

h2 {
    font-size: 36px;
    line-height: 40px
}

h3 {
    font-size: 32px;
    line-height: 36px
}

h4 {
    font-size: 24px;
    line-height: 28px
}

h5 {
    font-size: 16px;
    line-height: 20px
}

h6 {
    font-size: 12px;
    line-height: 16px
}

ol,
p,
ul {
    font-size: 18px;
    margin-bottom: 10px
}

.text.left {
    text-align: left
}

.text.center {
    text-align: center
}

.text.right {
    text-align: right
}

.text.light {
    font-weight: 100
}

.text.bold {
    font-weight: 700
}

.text.blue {
    color: #3b77bd
}

.text.source-sans {
    font-family: Source Sans Pro, sans-serif
}

.text.uppercase {
    text-transform: uppercase
}

.text.italic {
    font-style: italic
}

.text.underline {
    text-decoration: underline
}

.text.lead {
    font-size: 24px
}

.text.follow {
    font-size: 14px !important
}

input,
input[type=text],
select {
    width: 100%;
    border: 1px solid #959595;
    padding: 12px;
    border-radius: 5px;
    box-sizing: border-box;
    margin-bottom: 10px
}

select,
select#cc_month,
select#cc_year,
select#country-field,
select#state {
    color: #a9a9a9;
    padding: 11px;
    background-color: #fff;
    height: 43px;
    margin: 0 0 10px;
    color: #000 !important
}

select#cc_month option:first-child,
select#cc_year option:first-child,
select#country-field option:first-child,
select#state option:first-child,
select option:first-child {
    color: #757575 !important
}

#checkout-button,
#survey-button,
.continue-btn,
button {
    background-color: #f5460d;
    border-radius: 5px;
    font-family: Source Sans Pro, sans-serif;
    box-sizing: border-box;
    color: #fff !important;
    border: none;
    box-shadow: 0 4px 0 #962906;
    width: 100%;
    display: block;
    text-align: center;
    padding: 16px 0;
    font-size: 28px;
    cursor: pointer;
    text-decoration: none;
    margin-bottom: 4px
}

#checkout-button:hover,
#survey-button:hover,
.continue-btn:hover,
button:hover {
    box-shadow: 0 2px 0 #962906;
    position: relative;
    top: 2px
}

#checkout-button:disabled,
#survey-button:disabled,
.continue-btn:disabled,
button:disabled {
    opacity: .5;
    cursor: not-allowed;
    top: 0
}

select.valid {
    color: #000 !important
}

body,
html {
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: sans-serif
}

#container {
    height: auto !important;
    margin: 0 auto -240px;
    min-height: 100%
}

.push {
    clear: both;
    height: 240px
}

#content {
    margin: 0 auto;
    padding: 0;
    background-color: #fff
}

.wrap {
    max-width: 972px;
    overflow: visible;
    padding: 0 10px
}

.row,
.wrap {
    margin: 0 auto
}

.row {
    width: 100%;
    zoom: 1;
    overflow: hidden
}

.row:after,
.row:before {
    display: table;
    content: ""
}

.row:after {
    clear: both
}

.column {
    float: left
}

.column,
.column.alpha {
    margin: 0 3.7037037037% 10px 0
}

.column.omega,
.column.single {
    margin: 0 0 10px
}

.column.one {
    width: 4.9382716049%
}

.column.two {
    width: 13.5802469136%
}

.column.three {
    width: 22.2222222222%
}

.column.four {
    width: 30.8641975309%
}

.column.five {
    width: 39.5061728395%
}

.column.six {
    width: 48.1481481481%
}

.column.seven {
    width: 56.7901234568%
}

.column.eight {
    width: 65.4320987654%
}

.column.nine {
    width: 74.0740740741%
}

.column.ten {
    width: 82.7160493827%
}

.column.eleven {
    width: 91.3580246914%
}

.column.twelve {
    width: 100%
}

header[role=banner] {
    height: auto;
    overflow: hidden;
    width: 100%;
    padding: 20px 0 10px;
    background: #de1c4b !important
}

header[role=banner] .logo img {
    max-width: 240px;
    width: 100%
}

header[role=banner] .icons ul {
    float: right;
    margin: 0 0 20px;
    height: 22px;
    position: relative;
    top: 10px
}

header[role=banner] .icons li {
    display: inline-block;
    color: #fff;
    font-size: 18px;
    padding-left: 20px
}

header[role=banner] .icons li .icon {
    display: inline-block;
    width: 30px;
    height: 22px;
    padding-left: 10px;
    position: relative;
    top: 8px
}

header[role=banner] .icons li .icon.leaf {
    background: url(/images/icons/icon-leaf-white.png) 0 0 no-repeat
}

header[role=banner] .icons li .icon.phone {
    background: url(/images/icons/icon-phone-white.png) 0 0 no-repeat
}

header[role=banner] .clicktocall {
    display: none
}

footer[role=contentinfo] {
    padding-top: 30px;
    height: auto;
    min-height: 240px;
    margin: auto 0;
    position: relative;
    overflow: hidden
}

footer[role=contentinfo] .hd-badges {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-column-gap: 20px;
    grid-row-gap: 10px;
    margin-bottom: 40px
}

footer[role=contentinfo] .hd-badges .hd-badge {
    position: relative;
    min-height: 170px
}

footer[role=contentinfo] .hd-badges .hd-badge>div,
footer[role=contentinfo] .hd-badges .hd-badge>img {
    max-width: 120px;
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

footer[role=contentinfo] .terms ul {
    text-align: center;
    margin: 10px auto;
    padding-left: 0
}

footer[role=contentinfo] .terms ul li {
    display: inline-block;
    color: #09f;
    list-style: none;
    width: auto;
    margin: 0 !important
}

footer[role=contentinfo] .terms ul li a {
    width: auto;
    color: #09f !important;
    margin-left: 10px !important;
    margin-right: 10px !important;
    font-size: 12px;
    text-decoration: none
}

footer[role=contentinfo] .call-order {
    background: #ccc;
    padding: 10px 20px;
    border-radius: 3px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: auto
}

footer[role=contentinfo] .legal {
    margin-bottom: 20px
}

@media screen and (max-width:748px) {
    footer[role=contentinfo] .hd-badges {
        grid-template-columns: repeat(4, 1fr) !important
    }
}

#error-message,
.warn,
.warn-label,
span.red {
    color: red
}

#error-message {
    display: inline-block
}

label.warn[for=tos] {
    display: none
}

label.warn {
    display: block;
    margin-bottom: 10px
}

input.warn,
select.warn {
    border-color: red;
    margin-bottom: 0 !important
}

.hidden {
    display: none !important;
    visibility: hidden
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto
}

.invisible {
    visibility: hidden
}

.clearfix:after,
.clearfix:before {
    content: " ";
    display: table
}

.clearfix:after {
    clear: both
}

@media print {

    *,
    :after,
    :before {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important
    }

    a,
    a:visited {
        text-decoration: underline
    }

    a[href]:after {
        content: " ("attr(href) ")"
    }

    abbr[title]:after {
        content: " ("attr(title) ")"
    }

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: ""
    }

    blockquote,
    pre {
        border: 1px solid #999;
        page-break-inside: avoid
    }

    thead {
        display: table-header-group
    }

    img,
    tr {
        page-break-inside: avoid
    }

    img {
        max-width: 100% !important
    }

    h2,
    h3,
    p {
        orphans: 3;
        widows: 3
    }

    h2,
    h3 {
        page-break-after: avoid
    }
}

body {
    margin:0;
}
#ss,
.breathe,
.breathe-post,
.experience,
.formulated,
.hero,
.hero-post,
.offer,
.promise,
.results,
.say-enough {
    font-family: Source Sans Pro, sans-serif;
    padding: 30px 0 40px
}

a.cta-btn {
    text-decoration:none;
}

#ss p,
#ss ul,
.breathe-post p,
.breathe-post ul,
.breathe p,
.breathe ul,
.experience p,
.experience ul,
.formulated p,
.formulated ul,
.hero-post p,
.hero-post ul,
.hero p,
.hero ul,
.offer p,
.offer ul,
.promise p,
.promise ul,
.results p,
.results ul,
.say-enough p,
.say-enough ul {
    font-weight: 400;
    font-size: 20px
}

#ss .survey-1,
.breathe-post .survey-1,
.breathe .survey-1,
.experience .survey-1,
.formulated .survey-1,
.hero-post .survey-1,
.hero .survey-1,
.offer .survey-1,
.promise .survey-1,
.results .survey-1,
.say-enough .survey-1 {
    display: contents
}

#ss .survey-1 button,
.breathe-post .survey-1 button,
.breathe .survey-1 button,
.experience .survey-1 button,
.formulated .survey-1 button,
.hero-post .survey-1 button,
.hero .survey-1 button,
.offer .survey-1 button,
.promise .survey-1 button,
.results .survey-1 button,
.say-enough .survey-1 button {
    background-color: #de1c4b !important;
    box-shadow: 0 4px 0 #83112c;
    max-width: 360px;
    width: 100%;
    padding: 16px 30px;
    margin: 20px auto 4px
}


section.promise,
section.offer {
    text-align: center;
    padding: 3em;
}
.promise .hd-icons {
    display: grid;
    -ms-grid-columns: repeat(6, 1fr);
    grid-template-columns: repeat(6, 1fr);
    grid-column-gap: 20px;
    grid-row-gap: 10px;
    margin-bottom: 40px;
    justify-items: center;
    align-items: flex-start;
}

.promise .hd-icons svg {
    margin: auto;
    width: 100px;
    max-width: 100%;
}
@media screen and (max-width: 768px) {
    .promise .hd-icons svg {
        width: 80px;
        max-width: 100%;
    }
}
.promise .hd-icons p {
    text-align: center;
}

@media screen and (max-width: 768px) {
    .hd-icons {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

.center {
    margin: auto;
}

.sub-title {
    color: #084a9e
}

.testimonial-noImage {
    padding: 0;
    margin-bottom: 0;
    max-width: 900px;
}

.testimonial-noImage .rating {
    margin-bottom: 10px
}

.testimonial-noImage .rating img {
    width: 200px;
    margin-left: 40px
}

.testimonial-noImage blockquote {
    padding-left: 30px;
    border-left: 6px solid rgba(0, 0, 0, .125)
}

.testimonial-noImage blockquote p {
    margin: 0
}

.testimonial-noImage blockquote p:before {
    content: '"';
    position: absolute;
    margin-left: -.4em
}

.testimonial-noImage blockquote p:after {
    content: '"'
}

.testimonial-noImage .meta {
    margin-left: 40px
}

.testimonial-noImage .meta span {
    margin: 0 10px
}

s,
strike {
    text-decoration: none;
    position: relative;
    display: inline-block
}

s:after,
strike:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    border-top: 2px solid red;
    height: 45%;
    height: calc(50% - 1px);
    width: 100%
}

.hero {
    background: url(https://media.healthydirections.com/rc/media/2390/1021-sin-lp-sin-hero-xray-d.jpg) center 0 no-repeat;
    background-size: cover;
    min-height: 540px;
    display: flex;
    align-items: center;
    justify-content: center
}

.hero .wrap {
    max-width: 972px
}

.hero .wrap h1 {
    font-weight: 600;
    font-size: 72px;
    line-height: 74px;
    color: #de1c4b
}

.hero .wrap h2 {
    font-weight: 600;
    font-size: 48px;
    line-height: 52px;
    color: #084a9e
}

.hero .wrap .bottle img {
    max-width: 360px;
    width: 100%;
    margin-top: 90px
}

.hero .wrap ul {
    font-size: 1.425em;
    line-height: 1.425em;
    padding-left: 0
}

.hero .wrap ul li {
    background: url(/images/lung-support/bullet.png) no-repeat 0 6px !important;
    list-style: none;
    padding-left: 40px
}

@media screen and (max-width:748px) {
    .hero {
        background: url(https://media.healthydirections.com/rc/media/2390/1021-sin-lp-sin-hero-xray-d.jpg) center 0 no-repeat;
        min-height: inherit;
        background-size: cover
    }

    .hero .wrap h1 {
        margin: 0 !important;
        font-size: 48px;
        line-height: 52px
    }

    .hero .wrap h2 {
        margin: 0 !important;
        font-size: 36px;
        line-height: 40px
    }

    .hero .wrap .bottle img {
        margin-top: 20px
    }
}

.hero-post .row img {
    border-radius: 5px;
    max-width: 360px;
    width: 100%
}

.experience p.lead {
    color: #084a9e
}

.experience img {
    max-width: 458px;
    width: 100%;
    margin: 0 auto;
    display: block
}

.breathe {
    padding-bottom: 0 !important;
    background-color: #e5f2f9
}

.breathe .alpha img {
    margin-top: 20px;
    max-width: 150px;
    width: 100%
}

.breathe .omega p.lead {
    color: #084a9e
}

.breathe-post {
    padding-top: 0 !important;
    background: #e5f2f9;
    background: linear-gradient(#e5f2f9, #a5d7f4)
}

.breathe-post .alpha h2 {
    color: #084a9e;
    margin-bottom: 0
}

.breathe-post .alpha h3 {
    color: #084a9e;
    margin-top: 0
}

.breathe-post .omega img {
    max-width: 360px;
    width: 100%
}

.results {
    background: url(/images/lung-support/0620-sin-lp-adv-lung-bronchial-stack-chart-bkg-d.jpg) 50% no-repeat;
    background-size: cover
}

.results,
.results .wrap {
    position: relative
}

.results .wrap .rainbow {
    position: absolute;
    top: 180px;
    left: 0;
    z-index: 999999
}

.results .wrap h2,
.results .wrap p {
    color: #fff
}

.results .wrap .wrap-grid {
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr) !important;
    grid-column-gap: 20px !important
}

.results .wrap .wrap-grid .row {
    align-self: end
}

.results .wrap .wrap-grid .row .result {
    margin-bottom: 10px;
    min-height: 92px;
    padding: 10px;
    overflow: hidden;
    display: flex;
    align-items: center
}

.results .wrap .wrap-grid .row .result img {
    width: 60px;
    position: absolute
}

.results .wrap .wrap-grid .row .result p {
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    margin: 0 0 0 10px !important
}

.results .wrap .wrap-grid .row .result.yellow {
    background-color: #eaa813
}

.results .wrap .wrap-grid .row .result.blue {
    background-color: #1196d5
}

.results .wrap .wrap-grid .row .result.green {
    background-color: #1d9b07
}

.results .wrap .wrap-grid .row .result.red {
    background-color: #c31230
}

.results .wrap .wrap-grid .row .result.pink {
    background-color: #cc06b0
}

.results .wrap .wrap-grid .row .result.purple {
    background-color: #771c7d
}

@media screen and (max-width:748px) {
    .results .wrap .rainbow {
        display: none
    }

    .results .wrap .wrap-grid {
        width: 100%;
        margin: 0 auto;
        display: grid;
        grid-template-columns: repeat(1, 1fr) !important;
        grid-column-gap: 20px !important
    }

    .results .wrap .wrap-grid .row .result {
        margin-bottom: 3px
    }
}

.formulated .alpha img {
    max-width: 220px;
    width: 100%
}

.say-enough {
    background-color: #f4f4f4
}

.say-enough .rating img {
    max-width: 160px !important
}

.say-enough .row img {
    margin-top: 20px !important;
    max-width: 420px;
    width: 100%
}

.promise {
    background-color: #de1c4b;
    color: #fff !important;
    padding: 3em;
}

.promise h1 {
    color: #fff
}

.promise .hd-icons {
    margin-top: 20px
}

.promise .hd-icons img {
    max-width: 90px;
    width: 100%
}

.promise .hd-icons .flag img {
    margin-top: 20px
}

.promise .hd-icons .flag p {
    margin-top: 30px
}

@media screen and (max-width:748px) {
    .promise .hd-icons .two {
        width: 30.8641975309% !important
    }

    .promise .hd-icons .two:nth-child(3),
    .promise .hd-icons .two:nth-child(6) {
        margin: 0
    }

    .promise .hd-icons .two:nth-child(4) {
        clear: both
    }

    .promise .hd-icons .two p {
        font-size: 15px
    }
}

.offer {
    background-color: #084a9e;
    color: #fff
}

.offer h2 {
    margin: 20px 0
}

.offer h3 {
    margin-top: 0
}

.offer img {
    max-width: 200px;
    width: 100%
}

.offer .gnc-logo img {
    margin-top: 20px;
    max-width: 180px;
    width: 100%
}

#ss {
    padding-bottom: 0;
    overflow: hidden;
    margin-bottom: 0
}

#ss #straight-sale {
    max-width: 768px;
    width: 100%;
    margin: 20px auto 0;
    background: #fff;
    overflow: hidden;
    border-radius: 5px;
    display: block !important;
    padding: 0
}

#ss #straight-sale .ss-header {
    background: #000915;
    color: #fff;
    font-size: 24px;
    padding: 10px 0
}

#ss #straight-sale form {
    padding: 10px
}

#ss #straight-sale form .option {
    padding: 0 20px;
    margin-bottom: 10px;
    transition: background-color .25s ease;
    border-radius: 5px;
    background-color: rgba(0, 0, 0, .125);
    overflow: hidden;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .25)
}

#ss #straight-sale form .option:hover {
    background: #398df5;
    background: radial-gradient(circle, #398df5 0, #004294 100%);
    color: #fff
}

#ss #straight-sale form .option p {
    margin: 5px 0 0;
    font-size: 30px
}

#ss #straight-sale form .option .row {
    margin-top: -20px;
    display: flex;
    align-items: center
}

#ss #straight-sale form .option .row .alpha,
#ss #straight-sale form .option .row .beta,
#ss #straight-sale form .option .row .omega {
    margin: 0 !important;
    width: 33.33%
}

#ss #straight-sale form .option .row .alpha {
    height: 180px;
    overflow: visible
}

#ss #straight-sale form .option .row .alpha img {
    margin-top: -10px;
    max-width: 200px;
    width: 100%
}

#ss #straight-sale form .option .row .beta {
    padding-right: 20px;
    text-align: center
}

#ss #straight-sale form .option .row .beta p {
    font-size: 22px;
    font-weight: 100;
    margin: 0
}

#ss #straight-sale form .option .row .beta p:first-child {
    font-weight: 600;
    line-height: 20px
}

#ss #straight-sale form .option .row .beta p:nth-child(2) {
    font-size: 30px
}

#ss #straight-sale form .option .row .beta p:nth-child(3) {
    font-weight: 600;
    line-height: 14px
}

#ss #straight-sale form .option .row .omega button {
    color: #fff !important;
    background-color: #c41230 !important;
    box-shadow: 0 4px 0 #9d0d25
}

#ss #straight-sale form .option .row .omega p {
    font-size: 16px;
    color: #fff;
    border-radius: 5px;
    padding: 5px 10px;
    margin: 10px 0 0;
    background-color: #f5460d
}

#ss #straight-sale form .option.two {
    background: #398df5;
    background: radial-gradient(circle, #398df5 0, #004294 100%);
    color: #fff
}

@media screen and (max-width:748px) {
    #ss #straight-sale form .option {
        padding: 0 10px 10px
    }

    #ss #straight-sale form .option .row {
        display: block;
        margin-top: -10px
    }

    #ss #straight-sale form .option .row .four.alpha {
        margin-bottom: 0 !important;
        height: auto;
        width: 40%
    }

    #ss #straight-sale form .option .row .four.alpha img {
        margin-top: 0
    }

    #ss #straight-sale form .option .row .four.beta {
        margin: 25px 0 0 !important;
        padding: 0 0 0 10px !important;
        text-align: left;
        width: 60%
    }

    #ss #straight-sale form .option .row .four.beta p:nth-child(3) {
        font-size: 16px
    }

    #ss #straight-sale form .option .row .four.omega {
        margin-top: -10px !important;
        width: 100%
    }

    #ss #straight-sale form .option .row .four.omega p {
        display: none
    }
}

#survey-form {
    width: 100%;
    position: fixed;
    bottom: 0;
    background-color: rgba(37, 37, 37, .75);
    height: auto;
    overflow: hidden;
    padding: 10px 0;
    color: #fff;
    z-index: 999999
}

#survey-form button#survey-button {
    font-size: 20px;
    background-color: #f60
}


.hero-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.column-right {
    padding: 1em;
}

#checkout-button, #survey-button, .continue-btn, button {
    background-color: #f5460d;
    border-radius: 5px;
    font-family: Source Sans Pro,sans-serif;
    box-sizing: border-box;
    color: #fff !important;
    border: none;
    box-shadow: 0 4px 0 #962906;
    width: 100%;
    display: block;
    text-align: center;
    padding: 16px 0;
    font-size: 28px;
    cursor: pointer;
    text-decoration: none;
    margin-bottom: 4px;
    width: 100%;
    padding: 16px 30px;
    margin: 20px auto 4px;
    border-radius: 5px;
font-family: Source Sans Pro,sans-serif;
box-sizing: border-box;
color: #fff !important;
border: none;
display: block;
text-align: center;
font-size: 28px;
cursor: pointer;
text-decoration: none;
}

#checkout-button:hover, #survey-button:hover, .continue-btn:hover, button:hover {
    box-shadow: 0 2px 0 #962906;
    position: relative;
    top: 2px;
}

@media screen and (min-width: 600px) {
    .mobile {
        display: none;
    }

    .hero-content {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .column-right {
        width: 475px;
        margin-left: 30px;
    }

    #ss,
    .breathe,
    .breathe-post,
    .experience,
    .formulated,
    .hero,
    .hero-post,
    .offer,
    .promise,
    .results,
    .say-enough {
        font-family: Source Sans Pro, sans-serif;
        padding: 30px 0 40px
    }

    #ss p,
    #ss ul,
    .breathe-post p,
    .breathe-post ul,
    .breathe p,
    .breathe ul,
    .experience p,
    .experience ul,
    .formulated p,
    .formulated ul,
    .hero-post p,
    .hero-post ul,
    .hero p,
    .hero ul,
    .offer p,
    .offer ul,
    .promise p,
    .promise ul,
    .results p,
    .results ul,
    .say-enough p,
    .say-enough ul {
        font-weight: 400;
        font-size: 20px
    }

    #ss .cta-btn,
    .breathe-post .cta-btn,
    .breathe .cta-btn,
    .experience .cta-btn,
    .formulated .cta-btn,
    .hero-post .cta-btn,
    .hero .cta-btn,
    .offer .cta-btn,
    .promise .cta-btn,
    .results .cta-btn,
    .say-enough .cta-btn {
        display: contents
    }

    #ss .cta-btn button,
    .breathe-post .cta-btn button,
    .breathe .cta-btn button,
    .experience .cta-btn button,
    .formulated .cta-btn button,
    .hero-post .cta-btn button,
    .hero .cta-btn button,
    .offer .cta-btn button,
    .promise .cta-btn button,
    .results .cta-btn button,
    .say-enough .cta-btn button {
        /* background-color: #f5460d;
        box-shadow: 0 4px 0 #962906; */
        max-width: 360px;

    }

    .sub-title {
        color: #084a9e
    }

    .testimonial-noImage {
        padding: 20px 0;
        margin-bottom: 0
    }

    .testimonial-noImage .rating {
        margin-bottom: 10px
    }

    .testimonial-noImage .rating img {
        width: 200px;
        margin-left: 40px
    }

    .testimonial-noImage blockquote {
        padding-left: 30px;
        border-left: 6px solid rgba(0, 0, 0, .125)
    }

    .testimonial-noImage blockquote p {
        margin: 0
    }

    .testimonial-noImage blockquote p:before {
        content: '"';
        position: absolute;
        margin-left: -.4em
    }

    .testimonial-noImage blockquote p:after {
        content: '"'
    }

    .testimonial-noImage .meta {
        margin-left: 40px
    }

    .testimonial-noImage .meta span {
        margin: 0 10px
    }

    s,
    strike {
        text-decoration: none;
        position: relative;
        display: inline-block
    }

    s:after,
    strike:after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        border-top: 2px solid red;
        height: 45%;
        height: calc(50% - 1px);
        width: 100%
    }

    .hero {
        background: url(https://media.healthydirections.com/rc/media/2390/1021-sin-lp-sin-hero-xray-d.jpg) center 0 no-repeat;
        background-size: cover;
        min-height: 540px;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .hero .wrap {
        max-width: 972px
    }

    .hero .wrap h1 {
        font-weight: 600;
        font-size: 72px;
        line-height: 74px;
        color: #de1c4b
    }

    .hero .wrap h2 {
        font-weight: 600;
        font-size: 48px;
        line-height: 52px;
        color: #084a9e
    }

    .hero .wrap .bottle img {
        max-width: 200px;
        width: 100%;
        margin-top: 90px
    }

    .hero .wrap ul {
        font-size: 1.425em;
        line-height: 1.425em;
        padding-left: 0
    }

    .hero .wrap ul li {
        background: url(https://dev-medlar.healthydirections.com/images/lung-support/bullet.png) no-repeat 0 6px !important;
        list-style: none;
        padding-left: 40px
    }

    @media screen and (max-width:848px) {
        .hero {
            background: url(https://media.healthydirections.com/rc/media/2390/1021-sin-lp-sin-hero-xray-d.jpg) center 0 no-repeat !important;
            min-height: inherit !important;
            background-size: cover !important
        }

        .hero .wrap h1 {
            font-size: 48px;
            line-height: 52px
        }

        .hero .wrap h2 {
            font-size: 36px;
            line-height: 40px
        }

        .hero .wrap .bottle img {
            margin-top: 20px
        }
    }

    .hero-post {
        padding: 80px 0;
        /* background: url(https://dev-medlar.healthydirections.com/images/lung-support/0620-sin-lp-adv-lung-bronchial-sin-biking-couple-d.jpg) left 0 no-repeat; */
        background-size: contain
    }

    .hero-post .row .omega {
        overflow: hidden;
        padding: 10px 20px;
        border-radius: 5px;
        background-color: hsla(0, 0%, 100%, .5)
    }

    .hero-post button {
        margin-top: 40px !important
    }

    @media screen and (max-width:748px) {
        .hero-post {
            padding: 20px 0;
            background: none !important
        }
    }

    .experience .alpha p.lead,
    .experience .omega p.lead {
        color: #084a9e
    }

    .experience .alpha img,
    .experience .omega img {
        max-width: 458px;
        width: 100%
    }

    .experience .omega p.lead {
        margin-bottom: 40px
    }

    @media screen and (max-width:748px) {
        .experience .omega p.lead {
            margin-bottom: 10px
        }
    }

    .breathe {
        background-color: #e5f2f9
    }

    .breathe .alpha img {
        margin-top: 20px;
        max-width: 150px;
        width: 100%
    }

    .breathe .omega p.lead {
        color: #084a9e
    }

    .breathe-post {
        background: #e5f2f9;
        background: linear-gradient(#e5f2f9, #a5d7f4)
    }

    .breathe-post .alpha h1 {
        color: #084a9e;
        margin-bottom: 0
    }

    .breathe-post .alpha h2 {
        color: #084a9e;
        margin-top: 0
    }

    .breathe-post .omega img {
        max-width: 360px;
        width: 100%
    }

    .results {
        background: url(https://dev-medlar.healthydirections.com/images/lung-support/0620-sin-lp-adv-lung-bronchial-stack-chart-bkg-d.jpg) 50% no-repeat;
        background-size: cover
    }

    .results,
    .results .wrap {
        position: relative
    }

    .results .wrap .rainbow {
        position: absolute;
        top: 180px;
        left: 0;
        z-index: 999999
    }

    .results .wrap h2,
    .results .wrap p {
        color: #fff
    }

    .results .wrap .wrap-grid {
        width: 100%;
        margin: 0 auto;
        display: grid;
        grid-template-columns: repeat(3, 1fr) !important;
        grid-column-gap: 20px !important
    }

    .results .wrap .wrap-grid .row {
        align-self: end
    }

    .results .wrap .wrap-grid .row .result {
        margin-bottom: 10px;
        min-height: 92px;
        padding: 10px;
        overflow: hidden;
        display: flex;
        align-items: center
    }

    .results .wrap .wrap-grid .row .result img {
        width: 60px;
        position: absolute
    }

    .results .wrap .wrap-grid .row .result p {
        font-weight: 600;
        font-size: 16px;
        line-height: 18px;
        margin: 0 0 0 10px !important
    }

    .results .wrap .wrap-grid .row .result.yellow {
        background-color: #eaa813
    }

    .results .wrap .wrap-grid .row .result.blue {
        background-color: #1196d5
    }

    .results .wrap .wrap-grid .row .result.green {
        background-color: #1d9b07
    }

    .results .wrap .wrap-grid .row .result.red {
        background-color: #c31230
    }

    .results .wrap .wrap-grid .row .result.pink {
        background-color: #cc06b0
    }

    .results .wrap .wrap-grid .row .result.purple {
        background-color: #771c7d
    }

    @media screen and (max-width:748px) {
        .results .wrap .rainbow {
            display: none
        }

        .results .wrap .wrap-grid {
            width: 100%;
            margin: 0 auto;
            display: grid;
            grid-template-columns: repeat(1, 1fr) !important;
            grid-column-gap: 20px !important
        }

        .results .wrap .wrap-grid .row .result {
            margin-bottom: 3px
        }
    }

    .formulated .alpha img {
        max-width: 220px;
        width: 100%
    }

    .say-enough {
        background-color: #f4f4f4
    }

    .say-enough .omega img {
        margin-top: 20px !important;
        max-width: 420px;
        width: 100%
    }

    @media screen and (max-width:748px) {
        .say-enough .omega {
            display: none
        }
    }

    .promise {
        background-color: #de1c4b;
        color: #fff !important
    }

    .promise h1 {
        color: #fff
    }

    .promise .hd-icons {
        margin-top: 20px
    }

    .promise .hd-icons img {
        max-width: 100px;
        width: 100%
    }

    .promise .hd-icons .flag img {
        margin-top: 20px
    }

    .promise .hd-icons .flag p {
        margin-top: 35px
    }

    @media screen and (max-width:748px) {
        .promise .hd-icons .two {
            width: 30.8641975309% !important
        }

        .promise .hd-icons .two:nth-child(3),
        .promise .hd-icons .two:nth-child(6) {
            margin: 0
        }

        .promise .hd-icons .two:nth-child(4) {
            clear: both
        }
    }

    .offer {
        background-color: #084a9e;
        color: #fff
    }

    .offer .alpha h1 {
        margin: 40px 0 20px
    }

    .offer .alpha h2 {
        margin-top: 0
    }

    .offer .omega img {
        max-width: 220px;
        width: 100%
    }

    .offer .gnc-logo img {
        margin-bottom: 20px;
        max-width: 180px;
        width: 100%
    }

    #ss {
        overflow: hidden;
        margin-bottom: 40px
    }

    #ss #straight-sale {
        max-width: 768px;
        width: 100%;
        margin: 20px auto 0;
        background: #fff;
        overflow: hidden;
        border-radius: 5px;
        display: block !important;
        padding: 0
    }

    #ss #straight-sale .ss-header {
        background: #000915;
        color: #fff;
        font-size: 24px;
        padding: 10px 0
    }

    #ss #straight-sale form {
        padding: 10px
    }

    #ss #straight-sale form .option {
        padding: 0 20px;
        margin-bottom: 10px;
        transition: background-color .25s ease;
        border-radius: 5px;
        background-color: rgba(0, 0, 0, .125);
        overflow: hidden;
        box-shadow: 1px 1px 2px rgba(0, 0, 0, .25)
    }

    #ss #straight-sale form .option:hover {
        background: #398df5;
        background: radial-gradient(circle, #398df5 0, #004294 100%);
        color: #fff
    }

    #ss #straight-sale form .option p {
        margin: 5px 0 0;
        font-size: 30px
    }

    #ss #straight-sale form .option .row {
        margin-top: -20px;
        display: flex;
        align-items: center
    }

    #ss #straight-sale form .option .row .alpha,
    #ss #straight-sale form .option .row .beta,
    #ss #straight-sale form .option .row .omega {
        margin: 0 !important;
        width: 33.33%
    }

    #ss #straight-sale form .option .row .alpha {
        height: 180px;
        overflow: visible
    }

    #ss #straight-sale form .option .row .alpha img {
        margin-top: -10px;
        max-width: 200px;
        width: 100%
    }

    #ss #straight-sale form .option .row .beta {
        padding-right: 20px;
        text-align: center
    }

    #ss #straight-sale form .option .row .beta p {
        font-size: 22px;
        font-weight: 100;
        margin: 0
    }

    #ss #straight-sale form .option .row .beta p:first-child {
        font-weight: 600;
        line-height: 20px
    }

    #ss #straight-sale form .option .row .beta p:nth-child(2) {
        font-size: 30px
    }

    #ss #straight-sale form .option .row .beta p:nth-child(3) {
        font-weight: 600;
        line-height: 14px
    }

    #ss #straight-sale form .option .row .omega button {
        color: #fff !important;
        background-color: #c41230 !important;
        box-shadow: 0 4px 0 #9d0d25
    }

    #ss #straight-sale form .option .row .omega p {
        font-size: 16px;
        color: #fff;
        border-radius: 5px;
        padding: 5px 10px;
        margin: 10px 0 0;
        background-color: #f5460d
    }

    #ss #straight-sale form .option.two {
        background: #398df5;
        background: radial-gradient(circle, #398df5 0, #004294 100%);
        color: #fff
    }

    @media screen and (max-width:748px) {
        #ss #straight-sale form .option {
            padding: 0 10px 10px
        }

        #ss #straight-sale form .option .row {
            display: block;
            margin-top: -10px
        }

        #ss #straight-sale form .option .row .four.alpha {
            margin-bottom: 0 !important;
            height: auto;
            width: 40%
        }

        #ss #straight-sale form .option .row .four.alpha img {
            margin-top: 0
        }

        #ss #straight-sale form .option .row .four.beta {
            margin: 25px 0 0 !important;
            padding: 0 0 0 10px !important;
            text-align: left;
            width: 60%
        }

        #ss #straight-sale form .option .row .four.beta p:nth-child(3) {
            font-size: 16px
        }

        #ss #straight-sale form .option .row .four.omega {
            margin-top: -10px !important;
            width: 100%
        }

        #ss #straight-sale form .option .row .four.omega p {
            display: none
        }
    }

    #survey-form {
        width: 100%;
        position: fixed;
        bottom: 0;
        background-color: rgba(37, 37, 37, .75);
        height: auto;
        overflow: hidden;
        padding: 10px 0;
        color: #fff;
        z-index: 999999
    }

    #survey-form button#survey-button {
        font-size: 20px;
        background-color: #f60
    }
}