@charset "UTF-8";
html, ul, li, form,*{border:none;margin:0;padding:0;}

html{
	font:normal 11px "Lucida Grande", Geneva, Arial, sans-serif; color:#000;

		scrollbar-base-color: #666;
		scrollbar-face-color: #666;
		scrollbar-track-color: #CCC;
		scrollbar-arrow-color: #CCC;
		scrollbar-highlight-color: #666;
		scrollbar-3dlight-color: #666;
		scrollbar-shadow-color: #666;
		scrollbar-darkshadow-color: #666;

overflow-Y: scroll;
}

html a, html a:visited{	font:normal 1em "Lucida Grande", Arial;color:#666; text-decoration:underline;}
html a:hover{ font:normal 1em "Lucida Grande", Arial; color:#333; background:#DADADA; text-decoration:none; }
html a:active { outline: none; }
html a:focus { -moz-outline-style: none; }

img, img a,img a:hover, img a:visited{border:0px; background:#FFF;}

body{ margin:0;}
h1{ font: bolder 1.4em  "Lucida Grande", Arial; margin:20px 0;}
h2{ font: bold 1.2em  "Lucida Grande", Arial; margin:0; margin:20px 0 10px 0;}
h6{ font: bolder 1.1em  "Lucida Grande", Arial; margin:0; position:relative; top:20px;}/* h for prods frame */
h3{ font: bolder 1.2em  "Lucida Grande", Arial; margin:10px 0;}/* h for prods frame */



/*================================= LayOut id's =====================================*/

#smartfix{ margin:0 auto; width:960px;}

#header{ width:960px; height:100px; border-bottom: 1px dotted #999;bottom:10px; }
	#header .head{ height:30px; position:relative; top:50px; }
	.head img{ float:left}.head p{ padding-top:20px; font: normal 0.9em "Lucida Grande", Arial; color:#666;text-align:right;  }
	

#mainNav{ width:710px; height:auto; margin-left:250px; background:url(../images/btn/mainNav_arrow.jpg) right center no-repeat; }

#leftNav{ width:230px; float:left; cursor:default;}

#rightNav{ width:190px; margin-top:12px; float:left; cursor:default;}

#container{ width:710px; float:right;}

#contentMenuLeft{ width:500px; float:left; clear:right;}
#contentMenuRight{ width:190px; float:right; }

#flash{ width:710px; height: auto; background:url(../images/btn/lightbox-ico-loading.gif) no-repeat center center;}

#footer{ width:530px; height:10px; padding: 20px 180px 20px 250px; border-top: 1px dotted #999; text-align:justify;}
	#footer a{margin-right:35px; font-size:0.9em; text-decoration:none;}
	#footer a.no{margin:0;}/*set last link*/
	


.frame{ width:710px; border-bottom:1px dotted #999;border-top: 1px dotted #999; padding:0; overflow:hidden;}


#content2cols{width:710px; border-bottom:1px dotted #999;border-top: 1px dotted #999; padding-bottom:20px}
#content2cols ul{ margin:0; clear:right;}
#content2cols li.Lcol{ width:460px; margin-right:20px; display:inline; float:left; text-align:justify;}
#content2cols li.Rcol{ width:220px; display:inline; float:left;}
#content2cols a img, #content3cols p, #content3cols h2{display: block;}
#content2cols p{ margin:10px 0;}

#content3cols{width:710px; border-bottom:1px dotted #999;border-top: 1px dotted #999; padding-bottom:20px}
#content3cols ul{ margin:0;}
#content3cols li{ width:162px; margin-right:20px; display:inline; float:left;}
#content3cols a img, #content3cols p, #content3cols h2{ display: block;}
#content3cols p{ margin:10px 0;}

#sitemap{width:710px; border-bottom:1px dotted #999;border-top: 1px dotted #999; padding:20px 0;}
#sitemap ul{ list-style:none; margin:3px 0;}
#sitemap ul li, #sitemap ul li ul li{margin:3px 0; padding-left:50px;}

#sitemap p a{ margin:5px 0; padding-left:20px;}


/*================================= contents class's =====================================*/
.frameList ul{ margin:20px 0; padding:0 20px;}
.frameList li{ margin:6px 0; padding:0 15px;}
.frameTxt{ margin:20px 0;}
.frameTxt_flow{ height:300px; overflow-Y:scroll;}


/*--- Starts extrusions ----*/
.icn_pdf a{width:48px; height:49px;  display:block; background:url(../images/btn/icn_pdf.jpg) 0 0 no-repeat; text-indent:-9999px;}
.icn_pdf a:hover{background:url(../images/btn/icn_pdf.jpg) 0 -49px no-repeat;}

.icn_dwg a{width:48px; height:49px;  display:block; background:url(../images/btn/icn_dwg.jpg) 0 0 no-repeat; text-indent:-9999px;}
.icn_dwg a:hover{background:url(../images/btn/icn_dwg.jpg) 0 -49px no-repeat;}

.tbl_dl td{ padding:2px; font: bold 12px "Lucida Grande", Arial; color:#666; vertical-align:bottom;}



.DwgPdf{width:330px; height:45px; padding:20px 0 0 380px; font: bold 1em "Lucida Grande", Arial; color:#666;}
.DwgPdfFL{width:710px; height:105px; font: bold 1em "Lucida Grande", Arial; color:#666;}
	.DwgPdfFL_2levels{width:330px; height:75px; padding:30px 0 0 380px; font: bold 1em "Lucida Grande", Arial; color:#666;}

	.DwgPdf a img, .DwgPdfFL a img{ margin:0 3px; border:0;  position:relative; background:#FFF;}
	.DwgPdf div, .DwgPdfFL div{ padding-top:10px;}

/*--- single extrusions ----*/
.ext{height:570px; margin:0; overflow:hidden;}
	.e17_18{height:610px; margin:0;background:url(../images/contents/ext17_18.jpg) 0 0; overflow:hidden;}
	
/*--- double extrusions ----*/

.steelFrame{height:650px; background:url(../images/contents/sub-steelFrame.jpg) 0 0 no-repeat;}
.precast{height:690px; background:url(../images/contents/sub-precast.jpg) 0 0 no-repeat;}
.reclad{height:680px; background:url(../images/contents/sub-existingReclad.jpg) 0 0 no-repeat;}

.e27{height:460px; background:url(../images/contents/ext_27.jpg) 0 0 no-repeat;}
.eJointing39{height:675px; background:url(../images/contents/ext_jointingAlt_39.jpg) 0 30px no-repeat;}
.e27b{height:445px; background:url(../images/contents/ext_27b.jpg) 0 0 no-repeat;}

.eStarter11{height:700px; background:url(../images/contents/ext_starter_ab_11.jpg) 0 0 no-repeat;}
.eStarter14{height:760px; background:url(../images/contents/ext_starter_ab_14.jpg) 0 30px no-repeat;}

.eCornerExt{height:560px; background:url(../images/contents/ext_cornerExt_12.jpg) 0 0 no-repeat;}
	.eCornerExtA{height:780px; background:url(../images/contents/ext_cornerExtAlt.jpg) 0 0 no-repeat;}
.eCornerInt{height:580px; background:url(../images/contents/ext_cornerInt_20.jpg) 0 30px no-repeat;}
	.eCornerIntA{height:320px; background:url(../images/contents/ext_cornerIntAlt.jpg) 0 0 no-repeat;}
	
.eWindowFrame{height:850px; background:url(../images/contents/ext_window_frame_14_15.jpg) 0 -30px no-repeat;}
.eWindowSill{height:790px; background:url(../images/contents/ext_window_sill_11.jpg) 0 20px no-repeat;}
.eWindowJamb{height:870px; background:url(../images/contents/ext_window_jamb_14_15.jpg) 0 20px no-repeat;}


.eSoffit{height:870px; background:url(../images/contents/ext_soffit_20_12.jpg) 0 30px no-repeat;}
.eSoffitAlt{height:980px; background:url(../images/contents/ext_soffitAlt_20_35.jpg) 0 40px no-repeat;}
.eSoffitAlt11{height:550px; background:url(../images/contents/ext_soffit_20_11.jpg) 0 20px no-repeat;}

.eCapping{height:700px; background:url(../images/contents/ext_capping_01_18.jpg) 0 0 no-repeat;}
.eCappingAlt{height:690px; background:url(../images/contents/ext_cappingAlt_01_11_18.jpg) 0 0 no-repeat;}
.eCappingAlt_36{height:636px; background:url(../images/contents/ext_cappingAlt_18_36.jpg) 0 0 no-repeat;}

.eStep{height:750px; background:url(../images/contents/ext_step_33.jpg) 0 0 no-repeat;}


.extF{height:65px; margin:0 0 20px; overflow:hidden;}
.extFL{height:105px; margin:0 0 20px 0; overflow:hidden;}

	.F17_18{background:url(../images/contents/extF17_18.jpg) 0 30px no-repeat;}
	.F27{ background:url(../images/contents/extF27.jpg) 0 20px no-repeat;}
	.FCapping{ background:url(../images/contents/extFCapping_11_18.jpg) 0 0 no-repeat;}
	
	.FLstarter11{ background:url(../images/contents/extFStarter_ab11.jpg) 0 0 no-repeat;}
	.FLstarter14{ background:url(../images/contents/extFStarter_ab14.jpg) 0 0 no-repeat;}
	
	.FLcornerExt{ background:url(../images/contents/extFCornerExt_12.jpg) 0 0 no-repeat;}
		.FLcornerExtA{ height:215px; background:url(../images/contents/extFCornerExtAlt.jpg) 0 0 no-repeat;}
	.FLcornerInt_17{ background:url(../images/contents/extFCornerIntAlt_17.jpg) 0 20px no-repeat;}	
		.FLcornerInt_20{ background:url(../images/contents/extFCornerIntAlt_20.jpg) 0 0 no-repeat;}	
		
	.FLwindow{ background:url(../images/contents/extFWindow_14_15.jpg) 0 0 no-repeat;}
		.FLwindowSill{ background:url(../images/contents/extFWindow_11.jpg) 0 0 no-repeat;}
		
	.FLsoffit{ background:url(../images/contents/extFSoffit_20_12.jpg) 0 0 no-repeat;}
	.FLsoffitAlt{ background:url(../images/contents/extFSoffitAlt_20_35.jpg) 0 0 no-repeat;}
		.FLsoffitAlt11{ background:url(../images/contents/extFSoffit_20_11.jpg) 0 0 no-repeat;}
	

	.FLcappingAlt{ background:url(../images/contents/extFCapping_01_11_18.jpg) 0 0 no-repeat;}
	.FLcappingAlt_36{ background:url(../images/contents/extFCappingAlt_18_36.jpg) 0 0 no-repeat;}
	
	.FLstep{ background:url(../images/contents/extFStep_33.jpg) 0 0 no-repeat;}

.frameProf{ width:710px; border-bottom:1px dotted #999;}

.accProf  {width: 710px;}
.accProf a.tog{cursor:pointer;display:block;font:bold 1em "Lucida Grande", Arial; color:#333; text-decoration:none; padding:15px 0 10px 0;background: url("../images/btn/arrow_down.gif") 702px 50% no-repeat;}
.accProf a.tog:hover { font: bold 1em  "Lucida Grande", Arial; margin:0; color:#000; text-decoration:none; background:#FFF; background: url("../images/btn/arrow_down.gif") 702px 50% no-repeat;}
.accProf a.selected{cursor:pointer;display:block;font:bold 1em "Lucida Grande", Arial; color:#333; background: url("../images/btn/arrow_up.gif") 702px 50% no-repeat;}

.contProf {width: 710px;margin:0;border-bottom:1px dotted #999;}

.contProf h2.trigger {width: 710px; padding:0 0 5px 0; color:#333;font:normal 1em "Lucida Grande", Arial; cursor: pointer;
background: url(../images/btn/icn_plus_minus.gif) right top no-repeat;}
.contProf h2.active {background:url(../images/btn/icn_plus_minus.gif) right bottom no-repeat; border:none;}
.contProf .toggle_container {width: 710px; overflow: hidden;}

.reg_o{width:170px;margin:0;}
.reg_o h5.reg-trigger {width: 170px; color:#666;font:normal 1em "Lucida Grande", Arial; cursor: pointer; text-align:left; display:block;
background: url(../images/btn/arrow_down.gif) right center no-repeat;}
.reg_o h5.active {background:url(../images/btn/arrow_up.gif) right center no-repeat; border:none;}
.reg_o .register_container {width: 730px; overflow: hidden; margin-left:-530px;}

.imgProf{background:url(../images/contents/all_profiles.gif) 0 0 no-repeat;}

.joiner{ height:140px; background-position: 0 40px;}
.starter{ height:380px; background-position: 0 -125px;}
.corner{ height:360px; background-position: 0 -520px;}

.featExpressed{ height:140px; background-position: 0 -910px;}
.featStep{ height:190px; background-position: 0 -1060px;}
.featGlazing{ height:140px; background-position: 0 -1290px;}


.allAlt{ height:340px; background-position: 0 -1480px; }

.gasket{ height:140px; background-position: 0 -1900px;} 
/*--- Ends extrusions ----*/

.panel{width:500px;}
.framePanel{ width:500px; border-bottom:1px dotted #999; padding:10px 0;}

.accPanels  {width: 500px;}
.accPanels a{cursor:pointer;display:block;font:bold 1em "Lucida Grande", Arial; color:#333; text-decoration:none; padding:15px 0 10px 0;background: url("../images/btn/arrow_down.gif") 492px 50% no-repeat;}
.accPanels a:hover { font: bold 1em  "Lucida Grande", Arial; margin:0; color:#000; text-decoration:none; background:#FFF; background: url("../images/btn/arrow_down.gif") 492px 50% no-repeat;}
.accPanels a.selected{cursor:pointer;display:block;font:bold 1em "Lucida Grande", Arial; color:#333; background:url(../images/btn/arrow_up.gif) 492px 50% no-repeat;}
.accPanels span a{cursor:pointer; background:none; margin:0;}
/*--- ENDS Panels ----*/

.frameImg{ width:710px; border-bottom:1px dotted #999; padding-bottom:20px;}
.footgap{ height:30px; padding:15px 0 15px 0; clear:both; text-align:right;}
.footgap a, .footgap a:link, .footgap a:visited{ font:normal 0.85em "Lucida Grande", Arial; line-height:13px;}
.footgap a:hover{  font:normal 0.85em "Lucida Grande", Arial;  color:#333; background:#DADADA; text-decoration:none;  line-height:13px;}
.clearer{ clear:both;}

/*================================= contents navigation =====================================*/

/*--- #mainNav ----*/

#nav{width:100%; padding-top:18px;list-style:none; background:#FFF; position:relative; z-index:500;text-transform:uppercase;}
#nav li{display:block; float:left; height:30px;}
#nav li.reg{display:block; float:left; height:30px;}
#nav li a { margin-right:70px; display:block; float:left; cursor:pointer; background:#FFF; color:#666; text-decoration:none;}
#nav li.reg a{display:block; cursor:pointer; background:#FFF; color:#666; text-decoration:none;}

/* list style */

#nav li:hover {position:relative; z-index:200;}

#nav li:hover ul
{left:0px; top:30px; background:#FFF; padding:10px 10px 5px; width:170px; height:auto; z-index:300;}
#nav li:hover ul li
{display:block; height:20px; position:relative; float:left; width:170px;}
#nav li:hover ul li a
{display:block;  width:170px; height:14px; padding:0; line-height:14px; text-indent:4px; color:#666; text-decoration:none;}

#nav li:hover ul li a:hover 
{background:#DADADA; color:#333; }

#nav ul, 
#nav li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

/*--- ends Main menu ----*/

/*--- #leftNav ----*/

#navigation, #navigation ul { width:230px; margin:0; padding:0;	background:#FFF; list-style: none;}

#navigation a.setOff, #navigation span.setOff{ width:230px; height:auto; padding:15px 0 10px; font: bolder 1em "Lucida Grande", Arial; color:#333; display: block; position: relative; border-bottom:1px dotted #999; cursor:pointer; text-decoration:none;}

#navigation a.setOff:visited, #navigation .setOff:active{color:#333;  text-decoration:none;}

#navigation a.setOff:hover{ background:#FFF; cursor:pointer;}

#navigation a.setOff.bull, #navigation a.setOff.bull:hover{ background:url(../images/btn/bullet.gif) right 20px no-repeat;}

#navigation a.setOff.flat, #navigation a.setOff.flat:hover{background:#FFF;}

#navigation ul.items{ list-style-type: none; margin: 0; padding: 0; border-bottom:1px dotted #999;text-indent:5px; background:#FFF;}

#navigation ul.items li{ border-bottom:1px dotted #CCC;}

#navigation ul.items li a{display: block;font: normal 1em "Lucida Grande", Arial; color: #666;  padding:3px 3px; text-decoration:none;}

#navigation ul.items li a:hover{background: #DADADA; color:#333;}

#navigation a.selected {background-color: #DADADA;}

#navigation li.collapsable { background:url(../images/btn/arrow_up.gif) right 20px no-repeat;}
#navigation li.expandable { background:url(../images/btn/arrow_down.gif) right 20px no-repeat;}

#navigation li.lastCollapsable {background:url(../images/btn/arrow_up.gif) right 20px no-repeat;}
#navigation li.lastExpandable {background:url(../images/btn/arrow_down.gif) right 20px no-repeat;}


/*--- #contentMenuRight For Right Navigation ----*/

#rightNav a.menuitem{ width:190px; height:auto; padding:15px 0 10px; font: bolder 0.9em "Lucida Grande", Arial; color:#333; display: block; position: relative; border-bottom:1px dotted #999; cursor:pointer; text-decoration:none;}

#rightNav a.menuitem:visited, #rightNav .menuitem:active{color:#333; text-decoration:none;}

#rightNav a.menuitem .statusicon{ position: absolute; top: 40%; right: 5%;}/*CSS for icon image that gets dynamically added to headers*/

#rightNav a.menuitem:hover{ background:#FFF; cursor:pointer;}

#rightNav a.menuitem.bull, #rightNav a.menuitem.bull:hover{ background:url(../images/btn/bullet.gif) 95% 50% no-repeat;}

#rightNav a.menuitem.flat, #rightNav a.menuitem.flat:hover{background:#FFF;}

#rightNav div.submenu{ text-indent:5px; background:#FFF;}

#rightNav div.submenu ul{ list-style-type: none; margin: 0; padding: 0; border-bottom:1px dotted #999;}

#rightNav div.submenu ul li{ border-bottom:1px dotted #CCC;}

#rightNav div.submenu ul li a{display: block;font: normal 0.9em "Lucida Grande", Arial; color: #666;  padding:3px 3px;  text-decoration:none;}

#rightNav div.submenu ul li a:hover{background: #DADADA; color:#333;}

#rightNav div.submenu ul li.moreLinks * { margin:0; padding:0; font: bolder 0.9em "Lucida Grande", Arial; color:#333; border:none;}
#rightNav div.submenu ul li.moreLinks a, #rightNav div.submenu ul li.moreLinks a:hover{ 
background:#FFF; padding:10px 0;}

/*--- PROJECTS Right Navigation ----  PROJECTS SECTION  */ 
#rightNav a.menuitem.arrow, #rightNav a.menuitem.arrow:hover{ background:url(../images/btn/arrow_down.gif) 95% 50% no-repeat;}

#rightNav div.static{ padding:0 0 0 2px; background:#FFF;}

#rightNav div.static ul{ list-style-type:none; margin:0; padding:0; border-bottom:1px dotted #999;}

#rightNav div.static ul li{ border-bottom:1px dotted #CCC;}

#rightNav div.static ul li a{display: block;font: normal 0.9em "Lucida Grande", Arial; color: #666;  padding:3px 3px; text-decoration:none;}

#rightNav div.static ul li a:hover{background: #DADADA; color:#333;}

/*================================= forms =====================================*/

#cntct_form{margin:0; width:400px; padding:20px 0;font:normal 11px "Lucida Grande", Geneva, Arial, sans-serif; color:#000;}
#cntct_form .labels{width:110px; padding-top:5px; height:13px; float:left; clear:right; margin-bottom:20px;}
#cntct_form input[type="text"]{width:250px; height:18px; border-bottom:1px dotted #999; margin-bottom:20px; color:#666;}
#cntct_form textarea{width:250px; height:100px; border:1px dotted #999;margin:5px 0 20px 0; font:normal 11px "Lucida Grande", Arial; color:#666;}
#cntct_form select{width:250px; height:18px;  background:#FFF; border:none; border-bottom:1px dotted #999; margin:5px 0 20px 0; color:#666;}
#cntct_form select a:hover{ background:#DADADA;}

#cntct_form div.submit a{width:110px; padding:3px 0; margin-right:40px; height:13px; float:right; margin-bottom:20px; border:1px dotted #999; text-align:center; text-decoration:none;}
#cntct_form div.submit a:hover{width:110px; padding:3px 0; margin-right:40px; height:13px; float:right; margin-bottom:20px; border:1px dotted #999; background:#DADADA; text-align:center; text-decoration:none}

#cntct_form label.check{font:normal 1em "Lucida Grande", Geneva, Arial, sans-serif; color:#666;}
#cntct_form label.check input[type="checkbox"]{ margin: 2px 15px; font:normal 1em "Lucida Grande", Geneva, Arial, sans-serif;}
/* -------- contac form ends -----------*/


#regs_form{margin:0; width:570px; padding:40px 80px 0;font:normal 11px "Lucida Grande", Geneva, Arial, sans-serif; color:#000; background:#FFF;
opacity: 0.85; -ms-filter:"alpha(opacity=85)"; filter: alpha(opacity=85);}

#regs_form .labels{width:110px; padding-top:5px; height:13px; float:left; clear:right; margin-bottom:20px; text-transform:none;}
#regs_form input[type="text"]{width:250px; height:18px; border:none; border-bottom:1px dotted #666; margin-bottom:20px; color:#333;}
#regs_form p{ margin-bottom:30px; font:normal 1em "Lucida Grande", Arial; color:#333; text-transform:none;}

#regs_form div.register-btn a{width:70px; padding:3px 0; height:13px; float:right; margin:-40px 50px 30px 0; border:1px dotted #666; text-align:center; text-decoration:none;}
#regs_form div.register-btn a:hover{width:70px; padding:3px 0; height:13px; float:right; margin:-40px 50px 30px 0; border:1px dotted #666; background:#DADADA; text-align:center; text-decoration:none}

/*================================= Togller for containers =====================================*/


.container {width: 500px;margin:0;border-bottom:1px dotted #999;}

h2.trigger {width: 500px;padding:0 0 5px 0; color:#333;font:bold 1.1em "Lucida Grande", Arial; cursor: pointer;
background: url(../images/btn/icn_plus_minus.gif) right top no-repeat;}
h2.active {background:url(../images/btn/icn_plus_minus.gif) right bottom no-repeat; border:none;}
.toggle_container {width: 500px; padding:10px 0 20px 0;overflow: hidden;}
.toggle_container img {	margin: 20px 0;}
.toggle_container img.panelPDF{margin:0;}

.txtPDF{font: normal 0.9em "Lucida Grande", Arial; color:#666; margin-top:10px;}
.txtPDF span{margin:0 10px 0 0}

/*================================= Gallery LightBox =====================================*/
 
 .gallery {	width: 500px; font:normal 11px "Lucida Grande", Arial, Arial, sans-serif;}
	.gallery ul{  margin:0; clear:both; }
	.gallery li { width:180px; margin:0 40px 20px 0; display:inline; float:left; min-height:175px; border-bottom: 1px dotted #999;}
	.gallery img{margin-bottom:5px}
	.gallery a.img{ display:block;}
	.gallery a.img:hover { left:1px; top:1px;}
	.gallery p { display:block; color:#666;}
	
/*================================= Gallery LightBox =====================================*/
 
 .files{width: 500px; font:normal 11px "Lucida Grande", Arial, Arial, sans-serif;}
	.files ul{  margin:0;}
	.files li {border-bottom: 1px dotted #999;}
	.txtFiles{  height:16px; padding:10px 10px; float:left; clear:both;}
	.imgFiles{ height:16px; padding:10px 0; float:left;}
	
/* -------- Scroll Container -----------*/
#mycustomscroll {
width:680px;
padding-right:30px;
height: 350px;
overflow: auto;
/* IE overflow fix, position must be relative or absolute*/
position: relative;
text-align: left;
}

/* -------- Q tip -----------*/

div#qTip {
 padding: 5px 8px;
 border-bottom: 1px dotted #999;
 display: none;
 background: #FFF;
 font: normal 0.8em "Lucida Grande", Arial; color: #666;
 text-align: left;
 position: absolute;
 z-index: 9000;
}