/*
Theme Name: Faye Duncan Yoga
Author: Crisp Design
Author URI: http://www.crisp-design.co.uk
Description: Responsive WordPress Theme for Faye Duncan Yoga
Version: 1.0
*/

/* Webfonts
------------------------------------------- */

@font-face {
    font-family: 'Bariol';
    src: url('webfonts/bariol_regular-webfont.eot');
    src: url('webfonts/bariol_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('webfonts/bariol_regular-webfont.woff') format('woff'),
         url('webfonts/bariol_regular-webfont.ttf') format('truetype'),
         url('webfonts/bariol_regular-webfont.svg#bariol_regularregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Bariol-Light';
    src: url('webfonts/bariol_light_italic-webfont.eot');
    src: url('webfonts/bariol_light_italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('webfonts/bariol_light_italic-webfont.woff') format('woff'),
         url('webfonts/bariol_light_italic-webfont.ttf') format('truetype'),
         url('webfonts/bariol_light_italic-webfont.svg#bariollight_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Bariol-Bold';
    src: url('webfonts/bariol_bold-webfont.woff2') format('woff2'),
         url('webfonts/bariol_bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* Basic Styles
------------------------------------------- */

	body {
		background-color: #FFFFFF;
		font-family: "Bariol", Helvetica, Arial, Sans-serif;
		font-size: 16px;
		line-height: 24px;
		color: #5A5A5A;
	}

/* Typography
------------------------------------------- */

	h1, h2, h3, h4, h5, h6 {
		font-weight: normal;
		color: #28B7CC;
		margin: 0 0 12px; }
	h1 { font-size: 32px; line-height: 44px; }
	h2 { font-size: 22px; line-height: 33px; }
	h3 { font-size: 22px; line-height: 26px; }
	h4 { font-size: 20px; line-height: 24px; }
	h5 { font-size: 16px; line-height: 20px; }
	h6 { font-size: 14px; line-height: 18px; }
	
	p { margin: 0 0 12px; }
	p img { margin: 0; }

	em { font-style: italic; }
	strong { font-family: "Bariol-Bold", Helvetica, Arial, Sans-serif; font-weight: normal; }
	small { font-size: 80%; }

/*	Blockquotes  */
	blockquote, blockquote p { line-height: 22px; color: #555555; }
	blockquote { margin: 0 0 25px; padding: 0; }
	blockquote:last-child { margin: 0; }
	blockquote p:last-child { margin: 0; }
	blockquote cite { display: block; font-size: 14px; color: #555; }
	blockquote cite:before { content: "\2014 \0020"; }
	blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; }
	
	blockquote span.name { display: block; font-weight: 600; }

/*	Horizontal Line  */
	hr { border: solid #8797A7; border-width: 2px 0 0; clear: both; margin: 15px 0; height: 0; }

/* Links
------------------------------------------- */

	a { color: #5A5A5A; text-decoration: underline; outline: 0; -o-transition: all 0.4s ease-out 0s; -webkit-transition: all 0.4s ease-out 0s; -moz-transition: all 0.4s ease-out 0s; }
	a:hover { color: #444444; }
	
	a.btn {
		display: inline-block;
		background-color: #454545;
		color: #FFFFFF;
		font-size: 22px;
		padding: 7px 50px 10px;
		text-decoration: none;
	}

/* Lists
------------------------------------------- */

	ul {
		list-style: disc;
		padding: 0 0 0 25px;
	}
	
	ul li, ol li {
		margin: 0 0 15px;
	}

/* Images
------------------------------------------- */

	img {
		max-width: 100%;
		height: auto;
	}

	img.alignleft {
		float: left;
		margin: 0 20px 10px 0;
	}
	
	img.alignright {
		float: right;
		margin: 0 0 10px 20px;
	}

/* Forms
------------------------------------------- */
	
	input, textarea, select {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		border-radius: 0;
	}
	
	form label {
		margin: 0 0 5px !important;
	}

	form input, form textarea, form select {
		font-family: "Bariol", Helvetica, Arial, Sans-serif;
		box-shadow: none !important;
	}
	
	form .frm_submit input {
		background-color: #28B7CC;
		border: none;
		color: #FFFFFF;
		font-size: 16px;
		padding: 8px 15px 9px;
	}
	
	form .frm_submit .frm_ajax_loading {
		float: right;
		margin: 12px 0 0;
	}

/* Table
------------------------------------------- */

	table {
		margin: 0 0 20px;
	}

	table tr td {
		border-bottom: 1px solid #DDDDDD;
		padding: 10px;
	}

/* Cookie Consent
------------------------------------------- */

	#cookie-law {
	    background-color: #87CEDC;
		padding: 10px 0;
		width: 100%;
	}

	#cookie-law p {
	    font-size: 16px;
	    color: #FFFFFF;
		margin: 0;
	}

	#cookie-law p a {
		color: #FFFFFF;
	}

	#cookie-law p a.close-cookie-banner {
		background: url('images/close.png') no-repeat;
		background-size: 20px 20px;
		float: right;
		width: 20px;
		height: 20px;
		display: block;
		text-indent: -9999px;
		margin: 1px 0 0;
	}

/* Header
------------------------------------------- */
	
	header .header {
		padding: 30px 0 15px;
	}
	
	header .logo {
		background: url('images/logo.svg') no-repeat;
		background-size: 430px auto;
		width: 430px;
		height: 62px;
		margin-left: 35px;
	}
	
	header .logo a {
		display: block;
		text-indent: -9999px;
		width: 100%;
		height: 100%;
	}
	
	header h1 {
		font-style: italic;
		text-align: right;
		font-size: 18px;
		line-height: 24px;
		padding-left: 65px;
		margin: 0;
		color: #5A5A5A;
	}
	
	header a.mobile_menu {
		display: none;
	}
	
	header nav ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	
	header nav ul li {
		font-size: 20px;
		float: left;
		margin: 0;
		position: relative;
	}
	
	header nav ul li#menu-item-175,
	header nav ul li#menu-item-176 {
		display: none;
	}
	
	header nav ul li a {
		text-decoration: none;
		display: block;
		padding: 12px 20px;
	}
	
	header nav ul li a:hover,
	header nav ul li.current-menu-item a,
	header nav ul li.current_page_parent > a {
		color: #111111;
	}
	
	header nav ul li ul {
		background-color: #FFFFFF;
		position: absolute;
		top: 100%;
		left: 0;
		display: none;
		z-index: 999;
		width: 245px;
		border-top: 2px solid #ECECEC;
	}
	
	header nav ul li ul li {
		float: none;
		border-bottom: 1px solid #ECECEC;
	}
	
	header nav ul li ul li:last-child {
		border: none;
	}

/* Footer
------------------------------------------- */
	
	#grid {
		background-color: #FFF4C8;
		padding: 30px 0 0;
	}
	
	#grid .container.inner {
		padding: 60px 0 35px;
	}
	
	#grid ul {
		list-style: none;
		margin: 0 auto;
		padding: 0;
		width: 480px;
	}
	
	#grid ul li {
		background: url('images/grid/approach.jpg') no-repeat;
		background-size: 190px auto !important;
		width: 190px;
		height: 190px;
		margin: 0 25px 50px;
		float: left;
		position: relative;
		text-align: center;
	}
	
	#grid ul li.what_to_expect {
		background: url('images/grid/what_to_expect.jpg') no-repeat;
	}
	
	#grid ul li.why_one_to_one {
		background: url('images/grid/why_one_to_one.jpg') no-repeat;
	}
	
	#grid ul li.classes {
		background: url('images/grid/classes.jpg') no-repeat;
	}
	
	#grid ul li a {
		display: block;
		width: 100%;
		height: 100%;
		text-decoration: none;
	}
	
	#grid ul li div {
		background: rgba(255, 255, 255, 0.7);
		font-size: 20px;
		position: absolute;
		top: 70px;
		padding: 15px 0;
		width: 140px;
		left: 50%;
		margin-left: -70px;
	}
	
	#case_study {
		background-color: #87CEDC;
		text-align: center;
	}
	
	#case_study h2 {
		color: #454545;
		font-size: 32px;
		line-height: 44px;
	}
	
	#case_study p {
		color: #454545;
		font-size: 18px;
		line-height: 26px;
		padding: 0 40px;
		margin-bottom: 40px;
	}
	
	footer {
		padding: 50px 0 30px;
	}
	
	footer ul.affiliations {
		list-style: none;
		margin: 0;
		padding: 0;
		text-align: center;
	}
	
	footer ul.affiliations li {
		display: inline-block;
		text-indent: -9999px;
		background: url('images/affiliations/ryt.jpg') center no-repeat;
		background-size: 105px auto;
		margin: 0 40px;
		width: 130px;
		height: 115px;
	}
	
	footer ul.affiliations li.british_wheel {
		background: url('images/affiliations/british-wheel.jpeg') center no-repeat;
		background-size: 70px auto;
	}
	
	footer ul.affiliations li.healthcare_council {
		background: url('images/affiliations/cnhc.jpg') center no-repeat;
		background-size: 130px auto;
	}
	
	footer a.back_top {
		background: url('images/back_top.svg') no-repeat;
		background-size: 58px auto;
		display: block;
		width: 58px;
		height: 58px;
		text-indent: -9999px;
		margin: 40px auto;
	}
	
	footer .sixteen.columns {
		border-bottom: 4px solid #ECECEC;
	}
	
	footer .credits {
		padding-top: 20px;
	}
	
	footer .credits p {
		margin: 0;
	}
	
	footer .credits p.site_by {
		text-align: right;
	}
	
	footer .credits p span {
		color: #28B7CC;
		margin: 0 10px;
	}
	
	footer .credits p a {
		text-decoration: none;
	}
	
