﻿/* the top menu trail */
div.trail {height:10px; margin-top:9px; margin-left:17px;}
div.trail a, div.trail span { float:left; display:block; color:#244f85; font-size:10px; } 
div.trail span.sep { width:12px; height:100%; background-image:url("../images/trail.png")no-repeat; background-position:5px 4px; }
div.trail span.last {font-weight:bold; }

/* banner */
div.bannerFrame { overflow:auto; width:811px; height:306px; margin-left:5px; background-image:url('Images/bannerFrame.jpg'); background-repeat:no-repeat; padding-left:11px;position:relative; }
div.bannerFrame h3 { margin:34px 0px 0px 0px; border-left:solid 40px #7BC143; height:20px; padding-left:10px; font-size:24px; line-height:24px; color:#7BC143; }
/* top banners */
div.topbanner { position:relative; height:138px;}
div.topbanner > div { display:none; position:absolute; left:0px; top:0px;}
ul.bannerText { margin-top:17px; margin-left:52px; list-style-position:inside; height:110px; color:#7BC143; width:450px;  }
ul.bannerText > li {padding-bottom:5px; }
ul.bannerText > li > span { color:#777777; font-size:14px; }
/* banner tabs */
ul.bannerTabsTop { list-style-type:none; padding-left:50px; z-index:500; margin:0; overflow:hidden; }
ul.bannerTabsTop li.banActiveTop { background:url('Images/CtrlBtns.png') -25px -2px; }
ul.bannerTabsTop > li { margin-right:15px; overflow:hidden; float:left; height:22px; width:143px; background-repeat:no-repeat; position:relative; z-index:10;}
ul.bannerTabs { list-style-type:none; padding-left:50px; margin:0; }
ul.bannerTabs li { margin-right:15px; overflow:hidden; float:left; height:80px; width:143px; background-repeat:no-repeat; position:relative; }
/* ul.bannerTabs li > h4 {color:#fff; font-weight:bold; margin-top:20px; font-size:15px; height:25px; text-align:center;} */
ul.bannerTabs li > h4 {color:#fff; font-weight:bold; margin-left:5px; margin-top:10px; font-size:15px; height:25px; }
ul.bannerTabs li > h4 > span { font-size:14px; display:block; padding-left:1px; z-index:1000; }
ul.bannerTabs li > span { display:block; font-weight:bold; font-size:11px; padding-left:5px; padding-top:10px; }
ul.bannerTabs li:hover > span { color:#fff;}
ul.bannerTabs li.banActive { background:url('Images/CtrlBtns.png') -25px -24px; }
li.banActive span { color:#fff; }
ul.bannerTabs li.banNotActive { background:url('Images/CtrlBtns.png') -25px -243px; }
ul.bannerTabs li.banNotActive:hover {background-position:-25px -135px; cursor:pointer; }
ul.bannerTabs li h3 { display: none; }
/* top banner */
div#topbanner_CCC { display:block; }
div#topbanner_CCC > span { display:block; margin-left:50px; margin-top:10px; font-size:20px; color:#7BC143; }
img#topbanner_img1 { position:absolute; top:0px; top:-30px; left:470px; }
img#ce {position: absolute;top: 40px;left: 720px;}
img#etl {position:absolute;top:90px; left:720px; }

/* body heading title */
div#bodyHeading {width:786px; height:34px; margin-left:16px; margin-top:5px; background-image:url('Images/BodyHeaderBackground.png'); background-repeat:no-repeat; padding-top:5px;position:relative; } 
div#bodyHeading span.prodName { border-left:solid 40px #7BC143; height:20px; padding-left:10px; font-size:16px; line-height:21px; color:#777777; font-weight:bold }
div#bodyHeading span.prodDetail { height:20px; font-size:16px; line-height:21px; color:#777777;}
/* body top buttons */
div.downloadBtns { border-spacing:0px; margin-left:16px;}
div.downloadBtns > a { display:inline-block; height:29px; }
a.selectSoftware { background:url('Images/CtrlBtns.png') no-repeat -25px -359px; width:245px; margin-right:106px; visibility: hidden; }
a.selectSoftware:hover {background-position:-274px -359px; cursor:pointer;}
div.downloadBtns > div {display:inline-block; height:29px;  /* margin-left:260px; */ position:relative; }

a.pdfBtn_cat {
	background: url('Images/pdf-download.png') no-repeat 0px -26px;
	width: 162px;
	height: 26px;
	display: block;
}

	a.pdf_cat_pop, a.pdfBtn_cat:hover {
		background-position: 0px 0px;
		cursor: pointer;
	}

a.pdfBtn1 {background:url('Images/CtrlBtns.png') no-repeat -484px -24px; width:81px; height:29px; display:block; }
a.pdf_bro_pop, a.pdfBtn1:hover {background-position:-484px -68px; cursor:pointer;}
a.pdfBtn2 {background:url('Images/CtrlBtns.png') no-repeat -484px -113px;  width:81px; height:29px; margin-left:5px; display:block;}
a.pdf_instr_pop, a.pdfBtn2:hover {background-position:-484px -153px; cursor:pointer;}
/* the popups for the pdfs */
#pop_cat {
	display: none;
	width: 230px;
	position: absolute;
	left: -4px;
	top: 26px;
	z-index: 10000;
}
#pop_bro { display:none;  width:230px; position:absolute; left:-4px; top:28px; z-index:10000; }
#pop_instr { display:none; width:260px; position:absolute; left:1px; top:28px; z-index:10000; }
div.popPdf { display:table; border-spacing:0; text-align:left; padding:0; margin:0; min-width:170px;}
div.popC2 > ul { list-style-type:none; }
div.popC2 a { display:inline-block; width:100%; cursor:pointer; color:#705D62;  padding-right:5px }
div.popC2 a.apModel1 { height:25px; padding-top:12px;}
div.popC2 a.apModel2 { height:25px; }
div.popC2 a.apModel3 { height:25px; padding-bottom:5px; }
div.popC2 { padding:10px 15px 15px 10px; display:table-cell; height:100%; border:solid 1px #a698a1; background-color:#ffffff; color:#705D62; font-size:12px; }
div.popC2 li.sel { font-weight:bold; padding:5px 0px 4px 5px; border-bottom:1px solid #E5E5E5; background-color:#e5e5e5; overflow:hidden;}
div.popC2 li.sel > span { float:right; margin-right:10px; }
div.popC2 li { padding-left:6px;}
div.popC1 { width:4px; display:table-cell; height:100%; background-image:url('Images/LShadow.png'); background-repeat:repeat-y; background-position:0px 0px; padding-top:5px;}
div.popC3 { width:4px; display:table-cell; height:100%; background:url('Images/RShadow.png') repeat-y 0px 0px; }

/* Collapsible*/
div.cPanel { margin-left:15px; overflow:hidden; min-width:820px; }
div.cPanel a { color:#023b87; text-decoration:none;}
div.cPanel a:hover { text-decoration:underline; }
div.cPanelOpen > .titles, div.cPanelClosed:hover .titles { background:url('Images/miniGradient.png') no-repeat; }
div.cPanelOpen > .titles:hover > span { color:#7BC143; /* 47505c; */}
div.cPanelClosed > .titles:hover > span { color:#7BC143; }
div.cPanelOpen > .titles > div { background-position:-34px -400px; }
div.cPanelOpen > .mainTitles, div.cPanelClosed:hover .mainTitles { background:url('Images/BodyHeaderBackground.png') no-repeat; }
div.cPanelOpen > .mainTitles:hover > span { color:#7BC143; /* 47505c; */}
div.cPanelClosed > .mainTitles:hover > span { color:#7BC143; }
div.cPanelOpen > .mainTitles > div { background-position:-34px -400px; }
div.cPanelClosed > div.cPanelBody { display:none; }
div.cPanel.gap { margin-top:70px; }

/* section details: overview, features, BACnet, etc ..*/
div#innerPageGrp { position:relative; min-height:430px; }
ul.detLst { list-style-type:disc; margin:10px 0px 12px 38px; list-style-position:outside; }
ul.detLst li, ul.detLst a { font-size:14px; }
ul.detLst > li { padding:0px 30px 8px 0px; margin:0; }
ul.detLst > li > ul { list-style-type:circle !important; padding-top:10px; margin-left:15px;}
ul.detLst > li > ul > li { padding-bottom:5px; }
ul.detLstNum { list-style-type:decimal; margin-left:47px !important;}
ul.detLstNum > li { padding:0px 30px 8px 0px; margin:0; }

div.content { width:100%; }
div.leftContent { width: 50%; float:left; }
div.rightContent { width: 50%; float:left; }
div.leftContent img { padding-top: 45px; }
div.titles { cursor:pointer; }
div.titles span { color:#777777; font-size: 16px; line-height:34px; padding-left: 5px; font-weight:bold; }
div.titles div { height: 34px; width:20px; float:left; background: url('Images/CtrlBtns.png') no-repeat scroll -57px -400px; }
div.mainTitles { cursor:pointer; font-size: 16px; line-height:34px; color:#777777; }
div.mainTitles span { color:#777777; font-size: 16px; line-height:34px; padding-left: 5px; font-weight:bold; }
div.mainTitles div { height: 34px; width:20px; float:left; background: url('Images/CtrlBtns.png') no-repeat scroll -57px -400px; }
div.rightContent h1, div.leftContent h1 { font-size: 18px; padding-bottom: 10px; padding-top: 10px; }
div.rightContent ul, div.leftContent ul { padding-left: 35px; margin-bottom: 12px; margin-top:10px; width: 350px; }
div.rightContent li, div.leftContent li { font-size:14px!important; padding: 0px 0px 6px 0px; } 
div.rightContent li span, div.leftContent li span { color: #dc0303; font-weight:bold; } 
div.rightContent p { padding-left:25px; padding-top:5px; padding-bottom:5px; font-size:14px; width:350px; line-height:20px; }
div.content a { color:#4D4849; }


div.content > h5 { font-size:14px; color:#000; font-weight:bold; text-align:center; margin-left:25px; margin-top:5px;}
div.content > h5.cnotbl { margin-top:20px;}


div.rightContent table.grid tr.tall { height:25px; }
div.rightContent table.grid tr.odd { background-color:#ECF3E1; }
div.rightContent table.grid tr.short { height:24px; }
div.rightContent table.grid tr.even { background-color:#FFF; }
div.rightContent table.grid td.rb { border-right:1px solid #DBEAC6; }
div.rightContent table.grid td.w1T { width:110px; text-align:center; font-weight:bold; }
div.rightContent table.grid td.w2T { width:160px; text-align:center; font-weight:bold; }
div.rightContent table.grid td.w3T { width:120px; text-align:center; font-weight:bold; }
div.rightContent table.grid td.w1 { width:100px; text-align:center; }
div.rightContent table.grid td.w2 { width:160px; text-align:center; }
div.rightContent table.grid td.w3 { width:120px; text-align:center; }
div.rightContent table.grid td.bb { border-bottom:1px solid #DBEAC6; }
div.rightContent table.grid td.wTop { text-align:center; font-weight:bold; }
div.rightContent table.grid td, div.rightContent table.grid td a { color:#4D4849; font-size:12px; }

div#CCC > div > img.ssrimg{margin-top:0px; margin-left:20px; margin-bottom:0px;} 
div#CCC > h4.ssrimg-1 {position:absolute; top:30px; left:34px; color:#183f70; font-size:14px;}
div#CCC > h4.ssrimg-1  > span, div.content h5.fc-efc-h52 > span { display:block; font-size:11px; font-weight:normal; text-align:center;}
div#CCC > h5.ssrimg-2 {position:absolute; top:172px; left:75px; color:#183f70; text-align:right;font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-2  > span, div.content h5.fc-efc-h52 > span { display:block; font-weight:normal; text-align:right;font-size:10px;}
div#CCC > h5.ssrimg-4 {position:absolute; top:215px; left:88px; color:#183f70; text-align:right; font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-5 {position:absolute; top:285px; left:73px; color:#183f70; text-align:right; font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-6 {position:absolute; top:170px; left:306px; color:#183f70; font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-6  > span, div.content h5.fc-efc-h52 > span { display:block;text-align:right;font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-7 {position:absolute; top:112px; left:198px; color:#183f70; font-size:10px;font-weight:normal;}
div#CCC > h4.ssrimg-8 {position:absolute; top:45px; left:290px; color:#183f70;font-size:12px;font-weight:normal;}
div#CCC > h5.ssrimg-9 {position:absolute; top:90px; left:340px; color:#183f70; font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-10 {position:absolute; top:90px; left:471px; color:#183f70;font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-11 {position:absolute; top:195px; left:460px; color:#183f70;font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-12 {position:absolute; top:237px; left:52px; color:#183f70;font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-13 {position:absolute; top:252px; left:49px; color:#183f70;font-size:10px; font-weight:normal;}
div#CCC > h5.ssrimg-14 {position:absolute; top:250px; left:240px; color:#183f70;font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-15 {position:absolute; top:156px; left:223px; color:#ffffff; text-align:center; font-size:10px;}
div#CCC > h5.ssrimg-15  > span, div.content h5.fc-efc-h52 > span { display:block;text-align:center;font-size:10px;}
div#CCC > h5.ssrimg-3 {position:absolute; top:227px; left:13px; color:#183f70; text-align:center; font-size:10px;font-weight:normal;}
div#CCC > h5.ssrimg-3  > span, div.content h5.fc-efc-h52 > span { display:block;text-align:center;font-size:10px;font-weight:normal;}

/* brochure*/
div.proBro { margin-left: 0px; }
div.proBro a:hover { text-decoration:none; }
#proBro { font-size:14px; color:#8d97a4; font-weight:bold; }
#pdfDown{ width:162px; height:26px; display:block; overflow:hidden;}
#pdfDown img{ margin-top:-26px;}
#pdfDown:hover img{ margin-top:0px;}

.techTime {
    background-color: #a6afb8;
    width: 90px;
    margin-left: 5px;
    border-top-right-radius: 15px;
    vertical-align: top;
}

    .techTime span {
        padding-left: 10px;
        color: white;
        font-weight: bold;
        line-height: 29px;
    }

    .techTime:hover {
        background-color: #20558a;
    }

a.techTime:hover {
    text-decoration: none;
}

/*20210129-Responsive Master*/

div.popC2 a.apModel1 {
    padding-top: 6px;
    height: 25px;
}




ol, ul {
    margin-bottom: 0;
}

table {
    border-collapse: separate;
}




/*Responsive 2021-04-20*/
@media (max-width: 767.98px) {
    a.selectSoftware, div.spacer {
        display: none !important;
    }
}

table.grid {
    border: solid 1px #9aae81;
}
table.grid {
    width: 355px;
    margin-top: 5px;
    text-align: right;
}
table.header {
    margin-top: 12px !important;
    margin-left: 0;
}
table.grid tr.odd {
    background-color: #ecf3e1;
    background-clip: padding-box;
}
table.grid tr.superTall {
    height: 35px;
}
table.grid td.rb {
    border-right: solid 1px #dbeac6;
}
table.grid td.wModelIP {
    width: 75px;
    text-align: center;
}
table.grid td {
    color: #4d4849;
    font-size: 12px;
    border: solid 1px transparent;
}
    table.grid td.rb {
        border-right: solid 1px #dbeac6;
    }
    table.grid td.wPrice {
        width: 52px;
        text-align: center;
    }
table.grid td {
    color: #4d4849;
    font-size: 12px;
    border: solid 1px transparent;
}
    table.grid td.wItem {
        width: 52px;
        text-align: center;
    }