/* 

Change Log:
	2008-05-26	change by sam floatDiv content style for client_edit_price_plan_in_frame page 
	2008-02-02	change by sam add new style (expiring and expired) in client license page
	2008-02-02	change by sam add new style (calClass) in cost management page
	2008-02-02	change by sam for cost management page top_btn filter style
	2008-01-29	change by sam for add tag style in swap_slots page
	2007-09-10	change pagenavgation in IE7.0 format erro
*/


/* CSS Document */

/* header style */
#header {
	width:100%;
	height:150px;
}
.search {
	font-size:14px;
	font-weight:bold;
	color:#fff;
}

/* end of header style */

/* top menu bar style */
#topMenu {
	margin-left:17px;
	width:935px;
	height:35px;
	font-size:14px;
}
#topMenu .left {
	float:left;
	width:300px;
	padding-top:10px;
	padding-left:10px;
	color:#8f0000;
	font-weight:bold;
}
#topMenu .left a {
	margin-left:10px;
	color:#fff;
	text-decoration:none;
}
#topMenu .right {
	float:right;
	padding-top:10px;
	padding-right:25px;
	color:#000;
}
#topMenu .right a {
	padding:2px 5px;
	margin:0px 5px;
	color:#000;
	font-weight:bold;
	text-decoration:none;
}
#topMenu .right a:hover {
	text-decoration:underline;
}
/* end of top menu bar style */


/* top menu style */
#navgation {
	text-align:left;
	position:absolute;
	z-index:9999;
	margin-top:5px;
	margin-left:17px;
	width:966px;
	height:204px;
	background:url(../images/nav_bg.gif) no-repeat;
	padding-left:11px;
}
#navgation .listOut , #navgation .listOn {
	float:left;
	margin-left:5px;
	width:138.4px;
	height:120px;
	overflow:hidden;
	padding:9px 0 10px 13px;
}
#navgation .listOn {
	z-index:9999;
	height:auto;
	min-height:120px;
	background:url(../images/nav_mask.gif) no-repeat;
	background-position:0px 5px!important;
	background-position:0px 1px;
}
#navgation ul {
	color:#FF0;
	font-weight:bold;
	margin-top:5px;
	font-size:14px;
}
#navgation ul li {
	width:100%;
	list-style:none;
	font-size:12px;
}
#navgation ul li a  {
	padding:0 2px;
	color:#fff;
	text-decoration:none;
}
#navgation ul li a:hover {
	color:#8f0000;
	background:#fff;
}
/* end of top menu style */

#frameContent {
	overflow:hidden;
}

/* top fame tag */
#frameTag {
	width:966px;
	height:35px!important;
	height:37px;
	margin-top:10px;
	margin-left:15px;
	background:url(../images/framebottom.gif) no-repeat;
	background-position:15px 30px!important;
	background-position:15px 32px;
}
#frameTag table {
	margin-left:35px;
}
#frameTag table tr td {
	padding:0px;
}
#frameTag .frameNameLeft {
	width:18px;
	height:30px;
	background:url(../images/frametagleft.gif);
}
#frameTag .frameNameRight {
	width:18px;
	height:30px;
	background:url(../images/frametagright.gif);
}
#frameTag .frameName {
	height:30px;
	padding:5px 5px 0 0px;
	background:url(../images/frametagbg.gif) repeat-x;
	background-position:0px!important;
	background-position:0px 2px;
	font-weight:bold;
	font-size:14px;
	color:#fff;
}
/* end of top fame tag */

/* copyright style */
#copyright {
	background:#ddd;
	margin-left:32px;
	margin-bottom:8px;
	margin-top:10px;
	width:936px;
	height:25px;
	padding-top:8px;
	font-weight:bold;
}
#copyright #menu {
	float:left;
	width:70%;
	margin-left:8px;
}
#copyright #menu a {
	padding:2px 5px;
	margin:0px 5px;
	color:#8F0000;
	text-decoration:none;
}
#copyright #menu a:hover {
	background:#8f0000;
	color:#fff;
}	
#copyright #copyrightInfo {
	float:right;
	width:19.5%;
	padding:0px 5px;
	color:#666;
}

