/* Alkalinity Calculator */
#alkalinity-calculator {
    margin: 2em 0;
    font-family: var(--PrimaryFont);
    font-weight: 700;
}
.swiper{
    height:350px;
}
.content-box {
    background: none !important;
    padding-top:30px;
}

#primary-row {
    background: var(--blue);
    border-radius: 7px;
    padding: 60px;
}

#alkalinity_first_logo {
    width: 100%;
    height: 80px;
    background-repeat: no-repeat;
    background-size: contain;
}

#alkalinity_title {
    font-weight: 400;
    font-style: italic;
    letter-spacing: -0.05em;
    font-size: 26px;
    line-height: 1.2em;
    color: #535353;
    margin-top: 23px;
}

#alkalinity-calculator>.row {
    font-size: 18px;
    line-height: 1.6em;
    margin-bottom: 30px !important;
}

#alkalinity-calculator .titleRow {
    padding-bottom: 20px;
}

#alkalinity-calculator label, #alkalinity-calculator .alk_label {
    font-weight: 400;
    color: #FFF;
    font-size: 20px;
    font-style: normal;
    line-height: 1.4em; 
    letter-spacing: 0.2px;
}

.radio-options {
    display: flex;
    gap:10px;
    color:#fff;
}
.radio-options input[type="radio"] {
    accent-color: var(--orange);
    transform: scale(1.5);
    margin-right:2px;
}

.grid-table {
    display: grid;
    grid-template-columns_: minmax(0, 1fr) auto;
    grid-template-columns: minmax(0, 1fr) 1fr; /* left column auto-sizes, right column fills */
    width: 100%;
    row-gap: 0.5rem; /* optional */
    gap:15px;
    align-items: center;
}

.grid-row {
    display: contents; /* lets children participate directly in the grid */
}
.col-left{
    text-align:right;
}
.col-right {
    text-align: left;
}

/* Right column should not shrink */
.col-right {
    white-space: nowrap;
}

input.form-control,
select.calc_select {
    box-shadow: inset 0 -2px 0px 0px #fc9531;
    background-color: #fff;
    color: #1F1F1F;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 34px;

    height: 48px;
    padding: 5px 15px;
    margin:0;
}
select.calc_select option {
    font: var(--PrimaryFont);
}

.calc_display {
    width: 100%;
    padding: 7px 13px;
    margin: 6px 0;
}

#alkalinity_first_logo {
    width: 100%;
    height: 80px;
    background-position: center right;
    margin: 15px 0;
}

#alkalinity_title {
    font-size: 26px;
    line-height: 1.2em;
    font-weight: normal;
    color: #ffffff;
    padding-left: 42px;
    margin-top: 40px;
}

#alkalinity-calculator form {
    padding: 11px 0;
}

#alkalinity-calculator .row {
    font-size: 18px;
    line-height: 1.6em;
    margin-bottom: 0;
}

#alkalinity-calculator .titleRow {
    padding: 20px 0;
    background: url(../images/pool.jpg) center center no-repeat;
    background-size: cover;
}

#alkCalc {
    border-radius: 30px;
    border: 2px solid #FFF;
    background:none;
    color: #FFF;
    display:flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.6px;
    padding:10px 30px;

    -webkit-transition: background 0.3s, color 0.3s !important;
    -moz-transition: background 0.3s, color 0.3s !important;
    -o-transition: background 0.3s, color 0.3s !important;
    transition: background 0.3s, color 0.3s !important;
}

#alkCalc:hover {
    background: #fff;
    color: #fc9531;
}

#alkCalc:disabled,
#alkCalc:disabled:hover {
    color: #666;
    background: #ccc;
    border: 2px solid #ccc;
}

#alk-calc-table {
    margin-top: 15px;
    font-family: var(--PrimaryFont);
    font-style: normal;
    font-weight: 500;
    line-height: 22px;
    letter-spacing: 0.155px;
    border-radius: 3px;
    border: 1px solid #BAD0E6;
    color: #fff;
}

