@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/

img, object, embed, video {
	max-width: 100%;
}
html {
	position:relative;
	min-height:100%;
}
body {
	margin: 0 0 60px;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/* Mobile Layout: 480px and below. */

.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 87.36%;
	padding-left: 1.82%;
	padding-right: 1.82%;
}
#banner {
color:black;
padding-top: 10px;
padding-bottom: 10px;
margin-top: 10px;
margin-bottom:10px;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
border:1px dashed #999999;
}

#banner a {
color: black;
text-decoration: underline;
background: yellow;
font-family: Arial, Helvetica, sans-serif;
}

#buttons {
	clear:left;
	float:left;
	margin-left:0;
	margin-right:5px;
	margin-top:5px;
	width:100%
	display: block;
	text-align:left;
}

#header {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding-bottom:10px;
}
#nav {
	display:none;
}
#cssmenu {
	display:none;
}
#main {
	clear: none;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding: 0px 10px 10px 10px;
	font-size:14px;
}
#FBfeed {
	clear: none;
	float: left;
	margin-left: 0px;
	width: 292px;
	display: none;
}
#footer {
	position: absolute;
	bottom: 0px;
	left:15px;
	height: 60px;
	width: 90%;
	font-size: 11px;
	color: #666;
	text-align: center;
	padding-top: 15px;
	padding-bottom:5px;
	padding-left:2%;
	padding-right:1.5%;
	margin-left:auto;
	margin-right:auto;
}
#image {
	clear: none;
	float: left;
	margin-left: 0px;
	width: 100%;
	display: block;
}

a.to_nav {
display:inline-block;
float:left;
color:#fff;
background:#4e4e4e;
text-decoration:none;
padding:0 10px 0 10px;
margin-top:0px;
margin-bottom:10px;
font-size: 10px;
font-weight:bold;
line-height:22px;
height:22px;
text-transform:uppercase;
letter-spacing:.1em;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}

a.to_nav:hover, a.to_nav:focus {
color:#1c1c1c;
background:#ccc;
}

#sml-menu li {
clear:both;
float:right;
margin-left:0;
width:100%;
display:block;
}

#sml-menu li a {
color:#333333;
text-decoration:none;
height:20px;
margin:10px 10px 10px;
font-weight:normal;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
}

#sml-menu li a:hover,.current {
color:black;
text-decoration:underline;
}

h1 {
	color:#666;
}
h2 {
	color:#666;
	font-size:medium;
	text-decoration:overline;
}

#content {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	margin:0 0 60 0;
	padding-bottom:10px;
}

#content a {
	background-color:#D6EBFF;
	font-size:14px;
}
#content p {
	font-size:14px;
}
#content li {
	font-size:14px;
	padding:3px 0 3px 0;
}
.nestedlist h2 {
color:#999;
}

.nestedlist h3 {
font-style:bold;
font-family:Arial, Helvetica, sans-serif, Palatino, serif;
padding: 0;
margin: 0;
margin-top: 5px;
}

.nestedlist p {
font-family: Arial, Helvetica, sans-serif;
margin:0;
padding:0;
}
.textbox {
padding: 15px;
margin: 15px;
color:#555555;
background-color:#eeeeee;
font-size:14px;
font-family: Arial, Helvetica, sans-serif;
}
.textbox a {
	background-color:#D6EBFF;
}
.picture { 
background-color: #F9F9F9;
border: 1px solid #CCCCCC; 
padding: 5px;
font: 11px/1.4em Arial, sans-serif; 
text-align:center;
}

.picture img { 
border: 1px solid #CCCCCC;
vertical-align:middle;
margin-bottom: 3px; 
}

.right { 
margin: 0.5em 0pt 0.5em 0.8em; 
float:right; 
}

