@media (max-width: 410px) {
  .col-xxs-1, .col-xxs-2, .col-xxs-3, .col-xxs-4, .col-xxs-5, .col-xxs-6, .col-xxs-7, .col-xxs-8, .col-xxs-9, .col-xxs-10, .col-xxs-11, .col-xxs-12 {
    position: relative;
    float: left;

  }
  .col-xxs-12 {
    width: 100%;
  }
  .col-xxs-11 {
    width: 91.66666667%;
  }
  .col-xxs-10 {
    width: 83.33333333%;
  }
  .col-xxs-9 {
    width: 75%;
  }
  .col-xxs-8 {
    width: 66.66666667%;
  }
  .col-xxs-7 {
    width: 58.33333333%;
  }
  .col-xxs-6 {
    width: 50%;
  }
  .col-xxs-5 {
    width: 41.66666667%;
  }
  .col-xxs-4 {
    width: 33.33333333%;
  }
  .col-xxs-3 {
    width: 25%;
  }
  .col-xxs-2 {
    width: 16.66666667%;
  }
  .col-xxs-1 {
    width: 8.33333333%;
  }
  .col-xxs-pull-12 {
    right: 100%;
  }
  .col-xxs-pull-11 {
    right: 91.66666667%;
  }
  .col-xxs-pull-10 {
    right: 83.33333333%;
  }
  .col-xxs-pull-9 {
    right: 75%;
  }
  .col-xxs-pull-8 {
    right: 66.66666667%;
  }
  .col-xxs-pull-7 {
    right: 58.33333333%;
  }
  .col-xxs-pull-6 {
    right: 50%;
  }
  .col-xxs-pull-5 {
    right: 41.66666667%;
  }
  .col-xxs-pull-4 {
    right: 33.33333333%;
  }
  .col-xxs-pull-3 {
    right: 25%;
  }
  .col-xxs-pull-2 {
    right: 16.66666667%;
  }
  .col-xxs-pull-1 {
    right: 8.33333333%;
  }
  .col-xxs-pull-0 {
    right: auto;
  }
  .col-xxs-push-12 {
    left: 100%;
  }
  .col-xxs-push-11 {
    left: 91.66666667%;
  }
  .col-xxs-push-10 {
    left: 83.33333333%;
  }
  .col-xxs-push-9 {
    left: 75%;
  }
  .col-xxs-push-8 {
    left: 66.66666667%;
  }
  .col-xxs-push-7 {
    left: 58.33333333%;
  }
  .col-xxs-push-6 {
    left: 50%;
  }
  .col-xxs-push-5 {
    left: 41.66666667%;
  }
  .col-xxs-push-4 {
    left: 33.33333333%;
  }
  .col-xxs-push-3 {
    left: 25%;
  }
  .col-xxs-push-2 {
    left: 16.66666667%;
  }
  .col-xxs-push-1 {
    left: 8.33333333%;
  }
  .col-xxs-push-0 {
    left: auto;
  }
  .col-xxs-offset-12 {
    margin-left: 100%;
  }
  .col-xxs-offset-11 {
    margin-left: 91.66666667%;
  }
  .col-xxs-offset-10 {
    margin-left: 83.33333333%;
  }
  .col-xxs-offset-9 {
    margin-left: 75%;
  }
  .col-xxs-offset-8 {
    margin-left: 66.66666667%;
  }
  .col-xxs-offset-7 {
    margin-left: 58.33333333%;
  }
  .col-xxs-offset-6 {
    margin-left: 50%;
  }
  .col-xxs-offset-5 {
    margin-left: 41.66666667%;
  }
  .col-xxs-offset-4 {
    margin-left: 33.33333333%;
  }
  .col-xxs-offset-3 {
    margin-left: 25%;
  }
  .col-xxs-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-xxs-offset-1 {
    margin-left: 8.33333333%;
  }
  .col-xxs-offset-0 {
    margin-left: 0;
  }
}


.fullpercentage{
	width:100%;
}
.headerContainer{
	background:#003887;
}
#pageHeader{
	margin-top:0px;
}
@media (min-width: 1200px) {
  .container {
    width: 1000px;
  }
  .container2 {
    width: 1000px;
	margin:0 auto;
	padding:0 15px;
  }
}
.topic{
	font-size: 1.5em;
	margin: 3% 0 3% 5%;
}

.btntotal a{
	padding: 2% 10%;
}

