/* Reset CSS */

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, img, ins, kbd, q, s, samp, small, strike, tt, var, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed ,figure, figcaption, footer, header, hgroup,menu, nav, output, ruby, section, summary,time, mark, audio, video { margin: 0; padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline; outline: none; text-decoration: none; }
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
address, caption, cite, code, dfn, th, var, h1, h2, h3 { font-style:normal; font-weight:normal; }
body { line-height: 1.2; font-family: Georgia, Times, 'Times New Roman', serif; font-size: 14px; background: #ffffff; height: 100%; }
html { margin-top: 0 !important; height: 100%; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; }
ol, ul { list-style: none; }
caption, th { text-align: left; }
small { font-size: 75%; }
a img { border: none; }
a { cursor: pointer; color: #000000; text-decoration: underline; }
a:hover { text-decoration: none; }
img { display: inline-block; max-width: 100%; height: auto; vertical-align: top; }

.clear { height: 0px !important; width: 0px !important; clear: both !important; margin: 0 !important; padding: 0 !important; float: none !important; }
.centerdiv { margin: 0 auto; width: 100%; max-width: 1000px; }
.wrapper { overflow: hidden; background: #ffffff; }
.left { float: left; }
.right { float: right; }
.inline { display: inline-block;}


/* Begin CSS */

h1 {
	font-size: 52px;
	color: #79827d; 
	margin-bottom: 20px;
}

h1 i {
	color: #f48020; 
}
	
h2 {
	font-size: 30px; 
	color: #b4d234; 
	margin-bottom: 30px;
}

h3 {
	font-size: 28px;
	color: #bdc0bd; 
	margin-bottom: 20px;
}

h4 { 
	font-size: 25px; 
	color: #ffffff;
}

#bg-green {
	background: #b4d234; 
}

#bg-gray {
	background: #fcfcfc;
}

#bg-brown {
	background: #44453e;
}

#bg-orange {
	background: #f48020;
}

.overflow-right {
	position: absolute;
	width: 100%;
	height: 100%; 
	right: -100%;
	top: 0;
}

.header-green {
	position: relative;
	height: 23px; 
	background: #b4d234;
	margin-bottom: 10px; 
}

.header-logo-bg {
	position: relative;
	height: 160px; 
	background: url('../images/header-bg.jpg') no-repeat;
	background-size: cover; 
}

.header-logo-bg #logo {
	position: absolute;
	left: 5%;
	width: 140px;
	bottom: 30px;
}

.header-logo-bg #forward {
	position: absolute;
	right: 5%; 
	width: 110px; 
	bottom: 30px; 	
}

.intro {
	position: relative;
	padding: 0 5%;
	border-bottom: 1px solid #c6cbc8;
	margin-bottom: 30px;
}

.intro img {
	width: 31%; 
	height: auto;
	position: absolute;
	top: 0;
	right: 5%;
}

.intro p {
	font-size: 20px; 
	color: #79827d;
	line-height: 1.7;
	text-align: justify;
	margin-bottom: 30px; 
}

.intro-head {
	width: 70%;
	padding-top: 40px;
}

.services-container {
	position: relative;
	margin-bottom: 40px;
}

.services-left { 
	position: absolute;
	left: 0;
	top: 0;
	width: 1.3%;
	margin-right: 0.7%;
	height: 100%;
	background: #b4d234; 
}

.services-right { 
	float: right;
	width: 98%;
	padding: 30px 4%;
	color: #ffffff;
	background: #44453e; 
}

#last { 
	margin-right: 0;
}

.service { 
	position: relative;
	float: left; 
	width: 22%; 
	margin-right: 4%; 
	font-style: italic;
	line-height: 1.5;
}

.service:before {
	position: absolute;
	top: 4px;
	left: -12px;
	content: "";
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-left: 5px solid #f48020;
	border-bottom: 5px solid transparent;
}

.outro-container { 
	position: relative;
	margin-bottom: 40px; 
}