.left { 
margin: 0.5em 0.8em 0.5em 0; 
float:left; 
}
legend {
	display:block;
	font-size:16px;
	font-weight:bold;
	color:#333;
	padding: 0 5px 5px 5px;
}
frameset {
	outline-style:inset;
	outline-color:#CCC;
}
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {
.gridContainer {
	width: 90.675%;
	padding-left: 1.1625%;
	padding-right: 1.1625%;
}

#header {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding-bottom: 10px;

}
#main {
	clear: none;
	float: left;
	margin-left: 0px;
	width: 100%;
	display: block;
	padding: 0px 10px 0px 10px;
}
#buttons {
	clear: none;
	float: left;
	display: none;
}
#footer {
	margin-left: 0;
	display: inline;
	position: absolute;
  	
}
#image {
	clear: none;
	float: left;
	margin-left: 0px;
	width: 100%;
	display: block;
}
h1 {
	padding-top:0px;
	margin-top:0px;
}
#content {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {
.gridContainer {
	width: 88.5%;
	max-width: 1232px;
	padding-left: 0.75%;
	padding-right: 0.75%;	
	margin: auto;
}
#header {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
a.to_nav {
	display:none;
}
#buttons {
	display:none;
}
#sml-menu {
	display:none;
}
#nav {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	padding-bottom: 10px;
}
#cssmenu {
  background: #a6a6a6;
  width: auto;
  display:block;
}
#cssmenu ul {
  list-style: none;
  margin: 0;
  padding: 0;
  line-height: 1;
  display: block;
  zoom: 1;
}
#cssmenu ul:after {
  content: ' ';
  display: block;
  font-size: 0;
  height: 0;
  clear: both;
  visibility: hidden;
}
#cssmenu ul li {
  float: left;
  display: block;
  padding: 0;
}
#cssmenu ul li a {
  color: #ffffff;
  text-decoration: none;
  display: block;
  padding: 15px 25px;
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 14px;
  position: relative;
  -webkit-transition: color .25s;
  -moz-transition: color .25s;
  -ms-transition: color .25s;
  -o-transition: color .25s;
  transition: color .25s;
}
#cssmenu ul li a:hover {
  color: #333333;
}
#cssmenu ul li a:hover:before {
  width: 100%;
}
#cssmenu ul li a:after {
  content: '';
  display: block;
  position: absolute;
  right: -3px;
  top: 19px;
  height: 6px;
  width: 6px;
  background: #ffffff;
  opacity: .5;
}
#cssmenu ul li a:before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  height: 3px;
  width: 0;
  background: #333333;
  -webkit-transition: width .25s;
  -moz-transition: width .25s;
  -ms-transition: width .25s;
  -o-transition: width .25s;
  transition: width .25s;
}
#cssmenu ul li.last > a:after,
#cssmenu ul li:last-child > a:after {
  display: none;
}
#cssmenu ul li.active a {
  color: #333333;
}
#cssmenu ul li.active a:before {
  width: 100%;
}
#image {
	clear: both;
	float: left;
	margin-left: 0;
	width: 40%;
	display: block;
}
#main {
	width: 210px;
	padding: 0px 20px 0px 20px;
}
#FBfeed {
	display:block;
}
h1 {
	padding-top:0px;
	margin-top:0px;
	color:#666;
}
#content {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
}
@media screen and (min-width: 1234px) {
	#image {
		width:40%;
	}
	#main {
		width:25%;
	}
}
@media screen and (max-width: 768px) {

#nav {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#cssmenu ul li {
    float: none;
  }
  #cssmenu ul li a {
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  #cssmenu ul li a:after {
    display: none;
  }
  #cssmenu ul li a:before {
    height: 1px;
    background: #ffffff;
    width: 100%;
    opacity: .2;
  }
  #cssmenu ul li.last > a:before,
  #cssmenu ul li:last-child > a:before {
    display: none;
  }
}
@media screen and (max-width: 1113px) {
	#FBfeed {
		display:none;
	}
	#buttons {
		display:block;
		float:left;
	}
	#image {
		width:40%;
	}
	#main {
		width:40%;
	}
}
@media screen and (max-width: 880px) {
	#cssmenu {
		display:none;
	}
	a.to_nav {
		display:block;
	}
	#buttons {
	display: block;
	float: left;
	}
	#sml-menu {
		display:block;
	}
	#image {
		width:100%;
	}
	#main {
		width:100%;
	}
	h1 {
		padding-top:10px;
	}
}