.topicconfirm {
	padding: 1% 0;
	margin-top: 1%;
}

.topicconfirm2 {
	padding: 1% 2%;
}

.detailconfirm {
	padding: 1% 4%;
	margin-top: 1%;
}

.spaceprice {
	padding-top: 1.5%;
}

.lineprice {
	padding-top: 1.5%;
}

.formguest {
	/* font-size: 1.4em; */
	margin: 1% 1% 0% 1%;
	padding: 1% 2% 0% 2%;
}
.boxconfirm {
	padding: 1% 2%;
}

.footer{
	font-size:12px;
}

.detailroomprice {
	font-size: 1em;
	font-weight: bold;
}


}
.additBtn {
	background-color:#FF6100;
}
.btn-primary, .btn-primary:hover{
	background: #BD0040;
	border-color: #BD0040;
}
.btn-info, .btn-info:hover{
	background: #002861;
	border-color: #e6e6e6;
	color:#fff;
	border-radius: 5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
}
.bookingBtn{
	/* padding: 2% 3%; */
	color: #fff;
	background: #BD0040;
	border: 1px solid #b90041;
	margin: 1%;
	border-radius: 5px;
	-khtml-border-radius: 5px;
	-moz-border-radius: 5px;
	text-decoration: none;
}
.bookingBtn:hover{
	color: #fff;
}
.btnRoom a{
	padding:20px;	
	color:#fff;
	background:#BD0040;
	border:1px solid #b90041;
	font-size:1.2em;
	border-radius:5px;
	-khtml-border-radius:5px;
	-moz-border-radius:5px;
	text-decoration:none;
	text-align:center;
	width:100%;
	clear:both;
	display:block;
}

.footer{
	width:100%;
	padding:1% 0 ;
	clear:both;
	text-align:center;
	font-size:12px;
	color:#222;
	background:#F3F3F3;
}

.totalprice{
	font-size: 2em;
	font-weight: bold;
	color: #D81D30;
	text-align:center;
}

.totaladdit, .totaladdit2{
	font-size:1.5em;
	text-align:center;
	font-weight:bold;
	padding:2% 0;
	background:#e6e6e6;
	display:none;
	border-bottom:1px solid #ccc;
	margin-bottom:5%;
	
}


.btncopystaying {
    font-size: 1em;
    margin-top: 12%;
}

.btncopystaying a{
	font-size:0.6em;
	color:#fff;
	font-weight:bold;
	padding:2% 5%;
	background:#8A6D3B;
	clear:both;
	text-align:center;
	cursor:pointer;
	border-radius:5px;
	-khtml-border-radius:5px;
	-moz-border-radius:5px;
} 

.btncopystaying a:hover{
	text-decoration:none;
}

.topicstaying{
	/* font-size:1.5em; */
	color: #FFF !important;
	background-color: #BD0040 !important;
	border-color: #BD0040 !important;
	
}
.boxroomprice{
	padding:2%;
	background:#FCFCFC;
	margin:2% 0;
    line-height: 2em;
}
.boxroomprice input{
   border:0;
   width:70%;
   text-align: right;
   background-color: #f6f6f6;
}
.txttopicconfirm{
	font-size:1.2em;
	font-weight:bold;
}

.txtconfirm{
	font-size:1em;
	margin-top:1%;
	font-weight:normal;
}

.boxconfirm{
	padding:2%;
	background:#f6f6f6;
	margin:2% 2%;
	font-weight:bold;
	font-size:1.3em;
	width:96%;
}

.boxconfirm2{
	/* padding:2%;
	margin:2% 2%; */
	font-weight:bold;
	font-size:1.2em;
	width:96%;
}

.boxconfirm3{
	padding:2%;
	background:#f6f6f6;
	font-weight:bold;
	width:100%;
}

.boxconfirm4{
	padding:2%;
	width:100%;
}

.txtcen{
	text-align:center;
}

.txtconbold{
	font-weight:bold;
	margin-bottom:3%;
	text-transform:uppercase;
	height:50px;
}


.boxpriceconfirm{
	padding:2%;
	background:#f9f9f9;
	margin:4% 0;
	border:2px dashed #626262;
	font-weight:bold;
	font-size:1em;
	width:100%;
}

.topicconfirm{
	padding:2% 0;
	margin-top:1%;
	clear:both;
}


