.timeSlotContainer{
display: -webkit-box;
display: -ms-flexbox;
display:flex;
font-size:13px;
-webkit-box-pack:center;
-ms-flex-pack:center;
justify-content:center;
}
.timeOfDayContainer{
display: -webkit-box;
display: -ms-flexbox;
display:flex;
font-size:13px;
-webkit-box-pack:left;
-ms-flex-pack:left;
justify-content:left;
}
.daysOfWeekContainer{
display: -webkit-box;
display: -ms-flexbox;
display:flex;
font-size:13px;
-webkit-box-pack:center;
-ms-flex-pack:center;
justify-content:center;

height:40px;
margin: 20px 0px 40px 0px;
background-color:#eaeaea;
border-bottom-color:#448bff;
border-bottom-style:solid;
border-bottom-width:thick;
width:100%;
}
.eachDayContact{
height:40px;
margin-top:10px;
background-color:#eaeaea;
border-bottom-color:#448bff;
border-bottom-style:solid;
border-bottom-width:thick;
position:relative;
width:100%;
display:block;
float:left;
text-align:center;
font-size:13px;
font-weight:bold;
color:#212121;
}
.eachDayWrapper{width:14.2857%;}
.timeSlotContainer{height:200px;}
.daysOfWeek, .timeOfDay, .sevenTimeSlots{
display: -webkit-box;
display: -ms-flexbox;
display:flex;
-webkit-box-pack:center;
-ms-flex-pack:center;
justify-content:center;
height:45px;
font-size:13px;
text-transform:uppercase;
width:100%;
position:relative;
}
.sevenTimeSlots{height:200px;}
.timeOfDay{
padding-top:5px;
width:87.5%;
margin-left:auto;
margin-right:auto;
-webkit-box-pack:left;
-ms-flex-pack:left;
justify-content:left;
}
.eachTime{
display: -webkit-box;
display: -ms-flexbox;
display:flex;
height:40px;
font-size:13px;
text-transform:uppercase;
max-width:1170px;
}
.timetable, .daysOfWeek,  .eachTime{
position:relative;
margin-left:auto;
margin-right:auto;
font-size:13px;
max-width:100%;
}
.timetable{
display: -webkit-box;
display: -ms-flexbox;
display:flex;
margin-bottom:10px;
}
.eachTimeContainer{
display: -webkit-box;
display: -ms-flexbox;
display:flex;
height:40px;
font-size:13px;
max-width:100%;
margin-top:20px;
}
.eachDay{
position:relative;
left:0px;
top:8px;
width:167px;
height:40px;
display:inherit;
float:left;
text-align:center;
font-size:13px;
font-weight:bold;
}
.eachDayCentre, .eachTimeCentre{
position:relative;
left:0px;
top:8px;
width:100%;
height:40px;
display:block;
float:left;
text-align:center;
font-size:13px;
font-weight:bold;
color:#212121;
}
.timeSlotPaid, .timeSlotFree, .timeSlotEmpty{
position:relative;
left:0px;
top:8px;
width:14.2857%;
height:200px;
display:block;
float:left;
text-align:center;
font-size:13px;
color:#212121;
border-top-color:#448bff;
border-top-style:solid;
border-top-width:medium;
border-left-width:medium;
border-left-style:solid;	
border-left-color:#FFFFFF;
word-wrap:break-word;
}
.timeSlotPaid{background-color:#b5b5b5;}
.timeSlotFree{background-color:#eaeaea;}
.timeSlotEmpty{background-color:#ffffff;}

.lessonName{
display:flex;
position:relative;
font-weight:bold;
color:#000000;
text-transform:capitalize;
font-size:18px;
height: 48%;
align-items:center;
justify-content: space-around;


}
.times{
display:flex;
position:relative;
color:#000000;
font-size:18px;
height: 48%;

align-items:center;
justify-content: space-around;

}
.heading{
position:relative;
padding-top:5px;
clear:both;
font-size:18px;
text-transform:capitalize;
}
.name{
position:relative;
padding-top:5px;
clear:both;
font-size:16px;
text-transform:uppercase;
}
.moreButton, .closeButton{
position:absolute;
border-color:#ffffff;
border-style:solid;
border-width:1px;
width:130px;
height:35px;
text-align:center;
background-color:none;
left:40px;
top:430px;
padding-top:10px;
z-index:11;
}
.closeButton{
background-color:#4489fe;
border-color:#ffffff;
}
.moreButton:hover, .closeButton:hover{background-color:#4489fe;}
.classDescTitleSummary {
position:relative;
height:47px;
text-align:left;
color:#000000; 
z-index: 12;
font-size:150%;
text-transform:uppercase;
}
.classDescSummary {
position:relative;
margin:10px 0px 10px 0px;
text-align:left;
}
.excerciseType, .level, .benefits {
position:relative;
margin:3px 0px 3px 0px;
text-align:left;
color:#80828F;
}
.day, .startTime, .endTime{
color:#60626F;
display:inline;
text-transform:uppercase;
}
.day{
width:110px;
float:left;
}
.startTime{float:left;}
.sheduleClasses{
position:relative;
max-width:87.5%;
margin-left:auto;
margin-right:auto;
display:block;
margin-top: 40px;
margin-bottom: 110px;
}
.classPhoto{
position:absolute;
width:480px;
height:225px;
display:block;
bottom:10px;
}
.instructorBioHolder{
display:block;
position:relative;
width:50%;
border-color:#00FF00;
background-color:#E5E8F1;
padding:10px;
}
.instructorPhoto{
display:block;
position:relative;
width:100px;
height:130px;
margin-top:20px;
margin-left:auto;
margin-right:auto;
border-color:#FF0000;
}
.instructorBio{
display:block;
position:relative;
max-width:100%;
border-color:#00FF00;
margin-left:auto;
margin-right:auto;
margin-top:20px;
padding-bottom:20px;
font-size:100%;
}
.instructor{
display:block;
position:relative;
text-align:center;
font-weight:bold;
font-size:120%;
}
.classDescription{
display:block;
position:relative;
font-size:100%;
width:50%;
border-color:#E5E8F1;
margin-left:60px;
}
.classInfoHolder{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
position:relative;
border-bottom-color:#80828F;
border-bottom-style:solid;
border-bottom-width:thin;
margin: 15px 0px 40px 0px;
padding: 0px 0px 20px 0px;
}
.wrapper{
position:relative;
display:block;
width:1170px;
border-color:#E5E8F1;
background-color:#FFFFFF;
margin-left:auto;
margin-right:auto;
height:270px;
}
.aboutCol1to3{
position:relative;
display:inline;
width:370px;
float:left;
border-color:#E5E8F1;
margin-top:65px;
padding:0px 30px 0px 0px;
background-color:#FFFFFF;
color:#80828F;
}

@media only screen and (max-width:1024px) {
.eachDayContact, .eachDayCentre, .eachTimeCentre, .daysOfWeek, .eachTime, .timeOfDay, .times, .location{font-size:12px;}
.lessonName {font-size:16px;}
.instructorBio, .classDescSummary{font-size:90%;}
.classDescTitleSummary, .instructor{font-size:120%;}
.sheduleClasses {max-width: 98%}
}
@media only screen and (max-width:771px) {
.eachDayContact, .eachDayCentre, .eachTimeCentre,.daysOfWeek, .eachTime, .timeOfDay, .times, .location{font-size:8px;}
.eachDayContact, .eachDayCentre, .eachTimeCentre,.daysOfWeek, .eachTime, .timeOfDay, .location{font-size:8px;}
.lessonName{transform: rotate(90deg);text-align: left;padding: 0px 10px;justify-content: flex-start;font-size: 12px;}
.instructorBio, .classDescSummary {font-size:80%; }
.instructor{font-size:80%;}
.classDescription{margin:0em; padding:1em;}
.classInfoHolder{width:100%; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse;}
.scheduleClasses{max-width:98%; }
.instructorBioHolder, .classDescription {width:100%;}

}
@media only screen and (max-width: 380px)  {
.eachDayContact, .eachDayCentre, .daysOfWeek, .eachTime, .timeOfDay, .times, .location{font-size:6px;} 
.times{align-items:end; height: 28%;}
.eachTimeCentre{font-size:6px;} 
.lessonName{font-size:10px; padding: 0px 10px;}
#whole_page{min-width:600px;}
.instructorBio, .classDescSummary{font-size:60%;}
.instructor{font-size:70%;}
}
@media only screen and (max-width: 320px)  {
.eachDayContact, .eachDayCentre, .eachTimeCentre,.daysOfWeek, .eachTime, .timeOfDay, .times, .location{font-size:6px;}
.lessonName{font-size:8px;padding: 0px 0px;}
#whole_page{min-width:600px;}
.instructorBio, .classDescSummary{font-size:70%;}
.instructor{font-size:70%;}
}