/*------------global styles------------*/

a { outline:none; }

a:link {
text-decoration:none;
}    

body{
	margin:0px;
	padding:0px;
	font:12px Helvetica;
	color:#666666;
	background-color: white;
}

h1, h2, p {
	margin:0;
	/*padding:0*/
	padding-top:1.0em;
    padding-bottom:1.0em;
}

h3 {
	size: 12px;
	font-weight: bold;
}

ul li {
	list-style-image: url();
	list-style-type: none;
}

td, th {
	font-size: 12px 
}

img {
border:0;
}

/*------------intro------------*/
#splash{
	margin:150px auto 0 auto;
	width:1000px;
	height:305px;
}

#splash img{
	 border:0;
}
/*------------container------------*/
#container {
	position: relative;
	width: 960px;
	margin:20px auto;
	background-color: white;
	height: auto;
}
/*------------header------------*/
#header {
	height: 135px;
	border-bottom:2px solid silver;
}

#header h1{
	color: white;
	font-size: 25px;
	padding:0px;
	margin:0px;
}

/*------------logo------------*/
#logo {
	height:113px;
	width:auto;
	margin:0px;
	padding:0px;
}

#logo img{
	margin:0px; /* ========== edit by craig ========== */
}

/*navagation */

#nav{
	background-color:white;
	height:22px;
	font:15px Helvetica;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

#nav ul { margin:0px; padding:0px; }

#nav ul li{
	float: left;
    height:22px;
}
#nav ul li a
{
	padding:0px;
	color:silver;
	text-decoration:none;
	display:block;
	text-indent: -9999px;
	height:22px;
	margin-top: 0px;
	margin-right: 8px;
	margin-bottom: -2px;
	margin-left: 0px;
}

#nav ul li.selected a 
{
background-position:0px -22px;
}

#nav ul li.selected ul li a 
{
	background-position:0px 0px;
}

#nav ul li.selected ul li a:hover
{
	background-position:0px -22px;
}
/*
#nav ul li.selected ul 
{
	display: none;
	position: absolute;
}

#nav ul ul {
	display: none;
	position: absolute;
}


#nav ul li:hover ul 
{
	display: inline;
	margin:0px;
	position: absolute;
}


#nav ul ul li.selected a
{
background-position:0px -22px;
}
*/

.jd
{
	position: absolute;
	top: 0px;
}


.mison
{
	position: absolute;
	top: 22px;
}

.custom
{
	position: absolute;
	top: 44px;
}

.jaroff
{
	position: absolute;
	top: 66px;
}

.comate
{
	position: absolute;
	top: 88px;
}


.gdi
{
	position: absolute;
	top: 66px;
}

.pbc
{
	position: absolute;
	top: 0px;
}

.pbt
{
	position: absolute;
	top: 22px;
}

.pl
{
	position: absolute;
	top: 44px;
}

.presscov
{
	position: absolute;
	top: 0px;
}
.technicalart
{
	position: absolute;
	top: 22px;
}

.conews
{
	position: absolute;
	top: 44px;
}

.presspacket
{
	position: absolute;
	top: 66px;
}

#nav .contact
{
	position: absolute;
	top: 0px;
}

.contactus
{
	position: absolute;
	top: 0px;
}

.links
{
	position: absolute;
	top: 22px;
}




a#home {
	background:url(images/hometab.png) no-repeat;
	width:151px;
	background-position:0px 0px;
	background-color: #0099CC;
}
a#home:hover { background-position:0px -22px; }


a#about { background:url(images/abouttab.png) no-repeat; width:151px; background-position:0px 0px; }
a#about:hover { background-position:0px -22px; }

a#jd { background:url(images/jaroff-design-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#jd:hover { background-position:0px -22px; }

a#mison-concepts { background:url(images/mison-concepts-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#mison-concepts:hover { background-position:0px -22px; }

a#jaroff-custom { background:url(images/custom-entryways-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#jaroff-custom:hover { background-position:0px -22px; }

a#jaroff { background:url(images/jaroff-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#jaroff:hover { background-position:0px -22px; }