.topicconfirm2{
	padding:1% 4%;
	margin-top:1%;
	clear:both;
}

.list-group-item{
	padding-top:0;
	padding-bottom: 0;
	margin-bottom: -2px;
}
.detailconfirm{
  background:#EAEAEA;
  border-radius:5px;
  -khtml-border-radius:5px;
  -moz-border-radius:5px;
  margin-top:1%;
}
/* 
.show-grid{
	margin-bottom:15px
} */


/* vertical alignment styles */

.col-top {
  vertical-align: top;
}
.col-middle {
  vertical-align: middle;
}
.col-bottom {
  vertical-align: bottom;
}

/* columns of same height styles */
.show-grid [class^=col-]{
	padding:5px !important;
}
.list-group-item, .show-grid [class^=col-]{
  	border-color: #C2C2C2 !important;
}
.mobileper{
	display:none;
}

.linehi{
	line-height: 1.8em;
}
.txtdetailthank{
	font-size: 1.1em;
}

.txtdetailthankblod{
	font-size: 1.4em;
	font-weight: bold;
}

.submitbtn{
	width: 30%;
    margin-top: 2%;
}
.bottom-line-without-last:not(:last-child){
	border-bottom: 1px solid;
  	border-color: #C2C2C2 !important;
}
@media (min-width: 768px) {
	.show-grid [class^=col-]:not(:last-child){
		padding-top:10px;
		padding-bottom:10px;
		border-right-style: solid;
		border-right-width: thin;

	}
  	.col-sm-height {
    	display: table-cell;
    	float: none !important;
  	}
	.row-full-height {
	  height: 100%;
	}
	.col-full-height {
	  height: 100%;
	  vertical-align: middle;
	}
	.row-same-height {
	  display: table;
	  width: 100%;
	  /* fix overflow */
	  table-layout: fixed;
	}
	.col-xs-height {
	  display: table-cell;
	  float: none !important;
	}
	.typeprice{
		/*font-size:0.5em !important;*/
	}
}
@media (min-width: 992px) {
	.show-grid [class^=col-]:not(:last-child){
		padding-top:10px;
		padding-bottom:10px;
		border-right-style: solid;
		border-right-width: thin;
	}

	.col-md-height {
	    display: table-cell;
	    float: none !important;
	}
	.row-full-height {
	  height: 100%;
	}
	.col-full-height {
	  height: 100%;
	  vertical-align: middle;
	}
	.row-same-height {
	  display: table;
	  width: 100%;
	  /* fix overflow */
	  table-layout: fixed;
	}
	.col-xs-height {
	  display: table-cell;
	  float: none !important;
	}

}
@media (min-width: 1200px) {
  .col-lg-height {
    display: table-cell;
    float: none !important;
  }
}

/* visual styles */

