/*
Theme Name:    Member Theme - Standard
Theme URI:
Description:	Quickly and easily publish your very own professional Voice-Over website using this standard paged theme.<br>Choose from two color schemes to fit your on-air style and personality.
Author:         Eclarian
Author URI:     https://eclarian.com
Template:       kleo
*/


/* ------ Table of Contents ------------------------------------------------------------------------------------
02. Body
03. General
04. Section
05. Button
06. Testimonials
07. Featured Items
18. Top Bar
20. Navigation
25. Title
30. Homepage
40. About Page
50. Contact Page
55. Blog List
56. Blog Page
60. Clients
90. Footer
/** ------------------------------------------------------------------------------------------ */

/** ------ 02. Body ------------------------------------------------------------------------------------ */

/** ------ 03. General ------------------------------------------------------------------------------------ */
h1,h2,h3,h4,h5,h6,div,p,span {
	letter-spacing: .1em;
}
h2 {
	margin: 30px 0 30px;
}
h1,h2,h3,h4,h5,h6 {
	/*text-shadow: 0 0 2px rgba(0,0,0,1);*/
}
p {
	margin:20px 0 25px;
}
p.no-p-margin,
.no-p-margin p {
	margin-top: 0;
	margin-bottom: 0;
}
.wpb_content_element {
	margin-bottom: 50px;
}
.kleo-socials {
	display: inline-block;
}
.kleo-socials .kleo-social-icons {
	display: inline-block;
	padding: 0;
	margin: 0;
	vertical-align: middle;
}
.kleo-socials .kleo-social-icons li {
	list-style-type: none;
	display: inline-block;
	border-radius: 50%;
	font-size: 24px;
	line-height: 40px;
	height: 40px;
	width: 40px;
	margin: 0 10px 0 0;
	transition: all .15s;
	overflow: hidden;
}
.kleo-socials .kleo-social-icons li a {
	color: #fff;
	width: 40px;
	height: 40px;
	display: block;
	padding: 2px 9px;
}
.kleo-socials .kleo-social-icons li .ts-text {
	margin: 0 10px;
	display: none;
}
.center-content {
	text-align: center;
}
.kleo-icon-anchor i::before {
	font-size: 16px;
	transition: .15s all;
	-webkit-transition: .15s all;
}
.kleo-icon-text {
	margin-left: 8px;
	font-family: 'Roboto';
	font-size: 16px;
	color: #444;
	transition: .15s all;
	-webkit-transition: .15s all;
}
/** ------ 04. Section ------------------------------------------------------------------------------------ */

/** ------ 05. Button ------------------------------------------------------------------------------------ */
.vc_btn3 {
	font-family: 'Raleway';
}
.vc_btn3-container {
	margin-top: 25px;
	margin-bottom: 25px;
}
.vc_btn3.vc_btn3-size-lg.vc_btn3-style-outline {
	padding: 10px 35px;
	font-size: 20px;
}
body .vc_btn3-container.secondary-color .vc_btn3.vc_btn3-style-outline {
	background-color: transparent;
}
body .vc_btn3-container.secondary-color .vc_btn3.vc_btn3-style-outline:hover {
	color: #fff;
}
/** ------ 06. Testimonials ------------------------------------------------------------------------------------ */
.testimonial-image {
	display: none;
}
.testimonial-meta {
	margin-top: 40px;
}
.kleo-testimonials p,
.kleo-testimonials .testimonial-name,
.kleo-testimonials .testimonial-subtitle {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
	font-family: 'Raleway', sans-serif;
	font-size: 20px;
	font-style: normal;
}
.kleo-testimonials .testimonial-name {
	font-style: italic;
	color: #444444;
}
.kleo-testimonials .testimonial-name::after {
	content: ',';
}
.kleo-testimonials .testimonial-subtitle {
	font-weight: 100;
	font-style: italic;
}
.kleo-testimonials .testimonial-meta {
	margin-top: 15px;
}
.kleo-testimonials .kleo-carousel-pager a {
	width: 15px;
	height: 15px;
	margin: 10px 5px;
	background-color: rgba(0,0,0, .33);
}
.kleo-carousel-testimonials .testimonial-content {
	font-weight: 100;
}
@media screen and (max-width: 767px) {
	.kleo-carousel-testimonials .caroufredsel_wrapper {
		height: 350px !important;
	}
}
/** ------ 07. Featured Items ------------------------------------------------------------------------------------ */