/* Page
------------------------------------------- */	
	
	.container.inner {
		padding: 60px 0;
	}
	
	#wrapper {
		background: #ECECEC url('images/page_bg.jpg') center bottom no-repeat;
		background-size: 100% auto;
		padding-bottom: 90px;
	}
	
	#wrapper.blog {
		background: #ECECEC url('images/blog_bg.jpg') center bottom no-repeat;
		background-size: 100% auto;
		padding-bottom: 0;
	}
	
	#wrapper .header {
		height: 380px;
	}
	
	@media(min-width: 1600px) {
		
		#wrapper .header {
			background-size: 100% auto !important;
		}
		
	}
	
	#content {
		background: #FFFFFF;
		background: -moz-linear-gradient(top, rgba(255,255,255,0.75) 0%, rgba(255,255,255,1) 180px); /* FF3.6-15 */
		background: -webkit-linear-gradient(top, rgba(255,255,255,0.75) 0%,rgba(255,255,255,1) 180px); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, rgba(255,255,255,0.75) 0%,rgba(255,255,255,1) 180px); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */
		padding: 40px 50px;
		width: 520px;
		margin: -250px auto 0;
	}
	
	#content h1 {
		margin-bottom: 30px;
	}
	
	#content h2 {
		margin: 30px 0;
	}
	
	#content a {
		text-decoration: none;
		border-bottom: 1px solid #28B7CC;
	}
	
	.testimonial {
		background: rgba(255, 255, 255, 0.4);
		width: 330px;
		padding: 20px 10px;
		text-align: center;
		margin: 80px auto 60px;
	}
	
	.testimonial h2 {
		font-size: 32px;
		line-height: 44px;
		color: #454545;
	}
	
	.testimonial p {
		font-family: "Bariol-Light", Helvetica, Arial, Sans-serif;
		font-size: 32px;
		line-height: 44px;
		margin: 0;
	}
	
	a.btn.testimonials {
		margin: 0 auto;
		width: 220px;
		padding: 7px 0 10px;
		display: block;
		text-align: center;
	}
	
