@charset "UTF-8";
/* CSS Document 
// ------------------------------------------------------------  
// path: https://elitelightinggroup.com/css/global/main.css
// global main page layout for all sites
// for main dynamic page
// last revision: 2010-08-12
// ------------------------------------------------------------ 

/* ------------------------------------------------------------ 
// Blocks of Images
------------------------------------------------------------ */
	.indexWrap,
	.indexList {
		clear: both;
		float: left;
		width: 570px;
		height: 190px;
		margin-bottom: 10px;
	}
	
	/* block of images */
	.indexBlock {
		float: left;
		width: 182px;
		border: 1px solid #CCC;
		margin-left: 6px;
		margin-right: 6px;
		margin-bottom: 12px;
	}
	.blockAccessories {
		margin-right:  2px;
	}
	.height3 {
		height: 300px;
	}
	.indexBlock img {
		width: 180px;
		height: 120px;
		padding: 1px;
		border-bottom: 1px solid #CCC;
	}
	/* overwrite it for overlay */
	.simple_overlay img {
		width: 588px;
		height: 248px;
		padding: 3px;
		border-bottom: none;
	}
	.indexBlock .info {
		float: left;
		height: 4.5em;
		padding: 0px 5px;
	}
	.indexBlock .info_tall,
	.blockAccessories.info_tall {
		height: 6em;
	}
	.indexBlock .info .icon { }
	.indexBlock .info .icon img {
		width: 35px;
		height: 35px;
		border-bottom: none;
	}
	
	.indexBlock .info h1 {
		font-size: 1.3em;
		font-weight: bold;
	}
	.indexBlock .info li {
		font-size: 1em;
	}
	.indexBlock .info .lamp_type li img {
		border-bottom: none;
		width: 27px;
		height: 27px;
	}
	.indexBlock .info .lamp_type li {
		float: left;
		border: 1px solid #ccc;
		margin-top:3px;
		margin-right: 8px;
	}
	
	.indexBlock .es {
		clear: both;
		float: right;
		position: absolute;
		text-align: right;
		width: 180px;
	}
	.indexBlock .es img {
		width: 25px;
		height: 25px;
		border-bottom: none;
	}
	.indexBlock .prodlineBox { height: 7em; }

	/* list of products */
	.indexList {
		margin-left: 7px;
		margin-right: 7px;
		margin-bottom: 12px;
		height: 20px;
		border-bottom: 1px solid #ccc;
	}
	.indexList dl {
		clear: both;
	}
	.indexList dt {
		float: left;
		padding: 0px 0px 5px 0px;
	}
	.indexList dt.driver_part {
		float: left;
		width: 250px;
		padding-left: 20px;
	}
	.indexList dt.driver_info {
		float: left;
		width: 300px;
	}
	/* Header blocks, changes color based on categories or aperture	*/
	#header {
		clear: both;
		float: left;
		width: 566px;
		margin-left:10px;
		margin-bottom: 10px;
	}
	
	#header_product {
		clear: both;
		float: left;
		width: 582px;
		margin-left:3px;
		margin-bottom: 10px;
	}
	
	#header .icon_category,
	#header_product .icon_category {
		clear: both;
		float: left;
		width: 35px;
		height: 35px;
	}
	#header .icon_aperture,
	#header_product .icon aperture {
		float: left;
		width: 35px;
		height: 35px;
	}
	#header h2,
	#header_product h2 {
		float: left;
		height: 26px;
		font-size: 1.25em;
		padding: 9px 0px 0px 10px;
	}

	#main h3.header,
	#main .transformer_header,
	#main h3.link_header {
		clear: both;
		float: left;
		width: 575px;
		height: 26px;
		font-size: 1.25em;
		padding: 9px 0px 0px 5px;
		border-bottom: 1px solid #66903D;
		margin-left: 3px;
		margin-bottom: 10px;
		line-height: 2em;
	}
	##main .transformer_header {
		height: auto;
	}
	#main .transformer_header {
		width: 555px;
		margin-left: 5px;
		padding: 9px 0px 0px 12px;
	}
	#main transformer_header li {
		font-size: 0.9em;
	}
/* ------------------------------------------------------------ 
// Pop Up Page
------------------------------------------------------------ */

	#header_popUp {
		clear: both;
		float: left;
		margin-bottom: 10px;
	}
	#header_popUp ul {
		width: 590px;
		height: 26px;
		padding: 9px 0px 0px 10px;
	}
	#header_popUp ul h2 {
		font-size: 1.2em;
	}

	#tabsPopUp .trim {
		float: left;
	}
	