.show-grid[class*="col-"] {
  padding-top: 10px;
  padding-bottom: 15px;
  border: 1px solid #80aa00;
  background: #d6ec94;
}
.show-grid[class*="col-"]:before {
  display: block;
  position: relative;
  content: "COL";
  margin-bottom: 8px;
  font-family: sans-serif;
  font-size: 10px;
  letter-spacing: 1px;
  color: #658600;
  text-align: left;
}
.col-full-height:before {
  content:"";
}
.item {
  width: 100%;
  height: 100%;
  border: 1px solid #cecece;
  padding: 12px 6px;
  background: #ededed;
  background: -webkit-gradient(linear, left top, left bottom,color-stop(0%, #f4f4f4), color-stop(100%, #ededed));
  background: -moz-linear-gradient(top, #f4f4f4 0%, #ededed 100%);
  background: -ms-linear-gradient(top, #f4f4f4 0%, #ededed 100%);
}

/* content styles */

.item {
  display: table;
}
.content {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

/* centering styles for jsbin */

html,
body {

  width: 100%;
  font-family: CenturyGothic,AppleGothic,sans-serif;
  height: 100%;
}
#full-screen-background-image {
  z-index: -999999;
  min-height: 100%;
  min-width: 1024px;
  width: 100%;
  height: auto;
  position: fixed;
  top: 0;
  left: 0;
  background: url(http://www.centrumfo.com/fo/h2/booking/images/main2.jpg) top center;
}
.btn-header{
	color: #000 !important;
}
.container{
	background-color:#fff;
}
.container2 {
    background-color:none;
  }
html {
  display: table;
}
body {
  display: table-cell;
  /* vertical-align: middle; */
}
.dateheader{
	background: #EDEDED;
	  color: #222;
	  padding:1% 0;
}
.roomtypeheader{
	background-color: #FFFFEC;
	font-weight: bold;
}
.discountroom{
	text-align: center;
	text-decoration:line-through;
	color:#000000;
}
.realprice{
	font-size:1.3em;
	color:red;
	font-weight: bold;
}
.priceroom{
	text-align: center;
	font-weight:normal;
	color:#000;
	line-height:1em;
}
 .btn-number{
 	padding-left: 6px;
 	padding-right: 6px;
 }
 .num_room{
 	padding:0;
 }
 @media (max-width:767px){
	.gray-xs {
		background: #e0e0e0;
	}

}
@media (min-width: 770px) and (max-width: 997px){
	.show-grid [class^=col-]:nth-last-child(2)){
		border-right:0;
	}
	.no-border-right{
	  /* height: 54px; */
	  border-right:0 !important;
	}
}
@media (min-width: 500px) and (max-width: 900px){
	.priceroom{
		text-align: center;
	}
	.submitbar{
	  /* height: 54px; */
	  vertical-align: middle;
	}
	.slimside {
		padding-left: 1px !important;
  		padding-right: 1px !important;
	}
	#pageHeader{
		text-align: left;
	}
	.txtconbold{
	height:60px;
}

}
.typeprice{
	text-align: center;
	font-size:1em;
	font-weight:normal;
	color:#000000;
}
.roomtypename {
  width: 100%;
  padding: 0;
  text-align: center;
  font-weight: bold;
}
.nosidepadding{
	padding-left: 0 !important;
	padding-right: 0 !important;
}
.tabprohotdeal {
  background: #FF0000;
  color: #FFFFFF;
  text-align: center;
  font-size: 0.9em;
  padding: 1.5%;
  font-weight: bold;
  border-radius: 5px 5px 0 0;
}
.dd_locked {
	cursor: text !important;
}
label.error {
    color: red;
    font-size: 16px;
    font-weight: normal;
    line-height: 1.4;
    width: 100%;
    float: none;
}
 
@media screen and (orientation: portrait){
    label.error { margin-left: 0; display: block; }
}
 
@media screen and (orientation: landscape){
    label.error { display: inline-block; margin-left: 22%; }
}
#field{margin-left:.5em;float:left;}
#field,label{float:left;font-family:Arial,Helvetica,sans-serif;font-size:small;}
br{clear:both;}
input{border:1px solid black;/*margin-bottom:.5em;*/}
input.error{border:1px solid red;}
textarea.error{border:1px solid red;}
label.error{background:url('../images/unchecked.gif') no-repeat;padding-left:16px;margin-left:.3em;}
label.valid{background:url('../images/checked.gif') no-repeat;display:block;width:16px;height:16px;}

.fontwhite{
	color:#fff;
}
.inputcheckdate{
	cursor:pointer !important;
}
.list-group-item{
	border-radius: 0 !important;
}
.form-control[readonly]{
	background-color: #fff !important;
}
.photoIco{
	width:100%;
	cursor:pointer;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
}
.Fixedfooter {
  position: fixed;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 20px;
}
#priceBox{
	background-color: rgba(232, 194, 194, 0.8);
	height:100%; 
	max-width:350px; 
	border-top-left-radius: 11px;
	padding:5px;
	float: right;
}
@media (min-width: 310px) and (max-width: 400px){
	#priceBox{
		border-radius: 0;
	}
	.mobileper{
	display:block;
}	
.btncopystaying {
    margin: 8% 0;
}
.txtconbold {
    height: 12px;
}
.padmo{
	margin-bottom:5%;
}
}
.priceright{
	text-align: right;
}
hr{
	border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(189, 0, 64, 1), rgba(0, 0, 0, 0));
}
#priceamount{
	 font-size:25px;color:#8A6D3B; font-weight:bold; text-align:center;
}
.dropdown-menu{
	min-width:20%;

}

.page-header {
  padding-bottom: 0;
  margin: 0;
  border-bottom: 0px solid #eee;
}

h1, .h1, h2, .h2, h3, .h3 {
  margin-top: 0;
  margin-bottom: 0;
}

.topchecktxt{
    padding-top: 5px;
    text-transform:uppercase;
    text-align: center;
}