/*  search bar line maybe on top or buttom  */
#filterbar {
	width:100%;
	height:25px;
	padding:5px 0;
	text-align:left;
}
#filterbar .left31 , #filterbar .left32 , #filterbar .left33 ,
#filterbar .left41 , #filterbar .left42 , #filterbar .left43 , #filterbar .left44 , #filterbar .left43 , #filterbar .left45 , 
#filterbar .left51 , #filterbar .left52 , #filterbar .left53 , #filterbar .left54 , #filterbar .left55 {
	float:left;
	height:25px;
	text-align:center;
}
#filterbar .left31 , #filterbar .left41 , #filterbar .left51 {
	width:135px;
	padding-top:2px;
	text-align:center;
	font-size:13px;
	font-weight:bold;
	color:#8f0000;
}
#filterbar .left32 { width:375px;text-align:center;}
#filterbar .left33 { width:110px;}

#filterbar .left41 { width:120px;}
#filterbar .left42 { width:295px;text-align:left;}
#filterbar .left43 { width:110px;text-align:left;}
#filterbar .left44 { width:110px;text-align:right;}
#filterbar .left45 { width:270px;text-align:left; line-height:16px;} /* in cost management page filter bar use */

#filterbar .left51 { width:70px;}
#filterbar .left52 { width:220px;text-align:left;}
#filterbar .left53 { width:130px;text-align:left;}
#filterbar .left54 { width:110px;text-align:right;}
#filterbar .left55 { width:110px;text-align:right;}


/* page navgation style */
#page {
	clear:both;
	width:100%;
	padding:5px 0;
	margin:5px 0;
	word-spacing:1px;
	overflow:hidden;
	color:#666;
	font-family: Arial, Helvetica, sans-serif;
}
#page .top { border-top:0px;}
#page .bottom { border-bottom:0px;}

#page_left {
	float:left;
	word-spacing:1px;
	overflow:hidden;
}
#l1 {
	float:left;
	width:5px;
	height:22px!important;
	height:20px;
	background:#666;
}
#page_total,#page_button,#page_button_disable {
	float:left;
	position:relative;
	padding:2px 4px 0px 4px !important;
	padding:0px 4px 0px 4px;
	border:1px solid #666;
	margin-left:2px;
	overflow:hidden;
}
#page_right {
	float:right;
	text-align:right;
}
#page_index {
	letter-spacing:-1px;
	float:left;
	vertical-align:middle;
	padding:3px 4px 2px 3px !important;
	padding:2px 8px 0px 6px;
}
#page_index .morethan99	{
	padding:2px 2px 0px 1px !important;
	padding:0px 2px 0px 1px;
}
#page_index a {
	margin:1px;
	padding:2px 4px 0px 3px !important;
	padding:0px 4px 0px 3px;
	border:1px solid #666;
	text-decoration:none;
	color:#666;
}
#page_index a:hover {
	text-decoration:underline;
}
#page_index .page_index_pressed {
	margin:1px;
	text-decoration:none;
	color:#fff;
	padding:4px 4px 2px 3px !important;
	padding:3px 4px 3px 3px;
	border:1px solid #666;
	background:#666;
}
#page_index .page_index_disable {
	margin:1px;
	text-decoration:none;
	color:#aaa;
	padding:3px 4px 2px 3px !important;
	padding:1px 4px 2px 3px;
	border:1px solid #bbb;
}
#page_right #page_button {
	float:left;
	position:relative;
	padding:2px 6px 0px 6px !important;
	padding:0px 6px 0px 6px;
	border:1px solid #666;
	text-decoration:none;
	color:#666;
}
#page_right #page_button:hover {
	text-decoration:underline;
}
#page_right #page_button_disable	 {
	float:left;
	position:relative;
	padding:2px 8px 0px 8px !important;
	padding:0px 8px 0px 8px;
	border:1px solid #bbb;
	color:#aaa;
}



