/*
 * style.css
 *
 * Theme Name:  GetaKit Location 2023
 * Theme URI:   http://www.machine-agency.com
 * Author:      Machine
 * Author URI:  http://www.machine-agency.com
 * Description: Custom Theme for GetaKit Location Websites
 * Version:     1.0
 * License:     GNU General Public License v2 or later
 * License URI: http://www.gnu.org/licenses/gpl-2.0.html
 * Tags:        light
 * Text Domain: machine
 */


@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&display=swap');

/* ==========================================================================
  Colours
  ========================================================================== */

:root {
  --primary: #2A3F95;
  --primary-dark: #171F7B;
  --accent: #F7EC32;
  --primary-light-1: #F9F9FF;
  --primary-light-2: #EAEFFF;
  --dark-text: #231F38;
  --dark-grey: #6B6B6B;
  --mid-grey: #9A9A9A;
  --light-grey: #E3E3E3;
  --background-1: #F8F8F8;
  --background-2: #FCFCFC;
  --warning: red;
  --success: var(--primary);
}


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

body.loading {
    opacity: 0.4;
    cursor: wait !important;
}
body.loading * {
    pointer-events: none !important;
}



.primary{
    color: var(--primary);
}

a{
   color: var(--primary);
}

a:hover,
a:focus{
    color: var(--primary);
}

.button{
    border: 2px solid var(--primary);
    background-color: var(--primary);
    color: #fff;
}

.button:hover,
.button:focus{
    background-color: var(--primary-dark);
    border: 2px solid var(--primary-dark);
}

.button-light{
    border: 2px solid var(--primary);
    background-color: transparent;
    color: var(--primary);
}

.button-light:hover,
.button-light:focus{
    color: #fff;
    background-color: var(--primary-dark);
}

strong{
    color: var(--primary);
}