/* Home
------------------------------------------- */
	
	#introduction {
		background: url('images/introduction.jpg') center top no-repeat;
		background-size: 100% auto;
	}
	
	#introduction .quote {
		padding: 40px 0 100px;
		text-align: center;
	}
	
	#introduction .quote h3 {
		font-family: "Bariol-Light", Helvetica, Arial, Sans-serif;
		font-size: 32px;
		line-height: 44px;
		padding: 0 70px;
		color: #454545;
	}
	
	#introduction .about {
		background: rgba(255, 244, 200, 0.6);
		padding: 40px 0;
		text-align: center;
	}
	
	#introduction .about img {
		max-width: 80px;
		margin: -105px auto 20px;
		border: 5px solid #FFFFFF;
	}
	
	#introduction .about h2,
	#why_one_one h2,
	#testimonials h2 {
		font-size: 32px;
		line-height: 44px;
		color: #454545;
	}
	
	#introduction .about p,
	#why_one_one p,
	#testimonials p {
		font-size: 18px;
		line-height: 27px;
		color: #454545;
		padding: 0 80px;
	}
	
	#why_one_one {
		background-color: #8A8A8A;
	}
	
	#why_one_one .image {
		background: url('images/why_one_to_one.jpg') center no-repeat;
		background-size: auto 100%;
		width: 460px;
		height: 376px;
	}
	
	#why_one_one .content {
		padding: 40px 0;
	}
	
	#why_one_one h2,
	#why_one_one p {
		text-align: center;
		color: #FFFFFF;
	}
	
	#why_one_one p {
		padding: 0 30px;
	}
	
	#testimonials {
		background: #EEEEEE url('images/stone_bg.jpg') top center no-repeat;
		background-size: 100% auto;
		padding: 40px 0;
		text-align: center;
	}
	
	#testimonials h2.kind_words {
		margin: 40px 0 12px;
	}
	
	#testimonials ul {
		width: 780px;
		margin: 0 auto;
		list-style: none;
		padding: 0;
	}
	
	#testimonials ul li {
		width: 40%;
		display: inline-block;
		margin: 0 2.5% 40px;
		vertical-align: top;
	}
	
	#testimonials ul li div {
		font-family: "Bariol-Light", Helvetica, Arial, Sans-serif;
		background: rgba(255, 255, 255, 0.6);
		padding: 20px 10px;
		font-size: 32px;
		line-height: 44px;
	}


