/* 	--------------------------------------------------
    uSkinned.net

	PHASE 3
    -------------------------------------------------- */


/* 	--------------------------------------------------
	TABLE OF CONTENTS
    --------------------------------------------------

	1.0 REFER A FRIEND
	2.0 CLASSES
	3.0 TABBED
	4.0 MY CLASSES

*/

/*

	BOOTSTRAP BREAKPOINTS

	.col-xs-	< 768px		(container width 100%)
	.col-sm-	> 768px		(container width 750px)
	.col-md-	> 992px		(container width 970px)
	.col-lg-	> 1200px	(container width 1170px)

*/



/*	----------------------------------------------------------------------------------------------------
	1.0 REFER A FRIEND
	---------------------------------------------------------------------------------------------------- */

	.refer-a-friend {
		position:relative;
		margin-bottom:40px;
		}

	.content-area.refer-a-friend {
		}

	.form.refer-a-friend {
		}

	.form.refer-a-friend .remove_field.btn:hover {
		border-color:#000000;
		}

	.form.refer-a-friend .add-friend,
	.form.refer-a-friend .remove_field {
		position:absolute;
		margin:0 0 20px;
		}
	.form.refer-a-friend .add-friend i {
		margin-right:8px;
		}
	.form.refer-a-friend .add-friend span,
	.form.refer-a-friend .remove_field span {
		font-size:12px;
		}

	.form.refer-a-friend .another-friend {
		margin-top:20px;
		}
	.form.refer-a-friend .another-friend p.heading {
		margin:0 0 10px;
		font-size:15px;
		}

	.box.refer-a-friend {
		margin:0;
		}
	.box.refer-a-friend p.btn {
		font-size:25px;
		font-weight:900;
		letter-spacing:0.2em;
		}


	@media (min-width:0) and (max-width:991px) {

	#referFriendSendWrapper,
	#referFriendSendMore {
		margin-top:90px;
		}

	.form.refer-a-friend .add-friend,
	.form.refer-a-friend .remove_field {
		bottom:90px;
		margin:0;
		}
	.form.refer-a-friend .add-friend .btn {
		margin:0;
		}

	.form.refer-a-friend .add-friend {
		right:0;
		}
	.form.refer-a-friend .remove_field {
		left:0;
		}

	}

	@media (min-width:768px) {

	}

	@media (min-width:992px) {

	.refer-a-friend {
		margin-bottom:40px;
		}

	.form.refer-a-friend .add-friend,
	.form.refer-a-friend .remove_field {
		position:absolute; bottom:75px;
		margin:0;
		}
	.form.refer-a-friend .add-friend {
		right:-60px;
		}
	.form.refer-a-friend .remove_field {
		left:-60px;
		}

	.form.refer-a-friend .add-friend .btn {
		position:relative;
		}
	.form.refer-a-friend .add-friend .btn span {
		position:absolute; top:0; bottom:0; left:45px; z-index:-1;
		display:block;
		padding:11px 15px;
		background:#000;
		color:#fff;

		-webkit-opacity:0;
		-moz-opacity:0;
		-ms-opacity:0;
		-o-opacity:0;
		opacity:0;

		-webkit-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		-moz-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		-ms-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		-o-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		}
	.form.refer-a-friend .add-friend .btn:hover span {
		z-index:5;

		-webkit-opacity:1;
		-moz-opacity:1;
		-ms-opacity:1;
		-o-opacity:1;
		opacity:1;

		-webkit-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0s;
		-moz-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0s;
		-ms-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0s;
		-o-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0s;
		transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0s;
		}

	.form.refer-a-friend .add-friend .btn span::before {
		content:"";
		position:absolute; right:98%; top:50%;
		width:0; height:0;
		border:solid transparent; border-color:rgba(0,0,0,0); border-right-color:#000;
		border-width:10px;
		margin-top:-10px;
		pointer-events:none;
		}

	.form.refer-a-friend .add-friend i,
	.form.refer-a-friend .remove_field i {
		letter-spacing:-0.05em;
		font-size:15px;
		margin:0;
		}

	.box.refer-a-friend p.btn {
		font-size:30px;
		}

	}

	@media (min-width:1200px) {

	.refer-a-friend {
		margin-bottom:60px;
		}

	}


