/* homepage styles */

#primary-nav .header__menu .menu-item {
    font-size: 16px;
    font-weight: 600;
}
.header__menu-item {
    border-right:none !important;
}

.search-box {
    position: relative;
    width: 217px;
}

.search-box input[type="text"] {
    width: 100%;
    padding: 8px 38px 8px 16px;
    font-size: 14px;
    border: 1px solid #333;
    border-radius: 100px;
}

.search-box .fa-search {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    color: #888;
    font-size: 14px;
    pointer-events: none;
}

.items-in-cart {
    display:none;
    position: absolute; 
    top: -9px; 
    right: -9px; 
    padding: 0; 
    background: #F58220; 
    border-radius: 50%; 
    color: #FFF; 
    width: 21px; 
    height: 21px; 
    font-size: 12px; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    padding-right: 1px;
}

.header_topbar_phone .numeric_vanity_phone_number {
    font-weight:700; font-size:14px; color:#F58220;
}

.header_topbar_phone #header__phone_number_link {
    font-weight:700; font-size:14px; color:#3C3C3C;
}


.radius40 {
    border-radius: 40px;
}

.homepage-banner { 
    padding-bottom:60px; 
    height: 63vw;
    position: relative;
    background-repeat: no-repeat;
}

.banner-image {
    position: absolute;        /* Take it out of normal flow */
    top: 0;
    left: 0;
    width: 100%;               /* Fill the container */
    height: 100%;
    object-fit: contain;
    z-index: 0;                /* Put behind the content */
}	

.homepage-banner-content-container {
    width: 100%;
    max-width: 1160px;
    margin: auto;
    position: relative;
    height: 100%;
}

.homepage-banner-content {
    position: absolute;
    top: 20%;
    left: 0;
}

.homepage-banner-content a.inogen-button-orange {
    margin: 30px 0 60px;
}

.homepage-banner-specs {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-items: normal;
    padding: 30px 0;
    width:100%;
    max-width:1200px;
    margin: auto;
}
.homepage-banner-specs-block {
    width: 100%;
    max-width: 300px;
    margin: 30px 0;
    text-align: center;
    padding: 20px;
}

.homepage-banner-specs-block-icon {
    height: 40px;
}

.homepage-banner-specs-block-title {
    height: 60px;
}
.page--home .homepage-banner-specs-block-title h2 {
    font-size: 25px;
    font-weight: 800;
    color: #333;
}
.homepage-banner-specs-block p {
    font-size: 20px;
    color: #333;
}

.page--home h1 {
    margin: 30px auto 0;
    text-align: left;
    color: #FFF;
    font-size: 50px;
    text-transform: none;
    font-weight: 700;
}

.page--home h1 img {
    margin-bottom: -8px;
    margin-left: 5px;
}

.page--home h2 {
    font-size: 50px;
    font-weight: bold;
    color:#333;
    margin:30px auto;
    text-transform: none;
}

.page--home h2.thin-margin {
    margin:10px auto;
}

.page--home h2.orange {
    color:#F58220;
}

.page--home h2.white {
    color:#FFF;
}

.page--home h2.white span {
    color:#F58220;
}

.page--home h2.black {
    color:#333;
}

.page--home h2.black span {
    color:#F58220;
}

.page--home h3 {
    font-size: 36px;
    font-weight: bold;
    color:#333;
    margin:30px auto;
    text-transform: none;
}

.page--home h3.thin-margin {
    margin:10px auto;
}

.page--home p {
    font-size: 20px;
}

.page--home p.homepage-reference {
    font-size: 16px;
    margin-top: 60px;
}

.page--home .centered {
    text-align: center;
}

.page--home .padding-left30 {
    padding-left: 30px;
}

