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

/* -----------------------------Main Content----------------------------- */

/* Shadow optional--perhaps remove? Check compatibility with IE to see how it responds. First measure is x value, second is y, third is blur distance. */

@media screen and (min-width: 700px) {
#content {
	float:left;
	width:960px;
	padding-top:60px;
	background-color:#FFF;
	-moz-box-shadow:0px 15px 8px #000000;
	-webkit-box-shadow:0px 15px 8px #000000;
	box-shadow:0px 15px 8px #000000;
	filter: progid:DXImageTransform.Microsoft.Shadow(strength=5, direction=180, color='#000000');
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(strength=5, Direction=180, Color='#000000')";
}

	#contentmain {
		float:left;
		width:655px;
		padding-right:45px;
		padding-left:20px;
		padding-bottom:10px;
		background-image:url(../Images/orangebg.png);
		background-position:right;
		background-repeat:repeat-y;
	}
	
	#contentright {
		float:right;
		width:230px;
		padding-right:10px;
	}
}
	
@media only screen and (max-width: 699px) {
	#content {
		float:left;
		width:100%;
		padding-top:65px;
		background-color:#FFF;
	}

	#contentmain {
		float:left;
		width:95%;
		padding:10px;
	}
	
	#contentright {
		float:left;
		width:230px;
		padding:10px;
		padding-top:20px;
		background-image:url(../Images/orangebg.png);
		background-repeat:repeat-y;
		background-position:left;
	}
}
	/* Services list on right. Margins subtracted in order to allow seamless connection between background change on hover and orange background strip on #contentright */

#contentright ul {
	list-style:none;
	margin-left:-20px;
	margin-top:0px;
}

#contentright ul li {
	margin-bottom:15px;
	font-family:'NovecentowideBook';
}

#contentright ul li a {
	text-decoration:none;
	font-size:18px;
	color:#5f8894;
}
	
#contentright ul li a:hover {
	background-color:#fcaf17;
	text-decoration:none;
	color:#FFF;
}

#contentright ul li a:active {
	color:#606060;
	background-color:#fcaf17;
}

#contentright ul li a:visited {
	color:#606060;
}



/* -----------------------------Footer----------------------------- */

@media screen and (min-width: 700px) {
	#footer {
		float:left;
		width:960px;
		background-image:url(../Images/footerbg2.png);
		background-repeat:no-repeat;
	}
	
	#footertail {
		float:left;
		position:relative;
		top:33px;
		width:890px;
		padding-left:36px;
		padding-right:34px;
		margin-top:0px;
		background-image: url(../Images/footertailgrey.png); /* Use Modernizr to fix multiple bgs property in legacy browsers--(remove footertailbg2, use solely ftgrey.png) */
		background-repeat:repeat-y;
	}
	
	#footerwrap {
		width:887px;
		height:200px;
		background-image:url(../Images/footertailgrad.png);
		background-repeat:no-repeat;
	}
}

@media only screen and (min-width: 360px) and (max-width: 699px) {
	#footer {
		float:left;
		width:100%;
		background-image:url(../Images/footerbgmobile.png);
		background-repeat:repeat-x;
		background-position:top;
	}
	
	#footertail {
		float:left;
		position:relative;
		top:33px;
		width:100%;
		padding:0px;
		margin-top:0px;
		background-image:url(../Images/footertailbgmobile.png);
		background-repeat:repeat-x;
		background-color:#292929;
	}
	
	#footerwrap {
		width:360px;
		margin-left:auto;
		margin-right:auto;
	}
}

@media only screen and (max-width: 359px) {
	#footer {
		float:left;
		width:100%;
		background-image:url(../Images/footerbgmobile.png);
		background-repeat:repeat-x;
		background-position:top;
	}
	
	#footertail {
		float:left;
		position:relative;
		top:33px;
		width:100%;
		padding:0px;
		margin-top:0px;
		background-image:url(../Images/footertailbgmobile.png);
		background-repeat:repeat-x;
		background-color:#292929;
	}
	
	#footerwrap{
		width:180px;
		margin-left:auto;
		margin-right:auto;
	}
}