html, body{
	margin:0;
	height:100%;
	/*background:#3f3f40;*/
	font-family:Helvetica, Arial, sans-serif;
}


#wrapper{
	width:100%;
	min-width:200px;
	margin:0 auto;
	height:0 auto;
}

#content{
	width:40%;
	margin:0 auto;
	height:0 auto;
	background-color:#3f3f40;
	border:2px solid #929292;
}

#nav{
	width:100%;
	height:0px;
	text-align: center;
	margin:10px;
}

.button{
	font-size:16px;
	font-weight:bold;
	display:inline-block;
	width:15%;
	padding: 6px;
	margin-top:0px;
	border-radius:8px;
	text-align:center;
	text-decoration:none;
	color:#ffffff;
	padding:5px 5px 5px 5px;
	background-image:url("../images/buttontexture.jpeg");
	cursor:pointer;
}

.blue{
	font-size:16px;
	font-weight:bold;
	display:inline-block;
	width:15%;
	padding: 6px;
	margin-top:0px;
	border-radius:8px;
	text-align:center;
	text-decoration:none;
	color:#ffffff;
	padding:5px 5px 5px 5px;
	background-color:#1e66e3;
	cursor:pointer;
}

.red{
	font-size:16px;
	font-weight:bold;
	display:inline-block;
	width:15%;
	padding: 6px;
	margin-top:0px;
	border-radius:8px;
	text-align:center;
	text-decoration:none;
	color:#ffffff;
	padding:5px 5px 5px 5px;
	background-color:#ff0000;
	cursor:pointer;
}

h1{
	font-size:50px;
	font-family: "Rubik Scribble", system-ui;
	color:#077be0;
	text-align:center;
	background-image:url("../images/bg.jpg");
	padding: 20px 0 20px 0;
}

#boom{
	font-size:100px;
	font-family: "Rubik Scribble", system-ui;
	color:#ff4400;
	text-align:center;
	background-image:none;
	padding: 20px 0 20px 0;
	opacity: 0;
	transition: opacity 2s ease-in-out;
}

#pop{
	font-size:100px;
	font-family: "Rubik Scribble", system-ui;
	color:#331cff;
	text-align:center;
	background-image:none;
	opacity: 0;
	transition: opacity 2s ease-in-out;
}

#good_idea{
	font-size:50px;
	font-family: "Rubik Scribble", system-ui;
	color:#000000;
	text-align:center;
	background-image:url("../images/sky.jpg");
	padding: 20px 0 20px 0;
}

#explosion{
	font-size:50px;
	font-family: "Rubik Scribble", system-ui;
	color:#000000;
	text-align:center;
	background-image:url("../images/fire.jpg");
	padding: 20px 0 20px 0;
}

#taken{
	font-size:70px;
	font-family: "Rubik Scribble", system-ui;
	color:#fa0000;
	text-align:center;
	background-image:none;
	padding: 0px 0 0px 0;
	opacity: 0;
	transition: opacity 2s ease-in-out;
}

#taken_heading{
	font-size:50px;
	font-family: "Rubik Scribble", system-ui;
	color:#fa0000;
	text-align:center;
	background-image:url("../images/tape.jpg");
	padding: 20px 0 20px 0;
}

#shot_heading{
	font-size:50px;
	font-family: "Rubik Scribble", system-ui;
	color:#000000;
	text-align:center;
	background-image:url("../images/blood.jpg");
	padding: 20px 0 20px 0;
}

#shot{
	font-size:70px;
	font-family: "Rubik Scribble", system-ui;
	color:#fa0000;
	text-align:center;
	background-image:none;
	padding: 0px 0 0px 0;
	opacity: 0;
	transition: opacity 2s ease-in-out;
}

#bad_ass{
	font-size:50px;
	font-family: "Rubik Scribble", system-ui;
	color:#000000;
	text-align:center;
	background-image:url("../images/fire.jpg");
	padding: 20px 0 20px 0;
}


p{
	font-size:18px;
	color:#ffffff;
	margin:0;
}

p2{
	font-size:18px;
	color:#ffffff;
	margin:0;
	text-align:center;
}

strong{
	font-size:20px;
	color:#2ba9fc;
	text-decoration:underline;
	font-weight:bold;
}

strong2{
	color:#b80000;
	font-weight: bold;
	text-decoration: underline;
}

strong3{
	font-size:20px;
	color:#077be0;
	font-weight:bold;
}

strong4{
	font-size:25px;
	color:#077be0;
	font-weight:bold;
}

strong5{
	color:#000000;
	font-weight: bold;
	text-decoration:none;
	font-size:25px;
}

a{
	font-size:16px;
	font-weight:bold;
	display:inline-block;
	width:15%;
	padding: 6px;
	margin-top:0px;
	border-radius:8px;
	text-decoration:none;
}
#nav a:link, #nav a:visited{
	color:#ffffff;
	padding:5px 0 5px 0;
	background-image:url("../images/buttontexture.jpeg");
}

#nav a:active, #nav a:hover{
	color:#929292;
	padding:5px 0 5px 0;
	background-image:url("../images/buttontexture.jpeg");
}

.blue a:link, .blue a:visited{
	color:#ffffff;
	padding:5px 0 5px 0;
	background-color:#1e66e3 ;
}

.blue a:active,.blue a:hover{
	color:#929292;
	padding:5px 0 5px 0;
	background-color:#1e66e3;
}

.red a:link, .red a:visited{
	color:#ffffff;
	padding:5px 0 5px 0;
	background-color:#ff0000;
}

.red a:active, .red a:hover{
	color:#929292;
	padding:5px 0 5px 0;
	background-color:#ff0000;
}

#name{
	color:#000000;
	width:50%;
	margin:0 auto;
	height:0 auto;
	background-color:#3f3f40;
	font-weight:bold;
	text-align:center;
	border:2px solid #929292;

}

#enter{
	font-size:16px;
	font-weight:bold;
	display:inline-block;
	width:15%;
	padding: 15px;
	margin-top:0px;
	border-radius:8px;
	text-align:center;
	text-decoration:none;
	color:#ffffff;
	padding:5px 5px 5px 5px;
	background-image:url("../images/buttontexture.jpeg");
	cursor:pointer;
}

.dropdown{
	position: relative;
}

.dropdown__menu{
	position: absolute;
	border:2px solid #929292;
	width:14.5%;
	background-color:#3f3f40;
}

.dropdown__menu a:link, .dropdown__menu a:visited{
	display: block;
	color:#ffffff;
	background-color:#3f3f40;
}

.dropdown__menu a:active, .dropdown__menu a:hover{
	display: block;
	color:#929292;
	background-color:#3f3f40;
}

.dropdown__button{
	font-size:16px;
	font-weight:bold;
	display:inline-block;
	width:15%;
	padding: 6px;
	margin-top:0px;
	border-radius:8px;
	text-align:center;
	text-decoration:none;
	color:#ffffff;
	padding:5px 5px 5px 5px;
	background-image:url("../images/buttontexture.jpeg");
	cursor:pointer;
}

.hide{
	display: none;
}

#fade{
	width:100%;
	height:100%;
	background-color:rgb(0, 0, 0, 100%);
	color:#dddddd;
	text-align:center;
	padding:25% 0 0 0;
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	transition:opacity 2s;
}

.dpButton{
	font-size:16px;
	font-weight:bold;
	display:inline-block;
	width:100%;
	padding: 6px;
	margin-top:0px;
	border-radius:8px;
	text-align:center;
	text-decoration:none;
	color:#3f3f40;
	padding:5px 5px 5px 5px;
	background-color:#ffffff;
	cursor:pointer;
}