#alk-calc-table .item {
    display: flex;
    align-items: center;
    gap: 25px;
    width: 100%;
    padding: 10px 18px;
    font-size: 15px;
}

#alk-calc-table .item label {
    flex: 1 1 auto;
    text-align: left;
}

#alk-calc-table .item div.value {
    flex: 0 0 auto;
    white-space: nowrap;
    text-align: right;
    margin-left: auto;
}

#alkalinity-calculator #alk-calc-table .row {
    display: flex;
    align-items: center;
    padding: 15px 0;
    font-size: 15px;
}

#alkalinity-calculator #alk-calc-table .item:nth-child(1) {
    background: #fff;
    color: var(--blue);
    font-size: 16px;
}

#alkalinity-calculator #alk-calc-table .item:nth-child(2) {
    border-top: 1px solid #BAD0E6;
    border-bottom: 1px solid #BAD0E6;
    background: #78A2CA;
}

#alkalinity-calculator #alk-calc-table .item:nth-child(3) {
    border-bottom: 1px solid #BAD0E6;
    background: #5486B5;
}

#alkalinity-calculator #alk-calc-table .item:nth-child(4) {
    border-bottom: 1px solid #BAD0E6;
    background: #356EA3;
}

#alkalinity-calculator #alk-calc-table .item:nth-child(5) {
    border-bottom: 1px solid #BAD0E6;
    background: #1C568C;
}


input[type=number],
input[type=number]:focus {
    -moz-appearance: textfield;
    appearance: textfield;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

#alkalinity-calculator .reset {
    padding: 20px 12px;
    line-height: 1em;
    text-align: center;
}

#alkalinity-calculator .reset a {
    background: #004b8d;
    border: 1px solid #004b8d;
    border-radius: 5px;
    color: #fff;
    padding: 2px 5px;
    text-decoration: none;
    -webkit-transition: background 0.3s, color 0.3s !important;
    -moz-transition: background 0.3s, color 0.3s !important;
    -o-transition: background 0.3s, color 0.3s !important;
    transition: background 0.3s, color 0.3s !important;
}

#alkalinity-calculator .reset a:hover {
    background: #fff;
    color: #fc9531;
    border-color: #ccc #bbb #aaa;
}

#alkalinity-calculator .email_form p {
    color: #2E2E2E;
    font-size: 16.5px;
    font-style: normal;
    font-weight: 400;
    line-height: 27px;
}


#alk_email {
    background: #fbfbfb;
    -webkit-box-shadow: inset 0 -1px 0px 0px rgba(70, 97, 152, 1);
    -moz-box-shadow: inset 0 -1px 0px 0px rgba(70, 97, 152, 1);
    box-shadow: inset 0 -1px 0px 0px rgba(70, 97, 152, 1);
    color: #004b8d;
    padding: 3px 15px;
    width: 100%;
    border: none;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    font-size: 18px;
    line-height: 2em;
}

#alk_email:focus {
    -webkit-box-shadow: inset 0 -2px 0px 0px #fc9531;
    -moz-box-shadow: inset 0 -2px 0px 0px #fc9531;
    box-shadow: inset 0 -2px 0px 0px #fc9531;
    outline: none;
}

#emailAlkBtn {
    margin-top:1em;
    display: flex;
    padding: 10px 20px;
    justify-content: center;
    align-items: center;
    color: var(--blue);
    font-size: 17px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.51px;
    border-radius: 30px;
    background:none;
    border: 2px solid var(--blue);
    -webkit-transition: background 0.3s, color 0.3s !important;
    -moz-transition: background 0.3s, color 0.3s !important;
    -o-transition: background 0.3s, color 0.3s !important;
    transition: background 0.3s, color 0.3s !important;
}
#emailAlkBtn:hover{
    color: #fff;
    background:var(--blue);
}


#alk-email-response {
    text-align: center;
    display: none;
}