a#comate { background:url(images/companymaterials-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#comate:hover { background-position:0px -22px; }


a#services { background:url(images/servicestab.png) no-repeat; width:151px; background-position:0px 0px; }
a#services:hover { background-position:0px -22px; }

a#services-custom { background:url(images/services-custom-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#services-custom:hover { background-position:0px -22px; }

a#gdi { background:url(images/green-design-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#gdi:hover { background-position:0px -22px; }


a#projecto { background:url(images/projectstab.png) no-repeat; width:151px; background-position:0px 0px; }
a#projecto:hover { background-position:0px -22px; }

a#pbc { background:url(images/PBC-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#pbc:hover { background-position:0px -22px; }

a#pbt { background:url(images/PBT-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#pbt:hover { background-position:0px -22px; }

a#pl { background:url(images/project-list-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#pl:hover { background-position:0px -22px; }


a#newsroom { background:url(images/news.png) no-repeat; width:151px; background-position:0px 0px; }
a#newsroom:hover { background-position:0px -22px; }

a#presscov { background:url(images/presscoverage-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#presscov:hover { background-position:0px -22px; }

a#conews { background:url(images/companynews-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#conews:hover { background-position:0px -22px; }

a#technicalart { background:url(images/technical-articles-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#technicalart:hover { background-position:0px -22px; }

a#presspacket { background:url(images/press-packet-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#presspacket:hover { background-position:0px -22px; }


a#contact { background:url(images/contacttab.png) no-repeat; width:151px; background-position:0px 0px; }
a#contact:hover { background-position:0px -22px; }

a#contactus { background:url(images/contact-us-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#contactus:hover { background-position:0px -22px; }

a#links { background:url(images/links-tab.png) no-repeat; width:151px; background-position:0px 0px; }
a#links:hover { background-position:0px -22px; }

#nav ul li a.highlight,
#nav ul li a:hover{
	 background-color:lightblue;
	 color:white;   
	
}	
/* a#nav_home:hover, a#nav_about:hover, a#nav_services:hover, 
	a#nav_projects:hover,a#nav_news:hover, a#nav_contact:hover {
	background-position:0 -25px; */


/*------------left column------------*/
#leftcontent-home {
	float:left;
	background-color:white;
	width:330px;
	height:394px;
	clear:both;
	padding:5px 10px;
	line-height:20px;
	overflow: auto;
	text-align: left;
}

#leftcontent {
	float:left;
	background-color:white;
	width:330px;
	height:403px;
	clear:both;
	padding:5px 10px;
	line-height:20px;
	overflow: auto;
	text-align: left;
}
#leftcontent2 {
	float:left;
	background-color:white;
	width:300px;
	height:403px;
	clear:both;
	padding:5px 10px;
	line-height:20px;
	overflow: auto;
	text-align: left;
}

#leftcontent-com-news {
	float:left;
	background-color:white;
	width:540px;
	height:403px;
	clear:both;
	padding:5px 10px;
	line-height:20px;
	overflow: auto;
	text-align: left;
}


#leftcontent p {
	margin-bottom: 10px;
}

#leftcontent h1{
	font-size:16px;
}

#widecontent h2{
	font-size: 12px;
}	
#leftcontent h2{
	font-size: 12px;
}
#leftcontent ul li{
	list-style-image: url();
	list-style-type: disc;
	background: none;
}

#leftcontent_contentwrapper a{
	font-weight:normal;
}

#widecontent{
		float: left;
		background-color:white;
		width: 940px;
		height:400px;  
		clear:left;
		padding: 5px 10px;
		border-right:#E6E6E6;
		line-height:20px;
		overflow: auto;
		background: url(images/news.jpg) no-repeat 663px 0px;
	}

#widecontent table{
	border:0px solid black;
	width:550px;
}
#widecontent ul li{
	margin:2px 0 2px 0;
}
.press{
	margin:0;
	padding:0;
}


.selected{
	font-weight: bold;
}

#companynews h2{
	padding:15px 0 1px 0;
	text-decoration: underline;
}

