/* *{margin: 0; padding: 0; font-family: "Arial", sans-serif;}*/
*,*:before,*:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
.cl:before,.cl:after{content:" ";display:table}
.cl:after{clear:both}
.cl{*zoom:1}
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input{min-height:30px}

/** Define Regular fonts **/
h1, h2, h3, h4{font-family: "museo-sans",sans-serif; color:#fff; margin: 0 0 15px; font-weight:normal;}
p, a, a:hover, li, label{color: #fff; }
#main-content p{line-height: 160%; margin-bottom: 10px;}
#main-content p a{text-decoration:underline}
#main-content p a:hover{text-decoration:none}
#main-content li{margin-left: 20px;line-height: 160%;}
#footer *{font-size: 12px;}
#footer p{margin:0;line-height:1}
.page-header{border: 0;}
table{color:#000}

body{font-size:1em; color:#fff; background: url('../images/bg.jpg') no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; text-rendering:optimizeLegibility;margin: 0;font-family: sans-serif;}
legend{color:#fff}
.container{width: 960px; margin-left: auto; margin-right: auto;}
fieldset{border: 0;}

#nav{background: #000; width: 100%; height: 55px; position: fixed; top: 0; z-index: 999; }
#nav .wrapper{display: table; margin: 0 auto; }
#logo{width: 100%; float: left; text-align: center; margin: 105px 0 45px 0;}
#logo img{max-width: 100%;}
#callouts{width: 81%; margin: auto; text-align: center;}
#main-content{/* float: left; */ width: 100%; background: #000; background: rgba(0,0,0,0.8);/*opacity: 0.8;    filter: alpha(opacity=80); /* For IE8 and earlier */padding: 2%; margin: 25px auto;}
#footer{text-align: center; background: #000; opacity: 0.8;    filter: alpha(opacity=80); /* For IE8 and earlier */padding: 20px 2%;display: table; margin: 0 auto; margin-bottom: 20px; clear: both;}

/* callouts */
#callouts .callout a{width: 49%; float: left; background: #000; text-align: center; text-decoration: none; padding: 20px 0; margin: 0 1px;font-family: "museo-sans",sans-serif; font-weight: 100; font-size: 1.5em;}
#callouts .callout a:hover{background: #95c254;color: #000;}

/* Login Page */
.login input{padding: 3px; background: #fff;}
.control-group{margin-bottom: 10px;}
.login .btn{padding: 5px; font-family: "museo-sans",sans-serif; margin: 10px 0; cursor: pointer;}
.well, .form-actions{background: transparent;}
ul.nav-tabs li{margin: 0}
ul.nav-tabs li:hover a{color: #000}

/** Contact Form **/
#main-content .contact-form {margin-left: 20px;}
#main-content .contact-form .requiredsign{color: #fff; }
#main-content .contact-form .ce-button-submit, #main-content .contact-form .ce-button-reset{padding: 5px; font-family: "museo-sans",sans-serif; margin: 10px 0; cursor: pointer;}
.ce-cf-container .inputbox, .ce-cf-container .required{background-image:none!important;background: #fff;box-shadow:none;border:1px solid #b9b9b9;padding: 5px 6px;min-height: 32px;width: 80%;}
#main-content .contact-form .ce-cf-container {width:99%; margin: 0;}
.row-fluid.row {margin: 0;}

/** Menu **/
#nav-toggle{display: none;}
#nav-toggle{width: 100%; height: 39px; background: url('../images/nav-open.jpg') no-repeat center center;}
#nav-toggle .opened{background: url('../images/nav-close.jpg') no-repeat center center;}

ul.menu{display:block;list-style-type:none;margin: 0;padding: 0;}
ul.menu a{text-decoration:none;font-family:museo-sans,sans-serif;font-weight:300;float:left;padding:18px}
ul.menu li{float:left}
ul.menu li a:hover,ul.menu li.active a{background:#8dc63f;color:#000}
ul.menu ul{display:none;z-index:500;float:left;list-style-type:none;margin-top:55px;position:absolute;width:200px}
ul.menu li:hover>ul{display:block!important;padding: 0;}
ul.menu ul a{padding:10px 10%;width:80%}
ul.menu li.active ul a,ul.menu li:hover ul a,ul.menu ul a{background:#fff;color:#000;font-size:1.3em}
ul.menu ul li{float:left;text-align:left;width:200px}
ul.menu ul li a:hover{background:#d1d1d1}

/** Fixing background colors **/
.booking-container,#calendar-item{background:transparent}

/** Booking **/
.service-item.selected p,#calendar-item table td:hover, #calendar-item table td.hover, #calendar-item table td.selected, #items table td:hover, #items table td.selected{background: #95c254;color:#000}
#main-content .service-item p{margin-bottom:0}
#calendars{text-align:center}
#calendars table{background:#fff;color:#000;width:auto;border-radius:0;margin:16px;vertical-align:top;}
#item-buttons input {font-family: "museo-sans",sans-serif;font-size: 1.6em;padding: 10px 40px;}
#service-list{text-align:center}
.service-item {float: none;border:0;margin: 0 .5% 10px;display:inline-block;width:31%;}
.service-item .service-image img{width:100%;max-width:286px}
#calendar-select-back, #calendar-select-forward{/*display:none*/; font-size: 1em; color: #fff; cursor: pointer;}
#booking-complete th,#booking-complete td{padding: 8px;font-size: 14px !important;color: #fff!important;}
#booking-complete table {background: transparent;}
.date-select{display:inline-block;vertical-align:middle;margin-right: 10px;}
#date-select-button{margin-bottom:9px}
.table tbody tr.warning>td a{color:#000}

.osbtdheader{background:#8dc63f;text-transform: none;}
.td_data{background:#fff} 
.table th, .table td{color:#000}
#my-bookings tr.osb-extra-info td {background: #e1e1e1;color: #000!important;padding-left: 20px;}
tr.osb-extra-info a {color: #000;font-size: .8em;}

@media screen and (min-width:701px){
  ul.menu{display:block!important}
}

@media screen and (max-width:980px){
  .container{max-width: 100%;}   
  #callouts{width:100%;}
  #callouts .callout a{width: 80%; padding: 10px 0; margin: 1px 10%;}
}

@media screen and (max-width:768px){
  #main-content .contact-form {margin-left:0;}
}

@media screen and (max-width:700px){
  #nav-toggle{display: block;}
  #nav{ height: auto; position: relative; float: left; margin-bottom: 20px; width: 100%;}
  #nav .wrapper{width: 100%;}
  ul.menu{display: block;}
  ul.menu li{width: 100%;float: none;display: block;}
  ul.menu a{ padding: 18px 3%;float: none;display: block;}
  ul.menu ul{position: relative; margin-top: 0; width: 100%;float: none;}
  ul.menu ul li{width: 100%;float: none;}
  ul.menu ul a {padding: 10px 5%;width: 100%;}
  #logo{width:70%; margin: 20px 5%;}
  #nav-toggle-wrapper{width: 20%; float: left; margin-top: 20px;}
  #nav-toggle{display: block;}
}

@media screen and (max-width:500px){
  .service-item{width:100%;background: transparent;max-width: 286px;}
}

@media screen and (max-width:480px){
	#main-content{width: 100%;padding: 4%;}
	#callouts .callout a{width: 100%;margin: 1px 0;}
}