.page--home .two-columns {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.page--home .two-columns .column-left,
.page--home .two-columns .column-right {
    width:50%;
}

.page--home .disclaimer p {
    font-size: 14px;
    font-weight: bold;
    max-width:350px;
}

.page--home ul {
    font-weight:bold;
    padding-left:0;
}

.page--home a.inogen-link-orange-buynow {
    color: #333;
    text-decoration: none;
    font-weight: 800;
    font-size: 24px;
    margin-top: 30px;
    display: inline-block;
}

.page--home a.inogen-link-orange-buynow .fa {
    color: #F58220;
}

.page--home a.inogen-link-orange-buynow:hover,
.page--home a.inogen-link-orange-buynow:focus {
    color: #F58220;
}

.page--home a.inogen-link-orange-buynow:hover .fa,
.page--home a.inogen-link-orange-buynow:focus .fa {
    padding-left:5px;
}

a.inogen-button-orange,button.inogen-button-orange,input[type="submit"].inogen-button-orange {
    background-color: #F58220;
    color: #fff;
    padding: 15px 30px;
    font-size: 24px;
    font-weight: 700;
    border-radius: 20px;
    text-decoration: none;
    display: inline-block;
}

a.inogen-button-orange.margin-30-0 {
    margin: 30px;
}

a.inogen-button-orange.large-button,button.inogen-button-orange.large-button,input[type="submit"].inogen-button-orange.large-button {
    padding: 27px 92px;
    font-size: 36px;
    
}

a.inogen-button-orange.large-button {
    margin: 60px auto;
}

a.inogen-button-orange:hover,a.inogen-button-orange:focus {
    background-color: #e56b1f;
    text-decoration: underline;
}

button.inogen-button-orange:hover,button.inogen-button-orange:focus,input[type="submit"].inogen-button-orange:hover,input[type="submit"].inogen-button-orange:focus {
    background-color: #e56b1f;
}



.homepage-section-blue {
    background-color: #004C97;
    color: #fff;
    padding:20px 0;
}
.homepage-section-blue.padded {
    padding: 60px 0;
}

.homepage-section-blue-content {
    display:flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1210px;
    margin: auto;
}

.homepage-section-blue-left {
    width: 50%;
}
.homepage-section-blue-right {
    width: 50%;
    max-width:517px;
}

.homepage-section-gray {
    background-color: #F9F9F9;
}
.homepage-section-gray.padded {
    padding: 90px 0;
}
.homepage-section-gray .column-left{
    padding-right:60px;
}

.homepage-section {
    background-color: #FFF;
    padding:20px 0;
}
.homepage-section.padded {
    padding: 60px 0;
}
.homepage-section-content {
    width: 100%;
    max-width: 1125px;
    margin: auto;
    padding:0 20px;
}

.product-blocks-section {
    max-width: 1252px; 
    padding-top:45px;
}


.homepage-product-blocks {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: stretch;
}

.homepage-product-blocks img {
    max-width: 100%;
    height: auto;
}
.homepage-product-blocks .inogen-button-orange {
    font-size: 16px;
    padding: 8px 22px;
    border-radius: 8px;
}

.homepage-product-blocks-right {
    display: flex;
    flex-direction:column;
    justify-content: space-between;
    align-items: flex-start;
}

.homepage-product-block-main, .homepage-product-block-secondary {
    position: relative;
}

.homepage-product-block-main .homepage-product-block-content {
    position: absolute;
    top: 1.7vw;
    left: 2.7vw;
}

.homepage-product-block-secondary .homepage-product-block-content {
    position: absolute;
    top: 1.7vw;
    left: 1.7vw;
}

.homepage-product-block-content h3 {
    font-size: 30px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 1vw 0;
    line-height:100%;
}

.homepage-section table.comparison-table {
    width: 100%;
    border-spacing: 50px 10px;
    border-collapse: separate;
    margin: 0 auto;
    font-size: 24px;
    font-weight: 700;
}

.homepage-section .homepage-system-info ul li {
    font-size: 25px;
    font-weight: 700;
    line-height: 40px;
    padding-right: 30px;
}

.homepage-section table.comparison-table td, .homepage-section table.comparison-table th {
    text-align: center;
    border-bottom: 4px solid rgba(0, 0, 0, 0.05);
    padding: 15px 0;
}

.homepage-section table.comparison-table h2 {
    max-width: 500px;
    text-align: left;
    margin: 0;
}

.homepage-section table.comparison-table thead th:first-child {
    max-width: 500px;
    width:50%;
}

.homepage-section table.comparison-table thead th {
    width:25%;
}

.homepage-section table.comparison-table tbody td:first-child {
    text-align:left;
}


.homepage-testimonials {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.homepage-testimonials .testimonial {
    width: 100%;
    max-width: 353px;
    margin: 20px;
    border:1px solid #D9D9D9;
    position: relative;
}

.homepage-testimonials .testimonial .trustpilot-image {
    position: absolute;
    bottom: 57px;
    right: 10px;
}

.homepage-testimonials .testimonial:hover {
    background: #004C97;
    color: #fff;
}

.homepage-testimonials .testimonial .testimonial-text {
    height: 340px;
    line-height: 136%;
    margin:0;
    padding: 50px 28px 14px 28px;
    font-size: 24px;
    background-image: url("//cdn.inogen.com/wp-content/uploads/2025/06/homepage_quotemark-light.png");
    background-repeat: no-repeat;
    background-position-x: 43px;
    background-position-y: 15px;
}

.homepage-testimonials .testimonial:hover .testimonial-text {
    background-image: url("//cdn.inogen.com/wp-content/uploads/2025/06/homepage_quotemark-dark.png");
}

.homepage-testimonials .testimonial .trustpilot-image {
    width:82px;
    height:22px;
    background-image: url("//cdn.inogen.com/wp-content/uploads/2025/06/icon-trustpilot.png");
}

.homepage-testimonials .testimonial:hover .trustpilot-image {
    background-image: url("//cdn.inogen.com/wp-content/uploads/2025/06/icon-trustpilot-white.png");
}

.homepage-testimonials .testimonial .testimonial-author {
    background: #A7A7A7;
    margin:0;
    padding:14px 28px;
    color:#FFF;
    font-weight:500;
}

.homepage-testimonials .testimonial:hover .testimonial-author {
    background: #12406D;
    margin:0;
    padding:14px 28px;
    color:#FFF;
    font-weight:500;
}

/* Forms  */

.lead_form {
    border:none;
}

.form_button[disabled] {
    background: #C4C4C4 !important;
}

.prescribed_o2_patient_button.active {
    background-color: #F58220;
    color: #fff;
}

.form_field_error_message {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    padding: 5px 20px;
}

.form_system_error {
    border-radius: 16px;
}

.form_system_error h2 {
    color:#FFF;
}

.form_system_error p {
    color:#FFF;
    font-size:20px;
    text-align:left;
    margin: 24px;
    
}



.form_field_container.form_field_error {
    border: none;
}

.page--home .homepage-top-form h2 {
    font-size:30px;
    margin-bottom:0;
}

.homepage-top-form p {
    font-size:16px;
    font-weight:700;
    line-height:120%;
    color:#FFF;
}

.lead_form {
    background: transparent;
    border: none;
    color:#FFF;
    max-width:460px;
    width:100%;
}

.lead_form fieldset {
    padding:0;
}

.lead_form fieldset p {
    font-size:24px;
}

.lead_form fieldset .form_label {
    font-size:16px;
    margin-bottom:5px;
    display: inline-block;
}

.homepage-bottom-form {
    margin: auto;
}

.homepage-bottom-form h2 {
    font-size:30px;
    margin-top:0;
}

.homepage-bottom-form .lead_form {
    color:#333;
}

.homepage-bottom-form .lead_form_page {
    padding:0;
}

.homepage-bottom-form .checkmark,.homepage-bottom-form .checkbox_container input:checked~.checkmark {
    border: 1px solid #CECECE;
}



.form_input_text {
    padding:19px;
    border-radius: 15px;
    border: 1px solid #E3E3E3;
    color:#333;
}

.checkmark,.checkbox_container input:checked ~ .checkmark {
    border:1px solid #FFF;
}
.checkbox_container .checkmark:after {
    background-color: #F58220;
}
.checkbox_container {
    padding-left:40px;
}

.homepage-top-form fieldset a,
.homepage-top-form fieldset a:visited {
    color:#6EBCFC;
    text-decoration: underline;
}

.homepage-top-form fieldset a:focus {
    outline: auto;
}

.form_button_white {
    width: 200px;
    border: 1px solid #E3E3E3;
    padding: 16px;
    font-size: 24px;
    font-weight: 700;
    color: #1B1818;
    border-radius: 16px;
    margin-right: 16px;
    margin-bottom: 16px;
}

.form_footer p {
    text-align:left;
    font-size: 18px;
    font-weight:400;
}

.form_footer a,
.lead_form .form_footer p a,
.form_footer a:visited,
.lead_form .form_footer p a:visited {
    color:#FFF;
    text-decoration: underline;
    line-height: 150%;
}

.form_footer a:focus,
.lead_form .form_footer p a:focus {
    outline: auto;
}


/* FAQ */

.homepage-section-faq {
    padding: 30px 0 90px;
}

.faq-content {
    display: flex;
    justify-content: center;
    margin-top:30px;
}

.faq-content-items {
    width: 100%;
    max-width: 1200px;
}

.faq-content-category {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.faq-content-category-items {
    max-width: 100%;
    width: 100%;
}

.faq-content-category-item {
    background-color: #fff;
    /* border: 1px solid #e5e5e5; */
    margin: 0;
    width: 100%;
    border-collapse: collapse;
}

.faq-content-category-item-question {
    background-color: #FFF;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 20px 16px 0;
    border-radius: inherit;
}

.faq-content-category-item-question-additional {
    display:none;
}

.faq-content-category-item-question.active {
    color:#333;
}

.faq-content-category-item-question.active .faq-content-category-item-question-text {
    color: #333;
}

.faq-content-category-item-question:hover .faq-content-category-item-question-icon, .faq-content-category-item-question:focus .faq-content-category-item-question-icon {
    color: #333;
}

.faq-content-category-item-question-text {
    color: #333;
    font-size: 24px;
    font-weight: 500;
    margin: 0;
}

.faq-content-category-item-question-icon {
    color: #333;
    font-size: 20px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    width: 30px;
    min-width: 30px;
    margin-left: 30px;
}

.faq-content-category-item-answer {
    display: none;
    padding: 0;
}

.faq-content-category-item-answer-text {
    font-size: 16px;
    margin: 0 0 50px 0;
    padding: 0;
    line-height: 24px;
}

.faq-content-category-item-answer-text a {
    color: #00549E;
    text-decoration: underline;
}

.faq-content-category-item-answer-text p {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.faq-content-category-item-answer-text ul {
    padding-left: 20px;
}

.faq-content-category-item-answer-text a:hover {
    color: #00549E;
}

.faq-disclaimer {
    font-size: 12px;
}

.faq-disclaimers-section {
    width:800px;
    max-width:100%;
    text-align: left;
    margin: 30px auto 0;
}

.faq-disclaimers-section h2 {
    text-align: left;
    color: #F58220;
    margin-bottom: 0;
    font-size: 16px;
}

.faq-disclaimers-section ul {
    padding: 0;
    list-style: none;
    margin:0;
    font-size: 12px;
}

.faq-disclaimers-section li {
    padding: 5px 0;
}

.faq-disclaimers-section a {
    color: #00549E;
    text-decoration: underline;
}

#additional_faqs_link {
    font-size: 24px;
    font-weight: 700;
    color: #333;
    padding: 0 10px;
    border-bottom: 4px solid #333;
    margin-top: 60px;
    display: inline-block;
}

.page--home .homepage-section-disclaimers p {
    font-size: 16px;
    margin: 0;
}




/* media queries */

@media (max-width: 767px) {

    .header_topbar {
        padding-right:0 !important;
        justify-content: center !important;
    }

    .homepage-banner-content {
        top: 30px;
        left: 30px;
    }

    .homepage-banner-content h1{
        font-size:18px;
        margin:0;
    }

    .page--home h1 img {
        width: 25px;
        margin-bottom: -3px;
        margin-left: 4px;
    }

    .homepage-banner-content a.inogen-button-orange	{
        font-size: 14px;
        padding: 8px 16px;
        margin: 15px 0;
    }

    .homepage-banner-content img {
        width:125px;
        height: auto;
    }
    

    .homepage-section-blue-content {
        flex-direction: column;
        align-items: center;
    }

    .homepage-section-blue-left {
        padding-right: 0;
        width: 100%;
    }

    .homepage-section-blue.padded {
        padding: 30px;
    }

    .two-columns {
        flex-direction: column;
    }

    .page--home .two-columns .column-left, .page--home .two-columns .column-right, .homepage-section-blue-left, .homepage-section-blue-right {
        width: 100%;
        padding-right:0;
    }

    
    a.inogen-button-orange, button.inogen-button-orange, input[type="submit"].inogen-button-orange {
        margin-bottom:30px;
    }

    .product-blocks-section {
        padding-top: 0;
    }

    .page--home h2 {
        font-size: 30px;
        padding:0;
    }

    .page--home h2.orange {
        font-size: 30px;
        padding:0;
    }

    .page--home h3 {
        font-size: 28px;
        padding:0 15px;
    }

    .homepage-product-block-content h3 {
        padding:0;
    }

    .homepage-product-block-main,
    .homepage-product-block-secondary {
        width: 100%;
        margin-bottom: 30px;
    }

    .homepage-section-gray.padded {
        padding:30px;
    }

    .homepage-section-gray .two-columns{
        flex-direction: column-reverse;
    }

    .form_button_white {
        width: 100px;
        padding: 15px;
        font-size: 20px;
    }
    
    .homepage-section-content {
        padding: 0;
    }

    .homepage-section-content h2 {
        margin-top:0;
    }

    .homepage-section-faq {
        padding: 30px;
    }

    .homepage-section-faq h2 {
        margin:0;
    }

    .faq-content {
        margin:0;
    }

    
    .homepage-product-blocks .inogen-button-orange {
        margin-top: 10px;
    }
    

    .homepage-product-block-main .homepage-product-block-content,
    .homepage-product-block-secondary .homepage-product-block-content {
        left: 5vw;
        top: 5vw;
    }

    .page--home p {
        font-size: 20px;
        line-height: 30px;
    }

    .page--home h2.white {
        font-size: 28px;
    }

    .page--home a.inogen-button-orange.large-button {
        padding: 30px;
        font-size: 32px;
        margin: 60px 30px;
    }

    /* Comparision Table */

    .homepage-section table.comparison-table {
        width: 100%;
        border-spacing: 20px 10px;
        border-collapse: separate;
        margin: 0 auto;
        font-size: 20px;
        font-weight: 700;
    }

    .comparison-table {
        font-size: 20px;
        border-spacing: 20px 10px;
        margin: 0 auto;
    }

    .comparison-table td, .comparison-table th {
        padding: 10px 0;
    }

    .comparison-table h2 {
        font-size: 24px;
        max-width: 100%;
        padding:0;
    }

    /* FAQ */
    .faq-content-category-items {
        width: 100%;
    }

    .faq-content-category-item-question {
        padding: 20px 20px 20px 5px;
    }

    .faq-content-category-item-question-text {
        font-size: 24px;
        font-weight: 500;
        color:#333;
        padding:5px 0;
    }

    .faq-content-category-item-question-icon {
        margin-left:0;
    }

    .faq-content-category-item-answer {
        padding: 0;
    }

    .faq-content-category-item-answer-text {
        padding:0;
        font-size:16px;
        line-height: normal;
    }

    .faq-disclaimers-section {
        padding: 0 15px;
    }

    /* Testimonials */

    .homepage-testimonials .testimonial .testimonial-text {
        height: auto;
        padding-bottom:40px;
    }

    
    .homepage-banner-specs {
        flex-direction: column;
        align-items: center;
    }
    .homepage-banner-specs-block {
        margin:0;
    }
    .homepage-banner-specs-block {
        margin:0;
    }
    .homepage-banner-specs-block-title {
        height: auto;
        margin-bottom: 20px;
    }
    .homepage-banner-specs-block-title h2 {
        margin:0;
        font-size: 24px;
    }
    .homepage-banner-specs-block p {
        margin:0;
        font-size: 20px;
    }

    .homepage-bottom-form {
        padding:30px !important;
    }

    .page--home .homepage-section-disclaimers p {
        padding: 0 30px;
        line-height: 1.25;
    }

}