#alk_volume {
    display: inline-block;
}

#alk-calc-image {
    height: auto;
    max-width: 100%;
}

.bags-row {
    display: flex;
    flex-direction: row;
}
.bags-row .bag:first-child{
    margin-right:30px;
}
.bag {
    border-radius: 9px;
    border: 1px solid #BAD0E6;
    background: #F3F8FD;
    padding:40px;

    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 36px;
}
.bag > .row > div:first-child{
    text-align: center;
}
.bag img{
    max-width:75%;
}
.bag .row{
    display:flex;
}
.bag .title{
    color: var(--blue);
    font-size: 27px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.4em;
}
.bag .link .btn{
    border-radius: 30px;
    border: 3px solid #D31245;
    background:#d31245;
    color: #fff !important;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:7px 24px;
    text-decoration: none !important;
    transition: background 0.3s, color 0.3s !important;
}
.bag .link .btn:hover{
    background:none;
    color:#D31245!important;
}
.text-center {
    text-align: center;
}

.resultsRow {
    border-radius: 7px;
    border: 1px solid #3278B7;
    background: #E1E9EF;
    padding:30px
}
.resultsRow .title{
    color: var(--blue);
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
    line-height: 36px;
    letter-spacing: 0.3px;
    margin-bottom:0.8em;
}
.results-grid{
    display:grid;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
    column-gap:15px;
    align-items: center;

    color: #2E2E2E;
    font-size: 20px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.4em;
}
.results-grid .row-separator {
    padding-top:15px;
    margin-top:15px;
    grid-column: 1 / -1; /* Span across all columns */
    border-top: 1px solid #777;
}
.results-grid .grid-item {
    display: contents; /* lets children participate directly in the grid */
}
.results-grid .grid-value{
    font-weight: 500;
}
.results-grid .result{
    border-top:1px solid #777;
}

#email_results,
#email_collection,
#email_response {
    display: none;
}

#email_results button {
    padding: 10px 25px;
    background: #fc9531;
    border-color: #fc9531;
    line-height: 36px;
    font-size: 27px;
    font-weight: 400;
    color: #ffffff;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none !important;
    transition: background 0.3s, color 0.3s !important;
}

button#add-acid {
    text-transform: none;
    border: 1px solid #004b8d;
    background: #fff;
    color: #004b8d;
    font-size: 20px;
    padding: 5px 10px;
}

#leavening_form button#add-acid:hover {
    color: #fff;
    background: #004b8d;
}

#leavening_form button:hover,
#email_results button:hover {
    background: #fff;
    color: #fc9531;
    box-shadow: none;
}

#acid_template_1 a.remove-acid {
    display: none;
}

#leavening_form .row {
    padding-left: 40px;
    padding-right: 40px;
}

#leavening_form a.remove-acid {
    color: #d31245;
    text-decoration: none;
    padding-left: 15px;
}

.required {
    border: 2px solid #f00 !important;
}

#acid-val-warning {
    color: #f00;
    font-weight: bold;
    display: none;
}

#leavening_form,
#leavening_results {
    font-weight: 700;
}

#leavening_form a.remove-acid:hover {
    text-decoration: underline;
}

#leavening_form #calc {
    margin-left: auto;
    margin-right: auto;
}

.flex-v-center {
    display: flex;
    align-items: center;
}

.input-icon {
    position: relative;
    width: 100px;
    display: inline-block;
}

.input-icon.icon-right>i {
    right: 8px;
    top: 14px;
    float: right;
    color: #ccc;
    position: absolute;
    z-index: 3;
    font-style: normal;
    font-size: 20px;
}

.input-icon.right>input {
    padding-right: 15px;
}

.req {
    color: #f00;
}

.disclaimer {
    border-top: 1px solid #e8e8e8;
    line-height: 1.4em;
    font-size: 14px;
    margin-top: 3em;
    padding-top: 2em;
    text-align: justify;
}

