/*
 Theme Name:   The Face Clinic
 Description:  Canvas Child Theme
 Author:       Circle Creative
 Author URI:   http://www.circlecreative.io
 Template:     canvas
 Version:      1.0.0
*/

/* GLOBAL STYLES
----------------
Add styles beneath this line that you want to be applied across your entire site */

/** HEADER **/


#head-left {
	width: 33.33%;
	float: left;
}
	#head-left p {
		font-size: 18px;
		    padding-top: 20px;
		font-weight: 600;
	}
#logo {
	width: 33.33%;
	float: left;
    text-align: center;
}
	#logo .site-title a:hover {
		text-decoration: none;
	}	
#head-right {
	width: 33.33%;
	float: left;
	font-size: 20px;
}
	#head-right p {
		    padding-top: 20px;
		font-size: 18px;
		font-weight: 600;
	}
	
/** END HEADER **/

/** NAVIGATION **/

#nav-container {
	background: rgba(255,255,255,0.5);
	border: 0;
	padding: 0;
	border-top: 0;
	margin-bottom: 0;
	position: absolute;
	width: 100%;
	z-index: 9999;
}
	#navigation {
		background: transparent;
		text-align: center;
	}
	.menus {
		
	}
		#main-nav.nav {
			width: 100%;
			text-align: center;
		}
			#main-nav.nav li {
				float:  none;
				display:  inline-block;
			}
				#nav-container #navigation ul#main-nav > li:first-child {
					border-left: 0px solid #DBDBDB;
				}
				#main-nav.nav li a {
					border:0 !important;
					padding: 20px 30px !Important;
					text-transform: lowercase;
					color: #000;
					font-size: 28px;
					font-family: "Open Sans";
					letter-spacing: -2px;
					font-weight: 300;
				}
					ul.nav li.current_page_item a, 
					ul.nav li.current_page_parent a, 
					ul.nav li.current-menu-ancestor a, 
					ul.nav li.current-cat a, 
					ul.nav li.current-menu-item a,
					.full-width #navigation ul li:first-child a {
						background: transparent;
						border-left: 0 !Important;
					}
					
					#navigation ul.nav > li:hover {
						background: transparent;
					}
						#navigation ul.nav > li:hover a {
							background: transparent;
							color:#288952;
						}
						#navigation ul.nav > li a:hover {
							background: transparent;	
						}

/** END NAVIGATION **/

/** CONTENT **/


#content.fullwidth #main {
	width: 100% !important;	
}

#content {
    padding: 120px 0 40px;
}
	.home #content,
	#content.no-padd {
		padding: 0 0 40px;
	}

	.page .entry-title {
		display: none;	
	}
	.search .entry-title {
		display: block !important;	
	}
		
		.page-title, .post .title, .page .title {
			font: bold 38px/45px 'Open Sans Condensed', arial, sans-serif;
		}
	
		.lined-title h4 {
			font-weight: 100;
			font-size: 38px;
			line-height: 42px;
			font-family: 'Open Sans Condensed', arial, sans-serif !important;
		}
		.entry, .entry p {
			font-weight: 100;
			font-size: 24px;
			line-height: 32px;
			color:#000;
			font-family: 'Open Sans Condensed', arial, sans-serif !important;
		}
		
		
		/** LATEST NEWS ***/
		.latest-news-texts {
			
		}	
			.latest-news-texts h3 a {
				font-size: 24px;
				line-height: 30px;
				color: #9f9f9f;
				font-family: 'Open Sans Condensed', arial, sans-serif !important;
				    font-weight: 300;
			}
			.latest-news-texts p {
				font-size: 20px;
				line-height: 26px;
				color: #9f9f9f;
				font-family: 'Open Sans Condensed', arial, sans-serif !important;
			}
			.latest-news-texts .vc_btn3 {
				color: #8ec1a4 !important;
				font-size: 15px;
				border: 1px solid #288952 !important;
				min-width: 120px;
			}
				.latest-news-texts .vc_btn3:hover {
					color: #fff !important;
				}
		.latest-news-img {
				
		}
		
		#spl-page-wrap {
			
		}
			#spl-inner-wrap {
				margin: 0;
				padding: 0;
			}
			
				#spl-title {
					font-weight: 100;
					font-size: 38px;
					line-height: 42px;
					font-family: 'Open Sans Condensed', arial, sans-serif !important;
				}
	/*
	#content #main .entry p {
		text-align: justify ;	
	}
	*/