/* Misc. Pages
------------------------------------------- */
	
	#content article {
		border-bottom: 2px solid #ECECEC;
		padding-bottom: 20px;
		margin-bottom: 20px;
	}

	#content article:last-child {
		border: none;
		padding: 0;
		margin: 0;
	}

	#content article h2 {
		margin: 0 0 7px;
	}

	#content article h2 a {
		text-decoration: none;
		color: #28B7CC;
		border: none;
	}
	
	#bio {
		background: rgba(40, 183, 204, 0.3);
	}
	
	#bio .bio {
		border-top: 4px solid #FFFFFF;
		border-bottom: 4px solid #FFFFFF;
		max-width: 400px;
		margin: 0 auto;
		padding: 30px 0 30px 110px;
		background: url('images/faye-duncan.png') left top 30px no-repeat;
		background-size: 80px auto;
	}
	
	#bio .bio h2,
	#bio .bio p {
		color: #454545;
	}
	
	#bio .bio p {
		margin: 0;
	}
	
	form.post-password-form {
		background-color: #F9F9F9;
		padding: 20px;
		margin-top: 30px;
	}
	
	form.post-password-form p:last-child {
		margin: 0;
	}
	
	form.post-password-form label {
		font-family: "Bariol-Bold", Helvetica, Arial, Sans-serif;
	}
	
	form.post-password-form input {
		border: 1px solid #DDDDDD;
		padding: 6px;
		margin-left: 10px;
	}
	
	form.post-password-form input[type="submit"] {
		background-color: #28B7CC;
		border-color: #28B7CC;
		color: #FFFFFF;
		padding: 6px 10px;
		margin-left: 5px;
	}
	
	ul.audio {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	
	ul.audio li {
		border-bottom: 2px solid #ECECEC;
		padding-bottom: 20px;
		margin-bottom: 20px;
	}
	
	ul.audio li:last-child {
		border: none;
		padding: 0;
		margin: 0;
	}

	ul.audio li audio {
		width: 100%;
	}
	
	.contact {
		width: 40%;
		float: left;
		margin: 0 0 40px;
	}
	
	.profile {
		float: right;
		width: 40%;
	}
	
	.contact p {
		font-size: 24px;
		color: #28B7CC;
		margin: 0 0 25px;
	}
	
	.contact ul.social {
		list-style: none;
		margin: 0 0 40px;
		padding: 0;
		height: 35px;
	}
	
	.contact ul.social li {
		background: url('images/social.svg') no-repeat;
		background-size: 140px 35px;
		width: 35px;
		height: 35px;
		margin: 0 8px 0 0;
		float: left;
	}
	
	.contact ul.social li.twitter {
		background-position: -35px 0;
	}
	
	.contact ul.social li.facebook {
		background-position: -70px 0;
	}
	
	.contact ul.social li.instagram {
		background-position: -105px 0;
	}
	
	.contact ul.social li a {
		display: block;
		width: 100%;
		height: 100%;
		border: none !important;
	}
	
	.contact ul.downloads {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	
	.contact ul.downloads li {
		margin-bottom: 10px;
	}
	
	.contact ul.downloads li a {
		background-color: #28B7CC;
		border: none !important;
		display: block;
		padding: 7px 0;
		text-align: center;
		color: #FFFFFF;
	}
	
	.profile img {
		max-width: 140px;
		float: right;
	}

/* Tablet
------------------------------------------- */
	
@media only screen and (min-width: 768px) and (max-width: 959px) {
	
	header .logo {
		margin-left: 25px;
	}
	
	header h1 {
		padding-left: 30px;
	}
	
	header nav ul li a {
		padding: 12px 9px;
	}
	
	#introduction .quote h3 {
		padding: 0 50px;
	}
	
	#introduction .about p {
		padding: 0 60px;
	}
	
	#why_one_one .image {
		width: 364px;
	}
	
	#why_one_one .content {
		padding: 20px 0;
	}
	
	#why_one_one p {
		padding: 0 10px;
	}
	
	#testimonials {
		background-color: #EEEEEE;
		background-position: bottom center;
	}
	
	#testimonials p {
		padding: 0 40px;
	}
	
	#testimonials ul {
		width: 720px;
	}
	
	#wrapper .header {
		height: 280px;
	}
	
	#content {
		margin: -190px auto 0;
	}
	
}