@media screen and (max-width: 991px) {
    .alk_email_btn {
        text-align: center;
    }

    #alk_email {
        text-align: center;
    }
}

@media screen and (max-width: 767px) {
    #primary-row{
        padding:15px 0;
    }
    #alkalinity_first_logo {
        background-position: center center;
    }

    #alkalinity_title {
        margin: 15px 0 0;
        text-align: center;
    }

    #alk-calc-image {
        display: none;
    }

    #alk-calc-table .header-label {
        text-align: left;
    }

    #alkalinity-calculator .resultsRow .alk_label {
        line-height: 1em;
    }

    #alkalinity-calculator .row {
        font-size: 17px;
    }

    #alk-calc-table .alk_label {
        font-size: 14px;
    }

    #alkalinity-calculator>form>.container {
        padding-left: 0;
        padding-right: 0;
    }

    #alkalinity-calculator .email_form .alk_label {
        text-align: center;
    }
}

@media screen and (max-width: 360px) {
    #alkalinity-calculator .reset a {
        display: inline-block;
    }
}

.alkalinity-first {
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20267.08%20130.21%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%2C.cls-2%7Bfill%3A%23ffffff%3B%7D.cls-2%7Bfill-rule%3Aevenodd%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22Layer_2%22%20data-name%3D%22Layer%202%22%3E%3Cg%20id%3D%22Layer_1-2%22%20data-name%3D%22Layer%201%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M185%2C99.1a61.27%2C61.27%2C0%2C0%2C1-29.91-8.19l2.77-4.31c1.07.68%2C26.44%2C16.52%2C51.84%2C0%2C28.23-18.35%2C57.12-.19%2C57.4%2C0L264.3%2C90.9c-1.06-.68-26.44-16.52-51.83%2C0A49.65%2C49.65%2C0%2C0%2C1%2C185%2C99.1%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M185%2C109.67a61.27%2C61.27%2C0%2C0%2C1-29.91-8.19l2.77-4.31c1.07.68%2C26.44%2C16.52%2C51.84%2C0%2C28.23-18.35%2C57.12-.19%2C57.4%2C0l-2.77%2C4.31c-1.06-.68-26.44-16.52-51.83%2C0a49.65%2C49.65%2C0%2C0%2C1-27.5%2C8.2%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M185%2C119.44a61.27%2C61.27%2C0%2C0%2C1-29.91-8.19l2.77-4.31c1.07.68%2C26.44%2C16.52%2C51.84%2C0%2C28.23-18.35%2C57.12-.19%2C57.4%2C0l-2.77%2C4.31c-1.06-.68-26.44-16.52-51.83%2C0a49.64%2C49.64%2C0%2C0%2C1-27.5%2C8.2%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M185%2C130a61.27%2C61.27%2C0%2C0%2C1-29.91-8.19l2.77-4.31c1.07.68%2C26.44%2C16.53%2C51.84%2C0%2C28.23-18.35%2C57.12-.19%2C57.4%2C0l-2.77%2C4.31c-1.06-.68-26.44-16.52-51.83%2C0A49.64%2C49.64%2C0%2C0%2C1%2C185%2C130%22%2F%3E%3Cpolyline%20class%3D%22cls-1%22%20points%3D%2212.83%20129.6%2018.62%2099.75%2031.91%2099.75%2033.75%2090.27%2020.46%2090.27%2023.11%2076.57%2036.87%2076.57%2038.7%2067.09%2012.13%2067.09%200%20129.6%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M40.79%2C129.6l9.74-50.22H38.33L28.59%2C129.6M51.2%2C76l1.72-8.87H40.71L39%2C76Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M66.07%2C79.38H53.86L44.12%2C129.6H56.33l6.85-35.29c.39-2%2C1.34-4.13%2C3.35-4.13s2.14%2C2.11%2C1.75%2C4.13l-2.37%2C12.2H78.12L81.59%2C88.6c1-5.18-.18-9.83-6.36-9.83-4.48%2C0-7.73%2C2.81-10.2%2C7.2h-.23%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M112.61%2C97.12l1.12-5.79c1.64-8.43-3.51-12.56-12.78-12.56-8%2C0-15.06%2C4-17%2C14-3.17%2C16.33%2C14.86%2C12.64%2C12.54%2C24.58-.41%2C2.11-1.35%2C3.78-3.28%2C3.78s-2.23-1.67-1.82-3.78l1.47-7.55H80.64l-1.55%2C8c-1.75%2C9%2C3.61%2C12.47%2C11.41%2C12.47%2C10.2%2C0%2C16.48-5.27%2C18.4-15.19%2C3.17-16.33-14.21-14.75-12.55-23.35.41-2.1%2C1.35-3.78%2C3.28-3.78s2.22%2C1.67%2C1.82%2C3.78l-1.06%2C5.44%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M120.44%2C88.51l-5.94%2C30.64c-1.28%2C6.58-.56%2C10.45%2C5.55%2C10.45h10l1.77-9.13h-2.4c-2.86%2C0-2.63-1.58-2.05-4.57l5.31-27.39H138l1.77-9.13h-5.33l1.75-9H124l-1.75%2C9h-4.1l-1.77%2C9.13%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M26.64%2C37.66%2C34.28%2C9.83h.15L31.27%2C37.66M29%2C0%2C7.53%2C62.51H18.34l5.06-15.36h7L28.85%2C62.51H41.6L46.62%2C0Z%22%2F%3E%3Cpolyline%20class%3D%22cls-1%22%20points%3D%2256.24%2062.51%2068.36%200%2056.16%200%2044.03%2062.51%22%2F%3E%3Cpolyline%20class%3D%22cls-1%22%20points%3D%2271.78%2062.51%2076.87%2036.26%2077.02%2036.26%2078.19%2062.51%2090.63%2062.51%2088.36%2034.77%2099.75%2012.29%2087.93%2012.29%2077.23%2035.2%2077.07%2035.2%2083.9%200%2071.69%200%2059.57%2062.51%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M108%2C44.16c.77-4%2C3.69-5.09%2C6.46-7l-1.69%2C8.69c-.87%2C4.48-1.55%2C6.41-4.1%2C6.41-1.16%2C0-2.07-.88-1.73-2.63m2.6%2C12.91h12.21L129%2C25.37c2-10.1-4.76-13.7-12.1-13.7s-15.46%2C3.6-17.41%2C13.7L98.54%2C30h12.21l1.07-5.53c.39-2%2C1.26-3.69%2C3.26-3.69s2.23%2C1.67%2C1.83%2C3.69c-1.81%2C9.31-18.81%2C7.72-21.36%2C20.89l-1.45%2C7.46c-1.28%2C6.59%2C1.25%2C10.27%2C6.59%2C10.27%2C4.87%2C0%2C7.67-2.9%2C9.84-6.5h.16Z%22%2F%3E%3Cpolyline%20class%3D%22cls-1%22%20points%3D%22137.19%2062.51%20149.32%200%20137.11%200%20124.98%2062.51%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M152.81%2C62.51l9.74-50.22H150.34L140.6%2C62.51M163.21%2C8.87%2C164.93%2C0H152.72L151%2C8.87Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M178.08%2C12.29H165.87l-9.74%2C50.22h12.21l6.76-34.85c.43-2.19%2C1.19-4.56%2C3.51-4.56s2%2C2.37%2C1.59%2C4.56l-6.77%2C34.85h12.21l7.63-39.33c1.4-7.2-.55-11.5-6-11.5-4.79%2C0-8.2%2C2.46-10.21%2C6.85h-.15%22%2F%3E%3Cpath%20class%3D%22cls-2%22%20d%3D%22M201.09%2C62.51l9.74-50.22H198.62l-9.74%2C50.22M211.49%2C8.87%2C213.21%2C0H201l-1.72%2C8.87Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M215.4%2C21.42l-5.94%2C30.64c-1.28%2C6.58-.56%2C10.45%2C5.55%2C10.45h10l1.77-9.13h-2.39c-2.86%2C0-2.63-1.58-2.05-4.56l5.32-27.39h5.33l1.77-9.13h-5.33l1.76-9H218.93l-1.75%2C9h-4.09l-1.77%2C9.13%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M236.08%2C12.29%2C236.21%2C61a12.55%2C12.55%2C0%2C0%2C1-.12%2C2.2c-.19%2C1-.81%2C1.4-2.44%2C1.4h-6.33l-1.77%2C9.13h9.81c5.33%2C0%2C9.43-2.81%2C11.54-8.52l20.16-52.94H256.78L246%2C47h-.16l2.63-34.68%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M151.28%2C70.74%2C151%2C72.08h-1.77l-1.43%2C6.74h-1.63l1.43-6.74h-1.77l.28-1.34Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M152%2C70.74h2.42l-.06%2C5.7h0l2.38-5.7h2.41l-1.72%2C8.08H156l1.37-6.45h0l-2.81%2C6.45h-1.27l-.07-6.45h0l-1.37%2C6.45H150.3Z%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E);
}

