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: 85vh;
	background-size:cover;
	background-position: center 35vh;
	bottom: 15vh;
	position: absolute;
	-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;
	-webkit-transition: background-position-y ease-in-out 1s;
	-moz-transition: background-position-y ease-in-out 1s;
	-o-transition: background-position-y ease-in-out 1s;
	transition: background-position-y ease-in-out 1s;
	}
	
.upNext.next-noFeature .intro, .upNext.noThumb .intro {
	height: 100%;
    background-image: none !important;
    background: #aaaaaa;
    background: -moz-linear-gradient(top, #aaaaaa 50%, #dbdbdb 100%);
    background: -webkit-linear-gradient(top, #aaaaaa 50%,#dbdbdb 100%);
    background: linear-gradient(to bottom, #aaaaaa 50%,#dbdbdb 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aaaaaa', endColorstr='#dbdbdb',GradientType=0 );
    border-bottom: none;
    background-color: #c7c7c7;
	}

.upNext.nextClicked .intro {background-position: center 10%;z-index: -500;}
		
.upNext.next-full.nextClicked .intro {background-position: center 10%;z-index: -500;}

.upNext.next-noFeature .intro:after {
	content:'';
    position:absolute;
    left:0; top:0;
    width:100%;
    height:100%;
    background-color: #c7c7c7;
    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: 85vh;
    height: 15vh;
    /* overflow-y: hidden; */
    z-index: -10;
}

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

.nextText {
	position: absolute;
    width: 86%;
    color: #fff;
    top: -8.5rem;
    text-align: center;
    margin: auto;
    font-size: 2.5rem;
    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 {
	padding-bottom: 30vh;
}
#wrapper.next-noFeature {
	padding-bottom: 35vh;
}



#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);
	}

#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 h2, .content h3, .content h4, .content blockquote, .content .si-accordian, .content .box, .infoCircle, .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, #wrapper.next-noFeature {padding-bottom:41vh;}
	.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;}
}