@charset "utf-8";
/* CSS Document */
/*Author: Chad Shanehchian, Lopez Negrete Communications, 2013*/

@font-face{
	font-family:'futuraExtraBold';
	src:url(../font/futurastd-extrabold1-webfont.eot);
	src: local("☺"),
	url(../font/futurastd-extrabold1-webfont.ttf),
	url(../font/futurastd-extrabold1-webfont.woff);
}
@font-face{
	font-family:'futuraBold';
	src:url(../font/futurastd-bold1-webfont.eot);
	src: local("☺"),
	url(../font/futurastd-bold1-webfont.ttf),
	url(../font/futurastd-bold1-webfont.woff);
}

body{
	font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight:bold;
	color:#333;
	-webkit-user-select: none;
	-webkit-overflow-scrolling: touch;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}
.inline{
	display:inline-block;
}
.floatLeft {
    float:left;
}
.norepeat{
	background-repeat:no-repeat;
}
.center{
	margin-left:auto;
	margin-right:auto;
}
.textCenter{
	text-align:center;
}
.absolute{
	position:absolute;
}
#stage{
	width:100%;
	height:337px;
	position:relative;
}
#content{
	width:739px;
	height:305px;
	position:absolute;
	top:16px;
	left:15px;
	overflow:hidden;
	background-image:url(../image/background.jpg);
	background-position: 50% 50%;
}
#sysBackground{
	height:310px;
	position:absolute;
	top:-10px;
	left:0px;
}
#contentSlider{
	position:absolute;
	top:0px;
	left:0px;
}
#titleBar{
	width:100%;
	position:absolute;
	top:4px;
	left:10px;
}
#title{
	font-size:16px;
	padding-top:7px;
	font-family:'futuraExtraBold';
}
#sysName{
	font-size:12px;
	font-family:'futuraBold';
}
#titleSeperator1{
	width:1px;
	height:30px;
	background-color:#939393;
	opacity:.3;
	margin-left:10px;
}
#titleSeperator2{
	width:1px;
	height:30px;
	margin-right: 10px;
	background-color:#ffffff;
	opacity:.3;
}
#dropDownSystem{
	width:200px;
	margin-top:5px;
	font-size:10px;
	overflow:hidden;
	border-radius:5px;
	position:relative;
	box-shadow: 2px 2px 4px #666;
}
#dropDownList{
	width:220px;
	height: 20px;
	background-color:#c9c4b2;
	background-image: -ms-linear-gradient(top, #DAD6C4 0%, #B2AC9B 100%);
	background-image: -webkit-linear-gradient(top, #DAD6C4 0%, #B2AC9B 100%);
	background-image: -moz-linear-gradient(top, #DAD6C4 0%, #B2AC9B 100%);
	background-image: -o-linear-gradient(top, #DAD6C4 0%, #B2AC9B 100%);
	border:0px;
	cursor:pointer;
}
#dropDownArrow{
	z-index:101;
	width:17px;
	height:18px;
	position:absolute;
	top:2px;
	right:0px;
	background: url(../image/dropdownArrow.png) no-repeat;
	pointer-events:none;
	cursor:pointer;
}
select option:hover { background-color:#a5a090; }
#tabBtns{
	position:absolute;
	left:0px;
	top:70px;
	z-index:101;
}
#tabBtnLeft{
	width:32px;
	height:190px;
	background-image:url(../image/tabBtnLeft.png);
	position:absolute;
	cursor:pointer;
}
#tabBtnRight{
	width:36px;
	height:190px;
	background-image:url(../image/tabBtnRight.png);
	position:absolute;
	cursor:pointer;
}
#navBar{
	width:70%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 280px;
	position: relative;
}
#navBarBg{
	width:100%;
	height:10px;
	background-color:#999;
	border-radius:5px;
	cursor:pointer;
	position:relative;
	z-index:99;
	box-shadow: 4px 4px 4px rgba(0,0,0,0.5);
}
.infoBtn{
	width:15px;
	height:15px;
	position:absolute;
	/*background-image:url(../image/plusBtn.png);*/
	background-repeat:no-repeat;
	cursor:pointer;
	z-index:97;
	/*pointer-events:none;*/
}
.panel{
	width:168px;
	background-color:#F1EBE4;
	opacity:.8;
	border-radius:5px;
	position:absolute;
	cursor:pointer;
	z-index:96;
	box-shadow: 4px 4px 4px rgba(0,0,0,0.5);
}
.panelTitle{
	font-size:12px;
	text-align:center;
	padding:10px 20px 10px 20px;
}
.panelCopy{
	font-size:10px;
	padding:0px 10px 10px 10px;
	display:none;
}
.panelStep{
	width:230px;
	background-color:#F1EBE4;
	opacity:.8;
	border-radius:5px;
	position:absolute;
	cursor:pointer;
	z-index:96;
	box-shadow: 4px 4px 4px rgba(0,0,0,0.5);
	display:none;
}
.panelSysTitle{
	font-size:14px;
	margin-top:10px;
	margin-left:10px;
	width:205px;
}
.panelStepTitle{
	font-size:14px;
	color:#cb7254;
	margin-top:10px;
	margin-left:10px;
}
.panelStepCloseBtn{
	position:absolute;
	right:5px;
	top:5px;
	font-size:12px;
}
.panelInfoCloseBtn{
	position:absolute;
	left:5px;
	top:5px;
	font-size:12px;
}
.panelStepNavBlock{
	position:absolute;
	right:10px;
	top:30px;
}
.panelStepNav{
	font-size:10px;
}
.panelStepNavMargin{
	margin-right:5px;
}
.panelCopyStep{
	font-size:10px;
	padding:10px 10px 10px 10px;
}
#navBarBtns{
	width:100%;
	position:absolute;
	top:2px;
	left:0px;
}
.navPoint{
	width:6px;
	height:6px;
	position:absolute;
	background-image:url(../image/locationOff.png);
	cursor:pointer;
	z-index:100;
}
#navBarScope{
	height:41px;
	position:absolute;
	left:0px;
	top:-12px;
	z-index:99;
}
#navBarScopeLeft{
	width:22px;
	height:41px;
	background-image:url(../image/bracketLeft.png);
	position:absolute;
	left:-5px;
}
#navBarScopeRight{
	width:22px;
	height:41px;
	background-image:url(../image/bracketRight.png);
	position:absolute;
	/*right:-10px;*/
}



