@import url('../../OneCol1/Css/OneCol1.css');

/* ############################################################################
   ## 
   ##  Landing Page
   ##
   ######################################################################### */

#Content {
}

    #Page {
    }

        #PageTop {
            display: none;
        }

        #SubHeader {
            padding: 204px 0;
            background-repeat: no-repeat;
            background-position: center center;
            background-size: cover;
            background-image: url("/images/sites/climatehub/banners/home-banner-1.jpg");
            background-color: var(--site-color-1); /* Accessibility fallback color */
            position: relative;
        }

            #SubHeader::before {
                content: "";
                position: absolute;
                left: 0px;
                top: 0px;
                width: 100%;
                height: 100%;
                background: linear-gradient(to right, #073745 0%, #073745 15%, transparent 100%);
            }

            #SubHeader h1,
            #SubHeader p {
                color: var(--site-color-white);
            }

            #SubHeader h1 {
                font-size: 480%;
                margin-top: 0;
                margin-bottom: 32px;
                line-height: 100%;
            }

                #SubHeader h1 .sub-h1 {
                    display: block;
                    font-size: 14px;
                    text-transform: uppercase;
                    letter-spacing: 15%;
                    color: var(--site-color-white);
                    line-height: 1;
                    font-weight: 300;
                    margin-bottom: 10px;
                }

            #SubHeader p {
                margin-bottom: 8px;
                line-height: 130%;
                font-weight: 300;
            } 
    
        #PageContent {
        }

            #Primary {
            }
        
            #Secondary {
            }

                #Secondary #SecondaryContent {
                    margin-left: -10000em;
                    margin-right: -10000em;
                    padding: var(--site-padding-thick) 10000em;
                }

        #PageBottom {
            display: none;
        }

        #Tertiary {
            display: none;
        }

@media screen and (min-width: 1201px) {

    #Primary #PageTitle {
        margin-bottom: var(--site-box-margin-bottom);
        text-align: center;
    }

}

@media screen and (max-width: 1200px) {

    #Header #AnchorMenu {
        /* display: block; */ /* Sometimes it's good to show the anchor menu on the home page in smaller screen views. */
    }

    #Header #MainMenu {
        /* display: block; */ /* Sometimes it's good to show the main menu on the home page in smaller screen views. */
    }

    #PrimaryContent {
        float: none;
        width: 100%;
    }

}

@media screen and (max-width: 900px) {

    #SubHeader {
        padding: 100px 0;
    }

}