/* Global properties ======================================================== */
html {width:100%}
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    color: #000;
    margin:  0px;
}

table  {border-collapse: collapse; }


@font-face {
  font-family: '3of9barcode';
  src: url('/fonts/3of9barcode.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
   url('/fonts/3of9barcode.TTF') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}  

/* Placeholder Text Styling */
input::-webkit-input-placeholder {font: 9pt tahoma; color: #888; font-style:  italic; text-align: center;}
input:-ms-input-placeholder {font: 9pt tahoma;color: #888; font-style:  italic; text-align: center;}
input:-moz-placeholder {font: 9pt tahoma;color: #888; font-style:  italic; text-align: center;}
input::-moz-placeholder {font: 9pt tahoma;color: #888; font-style:  italic; text-align: center;}

.closeIcon {height: 24px; cursor: pointer;}

/* eye icon for passwords */
.container i {
    margin-left: -30px;
    cursor: pointer;
	/* javascript
	const togglePassword = document.querySelector('#togglePassword');
	const password = document.querySelector('#password');
	togglePassword.addEventListener('click', function (e) {
		// toggle the type attribute
		const type = password.getAttribute('type') === 'password' ? 'text' : 'password';
		password.setAttribute('type', type);
		// toggle the eye slash icon
		this.classList.toggle('fa-eye-slash');
	});
	*/
}

/* spinbox remover */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
input[type=number] {
    -moz-appearance:textfield;
}

//remove x from IE input box
input::-ms-clear { display: none; }

.rotate90 {
  transform: rotate(90deg);
  /* Legacy vendor prefixes that you probably don't need... */
 /* Safari */
  -webkit-transform: rotate(90deg);
  /* Firefox */
  -moz-transform: rotate(90deg);
  /* IE */
  -ms-transform: rotate(90deg);
  /* Opera */
  -o-transform: rotate(90deg);
  /* Internet Explorer */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}

.imgBW {
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
	opacity: 0.2;
}

.wrap {position: fixed; left: 0px; right: 0px; top:  0px; bottom:  1px;}
.mainWrapper {position: absolute; left: 0px; right: 0px; width: 100%; height: 100%; min-width: 1000px; min-height: 800px;}

.contentWrapper {position: absolute; z-index: 0; top: 40px; left: 183px; right: 0px; bottom: 2px; background-color: #999; overflow-y: hidden;}

.contentDiv {
	position: absolute; 
	top: 40px; 
	left: 0px; 
	right: 0px; 
	bottom: 0px; 
	background-color: #fff; 
	overflow-y: hidden;
}

.contentFrame {
	position: absolute;  
	left: 0px; 
	top: 2px; 
	right: 0px;
	bottom: 0px; 
	border: none; 
	background-color: #fff;
}

.divTitle {background: transparent; font: 14pt tahoma; color: #000; border: none;}

.divHolder {position: absolute; top: 0px; left: 0px; right: 0px; height: 30px; background-color: #111; overflow-y: hidden;}

.minDivPlaceHolder {
	cursor: pointer;
	width: 9%;
	background-color: #000;
	color: #000;
	height: 30px;
	border-radius: 3px 3px 0px 0px;
}
.minDivPlaceHolder:hover {background-color: #fff; }

.leftMenu {position: absolute; top: 0px; left: 0px; width: 200px; bottom: 0px; background-color: #444; border-right: 3px solid #ff6600;}
.menuItem {font: 14pt tahoma; color: #fff; cursor:  pointer; text-align: right; padding-right: 25px; height: 25px;}
.subMenuItem {font: 14pt tahoma; color: #fff; cursor:  pointer; text-align: center; padding-left: 5px;}
.menuItemOff {font: 14pt tahoma; color: #666;}
.submenu {display: none; position: absolute; z-index: 90000; width: 240px; top: 120px; left: 180px; min-height: 50%; max-height: 75%; 
	border: 1px solid #222; background-color: #555; box-shadow: 3px 3px 3px #000; overflow-y: auto;}

.topBanner.logo {position: fixed; top: 0px; left: 0px; width: 150px; background-image: url(../images/logo-SCSPoS.png); background-repeat: no-repeat;}
.topBannerInfo {position: absolute; top: 10px; right: 25px; width: 250px; font: 14pt tahoma; color:  #fff;text-align:  right;}
.topBannerOptions {position: absolute; bottom: 3px; right: 25px; width: 250px; font: 11pt tahoma; color:  #fff; text-align:  right;}

.logoutButton {width: 60px; text-align:  center; color: #222; background-color:  rgba(255,255,255,0.9); border-radius: 3px; cursor: pointer;}
.userInfo {position:  fixed; top:  0px; left:  10px; font:  13pt tahoma; color:  #fff;}

.minimizedDivs {position:  fixed; top:  0px; right:  5px; width:  400px; bottom: 2px; background-color:  #333; overflow-y: auto;}
.POScontentSpace {position: fixed; top: 0px; left: 202px; right: 415px;  bottom: 2px; background-color: #222;}

.thumbnail {
  position: relative;
  -ms-zoom: 0.25;
  -moz-transform: scale(0.25);
  -moz-transform-origin: 0 0;
  -o-transform: scale(0.25);
  -o-transform-origin: 0 0;
  -webkit-transform: scale(0.25);
  -webkit-transform-origin: 0 0;
}

/* tabs */
.tabDiv {position: absolute; left: 0px; right: 0px; top:  0px; min-height:  1000px; background-color: #444;}
.tab { display: inline; float: left; height:  45px; width: 120px; border: 1px solid #000; border-radius:  3px 3px 0px 0px; font:  14pt tahoma;
        background-color:  #ccc; color:  #000; padding-top:  5px; cursor:  pointer;}
.tabContent {position: absolute; left: 0px; right: 0px; top:  50px; bottom:  0px; background-color: #333; color:  #ccc; border:  none;}

/* Defaults */
.clickable {color: blue; text-decoration: underline; cursor: pointer;}

.hide {display: none; }

.opacity25 {opacity: 0.25;}
.opacity25:hover {opacity: 1.0;}
.opacity50 {opacity: 0.5;}
.opacity50:hover {opacity: 1.0;}
.opacity75 {opacity: 0.75;}
.opacity75:hover {opacity: 1.0;}

.left {text-align:  left;}
.right {text-align:  right;}
.center {text-align:  center;}
.vtop {vertical-align: top;}
.vmiddle {vertical-align: middle;}
.vbottom {vertical-align: bottom;}
.top-valign {vertical-align: top;}
.middle-valign {vertical-align: middle;}
.bottom-valign {vertical-align: bottom;}
.float-right {float: right;}

.pointer {cursor: pointer;}

.txtBlack {color: #000;}
.txtWhite {color: #fff;}
.txtYellow {color: #ffff00;}
.txtRed {color: #ff0000;}
.txtGrey {color: #777;}
.txt555 {color: #555;}
.txtBlue {color: blue;}


.black-text {color: #000;}
.white-text {color: #fff;}
.yellow-text {color: #ffff00;}
.red-text {color: #ff0000;}
.blue-text {color: blue;}
.ltBlue-text { color: #3ebef7; }
.green-text { color: #69dd2b; }
.dkGreen-text { color: #339933; }
.orange-text {color: #ff6600;}
.ltGrey-text {color: #777;}
.medGrey-text {color: #555;}
.ltGrey2-text {color: #999; }
.gearBlue-text { color: #3281a8;}

.bold-text {font-weight: bold;}
.normal-text {font-weight: normal;}
.italic-text {font-style: italic;}
.underline {text-decoration: underline;}
.shadow-text {text-shadow: 1px 1px 2px #555;}
.strike-text {text-decoration: line-through;}

.upper-text { text-transform: uppercase; }

.wordwrap { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}

.noBG {background: none;}
.bg-transparent {background: transparent; }
.bg-000 {background-color: #000;}
.bg-fff {background-color: #fff;}
.bg-222 {background-color: #222;}
.bg-333 {background-color: #333;}
.bg-444 {background-color: #444;}
.bg-555 {background-color: #555;}
.bg-888 {background-color: #888;}
.bg-999 {background-color: #999;}
.bg-efefef {background-color: #efefef;}
.bg-e0e0e0 {background-color: #e0e0e0;}
.bg-ccc {background-color: #ccc;}
.bg-ltBlue { background-color: #336699; }
.bg-dkBlue { background-color: #003366; }
.bg-orange { background-color: #ff9933; }
.bg-green { background-color: #33ff00; }
.bg-dkGreen { background-color: #339933; }
.bg-red { background-color: #990000; }




@-webkit-keyframes invalid {
  from { background-color: yellow; }
  to { background-color: inherit; }
}
@-moz-keyframes invalid {
  from { background-color: yellow; }
  to { background-color: inherit; }
}
@-o-keyframes invalid {
  from { background-color: yellow; }
  to { background-color: inherit; }
}
@keyframes invalid {
  from { background-color: yellow; }
  to { background-color: inherit; }
}
.bg-yellowFlash {
  -webkit-animation: invalid 1s infinite; /* Safari 4+ */
  -moz-animation:    invalid 1s infinite; /* Fx 5+ */
  -o-animation:      invalid 1s infinite; /* Opera 12+ */
  animation:         invalid 1s infinite; /* IE 10+ */
}




.purple-border {border: 2px solid purple; }
.red-border {border: 1px solid red; }


.f8 {font-size: 8pt;}
.f9 {font-size: 9pt;}
.f10 {font-size: 10pt;}
.f11 {font-size: 11pt;}
.f12 {font-size:  12pt;}
.f13 {font-size:  13pt;}
.f14 {font-size:  14pt;}
.f16 {font-size:  16pt;}
.f18 {font-size:  18pt;}
.f20 {font-size:  20pt;}
.f22 {font-size:  22pt;}
.f24 {font-size:  24pt;}
.f28 {font-size:  28pt;}
.f30 {font-size:  30pt;}
.f32 {font-size:  32pt;}
.f34 {font-size:  34pt;}
.f36 {font-size:  36pt;}

.padding2 {padding: 2px; }
.pad5 {padding: 5px;}
.padL10 {padding-left: 10px; }
.padL15 {padding-left: 15px; }
.padL20 {padding-left: 20px;}
.padL25 {padding-left: 25px;}
.padR5 {padding-right: 5px; }
.padR10 {padding-left: 10px; }
.padR15 {padding-left: 15px; }
.padR20 {padding-left: 20px;}
.padR25 {padding-left: 25px;}

.wd50 {width:  50px;}
.wd80 {width:  80px;}
.wd100 {width: 100px;}
.wd120 {width: 120px;}
.wd130 {width: 130px;}
.wd140 {width: 140px;}
.wd150 {width: 150px;}
.wd180 {width: 180px;}
.wd200 {width: 200px;}
.wd300 {width: 300px;}
.wd350 {width: 350px;}
.wd400 {width: 400px;}
.wd450 {width: 450px;}
.wd500 {width: 500px;}

.w10 {width: 10px;}
.w20 {width: 20px;}
.w25 {width: 25px;}
.w30 {width: 30px;}
.w40 {width: 40px;}
.w50 {width: 50px;}
.w60 {width: 60px;}
.w70 {width: 70px;}
.w80 {width: 80px;}
.w90 {width: 90px;}
.w100 {width: 100px;}
.w110 {width: 110px;}
.w120 {width: 120px;}
.w130 {width: 130px;}
.w140 {width: 140px;}
.w150 {width: 150px;}
.w160 {width: 160px;}
.w170 {width: 170px;}
.w180 {width: 180px;}
.w200 {width: 200px;}
.w210 {width: 210px;}
.w220 {width: 220px;}
.w230 {width: 230px;}
.w240 {width: 240px;}
.w250 {width: 250px;}
.w300 {width: 300px;}
.w325 {width: 325px;}
.w350 {width: 350px;}
.w375 {width: 375px;}
.w400 {width: 400px;}
.w450 {width: 450px;}
.w500 {width: 500px;}

.w3p {width: 3%;}
.w5p {width: 5%;}
.w10p {width: 10%;}
.w11p {width: 11%;}
.w12p {width: 12%;}
.w13p {width: 13%;}
.w14p {width: 14%;}
.w15p {width: 15%;}
.w20p {width: 20%;}
.w25p {width: 25%;}
.w30p {width: 30%;}
.w35p {width: 35%;}
.w40p {width: 40%;}
.w45p {width: 45%;}
.w50p {width: 50%;}
.w60p {width: 60%;}
.w70p {width: 70%;}
.w75p {width: 75%;}
.w80p {width: 80%;}
.w90p {width: 90%;}
.w95p {width: 95%;}
.w98p {width: 98%;}
.w99p {width: 99%;}
.w100p {width: 100%;}

.h0 {height: 0px; }
.h1 {height: 1px; }
.h2 {height: 2px; }
.h3 {height: 3px; }
.h4 {height: 4px; }
.h5 {height: 5px; }
.h10 {height: 10px;}
.h15 {height: 15px;}
.h20 {height: 20px;}
.h25 {height: 25px;}
.h30 {height: 30px;}
.h35 {height: 35px;}
.h40 {height: 40px;}
.h45 {height: 45px;}
.h50 {height: 50px;}
.h55 {height: 55px;}
.h60 {height: 60px;}
.h70 {height: 70px;}
.h80 {height: 80px;}
.h90 {height: 90px;}
.h100 {height: 100px;}
.h110 {height: 110px;}
.h120 {height: 120px;}
.h130 {height: 130px;}
.h140 {height: 140px;}
.h150 {height: 150px;}

.h1p {height: 1%;}
.h95p {height: 95%;}
.h99p {height: 99%;}
.h100p {height: 100%;}



.inputLabel {font: 13pt arial; text-align: right;}
.inputText {text-align: left; border:  none}
.inputField {border:  none; background-color:  #222; font: 13pt arial; color:  #fff; border-radius:  4px; padding-left: 5px;}
.inputField:focus {background-color:  #444;}

.inputField2 {border:  none; background-color: #fff; font: 13pt arial; color: #000; border-radius: 4px; padding-left: 5px;}
.inputField2:focus {background-color: #ffff66;}

.invisible {display: none;}
.readonly {background-color: #ccc; color: #777; border: none;}
.readonlyTrans {background-color: transparent; border:  none; color:  #fff; font-weight:  bold;}
.invis { background: none; border: none; }

.rowHover {cursor:  pointer;}
.rowHover:hover {background-color:  rgba(241, 151, 53, 0.5);}



.hoverOrangeText:hover {color: #ff9900;}
.hoverOrange:hover {background-color: #ff9900;}
.hoverBlueText:hover {color: #3366ff;}
.hoverBlue:hover {background-color: rgba(50,100,255,0.4);}
.hoverWhiteText:hover {color:#fff;}
.hoverWhite:hover {background-color: #fff; cursor: pointer}
.hoverYellow:hover {background-color: #ffff00;}
.hoverYellowText:hover {color: #ffff00;}
.hoverGrey:hover {background-color: #e0e0e0;}
.hoverRedText:hover {color: #ff0000;}
.hoverBlackText:hover {color: #000000; }

.hoverYellowGrey {background-color: #e0e0e0;}
.hoverYellowGrey:hover {background-color: #ffff00;}
.hoverBlueGrey {background-color: #efefef;}
.hoverBlueGrey:hover {background-color: rgba(50,100,255,0.4);}
.hoverBlueYellow {background-color: #ffff99;}
.hoverBlueYellow:hover {background-color: rgba(50,100,255,0.4);}
.hoverBlueOrange {background-color: #ffff99;}
.hoverBlueOrange:hover {background-color:  rgba(128,128,128,0.2);}
.hoverBlueRed {background-color: rgba(225,50,75,0.5);}
.hoverBlueRed:hover {background-color:  rgba(128,128,128,0.2);}




.focusBlue{background-color: #fff;}
.focusBlue:focus{background-color: #99ccff;}

.inputFocusBlue:focus{background-color: #99ccff;}

.focusYellow {background-color: #fff; border: none;}
.focusYellow:focus {background-color: #ffffcc; border: none;}

.focusBlueYellow {background-color: #ffff99;}
.focusBlueYellow:focus {background-color: rgba(50,100,255,0.4);}

.focusOrange:focus {background-color: #ff6633;}

.input-trans {background: transparent; border: none; }
.input-trans:focus {background-color: rgba(50,100,255,0.4); border: none; }

.hoverBorderLeftBlue:hover {border-left: 3px solid #3333cc;}

.hoverBorderRed {border: 1px solid #333; font-weight: normal;}
.hoverBorderRed:hover {border: 1px solid red; font-weight: bold;}


.noBorder {border: none;}
.border-none {border: none;}
.border000 {border: 1px solid #000;}
.border888 {border: 1px solid #888;}
.borderBottom888 {border-bottom: 1px solid #888;}
.border-white {border: 1px solid #fff; }
.border-whiteR {border-right: 1px solid #fff; }
.border-bottom-efefef {border-bottom: 1px solid #e0e0e0;}

.blueLeftBorder {border-left: 9px solid #0033cc;}
.greenLeftBorder {border-left: 9px solid #339900;}
.orangeLeftBorder {border-left: 9px solid #ff9900;}

.blueRightBorder {border-right: 9px solid #0033cc;}
.greenRightBorder {border-right: 9px solid #339900;}
.orangeRightBorder {border-right: 9px solid #ff9900;}

.shadow {border: 1px solid #333; box-shadow: 2px 2px 3px #222;}
.shadow4 {box-shadow: 4px 4px 6px #444;}


/* BUTTONS */
.button {
	border-radius:  3px;
	cursor:  pointer;
}
.btn {
	border: none;
	cursor:  pointer;
	color: #000;
	-ms-clear {display: none;}	
}
.btn:hover {color: #fff;}

.btnBlue {
	cursor:  pointer;
	border: 1px solid #000;
	background-color: #fff;
	color: #000;
	font-weight: bold;
}
.btnBlue:hover {
	cursor:  pointer;
	background-color: #003366;
	color: #fff;
}

.btnGrey {
	cursor:  pointer;
	border: 1px solid #333;
	background-color: #e0e0e0;
	color: #000;
	font-weight: bold;
	-ms-clear {display: none;}
}
.btnGrey:hover {
	cursor:  pointer;
	border: 1px solid #333;
	background-color: #777;
	color: #fff;
}

.btnMdGrey {
	cursor:  pointer;
	border: 1px solid #333;
	background-color: #777;
	color: #fff;
	font-weight: bold;
	-ms-clear {display: none;}
}
.btnMdGrey:hover {
	cursor:  pointer;
	border: 1px solid #333;
	background-color: #333;
	color: #fff;
}

.btnDkGrey {
	cursor:  pointer;
	border: 1px solid #333;
	background-color: #444;
	color: #fff;
	font-weight: bold;
}
.btnDkGrey:hover {
	background-color: #000;
	color: #fff;
}

.btnGreen {
	cursor:  pointer;
	border: 1px solid #333;
	background-color: #66ff66;
	color: #000;
	font-weight: bold;
	-ms-clear {display: none;}
}
.btnGreen:hover {
	cursor:  pointer;
	border: 1px solid #333;
	background-color: #336600;
	color: #fff;
}

.btnOrange {
	cursor:  pointer;
	border: 1px solid #333;
	background-color: #ff9933;
	color: #000;
	font-weight: bold;
	-ms-clear {display: none;}
}
.btnOrange:hover {
	cursor:  pointer;
	border: 1px solid #333;
	background-color: #777;
	color: #fff;
}
.btnLtBlue {
	cursor:  pointer;
	border: 1px solid #000;
	background-color: #4d8de3;
	color: #000;
	font-weight: bold;
}
.btnLtBlue:hover {
	cursor:  pointer;
	background-color: #003366;
	color: #fff;
}
.btnDkBlue {
	cursor:  pointer;
	border: 1px solid #000;
	background-color: #003366;
	color: #fff;
	font-weight: bold;
}
.btnDkBlue:hover {
	cursor:  pointer;
	background-color: #4d8de3;
	color: #fff;
}




.btnBase {
	cursor:  pointer;
	border: 1px solid #333;
	color: #000;
	font-weight: bold;
	-ms-clear {display: none;}
}



.collapse-table {border-collapse: collapse; }



input[type=radio].scale15 {
	transform: scale(1.5);
	-webkit-transform: scale(1.5);
}

input[type=checkbox].scale15 {
	transform: scale(1.5);
	-webkit-transform: scale(1.5);
}


input[type=checkbox].scale20 {
	transform: scale(2.0);
	-webkit-transform: scale(2.0);
}



/* ROTATE IMAGES */
.image {
  transform-origin: center;
  /* IE 10+, Firefox, etc. */
  -webkit-transform-origin: center;
  /* Chrome */
  -ms-transform-origin: center;
  /* IE 9 */
}
.rotateImage90 #image {
  transform: rotate(90deg) translateY(-100%);
  -webkit-transform: rotate(90deg) translateY(-100%);
  -ms-transform: rotate(90deg) translateY(-100%);
}
.rotateImage180 #image {
  transform: rotate(180deg) translate(-100%, -100%);
  -webkit-transform: rotate(180deg) translate(-100%, -100%);
  -ms-transform: rotate(180deg) translateX(-100%, -100%);
}
.rotateImage-90 #image {
  transform: rotate(-90deg) translateX(-100%);
  -webkit-transform: rotate(-90deg) translateX(-100%);
  -ms-transform: rotate(-90deg) translateX(-100%);
}




   
/*CSS3 extras*/
a.tooltip span
{
    border-radius:2px;        
    box-shadow: 0px 0px 8px 4px #666;
    /*opacity: 0.8;*/
}

 /* BEGIN TOOTIP STYLING */
.ui-tooltip, .arrow:after {
    background: #000;
    border: 0px solid white;
	max-height: 500px;
	overflow: hidden;
  }
  .ui-tooltip {
    padding: 10px 20px;
    color: white;
    border-radius: 8px;
    font: 10pt "Helvetica Neue", Sans-Serif;
    text-transform: uppercase;
    box-shadow: 0 0 7px black;
  }
  .arrow {
    width: 70px;
    height: 16px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    margin-left: -35px;
    bottom: -16px;
  }
  .arrow.top {
    top: -16px;
    bottom: auto;
  }
  .arrow.left {
    left: 20%;
  }
  .arrow:after {
    content: "";
    position: absolute;
    left: 20px;
    top: -20px;
    width: 25px;
    height: 25px;
    box-shadow: 6px 5px 9px -9px black;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  .arrow.top:after {
    bottom: -20px;
    top: auto;
  }
 /* END TOOTIP STYLING */


 
 

/* Transaction Div */
/*.transWrapper {border: 1px solid #333; border-radius: 4px; margin: 0px;
	position: absolute; left: 210px; top: 75px; background-color: #fff; box-shadow: 2px 2px 3px #777;} */
.transWrapper {position: absolute; top: 10%; left: 11%; width: 900px; bottom: 2px; background-color: #333; border:  1px solid #999;}
.transHeader {width: 100%; height: 30px; border-radius: 4px 4px 0px 0px; font: 13pt arial; font-weight: bold; color: #737373;}
.transIframe {width: 99%; height: 670px; background-color: #fff;}


/* Login styles */
.loginDiv {position: absolute; z-index: 20000; width: 350px; height: 250px; left: 50%; margin-left: -175px; top: -255px;
	border: 1px solid #000; box-shadow: 2px 2px 3px #555; background-color: #e0e0e0; padding: 1px;}
.menuCover {position: absolute; z-index: 19999; width: 100%; top: 0px; left: 0px; height: 100%; border: 1px solid #b3b3b3; background-color: rgba(0,0,0,0.3);}
	


/* Lookup Divs */
.lookupItemDiv {position: absolute; z-index: 5000; top: 95px; right: 21px; display: none; width:400px; height: 373px; 
	border: 1px solid #777; background-color: #fff;}
.lookupItem {position: absolute; z-index: 5000; top: 27px; left:0px; width:100%; height: 347px; 
	background-color: #fff; overflow-y: auto;}
.rowHover {cursor:  pointer;}
.rowHover:hover {background-color:  rgba(241, 151, 53, 0.5);}


./* Transaction details */
.transDetailRow:hover {background-color:  #ff9900; }
.transDetailField {width:  99%; border:  none; background-color:  #222; font: 13pt arial; color:  #fff; border-radius:  4px;}
.transDetailField:focus {background-color:  #444;}

.cell0 {width: 0px;}
.cell1 {color: #efefef;}
.cell2 {width: 0px;}
.cell3 {width: 98%; height: 20px; border: none;}
.cell4 {width: 98%; height: 20px; border: none;}
.cell5 {width: 98%; height: 20px; border: none;}
.cell6 {width: 97%; height: 20px; border: none;}
.cell7 {width: 97%; height: 20px; border: none;}
.cell8 {width:  20px;}
.cell9 {width:  20px;}
.assyCell {width: 18px; height: 18px; border-radius: 3px; border: 1px solid #444; background-color:  rgba(0,100,255,0.7); 
           text-align:  center; color:  #fff; font-weight:  bold; display:  none; cursor:  pointer;}
.saveCell {width: 18px; height: 18px; border-radius: 3px; border: 1px solid #444; background-color:  rgba(0,150,50,0.7); 
           text-align:  center; color:  #fff; font-weight:  bold;}

.transItemDetailTable {width:  100%; text-align:  left;}
.transInput  {background-color:  #222; color:  #fff; font:  14pt arial; border:  none; border-radius:  4px; padding-left:  5px;}
.transInput:focus {background-color:  #444; border:  1px solid #486aa1;}
.transDetailTotals  {width: 100%; height: 120px;  bottom:  105px;}


.defaultBtn {float:left; margin-left:  5px; width: 160px; height:  25px; padding: 5px 0px 0px 0px; border-radius:  3px; 
	font: 11pt arial; color: #fff; cursor:  pointer; font-weight:  bold;}
.defaultBtn:hover {color:  #3333ff}



/* Assembly Items  */
#assemblyTableDiv {left: 0px; top: 0px; width: 99%; height: 350px; border: 1px solid #666; overflow-y:  auto;}
#lookupAssyItemDiv {display: none; position: absolute; z-index: 5000; top: 0px; right: 5px; width:390px; height: 373px; 
	border: 0px solid #777; background-color: #fff;}
#lookupAssyItem {position: absolute; z-index: 5000; top: 0px; left:0px; width:100%; height: 373px; 
	border: 1px solid #777; background-color: #333; color: #fff; overflow-y:   auto;}
             
             
             
.ic {border:0;float:right;background:#fff;color:#f00;width:50%;line-height:10px;font-size:10px;margin:-220% 0 0 0;overflow:hidden;
	padding:0}
.bg-1 {width:100%; background:url(../images/bg-top.jpg) no-repeat center top; min-height:131px}
.bg-2 {width:100%; background:url(../images/bg-2-tail.gif) repeat center top; border-radius:3px}
.main {
	width:960px; 	
	padding:0;
	margin:0 auto;
	font-size:0.8125em;
	line-height:1.5384em;
}
a {color:#93ceee; outline:none}
a:hover {text-decoration:none}
.col-1, .col-2 {float:left}
.wrapper {width:100%; overflow:hidden}
.extra-wrap {overflow:hidden}
p {margin-bottom:18px}
.p1 {margin-bottom:8px}
.p2 {margin-bottom:15px}
.p3 {margin-bottom:30px}
.p4 {margin-bottom:40px}
.p5 {margin-bottom:50px}
.reg {text-transform:uppercase}
.fleft {float:left}
.fright {float:right}
.alignright {text-align:right}
.aligncenter {text-align:center}
.title {margin-bottom:18px}
.it {font-style:italic}
.letter {letter-spacing:-1px}
.color-1 {color:#fff}
.color-2 {color:#000}
.color-3 {color:#666}
.relet {position:relative}

/*********************************boxes**********************************/
.margin-bot {margin-bottom:35px}
.margin-bot1 {margin-bottom:32px}

.spacing {margin-right:35px}

.indent {padding:0 0 0px 30px}
.indent2 {padding-left:50px}
.indent-bot {margin-bottom:20px}
.indent-bot1 {margin-bottom:29px}
.indent-bot3 {margin-bottom:45px}

.indent-top {margin-top:-3px}
.indent-top1 {margin-top:-10px}

.margin-none {margin-bottom:0px}

.img-indent-bot {margin-bottom:25px}
.img-indent-bot1 {margin-bottom:23px}
.img-indent-bot2 {margin-bottom:26px}

.img-indent {float:left; margin:0 20px 0px 0}	
.img-indent2 {float:left; margin:0 13px 0px 0}	
.img-indent-r {float:right; margin:0 0px 0px 40px}	

.prev-indent-bot {margin-bottom:10px}
.prev-indent-bot1 {margin-bottom:6px}
.prev-indent-bot2 {margin-bottom:4px}

.buttons a:hover {cursor:pointer}
.clear {
 clear: both;
 display: block;
 overflow: hidden;
 visibility: hidden;
 width: 0;
 height: 0;
}

.menu li a,
.list-1 li a,
.list-2 li a,
.link,
.button,
.logo {text-decoration:none}	

/*********************************header*************************************/
header {
	min-height:189px; 
	width:100%;
	position:relative; 
	z-index:2;
}

h1 {
	padding:39px 0 0 357px; 
	position:relative;
}
h1 a {
	display:block; 
	width:600px; 
	height:90px; 
	margin-left: -175px;
	text-indent:-5000px; 
	background:url(../images/logo.png) 0 0 no-repeat;
}
.menu-bg-tail {background:url(../images/menu-bg-tail.gif) repeat-x center top; width:100%}
.menu-bg {background:url(../images/menu-bg.jpg) no-repeat center top; width:100%}
.menu {
	padding:10px 0 10px 0; 
	width:100%;
	height:40px;
	overflow:hidden;
}
.menu li {
	float:left; 
	position:relative;
	background:url(../images/menu-li-line.png) no-repeat left top;
	padding:5px 33px 0 34px;
}
.menu li.item {background:none; padding-left:46px}
.menu li.item-1 {padding-right:34px; padding-left:39px}
.menu li.last {padding-left:33px; padding-right:0px}
.menu li a {
	display:inline-block; 
	font-size:23px; 
	line-height:1.391em;
	text-transform:uppercase;
	padding:0; 
	color:#fff;
	letter-spacing:-1px;
}
.menu li a.active,
.menu li a:hover {color:#93ceee}


/********Slider********/
.slider-wrapper {
	width:960px;
	height:368px;
	padding:0;
	background:none;
	position:relative;
	z-index:1;
	padding:0;
}
.slider {
	width:960px;
	height:368px;
}

.items {
	display:none;
}

/*********************************content*************************************/
#content {
	width:100%; 
	padding:0;
	position:relative;
	z-index:1;
}
.content-padding-1 {padding:18px 0 37px 0}
.content-padding-2 {padding:23px 0 57px 0}
.padding-grid-1 {padding: 0 0 0 28px}
.padding-grid-2 {padding: 0 0 0 29px}
.padding-grid-3 {padding: 0 0 0 19px}
.padding-grid-4 {padding:3px 0 0 19px; line-height:24px}
h3 {
	font-size:25px; 
	line-height:2em; 
	margin:0 0 9px 0; 
	color:#93ceee;
}
h3 strong {color:#fff}
h4 {
	font-size:20px;
	line-height:2em;
	color:#ffffff;
	letter-spacing:-1px;
	margin-bottom:-8px;
	}
h4 strong {color:#93ceee}
h4 a {text-decoration:none; display:inline-block; color:#fff}
h4 a:hover {color:#93CEEE}
h6 {
	font-size:13px;
	line-height:20px;
	color:#fff;
	}
.time {
	display:block;
	width:55px;
	height:54px;
	overflow:hidden;
	text-align:center;
	float:left;
	margin-right:16px;
	}
.time-stule-1 {background:url(../images/marker-text-1.png) no-repeat 1px top}
.time-stule-2 {background:url(../images/marker-text-2.png) no-repeat 1px top}
.time-stule-3 {background:url(../images/marker-text-3.png) no-repeat 1px top}
.text-1,
.text-3,
.text-5 {
	font-size:25px;
	line-height:2em;
	display:block;
	color:#fff;
	margin-top:-6px;
	padding-left:2px;
	}
.text-5 {color:#5ca8d2}
.text-2,
.text-4,
.text-6 {
	font-size:20px;
	line-height:2em;
	display:block;
	color:#a1a1a1;
	margin-top:-29px;
	letter-spacing:-1px;
}
.text-4 {color:#fff}
.text-6 {color:#4d4d4d}
.style-img {background:#3b3b3b; padding:1px}
.style-img-2 {border:1px solid #333333; padding:3px}
.list-1 li {
	font-size:13px;
	line-height:20px;
}
	.list-1 li a {
		display:inline-block;
		color:#fff;
	}
		.list-1 li a:hover {color:#93CEEE}
		
.list-2 {padding:5px 21px 0 0}
.list-2 li {
	position:relative;
	overflow:hidden;
	width:41px;
	min-height:20px;
	}
	.list-2 li span {
		display:inline-block;
		width:21px;
		background:url(../images/list-2-line.gif) no-repeat right -1px;
		margin-right:15px;
		float:left;
	}
	.list-2 li a {
		display:block;
		width:5px;
		height:10px;
		background:url(../images/list-2-marker.gif) no-repeat center -50px;
		float:right;
		}
	.list-2 li a.left-list {background-position:left 0; float:left}
	.list-2 li a.right-list {background-position:right 0; float:right}
		.list-2 li a.left-list:hover {background-position:left bottom}
		.list-2 li a.right-list:hover {background-position:right bottom}
.link-2 {
	display:block;
	width:73px;
	height:12px;
	background:url(../images/marker-1.png) left top;
	}
.link-2.link-style1 {background-position:-300px 0}
.link-2.link-style2 {background-position:-620px 0}
.text-width {width:66px; display:inline-block}
.list-3 li {
	font-size:13px;
	line-height:20px;
	background:url(../images/list-3-marker.gif) no-repeat left 12px;
	padding:5px 0 5px 12px;
}
	.list-3 li a {
		display:inline-block;
		color:#fff;
		text-decoration:none;
	}
		.list-3 li a:hover {color:#93CEEE}

.list-4 dt {padding-bottom:10px}
.list-4 dd a {margin-left:20px}

.audioList li {
	font-size:16pt;
	line-height:20px;
	cursor: pointer;
}
	.audioList li a {
		display:inline-block;
		color:#fff;
	}
		.audioList li a:hover {color:#93CEEE}

.link:hover {text-decoration:underline} 

dl span {float:left; width:80px}
.inline {display:inline-block}
/* -- gallery  begin --*/
#js {
	position:relative;
	width:910px;
	padding:0 0 0 1px;
	}
.js-padding {padding:0}
 div.content {
	/* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
	display: none;
	width: 902px;
	height: 360px;
	margin:  0 0 40px 0;
	overflow: hidden;
	border:1px solid #333333;
	padding:3px;
}
 div.content img {
	position: relative;
	z-index: 2;
}
 div.content a, div.navigation a {
	color: #6c6c6c;
}
 div.content a:focus, div.content a:hover, div.content a:active {
	text-decoration: underline;
}
 div.controls {
}
 div.controls a {
	padding: 0px;
}
 div.ss-controls {
	float: left;
	display:none;
}
 div.nav-controls {
	position:absolute;
	left:0px;
	width:100%;
	bottom:0px;
	z-index: 1;
}
#controls {
	width:100%;
	overflow:hidden;
	}
div.nav-controls a {
	font-family: 'Oswald', sans-serif;
	font-size:10px;
	text-transform:uppercase;
	display:block;
	line-height:2em;
	padding:6px 0;
	width:71px;
	height:31px;
	position:absolute;
	text-align:center;
	text-decoration:none;
	bottom:-31px;
	z-index:11;
	color:#f6f7f6;
	background:url(../images/button-bg.png) no-repeat left top;
}
 div.nav-controls a.prev {left:18px;
}
 div.nav-controls a.prev:hover {color:#FB4A16}
 div.nav-controls a.next {right:34px; bottom:-51px; }
 div.nav-controls a.next:hover {color:#FB4A16}
 div.slideshow-container {
	position: relative;
	height: 479px; /* This should be set to be at least the height of the largest image in the slideshow */
	z-index:1;
	
}
 div.loader {
	position: absolute;
	top: 0;
	left: 0;
	background-image:url(images/loader.gif);
	background-repeat: no-repeat;
	background-position: center;
	width: 592px;
	height: 470px; /* This should be set to be at least the height of the largest image in the slideshow */
}

 div.slideshow span.image-wrapper {
	display: block;
	width:910px;
	height:479px;
	position:absolute;
	left:0;
	top:0;
}
 div.slideshow a.advance-link {
	display: block;
	width: 874px;
	height: 660px; /* This should be set to be at least the height of the largest image in the slideshow */
	padding: 0;
	margin: 0;
}
 div.slideshow a.advance-link img {
	padding:0;
	margin:0;
	display:block;
	position:absolute;
	left:0;
	top:0;
}
 div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {
	text-decoration: none;
}
 div.slideshow img {
}
 div.download {
	float: right;
}
 div.caption-container {
	position: absolute;
	top: 680px;
	left: 60px;
	width: 600px;
	height: 100px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:18px;
	color:#000;
}
 span.image-caption {
	display: block;
	position: absolute;
	width: 596px;
	height: 151px;
	top: 0;
	left: 0;
	z-index:10;
}
.text-gallery {
	line-height: 18px;
	font-size: 12px;
	color: #606060;
	padding:28px 0 0 8px;
	}
 div.caption {
	width: 580px;
	height: 128px;
}
 div.caption h5{
	line-height: 18px;
	font-size: 13px;
	color: #fd003f;
	text-transform:uppercase;
	font-weight:bold;
	text-decoration:none;
}
 div.caption h6{
	line-height: 18px;
	font-size: 13px;
	color: #fff;
	font-weight:normal;
	margin: 0 0 18px 0
}
 div.image-title {
}
 div.image-desc {
}
 div.navigation {
/* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */
}
 div#thumbs {
	width: 900px;
	padding: 0 0 4px 0;
	margin:0 auto;
}
 ul.thumbs {
	margin:0 auto;
	padding:0px;
}
 ul.thumbs li {
	float:left;
	margin: 0 50px 40px 0;
	padding:3px;
	vertical-align:top;
	border:1px solid #333333;
}
 ul.thumbs li.last {margin-right:0px}
 ul.thumbs li img {
	border: none;
}
 a.thumb {display:block}
 a.thumb:focus {
	outline: none;
}
 div.pagination {
	clear: both;
	text-align:center;
	position:relative;
	z-index:10;
}
 div.top.pagination {

	display:none;
}
 div.navigation div.bottom {
	 display:none;
}
 div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
	padding:0 4px;
	font-weight:bold;
	color:#fff;
}
 div.pagination a:hover {
	text-decoration: none;
	color:#ffeaa8;
}
 div.pagination span.current {
	color:#ffeaa8;
}
 div.pagination span.ellipsis {
	border: none;
	padding: 5px 0 3px 2px;
}
/* -- gallery end --*/



/***** prettyPhot *****/
.lightbox-image {
	position:relative;
	z-index:1;
	overflow:hidden;
	display:inline-block;
	cursor:pointer;
	}
	.lightbox-image img {
		position:relative;
		z-index:1;
	}
	.lightbox-image span {
		display:inline-block;
		position:absolute;
		left:0px;
		top:0;
		width:100%;
		height:100%;
		background:url(../images/magnify.png) no-repeat 50% 50%;
		z-index:2;
		padding:0;
	}
/***** Contact form *****/
#contact-form {
	position:relative;
	vertical-align:top;
	width:100%;
	z-index:1;
	}
	#contact-form fieldset {
		border:none;
		padding:0;
		width:100%;
		overflow:hidden;
		}			
			#contact-form label {display:block; min-height:40px; overflow:hidden}
			
			#contact-form input {
				width:479px;
				padding:6px 12px;
				margin:0;
				font-family:Arial, Helvetica, sans-serif;
				font-size:13px;
				line-height:1.25em;
				color:#a1a1a1; 
				border:1px solid #333333;
				background:none;
				outline:none;
			}
			#contact-form .area .error { float:none}
			#contact-form textarea {
				height:184px;
				margin:0;
				width:479px;
				padding:6px 12px;
				margin:0;
				font-family:Arial, Helvetica, sans-serif;
				font-size:13px;
				line-height:1.25em;
				color:#a1a1a1; 
				border:1px solid #333333;
				background:none;
				overflow:auto;
				outline:none;
			}
			#contact-form a {cursor:pointer}
			.name-input {
				display:block;
				float:left;
				width:75px;
				padding:5px 0 0 1px;
				}
		.link-form {text-align:right;padding:8px 20px 0 0}
		.link-margin {margin-right:20px}
		
/****************************footer************************/
footer {
	width:100%; 
	padding:0;
	height:104px;
	position:relative;
	z-index:2;
	color:#fff;
	overflow:hidden;
}
.footer-bg {width:100%; background:url(../images/footer-bg.jpg) no-repeat -1px top; min-height:104px}
.footer-padding {padding:28px 80px 0 29px}
.footer-link {
	font-size:14px;
	line-height:24px;
	color:#fff;
	display:block;
	float:left;
	}
.footer-link span {display:block}
#easyTooltip{
	font-family:Arial, Helvetica, sans-serif;
	padding:7px 11px;
	font-weight:bold;
	border:1px solid #fff;
	background:#7fb2cd;
	color:#fff;
	font-size:12px;
	position:relative;
	z-index:3;
}
.list-services {float:right; padding:2px 0 0 0}
.list-services li {
		float:left; 
		padding:0 4px 0 0px;	
	}
		.list-services li a {
			display:inline-block;
			width:51px;
			height:51px;
			background:url(../images/list-services.png) no-repeat left top;
		}
		.list-services li a.n-1 {background-position:0 0px}
		.list-services li a.n-2 {background-position:-55px 0}
		.list-services li a.n-3 {background-position:-110px 0}
		.list-services li.last {padding-right:0px}
.block {height:104px}
.extra {
	min-height:100%; 
	height:auto !important; 
	height:100%; 
	margin: 0 auto -104px; 
	position:relative;
	overflow:hidden;
	z-index:1;
} 
html, body {height:100%}






/*********************
  Media Query Classes
**********************/
@media only screen and (max-width: 800px) {
  .hide-on-small-only, .hide-on-small-and-down {
    display: none !important;
  }
}

@media only screen and (max-width: 992px) {
  .hide-on-med-and-down {
    display: none !important;
  }
}

@media only screen and (min-width: 801px) {
  .hide-on-med-and-up {
    display: none !important;
  }
}

@media only screen and (min-width: 600px) and (max-width: 992px) {
  .hide-on-med-only {
    display: none !important;
  }
}

@media only screen and (min-width: 993px) {
  .hide-on-large-only {
    display: none !important;
  }
}

@media only screen and (min-width: 1201px) {
  .hide-on-extra-large-only {
    display: none !important;
  }
}

@media only screen and (min-width: 1201px) {
  .show-on-extra-large {
    display: block !important;
  }
}

@media only screen and (min-width: 993px) {
  .show-on-large {
    display: block !important;
  }
}

@media only screen and (min-width: 600px) and (max-width: 992px) {
  .show-on-medium {
    display: block !important;
  }
}

@media only screen and (max-width: 600px) {
  .show-on-small {
    display: block !important;
  }
}

@media only screen and (min-width: 601px) {
  .show-on-medium-and-up {
    display: block !important;
  }
}

@media only screen and (max-width: 992px) {
  .show-on-medium-and-down {
    display: block !important;
  }
}

@media only screen and (max-width: 600px) {
  .center-on-small-only {
    text-align: center;
  }
}