#border{
	width:100%;
	position:absolute;
	top:0px;
	left:0px;
	pointer-events:none;
}
.borderLeft{
	width:22px;
	z-index:102;
	position:relative;
}
.borderCenter{
	width:721px;
	background-size:100% 100%;
	z-index:102;
}
.borderRight{
	width:28px;
	z-index:102;
}
#borderTop{
	height:25px;
}
#borderMiddle{
	height:287px;
}
#borderBottom{
	height:25px;
}
#tl{
	height:inherit;
	background-image:url(../image/border/tl.png);
}
#tc{
	height:inherit;
	background-image:url(../image/border/tc.png);
}
#tr{
	height:inherit;
	background-image:url(../image/border/tr.png);
}
#ml{
	height:inherit;
	background-image:url(../image/border/ml.png);
}
#mc{
	height:inherit;
	visibility:hidden;
}
#mr{
	height:inherit;
	background-image:url(../image/border/mr.png);
	position:absolute;
}
#bl{
	height:inherit;
	background-image:url(../image/border/bl.png);
}
#bc{
	height:inherit;
	background-image:url(../image/border/bc.png);
	position:relative;
	z-index:1001;
}
#br{
	height:inherit;
	background-image:url(../image/border/br.png);
}

@media (max-width:730px) {
.expandInfo{
	height:200px!important;
	top:100px!important;
}
.displayBlock{
	display:block!important;
}

@media (max-width:562px){
/*#dropDownSystem{
	margin-top:0px;
}*/
}

}
@media (max-width:505px){
/*#titleSeperator1{
	display:none;
}
#titleSeperator2{
	display:none;
}
#dropDownSystem{
	display:block;
	position: relative;
	left: -6px;
}*/
}