html{
    width: 100%;
    height: 100%;
    overflow: hidden;
}
body{
    margin: 0 auto;
    width: 100%;
    height: 100%;
}
main{
    width: 60%;
}
p{
    padding-left: 3%;
    font-size: 1.1em;
}
img{
    position: absolute;
    z-index: 0;
}
aside{
    height: inherit;
}
p,
button{
    font-family: 'josefin_slabregular';
}
button{
    font-size: 19px;
}
div{
    background-color: #000000;
    width: 100%;
    height: 100%;
}
.title{
    font-family: "after_shokregular";
    z-index: 5;
    position: relative;
    font-weight: normal;
    margin: 0 auto;
    left: 15%;
    font-size: 6em;
    top: 35%;
}
.img-odd,
.img-even{
    float: left;
    z-index: 0;
}
.start-end-main{
    width: 100%;
    height: inherit;
}
.relax-but-dont-stop p{
    width: 90%;
    font-size: 2em;
    background-color: transparent;
    margin: 0 auto;
    position: relative;
    top: 11%;
    padding: 2.5%;
    left: 1%;
}
.text-odd,
.text-even{
    background-color: #000000;
    float: right;
    width: 41.36%;
    position: relative;
    z-index: 1;
}
.inner-text{
    color: #FFFFFF;
    width: 90%;
}
.continue-button-odd,
.continue-button-even{
    display: block;
    background-color: #FFFFFF;
    width: 50%;
    height: 50px;
    line-height: 25px;
    margin: 0 auto;
    padding: 8px;
    color: #000000;
    border: 2px solid #000000;
    text-align: center;
    outline: none;
    text-decoration: none;
    position: relative;
    margin-left: 10%;
    border-radius: 10px;
    transition: width 0.75s ease-in-out, line-height 0.75s ease-in-out;
}
.continue-button-odd:hover,
.continue-button-odd:active,
.continue-button-even:hover,
.continue-button-even:active{
    background-color: #000000;
    color: #FFFFFF;
    line-height: 45px;
    transition: background-color 0.75s ease-in-out, color 0.75s ease-in-out, width 0.75s ease-in-out, line-height 0.75s ease-in-out ;
    cursor: pointer;
}
.decision{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
}
#title{
    padding-left: 1.2em;
}
#title2{
    padding-left: 0px;
}
#cutsy,
#stale,
#work,
#love{
    width: 35%;
    margin: 0 0 0 10%;
}
#heart-gif{
    right: 25%;
}
#start-button,
#replay-button{
    margin: 0 auto;
    position: relative;
    top: 60%;
    font-size: 28px;
    background-color: #000000;
    color: #FFFFFF;
    border: 2px solid #FFFFFF;
}
#start-button:hover,
#replay-button:hover{
    background-color: #FFFFFF;
    color: #000000;
    transition: background-color 0.75s ease-in-out, color 0.75s ease-in-out, width 0.75s ease-in-out, line-height 0.75s ease-in-out ;
}
#replay-button{
    top: 20%;
}
#staleB,
#artsy{
    display: none;
}
#epiphany-button{
    top: 0;
}
#bgvid {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
}
#bgvid2 {
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    background-size: cover;
}
#door-walk{
    left: -12%;
}
#slider {
    opacity:1;
    transition: opacity 1s;
}
#slider.fadeOut {
    opacity:0;
}
#slider2 {
    opacity:1;
    transition: opacity 1s;
}
#slider2.fadeOut {
    opacity:0;
}
@font-face {
    font-family: 'josefin_slabregular';
    src: url('josefin-slab-unzip/josefinslab-regular-webfont.woff2') format('woff2'),
         url('josefin-slab-unzip/josefinslab-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'after_shokregular';
    src: url('after-shok-unzip/after_shok-webfont.woff2') format('woff2'),
         url('after-shok-unzip/after_shok-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}