/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
body {
    /*background-color: #5c87b2;*/
    font-size: 12px;
    font-family: 'Microsoft Sans Serif';
    /*font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;*/
    margin: 0;
    padding: 0;
    color: #000;
}

a:link { text-decoration: none; color:none }
a:hover { text-decoration: none; color:none }
a:visited { text-decoration: none; color:none }
p, ul { margin-bottom: 20px; line-height: 1.6em }

header {display:block;}
footer, nav, section {display: block}
img {border:0px}

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 { font-size: 1.5em; color: #000 }
h1 { font-size: 2em; padding-bottom: 0; margin-bottom: 0 }
h2 { padding: 0 0 10px 0 }
h3 { font-size: 1.2em }
h4 { font-size: 1.1em }
h5, h6 { font-size: 1em }

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
.page {
    width: 1010px;
    margin-left: auto;
    margin-right: auto; 
    /*border:1px solid #ccc*/
}
.popuppage {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    /*border:1px solid #ccc*/
}

#main {
    /*padding: 10px 10px 5px 10px;*/
    /*border: 1px solid #ccc;*/
    margin:5px 0 5px 0;
    padding:3px;
    background-color: #fff;
    min-height:400px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
}

footer, #footer
{
    border-top:solid 2px #ccc;
    background-color: #fff;
    color: #000;
    padding: 10px 0;
    text-align: center;
    line-height: normal;
    margin: 0 0 30px 0;    
    border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
}

/* TOP
----------------------------------------------------------*/
#top {width:1010px; height:46px; margin-top:10px; font-weight:bold; line-height:40px;
      background: url('/Images/top.png') no-repeat center top;
}
#top #topMenu {float:left; height:100%; font-size:14px; color:#fff; margin-left:20px;}
#top #topMenu a {color:#fff;}
#top #topMenu img {display:inline; vertical-align:text-bottom}

#top #topUserInfo {float:left; margin-left:50px; font-size:14px; color:#fff; }
#top #topStaffInfo {float:right; height:100%; margin-right:20px; color:#ffc96a; vertical-align:middle}

#top #topStaffName {color:#000}
#top #topStaffInfo img {display:inline; vertical-align:middle; margin:0 5px}
#top #topStaffInfo a {vertical-align:middle}
#top #topStaffInfo a:link, #top #topStaffInfo a:visited { text-decoration: none; color:#ffc96a }
#top #topStaffInfo a:hover { text-decoration: none; color:#ffc96a }

/* MENU  
----------------------------------------------------------*/
#mainMenu {   }
#mainMenu ul { margin:3px auto; padding:0; list-style:none; display:inline-block;}
#mainMenu li { display:inline-block; margin:0px 20px; vertical-align:top; }
#mainMenu li h3 { margin:0; margin-bottom:3px; padding:0; font-size:12px; line-height:1em; cursor:pointer }
#mainMenu li h3 img { margin-bottom:-4px; }
#mainMenu .subMenu { display:none; position:absolute; background-color:#fff; z-index:1100; color:#000; font-size:16px; padding:10px; border:1px solid #4C75C7; border-radius:3px;}
#mainMenu .subMenu ul { margin:0; padding:0; list-style:none;}
#mainMenu .subMenu ul li { display:block; margin:5px; font-size:12px; }
#mainMenu .subMenu img { margin-bottom:-2px; }
#mainMenu .subMenu ul li a:link, #mainMenu .subMenu ul li a:visited { color:#000!important }
#mainMenu .subMenu ul li a:hover { color:#4d75c7!important }


