/* @override http://dev.paragon.ca/public/css/main.css */

/* CSS Document */

html, body {
	font-family: Helvetica, Arial, Geneva, sans-serif;
	font-size: 67.5%;
}

body {
	background: #545454 url(../img/bodybg-xtile.jpg) repeat-x top;
	font-size: 1.2em;
}

h3.toggler, h3.replacenav { 
	font-family: Helvetica, Arial, Geneva, sans-serif; 
	font-size: 14px; 
	color: #125960; 
}

.replace { 
	font-family: Helvetica, Arial, Geneva, sans-serif; 
	font-size: 12px; color: #545454; 
	margin: 0 20px 0 0;
}

a {
	color: #00a1b1;
	outline: none;
}

a:hover {
	color: #00656f;
	outline: none;
}

/* Main Styles */

#wrapper {
	background: url(../img/wrapperbg-top.jpg) no-repeat center top;
	padding-top: 51px;
	position: relative;
}

#container { 
	width: 900px;
	background: #FFF url(../img/containerbg_top.jpg) no-repeat top;
	margin: 0 auto;
	padding: 244px 0 0;
	border-top: 5px solid #9c3c25;
}

#main {
	margin-top: 27px;
	padding: 0 0 35px;
}

#header {
	width: 900px;
	height: 300px;
	position: absolute;
	top: 0;
}

a#logo img {
	margin: 18px 0 0 58px;
}

ul.mininav {
	float: right;	
	display: inline;
	margin-top: 70px;
}

ul.mininav li {
	float: left;	
	display: inline;
	list-style: none;
}

ul.mininav li a {
	color: #00a1b1;
	margin: 0 30px 0 10px;
	/*font-size: .9em;*/
	text-decoration: none;
}

ul.mininav li a:hover {
	color: #00656f;
}

ul.mininav li.current {
	font-weight: bold;
}

#navcolumn {
	width: 250px;
	padding: 35px 0 70px;
	float: left;
	}

#navcolumn ul {
	list-style: none;
	width: 200px;
	margin: 0 0 0 48px;
}

#navcolumn b { font-weight: normal; }

#navcolumn ul li {
	list-style: none;
	padding: 4px 0 6px 10px;
	background: url(../img/nav-underline.gif) no-repeat bottom left;
}

#navcolumn ul li.active  {
	list-style: none;
	display: block;
	background: url(../img/nav-underline_current.gif) no-repeat bottom left;
}

#navcolumn ul li.active.children {
	background: url(../img/nav-underline.gif) no-repeat bottom left;
}

#navcolumn ul li.active.children a b { 
	background: none;
	color: #125960;
}

#navcolumn ul li.active a {
	color: #FFF;
}

#navcolumn ul li a {
	color: #125960;
	text-decoration: none;
}

#navcolumn ul li.children ul {
	margin: 0;
}

#navcolumn ul li.children ul li { 
	background: none;
}

#navcolumn ul li.children ul li a { 
	color: #7c7c82;
	text-transform: lowercase;
}

#navcolumn ul li.children.active ul li.active { 
	background: url(../img/nav-underline_current.gif) no-repeat left 2px;
	height: 16px;
}

#navcolumn ul li.children.active ul li.active a b { 
	color: #FFF;
}

li.children ul { display:  none; }

#content {
	width: 590px;
	padding-top: 45px;
	margin-right: 30px;
	float: right;
}

#content h1 {
	/*font-size: 1.8em;*/
	margin-bottom: 20px;
}

#content h2 {
	font-size: 1.5em;
	margin-bottom: 10px;
}

#content h4 {
	color: #00a1b1;
	margin-bottom: 10px;
}

#content .photo {
	float: left;
	margin: 0 20px 20px 0;
}

#content .photo.right {
	float: right;
	margin: 0 0 20px 20px;
}

#content .article {
	margin: 0 0 20px 0;
	clear: both;
	overflow: hidden;
}

.article p { line-height: 1.4em; }
.articleimg { margin: 0 20px 20px; position: absolute; left: -99999px; } /* offset position to hide until image loads. avoids jumping content */
.articleimg.left { float: left; margin-left: 0;}
.articleimg.right { float: right; margin-right: 0;}
.articleimg.centered { float: none; margin: 0 auto 20px; text-align: center; }

.articleimg .image { position: relative; clear: both; padding-bottom: 10px; }
.articleimg.left .image	{ float: left;}
.articleimg.right .image { float: right;}
.articleimg.centered .image { float: none;}

