/*******************************Calendar Top Navigation*********************************/
div#calendar{
  margin:0px auto;
  padding:0px;
  width: 100%;
  font-family:Roboto,Helvetica, Arial, "Times New Roman", Times, serif;
  margin-top: 50px;
  margin-bottom: 130px;
}
 
div#calendar div.box{
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 40px;
    background-color: #fff;
    border-bottom: solid 0px #f3eaea;
}
 
div#calendar div.header{
    line-height: 40px;
    vertical-align: middle;
    position: absolute;
    left: 6px;
    top: 0px;
    width: 98.5%;
    height: 40px;
    text-align: center;
    background-color: #fff;
    padding: unset;
}

 
div#calendar div.header a.prev,div#calendar div.header a.next{ 
   position: absolute;
    top: 5px;
    height: 28px;
    display: block;
    cursor: pointer;
    text-decoration: none;
    color: #008ace;
    background: #ffffff;
    width: 50px;
    border: solid 1px;
    line-height: 29px;
    font-size: 18px;
    border-radius: 0px;
	
} 
 
div#calendar div.header span.title{
    color: #000;
    font-size: 18px;
    
}
 
 
div#calendar div.header a.prev{
    left:0px;
}
 
div#calendar div.header a.next{
    right:0px;
}
 
 
 
 
/*******************************Calendar Content Cells*********************************/
div#calendar div.box-content{
    border:1px solid #f7f3f3;
    border-top:none;
	width: 99%;
    margin: 0px auto;
    margin-top: 20px;
}
 
 
 
div#calendar ul.label{
    float: left;
    margin: 0px;
    padding: 0px;
    margin-top: 0px;
    margin-left: 0;
    background: #252525;
    width: 100%;
    border-radius: 0;
}
 
div#calendar ul.label li{
   margin: 0px;
   padding: 0px;
   margin-right: 5px;
   float: left;
   list-style-type: none;
   width: 13.4%;
   height: 40px;
   line-height: 40px;
   vertical-align: middle;
   text-align: center;
   color: #f5f5f5;
   font-size: 14px;
   background-color: transparent;
   font-weight: 500;
   text-transform: uppercase;
}

.book-now-btn{ 
    text-align: center;
    padding-bottom: 15px;
    font-size: 17px;
}

.book-now-btn a {
    background: #2888d1;
    display: inline-block;
    padding: 3px 35px;
    width: auto;
    text-align: center;
    margin-top: 10px;
    font-size: 20px;
}

.book-now-btn a h4{ color:#fff;}

.pop-description{font-weight: 400;font-size: 14px;color: #000;padding: 0px 10px;}
.pop-title{ font-size:15px;margin-bottom: 4px; margin-top: 2px; text-align: center;}
 
 

div#calendar ul.dates{
    float:left;
    margin: 0px;
    padding: 0px;
    margin-left: 5px;
    margin-bottom: 5px;
}
 
/** overall width = width+padding-right**/
div#calendar table.dates td{
    margin: 0px;
    padding: 0px;
    margin-right: 0px;
    margin-top: 0px;
    list-style-type: none;
    width: 85px;
    height: 80px;
    font-size: 25px;
    color: #000;
    border-right: solid 1px #dadce0;
    padding-bottom: 10px;
    /*padding-left: 5px;
    padding-right: 5px;*/
    text-align: center;
    border-bottom: solid 1px #dadce0;
    display: table-cell;
    vertical-align: text-bottom;
}

div#calendar table.dates td .day-content:hover{
	background: #464646;
    cursor: default;;
}
 
:focus{
    outline:none;
}
 
div.clear{
    clear:both;
} 

table { 
    width: 100%;
    position: relative;
    display: inline-table;
    height: 100%;
}

td, td * {
   /* max-height: 200px !important;
    max-width:200px;*/
}

.day-content {
  font-size: 11px;
  line-height:14px;
  color: #000000;
  text-align: left;
  padding: 3px;
  font-weight: 300;
  background: #e6e6e6;
  width: 90%;
  margin: 0px auto;
  border-radius: 3px;
  margin-bottom: 4px;
  padding-bottom: 3px !important;
  cursor: pointer !important;
}
.day-content-border{border-bottom: solid 0px #e2e2e2;padding-bottom: 8px;}
.day-title {
    background: #fff;
    border-bottom: solid 1px #f1f1f1;
    margin-bottom: 10px;
    line-height: 25px;
    margin-top: 1px;
    text-align: center;
    padding-left: 2px;
    width: 22px;
    height: 22px;
    font-size: 11px;
    font-weight: 600;
    box-shadow: 3px 3px #d6d6d6;
    color: #353535;
}
.select-duration {
       margin: auto;
    margin-top: 4px;
    height: auto !important;
    color: #008ace ;
    text-transform: capitalize;
    font-weight: 400;
    padding: 6px 5px !important;
    border-radius: 0;
    position: absolute;
    left: unset !important;
    right: 62px;
    top: 1px;
    line-height: initial;
    padding-right: 22px !important;
    font-size: 12px !important;
    
}

.pop-image img{
	/* width: 100%;*/
	max-width:400px;
	margin: 0px auto;
    display: block;
}


.no-visibility{ visibility:hidden;}

.popover-content {
    padding: 9px 14px;
    overflow: auto;
    /*height: 160px;*/
    font-size: 13px;
    color: #737373;
    width: 375px;
    text-align: left;
    line-height: 20px;
    font-family: Roboto,Helvetica, Arial, "Times New Roman", Times, serif;
    font-weight: 500;
	background:#fff;
	height: 375px;
}
.popover{width: 100%;max-width: 760px;padding: 10px;text-align: center;}

.pop-time{
font-weight: 600;
    color: #656565;
    font-size: 14px;
	text-align: center;
	margin-top:10px;
}
.same-height{
	    height: 100%;
    /*display: table-cell;*/
}

.popover-content::-webkit-scrollbar-track{border-radius: 0px;background-color: #fafbfc;}
.popover-content::-webkit-scrollbar{width: 7px;background-color: #85898c;}
.popover-content::-webkit-scrollbar-thumb{border-radius: 7px;background-color: #85898c;}

select {

-webkit-appearance: none; 
-moz-appearance: none;
appearance: none;

-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
background:url(../images/arrow.png) no-repeat;
background-position: right center;
color: #000000;
border: 1px solid #000000;

}

.filter_by_time{
	position: absolute;
    top: 0;
    right: 166px;
}



@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 
    select {
		background:url(../images/arrow@2x.png) no-repeat;
		background-position: right center;
		background-size:17px 16px;
	}
}

.color1{ background:#369ddc; color:#fff;}
.color2{ background:#59b182; color:#fff;}
.color3{ background:#e79641; color:#fff;}

@media (max-width:800px) {
.main-info-grid1, .main-info-grid2, .main-info-grid3 {
	float: none;
	width: 100%;
	margin: 0 auto;
}
}


@media screen and (max-width: 100px) and (min-width: 700px) {
.popover {
    width: 100%;
    max-width: 675px;
}

.pop-image{
     float: left;
}

  .pop-image img {
    max-width: 300px;
    float: left;
}
}