/*	----------------------------------------------------------------------------------------------------
	2.0 CLASSES
	---------------------------------------------------------------------------------------------------- */

	.apc.class-timetable .classes {

		}
	.apc.class-timetable .classes .item {
		position:relative;
		}
	.apc.class-timetable .classes .item .gymClassBookingInfo {
		position:relative;
		}

	.apc.class-timetable .classes .item .gymClassBookingInfo i {
		-webkit-opacity:0.7;
		-moz-opacity:0.7;
		-ms-opacity:0.7;
		-o-opacity:0.7;
		opacity:0.7;
		}
	.apc.class-timetable .classes .item .gymClassBookingInfo .tooltip-content {
		letter-spacing:-0.03em;
		font-size:13px;
		}


	@media (min-width:0) and (max-width:991px) {

	.apc.class-timetable .classes .item .gymClassBookingInfo {
		padding-top:15px; padding-bottom:10px; padding-left:22px;
		vertical-align:middle;
		}
	.apc.class-timetable .classes .item .gymClassBookingInfo i {
		position:absolute; top:5px; left:0;
		font-size:20px;
		}
	.apc.class-timetable .classes .item .gymClassBookingInfo .tooltip-content {
		position:relative; display:none;
		}

	}

	@media (min-width:992px) {

	.apc.class-timetable .classes dl {
		height:100%;
		}
	.apc.class-timetable .classes .item {
		}

	.apc.class-timetable .classes .item dd .time,
	.apc.class-timetable .classes .item dd .instructor,
	.apc.class-timetable .classes .item dd .location,
	.apc.class-timetable .classes .item dd .status {
		position:relative; z-index:3;
		width:21%;
		}
	.apc.class-timetable .classes .item dd .status {
		position:relative; z-index:3;
		width:30%;
		}

	.apc.class-timetable.small .classes .item dd .time,
	.apc.class-timetable.small .classes .item dd .status {
		position:relative; z-index:3;
		width:35%;
		}
	.apc.class-timetable.small .classes .item dd .status {
		position:relative; z-index:3;
		width:55%;
		}

	.apc.class-timetable .classes .item .gymClassBookingInfo {
		display:inline-block;
		float:right;
		width:24px;
		padding-top:8px;
		}
	.apc.class-timetable .classes .item .gymClassBookingInfo .tooltip-wrap {
		position:relative;
		width:24px; height:24px;
		cursor:pointer;
		}

	.apc.class-timetable .classes .item .gymClassBookingInfo i {
		font-size:25px;
		}
	html.no-touch .apc.class-timetable .classes .item .gymClassBookingInfo i {

		-webkit-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		-moz-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		-ms-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		-o-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		}
	html.no-touch .apc.class-timetable .classes .item .gymClassBookingInfo .tooltip-wrap:hover i {
		-webkit-opacity:1;
		-moz-opacity:1;
		-ms-opacity:1;
		-o-opacity:1;
		opacity:1;
		}

	.apc.class-timetable .classes .item .gymClassBookingInfo .tooltip-content {
		position:absolute; right:26px; z-index:-1;
		display:block;
		padding:5px 10px 7px;
		background:#000;
		color:#fff;
		text-align:center;

		-webkit-opacity:0;
		-moz-opacity:0;
		-ms-opacity:0;
		-o-opacity:0;
		opacity:0;

		-webkit-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		-moz-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		-ms-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		-o-transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		transition:opacity 0.2s ease-in-out 0s, z-index 0s ease-in-out 0.2s;
		}



	.apc.class-timetable .classes .item .gymClassBookingInfo .tooltip-content::before {
		content:"";
		position:absolute; top:45%; left:100%;
		width:0; height:0;
		border:solid transparent; border-color:rgba(0,0,0,0); border-left-color:#000;
		border-width: 4px;
		margin-bottom: -4px;
		pointer-events: none;
		}


	.apc.class-timetable .classes .item.booked-waitinglist .gymClassBookingInfo .tooltip-content {
		top:-8px;
		min-width:300px;
		}
	.apc.class-timetable .classes .item.booked .gymClassBookingInfo .tooltip-content {
		top:0;
		min-width:240px;
		}
	.apc.class-timetable .classes .item.full .gymClassBookingInfo .tooltip-content {
		top:0;
		min-width:200px;
		}
	.apc.class-timetable .classes .item.available .gymClassBookingInfo .tooltip-content {
		top:0;
		min-width:210px;
		}
	.apc.class-timetable .classes .item.waitinglist-available .gymClassBookingInfo .tooltip-content {
		top:-8px;
		min-width:300px;
		}
	.apc.class-timetable .classes .item.notavailable .gymClassBookingInfo .tooltip-content {
		top:0;
		min-width:260px;
		}

	}

	@media (min-width:1200px) {

	.apc.class-timetable.small .classes .item dd .time,
	.apc.class-timetable.small .classes .item dd .status {
		position:relative; z-index:3;
		width:45%;
		}

	}