.articleimg a { text-decoration: none; }
.articleimg a.enlarge b  { font-size: .8em; position: absolute; bottom: 15px; right: 5px; padding: 2px 5px; text-decoration: none; text-transform: uppercase; color: #888; background: white; filter:alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6;}

.articleimg p.caption { font-size: .9em; line-height: 1.3em; margin: 0; color: #999; clear: both; display: inline;}


#content ul {
	list-style: none;
	margin: 0 0 20px 0;
}

#content ul li {
	list-style: none;
}

.addresses ul {
	float:  left;
	padding: 0 30px 10px 0;
}

#services {
	margin: 35px 0 0;
	background: #545454;
}

#services h2 {
	padding: 20px 30px 10px;
	margin: 0;
	color: #00a1b1;
	/*font-size: 1.2em;*/
	font-style: italic;
	border-bottom: 1px solid #656565;
	background: #464646 url(../img/services-topbar.gif) no-repeat right bottom;
}

#services .content {
	padding: 0 20px 20px;
	background: url(../img/services-content.gif) no-repeat right top;
}

#services div.content ul {
	margin: 0;
}

#services div.content ul li {
	width: 190px;
	float: left;
	margin-right: 45px;
	color: #FFF;
	font-size: .9em;
	padding: 0 0 0 45px;
}

#services div.content ul li h3 {
	/*font-size: 1.2em;*/
	font-style: italic;
	margin: 0 0 5px;
}

#services div.content ul li.service_1 {
	background: url(../img/services_icon-heating.gif) no-repeat left 10px;
	padding: 0 0 0 55px;
	margin-right: 20px;
}

#services div.content ul li.service_2 {
	margin-right: 0;
	background: url(../img/services_icon-mech.gif) no-repeat 20px 10px;
	padding: 0 0 0 65px;
}

#services div.content ul li.service_3 {
	background: url(../img/services_icon-refridge.gif) no-repeat left 10px;
	margin-right: 20px;
	padding-left: 55px;
}

#services div.content ul li.service_4 {
	margin-right: 0;
	background: url(../img/services_icon-controls.gif) no-repeat left 10px;
	padding: 0 0 0 65px;
}

#services ul {
	list-style: none;
}

#services ul li {
	list-style: none;
	margin-top: 28px;
}

.table_heading {
	background: url(../img/nav-underline.gif) repeat-x bottom left;
	margin: 30px 0 0;
	padding: 0 0 10px;
}

.subheading {
	color: #a9a9a9; 
}

table {
	padding: 20px;
	background: #f7f7f7;
}

table tr td {
	padding: 5px;
	margin: 0; 
}

table tr td.current_job {
	padding: 5px;
	margin: 0;
	background: #e4e4e4;
}
table tr td.odd {
	padding: 5px;
	margin: 0;
	background: #ececec;
}

table td h5 { 
	font-size: 12px; 
	color: #5F5F5F; 
	text-transform: uppercase;
}

#footer {
	width: 860px;
	padding: 0 20px;
	margin: 25px auto;
	color: #cbcbcb;
	text-align: right;
	font-size: .9em;
}

#footer span {
	display: block;
	margin-top: 5px;
}

#footer span a {
	color: #FFF;
	text-decoration: none;
}

#footer span a:hover {
	color: #00a1b1;
}


/* Form */

#content form {
	margin: 5px 0 0;
	background: #f7f7f7;
	border-top:  1px solid #FF0;
	padding: 20px;
	border-color: #d3d3d3;
	color: #545454;
	text-transform: uppercase;
	font-size: .9em;
}

#content form span {
	text-transform: none;
	color: #8a1f11;
	display: block;
	padding: 0 0 0 80px;
}

#content form div {
	padding: 3px;
	float: left;
}

#content form div label {
	float: left;
	width: 80px;
}

#content form {
	overflow: hidden;
}

#content form div input,
#content form div textarea {
	width: 450px;
	border: 1px solid #8a8a8a;
	padding: 3px;
}

#content form #submit {
	margin-left: 80px;
	width: 100px;
	background: url(../img/submit.gif) no-repeat;
	height: 29px;
	border: none;
	width: 185px;
	text-align: left;
	padding: 0 10px;
	color: #FFF;
	text-transform: uppercase;
}

.success {
	color: #00a1b1;
	display: block;
	margin-left: 85px;
	text-transform: none;
}

.error {
	color: #8a1f11 !important;
	text-transform: none;
	display: block;
	margin-left: 85px;
}

.error p { margin: 0 0 5px; }