#companynews p{
	width: 600px;
}

#presscoverage ul li{
	margin:10px 0 0 0;

}

a:link {
	color:#666666;
	text-decoration: none;
	font-weight: bold;
}

a:visited {
	color:#666666;
	text-decoration: none;
}

a:hover {
	color:#7acbee;
	text-decoration:none;
}

/*------------right side------------*/
#rightcontent {
	float:right;
	width: 600px;
	height:405px;
	margin:0px;
	font-weight: normal;
	font-family: Helvetica, sans-serif;
}

#rightcontent2 {
	float:right;
	width: 460px;
	height:405px;
	margin:0px;
	font-weight: normal;
	font-family: Helvetica, sans-serif;
}

#rightcontent3 {
	float:right;
	width: 600px;
	height:403px;
	margin:0px;
	font-weight: normal;
	font-family: Helvetica, sans-serif;
}


#contact-left
{
	float: left;
	height: auto;
	font-size: 12px;
}

#contact-details
{
	padding-left: 12px;
	padding-top: 0px;
	padding-bottom: 2px;
}
	
.art{
}

.about1{
	background: url(images/about/jaroff.jpg) no-repeat right top;
}

.about2{
	background: url(images/about/mison.jpg) no-repeat right top;

}

.about3{
	background: url(images/about/customdoor.jpg) no-repeat right top;
}

.about4{
	background: url(images/about/joe.jpg) no-repeat right top;
}

.services1{
	background: url(images/services/jaroff.jpg) no-repeat right top;

}
.services2{
	background: url(images/services/mison.jpg) no-repeat right top;

}
.services3{
	background: url(images/services/jce.jpg) no-repeat right top;

}
.news1{
	background: url(images/services/news.jpg) no-repeat right top;
	
}
.contact1{
	background: url(images/contact.jpg) no-repeat right top;
	
}



.sitesearch {background: url(images/services/jaroff.jpg) no-repeat right top;}
.contactus {background: url(images/services/jaroff.jpg) no-repeat right top;}


/*------------grid------------*/
.opacityit img{
filter:alpha(opacity=100);
-moz-opacity:1;
-khtml-opacity: 1;
opacity: 1;;
}

.opacityit:hover img{
filter:alpha(opacity=60);
-moz-opacity:0.6;
-khtml-opacity: 0.6;
opacity: 0.6;
}

a#topleft {height: 130px; width:193px; display:block; }


a#topmid {height: 130px; width:193px; display:block; }


a#topright {height: 130px; width:193px; display:block; }


a#midleft {height: 132px; width:193px; display:block; }


a#midmid {height: 132px; width:193px; display:block; }


a#midright {height: 132px; width:193px; display:block; }


a#botleft {height: 134px; width:193px; display:block; }


a#botmid {height: 134px; width:193px; display:block; }


a#botright {height: 134px; width:193px; display:block; }


#grid a {margin: 1px 0px;}

table.grid {margin:-3px 0 0 0;}
table.grid { border:0;}
table.grid td {padding:1px; }

/*------------image preload------------*/
div#preloaded-images {
   position: absolute;
   overflow: hidden;
   left: -9999px; 
   top: -9999px;
   height: 1px;
   width: 1px;
}

#grid{
	margin-left:8px;
}

#grid img{
	margin:0px;
	padding:0px;
	border:0;
}

#introSplash { position: absolute;	top: 0px; left:-16px; z-index:1000; background:#fff;}
#introSplash img{ }
#hideFlash{display:none; visibility:hidden;}

a#grid:hover,a#grid:link{
	text-decoration:none;
}

#artscontent {
	float:right;
	width: 740px;
	height:410px;
	background:white url(../images/projectmain.png) no-repeat;
	display:block;
	}

#projectrightcontent {
	float:left;
	width: 500px;
	height:410px;
	background:white url(../images/artsmain.j) -15px 0 no-repeat;
	display:block;
}

#rightcontent ul li{
	border-bottom: 1px solid #E6E6E6;
	padding: 3px 0px 3px 17px;
	/*background: url(images/smallArrow.gif) no-repeat 2px 5px;*/
	
}