#alkalinity-calculator {
    margin-top: 0 !important;
}

#alk-calc-image {
    max-width: 100%;
}

#alkalinity_first_logo {
    background-repeat: no-repeat;
}

#ios_prompt {
    background: rgba(0, 0, 0, 0.4);
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
    z-index: 500;
}

#ios_install {
    text-align: center;
    font-size: 18px;
    position: relative;
    width: 80%;
    margin: 50px auto 0;
    padding: 20px;
}

#ios_install .prompt {
    background: #fff;
    border-radius: 15px;
}

#ios_install .icon {
    padding: 20px 0 15px;
}

#ios_install .info {
    padding: 15px;
}

#ios_install .icon img {
    border-radius: 5px;
    width: 100px;
    height: 100px;
}

#ios_install .title {
    font-size: 28px;
}

#ios_install .install {
    background: #f6f6f6;
    margin-top: 20px;
    padding: 10px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

#ios_install .close {
    position: absolute;
    top: 35px;
    right: 35px;
}

#ios_share {
    background: url(images/ios_widget.png) center no-repeat;
    width: 24px;
    height: 24px;
    background-size: contain;
    display: inline-block;
}

@media screen and (max-width: 1199px) {
    #primary-row {
        display:flex;
        flex-direction: column-reverse;
        padding:30px 0;
    }
    #primary-row > .col-lg-6{
        margin-top:30px;
    }
    .bags-row{
        display:block;
    }
    .bag{
        width:100%;
        margin-bottom:30px;
    }
    #alk-calc-table{
        margin-top:0;
    }
}


@media screen and (max-width: 991px) {
    .resultsRow .title{
        font-size:22px;
        line-height:1.2em;
        text-align: center;
    }
    .email_form{
        margin-top:5em;
    }
}
@media screen and (max-width: 767px) {
    .grid-table{
        display:block;
    }
    .grid-table > .grid-row{
        display:block;
        margin-bottom:1em;
    }
    .resultsRow{
        padding:30px 15px;
    }
    .results-grid{
        row-gap:20px;
    }
    .results-grid .grid-item.result{
        grid-column: 1 / -1;
        display:block;
        border:none;
        text-align: center;
    }
    .results-grid .grid-item.result .grid-label{
        margin:0 0 1em;
    }
    #alk-result{
        font-size:32px;
        line-height: 1.4em;
    }
    .bags-row > .bag > .row{
        flex-direction: column;
        align-items:center;
        text-align: center;
    }
    .bags-row > .bag > .row img{
        margin-bottom:15px;
    }
    .radio-options{
        flex-direction: column;
        margin-top:0.5em;
        margin-left:2em;
    }
    #alk-calc-table .item div.value{
        white-space: wrap;
        flex-shrink: 1;
    }
}