/** ------ 18. Top Bar ------------------------------------------------------------------------------------ */
.social-header {
	display: none;
}
/** ------ 20. Navigation ------------------------------------------------------------------------------------ */
li.menu-item a {
	font-size: 18px;
	text-transform: uppercase;
}
/** ------ 25. Header ------------------------------------------------------------------------------------ */
#main .main-title {
	color: #fff;
	border: none;
	padding: 25px 0;
	margin-bottom: 50px;
}
#main .main-title h1 {
	color: #fff;
	font-weight: 100;
	font-size: 30px;
	line-height: 30px;
	margin: 0;
}
/** ------ 30. Homepage ------------------------------------------------------------------------------------ */
#main .homepage-hero-container h3 {
	margin-bottom: 20px;
	font-size: 46px;
}
@media screen and (max-width: 450px) {
	#main .homepage-hero-container h3 {
		margin-bottom: 20px;
		font-size: 28px;
	}
}
#main .homepage-hero-container .hero-audio {
	height: 60px;
}
#main .hero-audio .section-container {
	max-width: 800px;
}
#main .hero-audio .mejs-container,
#main .hero-audio .mejs-controls {
	background-color: transparent;
	height: 40px !important;
}
#main .hero-audio .mejs-pause,
#main .hero-audio .mejs-play {
	width: 40px;
}
#main .hero-audio .mejs-pause button,
#main .hero-audio .mejs-play button {
	height: 40px !important;
	width: 40px;
	line-height: 40px;
	margin: 0;
	background-color: rgba(0,0,0,.33);
	border-radius: 50%;
}
#main .hero-audio .mejs-pause button::before,
#main .hero-audio .mejs-play button::before {
	color: #fff;
	font-size: 20px;
	line-height: 40px;
}
#main .hero-audio .mejs-play button::before {
	margin-left: 4px;
}
#main .hero-audio .mejs-container .mejs-controls div {
	height: 40px;
	position: relative;
	padding: 0;
}
#main .hero-audio .mejs-time {
	width: 58px;
	padding: 0;
	margin-left: 15px;
	margin-right: 15px;
}
#main .hero-audio .mejs-time.mejs-duration-container {
	margin-right: 5px;
}
#main .hero-audio .mejs-duration,
#main .hero-audio .mejs-currenttime {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	color: #fff;
	font-size: 20px;
	font-family: 'Roboto';
}
#main .hero-audio .mejs-time-slider {
	height: 14px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	margin: 0;
	background-color: rgba(0,0,0,.33);
}
#main .hero-audio .mejs-time-loaded,
#main .hero-audio .mejs-time-current {
	height: 14px;
}
#main .hero-audio .mejs-volume-button button {
	height: 40px !important;
	width: 40px;
	line-height: 40px;
	margin: 0;
}
#main .hero-audio .mejs-volume-button button::before {
	color: rgba(0,0,0,.5);
	font-size: 30px;
	line-height: 40px;
	margin-left: 4px;
}
#main .hero-audio .mejs-horizontal-volume-slider {
	width: 0;
	visibility: hidden;
}
#main .hero-audio .mejs-horizontal-volume-slider div {
	width: 0;
	visibility: hidden;
}
#main .samples::before {
	content: '\00a0';
	width: 0;
	height: 0;
	border-left: 40px solid transparent;
	border-right: 40px solid transparent;
	border-top: 40px solid #fff;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
}