#leftcontent th{
	color:white; 
}
#leftcontent a:link {
	color:#666666;	
}
  
#leftcontent a:hover {
	color:#7acbee;	
}
#description{
	float:left;
	width:174px;
	padding: 10px;
}

#elvcontent {
	float:right;
	width: 740px;
	height:410px;
	background:white url(/images/image1.png) no-repeat;
	display:block;
	}

/*------------footer------------*/
#footer {
	clear: both;
	height:20px;
	width:960px;
	font-size:0;
	color:white;
	border-top:2px solid silver;
	padding-top: 20;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
}
.footer-left {
	width:480px;
	display: block;
	float: left;
	font-size: 11px;
}

.footer-right {
	width:480px;
	display: block;
	float: right;
	text-align: right;
	text-indent: 20px;
	font-size: 11px;
}

.footer-right a{
	font-weight: normal;
}

.home img{
	margin:0 0 0 0px;
} 
.about img{
	margin:0 0 0 160px;
}
.services img{
	margin:0 0 0 320px;
}
.projects img{
	margin:0 0 0 480px;
}
.newsroom img{
	margin:0 0 0 634px;
}
.contact img{
	margin:0 0 0 800px;
}

/*------------javascript scroller------------*/

.root {
	float: left;
	clear: left;
	border-right:#E6E6E6;
	position:relative;
	height:			411px;
	width:			220px;
	margin: 			0 0 0 0;	
}


.root p 	{
	margin:			10px 10px 5px 10px;
}

.thumb 		{
	position:			absolute;
	height:			9px;
	width:			15px;
	margin: 0 0 0 -415px;
}

.up	{
	margin: 0px 0 0 -10px;
}

.dn 	{
	margin: 380px 0 0 -10px;
}

.up a, .up a img, .dn a, .dn a img, .thumb a , .thumb a img{
	border:			0;
}

.scrollContainer { 
	position:			absolute; 
	width:			220px; 
	height:			411px; 
	overflow:			auto; 
	background:		white;
}

.scrollContent { 
	position:			absolute; 
	left:			0px; 
	top:			0px; 
	width:			100px; 
}

#scroll0Content h3 {
	margin:7px 5px 7px 0;
	font-size: 12px;
}
#scroll0Content h4 {
	margin:7px 0 7px 0;
}

#scroll0Content ul {
	
}

#scroll0Content ul li {
	margin: 7px 0 0 10px;
}
#scroll0Content span{
color: grey;
font-weight: bold;
}

#scroll0Content i{
font-family: serif;
font-size: 13px
}

/*------------gallery------------*/

h2 em {
	font: normal 80%/100% Arial, Helvetica, sans-serif;
	color: #999999;
}
#largeImg {
	float:right;
	width: 740px;
	height: 349px;
}
.thumbs {
	margin: 2px 185px 0 0;
	float:right
}
.thumbs img {
	border: solid 1px #ccc;
	width: 73px;
	height: 73px;
	padding: 1px;
}

.thumbs img:hover {
	border-color: gray;
}


.clearer { clear:both; }
#projects_wrapper { width:960px; height:427px; clear:both; background:#ffffff;}
#projects_wrapper #projects_nav { width:220px; height:427px; float:left; background:#ffffff; }
#projects_wrapper #projects_photos { width:554px; float:left; background:#ffffff; }
#projects_wrapper #projects_photos_big { width:600px; height:427px; float: left; }

#projects_detail { width:554px; height:346px; overflow: hidden;}
#projects_detail_h { width:554px; height:427px; } 
#projects_detail_big { width:600px; height:427px; }

