/* Calendar */
.calendar {
    width: 95%;
    margin: 0 auto;
}

.icon-chevron {
  display:block;
  width:0.7em;
  height:1.1em;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAWCAMAAAAo0TYrAAAAElBMVEX///8AAAAAAAAAAAAAAAAAAABknMCaAAAABXRSTlMAEHCg0O5XV0MAAAAzSURBVHgBYwACJkYGZMDMysKIwmUFCyC4KAIsrKgCjPQQQPCpzUX4B9O/mOGBGV7o4QkA5zcCv3HiEZgAAAAASUVORK5CYII=);
}
.icon-chevron-rotate {
  transform: rotate(180deg);
}
.page {
  width: 90%;
  margin: 0 auto;
  padding-bottom: 2em;
  text-transform: uppercase;
  font-family: arial;
  color: #009999;
}
.pull-left {
    float: left;
}
.pull-right {
    float: right;
}
.responsive-calendar-placeholder {}
.responsive-calendar-modal {
  background-color: #1d86c8;
  color: white;
  padding: 1em;
}
.responsive-calendar .controls {
  text-align: center;
}
.responsive-calendar .controls a {
  cursor: pointer;
}
.responsive-calendar .controls h4 {
  display: inline;
}
.responsive-calendar .day-headers,
.responsive-calendar .days {
  font-size: 0;
}
.responsive-calendar .day {
  display: inline-block;
  position: relative;
  font-size: 14px;
  width: 14.285714285714286%;
  text-align: center;
}
.responsive-calendar .day a {
  color: #000000;
  display: block;
  cursor: pointer;
  padding: 20% 0 20% 0;
}
.responsive-calendar .day a:hover {
  background-color: #009999;
  text-decoration: none;
}
.responsive-calendar .day.header {
  border-bottom: 1px gray solid;
}
.responsive-calendar .day.active a {
  background-color: #1d86c8;
  color: #ffffff;
}
.responsive-calendar .day.active a:hover {
  background-color: #36a0e2;
}
.responsive-calendar .day.active .not-current {
  background-color: #8fcaef;
  color: #ffffff;
}
.responsive-calendar .day.active .not-current:hover {
  background-color: #bcdff5;
}
.responsive-calendar .day.not-current a {
  color: #ddd;
}
.responsive-calendar .day .badge {
  position: absolute;
  top: 2px;
  right: 2px;
  z-index: 1;
}

/* Reviews */
.reviews {
  width : 90%; 
  height : 18em;
  overflow: hidden;
  background-color : #fff ;
  border-radius : 5px;
  margin : 0 auto ;
  position: relative;
/*  box-shadow : 0 0 10px -2px #ddd ;*/
}
.panel {
  width : 100%;
  max-height: 100%;
  position : absolute ; 
}
.PanelAct {
  left : 0 ;
}
.panel img { 
  width : 100px;
  height : 100px; 
  text-align : center ;
  float : left ; 
  margin : 25px; 
}
/*== Removal Start
png images background
==*/
.panel:nth-of-type(1) img {
    background : #12aedb ;
}
.panel:nth-of-type(2) img {
    background : #db4646 ;
}
.panel:nth-of-type(3) img {
    background : #96c465 ;
}
/*== Removal End==*/

.panel p {
  float : left ; 
  width : 24em;;
  clear : right ;
  text-align : justify ;
  margin : 25px 0 10px 0;
  font-size : 14px ; 
  color : #aaa ;
  line-height : 1.2em
}
.panel h7 { 
  float : left ; 
  width: 200px; 
  font-size : 14px ; 
  color : #999 ;
  font-weight : bold ;
  font-style : italic ;
}
.control { 
  position : absolute ; 
  bottom : 20px; 
  right : 30px;
}
.control span {
  background-color : rgba(0,0,0,0.1) ; 
  padding : 5px; 
  display : inline-block ;
  vertical-align : top ;
  margin-left : 5px ;
  border-radius : 50%;
  cursor : pointer ;
  -webkit-transition : 0.3s ease-in;
          transition : 0.3s ease-in
}
.ContActive {
  background-color : #bbb !important ;
}

@media all and (min-width: 40em) {
.pagebanner {
    display: none;
}
.calendar{
    color: black;
}
.reviewstitle {
}
.page {
    width: 25%;
    float: left;
    padding: 0em 1em 0em 1em;
    margin-left: 5em;
}
.reviews {
    width: 25%;
    float: right;
    padding: 0em 1em 0em 1em;
    margin-right: 5em;
}
.panel {
    width: 100%;
    float: right;
}
.panel h6 {
    padding-top: 1.8em;
}
.leftside {
    float: left;
    width: 30%;
    min-height: 25em;
    position: relative;
}
.middleside {
    float:left;
    width: 30%;
    min-height: 25em;
    position: relative;
}
.rightside {
    float: right;
    width: 30%;
    min-height: 25em;
    position: relative;
}
footer {
    padding-top: 25em;
}
}

@media all and (min-width: 60em) {
.pagebanner {
    display: none;
}
.calendar{
    color: black;
}
.reviewstitle {
    padding-top: 21.1em;
}
.page {
    width: 35%;
    float: left;
    padding: 0em 1em 0em 1em;
    margin-left: 5em;
}
.reviews {
    width: 35%;
    float: right;
    padding: 0em 1em 0em 1em;
    margin-right: 5em;
}
.panel {
    width: 100%;
    float: right;
}
.panel h6 {
    padding-top: 1.8em;
}
.leftside {
    float: left;
    width: 30%;
    min-height: 25em;
    position: relative;
    padding: 0em 1em 0em 1em;
}
.middleside {
    float:left;
    width: 30%;
    min-height: 25em;
    position: relative;
    padding: 0em 1em 0em 1em;
}
.rightside {
    float: right;
    width: 30%;
    min-height: 25em;
    position: relative;
    padding: 0em 1em 0em 1em;
}
footer {
    padding-top: 25em;
}
}