/* Mobile (Fluid)
------------------------------------------- */

@media only screen and (max-width: 767px) {
	
	header .logo {
		background-size: 260px auto;
		width: 260px;
		height: 37px;
		margin: 0 auto 10px;
	}
	
	header h1 {
		text-align: center;
		padding: 0;
	}
	
	header .header {
		padding: 30px 0 10px;
	}
	
	header a.mobile_menu {
		display: block;
		color: #28B7CC;
		font-size: 20px;
		padding: 0 0 20px;
		text-align: center;
		text-decoration: none;
	}
	
	header nav {
		display: none;
	}
	
	header nav ul {
		border-top: 2px solid #ECECEC;
	}
	
	header nav ul li {
		float: none;
	}
	
	header nav ul li#menu-item-175,
	header nav ul li#menu-item-176 {
		display: block;
	}
	
	header nav ul li ul {
		position: static;
		width: 100%;
		border-bottom: 2px solid #ECECEC;
	}
	
	header nav ul li ul li {
		font-size: 18px;
	}
	
	header nav ul li ul li a {
		padding: 12px 30px;
	}
	
	#grid {
		padding: 0;
	}
	
	#grid .container.inner {
		padding: 60px 0 45px;
	}
	
	#grid ul {
		width: 300px;
		margin: 0 auto;
	}
	
	#grid ul li {
		background-size: 130px auto !important;
		margin: 0 10px 20px;
		width: 130px;
		height: 130px;
	}
	
	#grid ul li div {
		font-size: 16px;
		width: 115px;
		padding: 10px 0;
		top: 45px;
		margin-left: -57px;
	}
	
	#wrapper .container {
		width: 100%;
	}
	
	#content {
		width: 100%;
		padding: 20px;
		box-sizing: border-box;
	}
	
	footer ul.affiliations {
		width: 300px;
		margin: 0 auto;
	}
	
	footer ul.affiliations li {
		margin: 0 20px 20px;
	}
	
	footer a.back_top {
		margin: 0 auto 40px;
	}
	
	footer .credits p,
	footer .credits p.site_by {
		text-align: center;
	}
	
	footer .credits p.site_by {
		margin-top: 15px;
	}
	
	.testimonial {
		width: 240px;
	}
	
	#content {
		margin: -240px auto 0;
	}
	
	#introduction .quote h3 {
		padding: 0;
		font-size: 24px;
		line-height: 32px;
	}
	
	#introduction .about p, #why_one_one p,
	#testimonials p, #case_study p {
		padding: 0;
	}
	
	#why_one_one .image {
		width: 105%;
		height: 220px;
		margin: 0 -2.5%;
		background-size: 100% auto;
	}
	
	#testimonials {
		background-color: #EEEEEE;
		background-position: bottom center;
	}
	
	#testimonials ul {
		width: 300px;
	}
	
	#testimonials ul li {
		margin: 0 2.5% 20px;
	}
	
	#testimonials ul li div {
		font-size: 20px;
		line-height: 28px;
	}
	
	img.alignleft, img.alignright {
		float: none;
		margin: 0 auto 20px;
		display: block;
	}
	
	.contact {
		width: 50%;
	}
	
	.contact p {
		font-size: 21px;
		margin: 0 0 20px;
	}
	
	.contact ul.social {
		width: 90px;
		height: 80px;
		margin: 0 0 20px;
	}
	
	.contact ul.social li {
		margin: 0 8px 8px 0;
	}
	
	.profile {
		width: 45%;
	}
	
	.profile img {
		width: 100%;
	}
	
}