@charset "utf-8";
/* CSS Document */
* {
margin: 0;
}

body {
font-family: Arial, Helvetica, sans-serif;
}

a img {border: none;}

img {
    max-width: 100%;
    height: auto;
}

h1, h2, h3, h4, h5, h6 {
font-family: "Century Gothic", Arial, Helvetica, sans-serif;
font-weight:lighter;
color: #AE002B;
padding: .5em 0 .5em 0;
}
p {padding: .5em 0;
	line-height: 160%;
}

legend {
	font-family: Arial, Helvetica, sans-serif;
	color: #AE002B;
	font-style:italic;
	font-weight: bold;
}
label {
	font-family: Arial, Helvetica, sans-serif;
	font-style:normal;
}
#container {
	width: 100%;
	height:100%;
	margin: 0 auto;
	padding: 0 auto;
}
#header{
width: 100%;
margin: 0 auto;
padding: 0 auto;
}
#header .icons{
	float:right;
	padding: .25em;
	}
/* ~~ These are styles for the dropdown nav. ~~ */

#nav_hh {display: none;}

#nav_hh_image {display: none;}

/* ~~ hide the sub~~ */
#nav ul ul {
	display: none;
}

#nav ul li:hover > ul {
		display: block;
		font-family: Arial, Helvetica, sans-serif;
		font-size: .85em;
	}
/* ~~ main menu~~ */
#nav ul {
	width: 80%;
	padding: 0 10%;
	background: #451525;
	list-style: none;
	position: relative;
	display: inline-table;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	z-index: 400;

}

#nav ul.public {
	background: #6F1D33;
	margin-top: -.3em;
}
#nav ul:after {
		content: ""; clear: both; display: block;
}
/* ~~ list items~~ */

#nav ul li {
	float: left;
}
#nav ul li:hover {
	background: #AE002B;
	}
#nav ul li:hover a {
	color: #FFF;
	}
#nav ul li a {
	display: block;
	padding: .5em 2em;
	color: #FFF;
	text-decoration: none;
	}

/*~~ submenus ~~*/
#nav ul ul {
	background: #AE002B;
	padding: 0 auto;
	border: 1px solid #CCC;
	position: absolute;
	top: 100%;
}
#nav ul ul li {
		float: none; 
		border-bottom: 1px solid #CCC;
		position: relative;
	}
#nav ul ul li:hover a {
	color: #FFF;
	}
#nav ul ul li a {
	text-decoration: none;
	}

/*~~sub-sub-menus~~*/
#nav ul ul ul {
	position: absolute; left: 100%; top:0;
}

/* ~~ This ends the styles for the dropdown nav. ~~ */

#banner {
	margin: 0 auto;
	max-width: 1200px !important;
	padding: 0 10%;
	background: #FFF;
}
#banner_hh {display: none;}

#date {
	font-size: smaller;
	margin: 0 auto;
background: #451525;
color: #FFF;
padding: 0 10%;}
	
#content {
	margin: 2em auto;
	padding: 0 10%;
	height: 100%;
	max-width: 1200px !important;
}

#content a:link {color: #AE002B;}
#content a:visited{color: #451525; text-decoration: none;}
#content a:hover{color: #451525;}
#content a:active{color: #451525;}
#content a:focus{color: #451525;}

#content li {
	line-height: 160%;
	list-style-image:url(images/bullet.gif);

}
#content img {
    max-width: 100%;
    height: auto;
	padding: .5em;
}
.button {
    border: #6F1D33 medium solid;
	background-color: #e7e7e7;
	width: 30%;
	margin-left:60%;
	border-radius: .5em;
    padding: 1em;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 1em;
	box-shadow: 0 .3em .3em 0 rgba(0,0,0,0.24), 0 .3em .3em 0 rgba(0,0,0,0.19);
}


/* --- go to top ------------------------------- */

/* BackToTop button css */
#scroll {
    position:fixed;
    right:10px;
    bottom:10px;
    cursor:pointer;
    width:50px;
    height:50px;
    background-color:#AE002B;
    text-indent:-9999px;
    display:none;
    -webkit-border-radius:60px;
    -moz-border-radius:60px;
    border-radius:60px
}
#scroll span {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-8px;
    margin-top:-12px;
    height:0;
    width:0;
    border:8px solid transparent;
    border-bottom-color:#ffffff
}
#scroll:hover {
    background-color:#CCC;
    opacity:1;filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
}
/* --- End go to top --- */