/*	----------------------------------------------------------------------------------------------------
	MY CLASSES
	---------------------------------------------------------------------------------------------------- */

	.apc.class-timetable.my-classes.tabbed {
		padding-bottom:0;
		}

	.apc.class-timetable .classes dl {
		border-width:1px 0 0!important;
		border-style:solid!important; border-color:rgba(0,0,0,0.2)!important;
		}
	.apc.class-timetable .classes .item {
		border-width:0 0 1px!important;
		border-style:solid!important; border-color:rgba(0,0,0,0.2)!important;
		}

	.apc.class-timetable.my-classes.tabbed {
		}
	.apc.class-timetable.my-classes.tabbed .nav {
		position:relative; z-index:1;
		font-size:0;
		padding:0 0 40px;
		}
	.apc.class-timetable.my-classes.tabbed .nav li {
		font-size:13px;
		text-transform:uppercase; letter-spacing:1px;
		display:inline-block;
		border-width:1px 1px 1px 0; border-style:solid;
		min-width:14.28%;
		margin-bottom:0;
		}
	.apc.class-timetable.my-classes.tabbed .nav li {
		margin:5px;
		border-width:1px;
		}
	.apc.class-timetable.my-classes.tabbed .nav li:first-child {
		border-left-width:1px;
		}
	.apc.class-timetable.my-classes.tabbed .nav li a {
		display:block;
		padding:10px 15px;
		border-width:0 0 1px; border-style:solid;
		}
	.apc.class-timetable.my-classes.tabbed .nav li.active a {
		}

	.apc.class-timetable.my-classes.tabbed .tab-content {
		padding:0;
		border:0 none;
		}

	@media (min-width:992px) {

	.apc.class-timetable.my-classes.tabbed .nav li {
		margin:0;
		border-width:1px 1px 1px 0;
		}
	.apc.class-timetable.my-classes.tabbed .nav li:first-child {
		border-left-width:1px;
		}

	}

	.apc.class-timetable.my-classes.tabbed .nav li.active a, .tabbed .nav li a:hover {
		background-color:#ffffff; background-color:rgba(255,255,255,1);
		}
	.apc.class-timetable.my-classes.tabbed .nav li a {
		background-color:#F1F1F1; background-color:rgba(241,241,241,1);
		}
	.apc.class-timetable.my-classes.tabbed .nav li.active, .tabbed .nav li.active a {
		border-bottom-color:#97d700; border-bottom-color:rgba(255,0,0,1);
		}
	.spc.tabbed .tab-content {
		border-color:rgba(0,0,0,0.2);
		}
	.apc.class-timetable.my-classes.tabbed .nav li {
		border-color:rgba(51,51,51,0.2);
		}
	.apc.class-timetable.my-classes.tabbed .nav li a {
		border-color:#F1F1F1; border-color:rgba(241,241,241,1);
		}




/*	----------------------------------------------------------------------------------------------------
	END
	---------------------------------------------------------------------------------------------------- */