/* FORM LAYOUT ELEMENTS   
----------------------------------------------------------*/
fieldset { border: 0; padding: 0; margin: 0}
legend { font-weight: bold}
textarea { border: 1px solid #ccc; padding: 1px; color: #000; min-height: 75px }
input[type="text"], input[type="password"] { border: 1px solid #ccc; padding: 1px; color: #000 }
select { border: 1px solid #ccc; padding: 2px; color: #000}


/* TABLE
----------------------------------------------------------*/
table {border-collapse: collapse; color:#000; border-spacing:0;}
table th {background-color: #ecf4ff; border:1px solid #d7d7d7;}
table .tr-alter {background-color:#fffceb!important}
table .tr-select {background-color:#add8e6!important}
table .tr-total {font-weight:bold;}

table.trhover tbody tr:hover { background-color:#f8f8f7!important; }

table.check-hotel{
    width:100%;
    border-collapse : collapse; 
    border-left: 1px solid #c6c6c6;
	border-top: 1px solid #c6c6c6;
}

table.check-hotel th {
	background-color: #f9f9f9;
    border-right: 1px solid #c6c6c6;
	border-bottom: 1px solid #c6c6c6;
    font-weight: bold;		
	text-align: center;
	padding: 5px 5px;
	vertical-align: middle
}

table.check-hotel th strong {
	font-weight: bold;
	background-color: #f9f9f9;
	overflow: hidden;
	color: #333
}

table.check-hotel tr.click
{
    width:auto;
    color:#000000;
    height:20px;      
    font-size:12px;        
    background-color:#ADD8E6;    
}

table.check-hotel td {
	border-right: 1px solid #c6c6c6;
	border-bottom: 1px solid #c6c6c6;	
	padding: 5px;
	vertical-align: middle
}

table.check-hotel .total
{
    background-color: #f9f9f9;
    border-right: 1px solid #c6c6c6;
	border-bottom: 1px solid #c6c6c6;
    font-weight: bold;		
	text-align: center;
	/*padding: 10px 5px;*/
	vertical-align: middle
}

/* List
----------------------------------------------------------*/
ul .li-hover {background-color:#f8f8f7!important}

/* MISC  
----------------------------------------------------------*/
.clear { clear: both; }
.error { color: Red; }
.overflow-wrap {overflow:hidden; text-overflow: ellipsis;white-space: nowrap;}

/* */
.center_layer { margin-left:auto; margin-right:auto }
/* */
.red { color: #f00!important }
.blue { color: #00f!important }
.green { color:#088A08!important }
.black { color:#000!important }
.orange {color:#ff7900!important}
.white {color:#fff!important}

.highlight { background-color: #ff0 }

.weight-bold { font-weight:bold }
.weight-normal { font-weight:normal }

.right { text-align:right!important }
.center { text-align:center!important }
.left { text-align:left!important }

.cursor-help { cursor:help }
.cursor-hand { cursor:pointer }
.cursor-default { cursor:default }

.title {padding: 5px; text-align: left; font-weight: bold }
.title-back-yellow { background-color: #fffceb; }
.title-back-blue { background-color: #ecf4ff; }

.underline-dash {border-bottom:1px dashed #ccc; }
.underline-solid {border-bottom:1px solid #ccc; }
.throughline {text-decoration:line-through; text-decoration-color:#f00;}

.pay-1 { color: #088A08 }
.pay-2 { color: #2424c4 }

.meal-1 { color:#00f }
.meal-2 { color:#00f }
.meal-3 { color:#00f }

.salefeetype {color:#00f }
.salefeetype-n {color:#00f }
.salefeetype-d {color:#088A08 }
.salefeetype-p {color:#9400D3 }

.revenue { background-color: #d8bfd8 }
.nonrefundable { color: #f00!important }

.cal-back-hol { background-color:#f9ded7!important }
.cal-back-sat { background-color:#cdebf6!important }
.cal-back-today { background-color:#f7f4ed!important }

.left-box { border: 1px solid #d8d6ce; overflow: hidden; clear: both; padding: 3px; border-radius:2px; margin-bottom:5px }
.left-box label { color:#808080; font-weight:bold }
.left-box p { margin:10px 0}
.left-box-header { display:block; font-weight: bold; color: #915100; font-size: 12px; padding: 0 10px; margin:0; background-color: #f7e6cf; line-height: 30px }
.left-box-header img { display:inline; vertical-align:text-bottom }

.title-gray { background: #f9f9f9; text-align:right; padding-right:10px }

.float-right { float:right }
.float-left { float:left }
/* Hotel Simple Information(Left Side)
----------------------------------------------------------*/
#hotelinfo-simple-hotellogo { margin:3px; text-align:center; vertical-align:middle; border:1px solid #ccc }
#hotelinfo-simple-hotellogo img { width:100%; height:100% }
#hotelinfo-simple-hoteltext { margin-top:3px; }
#hotelinfo-simple-hoteltext span {display:block; width:100%; line-height:20px }

/* Room Search Condition
----------------------------------------------------------*/
.hotel-search-condition input[type='button'] { width:240px; height:28px; border:0; color:#fff; font-weight:bold; cursor:pointer; background:url('/Images/btn_search.png') center bottom no-repeat; }

/* Form Header
----------------------------------------------------------*/
.form-header { width:100%; height:26px; line-height:26px; color:#626365; font-weight:bold; font-size:14px; margin-bottom:5px; text-indent:10px }
.form-header img { margin-bottom:-3px; }
.form-header-bottom { width: 100%; border-bottom: 3px solid #eeeef0; background-color: #c4c4c4; height: 1px; margin-bottom:10px; }

.hotel-search-legend { width:100%; background-color:#f3f3f3; margin:5px 0; padding:1px; }
.hotel-search-legend div { margin:3px; background-color:#fff; font-size:1.1em; border:1px solid #c6c6c6; padding:10px }


/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {color: #f00}
.field-validation-valid {display: none}
.input-validation-error {border: 1px solid #f00;background-color: #fee}
.validation-summary-errors {font-weight: bold;color: #f00}
.validation-summary-valid {display: none}


/* Styles for editor and display helpers
----------------------------------------------------------*/
.display-label, 
.editor-label {margin: 1em 0 0 0}

.display-field, 
.editor-field {margin: 0.5em 0 0 0}

.text-box {width: 30em;}
.text-box.multi-line {height: 6.5em;}
.tri-state {width: 6em;}



/* Jquery ui extend
----------------------------------------------------------*/
/* Datepicker Style */
.ui-datepicker {z-index:1200;}
.ui-datepicker table td {background-color:transparent }
.ui-datepicker-trigger {margin:0 0 -4px 3px; cursor:pointer}
.datepickerbox {width:90px!important; text-align:center}
        
/* Progress Style */
.ui-progressbar .ui-progressbar-value { background-image: url('/Images/pbar-ani.gif'); }

/* dailog Style */
.ui-dialog {
    border:1px solid #fff;
    background-color:#fff;
    border-radius:0;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    box-shadow: 1px 1px 5px rgba(0,0,0,0.2);
    padding:0
}
.ui-dialog .ui-dialog-titlebar{position:relative; background:none; background-color:#474747; height:30px; border:0;border-radius:0;
    -webkit-border-radius:0;
    -moz-border-radius:0;
}
.ui-dialog .ui-dialog-title{line-height:30px; font-size:16px;}
.ui-dialog .ui-dialog-titlebar-close{position:absolute; background:url('/Images/close-popup.jpg') no-repeat center; border-radius:0; border:0;}
.ui-dialog .ui-dialog-titlebar-close span {background:none; }
/*
.ui-dialog .ui-dialog-titlebar{padding:.4em 1em;position:relative}
.ui-dialog .ui-dialog-title{float:left;margin:.1em 0;white-space:nowrap;width:90%;overflow:hidden;text-overflow:ellipsis}
.ui-dialog .ui-dialog-titlebar-close{position:absolute;right:.3em;top:50%;width:21px;margin:-10px 0 0 0;padding:1px;height:20px}
.ui-icon-closethick{background-position:-96px -128px}
*/

/* Tooltip Style */
.ui-tooltip {max-width:650px;}

.event-icon-l {display: inline-block; padding: .3em .6em .2em; font-size: 1em; font-weight:700; line-height: 1; color: #00f; text-align: center; white-space: nowrap; vertical-align:top; border-radius: .25em; background-color: #ffb82e;}
.promotion-icon-l {display: inline-block; padding: .3em .6em .2em; font-size: 1em; font-weight:700; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align:top; border-radius: .25em; background-color: #a22ad8;}
.promotion-icon-s {display: inline; padding: .3em .6em .2em; font-size: 0.95em; font-weight:700; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: .25em; background-color: #a22ad8;}



/* Buttons
----------------------------------------------------------*/
.button {display:inline-block; height:22px; padding:0 20px; margin:1px 2px; line-height:22px; border-width:0; color:#fff!important; text-align:center; cursor:pointer }
.button-blue
{
    background-color:#00f;
    background-image:url('/Images/btn/btn_blue_left.jpg'),url('/Images/btn/btn_blue_right.jpg'),url('/Images/btn/btn_blue.jpg');
    background-position:left, right, center;
    background-repeat:no-repeat, no-repeat, repeat-x;
}
.button-red
{
    background-color:#f00;
    background-image:url('/Images/btn/btn_red_left.jpg'),url('/Images/btn/btn_red_right.jpg'),url('/Images/btn/btn_red.jpg');
    background-position:left, right, center;
    background-repeat:no-repeat, no-repeat, repeat-x;
}
.button-gray
{
    background-color:#ccc;
    background-image:url('/Images/btn/btn_gray_left.jpg'),url('/Images/btn/btn_gray_right.jpg'),url('/Images/btn/btn_gray.jpg');
    background-position:left, right, center;
    background-repeat:no-repeat, no-repeat, repeat-x;
}
.button-black
{
    background-color:#000;
    background-image:url('/Images/btn/btn_black_left.jpg'),url('/Images/btn/btn_black_right.jpg'),url('/Images/btn/btn_black.jpg');
    background-position:left, right, center;
    background-repeat:no-repeat, no-repeat, repeat-x;
}
.button-green
{
    background-color:#3D979D;
    background-image:url('/Images/btn/btn_green_left.jpg'),url('/Images/btn/btn_green_right.jpg'),url('/Images/btn/btn_green.jpg');
    background-position:left, right, center;
    background-repeat:no-repeat, no-repeat, repeat-x;
}
.button-orange
{
    background-color:#ccc;
    background-image:url('/Images/btn/btn_gray27_left.jpg'),url('/Images/btn/btn_gray27_right.jpg'),url('/Images/btn/btn_gray27.jpg');
    background-position:left, right, center;
    background-repeat:no-repeat, no-repeat, repeat-x;
}

.button27 {display:inline-block; height:27px; min-width:90px; padding:0 10px; margin:1px 2px; line-height:27px; border-width:0; color:#fff; text-align:center; cursor:pointer }
.button27-blue
{
    background-color:#00f;
    background-image:url('/Images/btn/btn_blue27_left.jpg'),url('/Images/btn/btn_blue27_right.jpg'),url('/Images/btn/btn_blue27.jpg');
    background-position:left, right, center;
    background-repeat:no-repeat, no-repeat, repeat-x;
}
.button27-gray
{
    background-color:#ccc;
    background-image:url('/Images/btn/btn_gray27_left.jpg'),url('/Images/btn/btn_gray27_right.jpg'),url('/Images/btn/btn_gray27.jpg');
    background-position:left, right, center;
    background-repeat:no-repeat, no-repeat, repeat-x;
}


.button-st { display:inline-block; font-size:0.9em; width:70px; height:20px; text-align:center; color:#fff; font-weight:bold; padding:2px; border-radius:2px; margin:1px; cursor:pointer}
.button-st-git { display:inline-block; width:85px; height:24px; text-align:center; color:#fff; font-weight:bold; padding:2px 10px; border-radius:2px; margin:1px; cursor:pointer}
.button-st-rentcar { display:inline-block; font-size:0.9em; width:70px; height:20px; text-align:center; color:#fff; font-weight:bold; padding:2px; border-radius:2px; margin:1px; cursor:pointer}

/*.button-st-ok { background-color:#7083e2; border:1px solid #7d87cc }
.button-st-rq { background-color:#76c2e9; border:1px solid #86a6b9 }
.button-st-full { background-color:#bcbcbc; border:1px solid #b1b1b1 }
.button-st-gt { background-color:#e7737d; border:1px solid #cc7d82 }
*/
.button-st-full { background-color:#bcbcbc; border:1px solid #b1b1b1 }
.button-st-rq { background-color:#7083e2; border:1px solid #7d87cc }
.button-st-ok { background-color:#e7737d; border:1px solid #cc7d82 }

.button-st-pl { background-color:#909090; border:1px solid #959595 }

.button-pack {height:21px; width:90px; margin:3px 2px; line-height:21px; border-width:0; color:#fff!important; text-align:center; cursor:pointer;
              background-color:#F99C00;
                background-image:url('/Images/btn/btn_orange_90.png');
}