﻿@media all {
    /* mh_intro */
    #mh_intro { overflow-x:initial; }
    #mh_intro a.brand_info_circle { top:calc(var(--spacing-5L) * -1); width:calc(var(--font-size-5L) * 3.4); height:calc(var(--font-size-5L) * 3.4); background-color:var(--color-yellow); z-index:502; }
    #mh_intro a.brand_info_circle p { color:var(--color-black); }

    #mh_intro .info_group { grid-template-columns:3fr 7fr; }
    #mh_intro .info_group .quote { position:relative; width:calc(var(--spacing-5L) * 2.5); height:calc(var(--spacing-5L) * 2.5); background-color:var(--color-blue); }
    #mh_intro .info_group .quote .body { position:absolute; top:50%; right:var(--spacing-2L); left:var(--spacing-2L); transform:translateY(-50%); text-align:center; }
    #mh_intro .info_group .quote .body h2 { margin:0px; color:var(--color-white); font-size:var(--font-size-2L); line-height:1.2; }

    /* mh_transform */
    #mh_transform { position:relative; min-height:90vh; background-color:var(--color-blue); background-repeat:no-repeat; background-size:cover; background-image:url(/resources/images/pages/mental_health/i_transforming_lives.jpg); }
    #mh_transform .quote { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:90%; max-width:1400px; color:var(--color-white); font-size:var(--font-size-5L); font-weight:var(--font-weight-bold); text-align:center; }

    /* mh_how */
    #mh_how { background-color:var(--color-yellow); }

    /* mh_needs */
    #mh_needs .container_row_content { padding-bottom:calc(var(--spacing-5L) + var(--spacing-2L)); }

    #mh_needs h2 { margin-bottom:var(--spacing-3L); text-align:center; }

    #mh_needs .needs_group { position:relative; grid-template-columns:repeat(3, 1fr); z-index:2; }
    #mh_needs .needs_group ul { display:grid; grid-template-columns:1fr; gap:var(--spacing-1S); margin:0px; padding:0px; list-style:none; }
    #mh_needs .needs_group ul li { margin:0px; padding:0px; }

    #mh_needs .icon { position:absolute; right:0px; bottom:var(--spacing-2L); height:calc(var(--spacing-5L) * 1.4); max-height:600px; z-index:1; }

    /* mh_help */
    #mh_help .intro { width:70%; margin:0px auto var(--spacing-3L) auto; text-align:center; }
    #mh_help .intro p { font-size:var(--font-size-1L); font-weight:var(--font-weight-bold);}

    #mh_help h2 { margin-bottom:var(--spacing-1L);}

    #mh_help ul.help_list { gap:var(--spacing-3L); }

    /* mh_also */
    #mh_also p.title { font-size:var(--font-size-1L); font-weight:var(--font-weight-bold); }

    /* mh_pay */
    #mh_pay { background-color:var(--color-yellow); }
    #mh_pay .brand_info_circle { position:relative; top:initial; right:initial; margin:0px auto; width:calc(var(--font-size-5L) * 5); height:calc(var(--font-size-5L) * 5); color:var(--color-navy-blue); font-size:var(--font-size-0); font-weight:var(--font-weight-bold); background-color:var(--color-white); }
}

@media (max-width:1400px) {
    #mh_transform { min-height:80vh; }
}

@media (max-width:1200px) {
    #mh_intro a.brand_info_circle { display:none; }
    #mh_transform { min-height:60vh; }
}

@media (max-width:1000px) {
    #mh_intro .info_group { gap:var(--spacing-3L); }

    #mh_transform { min-height:40vh; }
}

@media (max-width:800px) {
    #mh_how .how_group { grid-template-columns:1fr; gap:var(--spacing-3L); }
    #mh_needs .needs_group { grid-template-columns:1fr 1fr;}

    #mh_intro .info_group { grid-template-columns:1fr; gap:var(--spacing-1L); }
    #mh_intro .info_group .quote { width:initial; height:initial; background-color:transparent; }
    #mh_intro .info_group .quote .body { position:relative; top:initial; right:initial; left:initial; transform:initial; text-align:initial; }
    #mh_intro .info_group .quote .body h2 { color:var(--color-black); }
}

@media (max-width:600px) {
    #mh_help ul.help_list { grid-template-columns:1fr; gap:var(--spacing-1L); text-align:center; }
}