.impact-bg{
    background: linear-gradient(180deg, #FFFFFF 0%, var(--background-1) 100%);
}

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

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

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

.bg-primary-light-1{
    background-color: var(--primary-light-1);
}

.bg-primary-light-2{
    background-color: var(--primary-light-2);
}

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


.primary{
    color: var(--primary);
}

.primary-dark{
    color: var(--primary-dark);
}

.dark{
    color: var(--dark-text);
}

.dark-grey{
    color: var(--dark-grey);
}

.mid-grey{
    color: var(--mid-grey);
}

.section--image-banner.bg-dark *{
    color: #fff;
}

.site-footer{
    background-color: var(--background-2);
}

.site-footer a{
    color: var(--dark-text);
}

.site-footer a:hover,
.site-footer a:focus{
    color: var(--primary);
}

.site-header .menu a{
    color: var(--dark-text);
}

.site-header .menu a:hover,
.site-header .menu a:focus{
    color: var(--primary);
}

.language-dropdown li a{
    background-color: var(--primary-light-1);
    color: var(--primary);
}

.language-dropdown li a:hover,
.language-dropdown li a:focus{
    background-color: var(--primary-light-2);
    color: var(--primary);
}

.accordion-wrapper{
    background-color: var(--background-2);
}

.accordion-title{
    color: var(--mid-grey);
}

.accordion-item.is-active .accordion-title,
.accordion-title:hover,
.accordion-title:focus{
    color: var(--primary);
}

.accordion-content strong{
    color: var(--dark-text);
}

.accordion-title-expand{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 2rem;
}

.accordion-title-expand h3{
    margin: 0;
}

.accordion-title-expand a{
    text-decoration: underline;
}

.accordion-title-expand a:hover,
.accordion-title-expand a:focus{
    text-decoration: none;
}

.accordion-wrapper-titles{
    border-bottom: 2px solid var(--light-grey);
}

.regions-select ul li a{
    color: var(--dark-text);
}

.section--contact h3{
    color: var(--primary);
}

hr{
    border-top: 2px solid var(--light-grey);
    border-bottom: none;
}

.scrollable-content {
    background-color: var(--background-2);
}


label.checkbox .checkmark:after{
    border: solid #000;
}

label.checkbox .checkmark {
    border: 2px solid var(--mid-grey);
}

label.checkbox input[type="checkbox"]:checked ~ .checkmark {
    border: 2px solid var(--mid-grey);
}

@media only screen and (max-width: 900px){
    
    .language-toggle-mobile li{
        border-right: 2px solid var(--mid-grey);
    }
    
    .language-toggle-mobile li a{
        color: var(--mid-grey);
    }
    
    .language-toggle-mobile li.is-active a{
        color: var(--primary);
    }
    
    .site-header .menu a{
        color: var(--primary);
    }
    
    .site-header .menu a:hover,
    .site-header .menu a:focus{
        color: var(--primary);
    }
    
}

[type='text'], 
[type='password'], 
[type='date'], 
[type='datetime'], 
[type='datetime-local'], 
[type='month'], 
[type='week'], 
[type='email'], 
[type='number'], 
[type='search'], 
[type='tel'], 
[type='time'], 
[type='url'], 
[type='color'], 
textarea{
    border: 1px solid var(--mid-grey);
    box-shadow: none;
    margin-top: 0.5rem;
    padding: 0.6rem;
    height: auto;
}

[type='text']:hover, 
[type='password']:hover, 
[type='date']:hover, 
[type='datetime']:hover, 
[type='datetime-local']:hover, 
[type='month']:hover, 
[type='week']:hover, 
[type='email']:hover, 
[type='number']:hover, 
[type='search']:hover, 
[type='tel']:hover, 
[type='time']:hover, 
[type='url']:hover, 
[type='color']:hover, 
textarea:focus{
    border: 1px solid var(--primary);
    box-shadow: none;
}

[type='text']:focus, 
[type='password']:focus, 
[type='date']:focus, 
[type='datetime']:focus, 
[type='datetime-local']:focus, 
[type='month']:focus, 
[type='week']:focus, 
[type='email']:focus, 
[type='number']:focus, 
[type='search']:focus, 
[type='tel']:focus, 
[type='time']:focus, 
[type='url']:focus, 
[type='color']:focus, 
textarea:focus{
    border: 1px solid var(--primary);
    box-shadow: none;
}

label{
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: var(--dark-text);
}

.section--login {
    margin: 0 auto;
    max-width: 40rem;
}
.section--login a:not(.button){
    color: var(--dark-text);
}

thead{
    background-color: #fff;
    border: none;
}

tbody tr:nth-child(odd){
    background-color: var(--primary-light-2);
}

tbody tr:nth-child(even){
    background-color: var(--primary-light-1);
}


.progress-meter{
    background-color: var(--primary);
}

.progress{
    background-color: var(--primary-light-2);
}


/**/



.shipping-select li a{
    background-color: var(--primary-light-1);
}

.shipping-select li.is-active a,
.shipping-select li:hover a{
    background-color: var(--primary-light-2);
}

.location-select {
    display: none;
}
.location-select.is-active {
    display: block;
}
.lab-locations.location-select.is-active {
    display: flex;
    width: 39rem;
    flex-wrap: wrap;
    gap: 1rem;
}
.lab-locations .location-select-option {
    flex: 1 1 18rem;
    margin-bottom: 0;
}

.location-select-option.is-active,
.location-select-option:hover{
    border: 2px solid var(--accent);
}

.location-select-option.is-active *,
.location-select-option:hover *{
    color: var(--dark-text);
}

.location-select-option.is-active h6,
.location-select-option:hover h6{
    color: var(--primary);
}

.location-select-option *{
    color: var(--mid-grey);
}

.location-select-option{
    border: 2px solid var(--light-grey);
}

.order-confirmation h3{
    color: var(--primary);
}

.order-confirmation h4{
    color: var(--dark-grey);
    font-weight: 500;
}

.order-review h3{
    color: var(--primary);
}

.cart-item h4{
    color: var(--primary);
}

.cart-info h3{
    color: var(--primary);
}


.cart-item .sub-tests {
    display: none;
    padding-top: 0.5rem;
}
.cart-item .sub-tests.visible {
    display: block;
}
.cart-item .sub-tests.unset {
    
}


.cart-item .sub-test:before {
    content: " ";
    cursor: pointer;
    width: 20px;
    height: 20px;
    position: absolute;
    border: 2px solid var(--primary);
    border-radius: 9999px;
    left: 5px;
    top: 1px;
}
.cart-item .sub-test:hover:before,
.cart-item .sub-test.selected:before {
    border-color: var(--accent);
    background-color: var(--accent);
}

.cart-item .sub-test {
    /*border-left: 5px solid rgba(255,255,255,0);*/
    padding-left: 2.5rem;
    margin: 0.5rem 0 1.5rem 0.5rem;
    cursor: pointer;
    position: relative;
    opacity: 0.5;
}
.cart-item .sub-tests.unset .sub-test,
.cart-item .sub-test:hover,
.cart-item .sub-test.selected {
    opacity: 1;
}




.quantity-selector .quantity-input input{
    border: 1px solid var(--primary);
}

.quantity-selector .quantity-input button{
    color: var(--primary);
    background: var(--accent);
}

ul.account-side-nav li a{
    color: var(--dark-grey);
    border-left: 5px solid #fff;
}

ul.account-side-nav li.is-active a,
ul.account-side-nav li:hover a{
    border-left: 5px solid var(--primary);
    color: var(--primary);
}

.dashboard-block a{
    border: 1px solid var(--light-grey);
}

.dashboard-block a p{
    color: var(--dark-text);
}

.account-nav li a{
    background-color: var(--background-2);
    border-bottom: 4px solid var(--background-2);
    color: var(--dark-grey);
}

.account-nav li.is-active a,
.account-nav li:hover a{
    background-color: var(--primary-light-1);
    border-bottom: 4px solid var(--primary);
    color: var(--primary);
}

.account-nav li a svg path{
    stroke: var(--dark-grey);
}

.account-nav li.is-active a svg path,
.account-nav li:hover a svg path{
    stroke: var(--primary);
}

.account-alert{
    background-color: var(--primary-light-1);
}

.account-alert *{
    color: var(--primary);
}

.cart-item{
    background-color: var(--primary-light-1);
}

.result-details h6 a{
    color: var(--dark-text);
    text-decoration: underline;
}

.result-details h6 a:hover,
.result-details h6 a:focus{
    color: var(--dark-text);
}

.order-details-list li{
    border-right: 1.5px solid var(--dark-text);
}

.order-details-list li:last-child{
    border-right: none;
}

.account-body ul {
    margin-left: 2.25rem;
}
.account-body ul.shipping-select {
    margin-left: 0;
}

.account-body select,
.form-section select{
    height: auto;
    padding: 0.6rem 1.5rem 0.6rem 0.6rem;
    border: 1px solid var(--mid-grey);
    font-family: inherit;
    font-size: 1rem;
    font-weight: normal;
    line-height: 1.5;
    margin-top: 0.5rem;
}

.account-body label.checkbox .checkmark{
    border: 1px solid var(--mid-grey);
    background-color: var(--background-1);
}

.account-body label.checkbox input[type="checkbox"]:checked ~ .checkmark{
    border: 1px solid var(--accent);
    background: var(--accent);
}

.account-body label.checkbox .checkmark:after{
    border-color: var(--primary);
}

.edit-title{
    color: var(--primary);
}

.edit-title a{
    background-color: var(--primary-light-1);
}

@media only screen and (max-width: 640px){
    .account-screen-title{
        color: var(--dark-grey);
    }
    
    .my-account-screen.is-active .account-screen-title{
        color: var(--primary);
    }
}


/* ==========================================================================
  Typography
  ========================================================================== */
body {
    background: transparent;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: 'Jost', sans-serif;
}


h1{
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 40px;
    line-height: 40px;
    letter-spacing: 0.02em;
    margin-bottom: 1rem;
}

h2{
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 36px;
    line-height: 40px;
    margin-bottom: 1rem;
}

h3{
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 28px;
    line-height: 32px;
    margin-bottom: 1rem;
}

h4{
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    line-height: 28px;
    margin-bottom: 1rem;
}

h5{
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 1rem;
}

h6{
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    margin-bottom: 1rem;
}

h6.display{
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

p{
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
    margin-bottom: 1rem;
}
 
p.large{
    font-style: normal;
    font-weight: 400;
    font-size: 32px;
    line-height: 46px;
}

p.small{
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
}

small{
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
}

li{
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
}
 
a{
    font-family: 'Jost', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
}

/* ==========================================================================
  Global
  ========================================================================== */

section{
    padding: 4rem 0;
} 


.grid-container {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
}

.grid-container:not(.full) > .grid-padding-x {
    margin-right: -1.5rem;
    margin-left: -1.5rem;
}

.grid-padding-x > .cell {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
}

.cell > p:last-child,
.cell > h1:last-child,
.cell > h2:last-child,
.cell > h3:last-child,
.cell > h4:last-child,
.cell > h5:last-child,
.cell > h6:last-child,
.cell > .button:last-child{
    margin-bottom: 0;
}

svg{
    max-width: 100%;
}

.grid-padding-x .grid-padding-x{
    margin-right: -1.5rem;
    margin-left: -1.5rem;
}



.wp-block-image.alignwide {
    max-width: 80rem;
	margin: 1rem auto;
}

.wp-block-image.alignright,
.wp-block-image.alignleft{
	max-width: 60rem;
}

.wp-block-image .aligncenter {
    max-width: 60rem;
    padding: 0 1rem;
}

.wp-block-embed-youtube.aligncenter{
  text-align: center;
  padding: 4rem 0;
}

.embed-container { 
  position: relative; 
  padding-bottom: 56.25%; 
  height: 0; 
  overflow: hidden; 
  max-width: 100%; 
  margin-top: 2rem;
} 

.embed-container iframe, 
.embed-container object, 
.embed-container embed { 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
}

.wp-block-columns {
    padding-right: 1rem;
    padding-left: 1rem;
    max-width: 80rem;
    margin: 0 auto;
}


main > h1,
main > h2,
main > h3,
main > h4,
main > h5,
main > h6,
main > p,
main > ul,
main > ol,
main > blockquote{
	max-width: 50rem;
	margin-left: auto;
	margin-right: auto;
	padding: 0 1rem;
}

main > h1:last-child,
main > h2:last-child,
main > h3:last-child,
main > h4:last-child,
main > h5:last-child,
main > h6:last-child,
main > p:last-child,
main > ul:last-child,
main > ol:last-child,
main > .wp-block-image:last-child{
	padding-bottom: 4rem;
}

main > h1:first-child,
main > h2:first-child,
main > h3:first-child,
main > h4:first-child,
main > h5:first-child,
main > h6:first-child,
main > p:first-child,
main > ul:first-child,
main > ol:first-child,
main > .wp-block-image:last-child{
	padding-top: 4rem;
}


/* ==========================================================================
  Buttons
  ========================================================================== */

.button-group{
    margin: 0 -0.5rem;
}

.button-group .button{
    margin: 0 0.5rem;
}

.button,
.button-group .button{
    font-weight: 500;
    font-size: 20px;
    line-height: 29px;
    margin-bottom: 0;
    padding: 0.5rem 1rem;
    transition: all 0.3s ease;
}
  
/* ==========================================================================
  Header
  ========================================================================== */

.site-header{
    position: relative;
    padding: 2rem 0;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.05);
}

.header-menu-wrapper{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
 
.dropdown.menu > li.opens-right > .is-dropdown-submenu {
    top: 100%;
    right: 0;
    left: 0;
    min-width: auto;
}

.site-header .menu .button{
    margin-left: 1rem;
}

.site-header .language-dropdown{
    margin-right: 1rem;
    z-index: 2;
}

/* ==========================================================================
  Mobile Header
  ========================================================================== */
 

.mobile-menu-toggle{
    display: none;
}

.logo-mobile{
    display: none;
}

.language-toggle-mobile{
    display: none;
}

@media only screen and (max-width: 900px){
    
    .site-header .grid-container{
        position: relative;
    }
    
    .header-menu-wrapper{
        display: block;
        position: fixed;
        top: 81px;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 1rem;
        transform: translateX(100%);
        background: #fff;
        z-index: 99;
    }
    
    .header-menu-wrapper.transition{
        transition: all 0.6s ease;
    }
    
    .header-menu-wrapper.is-open{
        transform: translateX(0%);
    }
    
    .mobile-menu-toggle {
        display: flex;
        align-items: center;
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        padding: 1rem;
        cursor: pointer;
    }
    
    .mobile-menu-toggle .close{
        display: none;
    }
    
    .mobile-menu-toggle.is-open .close{
        display: block;
    }
    
    .mobile-menu-toggle.is-open .open{
        display: none;
    }
    
    .site-header{
        position: fixed;
        left: 0;
        right: 0;
        background-color: #fff;
        padding: 2rem 0;
        z-index: 99;
    }
    
    main{
        padding-top: 88px;
    }
    
    .header-menu-wrapper .language-dropdown{
        display: none;
    }
    
    .header-menu-wrapper .menu{
        display: block;
    }
    
    .header-menu-wrapper .menu li a{
        padding-left: 0;
    }
    
    .header-menu-wrapper .button{
        width: 100%;
        margin-top: 2rem;
    }
    
    .site-logo img{
        max-width: none;
    }
    
    .logo-mobile{
        display: inline-block;
    }
    
    .logo-desktop{
        display: none;
    }
    
    .language-toggle-mobile{
        display: flex;
        list-style: none;
        margin: 2rem 0 0 0;
        padding: 0;
    }
    
    .language-toggle-mobile li{
        padding-right: 1rem;
        margin-right: 1rem;
    }
    
    .language-toggle-mobile li:last-child{
        border-right: 0;
        margin-right: 0;
        padding-right: 0;
    }
    
    .site-header .menu a{
        font-weight: 500;
        font-size: 24px;
        line-height: 35px;
    }
    
   
}

/* ==========================================================================
  Footer
  ========================================================================== */
 
.site-footer{
    padding: 4rem 0;
}

.site-footer ul.footer-links{
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-footer ul.footer-links li a{
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    text-decoration: underline;
}

.site-footer ul.footer-links li{
    margin-bottom: 1rem;
}

.site-footer ul.footer-links li:last-child{
    margin-bottom: 0;
}

.logo-footer{
    margin-bottom: 2rem;
    display: block;
}

.sub-footer{
    padding-top: 2rem;
}

ul.social-nav{
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
}

ul.social-nav li{
    padding-right: 1rem;
}

.site-footer ul.social-nav{
    margin-top: 1rem;
}

.site-footer ul.menu li a{
    padding: 0 1rem 1rem 0;
}

.sub-footer-logo{
    margin-right: 1rem;
}

.sub-footer-logo img{
    width: 197px;
    max-width: 100%;
    margin-bottom: 1rem;
}

@media only screen and (max-width: 640px){
    .site-footer .sub-footer-logo{
        margin-top: 0;
        display: block;
    }
}


.sub-footer-logo:last-child{
    margin-right: 0;
}
 
 
.language-dropdown,
.language-dropdown ul{
  list-style: none;
  margin: 0;
  padding: 0;
}

.language-dropdown ul{
    position: absolute;
    display: none;
}

.language-dropdown li a{
    padding: 0.5rem 1.5rem 0.5rem 0.5rem;
    position: relative;
    display: inline-block;
    width: 100px;
    
}

.language-dropdown > li > a:after{
    content: "";
    display: block;
    width: 10px;
    height: 6px;
    background-image: url(img/icon-chevron-down.svg);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    position: absolute;
    right: 0.45rem;
    top: 0;
    bottom: 0;
    margin: auto;
}


.language-dropdown > li:hover ul{
    display: block;
}

@media only screen and (max-width: 1024px){
    
    .site-footer .language-dropdown{
        display: none;
    }
    
    .sub-footer-logo{
        margin-bottom: 1rem;
        display: inline-block;
    }
    
    .sub-footer-logo:last-child{
        margin-bottom: 0;
    }
    
    .site-footer p br{
        display: none;
    }
    
}

@media only screen and (max-width: 640px){
    .site-footer *{
        text-align: center;
    }
    
    .site-footer .social-nav{
        justify-content: center;
    }
    
    .sub-footer-logo{
        margin-left: 1rem;
        margin-right: 1rem;
        margin-top: 1rem;
    }
    
    .sub-footer-logo:last-child{
        margin-right: 1rem;
    }
    
    .site-footer ul.footer-links{
        padding-bottom: 2rem;
    }
    
    .logo-footer{
        display: inline-block;
        max-width: 195px;
    }
    
    .site-footer .menu a{
        display: inline-block;
    }
    
    .site-footer ul.social-nav li{
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    
    .site-footer ul.menu li a {
        padding: 0 1rem 1rem 1rem;
    }
}

/* ==========================================================================
  Sections
  ========================================================================== */

.section--impact{
    padding: 31rem 0 11rem 0;
    margin-bottom: 4rem;
    position: relative;
}

.impact-image{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.impact-image-mobile{
    display: none;
}
 
.section--impact h1{
    margin-bottom: 3rem;
}

.impact-bg{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -2;
}

.image-text-overlay{
    padding: 5rem  7rem 18rem 7rem;
    margin-bottom: 2rem;
}

.image-text-overlay p{
    color: #fff;
    text-align: center;
    font-weight: 600;
    font-size: 32px;
    line-height: 35px;
    letter-spacing: 0.02em;
    margin: 0;
}

.gak-story-intro-text{
    padding: 2rem 0;
    border-top: 1px solid var(--mid-grey);
    position: sticky;
    bottom: 0;
    background-color: #fff;
}

.block-callout-inner{
    padding: 12rem 4rem;
    text-align: center;
}

.block-callout-inner h2{
    margin-bottom: 2rem;
}

.intro-column-inner{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.section--our-process{
    padding: 8rem 0;
    margin: 4rem 0;
}

.section--our-process .cell img{
    margin-bottom: 2rem;
    max-height: 5rem;
}

.section--our-process .grid-x{
    padding-top: 4rem;
}

.section--our-process .button{
    margin-top: 4rem;
}

.section--our-process .cell{
    position: relative;
}

.section--our-process .cell:after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    height: 20px;
    width: 26px;
    background-image: url(img/icon-arrow-right-yellow.svg);
    background-size: contain;
    background-position: center center;
    margin: auto;
    background-repeat: no-repeat;
}

.section--our-process .cell:last-child:after{
    content: none;
}

ul.check-list,
.section--text-with-image ul{
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.check-list li,
.section--text-with-image ul li{
    padding-left: 2.5rem;
    position: relative;
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    padding-bottom: 1rem;
    padding-top: 1rem;
}

ul.check-list li:last-child,
.section--text-with-image ul li:last-child{
    padding-bottom: 0;
}

ul.check-list li:after,
.section--text-with-image ul li:after{
    content: "";
    width: 24px;
    height: 24px;
    background-image: url(img/icon-checkmark.svg);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.section--text-with-image .grid-container > h2{
    margin-bottom: 3rem;
}

.section--text-with-image .button{
    margin-top: 1rem;
}

.section--text-with-image ul + .button,
.section--text-with-image ul + .button-group{
    margin-top: 1rem;
}

.section--text-with-image .cell h2{
    margin-bottom: 2rem;
}

.section--text-with-image .cell p + h3{
    margin-top: 2rem;
}

.section--image-banner{
    padding: 6rem 0;
    margin-top: 4rem;
}

.section--image-banner .grid-container{
    position: relative;
}

.section--image-banner img,
.section--image-banner svg{
    position: absolute;
    right: 0;
    bottom: -3rem;
    width: 33.33333%;
}

.section--image-banner h2{
    margin-bottom: 2rem;
}

.resource-callout{
    padding: 4rem;
    height: 100%;
}

.resource-callouts{
    padding-top: 3rem;
}

.section--resources .cell{
    position: relative;
}

.section--resources svg,
.section--resources img{
    width: calc(100% + 10rem);
    max-width: calc(100% + 10rem);
    margin-left: -10rem;
    margin-bottom: -6rem;
}

.section--resources input[type="text"]{
    border: 1px solid var(--mid-grey);
    box-shadow: none;
    padding: 0.66rem;
    height: auto;
    font-weight: 400;
    font-size: 20px;
    line-height: 22px;
}

.search-input{
    position: relative;
}

.search-input button[type="submit"]{
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    padding: 0.5rem 1rem;
    cursor: pointer;
}

ul.accordion{
    margin-bottom: 0;
}

.accordion-wrapper{
  padding: 2rem;
  margin-bottom: 3rem;
}

.accordion-title{
    border: none;
    padding: 1rem 2rem 1rem 0;
    font-weight: 500;
    font-size: 24px;
    line-height: 28px;
}

.accordion-content{
    padding: 1rem 0;
}

.accordion-title:hover, .accordion-title:focus {
    background-color: transparent;
}

:last-child:not(.is-active) > .accordion-title{
    border-bottom: none;
}

.accordion-content{
    border: none;
}

:last-child > .accordion-content:last-child{
    border-bottom: none;
}

.accordion-content p:last-child{
    margin-bottom: 0;
}

.accordion-wrapper-titles{
    margin-bottom: 1rem;
}

.accordion-wrapper-titles p:last-child{
    margin-bottom: 2rem;
}

.regions-select{
    text-align: center;
    padding-bottom: 2rem;
    max-width: 45rem;
}

.regions-select ul{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.regions-select ul li{
    padding: 1rem;
}

.section-titles{
    padding-bottom: 2rem;
    text-align: center;
    max-width: 40rem;
}

.section-titles.wide{
    max-width: 50rem;
}

.section-titles h1{
    margin-bottom: 2rem;
}

.regions-select ul li a{
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
}

.accordion-title::before {
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    display: flex;
    align-items: center;
}

.contact-info-block{
    padding-bottom: 2rem;
}

.contact-info-block:last-child{
    padding-bottom: 0;
}

.contact-privacy{
    padding-top: 2rem;
}

.contact-privacy hr{
    margin-bottom: 2rem;
}

.section--contact label{
    margin-bottom: 2rem;
}

.section--login .grid-container{
    max-width: 40rem;
}

.section--login label{
    margin-bottom: 2rem;
}

.section--login .button{
    display: inline-block;
    margin: 0 auto 2rem auto;
}

.section--login a:not(.button){
    text-decoration: underline;
}

.section--login p:last-child{
    margin-bottom: 0;
}

.section--register .grid-container{
    max-width: 50rem;
}

.scrollable-content {
    position: relative;
    /*height: 590px;*/
    /*overflow-y: auto;*/
    /*padding: 1rem;*/
    margin-bottom: 1rem;
}

/*.scrollable-content:after{*/
/*    content: "";*/
/*    position: absolute;*/
/*    bottom: 0;*/
/*    left: 0;*/
/*    right: 0;*/
/*    height: 9.5rem;*/
/*    background: linear-gradient(180deg, rgba(252, 252, 252, 0) 0%, var(--background-2) 100%);*/
/*    pointer-events: none;*/
/*}*/

.scrollable-content-container {
    height: 590px;
    overflow-y: auto;
    padding: 1rem;
}

label.checkbox input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
    margin: 0;
}

label.checkbox .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    transition: background-color 0.3s ease;
}

label.checkbox .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

label.checkbox .checkmark:after {
    left: 5px;
    top: 2px;
    width: 6px;
    height: 11px;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

label.checkbox input[type="checkbox"]:checked ~ .checkmark:after {
    display: block;
}



label.checkbox {
    position: relative;
    padding-left: 2rem;
    margin-bottom: 1rem;
    font-weight: 400;
    font-size: 14px;
    cursor: pointer;
    margin-top: 2rem;
    margin-bottom: 2rem;
    padding-top: 3px;
}

.register-form{
    display: none;
}

.register-form .grid-container{
    padding: 0;
}

.form-divider{
  padding-bottom: 2rem;  
}

.phone-number-verification,
.email-verification{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.phone-number-verification .phone-number,
.email-verification .email{
    padding-right: 1rem;
}

.email-verification .email{
    width: 50%;
}

.phone-number-verification .phone-code,
.email-verification .email-code{
    width: 30%;
    padding-left: 1rem;
}

.phone-number-verification a,
.email-verification a{
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0.01em;
    text-decoration-line: underline;
}

.phone-number-verification a:hover,
.phone-number-verification a:focus,
.email-verification a:hover,
.email-verification a:focus{
    text-decoration: none;
}

h3.primary.account-screen-title{
    margin-bottom: 2rem;
}


/* ==========================================================================
  User dashboard
  ========================================================================== */

.account-header {
    padding-bottom: 2rem;
}
.account-header h4,
.account-header p{
    margin: 0;
}

.account-nav{
    display: flex;
    align-items: center;
    margin: 2rem 0 0 0;
    padding: 0;
    list-style: none;
}

.account-nav li{
    width: 100%;
    text-align: center;
}

.account-nav li.is-unread span,
.dashboard-block.is-unread a h4 {
    position: relative;
}
.account-nav li.is-unread span:after,
.dashboard-block.is-unread a h4:after {
    content: "";
    position: absolute;
    width: 22px;
    height: 22px;
    right: -13px;
    top: -24px;
    background: no-repeat url('/wp-content/themes/getakit/img/exclamation.svg');
    background-size: contain;
}

.account-body{
    /*padding-top: 2rem;*/
}

.dashboard-block{
    height: 100%;
}

.dashboard-block *:last-child{
    margin-bottom: 0;
}

.account-alert div:last-child p {
    margin-bottom: 0;
}

.account-nav li a svg{
    margin-right: 0.5rem;
}

.dashboard-block a{
    display: block;
    padding: 1rem;
    border-radius: 8px;
    height: 100%;
    transition: all 0.3s ease;
}

.dashboard-block a:hover,
.dashboard-block a:focus{
    
}

.dashboard-block h4 svg{
    margin-left: 1rem;
}

.account-nav li a{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
}

.account-nav li,
.account-nav li a{
    height: 100%;
}

.account-alert{
    padding: 1rem;
    margin-bottom: 2rem;
    position: relative;
}

.alert-close{
    position: absolute;
    top: 1rem;
    right: 1rem;
    cursor: pointer;
}

.dashboard-blocks .cell{
    padding-left: 1rem;
    padding-right: 1rem;
}

.grid-container:not(.full) > .grid-padding-x.dashboard-blocks{
    margin-left: -1rem;
    margin-right: -1rem;
}

ul.account-side-nav{
    list-style: none;
    padding: 0;
    margin: 0 0 3rem 0;
}

ul.account-side-nav li a{
    padding-left: 1rem;
    display: inline-block;
}

ul.account-side-nav li{
    padding: 0 0 1rem 0;
    border-left: 5px solid #fff;
}

tbody th, 
tbody td {
    padding: 1rem 0.75rem;
}

.progress{
    height: 20px;
    margin-bottom: 2rem;
}

.account-body select,
.form-section select{
    display: block;
    width: 213px;
    margin-bottom: 2rem;
    background-image: url(img/icon-select-arrow.svg);
    background-size: 13px 8px;
}

.form-section select{
    width: 100%;
}

.form-section label.checkbox{
    margin-bottom: 1rem;
}

.form-section .button-group{
    margin-top: 1rem;
}

.account-body select + .button{
    margin-top: 1rem;
}

.order-test-step:not([data-step="1"]){
    display: none;
}

.cart-item{
    padding: 1rem;
    height: 100%;
}

.order-deatils-table td{
    vertical-align: top;
}

.result-details{
    display: none;
}

.account-body .button-group{
    margin: 0 -0.5rem;
}

.account-body .button{
    margin-top: 2rem;
}

.account-body .grid-container.cart{
    padding: 2rem 0;
}

.quantity-selector{
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.quantity-selector .quantity-input{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-left: 2rem;
}

.quantity-selector .quantity-input button{
    width: 24px;
    height: 24px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
}

.quantity-selector .quantity-input input{
    width: 24px;
    height: 24px;
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
    margin: 0 0.5rem;
    text-align: center;
    padding: 4px 0 0 0;
}

.quantity-selector > span{
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
}

.cart-info{
    padding-top: 3rem;
}

.account-body .grid-container.shipping{
    padding: 0;
}

.account-body .grid-container.order-review{
    padding: 0;
}

.location-select-option{
    padding: 2rem;
    margin-bottom: 2rem;
    cursor: pointer;
}

.location-select-option p:last-child{
    margin-bottom: 0;
}

.shipping-select{
    list-style: none;
    margin: 0;
    padding: 0;
}

.shipping-select li a{
    padding: 1rem;
    display: block;
    position: relative;
}

.shipping-select li{
    margin-bottom: 0.5rem;
}


.shipping-select li a:after{
    content: "";
    position: absolute;
    right: 1rem;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 8px;
    height: 15px;
    background-image: url(img/icon-chevron-right.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.account-body h2{
    margin-bottom: 2rem;
}

.order-confirmation .cell{
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.order-details-list{
    display: flex;
    list-style: none;
    margin: 0 0 2rem 0 !important;
    padding: 0;
}

.order-details-list li{
    padding-right: 1rem;
    padding-left: 1rem;
}

.order-details-list li:first-child{
    padding-left: 0;
}

.account-body label.checkbox .checkmark:after {
    left: 6px;
    top: 2px;
}

.account-body label.checkbox{
    font-weight: 400;
    font-size: 18px;
    line-height: 22px;
}

.account-body label.checkbox .checkmark {
    top: 3px;
    left: 0;
}

.account-body label input[type="text"]{
    width: 60%;
}

.edit-title{
    margin: 2rem 0;
    display: flex;
    align-items: center;
}

.edit-title a{
    padding: 0.25rem;
    font-weight: 500;
    font-size: 12px;
    margin-left: 1rem;
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.edit-title a img{
    margin-left: 0.25rem;
}

.demographic-question{
    padding-bottom: 1rem;
}

.demographic-question + .button{
    margin-top: 1rem;
}

.my-account-screen label input[type="text"]{
    width: 100%;
}

.my-account-screen .grid-container{
    padding: 0;
}

/**/


.hub-repeater-card{
  padding: 2rem 1rem;
  border: 1px solid #ccc;
  transition: all 0.3s ease;
}

.section--callouts.hub-repeater .cell{
  padding-bottom: 2rem;
}

.section--callouts.hub-repeater{
  padding-bottom: 2rem;
  padding-top: 0;
}

.hub-repeater-card{
  position: relative;
  display: flex;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.hub-repeater-card p{
  font-size: 14px;
}

.hub-repeater-card p.hub-location{
  font-weight: 900;
  margin-top: 1rem;
  font-size: 18px;
}

.hub-repeater-card p.hub-name{
  font-size: 20px;
  font-weight: 900;
  margin-bottom: 1rem;
}

p.hub-name,
p.hub-language,
p.hub-email,
p.hub-text{
  margin: 0;
}

p.hub-text{
  margin-top: 1rem;
}

.hub-repeater-card{
  transition: all 0.3s ease;
  top: 0;
}

.hub-repeater-card-bg{
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.hub-repeater-image{
  max-width: 80%;
}

.hub-repeater-bg{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  /*opacity: 1;*/
  transition: all 0.3s ease;
  transform: translateZ(1px);
}

.hub-repeater-card--inner{
  position: relative;
  z-index: 2;
}

.hub-repeater-card:hover .hub-repeater-bg{
  opacity: 0.75;
}

.hub-repeater-card:hover{
  transform: scale(1.05);
}

.hub-repeater-card--inner.white *{
  color: #fff;
}

.hub-repeater-card--inner.white img{
  filter: brightness(0) invert(1);
}

.hub-repeater-card--inner.black *{
  color: #000;
}

.hub-repeater-card--inner.black img{
  filter: brightness(0) invert(0);
}

.hub-repeater-card--inner .hub-email{
  font-weight: 900;
  margin-top: 0.5rem;
  font-size: 18px;
}


.wp-block-column .wp-block-image.alignfull.size-large a img {
  transition: all 0.3s ease;
  transform: translateZ(1px);
}

.wp-block-column .wp-block-image.alignfull.size-large a:hover img {
  opacity: 0.75;
  transform: scale(1.05);
}

.hub-squares {
  padding-top: 0;
}

.hub-square {
  padding: 1rem;
  position: relative;
  transition: all 0.3s ease;
  transform: translateZ(1px);
}

.hub-square:hover {
  transform: scale(1.05);
  opacity: 0.75;
}

a.abs-link {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0; 
}

main > .gform_wrapper {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
    max-width: 75rem;
    margin-left: auto;
    margin-right: auto;
}

.section--accordion h2{
    margin-bottom: 2rem!important;
}

.reveal-fade,
.reveal-stagger{
    opacity: 0;
}


/* ==========================================================================
  Responsive
  ========================================================================== */


@media only screen and (max-width: 1600px){
    .section--impact {
        padding: 52vh 0 20vh 0;
    }
}


@media only screen and (max-width: 1024px){
    
    h1{
        font-size: 32px;
        line-height: 40px;
    }
    
    h2{
        font-size: 32px;
        line-height: 36px;
    }
    
    h3{
        font-size: 26px;
        line-height: 30px;
    }
    
    h4{
        font-size: 24px;
        line-height: 28px;
    }
    
    h5{
        font-size: 20px;
        line-height: 24px;
    }
    
    h6{
        font-size: 16px;
        line-height: 18px;
    }
    
    h6.display{
        font-size: 18px;
        line-height: 22px;
        letter-spacing: 0.2em;
    }
    
    p{
        font-size: 18px;
        line-height: 22px;
    }
     
    p.large{
        font-size: 28px;
        line-height: 40px;
    }
    
    p.small{
        font-size: 16px;
        line-height: 20px;
    }
    
    small{
        font-size: 14px;
        line-height: 16px;
    }
    
    li{
        font-size: 18px;
        line-height: 22px;
    }
     
    a{
        font-size: 18px;
        line-height: 22px;
    }
    
    .order-history-table a{
        display: flex;
    }
    
    .table-overflow{
        overflow-x: auto ;
    }
    
    .table-overflow > table{
        width: 100%;
    }
    
    table.order-history-table th {
        width: auto;
    }
    
    .site-logo img{
        max-height: 40px;
    }
    
}


@media only screen and (max-width: 640px){
    .impact-image{
        display: none;
    }
    
    .impact-image-mobile{
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
    }
    
    .section--impact {
        padding: 4rem 0 23rem 0;
        margin-bottom: 0;
        position: relative;
    }
    
    .section--impact .button-group{
        display: block;
        max-width: 80%;
        margin: 0 auto;
    }
    
    .section--impact .button-group .button{
        display: block;
        margin: 0 0 1rem 0;
    }
    
    .gak-story-intro-text{
        position: relative;
        border: none;
        margin-top: -5rem;
    }
    
    .section--gak-story-intro .intro-column-inner p.large{
        text-align: center;
    }
    
    .section--gak-story-intro .intro-column-inner .image-text-overlay{
        margin-top: 3rem;
        margin-bottom: 3rem;
    }
    
    .section--our-process {
        padding: 4rem 0;
        margin: 0;
    }
    
    .section--our-process .cell {
        position: relative;
        padding-bottom: 4rem;
        margin-bottom: 3rem;
    }
    
    .section--our-process .cell:last-child{
        margin-bottom: 0;
    }
    
    .section--our-process .cell:after {
        content: "";
        position: absolute;
        right: auto;
        top: auto;
        bottom: 0;
        height: 26px;
        width: 20px;
        background-image: url(img/icon-arrow-down-yellow.svg);
        background-size: contain;
        background-position: center center;
        margin: 0;
        background-repeat: no-repeat;
    }
    
    .section--our-process .button{
        margin-top: 0;
    }
    
    .section--text-with-image img{
        margin: 2rem 0;
    }
    
    .section--text-with-image + .section--text-with-image{
        padding-top: 0;
    }
    
    .block-callout-inner{
        padding: 4rem 4rem;
    }
    
    .section--block-callouts{
        padding: 0;
    }
    
    .mobile-text-center{
        text-align: center;
    }
    
    .section--image-banner {
        padding: 4rem 0;
        margin-top: 0;
        position: relative;
        overflow: hidden;
    }
    
    .section--image-banner img, .section--image-banner svg {
        position: absolute;
        right: -2rem;
        bottom: -2rem;
        width: 50%;
        height: auto;
    }
    
    .section--image-banner .grid-container {
        position: static;
    }
    
    .section--contact form{
        padding-bottom: 2rem;
    }
    
    .account-nav li a span{
        display: none;
    }
    
    .account-nav li a svg{
        margin-right: 0;
        height: 22px;
    }
    
    .dashboard-block {
        margin-bottom: 2rem;
        height: auto;
    }
    
    .dashboard-blocks .cell:last-child .dashboard-block{
        margin-bottom: 0;
    }
    
    .cart-item{
        padding: 1rem;
        height: auto;
        margin-bottom: 2rem;
    }
    
    .cell:last-child .cart-item{
        margin-bottom: 0;
    }
    
    .shipping-select + .button-group{
        margin-bottom: 2rem;
    }
    
    .account-body .grid-container.order-review .cell{
        padding-bottom: 2rem;
    }
    
    .account-body .grid-container.order-review:last-child{
        padding-bottom: 0;
    }
    
    .order-history-table td a{
        display: flex;
    }
    
    table.order-history-table th{
        /*width: auto;*/
        width: 100px;
    }
    
    table.order-history-table{
        table-layout: fixed;
    }
    
    .my-account-screen{
        display: block;
        padding-bottom: 1rem;
    }
    
    /*.account-screen-content{*/
    /*    display: none;*/
    /*}*/
    
    .my-account-screen.is-active .account-screen-content{
        display: block;
    }
    
    .account-body .button{
        margin-bottom: 1rem;
    }
    
    .account-screen-title{
        position: relative;
        cursor: pointer;
    }
    
    /*.account-screen-title::before {*/
    /*    position: absolute;*/
    /*    top: 0;*/
    /*    bottom: 0;*/
    /*    right: 0;*/
    /*    margin: auto;*/
    /*    display: flex;*/
    /*    align-items: center;*/
    /*    content: "+";*/
    /*}*/
    
    /*.my-account-screen.is-active .account-screen-title:before{*/
    /*    content: "–";*/
    /*}*/
    
    .account-body .button{
        margin-top: 1rem;
    }
    
    .gak-story-intro-text{
        padding-bottom: 0;
    }
    
    .image-text-overlay {
        margin-left: -1.5rem;
        margin-right: -1.5rem;
    }
    
    .section--image-banner .cell{
        text-align: center;
    }
    
    .section--image-banner .cell *:not(svg):not(img){
        position: relative;
        z-index: 2;
    }
    
    .section--image-banner img, .section--image-banner svg {
        position: absolute;
        right: -11rem;
        bottom: -11rem;
        left: -2rem;
        width: 43rem;
        height: auto;
        max-width: none;
        margin: auto;
    }
    
    .section--image-banner {
        padding: 4rem 0 21rem;
    }
    
    .section--resources input[type="text"]{
        padding-right: 3rem;
    }
    
    
    .section--gak-story-intro .cell.medium-5{
        display: flex;
        flex-direction: column;
    }
    
    .section--gak-story-intro .gak-story-intro-text{
        padding-bottom: 4rem;
        padding-top: 0;
        order: 1;
        margin: 0;
    }
    
    .section--gak-story-intro .cell > img{
        order: 2;
    }
    
    .section--gak-story-intro + .section--text-with-image{
        padding-top: 0;
    }
    
    .section--text-with-image .cell:not(.small-order-2) > img{
        margin-top: 0;
    }
    
    .section--text-with-image .cell.small-order-2 > img{
        margin-bottom: 0;
    }
    
}


@media only screen and (max-width: 440px){
    .section--image-banner img, .section--image-banner svg {
        width: 34rem;
    }
    
    .section--image-banner {
        padding: 4rem 0 14rem;
    }
}
















/* ==========================================================================
  Form Logic
========================================================================== */


.form-section{
  display: none;
}

.registration-form-intro{
  display: block;
}

.grid-x.form-section.is-active{
  display: flex;
}

.form-section{
  padding-bottom: 0;
}

.registration-form-intro{
  padding-bottom: 0;
}

.validation-block,
.mobile-validation-block,
.email-validation-block{
  display: none;
}

.send-confirmation,
.send-sms-confirmation,
.send-email-confirmation{
  margin: 1.5rem 0 0 0;
}

.form-section small{
  margin-bottom: 0.5rem;
  display: block;
}

.enter-code {
    display: flex;
    align-items: center;
}

.enter-code label {
    width: 8rem;
}
.enter-code .button,
.enter-code input[type="text"] {
    margin-bottom: 0;
}

.validation-block .button
.mobile-validation-block .button,
.email-validation-block .button{
  padding: 0.5rem 1rem;
  font-size: 14px;
  margin: 0;
}

.button-group-validation {
    padding-left: 1rem;
}

.validation-block input[type="text"],
.mobile-validation-block input[type="text"],
.email-validation-block input[type="text"]{
  margin-bottom: 0;
}

.validation-block .button:last-child,
.mobile-validation-block .button:last-child,
.email-validation-block .button:last-child{
  background-color: #aba828;
  
}

.validation-block .button:last-child:hover,
.mobile-validation-block .button:last-child:hover,
.email-validation-block .button:last-child:hover{
 border: 2px solid #aba828;
 color: #aba828;
 background-color: transparent;
}

.button-group-small-right{
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
}

input.email.disabled,
input.email-phone.disabled,
input.mobile-phone.disabled{
  background-color: #43AC6A;
  border: 1px solid #43AC6A;
  background-image: url(img/button_tick.svg);
  padding-right: 2rem;
  background-image: url(img/button_tick.svg);
  background-repeat: no-repeat;
  background-position: 98% center;
  color: #ccc;
  pointer-events: none;
  cursor: not-allowed;
}

label.disabled{
  cursor: not-allowed;
  pointer-events: none;
}

.form-section .cell.disabled{
  cursor: not-allowed;
}



.scrollable-content {
  height: 600px;
  overflow-y: auto;
  border: 3px solid #000;
  padding: 1rem;
  margin-bottom: 1rem;
  background: #fff;
  color: #333 !important;
}


.scrollable-content * {
  color: #333 !important;
}











/* custom radio buttons and checkboxes */

label.radio{
    position: relative;
    padding-left: 2.5rem;
    margin-bottom: 1rem;
    font-weight: 400;
    font-size: 18px;
    cursor: pointer;
    line-height: 22px;
}

label.radio:last-child{
  margin-bottom: 0;
}

label.radio input[type="radio"]{
  position: absolute;
  opacity: 0;
  cursor: pointer;
  
}

label.radio .checkmark{
  position: absolute;
  top: 0;
  left: 0;
  height: 22px;
  width: 22px;
  border-radius: 50%;
  transition: all 0.3s ease;
  
  border: 1px solid var(--mid-grey);
  background-color: var(--background-1);
}


label.radio:hover input[type="radio"] ~ .checkmark {
  background-color: var(--accent);
}

label.radio input[type="radio"]:checked ~ .checkmark {
  background-color: var(--accent);
}

label.radio input[type="radio"]:checked ~ input[type="text"]{
  display: block;
}

label.radio input[type="text"].active{
  opacity: 1;
  margin-top: 0.5rem;
  pointer-events: all;
}

label.radio input[type="text"]:not(.active){
  opacity: 0;
  height: 0;
  margin: 0;
  padding: 0;
  pointer-events: none;
}

.account-body label.radio{
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.visuallyhidden{
  display: none;
}
.hidden-by-pre-test-confirmation {
    display: none !important;
}

/*
#my-account input[type='text'], 
#my-account input[type='password'], 
#my-account input[type='date'], 
#my-account input[type='datetime'], 
#my-account input[type='datetime-local'], 
#my-account input[type='month'], 
#my-account input[type='week'], 
#my-account input[type='email'], 
#my-account input[type='number'], 
#my-account input[type='search'], 
#my-account input[type='tel'], 
#my-account input[type='time'], 
#my-account input[type='url'], 
#my-account input[type='color'], 
#my-account textarea,
#my-account select{
  border: none;
  border-radius: 5px;
  box-shadow: none;
  margin-top: 0.25rem;
}

#my-account form label{
  font-weight: 900;
}
#my-account form label i {
  display: block;
  font-weight: 400 !important;
}
*/


#message-bar {
    margin-bottom: 2rem;
    border-left: 4px solid #000;
    padding-left: 1rem;
    text-align: left;
}
    #message-bar.success {
        border-color: var(--primary);
    }
    #message-bar.fail {
        border-color: var(--accent);
    }
    
    
    
#password-strength li:after {
  content: "✗";
  color: var(--warning);
  font-weight: bold;
  padding-left: 0.75rem;
}
#password-strength li.is-valid:after {
  content: "✓";
  color: var(--success);
}


.account-tfa-form {
    max-width: 40rem;
    margin: 0 auto;
}
.account-tfa-form .enter-code {
    justify-content: center;
}
.account-tfa-form .login.enter-code {
    justify-content: flex-end;
}


.cart-item .grid-container {
    padding: 0;
}
.cart-item .cell.text-right select {
    margin-bottom: 0;
    margin-top: 0;
    width: 100%;
}
.cart-item .cart-item-description {
    margin-bottom: 0;
}
.grid-container.cart > .grid-x > .cell:not(.medium-4) {
    padding-bottom: 1rem;
}

.cart-item label {
    cursor: pointer;
    user-select: none;
}
.cart-item label input[type="radio"] {
    width: 30px;
    vertical-align: top;
    margin-top: 3px;
}
.cart-item label span {
    display: inline-block;
    width: calc(100% - 40px);
    vertical-align: top;
}
.cart-item-optin {
    background-color: var(--light-grey);
}
.removal_warning {
    margin-top: 1rem;
    text-align: left;
}
.strike {
    text-decoration: line-through;
}

.demographics-confirm {
    margin-left: 1rem;
}
.demographics-confirm .demographic-question h5 {
    margin-bottom: 0.5rem;
}

.address-options {
    display: flex;
    gap: 2rem;
}
.address-option {
    box-sizing: border-box;
    width: 50%;
}

.dashboard-block a.is-active,
.dashboard-block a:hover {
    border-color: #000;
}

.grid-container.my_account > .section > .grid-container{
    padding-left: 0;
    padding-right: 0;
}




/*updates for inline styles*/

img.impact-image-block {
    position: absolute;
    bottom: 0;
    left: -50%;
    right: -50%;
    width: auto;
    max-width: none;
    z-index: -1;
    object-fit: cover;
    margin: 0 auto;
}

.section--impact{
    overflow: hidden;
}

main > main{
    padding-top: 0!important;
}

.impact-image-block-mobile{
    display: none;
}

.image-text-overlay-block{
    position: relative;
    overflow: hidden;
    padding: 5rem 7rem 18rem 7rem;
    margin-bottom: 2rem;
}

.image-text-overlay-block > img{
    position: absolute;
    bottom: 0;
    top: -10%;
    left: -50%;
    right: -50%;
    width: auto;
    max-width: none;
    z-index: -1;
    object-fit: inherit;
    margin: 0 auto;
}


.image-text-overlay-block > p{
    color: #fff;
    text-align: center;
    font-weight: 600;
    font-size: 32px;
    line-height: 35px;
    letter-spacing: 0.02em;
    margin: 0;
}

@media only screen and (max-width: 800px){
    img.impact-image-block {
        left: -75%;
        right: -50%;
        width: 250vw;
        max-width: none;
    }
    
    .image-text-overlay-block > img{
        left: -75%;
        right: -50%;
        width: 250%;
        max-width: none;
    }
}

@media only screen and (max-width: 640px){
    img.impact-image-block{
        display: none;
    }
    
    .impact-image-block-mobile {
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0rem;
        z-index: -1;
        max-width: none;
        width: calc(100% - 0rem);
        max-width: 32rem;
        object-fit: cover;
        margin: 0 auto;
    }
    
    .image-text-overlay-block > img {
        left: -50%;
        right: -50%;
        width: 200%;
        max-width: none;
    }
}

@media only screen and (max-width: 450px){
    .section--impact {
        padding: 4rem 0 18rem 0;
    }
}

@media only screen and (max-width: 375px){
    .section--impact {
        padding: 4rem 0 15rem 0;
    }
}

.account-body input.mobile-validation-code,
.account-body input.mobile-phone{
    padding: 0.72rem .6rem;
}

.account-body input.button.send-sms-confirmation{
    margin-top: 27px;
}

form#edit-mobile .cell{
    padding-right: 0.5rem;
    padding-left: 0.5rem;
}

form#edit-mobile .grid-padding-x{
    margin-left: -0.5rem;
    margin-right: -0.5rem;
}

form#edit-mobile input[type="submit"]{
    margin-top: 1rem;
}

input.button.resend-sms-confirmation{
    
}

.mobile-validation-block .button-group-small-right{
    display: flex;
    justify-content: flex-end;
    margin-top: 27px;
    gap: 10px;
    
}

.mobile-validation-block .button-group-small-right .button{
    margin: 0;
    font-size: 18px;
}

@media only screen and (max-width: 1175px){
    .mobile-validation-block .button-group-small-right .button{
        padding: 0.5rem;
        font-size: 16px;
    }
}

@media only screen and (max-width: 1024px){
    .mobile-validation-block .button-group-small-right{
        justify-content: center;
    }
    
    form#edit-mobile input[type="submit"] {
        margin: 2rem auto 0 auto;
        display: block;
    }
}

.section--registration-form p:last-child{
    margin-bottom: 1rem!important;
}