/* floatDiv style */
.floatDiv {
	margin:5px;
	width:500px!important;
	width:500px!important;
	*width:490px;
	border:2px solid #666;
	background:#EDEAD7;
	overflow:hidden;
	padding-bottom:7px;
}
.floatDiv .headLine , .floatDiv .summaryLine, .floatDiv .contentBox {
	width:98%;
}
.floatDiv .headLine { 
	width:100%;
	height:24px;
	background:#666;
	color:#fff;
	cursor:move;
}
.floatDiv .summaryLine {
	width:470px!important;
	*width:460px!important;
	*width:460px;
	margin-top:7px;
	margin-left:5px;
	overflow:hidden;
	padding:5px 8px;
	font-weight:bold;
	line-height:20px;
	border:1px solid #999;
}
.floatDiv .summaryLine .content {
	width:100%;
	text-align:left;
}
.floatDiv .headLine .title {
	float:left;
	padding-left:12px;
	width:445px;
	height:23px;
	line-height:24px;
	font-weight:bold;
	text-align:left;
}
.floatDiv .headLine .title .left11 {
	float:left;
	width:400px;
	height:20px;
	overflow:hidden;
}
.floatDiv .headLine .title .left21 {
	float:left;
	width:180px;
	overflow:hidden;
}
.floatDiv .headLine .title .left22 {
	float:right;
	text-align:right;
	width:160px;
}
.floatDiv .headLine .title .left32 {
	float:right;
	text-align:right;
	width:250px;
}
.floatDiv .headLine .closeBox {
	float:right;
	width:24px;
	height:25px;
	cursor:pointer;
}
.floatDiv .headLine .closeBox img {
	width:22px;
	height:22px;
	margin-top:-1px;
}

.floatDiv td , .floatDiv th {
	height:18px;
	padding:1px 3px;
	vertical-align:top;
	text-align:left;
}
.floatDiv .summaryLine .summary .left41 {
	width:120px;
}
.floatDiv .summaryLine .summary .left43 {
	width:150px;
}
.floatDiv .summaryLine .summary .left42 , .floatDiv .summaryLine .summary .left44 {
	width:100px;
}
.floatDiv .summaryLine .title {
	float:left;
	margin-left:3px!important;
	*margin-left:0px!important;
	*margin-left:0px;
	line-height:25px;
	font-weight:bold;
	color:#369;
}
.floatDiv .summaryLine .title .inventory {
	width:444px!important;
	*width:440px!important;
	*width:440px;
}
.floatDiv .summaryLine .innerBox {
	clear:both;
	height:160px;
	overflow-y:scroll;
	overflow-x:hidden;
}
.floatDiv .summaryLine .innerBox .inventory {
	width:447px!important;
	*width:440px!important;
	*width:440px;
}
.floatDiv .summaryLine .inventory td  {
	border-left:1px solid #ccc;
	border-bottom:1px solid #ccc;
}
.floatDiv .summaryLine .inventory th {
	border-left:1px solid #ccc;
	border-bottom:2px solid #369;
}
.contentBox { 
	width:476px!important;
	*width:465px!important;
	*width:465px;
	margin-top:7px!important;
	margin-left:5px;
	overflow:hidden;
	padding:0px 5px 7px 5px;
	background:#fff;
	border:1px solid #999;
}
.contentBox p {
	margin:10px auto;
}
.contentBox .title {
	width:95%;
	height:20px;
	text-align:left;
	line-height:30px;
	padding-left:5px;
	font-weight:bold;
	color:#369;
}
.contentBox .innerBox , .contentBox .restulBox , .contentBox .innerBox2 {
	width:97%!important;
	*width:97%!important;
	*width:97%;
	height:150px;
	min-height:150px;
	max-height:250px;
	margin:5px 0;
	overflow-y:scroll;
	overflow-x:auto;
	padding:5px;
}
 .contentBox .innerBox2 {
	height:70px;
	min-height:70px;
	max-height:70px;
}

#frameStyle03 .floatDiv .contentBox .innerBox table , #frameStyle03 .floatDiv .contentBox .innerBox2 table {
	width:440px!important;
	*width:420px!important;
	*width:420px;
}

