/* Have fun adding your style here :) - PS: At all times this file should contain a comment or a rule, otherwise opera might act buggy :( */

/*** Class Description fix ***/
.wmts_search {float: right !important;}

/**** Single Post Page ****/
.comment_container { display: none !important; }
.comment_meta_container { display: none !important; }
.template-single-blog { margin-top: 105px !important; }

/***** Homepage Slider Links *****/
.hp-slider-link { font-weight: normal !important; }
.hp-slider-link:hover { text-decoration: none !important;}

/***** Second Tier Nav Fix *****/
.header_color .main_menu ul ul {background-color: rgba(0,0,0,0.5) !important;}
.header_color .main_menu .menu ul li a { background-color: transparent !important;}

/***** Contact Form Fix *****/
#top .main_color input[type='text'], #top .main_color input[type='email'], #top .main_color textarea { background-color: #fff !important; }

/****** Header Transparency Fix *****/
.header_color {background-color: transparent !important;}
.header_color .header_bg { background-color: rgba(0,0,0,0.5) !important; }

/**** Classes Timetable *****/

ul.timetable { margin: 0px; padding: 0px; color: #fff; width: 100%; font-size: 120%; background-color: #3bc5fa; display:table;}
ul.timetable li {padding: 10px; display:table-cell; text-align: center;}
ul.timetable li a { color: #fff; }
ul.timetable li a:hover { color: #0086ba; }
ul.timetable li.title { margin: 0px; font-weight: bold; background-color: #00aaed;}

/**** Ditty News Ticker Custom CSS ****/
.mtphr-dnt-tick-container {margin: 20px 0px 20px 0px;}
.mtphr-dnt-rotate .mtphr-dnt-tick {
	text-align: center !important;
}
.mtphr-dnt-rotate .mtphr-dnt-tick h2 {font-size: 140% !important; font-family: Helvetica, Arial !important;}

/**** Classes Custom ****/

.classes-item:hover .classes-item-overlay.top {
  top: 0;
}

.classes-item:hover .classes-item-title-overlay.top {
  top: 100%;
}

.classes-item {
  position: relative;
  overflow: hidden;
  /*width: 100%;*/
  width: 20%;
  float: left;
  height: 200px !important;
}

@media (max-width: 1170px) {
	.classes-item { width: 25% !important; } 
}

@media (max-width: 950px) {
	.classes-item { width: 33.3% !important; } 
}

@media (max-width: 700px) {
	.classes-item { width: 100% !important; height: none !important;} 
}

.classes-item img {
  width: 100%;
}

.classes-item-overlay.top {
  top: 100%;
}

.classes-item-title-overlay.top {
  top: 0;
}
h3.white {color: #fff !important; padding: 0; margin: 10px 0; font-size: 130%;}

.classes-item-title-overlay {
	position: absolute;
	top: 0;
	height: 50px;
	line-height: 50px;
	background: rgba(0,0,0,0.5);
	width: 100%;
	color: #FFF;
	overflow: hidden;
  text-align: center;
	 -moz-transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
  -webkit-transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
  transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
	}

.classes-item-overlay {
 padding: 20px;
 font-size: 100%;
 font-weight: normal !important;
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  line-height: 18px !important;
  background: rgba(0,0,0,0.5);
  color: #fff;
  overflow: hidden;
  text-align: center;
  /* fix text transition issue for .left and .right but need to overwrite left and right properties in .right */
  width: 100%; 
  
  -moz-transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
  -webkit-transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
  transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
}

.classes-item-overlay a{text-decoration: none; font-weight: normal !important;}
.classes-item-overlay a:hover{text-decoration: none !important; color: #fff !important; font-weight: normal !important;}

/**** Timetable ****/
.timetable-item:hover .timetable-item-overlay.top {
  top: 0;
}

.timetable-item:hover .timetable-item-title-overlay.top {
  top: 100%;
}

.timetable-item {
  position: relative;
  overflow: hidden;
  /*width: 100%;*/
  width: 25%;
  float: left;
  height: 200px !important;
}

@media (max-width: 1170px) {
	.timetable-item { width: 25% !important; } 
}

@media (max-width: 950px) {
	.timetable-item { width: 33.3% !important; } 
}

@media (max-width: 700px) {
	.timetable-item { width: 100% !important; height: none !important;} 
}

.timetable-item img {
  width: 100%;
}

.timetable-item-overlay.top {
  top: 100%;
}

.timetable-item-title-overlay.top {
  top: 0;
}

.timetable-item-title-overlay {
	position: absolute;
	top: 0;
	height: 50px;
	line-height: 50px;
	background: rgba(0,0,0,0.5);
	width: 100%;
	color: #FFF;
	overflow: hidden;
  text-align: center;
	 -moz-transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
  -webkit-transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
  transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
	}
.download-timetable {height: 100px; position: absolute; top: 40%; text-align: center; left: 24%; }
.download-timetable a { text-decoration: none;}
.download-timetable a:hover { text-decoration: none; color:#00aaed !important;}

.timetable-item-overlay {
 padding: 20px;
 font-size: 100%;
 font-weight: normal !important;
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  line-height: 18px !important;
  background: rgba(0,0,0,0.5);
  color: #fff;
  overflow: hidden;
  text-align: center;
  /* fix text transition issue for .left and .right but need to overwrite left and right properties in .right */
  width: 100%; 
  
  -moz-transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
  -webkit-transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
  transition: top 0.3s, right 0.3s, bottom 0.3s, left 0.3s;
}

.classes-clear {clear:both;}

/* General Custom CSS */

.margin-t20 { margin-top: 20px; }



.price { padding: 30px; text-align:center;}

.price h4 {color: #fff; font-weight:normal; }

.price-button { width: 100%; }

.price-button .left { width: 70%; float: left; height: 80px; background-color:#fff; color: #000; font-size: 200%; line-height:80px; font-weight: normal !important;}

.price-button .right { width: 30%; float: right; height: 80px; background-color: #00aaed; padding-top: 20px;}

.price-button .right .amount {font-size: 200%; color: #fff; font-weight: normal !important;}

.price-button .blue {color: #fff;}

.price-button .orange {color: #fff;}

.price-button .purple {color: #fff;}

.price-button .white {color: #ffffff;}

.price-button .red {color: #fff;}



.wmts_header { width: 100%; padding: 30px; background-color: #00aaed; min-height: 140px;}

.wmts_header h5 { font-size: 200% !important; color: #ffffff !important; margin-top: 20px;}
.wmts_header h5.no-margin { font-size: 200% !important; color: #ffffff !important; margin-top: 0px !important;}

.wmts_header_content { float: left; width: 70%; }

.wmts_search { width: 25% !important; }

.wmts_search .wmts_search_input_name { padding:0px 0px 0px 20px !important;

	height:55px !important;

	width:100% !important;

	font-size: 1.2em !important;

	border: none !important;

}



strong { color:inherit !important; }



/***** Gym Styles ******/

.flye-yellow {color: #f8ea21 !important; }



ul.yellow-plus {

    list-style: none;

    margin-top: 12px;

}

ul.yellow-plus li:before {

    content: "+";

    margin-right: 6px;

    margin-left: -17px !important;

    color: #f8ea21 !important;

}



.flye-orange {color: #ffab4b !important; }



ul.orange-plus {

    list-style: none;

    margin-top: 12px;

}

ul.orange-plus li:before {

    content: "+";

    margin-right: 6px;

    margin-left: -17px !important;

    color: #ffab4b !important;

}



.flye-lilac {color: #c3ade8 !important; }



ul.lilac-plus {

    list-style: none;

    margin-top: 12px;

}

ul.lilac-plus li:before {

    content: "+";

    margin-right: 6px;

    margin-left: -17px !important;

    color: #c3ade8 !important;

}



.flye-blue {color: #00b9e5 !important; }



ul.blue-plus {

    list-style: none;

    margin-top: 12px;

}

ul.blue-plus li:before {

    content: "+";

    margin-right: 6px;

    margin-left: -17px !important;

    color: #00b9e5 !important;

}



.flye-purple {color: #981c7e !important; }



ul.purple-plus {

    list-style: none;

    margin-top: 12px;

}

ul.purple-plus li:before {

    content: "+";

    margin-right: 6px;

    margin-left: -17px !important;

    color: #981c7e !important;

}



.flye-pink {color: #e15a9d !important; }



ul.pink-plus {

    list-style: none;

    margin-top: 12px;

}

ul.pink-plus li:before {

    content: "+";

    margin-right: 6px;

    margin-left: -17px !important;

    color: #e15a9d !important;

}



.flye-deeporange {color: #fe7503 !important; }



ul.deeporange-plus {

    list-style: none;

    margin-top: 12px;

}

ul.deeporange-plus li:before {

    content: "+";

    margin-right: 6px;

    margin-left: -17px !important;

    color: #fe7503 !important;

}



#TTFixedLink {

    top:40%;

    height:90px;

    width:90px;

    position:fixed;

    left: 0;

}



.copyright { width: 100% !important; }

.footerCopy { /*width: 500px; float: left;*/ width: 100%; text-align: center;}

.footerLogo { float: right; width: 179px; }



.wmts_search .wmts_search_submit { width: 100% !important; color: #ffffff !important; height: 55px !important; background-color: #000000 !important;}



ul.green-plus {list-style: none; margin-top: 12px; }

ul.green-plus li:before {

    content: "+";

    margin-right: 6px;

	margin-left: -17px !important;

	color: #00bea3 !important;

}



.row-centered {

	text-align: center;

	}

.row-right {

	text-align:right;

	}

.social-fb {

	background: url('../images/social/social-sprite.png') 0px -43px;

	width: 34px;

	height: 41px;

	display: inline-block;

	margin: 0px 20px 0px 0px;

}

.social-fb:hover {

	background: url('../images/social/social-sprite.png') 0px 0px;

}

.social-tw {

	background: url('../images/social/social-sprite.png') -66px -43px;

	width: 60px;

	height: 41px;

	display: inline-block;

	margin: 0px 20px 0px 0px;

}

.social-tw:hover {

	background: url('../images/social/social-sprite.png') -66px 0px;

}

.social-in {

	background: url('../images/social/social-sprite.png') -170px -43px;

	width: 60px;

	height: 41px;

	display: inline-block;

	margin: 0px 20px 0px 0px;

}

.social-in:hover {

	background: url('../images/social/social-sprite.png') -170px 0px;

}

.social-yt {

	background: url('../images/social/social-sprite.png') -251px -43px;

	width: 102px;

	height: 41px;

	display: inline-block;

	margin: 0px 20px 0px 0px;

}

.social-yt:hover {

	background: url('../images/social/social-sprite.png') -251px 0px;

}


.social-fb-sm-grey {

	background: url('../images/social/social-sprite-sm-grey.png') 0px 0px;

	width: 18px;

	height: 29px;

	display: inline-block;

	margin: 0px 15px 0px 0px;

}

.social-fb-sm-grey:hover {

	background: url('../images/social/social-sprite-sm-grey.png') 0px -31px;

}

.social-tw-sm-grey {

	background: url('../images/social/social-sprite-sm-grey.png') -47px 0px;

	width: 41px;

	height: 29px;

	display: inline-block;

	margin: 0px 15px 0px 0px;

}

.social-tw-sm-grey:hover {

	background: url('../images/social/social-sprite-sm-grey.png') -47px -31px;

}

.social-in-sm-grey {

	background: url('../images/social/social-sprite-sm-grey.png') -128px 0px;

	width: 30px;

	height: 29px;

	display: inline-block;

	margin: 0px 15px 0px 0px;

}

.social-in-sm-grey:hover {

	background: url('../images/social/social-sprite-sm-grey.png') -128px -31px;

}

.social-yt-sm-grey {

	background: url('../images/social/social-sprite-sm-grey.png') -182px 0px;

	width: 71px;

	height: 29px;

	display: inline-block;

	margin: 0px 15px 0px 0px;

}

.social-yt-sm-grey:hover {

	background: url('../images/social/social-sprite-sm-grey.png') -182px -31px;

}


.social-fb-xs-blue {

	background: url('../images/social/social-sprite-xs-blue.png') 0px -19px;

	width: 9px;

	height: 19px;

	display: inline-block;

	margin: 0px 20px 0px 0px;

}

.social-fb-xs-blue:hover {

	background: url('../images/social/social-sprite-xs-blue.png') 0px 0px;

}

.social-tw-xs-blue {

	background: url('../images/social/social-sprite-xs-blue.png') -32px -19px;

	width: 26px;

	height: 19px;

	display: inline-block;

	margin: 0px 20px 0px 0px;

}

.social-tw-xs-blue:hover {

	background: url('../images/social/social-sprite-xs-blue.png') -32px 0px;

}

.social-in-xs-blue {

	background: url('../images/social/social-sprite-xs-blue.png') -84px -19px;

	width: 19px;

	height: 19px;

	display: inline-block;

	margin: 0px 20px 0px 0px;

}

.social-in-xs-blue:hover {

	background: url('../images/social/social-sprite-xs-blue.png') -84px 0px;

}

.social-yt-xs-blue {

	background: url('../images/social/social-sprite-xs-blue.png') -119px -19px;

	width: 45px;

	height: 19px;

	display: inline-block;

	margin: 0px 0px 0px 0px;

}

.social-yt-xs-blue:hover {

	background: url('../images/social/social-sprite-xs-blue.png') -119px 0px;

}

.social-contact-xs-blue {

	background: url('../images/social/social-sprite-xs-blue.png') -184px -19px;

	width: 26px;

	height: 20px;

	display: inline-block;

	margin: 0px 20px 0px 0px;

}

.social-contact-xs-blue:hover {

	background: url('../images/social/social-sprite-xs-blue.png') -184px 1px;

}



.inline-header {font-family: Helvetica, Arial !important; font-size: 50px; line-height: 1.1em; margin-bottom: 10px; margin-right: 30px; color: #fff; }



.image-overlay{position: absolute; background: none !important; z-index: 300; height:100%; width:100%; opacity: 0; filter:alpha(opacity=0);}

.image-overlay .image-overlay-inside:before{content:normal !important; font-family: 'entypo-fontello'; font-size: 18px; font-weight: normal; }



.avia-instagram-feed { height: 385px !important; background-color: #e3e722 !important;}

.mb30 { margin-bottom: 60px !important; }



#locationContainer h4,

#classContainer h4,

#dayContainer h4 {

	font-weight: normal;

	font-family: Helvetica, Arial !important;

}



#selectLocation,

#selectClass,

#selectDay {

	width:auto;

}





#selectClass {

	float:right;

}



#selectDay {

	float:left;

}



#tblCalendar {

	word-wrap:break-word;

	table-layout: fixed;

	background: none !important;

	

}



#tblCalendar th {

	background-color:#000;

	color:#fff;

	text-align:center;

	text-transform:uppercase;

}



#tblCalendar td {

	text-align:center;

	padding:24px 12px;

}



#tblCalendar tr:nth-child(odd) {

	background-color:#00b9e2;

	color:#000;

}

#tblCalendar tr:nth-child(even) {

	background-color:#b7e5f5;

	color:#000;

}



#tblCalendar tr td.gym {

	font-weight:bold;

}



#tblCalendar tr:nth-child(odd) td.class {

	background-color:#ff8e6c;

	color:#000;

	font-weight:bold;

}

#tblCalendar tr:nth-child(even) td.class {

	background-color:#ffd4c7;

	color:#000;

	font-weight:bold;

}



#tblCalendar tr:nth-child(odd) td.book {

	background-color:#fd65c9;

	color:#fff;

}

#tblCalendar tr:nth-child(even) td.book {

	background-color:#fc96d8;

	color:#fff;

}



#tblCalendar tr td.book a {

	color:#fff;

	text-decoration:none;

}







@media 

only screen and (max-width: 480px),

(min-device-width: 480x) and (max-device-width: 767px)  {



	table#tblCalendar th {

		text-transform: capitalize;

		font-size:.4em;

	}

	

	table#tblCalendar th,

	table#tblCalendar td { 

		padding:3px;

		font-size:.6em;

		line-height: 1.5em;

	}

	

	.wmts_header { width: 100%; padding: 30px; background-color: #00b9e4; min-height: 500px;}

.wmts_header_content { float: none !important; width: 100% !Important; margin-bottom: 20px;}

.wmts_search { width: 100% !important; }



#TTFixedLink {display: none; }



}



@media 

only screen and (max-width: 760px),

(min-device-width: 768px) and (max-device-width: 1024px)  {



	table#tblCalendar th {

		text-transform: capitalize;

		font-size:.5em;

	}

	

	table#tblCalendar th,

	table#tblCalendar td { 

		padding:5px;

		font-size:.8em;

		line-height: 1.5em;

	}

	

.wmts_header { width: 100%; padding: 30px; background-color: #00b9e4; min-height: 500px;}

.wmts_header_content { float: none !important; width: 100% !Important;  margin-bottom: 20px;}

.wmts_search { width: 100% !important; }



#TTFixedLink {display: none; }



}













.customSelectBlue { 

	/* This is the default class that is used */

	/* Put whatever custom styles you want here */

	padding:0px 0px 0px 20px !important;

	height:55px !important;

	width:100% !important;

	font-size: 1.2em !important;

	background:#fff url("/wp-content/themes/flyefit/images/selectArrowBlue.png") 100% 50% no-repeat !important;

	background-size: contain !important;

	-moz-appearance: none !important;

	border: none  !important;

}

.customSelectBlue.customSelectHover {

	/* Styles for when the select box is hovered */

}

.customSelectBlue.customSelectOpen {

	/* Styles for when the select box is open */

}

.customSelectBlue.customSelectFocus {

	/* Styles for when the select box is in focus */

}

.customSelectBlueInner {

	/* You can style the inner box too */

	display:block!important;

	position: relative;

	width:auto!important;

	margin-right:120px;

	top: 50%;

	transform: translateY(-50%);

	padding-left:50px;

	font-size:150%;

	

}





.customSelectBlack { 

	/* This is the default class that is used */

	/* Put whatever custom styles you want here */

	padding:0px 0px 0px 20px !important;

	height:55px !important;

	width:100% !important;

	font-size: 1.2em !important;

	background:#fff url("/wp-content/themes/flyefit/images/selectArrowBlack.png") 100% 50% no-repeat !important;

	background-size: contain !important;

	-moz-appearance: none !important;

	border: none  !important;

}

.customSelectBlack.customSelectHover {

	/* Styles for when the select box is hovered */

}

.customSelectBlack.customSelectOpen {

	/* Styles for when the select box is open */

}

.customSelectBlack.customSelectFocus {

	/* Styles for when the select box is in focus */

}

.customSelectBlackInner {

	/* You can style the inner box too */

	display:block!important;

	position: relative;

	width:auto!important;

	margin-right:120px;

	top: 50%;

	transform: translateY(-50%);

	padding-left:50px;

	font-size:150%;

	

}









.customSelectGreen { 

	/* This is the default class that is used */

	/* Put whatever custom styles you want here */

	padding:0 85px 0 0;

	height:85px;

	width:400px;

	background:#fff url("/wp-content/themes/flyefit/images/selectArrowGreen.png") 100% 50% no-repeat;

	background-size: contain;

	-moz-appearance: none;

}

.customSelectGreen.customSelectHover {

	/* Styles for when the select box is hovered */

}

.customSelectGreen.customSelectOpen {

	/* Styles for when the select box is open */

}

.customSelectGreen.customSelectFocus {

	/* Styles for when the select box is in focus */

}

.customSelectGreenInner {

	/* You can style the inner box too */

	display:block!important;

	position: relative;

	width:auto!important;

	margin-right:85px;

	top: 50%;

	transform: translateY(-50%);

	padding-left:50px;

	font-size:150%;

}



/*

Desktop Styles

================================================== */

/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */



@media only screen and (min-width: 768px) {

  /* Add your Desktop Styles here */



}







/*

Mobile Styles

================================================== */

/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */



@media only screen and (max-width: 767px) {

  /* Add your Mobile Styles here */

	ul.timetable { display:inline-block;}
   ul.timetable li {display:inline-block;}

}