body{
	overflow-x:hidden;
	overflow-y:scroll;
}

.logo{
	cursor: pointer;
}

a:focus, a:hover {
  color: transparent;
  text-decoration: none;
}

#menu-button{
	cursor: pointer;
}

nav{
	background-color:rgba(0, 0, 0, 0);
	height:52px;
	width:100vw;
	position:absolute;
	top:0;
	left:0;
	z-index:9998;
}

nav p{
	font-family:"Helvetica Neue", Helvetica, Arial, sans;
	color:#fff  !important;
	padding:14px 0 0 30px  !important;
	font-size:14px !important;
	font-weight:100  !important;
	letter-spacing:1px  !important;
}

#menu-button{
	position:absolute;
	right:30px;
	top:50px;
	height:15px;
	width:20px;
	background-image:url('../png/menu.png');
	background-repeat: no-repeat;
	background-size: cover;
	z-index:9999;
}

#mainNav{
	height:30px;
	padding:4px;
	text-align:center;
	background-color: #333333;
}

#mainNav a{
	font-family:"Open Sans", Helvetica, sans-serif;
	margin:3px 15px 0 15px;
	color:#ffffff;
	text-decoration: none;
	font-size:12px;
	padding-top:5px;

}

.menu-selected{
	background-image:url('../png/menu-pressed.png') !important;
}

#menu-button img{
	height:15px;
}

.pink-bkgd{
	background-color:#FFB6C1;
}

#stickers{
	display:inline-block;
	position:fixed;
	top:95px;
	right:-100px;
	z-index:9997;
	text-decoration:none;
}

.sticker{
	padding-bottom:20px;
	display:block;
	position:relative;
	right:-180px;
	text-decoration:none;
	text-align:right;
	transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

.sticker p{
	padding-right:20px;
	text-decoration:none;
	color:#fff;
	display:none;
	text-shadow: 2px 2px 18px #000;
	margin: 0;
}

.sticker img{
	width:80px;
	vertical-align: middle;
}

.logo{
  height: 20px;
  margin-left: 20px;
  transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

.logo:hover{
	opacity: 0.5;

}

#topNav{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#8c8c8c+0,000000+100&0.65+0,0+100 */
background: -moz-linear-gradient(top,  rgba(140,140,140,0.65) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(140,140,140,0.65) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(140,140,140,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a68c8c8c', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */

  position: fixed;
  height: 90px;
}

#overlay{
	text-align: center;
	width:100vw;
	height:100vh;
	background-color:rgba(255, 255, 255, 1);
	position:fixed;
	top:0;
	left:0;
	z-index:9999;
	display:none;

	opacity:0;
}

#overlay h1{
	font-size:3em;
	font-weight:200;
	margin-bottom:50px;
}

#large-stickers{
	position:relative;
	top:45%;
	left:50%;
	transform:translate(-50%, -50%);
	width:100%;
}

#large-stickers a{
	padding:0 25px;
	position:relative;
	top:60vh;
	display:inline-block;
	text-decoration: none;
	width:18%;
	vertical-align: top;
}

#large-stickers p{
	color:#ffffff;
}

#large-stickers a:first-child{
	padding-left:0;
}

.large-sticker img{
	width:100%;
	max-width:130px;
	padding-bottom:30px;
}

.large-sticker{
	opacity:1;
	transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;

   /*prevent flicker*/
   -webkit-backface-visibility: hidden;
}

.large-stickers p{
	display: none;

	transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;

   /*prevent flicker*/
   -webkit-backface-visibility: hidden;
   margin: 0;
}

.large-selected img{
	opacity:0.3;
}

img.large-sticker:first-child{
	margin-left:0;
}

.hide{
	display:none;
}


.mobileBG{
	position: absolute;
	top: 0;
	height: 100%;
	margin-left: auto;
	margin-right: auto;
	/*left: 0;
	right: 0;*/
    z-index: 2;
}

#homepage-bkgd-image{
	right: 0 !important;
}

#links a:hover{
	color:#999999;
}

.scroll-btn{
	width:20px;
	position:absolute;
	bottom:30px;
	left:50%;
	z-index:6000;
}

#restart{
	position:absolute;
	top:35%;
	left:50%;
	transform:translate(-50%, -50%);
	color:#000000 !important;
	letter-spacing:1.5px;
	font-weight:400;

}

@media only screen and (max-height: 600px) { 

	/*.mobileBG{
		width:100%;
		height:auto;

	}*/
	
}

@media only screen and (max-width: 992px) { 
	.large-stickers{
		width:70%;
	}

}

@media only screen and (max-width: 880px) { 
	.large-stickers{
		width:100%;
	}

}

@media only screen and (max-width: 768px) { 

	
	.title-container img {
	  width: 100%;
	}

	#topNav{
		background:none;
	}

	#mainNav{
		height:40px;
		text-align: left;
	}

	#mainNav a{
		display:none;
	}

	#links{
		display:none;
	}

	.logo{
		margin-left:10px;
		margin-top:7px;
	}

	#menu-button{
		top:11px;
		right:10px;
	}

	#restart{
		display:none !important;
	}

	.scroll-btn{
		display:none;
	}

}


@media only screen and (max-width: 680px) { 



	#overlay{
		  position: fixed;
		  height: auto;
		  padding-bottom: 20px;
		  min-height: 100vh;
	}

	#large-stickers{
		  top: 0;
			  left: 0;
			  transform: none;
	}

	#large-stickers a{
		text-align: left;
		width: 100%;
	}

	#large-stickers p{
		display: inline-block;
		color:rgb(34, 34, 34) !important;
	}

	.large-sticker{
		opacity:1 !important;
	}

	.large-sticker img{
		  width: 60px;
		  padding-bottom: 10px;
		  margin-right: 10px;
	}

	.mobileBG{
		/*right:-100px;*/
	}

	#restart{
		display:none !important;
	}



}


@media only screen and (min-width: 1200px) { 
	#large-stickers{
		width:80%;
	}

}