/** FOOTER ***/

#footer-container {
    background-color: #fff !important; 
}

#footer-socials {text-align: center;}

	#footer-socials .footer_social {width: auto;display: inline-block;margin: 0 5px 10px;}

	#block-subscribe {
		background: #d4e7dc;
		padding: 20px 10px 20px;	
	}
		#block-subscribe .wpb_text_column  {
			margin-bottom: 0;	
		}
			#news-title {
				text-align: center;
				font-size: 44px;
				line-height: 40px;
				font-weight: 100;
				letter-spacing: -2px;
			}
			#news-sub {
				text-align: center;
				font-size: 17px;
				font-weight: 100;
				line-height: 20px;
			}
			#news-email {
			
				border: 1px solid #288952;
							
				padding: 10px 20px;
							
				border-radius: 25px;
							
				margin: 10px auto 0;
							
				width: 80%;
			}
			#news-btn {
				
				background: #288952;
								
				padding: 10px 20px;
								
				border-radius: 25px;
								
				margin: 10px auto 0;
								
				color: #99c7ad !Important;
								
				width: 100%;
								
				float: none !important;
								
				text-transform: none;
								
				letter-spacing: 1px;
								
				max-width: 200px;
			}
		#block-subscribe .vc_column-inner  {
			padding-top: 0;	
		}
	
	.hide-it {
		height: 0 !Important;
		overflow: hidden;
		margin: 0 !Important;	
	}
	
.show-on-1024 { 
	display: none;
}
.hide-on-1024 {
	display: block;	
}

.overlay-content { }
.overlay-wrap {
	overflow: hidden;
	width: 85%;
	max-width: 764px;
	margin: 100px auto 0;
}
.overlay-wrap h1{
	color: #ffffff;
}
.overlay-wrap p{
	color: #cccccc;
}
	.overlay-wrap ul {
		
		width:  100%;
				
		padding: 0;
				
		margin:  0;
	}
		.overlay-wrap ul li {
			
			min-height: 0;
						
			padding: 10px 20px;
		}
			.overlay-wrap ul li a {
				color: #ccc;
				font: bold 20px/1em 'Open Sans Condensed', arial, sans-serif;
				line-height: normal;	
			}
				.overlay-wrap ul li a:hover {
					color: #fff;
					text-decoration: none;
				}

.overlay-title {
	font: bold 70px/1em 'Open Sans Condensed', arial, sans-serif;
	color: #fff;
	text-transform:lowercase;
	text-align: center;
	width: 100%;
	margin: 0 0 20px;
}
	.overlay-title span {
		
	}

#search-wrap {
	
display: block;
	
overflow: hidden;
	
width: 100%;
	
padding: 0;
	
text-align: center;
	
margin-top: 20%;
}
#search-wrap h3 {
	color:#000;
	margin-bottom: 10px;
}
#search-wrap form input[type=text] {
    width: 100%;
    color: #000;
    height: 100px;
    max-width: 550px;
    font-size: 53px;
    line-height: 100px;
    position: relative;
    text-align: center;
    float:  none;
    margin: 0 auto;
    background-color: rgba(255, 255, 255, 0.35);
    border: 0;
    transition: none;
    -moz-transition: none;
    -webkit-transition: none;
    -o-transition: none;
    box-shadow: none!important;
    -moz-box-shadow: none!important;
    -webkit-box-shadow: none!important;
    -o-box-shadow: none!important;
    font-family: 'Open Sans';
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}
#search-wrap form input[type=text]::-webkit-input-placeholder,
#search-wrap form input[type=text]:-moz-placeholder,
#search-wrap form input[type=text]::-moz-placeholder,
#search-wrap form input[type=text]:-ms-input-placeholder {  
   color: #333 !important;  
}
.show-on-794,
.show-on-794 {
	display: none !important;
}