.floatDiv .contentBox .innerBox .header {
	font-weight:bold;
}
.floatDiv .contentBox .innerBox .header td {
	border-bottom:1px solid #3178B3;
	color:#000;
}
.floatDiv .contentBox .left31 {
	width:130px;
	border-bottom:1px solid #ccc;
}
.floatDiv .contentBox .left32 {
	width:120px;
	border-left:1px solid #ccc;
	border-bottom:1px solid #ccc;
}
.floatDiv .contentBox .left33 {
	width:200px;
	border-left:1px solid #ccc;
	border-bottom:1px solid #ccc;
}
.floatDiv .contentBox .resultBox {
	width:98%!important;
	*width:99%!important;
	*width:99%;
	margin-left:6px;
	margin-top:10px;
	margin-bottom:10px;
	padding-top:3px;
	border-top:2px solid #aaa;
}
.floatDiv .contentBox .resultBox table {
	width:95%;
}
.floatDiv .contentBox .resultBox .left41  {	width:20%;}
.floatDiv .contentBox .resultBox .left42 {	width:24%;}
.floatDiv .contentBox .resultBox .left43  {	width:25%;}
.floatDiv .contentBox .resultBox .left44 {	width:28%;}



.tagLine {
	float:left;
	width:100%;
	height:24px;
	background:url(images/compart_line.gif) no-repeat;
	background-position:0px 22px;
}
.tagLine .tag {
	margin-left:8px;
	width:72px;
	height:22px;
	background:#fff;
	line-height:22px;
	text-align:center;
}
.tagLine .highlight {
	background:#707070;
	color:#fff;
	font-weight:bold;
}




.calClass {
	width:100px;
	height:70px;
	background:url(images/calbg.gif) no-repeat top left;
}
.calClass span {
	line-height:22px;
	font-weight:bold;
	margin-left:17px;
}
.calClass input {
	*margin-left:17px;
}
.calClass .okbtn {
	margin-left:65px;
	width:25px;
	height:18px;
	background:url(images/okbtn.gif) no-repeat center bottom;
}







/* license page */
.expiring {
	color:#F60;
}
.expired {
	color:red;
}






/* client Machine Terms page */
.termBox {
	margin:5px 0 10px 5px;
	width:75%;
	height:286px;
	background:#444;
	border:2px solid #333;
}
.termTitle  {
	width:100%;
	height:22px;
	color:#fff;
	line-height:20px;
	text-indent:15px;
	font-size:12px;
	font-weight:bold;
	background:#000;
}
.termPrev {
	margin:10px;
	width:70%;
	height:175px;
	float:left;
	border:1px solid #333;
	background:#ddd;
	font-size:14px;
	line-height:20px;
	word-spacing:2px;
	padding:8px;
}
.btn_up , .btn_down {
	float:left;
	width:50px;
	height:50px;
	border:2px solid #000;
	background:#888;
	color:#fff;
	cursor:pointer;
	text-align:center;
	line-height:50px;
	font-weight:bold;
	margin:10px;
}
.btn_up {	background:url(../images/kiosk_up_btn.jpg); margin-top:30px; }
.btn_down {	background:url(../images/kiosk_down_btn.jpg);margin-top:15px; }

.texts {
	display:block;
	height:30px;
	overflow:hidden;
	position:relative;
	top:145px;
	margin-bottom:-30px;
}
.text_back , .text_more { 
	display:inline;
	width:145px;
	height:30px;
	float:left;
	text-align:center;
	font-size:16px;
	background:#666;
	color:#fff;
	line-height:30px;
	font-weight:bold;
	font-family:"Times New Roman","Courier New", Courier, monospace,Arial;
}

.btn_back , .btn_more {
	display:inline;
	float:left;
	width:97px;
	height:40px;
	line-height:30px;
	border:2px solid #000;
	background:#888;
	color:#fff;
	cursor:pointer;
	text-align:center;
	font-weight:bold;
	margin-left:45px!important;
	*margin-left:50px;
	margin-right:00px;
}
.btn_back {	background:url(../images/kiosk_back_btn.jpg); }
.btn_more {	background:url(../images/kiosk_back_btn.jpg); margin-left:45px; }