.outro-right {
	width: 35%; 
	height: 100%;
	position: absolute;
	right: 0;
	top: 20px; 
	background: url('../images/dots.png') no-repeat center center;
	background-size: contain;
}

.outro-left {
	width: 65%;
	float: left;
	padding: 0 5%; 
}

.outro-left div {
	width: 46%;
	font-size: 15px;
	line-height: 1.5; 
}

.outro-left .top {
	padding-bottom: 7px; 
	margin-bottom: 7px;
	border-bottom: 1px solid #c6cbc8;
}

.footer-container {
	position: relative;
}
	
.footer-left {
	position: absolute;
	top: 0;
	left: 0;
	width: 32.3%;
	height: 100%;
	margin-right: 0.7%;
	padding: 20px 15px 20px 5%;
	background: #44453e;
}

.footer-right {
	float: left;
	width: 67%;
	margin-left: 33%;
	padding: 30px 5px;
	color: #ffffff;
	line-height: 1.5;
	background: #f48020;
}

.footer-right > div {
	width: 38%;
	float: left;
	padding: 0 10px; 
	text-align: center;
}

.footer-right > div > span {
	display: inline-block;
	text-align: left;
}

.footer-right .phone b {
	margin-right: 10px;
}

.footer-right .left {
	border-right: 1px solid #ffffff;
}

.footer-right a {
	color: white;
}

#footer-logo {
	position: absolute;
	top: 20px;
	right: 2%;
	width: 10%;
}

#copy {
	font-size: 11px;
	text-align: right;
	color: #b6b7b6;
	padding: 15px 2%;
}

/*bio  section & page*/

