@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%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width: 100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		4;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;
*/

body  {
	/* background: url("images/background.jpg") repeat-x; */
	background-color: #cccccc;
	margin: 0;
	padding: 0;
}
.fluid {
	clear: both;
	margin-left: 0;
	width: 100%;
	float: left;
	display: block;
}
.fluidList {
    list-style:none;
    list-style-image:none;
    margin:0;
    padding:0;        
}

/* Mobile Layout: 340px and below. */
  
.gridContainer {
    background-color: #ffffff;
	width: 320px;
	margin: auto;
	clear: none;
	float: none;
	margin-left: auto;
    
	font-family: "Verdana", Arial, Helvetica, sans-serif;
	font-size: .75em;
	line-height: 1.35em;
    color: #000000;
}
.fluid {
}

#header {
    display: none;
}
#headerMobile {
    width: 320px;
	padding-bottom: 20px;
    display: block;
}

#middle { 
	background-color: #ffffff;
	width: 280px;
	padding: 20px 20px 0px 20px;
	overflow: hidden;
    clear: both;
}
#middle_green { 
	background-color: #e5f0eb;
	width: 280px;
	padding: 20px 20px 15px 20px;
	overflow: hidden;
    clear: both;
}
#middle_grey { 
	background-color: #e5f0eb;
	width: 280px;
	padding: 20px 20px 0px 20px;
	overflow: hidden;
    clear: both;
}

#left_50 {
	width: 100%;
	float: left;
	clear: left;
	overflow: hidden;
	display: block;
}
#right_50 {
	width: 100%;
	float: right;
	clear: right;
	overflow: hidden;
	display: block;
}
#left {
	width: 70%;
	height: 100%;
	float: left;
	clear: left;
	overflow: hidden;
	display: block;
}
#right {
	width: 23%;
	float: right;
	clear: right;
	overflow: hidden;
	display: block;
}

#banner {
    display: none;
}
#bannerMobile {
    background-color: #ffffff;
    border-top: solid 0px #cccccc;
	border-bottom: solid 1px #ffffff;
	width: 320px;
	padding: 0px 0px 0px 0px;
	clear: right;
	display: block;
}
#footer {
    background-color: #000000;
	width: 320px;
	padding: 10px 0px 0px 0px;
	clear: both;
	
    font-family: "Verdana", Arial, Helvetica, sans-serif;
	color: #ffffff;
	font-size: .75em;
	line-height: 2em;
	text-align: center;
}

.zeroMargin_mobile { margin-left: 0; }
.hide_tablet { display: none; }


/* begin tablet: 301px to 600px, inherits styles from mobile */

@media only screen and (min-width: 499px) {

.gridContainer {
    background-color: #ffffff;
	width: 600px;
	margin: auto;
	clear: none;
	float: none;
	margin-left: auto;
    
    font-family: "Verdana", Arial, Helvetica, sans-serif;
	font-size: .8em;
	line-height: 1.45em;
    color: #000000;
}
.fluid {
}

#header {
    width: 600px;
	padding-bottom: 20px;
    display: block;
}
#headerMobile {
    display: none;
}
    
#middle { 
	background-color: #ffffff;
	width: 560px;
	padding: 15px 20px 0px 20px;
	overflow: hidden;
    clear: both;
}
#middle_green { 
	background-color: #e5f0eb;
	width: 560px;
	padding: 15px 20px 15px 20px;
	overflow: hidden;
    clear: both;
}
#middle_grey { 
	background-color: #e5f0eb;
	width: 560px;
	padding: 15px 20px 0px 20px;
	overflow: hidden;
    clear: both;
}

#left_50 {
	width: 48%;
	float: left;
	clear: left;
	overflow: hidden;
	display: block;
}
#right_50 {
	width: 48%;
	float: right;
	clear: right;
	overflow: hidden;
	display: block;
}
#left {
	width: 70%;
	height: 100%;
	float: left;
	clear: left;
	overflow: hidden;
	display: block;
}
#right {
	width: 23%;
	float: right;
	clear: right;
	overflow: hidden;
	display: block;
}
#banner {
    background-color: #ffffff;
    border-top: solid 0px #cccccc;
	border-bottom: solid 1px #ffffff;
	width: 600px;
	padding: 20px 0px 0px 0px;
	clear: right;
	display: block;
}
#bannerMobile {
    display: none;
}
#footer {
    background-color: #000000;
	width: 600px;
	padding: 20px 0px 20px 0px;
	clear: both;
	
    font-family: "Verdana", Arial, Helvetica, sans-serif;
	color: #ffffff;
	font-size: .75em;
	line-height: 1.5em;
	text-align: center;
}

.zeroMargin_mobile { margin-left: 0; }
.hide_tablet { display: none; }

} /* end tablet media query */

/* begin desktop: 601px to a max of 850px, inherits styles from mobile and tablet */

@media only screen and (min-width: 849px) {

.gridContainer {
    background-color: #ffffff;
	width: 850px;
	margin: auto;
	clear: none;
	float: none;
	margin-left: auto;

    font-family: "Verdana", Arial, Helvetica, sans-serif;
	font-size: .85em;
	line-height: 1.65em;
    color: #000000;
}
.fluid {
}

#header {
    width: 850px;
	padding-bottom: 30px;
    display: block;
}
#headerMobile {
    display: none;
}

#middle { 
	background-color: #ffffff;
	width: 790px;
	padding: 30px 30px 10px 30px;
	overflow: hidden;
    clear: both;
}
#middle_green { 
	background-color: #e5f0eb;
    width: 790px;
	padding: 30px 30px 25px 30px;
	overflow: hidden;
    clear: both;
}
#middle_grey { 
	background-color: #e5f0eb;
	width: 790px;
	padding: 30px 30px 10px 30px;
	overflow: hidden;
    clear: both;
}
    
#left_50 {
	width: 48%;
	float: left;
	clear: left;
	overflow: hidden;
	display: block;
}
#right_50 {
	width: 48%;
	float: right;
	clear: right;
	overflow: hidden;
	display: block;
}
#left {
	width: 70%;
	height: 100%;
	float: left;
	clear: left;
	overflow: hidden;
	display: block;
}
#right {
	width: 24%;
	float: right;
	clear: right;
	overflow: hidden;
	display: block;
}
#banner {
    background-color: #ffffff;
    border-top: solid 0px #cccccc;
	border-bottom: solid 1px #ffffff;
	width: 850px;
	padding: 20px 0px 0px 0px;
	clear: right;
	display: block;
}
#bannerMobile {
    display: none;
}
#footer {
    background-color: #000000;
	width: 850px;
	padding: 20px 0px 20px 0px;
	clear: both;
	
    font-family: "Verdana", Arial, Helvetica, sans-serif;
	color: #ffffff;
	font-size: .75em;
	line-height: 1.5em;
	text-align: center;
}

.zeroMargin_mobile { margin-left: 0; }
.hide_desktop { display: none; }

} /* end desktop media query */

/* ------------------- DIVIDER ------------------- */

#clear { clear: both; }

#spacer_10 { height: 10px; clear: right; }
#spacer_20 { height: 20px; clear: right; }
#spacer_30 { height: 30px; clear: right; }