#main .samples .vc_icon_element.vc_icon_element-outer .vc_icon_element-inner.vc_icon_element-size-xl.vc_icon_element-have-style-inner {
	width: 100px !important;
	height: 100px !important;
}
#main .samples .vc_icon_element.vc_icon_element-outer .vc_icon_element-inner .vc_icon_element-icon::before {
	width: 100px;
	height: 100px;
	line-height: 100px;
	font-size: 50px;
	margin-left: 8px;
	margin-top: 4px;
}
#main .samples h3 {
	color: #fff;
	font-weight: 500;
	margin-top: 10px;
	margin-bottom: 20px;
}
@media screen and (max-width: 991px) {
	#main .samples h3 {
		height: 50px;
	}
}
@media screen and (max-width: 767px) {
	#main .samples h3 {
		height: auto;
	}
	#main .samples {
		text-align: center;
	}
	#main .samples .mejs-container {
		width: 66% !important;
		margin: 0 auto;
	}
	#main .samples .wpb_column {
		margin-bottom: 100px;
	}
	#main .samples .wpb_column .wpb_content_element {
		margin-bottom: 0;
	}
}
#main .samples .vc_icon_element,
#main .samples .wpb_content_element {
	margin-bottom: 25px;
}
#main .samples .mejs-container,
#main .samples .mejs-controls {
	background-color: #fff;
	height: 40px !important;
	border-radius: 8px;
}
#main .samples .mejs-pause,
#main .samples .mejs-play {
	width: 40px;
}
#main .samples .mejs-pause button,
#main .samples .mejs-play button {
	height: 40px !important;
	width: 40px;
	line-height: 40px;
	margin: 0 3px;
}
#main .samples .mejs-pause button::before,
#main .samples .mejs-play button::before {
	color: rgba(0,0,0,.5);
	font-size: 20px;
	line-height: 40px;
}
#main .samples .mejs-container .mejs-controls div {
	height: 40px;
	position: relative;
	padding: 0;
}
#main .samples .mejs-time {
	width: 50px;
	padding: 0;
	margin-left: 5px;
	margin-right: 5px;
}
#main .samples .mejs-time.mejs-duration-container {
	margin-left: 10px;
	margin-right: 5px;
}
#main .samples .mejs-duration,
#main .samples .mejs-currenttime {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	color: rgba(0,0,0,.5);
	font-size: 15px;
	font-family: 'Roboto';
}
#main .samples .mejs-time-slider {
	height: 10px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	margin: 0;
	background-color: rgba(0,0,0,.33);
}
#main .samples .mejs-time-loaded,
#main .samples .mejs-time-current {
	height: 10px;
}
#main .samples .mejs-volume-button button {
	height: 40px !important;
	width: 40px;
	line-height: 40px;
	margin: 0;
}
#main .samples .mejs-volume-button button::before {
	color: rgba(0,0,0,.5);
	font-size: 15px;
	line-height: 40px;
	margin-left: -20px;
}
#main .samples .mejs-horizontal-volume-slider {
	width: 0;
	visibility: hidden;
}
#main .samples .mejs-horizontal-volume-slider div {
	width: 0;
	visibility: hidden
}
/** ------ 40. About Page ------------------------------------------------------------------------------------ */
body.about .testimonial-content {
	padding: 0;
}
body.about .testimonial-content p {
	margin-top: 0;
	font-family: 'Raleway', sans-serif;
	font-size: 16px;
}
body.about .testimonial-meta {
}
body.about .testimonial-subtitle,
body.about .testimonial-name {
	font-size: 16px;
}
body.about .kleo-carousel-container.kleo-testimonials ul li {
	padding-bottom: 0;
}
body.about .kleo-carousel-pager.carousel-pager a {
	height: 12px;
	width: 12px;
	margin-top: 0;
	margin-bottom: 0;
}
@media screen and (max-width: 767px) {
	body.about .kleo-carousel-container {
		margin-top: 100px;
	}
	body.about .representation-and-testimonials-header,
	body.about .representation-and-testimonials {
		text-align: center;
	}
	body.about .representation-and-testimonials .vc_column-inner {
		margin-bottom: 25px;
	}
}
/** ------ 50. Contact Page ------------------------------------------------------------------------------------ */
body.contact .main-title {
	margin-bottom: 0 !important;
}
body.contact .article-content > section.container-wrap {
	padding-top: 0 !important;
}
body.contact form p {
	margin: 0;
}
body.contact input,
body.contact textarea {
	background-color: #EFEFEB !important;
}
body.contact .wpcf7 input[type=submit] {
	margin: 15px 0;
	background-color: #fff !important;
	border-radius: 0;
	font-size: 18px;
	font-family: 'Roboto';
}
body.contact .wpcf7 input[type=submit]:hover {
	color: #fff;
}
body.contact form .two-field-row .wpcf7-form-control-wrap {
	display: inline-block;
	width: calc(50% - 5px);
}
body.contact form .two-field-row .wpcf7-form-control-wrap:first-child {
	margin-right: 5px;
}
body.contact form .two-field-row .wpcf7-form-control-wrap:last-child {
	margin-left: 5px;
}
@media screen and (max-width: 767px) {
	body.contact .twitter-timeline {
		margin-top: 100px !important;
		padding-top: 100px !important;
		border-top: 1px solid #ccc !important;
	}
}
/** ------ 55. Blog List ------------------------------------------------------------------------------------ */
body.archive .post-title,
body.blog .post-title {
	font-family: 'Roboto';
}
body.archive .post-meta,
body.blog .post-meta {
	margin-top: 0;
}
body.archive .item-likes::before,
body.blog .item-likes::before {
	display: none;
}
body.archive .post-image,
body.blog .post-image {
	overflow: hidden;
	height: 165px;
}
body.archive .post-image a,
body.blog .post-image a {
	height: 165px;
}
body.archive .post-image img,
body.blog .post-image img {
	max-width: none;
	max-height: 100%;
}
body .sidebar .widget-title {
	text-transform: uppercase;
}
body .sidebar .widget_tag_cloud a {
	border-radius: 0;
	padding: 8px 15px;
}
@media screen and (max-width: 767px) {
	body.archive .post-image img,
	body.blog .post-image img {
		max-height: none;
	}
	body.archive article,
	body.blog article {
		border-bottom: 1px solid #ccc;
	}
}
/** ------ 56. Blog Page Styles ------------------------------------------------------------------------------------ */
.related-wrap .hr-title {
	margin-bottom: 20px;
}
body.single-post article .entry-content hr {
	margin-top: 8px;
	margin-bottom: 4px;
}
/** ------ 60. Clients Styles ------------------------------------------------------------------------------------ */
.client {
	margin: 0 5px 20px;
	background-color: #CDCFC7;
	padding: 30px 50px;
}
/** ------ 90. Footer Styles ------------------------------------------------------------------------------------ */
#socket {
	text-align: center;
	font-size: 16px;
	line-height: 16px;
	color: #fff;
	padding: 40px 0;
	margin-top: 80px;
}
#socket .kleo-socials .kleo-social-icons li {
	background-color: #fff;
	font-size: 16px;
	line-height: 24px;
	height: 24px;
	width: 24px;
	margin: 0 8px 0 0;
}
#socket .kleo-socials .kleo-social-icons li a {
	width: 24px;
	height: 24px;
	padding: 1px 5px;
}

/* Custom */
.kleo-testimonials .testimonial-name::after {
    content: '' !important;
}