/* WALLPAPERS */

.bg1 { background-image: url("/assets/themes/life-prime/images/chn/CHN_siteBG_01_BW.jpg"); background-position: 60% 50%; }
.bg2 { background-image: url("/assets/themes/life-prime/images/chn/CHN_siteBG_07_Duotone.jpg"); background-position: 50% 20%; }
.bg3 { background-image: url("/assets/themes/life-prime/images/chn/CHN_siteBG_11.jpg"); background-position: 60% 20%; }
.bg4 { background-image: url("/assets/themes/life-prime/images/chn/CHN_siteBG_13.jpg");  background-position: 60% 30%; }
.bg5 { background-image: url("/assets/themes/life-prime/images/chn/CHN_siteBG_15.jpg");  background-position: 80% 30%; }


body.mobile h1 {
    font-size: 2em;
}

body.mobile h2 {
    font-size: 1.8em;
}

h1.brand {
    letter-spacing: 0.3em;
    box-sizing: border-box;
}
    h1.brand span {
        display: block;
    }



h1.home-only {
    display: block;
}

h1.site-title {
    display: none;
}

.page-header .subtitle {
    cursor: pointer;
}
body.mobile .page-header .subtitle span {
    display: block;
}

body.mobile header.welcome p {
    font-size: 1em;
}

header.welcome > div.section-container {
    box-sizing: border-box;
}

.brand-bands {
    margin-top: 10em;
    border-top: solid white 0.2em;
    border-bottom: solid white 0.2em;
}

.page-header .subtitle {
    margin-top: 2em;
    font-weight: bold;
    font-size: 2em;
}

section.main-section {
    background-position: center center;
    background-size: cover;
}
    
    /*body:not(.mobile) section.main-section div.row {
        padding: 0.5em;
    }*/
    body:not(.mobile) section.main-section div.row a.button {
        /*width: 20%;*/
    }

    body.mobile section.main-section div.row a.button {
        display: block;
        margin: 1em 0;
    }


div.row a.button {
    display: inline-flexbox;
    vertical-align: top;
}


    

    .gallery-photos {
        height: 13.5em;
        overflow-y: hidden;
        padding: 0.5em 0;
    }
        .gallery-photos a
        {
            display: inline-block;
            border: none;
            width: auto;
            height: auto;
            margin: 0 0.5em 1em 0.5em;

            background-size: cover;
            background-position: center center;
            width: 12em;
            height: 12em;
            border: 0.5em solid white;
            box-shadow: rgba(0,0,0,0.8) 0 0.25em 1em;
            transition: box-shadow ease 0.3s;
        }
        .gallery-photos a:hover
        {
            box-shadow: rgba(0,0,0,1) 0 0.25em 1.25em;
        }



section.connect {
    /*background-image: url("/assets/themes/life-prime/images/chn/chn_sitebg_05.jpg");
    background-position: 45% 70%;*/
    background-image: url("/assets/themes/life-prime/images/chn/Connect.jpg");
    background-position: 25% 50%;
}

section.connect .section-container {
    min-height: 40rem;
}




.main-section.connect {
    text-align: right;
}
body.mobile .main-section.connect {
    text-align: center;
}
.main-section.connect .section-content {
    display: inline-block;
    position: relative;
    text-align: center;
    max-width: 40rem;   
    margin-top: 20rem;
}

body.mobile .main-section.connect .section-content {
    text-align: center;
    max-width: 100%;   
}

body:not(.mobile) .main-section.connect .section-content {

}
body.mobile .main-section.connect .section-container {
    background-color: rgba(0,0,0,0.6);
}


section.plant {
    background-image: url("/assets/themes/life-prime/images/chn/shovel.jpg");
    background-position: 60% 50%;
}


section.relaunch {
    background-image: url("/assets/themes/life-prime/images/chn/CHN_siteBG_07_Duotone.jpg");
    background-position: 50% 45%;
}



section.multiply {
    background-image: url("/assets/themes/life-prime/images/chn/CHN_siteBG_01_BW.jpg");
    background-position: 60% 60%;
}



       section.give {
            background-image: url("/assets/themes/life-prime/images/chn/timeline_bg.jpg");
            background-position: 50% 45%;
        }


section.stages {
    background-image: url("/assets/themes/life-prime/images/section-bg/stage_bg.jpg");
    background-position: center center;
    background-size: cover;
}

    section.stages > div.stages-container {
        background-color: rgba(255,255,255,0.3);
    }

    body:not(.mobile) section.stages > div.stages-container {
        padding-top: 1em;
        padding-right: 10%;
        padding-bottom: 1em;
        padding-left: 10%;
    }

    section.stages div.stage {
        position: relative;
        padding-bottom: 50%;
        background-color: black;
        box-shadow: rgba(0,0,0,0.5) 0 0 2em;
    }
    section.stages div.stage a {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;

        display: none;
    }
    section.stages div.stage a.displayed {
        display: block;
    }

    section.stages div.stage-buttons {
        margin-top: 0.5em;
        padding-bottom: 0.5em;
        display: flexbox;
    }
        section.stages div.stage-buttons a {
            background-color: #bb7e0f;
            margin-right: 0.5em;
            margin-left: 0.5em;
            cursor: pointer;
            display: inline-block;
            width: 100%;
            max-width: 4em;
            height: 1em;
        
            transition: background-color ease 0.2s;
            /*border: 0.07em solid rgba(0,0,0,0.4);*/
            box-shadow: rgba(0,0,0,0.8) 0 0.1em 0.25em;
        } 
        section.stages div.stage-buttons a.active {
            background-color: white;
        } 
        section.stages div.stage-buttons a:hover {
            background-color: rgba(50,50,50,1);
        }