.intro { border-bottom: none; margin-bottom: 0px; }
.bio-section { margin-bottom: 30px; position: relative; padding-right: 2% }
.bio-section h1 { color: #f48020; margin-bottom: 0px;  }
.bio-section h2 { color: #79827d; margin-bottom: 0px; }
.coach-name { padding: 30px 0px; padding-left: 5%; float:left; border-top: 1px solid #c6cbc8; border-bottom: 1px solid #c6cbc8; }
.bio-arrow { padding: 25px 0; padding-left: 5%; float: left; border-top: 1px solid #c6cbc8; border-bottom: 1px solid #c6cbc8; }
.view-bio { background-color: #44453e; margin-left: 5%; float: right; height: 100%; width: 18.9%; }
.view-bio a {  display: inline-block; width: 100%; text-align: center; padding: 31px 0; font-size: 52px; text-decoration: none; color: #ffffff; cursor: pointer; }
.view-bio a span { font-size: 30px; display: block; }
.bio-right { position: absolute; right: 0px; top: 0px; width: 1.3%; margin-left: 0.7%; height: 100%; background: #f58220 none repeat scroll 0% 0%; }

.coach-bio { padding: 0 5%; padding-top: 50px; margin-bottom: 30px; }
.coach-bio h1 { margin-bottom: 10px;  }
.coach-photo { float: left; margin-right: 30px; margin-bottom: 30px; }
.coach-bio > p { font-size: 20px; color: #79827d; margin-bottom: 15px; text-align:justify; }
.button-container { padding: 0 5%; text-align: right; }
.return-btn { background-color: #44453e; margin-bottom: 50px; display: inline-block; text-align: right }
.return-btn a { color: #ffffff; text-decoration: none; padding: 10px 30px; display: inline-block; font-size: 20px; }



@media only screen and (max-width: 1023px) {
	h1 { font-size: 50px; }
	h2 { font-size: 28px; }
	.centerdiv { padding: 0 20px; }
	
	.bio-section h1 { font-size: 45px;  }
    .bio-section h2 { font-size: 23px; }
	.bio-arrow > img { max-width: 85%; }
	.view-bio { width: 18.6%; }
	.view-bio a { font-size: 45px; padding: 26px 0; }
}

@media only screen and (max-width: 959px) {
	.intro-head { width: 100%; }
	.outro-left .left { width: 42%; }
	.outro-left .right { width: 50%; }
	.footer-right .phone b { display: none; }
	#footer-logo { top: 40%; right: 0; width: 15%; }
	
	.bio-section h1 { font-size: 35px;  }
    .bio-section h2 { font-size: 20px; }
	.bio-arrow { padding: 22px 0; padding-left: 5%;  }
	.bio-arrow > img { max-width: 76%; }
	.view-bio { width: 16.9%; margin-left: 0; }
	.view-bio a { font-size: 35px; padding: 31px 0; }
	.view-bio a > span { font-size: 20px; }
    .coach-bio h1 { font-size: 42px; }
	.coach-bio h2 { font-size: 27px; }
}

@media only screen and (max-width: 767px) {
	h1 { font-size: 42px; }
	h1 i { font-size: 40px; }
	h2 { font-size: 27px; }
	h3 { font-size: 26px; }
	h4 { font-size: 22px; }
	.centerdiv { padding: 0 10px; }
	.intro img { right: 0; width: 40%; }
	.intro h1 span { display: block; }
	.intro p { font-size: 18px; }
	#last { margin-bottom: 0; }
	.service { float: none; width: 100%; margin-right: 0; margin-bottom: 20px; font-size: 15px; }
	.outro-left { float: none; width: 100%; margin-bottom: 40px; }
	.outro-right { position: static; width: 100%; height: 100px; }
	.footer-left { position: static; width: 99%; margin-right: 1%; margin-bottom: 5px; padding: 20px 15px; text-align: center; }
	.footer-right { float: none; width: 100%; margin-left: 0; }
	.footer-right > div { width: 42%; } 
	#footer-logo { top: 68%; right: 10px; width: 90px; }
	
	.bio-section h1 { font-size: 29px;  }
    .bio-section h2 { font-size: 20px; }
	.bio-arrow { display: none; }
	.view-bio { width: 25% }
	.coach-name { width: 68%; }
	.view-bio a { font-size: 29px; padding: 31px 0 }
	.view-bio a > span { font-size: 20px;  }
	.coach-photo { float: none; }

}

@media only screen and (max-width: 459px) {
	h1 { font-size: 34px; }
	h1 i { font-size: 30px; line-height: 44px; }
	h2, h3 { font-size: 24px; }	
	.header-logo-bg #forward { width: 100px; }
	.header-logo-bg #logo { width: 130px; }
	.intro-head { padding-top: 30px; }
	.intro p { font-size: 16px; text-align: left; margin-bottom: 20px; }
	.services-left { width: 2%; margin-right: 2%; }
	.services-right { width: 96%; padding: 30px 2% 30px 6%; }
	.service:before { left: -11px; }
	.outro-left { margin-bottom: 30px; }
	.outro-left .left, .outro-left .right { float: none; width: 100%; }
	.outro-left .left { padding-bottom: 7px; margin-bottom: 7px; border-bottom: 1px solid #c6cbc8; }
	.footer-right { padding: 20px 0 100px 0; }
	.footer-right > div { float: none; width: 100%; }
	.footer-right > div > span { text-align: center; }
	.footer-right .phone b { display: inline-block; }
	.footer-right .left { border-right: none; border-bottom: none; margin-bottom: 10px; }
	#footer-logo { top: 240px; width: 100px; margin-left: auto; margin-right: auto; left: 0; right: 0; }
	
	.bio-section h1 { font-size: 28px;  }
    .bio-section h2 { font-size: 20px; }
	.bio-section { padding-right: 4%; }
	.bio-right { width: 2%; margin-left: 2%; }
	.coach-name { width: 100%; float: none; padding: 20px 0px; padding-left: 5%; }
	.view-bio { width: 100%; float: none; margin-left: 0px; }
	.view-bio a { font-size: 24px; padding: 10px 0; }
	.view-bio a > span { font-size: 24px; display: inline-block; }
	.coach-bio h1 { font-size: 29px; }
	.coach-bio h2 { font-size: 20px; }
	.coach-bio p { font-size: 16px; }
}