.btn-green a {
	    font-size: 32px !important;
    background: rgb(40, 137, 82) !Important;
    color: #fff !important;
    letter-spacing: 3px;
    width: 95% !important;
    margin: 0 auto !important;
    max-width: 450px !Important;	
}

.home-rev-slider .wpb_revslider_element.wpb_content_element {
	margin-bottom: 0;	
}
	
#tap-btn-green {
    text-align: center;
}
	#tap-btn-green a {
		display: inline-block;
		overflow: hidden;
		width: auto;
		padding: 10px 30px;
		margin: 20px auto 10px;
	    border: 1px solid #fff;
		text-align: center;
		float: none;
		border-radius: 50px;
		cursor: pointer !important;
	}
	#tap-btn-green #news-title {
		margin-bottom: 5px;
		color: #fff;		
	}
	#tap-btn-green :hover {
		text-decoration: none !important;	
	}
	#tap-btn-green #news-sub {
		margin-bottom: 0;
		color: #fff;	
	}
	
#overlay-news { }

#overlay-news #news-title,
#overlay-news #news-sub { 
	display: none !important;
}
	#overlay-news #news-email {
		width: 98%;
		padding: 10px 0px;
	}
	#overlay-news #news-btn {
		border: 3px solid #FFF;
    color: #fff !important;	
	}
.man,
.man .vc_column-inner {
	margin: 0 !important;
	padding: 0 !important;	
}
.show-on-767 {
		display: none !important;
	}
@media only screen and (max-width : 1024px) { 
	.show-on-1024 { 
		display: block;
	}
	.hide-on-1024 {
		display: none;	
	}
	#nav-container,
	h3.nav-toggle.icon {
		display: none;	
	}
	#content {
		padding: 20px 0 40px;
	}
	#head-left {
		float: left;
		width: 48%;
		padding: 1%;
		background: #cfced0;
	}
	#head-right-on-1024 {
		float: left;
		width: 48%;
		padding: 1%;
		background: #cfced0;
		/* width: 50%; */
	}
	#logo {
		width: 75%;
		display: block;
		clear: both;
		margin-top: 20px;
	}
		#logo .site-title {
			
			float: left;
			text-align: left;	
		}
		a.menu-toggle {
			width: 20%;
			float: right;
			text-align: right;
			margin-top: 35px;
			margin-right: 10px;
		}
			a.menu-toggle .fa {
				
font-size: 38px;
				
color: #288952;
			}
		
	#head-right {

	}
	.head-btn {
		width: 96%;
		margin: 0 2%;
		font-size: 18px !IMPORTANT;
		font-weight: 600;
	}
}

@media only screen and (max-width: 794px){
	.show-on-794 {
		display: block !important;
	}
}


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

@media only screen and (max-width: 768px){
	#news-email {
		width: 94%;
		max-width:  none;
		text-align: center;
	}
	#news-btn {
		width: 100% !Important;
		max-width: none;
		margin: 10px auto !important;
		display: inline-block;
		float:  none !important;
	}
	.hide-on-767 {
		display: none !important;	
	}
	.show-on-767 {
		display: block !important;
	}
	#footer { display: none; }
}

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

}
@media only screen and (max-width: 667px){
	
}
@media only screen and (max-width: 568px){
	#header {
		padding: 0 !important;
	}
	#head-left,
	#head-right-on-1024 {
		width: 100%;
		float:none;
		margin:0;
	}
	#logo {
		margin: 10px 0 0px 10px;
	}
		#logo .site-title {
			text-align: center;
			width:  100%;
			display: block;
		}
		#logo .site-title a {
			font-size: 62px !important;
		}
	.menu-toggle {
		margin: 20px 10px 10px 0 !important;
		text-align: center !Important;
	}
}
@media only screen and (max-width: 400px){
	#head-left {
	    background: #288952;
	}
		#head-left #head-left-btn {
			
		}
			#head-left #head-left-btn a.head-btn {
					
border-color: #FFF !important;
					
color: #fff !important;
			}
	#logo {
	
		width: 68%;
	}
		#logo .site-title {
	
		}
		#logo .site-title a {
			
			font-size: 40px !important;
			
		}
	.menu-toggle {
	
		margin: 15px 10px 0px !important;
	}
}