.btnbacktop{
	margin-top: 20px;
}

.btn-sm, .btn-group-sm>.btn {
    padding: 3px 10px;

}

.bgstaygrey{
	background:#F5F5F5;
	padding:1%;
	font-size: 1.8em;
	color: #000;
	margin-bottom: 2%;
    border-radius: 3px;
}

.daydate{
  font-size: 3em;
  font-weight: 600;
}

.month{
  font-size: 1em;
}

.bgdate{
  background: #ff9800;
}

.topicguest{

}

.form-group {
    margin-bottom: 2%;
}

.form-group2 {
    margin-bottom: 4%;
}

.nameroomprice{
	color:#000000;
	font-size:1.5em;
	font-weight:bold;
	padding-bottom:3%;
}

.tabcheck{
	/* width:80%; */
	margin:0 auto;
}

.fontbold{
	font-weight:bold;
}

.bordernone{
	border: none;
}
.boxconfirm4 span{
	font-size:1em !important;
}
.submitbar{
	border-right:0px !important;
}
.nopadding{
 padding:0 !important;
 }
 
 #creditcard{
 	padding:1% 8%;
 }
 label#policycfm{
 	float:none !important;
 }
 .no-padding{
 	padding:0 !important;
 }
 .no-margin{
 	margin:0 !important;
 }
 .no-border{
 	border:0 !important;
 }
 .affix_ {
    position: relative;
    width: 100%;
    min-width: 100px;
    max-width: 980px;
    float: none;
    display: block;
    margin: 0 auto;
}
.selectedList{
	margin:0px;
	text-align: left;
}
#roomselected{
	padding-left: 15px;
}
.soldout{
	font-weight: bold;
	font-size: 15px;
	color: red;
}
.nameroom{
	padding :0 15px 0 15px;
}
.totaladd{
	padding-top:10px;
	text-align: right;
}

.btnpluss{ 
	color: #8A6D3B;
}

.topicquick{
  font-size: 2em;
  text-align: center;
  font-weight: 600;
}

.topicquick2{
  font-size: 1em;
  text-align: center;
}

.calendarBox{
  display: table;
  width: 100%;
  min-height: 68px;
}
.calendarBox .dateBox, .calendarBox .navBox{
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

.calendarBox .dateBox{
  color: #fff;
  cursor: pointer;
  width: calc(50% - 15px);
  border-radius: 5px;
}
.calendarBox .dateBox:hover{
  background: #747373;
}
.calendarBox .dateBox input{
  display: none;
  width: 0px;
  height: 0px;
  clear: both;
}
.calendarBox .dateBox > div{
  margin-left: -5px;
}
.calendarBox .navBox{
  width: 30px;
  text-align: center;
}
.calendarBox .dateBox .month{
  text-transform: uppercase;
  top: -10px;
    position: relative;
}
@media (max-width: 410px){
  .calendarBox .dateBox{
    width: 50%;
  }
  .calendarBox .dateBox:first-child{
    border-right: 1px solid #fff
  }
  .calendarBox .dateBox:nth-child(2) {
    border-left: 1px solid #fff
  }
  .calendarBox .navBox{
    display: none;
  }
}

/* end by champ */
#codeBox{
  display: none;
  margin-top: 18px;
}
#codeText{
  margin-top: 10px;
}

#closeCodeBtn{
  background: #18212f;
  border-color: #18212f;
  cursor: pointer;
  color: #ccc;
}
#codeText {
  text-align: center;

}

.btnbookquick{
  background: #C6B159;
  color: #fff;
  font-size: 1em;
  text-align: center;
  padding: 6.5% 1% ;
  cursor: pointer;
  text-transform: uppercase;
  font-weight: 600;
}

.btnbookquick:hover{
  background: #9A9373;
}
@media (max-width: 991px){
  .btnbookquick{
    padding: 1.5% 1% ;
  }
  #codeText, #codeBox{
    margin-top: 10px;
  }
  .btnAndCode{
    margin-top: 10px;
    text-align: center;
  }
  #form-ctrl{
    padding-bottom: 5px;
  }
}
@media (max-width: 991px){
  .booking, .booking > div {
    display: block;
    width: 100%;
  }
  .btnbookquick{
    padding: 1.5% 1% ;
  }

}

.form-booking{
  padding: 5px;
}
.ui-datepicker{
  z-index: 999 !important;
}