/*
	Theme Name: Profile Hair Design
	Description: Custom Theme Design
	Version: 1.0
	Author: Phil Kingham for Plash Creative 2015
*/


/*------------------------------------*\
    MAIN
\*------------------------------------*/

/* global box-sizing */
*,
*:after,
*:before {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}

html {

}
body {
	font-family: 'Didact Gothic', sans-serif;
}
/* clear */
.clear:before,
.clear:after {
    content:' ';
    display:table;
}

.clear:after {
    clear:both;
}
.clear {
    *zoom:1;
}
img {
	max-width:100%;
	vertical-align:bottom;
}
a {
	color:#444;
	text-decoration:none; -webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -o-transition: all .3s ease-in; transition: all .3s ease-in;
}
a:hover {
	color:#444;
}
a:focus {
	outline:0;
}
a:hover,
a:active {
	outline:0;
}
input:focus {
	outline:0;
	border:1px solid #04A4CC;
}

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/
h2 { font-family: 'Oswald', sans-serif; width:100%; font-size:40px; letter-spacing:1px; text-align:center;margin:0px;text-transform:uppercase;}
h3 { font-family: 'Oswald', sans-serif; font-weight:400;font-size:24px; text-transform:uppercase;}
h4 {font-family: 'Oswald', sans-serif; font-size:18px;  text-transform:uppercase;}
.gallery-block h3, #about h3 { text-align:left; padding-bottom:10px; border-bottom: solid 1px #231F20;}
.opening-hours h4 { font-family: 'Oswald', sans-serif; font-weight:400; font-size:40px; text-transform:uppercase;margin: 30px 0px 0px 0px;}
.heading-underline { width:40%;float:left; height:1px; margin: 20px 30% 30px 30%;}
/* wrapper */
.wrapper {
	width:100%;
	margin:0;float:left;
	position:relative;
}
/* header */
.header-top  { width:100%; float:left; position: ; z-index:999; font-size:13px; color:#fff; padding:0px 5%;background: #231F20; border-bottom: solid 1px #88746A;}
.header-top span  {line-height:40px;width:auto; float:left;padding:0px 20px; border-right:solid 1px #88746A;}
.header-top a  {color:#fff;} .header-top a:hover  {color:#ECB6BA;} 
.social-top { float:right!important; height:40px; padding: 0px 10px!important; border-right:solid 1px #88746A;}
.social-icons {width:auto; height:18px;position:relative;top:-12px;}
.footer-inner .social-top { border-right:solid 0px #88746A;}
.header-contact-icon {width:16px; float:left;margin: 12px 8px 0px 0px;height:auto;}
.header { width:100%; height:70px;float:left; position:relative; z-index:999; top: 0px;padding:0px 5%;background: rgba(35, 31, 32, .6);    -webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -o-transition: all .3s ease-in; transition: all .3s ease-in; }
.header-shrink  { width:100%; height:70px;float:left; position:fixed; z-index:999; top: 0px;padding:0px 5%;background: rgba(35, 31, 32, 1); }
.header-inner { max-width:1140px; margin:0px auto;}
.home-feature-banner { width:100%; background-size:cover; background-position: center center;float:left; position:relative;margin-top: -70px;} .home-feature-banner img { } 
.rslides1_nav.next {
	left: auto;
	background-position: right top;
	right: 0;
}
.rslides1_nav {
	position: absolute;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	top: 50%;
	left: 0;
	z-index: 9999;
	opacity: 1;color:#fff;
	text-indent:-9999px;
	overflow: hidden;
	text-decoration: none;
	height: 61px;
	width: 38px;
	background: transparent url("img/arrows.png") no-repeat left top;
	margin-top: -45px;
}

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }
.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;background-size:cover; background-position: top center;
  display: none;
  width: 100%;float:left;height:600px;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }
  
/* logo */
.logo { max-width:200px;float:left; margin-top:20px;}
.logo-img { max-width:200px;height:auto;}
/* nav */
.nav {

}
.booknow {background-color:#ECB6BA; color:#fff;float:right; text-align:center;text-transform:uppercase; margin-top:14px;padding: 8px 22px;border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px;}
.booknow:hover { color:#fff; background-color:#fd606c;}
#responsive-menu .responsive-menu li a {text-transform:uppercase;}
.nav  ul li a {
    font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
    font-size: 16px; line-height:70px;
    color: #fff;
    letter-spacing:1px;
    text-decoration: none;
    font-weight:400;
    display: block;
    width: auto;
    float: left;
    margin: 0;
    padding: 0 60px 0 0;
    -webkit-transition: all .3s ease-in;
    -moz-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    transition: all .3s ease-in;
}
.nav ul li a:hover {color: #ECB6BA;}
.nav ul {
    list-style: none;
    padding: 0;
    margin: auto 0px auto 12%;
    float: left;
    position: relative;
    z-index: 3000;
}
.nav ul li {
    float: left;
    position: relative;
    width: auto;
}
.nav li ul {
    position: absolute;
    top: 0;
    display: none;
    margin: 0;
    padding-left: 0;
    padding-right: 0;
    float: left;
}
.nav .current_page_item a { color: # ; }


/* Content */
.content-inner { max-width:1140px; margin:0px auto;}
.page-id-44 .content-inner { max-width:1140px; text-align:center; font-size:20px;margin:0px auto;}
.content-inner a:hover { color:#ECB6BA;}
.col50 { width:40%; float:left;text-align:left;  margin:0px 5%; }

.about-col50-1 { width:47.5%; float:left;text-align:left;  margin: 0px 5% 0px 0%; }
.about-col50-2 { width:47.5%; float:left;text-align:left;  margin:0px 0%; }

.contact-block,.content-block,.gallery-block {width:100%; float:left; text-align:center; color:#4C5141; padding:80px 5%; background-color:#fff;}
.opening-hours {width:100%; float:left; padding:100px 5%; background-size:cover; background-position:center center;}
.opening-hours ul {width:100%;float:left; list-style:none; margin:0px; padding:0px;}
.opening-hours ul li{ display: inline-block; color:#ECB6BA; float:left; text-align:center;width: 140px; height: 140px; border-radius: 90%;list-style:none; margin:0px 1%; background-color:#fff; padding:0px;}
.opening-hours ul li p{font-family: 'Oswald', sans-serif; font-weight:300; font-size:16px;text-transform:uppercase;margin:0px;padding:0px;}

/* Stylist */
.stylist-banner { width:100%; float:left; height:400px; background-size:cover; background-position: center center;}
.stylist-logos  { width:100%; float:left; text-align:center;background-color:#111; padding: 10px 5%;}
.stylist-logos img {width:auto; height:70px; margin:0px 40px;}
.stylists { width:100%; float:left; list-style:none; margin:0px; padding:0px;}
.stylists li { width:24%; float:left; list-style:none; min-height: ;text-align:center;font-size:13px;border: solid 2px #B8BABC; margin:0px 0.5%; padding:1%;}
.stylists li img { width:90%; height:auto; border-radius:100%; -moz-border-radius:100%; -webkit-border-radius:100%;}
.job-titles { font-family: 'Oswald', sans-serif; font-weight:400; color:#797A7D;width:100%; margin:0px 0px 20px 0px;float:left; font-size:16px; }
.popup .job-titles {  width:100%; }
.about-col50-1 strong {font-family: 'Oswald', sans-serif; }
.popup { max-width:800px; font-size:14px; padding:20px;}
.popup-content { width:55%; float:left; margin:0px 0% 20px 0px; }
.popup-img { width:40%; float:left; margin:0px 5% 20px 0px; }
.popup-img img { width:100%; height:auto; border-radius:100%; -moz-border-radius:100%; -webkit-border-radius:100%;}
.stylists li a {
  background-color: #ECB6BA;
  color: #fff;
  width:40%;
  float:left;
  text-align: center;
  text-transform: uppercase;
  margin: 10px 30%;
  padding: 8px 22px;
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}
.stylists li a:hover { background-color: #fd606c;}
  
/* Contact */
.wpcf7-text,.wpcf7-textarea { width:100%; text-transform:uppercase; -webkit-appearance: none; border-radius:0px;  -webkit-border-radius:0px;  -moz-border-radius:0px; padding:8px; margin: 0px 0px 10px 0px;border: solid 1px #231F20; float:left;}
.wpcf7-text:focus,.wpcf7-textarea:focus { background-color:#eee;}
.wpcf7-submit {color:#fff; text-transform:uppercase; float:right; padding: 12px 22px; background-color:#58595B;border: solid 0px;border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; -webkit-transition: all .3s ease-in; -moz-transition: all .3s ease-in; -o-transition: all .3s ease-in;
    transition: all .3s ease-in;}
.wpcf7-submit:hover { background-color:#232323;}
.contact-icon { width:18px; height:auto; float:left;margin:3px 20px 0px 0px;}
.googlemap { width:100%;float:left;-webkit-filter: grayscale(100%);
       -moz-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
         -o-filter: grayscale(100%);
            filter: grayscale(100%);}
.overlay {
   background:transparent; 
   position:relative; 
   width:100%;
   height:300px; /* your iframe height */
   top:300px;  /* your iframe height */
   margin-top:-300px;  /* your iframe height */
}
/* footer */
.footer { width:100%; float:left; height:80px; padding:30px 5%; text-transform:uppercase; background-color:#130C0E; color:#fff; font-size:13px;}
.footer a {color:#eee; margin-left:30px;} .footer a:hover {color:#ECB6BA; } 
.footer .social-icons {float:right;margin-left:20px;}
/*------------------------------------*\
    Accordion Services
\*------------------------------------*/

.ac-container{
	width: 100%;
	margin: 0px auto  0px auto;
	text-align: left;
}
.ac-container label{
font-family: 'Oswald', sans-serif;
font-size:36px;text-transform:uppercase;
	position: relative;
	z-index: 20;
	display: block;
	height:  ;
	cursor: pointer;
	color: # ;
	text-shadow:  ;
	line-height: 50px;
	font-size:  ;
	background: #ffffff;
	    -webkit-transition: all .3s ease-in;
    -moz-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    transition: all .3s ease-in;
}
.ac-container label:hover{
	background: #fff; color:#ECB6BA;
}
.ac-container input:checked + label,
.ac-container input:checked + label:hover{
	background: ;
	color: ;
}
.ac-container label:hover:after,
.ac-container input:checked + label:hover:after{
	content: '';
	position: absolute;
	width: 24px;
	height: 24px;
	right: 13px;
	top: 7px;
	background: transparent url(img/arrow_down.png) no-repeat center center;	
}


.ac-container label:after {
	content: '';
	position: absolute;
	width: 24px;
	height: 24px;
	right: 13px;
	top: 7px;
	background: transparent url(img/arrow_down.png) no-repeat center center;	
}

.ac-container input:checked + label:hover:after{
	background-image: url(img/arrow_up.png);
}

.ac-container input{
	display: none;
}
.ac-container article{
	background: rgba(255, 255, 255, 0.5);
	margin-top: -1px;
	overflow: hidden;
	height: 0px;
	position: relative;
	z-index: 10;
	-webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	-moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	-o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	-ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
}
.ac-container article p{

	color: # ;
	line-height:  ;
	font-size:  ;
	padding-left: 10px;

}
.ac-container input:checked ~ article{
	-webkit-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	-moz-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	-o-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	-ms-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
}
.ac-container input:checked ~ article.ac-small{
	height: 140px;
}
.ac-container input:checked ~ article.ac-medium{
	height: 380px;
}
.ac-container input:checked ~ article.ac-large{
	height: 1140px;
}

/*------------------------------------*\
    IMAGES
\*------------------------------------*/



/*------------------------------------*\
	TYPOGRAPHY
\*------------------------------------*/

@font-face {
	font-family:'Font-Name';
	src:url('fonts/font-name.eot');
	src:url('fonts/font-name.eot?#iefix') format('embedded-opentype'),
		url('fonts/font-name.woff') format('woff'),
		url('fonts/font-name.ttf') format('truetype'),
		url('fonts/font-name.svg#font-name') format('svg');
    font-weight:normal;
    font-style:normal;
}

/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/

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

}
@media screen and (max-width: 480px) {
h2 { font-size: 28px;}
h3 { font-size: 20px;}
.header {height:60px; }
.header-shrink  { height:60px; }
.logo-img { max-width:140px;}

.home-feature-banner { width:100%; float:left; position:relative;margin-top: -60px;}
.rslides li {float:left;height:300px;  }
.about-col50-1, .about-col50-2  {width:100%;margin: 0px 0% 10px 0%;}
.contact-block, .content-block, .gallery-block { padding: 40px 5%;}
.stylist-banner { height: 260px;}
.stylists li { width: 49%; font-size: 13px; margin: 10px 0.5%; padding: 5%; }
.stylists li p {display:none;}
.stylists li img { width: 90%;  height: auto;}
.stylists li a { width: 80%;  margin: 10px 10%;  padding: 8px 22px;}
.stylists li h4{ margin: 10px 0%; }
.job-titles { margin:0px 0px 10px 0px; font-size:12px; }
.stylist-logos img { height: 50px; margin: 5px 10px; }
.col50 { width: 100%; margin: 0px 0%;}
.footer { width:100%; float:left;height: 160px; padding: 20px 5%;text-align:center;}
.plash {width:100%;float:left; margin:10px 0px;}
.ac-container label{font-size:24px;}
.opening-hours ul li {
  float: none!important;
  text-align: center;
  width: 140px;
  height: 140px;
  border-radius: 90%;
  list-style: none;
  margin: 10px 2%;
}
.contact-icon { width: 18px; margin: 3px 20px 30px 0px;}
.overlay {display:none;}
.opening-hours { padding: 40px 5%;}
.ri-grid ul li {width:25%!important;height:80px!important;border:solid 5px #fff;}
.footer .social-icons {float:none;margin-left: 0px;}.footer  a { margin-left: 0px;}
.footersocial-1 {float:left;text-align:right;padding-right:3%; margin-top:20px;width:50%;}
.footersocial-2 {float:left;text-align:left;padding-left:3%; margin-top:20px;width:50%;}
.popup-content { width:100%; margin:0px 0% 10px 0px; }
.popup-img { width:100%; margin:0px 0% 10px 0px; }
}
/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
.opening-hours { padding: 100px 3%;}
.opening-hours ul li { width: 90px!important; font-size:13px!important;height: 90px!important; margin: 0px 0.5%!important;}
.opening-hours h4 { font-size: 30px!important; margin: 14px 0px -8px 0px!important;}
.ac-container label{font-size:28px!important;}
.stylist-logos img { height: 60px!important;  margin: 0px 20px;}
.stylists li { width: 49%!important; font-size: 13px; margin: 0px 0.5% 10px 0.5%;}
.header-top { display:block!important;}
}
/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	.stylists li a { width: 80%;  margin: 10px 10%; padding: 8px 22px;}
	.stylists li {min-height:540px; }
	.header-top a {color:#fff;}
	.contact-block, .content-block, .gallery-block { padding: 80px 4%;}
}
/* Desktops and laptops 1024 ----------- */
@media only screen 
and (min-width : 768px) 
and (max-width : 1100px) {
.nav ul li a {  font-size: 14px; line-height: 70px; padding: 0 40px 0 0;}
.header-top { font-size: 12px; padding: 0px 4%;}
.header-top span { padding: 0px 10px;}
.opening-hours ul li { width: 110px; height: 110px; margin: 0px 1% 20px 1%;}
.opening-hours h4 { font-size: 34px; margin: 20px 0px 0px 0px;}

}
@media only screen 
and (min-width : 1100px) 
and (max-width : 1220px) {
.opening-hours ul li { width: 120px; height: 120px; margin: 0px 1%;}
.opening-hours h4 { font-size: 34px; margin: 20px 0px 0px 0px;}
}
@media only screen 
and (min-width : 1220px) 
and (max-width : 1280px) {
.opening-hours ul li { width: 130px; height: 130px; margin: 0px 1%;}
}
@media only screen and (-webkit-min-device-pixel-ratio:1.5),
	   only screen and (min-resolution:144dpi) {

}

/*------------------------------------*\
    MISC
\*------------------------------------*/

::selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-webkit-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-moz-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}

/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/

.alignnone {
	margin:5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
	display:block;
	margin:5px auto 5px auto;
}
.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
a img.alignnone {
	margin:5px 20px 20px 0;
}
a img.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.aligncenter {
	display:block;
	margin-left:auto;
	margin-right:auto;
}
.wp-caption {
	background:#FFF;
	border:1px solid #F0F0F0;
	max-width:96%;
	padding:5px 3px 10px;
	text-align:center;
}
.wp-caption.alignnone {
	margin:5px 20px 20px 0;
}
.wp-caption.alignleft {
	margin:5px 20px 20px 0;
}
.wp-caption.alignright {
	margin:5px 0 20px 20px;
}
.wp-caption img {
	border:0 none;
	height:auto;
	margin:0;
	max-width:98.5%;
	padding:0;
	width:auto;
}
.wp-caption .wp-caption-text,
.gallery-caption {
	font-size:11px;
	line-height:17px;
	margin:0;
	padding:0 4px 5px;
}
.sticky {

}
.bypostauthor {

}

/*------------------------------------*\
    PRINT
\*------------------------------------*/

@media print {
	* {
		background:transparent !important;
		color:#000 !important;
		box-shadow:none !important;
		text-shadow:none !important;
	}
	a,
	a:visited {
		text-decoration:underline;
	}
	a[href]:after {
		content:" (" attr(href) ")";
	}
	abbr[title]:after {
		content:" (" attr(title) ")";
	}
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content:"";
	}
	pre,blockquote {
		border:1px solid #999;
		page-break-inside:avoid;
	}
	thead {
		display:table-header-group;
	}
	tr,img {
		page-break-inside:avoid;
	}
	img {
		max-width:100% !important;
	}
	@page {
		margin:0.5cm;
	}
	p,
	h2,
	h3 {
		orphans:3;
		widows:3;
	}
	h2,
	h3 {
		page-break-after:avoid;
	}
}
