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

#hero { 
	background: url( ../images/testgif.gif );
	width: 100%; 
}

	#hero-left {
		background-color: rgba( 0, 0, 0, 0.7 );	
		float: left;
		padding-left: 100px;
		padding-top: 125px;	
		position: relative;
		width: 50%;
	}

		#hero-title {
			left: 50%;
			position: absolute;
			top: 45%;
			transform: translate( -50%, -50% );
			z-index: 10;
		}

			#hero-h1 {
				animation: hero-h1-keyframe 5s ease 0s infinite normal none running;
				font-size: 4em;
				letter-spacing: 10px;
				padding: 0px 15px;
				text-shadow: var( --ts-white );
			}
			
			@keyframes hero-h1-keyframe {
				0% { color: var( --green ); }
				50% { color: var( --pink ); }
				100% { color: var( --green ); }
			}

			#hero-h3 {
				color: var( --pink );
				text-shadow: 3px 3px 0px var( --yellow );
			}

			#hero-sponsorTag {
				font-size: 1.3em;
				text-align: right;
			}

			#hero-logo-img { 
				border: 3px solid white;
				border-radius: 50px;
				float: right;
				left: 15px;
				position: relative;
				top: -50px;
				width: 45px;  			
				z-index: 10;
			} #hero-logo-img:hover { 
				border: 5px solid white;		
				width: 40px; 
			}

		/* END Hero Title */	

		#hero-menu {
			position: absolute;
			top: 65%;
			z-index: 10;
		}
	
			.hero-menu-btn { 
				color: var( --pink ); 
				text-shadow: 3px 3px 0px rgb(255, 255, 255); 
			} .hero-menu-btn:hover { 
				color: white; 
				text-decoration: none; 
				text-shadow: var( --ts-pink );
			}

			.hero-menu-btn-box { 
				width: 0px; 
				height: 15px; 
				background-color: white ;  
				display: inline-block; 
				padding-bottom: 5px; 
				margin-right: 15px;
				margin-bottom: 5px; 
				box-shadow: 3px 3px 0px #FF0067; 
			} .hero-menu-btn:hover > .hero-menu-btn-box { 
				width: 15px; 
			}
	
		/* END Hero Menu */

	/* END Left Hero */

	#hero-right {
		float: right;
		position: relative;
		width: 50%;
	}

		#hero-bgtransition {
			background: linear-gradient( to right, rgba(0,0,0,0.7), rgba(0,0,0,0.3) );	
			left: 0;
			position: absolute;
			top: 0;
			z-index: 2;
		}

		#hero-carousel {
			position: relative;
			left: 50%;
			transform: translate( -50%, 50% );
			width: 500px;
			z-index: 10;
		}

			#hero-carousel > div {
				border-left: 10px solid var( --pink );
				border-top: 10px solid var( --pink );
				box-shadow: 15px 15px 0px var( --yellow );
				width: 500px;
			}

			.carousel-indicators > li { 
				background-color: var( --green ); 
			} .carousel-indicators > .active { 
				background-color: var( --pink ); 
			} 
	
		/* END Carousel */
	
	/* END Right Hero */

} /* Desktop */