#projects_wrapper #projects_photos #projects_thumbnails { width:554px; height:0px; overflow:hidden; }
#projects_wrapper #projects_info { width:186px; height:427px; float:left; background:#ffffff; }
#projects_navlist { width:220px; height:427px; }
#projects_navlist li { padding:5px 0px; }
#projects_navlist ul.nav_tier1 { font-weight:bold; margin: 0px; padding: 0px; }
#projects_navlist ul.nav_tier2 { margin-top:10px; margin-left:10px; /*display:none;*/ padding: 0px;}
#projects_navlist ul.nav_tier3 { margin-left:10px; font-weight:normal; padding: 0px; }
#projects_navlist ul.nav_tier3 a { font-weight:normal; }
#projects_navlist ul.nav_tier4 { margin-left:10px; font-weight:normal; padding: 0px; }
#projects_navlist ul.nav_tier4 a { font-weight:normal; }
#projects_navlist ul.nav_tier3 a.visited { font-weight:bold; }
#projects_thumbnails_wrapper { width:554px; height:82px; }
#projects_thumbnails_wrapper div.thumbnail { float:right; width:73px; height:73px; border:solid 1px #ccc; padding:1px; margin:2px; }
#projects_info_wrapper {  height:427px; padding:0px; font-size:12px; }
#projects_info_padding { padding:10px; }



#projects_info_wrapper h1{ border:0pt none;
font-family:inherit;
font-size:100%;
font-style:inherit;
font-weight:inherit;
margin:0pt;
outline-color:invert;
outline-style:none;
outline-width:0pt;
padding:0pt;
vertical-align:baseline;
color:#666666;
font-weight:bold;
text-align:left;}

#projects_info_wrapper h2{ border:0pt none;
font-family:inherit;
font-size:100%;
font-style:inherit;
font-weight:inherit;
margin:0pt;
outline-color:invert;
outline-style:none;
outline-width:0pt;
padding:0pt;
vertical-align:baseline;
color:#666666;
font-weight:bold; 
margin-bottom:1em; }

#projects_info_wrapper h3{ border:0pt none;
font-family:inherit;
font-size:100%;
font-style:inherit;
font-weight:inherit;
margin:0pt;
outline-color:invert;
outline-style:none;
outline-width:0pt;
padding:0pt;
vertical-align:baseline;
color:#666666;
font-weight:normal; font-style:italic; margin-bottom:1em; }


#projects_wrapper #projects_bigphoto { width:554px; height:427px; float:left; display:none; }
#projects_wrapper #projects_cover { width:600px; height:427px; float:left; }

/* custom scrollbars */
/*html {
    scrollbar-arrow-color: #999999;
    scrollbar-3dlight-color: #4F4F4F;
    scrollbar-darkshadow-color: #4F4F4F;
    scrollbar-face-color: #f4f4f4;
    scrollbar-highlight-color: #FFFFFF;
    scrollbar-shadow-color: #d0d0d0;
    scrollbar-track-color: #ffffff;
}*/

/* Scroll Bar Master Styling Starts Here */
/* All comments can be freely removed from the css */

/*  scrollgeneric is used for corrective styling of elements, and should not be modified or removed */ 
.scrollgeneric { line-height:1px; font-size:1px; position:absolute; top:0; left:0; }

.flexcroll { overflow:auto; position:relative; }

.vscrollerbar { width:10px; background:#cccccc; }
.vscrollerbase { width:10px; background:#f7f7f7; }

/* Scroll Bar Master Styling Ends Here */

/* no javascript message */
#noscript { width:918px; padding:20px; background:#f7f7f7; border:1px solid #cccccc; text-align:center; margin-bottom:20px; }

/* thumbnail arrows */
#projects_thumbnails_wrapper .vscrollerbasebeg { width:10px; height:9px !important; background: url(images/arrow_up.gif) 0px 0px no-repeat; }
#projects_thumbnails_wrapper .vscrollerbaseend { width:10px; height:9px; background: url(images/arrow_down.gif) 0px 0px no-repeat; }
#projects_thumbnails_wrapper .vscrollerbar { padding:10px; z-index:2; }

#project-list
{
	padding-top: 15px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	margin-top: 15px;
	color: #00FF99;
}

.dwn_PDF {
	margin: 0px;
	padding: 5px 0px;
	clear: both;
	float: left;
}

.dwn_PDF a {
	color: #7ACBEE;
	text-decoration: underline;
}

.dwn_PDF a:hover {
	text-decoration: none;
}