/* ------------------------------------------------------------ 
// Product Page
------------------------------------------------------------ */

	/* width: 568px; */
	
	#productInfo,
	.productLink,
	.productIcon {
		clear: both;
		float: left;
		width: 568px;
		margin-left:10px;
	}
	
	#productImage .es {
		position: absolute;
		float: right;
		width: 578px;
		text-align: right;
		border-bottom: none;
		z-index: 10;
	}

	#productImage .es img {
		width: 50px;
		height: 50px;
	}
	#productImage,
	#lineDrawing,
	#lineDrawingPopUp {
		clear: both;
		float: left;
		border: 1px solid #DDD;
		margin-left:3px;
		width: 580px;
		height: 250px;
	}
	
	/* only inside the pop up */
	#tabsPopUp #productImage { 
		margin-left: 5px;
		margin-bottom: 10px; 
	}
	/* margin bottom */
	#tabsPopUp .feature_lists #productImage { margin-bottom: 10px;}
	
	#productInfo {
		margin: 3px 0px 5px 10px;
	}

	#productInfo h3 {
		font-size: 1.25em;
	}
	#productInfo h4 {
		margin: 0px;
		font-size: 1em;
	}
	
	.productLink {
		margin-left: 0px; /* inside the productImage, no need to redeclare */
		border-top: 1px solid #ddd;
		margin-top: 3px;
		padding-top: 3px;
		font-size: 12px;
	}
	.productLink li {
		float: left;
		padding-right: 10px;
	}
	.productLink li.view { border-right: 1px solid #ddd; padding-top: 2px;}
	.productLink li.others { border-left: 1px solid #ddd; padding-left: 10px; padding-top: 2px; }
	.productLink li.others_bordeRight { border-right: 1px solid #ddd; padding-top: 2px; }
	.productLink li.icon { padding-left: 10px; }
	.productLink li.catpg { padding-left: 10px; }
	.productLink li.pdfText { padding-top: 2px; }
	.productLink li.patent { 
		float: right;
		font-weight: bold;
		background-color: #f00;
		color: #fff;
		padding-left: 10px;
		padding-top: 2px;
	}
	.productLink li.available { 
		float: right;
		font-weight: bold;
		color: #f00;
		padding-top: 2px;
	}

	.productIcon {
		margin: 0px 0px 5px 10px;
	}
/* ------------------------------------------------------------ 
// Product Descriptions inside tabs
------------------------------------------------------------ */
	.feature_lists,
	.feature_listsPopUp { 
		margin: 0px 2px 10px 2px;
		color: #555;
		width: 570px;
		text-align: justify;
	}
	.feature_listsPopUp { 
		width: 580px;
	}
	#tabsPopUp .trim h3,
	.feature_lists h3,
	.feature_listsPopUp h3 {
		line-height: 1.15em;
	}
	
	#tabsPopUp .trim h3,
	.feature_lists h3.descriptive,
	.feature_listsPopUp h3.descriptive {
		font-size: 1.15em;
		padding-left: 10px;
		padding-top: 3px;
		line-height: 1.5em;
	}
	#tabsPopUp .trim h3 { 
		clear: both;
		float: left;
		margin-top: 5px; 
		line-height: 1.25em;
		border-bottom: 1px solid #ccc;
	}
	
	.feature_lists h3.description,
	.feature_listsPopUp h3.description {
		font-size: 1em;
		padding-left: 20px;
	}
	.feature_lists p,
	.feature_listsPopUp p {
		font-size: 1em;
		padding: 0px 10px 0px 20px;
		text-align: justify;
	}
	.feature_lists p.no_desc,
	.feature_listsPopUp p.no_desc {
		padding: 0px 10px 0px 10px;
	}
	.feature_lists li,
	.feature_listsPopUp li {
		font-size: 1em;
		padding-left: 20px;
		margin-left: 10px;
		text-align: justify;
		text-indent: -1em;
		list-style: disc inside;
	}

/* ------------------------------------------------------------ 
// Product Technical
------------------------------------------------------------ */
	/* Line art*/
	#lineDrawing {
		border: none;
		float: left;
		height: auto;
		margin-left:0px;
	}
	#lineDrawing .block {
		float: left;
	}
	#lineDrawingPopUp {
		margin-left:5px;
		height: 100%;
	}
	#lineDrawingPopUp .block {
		float: left;
		text-align: center;
		width: 288px;
	}

	/* Compliance	*/
	.compliance{
		float: left;
		clear: both;
		width: 550px;
		padding: 10px 10px 0px 5px;
		margin-bottom: 5px;
	} 
	.compliance li,
	.tech_left .comliance li {
		padding: 5px 5px 0px 5px;
		float: left;
		border: 1px solid #ccc;
		margin-right: 5px;
	}
	
	
	/* Technical */
	
	.border { border: 1px solid #5d8822; }
	.border_top { border-top: 1px solid #dfe7d3; }
	.no_border_top { border-top: none; }
		
	/* Technical Specification */
	.tech_left{
		clear: both;
		float: left;
		display: block;
	}
	.tech_right .tb_specs {
		float: left;
		width: 280px;
		margin: 5px 0px 5px 5px;
		border-left: 1px solid #dfe7d3;
		border-right: 1px solid #dfe7d3;
	}
	.tech_left .tb_measurement,
	.tech_left  .compliance {
		clear: both;
		float: left;
		width: 280px;
		margin: 5px 5px 5px 5px;
		border-left: 1px solid #dfe7d3;
		border-right: 1px solid #dfe7d3;
	}
	.tech_left  .compliance {
		border-left: none;
		border-right: none;
		padding: 0px;
		margin: 0px 5px 5px 5px;
	}	
	.tech_right .tb_specs dl, 
	.tech_left .tb_measurement dl {
		clear: both;
		float: left;
		border-bottom: 1px solid #dfe7d3;
		width: 280px;
	}
	
	.tech_right .tb_specs dt, .tech_right .tb_specs dd,
	.tech_left .tb_measurement dt, .tech_left .tb_measurement dd {
		float: left;
		padding: 2px 0px 2px 5px;
		line-height: 1.5em;
	}
	.tech_right .tb_specs dt,
	.tech_left .tb_measurement dt {
		font-weight: bold;
		width: 130px;
		padding-left: 10px;
		margin-left: 10px;
		text-indent: -1.2em;
		border-right: 1px solid #dfe7d3;
	}
	.tech_right .tb_specs dd,
	.tech_left .tb_measurement dd {
		font-weight: normal;
		width: 115px;
	}
	
	.trimLineDraw .block {
		float: right;
	}
	

/* ------------------------------------------------------------ 
// Block of Product display as list
// @ tabs technical for cove, tabs transformer
------------------------------------------------------------ */

	.list_as_table {
		clear: both;
		float: left;
		width: 545px;
		margin: 5px 0px 10px 15px;
		border-top: 1px solid #CCC;
		display: block;
	}
	
	.tb_cove dl,
	.tb_tapelight dl {
		clear: both;
		float: left;
		width: 539px;
		padding: 3px;
		margin: 0px;
		display: inline;
		list-style: none;
	}

	.tb_cove dl li {
		list-style: none;
		margin: 0px;
	}


/* ------------------------------------------------------------ 
// Trims inside the trims
------------------------------------------------------------ */

	.trims { float: left; }

	.trimPanel {
		float: left;
		width: 570px;
		margin: 5px;
		padding-bottom: 10px;
	}
	
	/* trim block photo: block left */
	.trimPanel .trimBlock_Photo {
		float: left;
		width: 180px;
	}
	.trimPanel .trimBlock_Photo .trimPhoto {
		float: left;
		width: 180px;
		height: 125px;
/*		border: 1px solid #dfe7d3;*/
	}
		
	/* trim block info: block right */
	.trimPanel .trimBlock_Info { 				
		float: left;
		width: 375px;
		margin-left: 10px;
		margin-top: 8px;
	}
	
	.trimPanel h3,
	.trimPanel .trimBlock_Info .trimInfo h3 {
		font-size: 1em;
		font-weight: bold;
		color: #3c6600;
		padding-bottom: 0px;
	}

	/* change the border bottom colors according to the tabs color */
	.trimPanel,
	.trimPanel .trimBlock_Info .trimInfo,
	.trimPanel .trimBlock_Info .infoBlock_left dl {
		 border-bottom: 1px solid #ddd;
	}

	.trimPanel .trimBlock_Info .infoBlock_left {
		clear: both;
		float: left;
		width: 210px;
		margin-right: 3px;
	}
	.trimPanel .trimBlock_Info .infoBlock_left dl {
		float: left;
		width: 210px;	
	}
	.trimPanel .trimBlock_Info .infoBlock_left dl.noborder {
		border-bottom: none;		
	}
	.trimPanel .trimBlock_Info .infoBlock_right {
		float: left;
		width: 145px;
	}
	
	/* download panels*/
	.trimPanel .trimBlock_Info .infoBlock_right .download dl {
		float: left;
		border: none;
		width: 140px;
		margin: 0px 0px 0px 8px;
	}
	.trimPanel .trimBlock_Info .infoBlock_right .download dl.list {
		float: left;
		width: 140px;
		margin-top: 0px;
		padding-bottom: 5px;
		font-size: 0.8em;
	}
	.trimPanel .trimBlock_Info .infoBlock_right dl.retrofit {
		font-size: 0.9em;
	}
	.trimPanel .trimBlock_Info .infoBlock_left dl.info p {
		margin: 3px 0px;
	}
	
	/* t = text */
	.trimPanel .trimBlock_Photo  li.tHeader,
	.trimPanel .trimBlock_Info li.tHeader {
		font-weight: bold;
		float: left;
		padding-right: 15px;
		line-height: 1.5em;
	}
	.trimPanel .trimBlock_Photo  li.t, 
	.trimPanel .trimBlock_Info li.t {
		font-weight: bold;
		float: left;
		line-height: 1.5em;
	}

	/* download panels -> download icons */
	.trimPanel .trimBlock_Info .download {
		clear: both;
		float: left;
		margin: 0px 5px 5px 5px;
		width: 160px;
	}
	.trimPanel .trimBlock_Info .download li {
		clear: none;
		float: left;
		margin-right: 3px;
		padding: 0px 6px;
/*		border-right: 1px solid #dfe7d3;*/
	}
	.trimPanel .trimBlock_Info .download li.txt {
		clear: none;
		float: left;
		width: 50px;
		text-align: center;
		border-right: none;
	}
	.trimPanel .trimBlock_Info .download li.cover { border-right: none;}
	.trimPanel .trimBlock_Info .download img {
		width: 32px;
		height: 32px;
	}
	
	.trimPanel .trimBlock_Info li {
		margin-top: 5px;
	}
	
	.trimPanel .trimBlock_Info li.wth {
		clear: none;
		float: left;
		width: 200px!important;
		width: 190px;
		font-weight: bold;
		margin-bottom: 2px;
	}
	.trimPanel .trimBlock_Info li.wth span { color: #FF0000; font-weight: normal; }
	.trimPanel .trimBlock_Info li.wattage {
		clear: none;
		float: left;
		font-weight: normal;
		padding: 2px 4px 1px 4px;
		margin-right: 5px;
		border: 1px solid #DDD;
		
	}
	
	/* icon inside the box */
	/* change the border bottom colors according to the tabs color */
	.trimPanel .trimBlock_Info li.ies,
	.trimPanel .trimBlock_Info li.ss,
	.trimPanel .trimBlock_Info li.pg {
		border: 1px solid #ddd;
		padding: 3px 3px 3px 5px ;
		text-align: center;
		float: left;
		width: 33px!important;
		height: 53px!important;
	}
	.trimPanel .trimBlock_Info li span {
		font-size: 10px;
		margin: 0px;
		padding: 0px;
		text-align: center;
	}
	
	.trimPanel .trimBlock_Info li.ies { }
	.trimPanel .trimBlock_Info li.ss { }
	.trimPanel .trimBlock_Info li.pg {
		padding: 3px 5px;
	}
	
	/* list below the icon boxes */
	.trimPanel .trimBlock_Info dl.list li {
		border: 1px solid #D1DDC4;
		text-align: left;
		float: left;
		padding: 0px 10px;
		width: 115px;
		margin-top: 2px;
	}
	.trimPanel .trimBlock_Info dl.list li.header {
		background-color: #D1DDC4;
		padding: 0px 3px;
		width: 130px;
	}

	/* In PopUp tabs */
	
	#tabsPopUp .trim h3,
	#tabsPopUp .trimDownload .iesBlock h3 {
		width: 580px;
		padding: 0px;
		border-bottom: 1px solid #ccc;
		margin-left: 5px;
	}
	#tabsPopUp .trimDownload .iesBlock h3 { 
		margin-left: 0px; 
		color: #777;
	}
	
	.trimColor,
	.trimDownload .iesBlock  {
		clear: both;
		float: left;
		margin: 5px;
	}
	.trimDownload .iesBlock { margin-bottom: 10px;}
	.trimColor dl,
	.trimDownload .iesBlock dl { 
		clear: both;
		float: left;
		width: 580px;
		margin: 3px 0px;
		border-bottom: 1px solid #DDD;
	}
	.trimDownload .iesBlock  dl { 
		line-height: 1.5em;
	}
	.trimColor dt.t { 
		font-weight: bold;
		float: left;
		width: 150px;
	}
	.trimColor dt.c {
		float: left;
	}
	.trimColor dd { 
		float: left;
		margin-right: 5px;
	}
	.trimColor dd li.color {
		width: 25px;
		height: 25px;
		border: 1px solid #ddd;
	} 
	.trimColor dd li.text {
		font-size: 0.9em;
		padding-left: 2px;
	}
	.trimDownload .iesBlock dd,
	.trimDownload .iesBlock dd li { float: left; }
	.trimDownload .iesBlock dd.wattage { width: 100px;}
	.trimDownload .iesBlock dd.iesFilename { width: 300px; }
	.trimDownload .iesBlock dd.download li.icon { width: 80px; }
	
