﻿body {
	margin: 0;
	font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
	color: #66000;
	background-image: url('../Promo/BACKGROUNDCTHULHUPOG.jpg');
}

/* Slider Code */
/* Chrome, Safari, Opera */
@-webkit-keyframes slidy {
/* 0% { left: 0%; } */
20% { left: 0%; }
25% { left: -100%; }
45% { left: -100%; }
50% { left: -200%; }
70% { left: -200%; }
75% { left: -300%; }
95% { left: -300%; }
100% { left: -400%; }
}

@keyframes slidy {
/* 0% { left: 0%; } */
20% { left: 0%; }
25% { left: -100%; }
45% { left: -100%; }
50% { left: -200%; }
70% { left: -200%; }
75% { left: -300%; }
95% { left: -300%; }
100% { left: -400%; }
}

div#slider {
	overflow: hidden;
}

div#slider figure img {
	width: 20%;
	float: left;
}

div#slider figure {
	position: relative;
	width: 500%;
	margin: 0;
	left: 0;
	text-align: left;
	font-size: 0;
	-webkit-animation: slidy 25s infinite; /* Safari 4+ */;
	-moz-animation: slidy 25s infinite; /* Fx 5+ */;
	-o-animation: slidy 25s infinite; /* Opera 12+ */;
	animation: 25s slidy infinite;
}

/* Nested menus code - Define the body style */
/* We remove the margin, padding, and list style of UL and LI components */
#menuwrapper ul, #menuwrapper ul li {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* We float the li list to the left and apply background color and border right white and set the height to 25px. Note you can ignore the height if you do not want
*/
#menuwrapper ul li {
	float: left;
	background-color: white; /* border-right: solid 2px maroon;*/ /* height: 25px; */;
	line-height: 25px;
}

/* We apply the background hover color when user hover the mouse over of the li component */
#menuwrapper ul li:hover {
	background-color: #ffffff;
	position: relative;
}

/* We apply the link style */
#menuwrapper ul li a {
	padding: 0px 15px;
	color: #660000;
	display: inline-block;
	text-decoration: none;
}

/**** SECOND LEVEL MENU ****/
/* We make the position to absolute for flyout menu and hidden the ul until the user hover the parent li item */
#menuwrapper ul li ul {
	position: absolute;
	display: none;
}

/* When user has hovered the li item, we show the ul list by applying display:block, note: 25px is the menu height.  */
#menuwrapper ul li:hover ul {
	left: 0;
	top: 25px;
	display: block;
}

/* As the parent li has float:left property, we overwrite for the submenu (level 2) to float none (normal position)  */
#menuwrapper ul li ul li {
	float: none;
	width: 150px;
	background-color: white;
}

/* We change the background color for the level 2 submenu when hovering the menu */
#menuwrapper ul li:hover ul li:hover {
	background-color: #ffffff;
}

/* We style the color of level 2 links */
#menuwrapper ul li ul li a {
	color: #660000;
	display: inline-block;
	width: 200px;
}

/**** THIRD LEVEL MENU ****/
/* We need to hide the 3rd menu, when hovering the first level menu */
#menuwrapper ul li:hover ul li ul {
	position: absolute;
	display: none;
}

/* We show the third level menu only when they hover the second level menu parent */
#menuwrapper ul li:hover ul li:hover ul {
	display: block;
	left: 150px;
	top: 0;
}

/* We change the background color for the level 3 submenu*/
#menuwrapper ul li:hover ul li:hover ul li {
	background-color: transparent;
}

/* We change the background color for the level 3 submenu when hovering the menu */
#menuwrapper ul li:hover ul li:hover ul li:hover {
	background-color: transparent;
}

/* We change the level 3 link color */
#menuwrapper ul li:hover ul li:hover ul li a {
	color: #660000;
}

/* Clear float */
.clear {
	clear: both;
}

/* Menu Bar - Style 1 */
.style1 {
	font-size: 24px;
	color: #66000;
	font-family: Impact;
	margin: 0;
	top: 10em;
}

.style2 {
	color: #000000;
	font-family: "Courier New", Courier, monospace;
	font-weight: bold;
	font-size: 16;
}

/* Newsletter signup */
.container {
    position: relative;
    width: 100%;
    }
.style3 {
 position: float;
    left: 0px;
    top: 0px;
	margin: 1;
	font-family: "Courier New", Courier, monospace;
	font-size: 18px;
	font-weight: bold;
	color: #660000;
	
}

.style5 {
	font-size: x-large;
	color: #660000;
	font-family: "Courier New", Courier, monospace;
	background-color: transparent;
	font-weight: bold;
	font-style: normal;
	font-variant: normal;
	text-transform: none;
}

.style8 {
	font-size: 8px;
	font-weight: normal;
	font-variant: normal;
	color: #66000;
	font-family: "Courier New", Courier, monospace;
	
}

/* Footer Font Setting */
.style10 {
	font-size: 10px;
	font-weight: normal;
	font-variant: normal;
	color: #66000;
	font-family: "Courier New", Courier, monospace;
	
}

.style12 {
	font-size: 12px;
	font-weight: normal;
	font-variant: normal;
	color: #66000;
	font-family: "Courier New", Courier, monospace;
}

.style14 {
	font-size: 14px;
	font-weight: normal;
	font-variant: normal;
	color: #66000;
	font-family: "Courier New", Courier, monospace;
}

.style16 {
	font-size: 16px;
	font-weight: normal;
	font-variant: normal;
	color: #66000;
	font-family: "Courier New", Courier, monospace;
}

.style18 {
	font-size: 18px;
	font-weight: normal;
	font-variant: normal;
	color: #66000;
	font-family: "Courier New", Courier, monospace;
}

.style24 {
	font-family: Impact;
	font-size: 24px;
	color: #660000;
}

.style36 {
	font-family: Impact;
	font-size: 36px;
	color: #660000;
}

.style48 {
	font-family: Impact;
	font-size: 48px;
	color: #660000;
}

.style99 {
	font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif;
	font-size: 48px;
	color: #660000;
	a: link {color: #000000;
	a:visited {color: #8C8C8C;}
}

 


/*Responsive Styles*/
@media all and (min-width: 960px) {
/*Make dropdown links appear inline*/
ul {
	position: static;
	display: inherit;
}
/*Create vertical spacing*/
li {
	margin-bottom: 1px;
}
/*Make all menu links full width*/
ul li, li a {
	width: 100%;
}
}



