@charset "utf-8";
/* CSS Document */

/*body */
body {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#333;
}

h1{
	margin-top:-10px;
	margin-bottom:0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:22px;
}

.myloadercontainer{
	position: fixed;
	float:inherit;
	width:100%;
	height:100%;
    background-color: rgb(0,0,0); /* Black fallback color */
    background-color: rgba(0,0,0, 0.5); /* Black w/opacity */
    overflow-x: hidden; /* Disable horizontal scroll */
	display:none;
	z-index:2;
}
.myloader {	
  border: 4px solid #f3f3f3; /* Light grey */
  border-top: 4px solid #34AF19; /* Blue */
  border-radius: 50%;
  width: 25px;
  height: 25px;
  animation: spin 1s linear infinite;
  
    position:absolute;
    margin:0 auto;
    top: 40%;
    left: 45%;
    transform: translate(-50%, -50%);
    box-shadow: 0px 0px 50px 2px #000;
	display: inline-block;
	z-index: 2;
}

#myloader{ 
/*position:absolute; right:10px; top:10px; display:none;*/
    /* display:none; */


}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.errormessage{
	width:100%;
	font-size:12px;
	font-weight:bold;
	color:#F00;
	white-space:nowrap;
	font-weight:bold;
	text-align:center;
}

#lblTitle{
	font-size:18px;
	margin-bottom:5px;
	color:#333;
}

#lblmsg{
	color:#F00;
	font-weight:bold;
}

#lblData{
	color:#000;
	font-weight:bold;
}

#search {
	padding-top:10px;
	padding-bottom: 10px;
	line-height:40px;
}

.navbar{
	width:120%;
	left: -15px;
	background:#F9F9F9;
	padding:5px;
	position: relative;
	top: -17px;
	padding-left:12px;
}

.btn-sm {
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  font-family: Arial;
  color: #ffffff;
  font-size: 12px;
  background: #464646;
  padding: 5px 10px 5px 10px;
  text-decoration: none;
  cursor: pointer;
}

.btn-sm:hover {
  background: #39F;
  text-decoration: none;
}

.btn-nav {
  -webkit-border-radius: 2;
  -moz-border-radius: 2;
  border-radius: 2px;
  border-color:#000;
  font-family: Arial, Helvetica, sans-serif;
  color: #000;
  font-size: 12px;
  background: transparent;
  border-style: solid;
  border-width:thin;
  padding: 3px 5px 3px 5px;
  text-decoration: none;
  cursor: pointer;
  margin-right:10px;
}

.btn-nav:hover {
  background: #39F;
  text-decoration: none;
  color:#FFF;
}

/* Line 1 */
.footable > tbody > tr > td, .footable > thead > tr > th
{
  border-left-width: 1px;
  border-left-style: solid;
  border-left-color: #000000;
  border-top-width: 1px;
  border-top-style: solid;
  border-top-color: #000000;
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  text-align: left;
  box-sizing: border-box;
  z-index: 2;
  position: relative;
  background-clip: padding-box;
}

/* Line 1 */
.footable > thead > tr > th, .footable > thead > tr > td
{
  background-color: #39F;
  background-image: #ffc166;
  z-index: 2;
}

.btn-gridview {
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  font-family: Arial;
  color: #ffffff;
  font-size: 12px;
  background: #464646;
  padding: 5px 10px 5px 10px;
  text-decoration: none;
  cursor: pointer;
}

.btn-gridview:hover {
  background: #39F;
  text-decoration: none;
}

.btn-search {
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  font-family: Arial;
  color: #ffffff;
  font-size: 16px;
  background: #006;
  padding: 6px 10px 6px 10px;
  text-decoration: none;
  cursor: pointer;
}

.btn-search:hover {
  background: #F90;
  text-decoration: none;
}

.btn-enquiry
{
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  font-family: Arial;
  color: #ffffff;
  font-size: 16px;
  background: #006;
  padding: 5px 10px 5px 10px;
  text-decoration: none;
  cursor: pointer;
  width:80px;
}

.btn-enquiry:hover {
  background: #F90;
  text-decoration: none;
}

.btn-book
{
  -webkit-border-radius: 5;
  -moz-border-radius: 5;
  border-radius: 5px;
  font-family: Arial;
  color: #3F6;
  font-size: 16px;
  background: #464646;
  padding: 5px 10px 5px 10px;
  text-decoration: none;
  cursor: pointer;
  width:80px;
  font-weight:bold;
}

.btn-book:hover {
  background: #39F;
  text-decoration: none;
}
	
.DateCalendar{
            background-image: url(/saxmin/template/images/calendar.gif);
            background-repeat: no-repeat;
			background-position:right;
			border: 1px solid #ccc;
			width:120px;
			font-size:16px;
			padding: 3px;
}

.DateCalendar:focus{
	background-color:#FFF0B4;
}

.TimeCalendar{
			border: 1px solid #ccc;
			width:55px;
			font-size:16px;
			padding:2px;
}

.VCAT{
			border: 1px solid #ccc;
			width:120px;
			font-size:16px;
			padding:2px;
}

#Detail{display:none;}
#Detail2{display:block;}
#Detail3{display:block;}
#Detail4{display:block;}
#Detail5{display:block;}

.rental-rate{
	font-size:16px;
	font-weight:bold;
}

.del-col{
	font-size:14px;
}


.daily-rate{
	font-size:12px;
}

.header-title{
	font-size:16px;
	font-weight:bold;
}
	
#lblData{
	color:#333;
	font-weight:bold;
	
}

.vehicletitle{
	font-size:16px;
	font-weight:bold;
	width:100%;
	color:#F90;
}

.availability{
	font-size:14px;
	font-weight:bold;
	width:100%;
	color: #333;
}

.imgTick{
	display:block;
	width:25px;
	height:25px;
}

.imgVehicle{
		border: 1px solid  #C4C4C4;;
	max-width: 300px;
	height:auto;
	z-index:2;
}

.hiddencol{display: none; width:0px;}

@media (max-width:600px){
#ui-datepicker-div {
position:absolute;
top: 50vh !important;
left: 0px !important;
width:100% !important;
}
}


@media (max-width:400px){
	
.myloader {	top: 50%;left:45%;}
.btn-search{ width:100%; margin-top:5px;}
#Detail{display:block;}
#Detail2{display:none;}
#Detail3{display:none;}
#Detail4{display:none;}
#Detail5{display:none;}
.hiddencol{width:0px;}
.DateCalendar{width:98%;}
.imgTick{ display: block;};
.imgVehicle{max-width:100%; width:100%};
.availability{ width:100%; display:block;}
.rental-rate{ width:100%; display:block;}
.daily-rate{ width:100%; display:block; margin-bottom:5px;}
.btn-book{width:100%; margin-bottom:10px;}
.btn-enquiry{width:100%; margin-bottom:10px;}
}
