@charset "UTF-8";
/* CSS Document */

/*Background Properties*/

.wrapper {
	background-color: rgba(255,255,255,0.44);
	width: 95%;
	max-width: 850px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 2%;
	border-top-left-radius: 56px;
	border-bottom-right-radius: 56px;
}
.footer {
	background-color: rgba(255,255,255,0.44);
	margin: 0;
	padding-top: 1%;
	padding-bottom: 1%;
	font-family: Verdana, sans-serif;
	font-size: 10px;
	text-align: center;
	color: rgba(0,0,0,1);
}
/*Content Box*/

.box_1 {
	width: 45%;
	float: left;
	margin-left: 3.5%;
	align-content:center;
}
.box_2 {
	width: 60%;
	margin-left: auto;
	margin-right: auto;
}
.clear {
	clear: both;
}
.clear_small {
	visibility: hidden;
}
/*Nav Bar*/

.nav_buttons {
	width: 22%;
	float: left;
	margin-left: 2.5%;
	clear: none;
	display: inline;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-bottom: -15px;
	border-top-left-radius: 0px;
}
.nav_buttons_selected {
	border-bottom: medium solid #0C0C0C;
	width: 22%;
	float: left;
	margin-left: 2.5%;
	clear: none;
	display: inline;
	padding-top: 0px;
	padding-bottom: 0px;
	margin-bottom: -15px;
}

/*Sub Nav Bar*/

.sub_nav {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 2%;
	margin-bottom: 3%;
	text-align: center;
	font-family: Verdana, sans-serif;
	font-size: 16px;
}
.sub_backcolor_about /*GREEN*/ {
	background-color: #6FCE6C;
}
.sub_backcolor_process /*YELLOW*/ {
	background-color: #ECE95D;
}
.sub_backcolor_games /*ORANGE*/ {
	background-color: #FFCC6F;
}
.sub_backcolor_outcomes /*PURPLE*/ {
	background-color: #C895FF;
}
/*Text Controlers*/

.header {
	font-family: Helvetica Neue, Helvetica, Verdana, Arial, sans-serif;
	font-size: 32px;
	text-align: center;
}
.header_sub {
	font-family: Helvetica Neue, Helvetica, Verdana, Arial, sans-serif;
	font-size: 20px;
	text-align: left;
	text-decoration: underline;
}
.text_main {
	font-family: Helvetica Neue, Helvetica, Verdana, Arial, sans-serif;
	font-size: 14px;
	text-align: left;
}
.text_figcation {
	font-family: Helvetica Neue, Helvetica, Verdana, Arial, sans-serif;
	font-size: 10px;
	text-align: left;
}
/*Image Controlers*/
.image_title {
	max-width: 800px;
	float: right;
	margin-right: 3%;
}
.image_character {
	width: 50%;
	align-content: center;
	margin-left: 20%;
	padding-left: 20px;
}
.image_character_purple /*PURPLE GUY ON OUTCOMES*/{
	width: 50%;
	margin-left: auto;
	margin-right: auto;
	margin-top: -250px;
}
.image_smallcharacter {
	width: 30%;
	margin-left: 2%;
	margin-bottom: -15%;
}
.image_pic_purple {
	width: 100%;
	border: medium solid #7D4C81;
}
.image_pic_orange {
	width: 100%;
	border: medium solid #FFCC6F;
}
.image_size {
	width: 100%;
}
/*Video Controlers*/

.video_size {
	width: 95%;
	max-width: 850px;
	margin-right: auto;
	margin-left: auto;
	background-color: #00BAC5;
	border-top-right-radius: 0px;
	border-top-left-radius: 15px;
	border-bottom-right-radius: 15px;
	border-width: thin;
	border-color: #00BAC5;
}
.video_scale {
	width: 100%;
	border: 0;
}
/*Image Carosel --- THE REST OF THE PAGE*/

/* Slideshow container */
.slideshow-container {
	max-width: 600px;
	position: relative;
	align-content: center;
	text-align: center;
	align-items: center;
	padding: auto;
	border: thick double #E78E13;
}
/* Next & previous buttons */
.prev {
	cursor: pointer;
	position: absolute;
	top: 12px;
	color: #E78E13;
	font-weight: bold;
	font-size: 25px;
	transition: 0.6s ease;
	border-radius: 0 3px 3px 0;
	left: 10px;
}
.next {
	cursor: pointer;
	position: absolute;
	top: 12px;
	color: #E78E13;
	font-weight: bold;
	font-size: 25px;
	transition: 0.6s ease;
	border-radius: 0 3px 3px 0;
	right: 10px;
}
/* Fading animation */
.fade {
	-webkit-animation-name: fade;
	-webkit-animation-duration: 1.5s;
	animation-name: fade;
	animation-duration: 1.5s;
}
 @-webkit-keyframes fade {
 from {
opacity: .4
}
 to {
opacity: 1
}
}
 @keyframes fade {
 from {
opacity: .4
}
 to {
opacity: 1
}
}