#footer {
	padding: 15px 10% 5% 10%;
	background: #451525;
	color: #FFF;
}

#footer  a:link {color: #FFF; text-decoration: none;}
#footer  a:visited {color: #FFF; text-decoration: none;}
#footer  a:hover {color: #FFF; text-decoration: underline;}
#footer  a:focus {color: #FFF; text-decoration: underline;}
#footer  a:active {color: #FFF; text-decoration: underline;}

/*RESPONSIVE FORM */
/* Style inputs, select elements and textareas */
input[type=text], select, textarea{
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  resize: vertical;
}

/* Style the container */
.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 1em;
}

/* Floating column for labels: 25% width */
.col-25 {
  float: left;
  width: 25%;
  margin-top: 6px;
}

/* Floating column for inputs: 75% width */
.col-75 {
  float: left;
  width: 75%;
  margin-top: 6px;
}
/* Floating column for inputs: 75% width */
.col-100 {
  float: left;
  width: 100%;
  margin-top: 6px;
}


/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .col-25, .col-75, input[type=submit] {
    width: 100%;
    margin-top: 0;
  }
}

/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

.sectionsix {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 2.5%;
}

.col:first-child { margin-left: 0; }

.colsix {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}
.colsix:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

.groupsix:before,
.groupsix:after { content:""; display:table; }
.groupsix:after { clear:both;}
.groupsix { zoom:1; /* For IE 6/7 */ }

/*  GRID OF THREE  */
.span_3_of_3 { width: 100%; }
.span_2_of_3 { width: 65.83%; }
.span_1_of_3 { width: 31.66%; }

/*  GRID OF SIX  */
.spansix_6_of_6 {width: 100%;}
.spansix_5_of_6 {width: 83.06%;}
.spansix_4_of_6 {width: 66.13%;}
.spansix_3_of_6 {width: 49.2%;}
.spansix_2_of_6 {width: 32.26%;}
.spansix_1_of_6 {width: 15.33%;}

@media only screen and (max-width: 1160px) {
	#nav ul {
	width: 90%;
	padding: 0 5%;
	}
	#content{	
		padding: 0 10%;
	}

}

@media only screen and (max-width: 1030px) {
	#nav ul {
	font-size: 1em;
}
}
@media only screen and (max-width: 860px) {
	#nav ul {
	width: 98%;
	padding: 0 1%;
}
	#content{	
		padding: 0 2%;
	}

}
@media only screen and (max-width: 760px) {
	#nav ul {
	font-size: .9em;
}
}
@media only screen and (max-width: 708px) {
	#nav ul {
	font-size: .8em;
}
}
@media only screen and (max-width: 650px) {
#nav {display:none;}

#nav_hh {
	display: block;
	font-family:"Century Gothic", Arial, Helvetica, sans-serif;
	font-size: 1.2em;
	line-height: 200%;
	padding-bottom:2em;
	}
#nav_hh_image {
	display:block;
}
#nav_hh li {
	list-style-type:none;
    }
#nav_hh a {
	color: #AE002B;
	text-decoration: none;
    }
    
#nav_hh a:hover {
	color: #451525;
	text-decoration: none;
	}
			.black_overlay{
			display: none;
			position: absolute;
			top: 0%;
			left: 0%;
			width: 100%;
			height: 100%;
			background-color: black;
			z-index:101;
			-moz-opacity: 0.8;
			opacity:.80;
			filter: alpha(opacity=80);
		}
		.white_content {
			display: none;
			position: absolute;
			top: 4%;
			left: 2%;
			width:80%;
			height: 80%;
			padding: 1em;
			border: 2px solid #AE002B;
			background-color: white;
			z-index:102;
			overflow: auto;
		}
#footer {
	padding: 15px 0 5% 0;

}

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
	.col {  margin: 1% 0 1% 0%; }
	.span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
	
	.colsix {  margin: 1% 0 1% 0%; }
	.spansix_1_of_6, .spansix_2_of_6, .spansix_3_of_6, .spansix_4_of_6, .spansix_5_of_6, .spansix_6_of_6 { width: 100%; }
	
#banner {display: none;}
#banner_hh {display: block;
	margin: 0 auto;
	padding: 0 10%;
	background: #FFF;
}