html {overflow-x:hidden;}

.upNext {
	display: block;
	position:absolute;
	bottom: 0;
	overflow:hidden;
	height: 45vh;
	width: 100%;
	-webkit-transition: height ease-in-out 1.5s;
	-moz-transition: height ease-in-out 1.5s;
	-o-transition: height ease-in-out 1.5s;
	transition: height ease-in-out 1.5s;
	}
.upNext:hover {opacity:1;}
.upNext.nextClicked {height:100vh;}

.upNext .intro {
	z-index: -5;
	height: 80vh;
	background-size:cover;
	background-position: center 35vh;
	bottom: 15vh;
	position: absolute;
	-webkit-transition: height ease-in-out 1.5s, bottom ease-in-out 1.5s, background-position-y ease-in-out 1s;
	-moz-transition: height ease-in-out 1.5s, bottom ease-in-out 1.5s, background-position-y ease-in-out 1s;
	-o-transition: height ease-in-out 1.5s, bottom ease-in-out 1.5s, background-position-y ease-in-out 1s;
	transition: height ease-in-out 1.5s, bottom ease-in-out 1.5s, background-position-y ease-in-out 1s;
	
	}
.upNext.nextClicked .intro {background-position: center center;z-index: -500;bottom: 20vh;}

.upNext.noThumb .intro {
    background: #dbdbdb;
	height: 250px;
    bottom: 15vh;
	-webkit-transition: bottom ease-in-out 1.5s;
	-moz-transition: bottom ease-in-out 1.5s;
	-o-transition: bottom ease-in-out 1.5s;
	transition: bottom ease-in-out 1.5s;
	}
		
.upNext.next-full.nextClicked .intro {
	background-position: center center;
	z-index: -500;
	}

.upNext.noThumb.nextClicked .intro {
    bottom: calc(100vh - 150px);
}


.upNext.next-noFeature .intro:after {
	content:'';
    position:absolute;
    left:0; top:0;
    width:100%;
    height:100%;
    background:#dbdbdb;
    opacity:0;

    -webkit-transition: opacity .5s;
    transition: opacity .5s;
}

.upNext.next-noFeature.nextClicked .intro:after {
    opacity:1;
}


.upNext section {position:relative;}

.upNext .main {
	top: 30vh;
	-webkit-transition: all ease-in-out 1.5s;
	-moz-transition: all ease-in-out 1.5s;
	-o-transition: all ease-in-out 1.5s;
	transition: all ease-in-out 1.5s;
	}
	
.upNext .main:hover {
	top: 25vh;
	}
	
.upNext.nextClicked .main {
    position: absolute;
    top: 80vh;
    height: 20vh;
    /* overflow-y: hidden; */
    z-index: -10;
}

.upNext.noThumb.nextClicked .main, .upNext.next-noFeature.nextClicked .main {
    top: 150px;
    height: calc(100vh - 150px);
}

.nextText {
	position: absolute;
    width: 86%;
    color: #fff;
    top: -7.5rem;
    text-align: center;
    margin: auto;
    font-size: 2.3rem;
    filter: drop-shadow(0px 0px 4px #000);
    opacity: 1;
    -webkit-transition: opacity ease-out .5s;
    -moz-transition: opacity ease-out .5s;
    -o-transition: opacity ease-out .5s;
    transition: opacity ease-out .5s;
}

.upNext.noThumb .nextText, .upNext.next-noFeature .nextText {height: 20vh;}

.upNext.nextClicked .nextText {opacity:0;}

span.post.categoryTitle {margin:initial;left:initial;}

#wrapper {
	bottom:0;
	padding-bottom: 45vh;
	-webkit-transition: all ease-in-out 1.5s;
	-moz-transition: all ease-in-out 1.5s;
	-o-transition: all ease-in-out 1.5s;
	transition: all ease-in-out 1.5s;
	background-color: initial !important;
}

#wrapper.next-Default-noThumb, #wrapper.next-full-noThumb, #wrapper.next--noThumb {
	padding-bottom: 33vh;
}
#wrapper.next-noFeature {
	/*padding-bottom: 60vw;*/
}



#wrapper .main {
	-webkit-box-shadow: 0px 4px 18px -3px rgba(0,0,0,0.32);
	-moz-box-shadow: 0px 4px 18px -3px rgba(0,0,0,0.32);
	box-shadow: 0px 4px 18px -3px rgba(0,0,0,0.32);
	border-bottom: solid 1rem #95210c;
	}

#wrapper.nextClicked {bottom: 100vh;padding-bottom:0;}

.socialFixed {
	opacity:1;
	-webkit-transition: opacity ease-out .5s;
	-moz-transition: opacity ease-out .5s;
	-o-transition: opacity ease-out .5s;
	transition: opacity ease-out .5s;
	}
.socialFixed.nextClicked {opacity:0;}

.nextFade {
	position: absolute;
    display: block;
    height: 5vh;
    width: 100%;
    bottom: 0;
    z-index: 300;
	background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	-webkit-transition: opacity ease-out .5s;
	-moz-transition: opacity ease-out .5s;
	-o-transition: opacity ease-out .5s;
	transition: opacity ease-out .5s;
	opacity:1;
}

.upNext.nextClicked .nextFade {opacity:0;}

/******************* ANIMATIONS *****************************/

.content p, .content .postDate, .content h2, .content h3, .content h4, .content blockquote, .content .si-accordian, .content .image, .menu-social-media-container {
	-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
	-moz-animation: fadein 2s; /* Firefox < 16 */
	-ms-animation: fadein 2s; /* Internet Explorer */
	-o-animation: fadein 2s; /* Opera < 12.1 */
	animation: fadein 2s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/******************* MEDIA QUERY ***********************************/
@media only screen 
and (max-width : 800px) {
	#wrapper {padding-bottom: 45vh;}
	.nextText {width: 100%;}
}

@media print {
	.upNext {
	display: none !important;
	}
	#wrapper {
	padding-bottom: 0 !important;
	}
}
@media only screen 
and (max-height : 900px) {
	#wrapper.next-Default-noThumb, #wrapper.next-full-noThumb {padding-bottom: 45vh;}
}