/**
 * Theme Defaults
 */

.ct-main-body {
	position: relative;

	.columns,
	.thumbnail-area {
		img {
			max-width: 100%;
			height: auto;
			vertical-align: bottom;
		}

		> img {
			max-width: 100%;
		}
	}
}

.fa-gradient::before {
	background: -webkit-linear-gradient(left,#f6f163 0%, #4eb7a7 70%);
	background: -moz-linear-gradient(45deg, #f6f163 0%, #4eb7a7 70%);
	background: -ms-linear-gradient(left,#f6f163 0%, #4eb7a7 70%);
	background: -o-linear-gradient(left,#f6f163 0%, #4eb7a7 70%);
	background: linear-gradient(left,#f6f163 0%, #4eb7a7 70%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.text-gradient {
	background: -webkit-linear-gradient(left,#f6f163 0%, #4eb7a7 70%);
	background: -moz-linear-gradient(45deg, #f6f163 0%, #4eb7a7 70%);
	background: -ms-linear-gradient(left,#f6f163 0%, #4eb7a7 70%);
	background: -o-linear-gradient(left,#f6f163 0%, #4eb7a7 70%);
	background: linear-gradient(left,#f6f163 0%, #4eb7a7 70%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.sticky {
	border: 1px solid @primary-color;
	padding: @font-size;

	.post-wrap {
		border-bottom: unset;
	}
}

figure {
	overflow: hidden;
	margin: 0;

	figcaption {
		box-sizing: border-box;
		bottom: 1rem !important;
	}
}

.link-pages {
	margin: @font-size 0;
}

.post-page-numbers {
    padding: 4px;
}

ul,
ol {
	li {
		margin-left: @font-size;
		list-style-position: inside;
	}
}

code br {
    display: block;
    margin: -1.5rem 0;
}

.aligncenter {
    margin: 0 auto;
    display: block;
}

.alignleft {
    float: left;
    margin-right: 1rem;
}

.alignright {
    float: right;
    margin-left: 1rem;
}

.wp-caption {
    border: 1px solid @primary-color;
    padding: .6rem;
    max-width: 100%;
    box-sizing: border-box;
    margin-bottom: 1rem;

    img {
    	max-width: 100%;
    }
}

.wp-caption-text {
    text-align: center;
}

.gallery-caption {
    position: relative;
    font-size: 1.2rem;
}

iframe {
	max-width: 100%;
}

.post-excerpt h1,
.next-post-wrap .next,
.previous-post-wrap .prev {
	overflow-wrap: break-word;
}

.button {
    background-color: #43c6ac;
    color: #ffffff;
    padding: .6rem 1.5rem;
    border: 1px solid #43c6ac;
    border-radius: .2rem;
    cursor: pointer;
    box-shadow: 0 14px 28px -4px rgba(14, 17, 20, 0.1);
    transition: .2s all ease;
}

/**
 *
 * #.# TYPOGRAPHY
 *
 */

h1 {
	line-height: 1;
	margin-bottom: @font-size*2;
}

h2 {
	font-size: 3.2rem;
	font-weight: 700;
	line-height: 1;
	margin-bottom: @font-size;
}

h3 {
	line-height: 1;
}

h4 {
	color: @primary-color;
	font-size: 1.8rem;
	font-weight: 700;
	margin-bottom: 1rem;
}

.page,
.single {
	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	table,
	dl,
	ol,
	ul {
		margin-bottom: 2.2rem;
	}

	p {
		margin-bottom: 1rem;
	}
}

.title-w-sub h4,
.ct-sub,
 {
	margin-bottom: .1rem !important;
}

ul.slick-dots {
	margin-bottom: 0;
}

.post-content {
	ol ol,
	ol ol ol,
	ul ul,
	ul ul ul {
		margin-bottom: 0;
	}

	li {
		margin-bottom: .5rem;
	}
}

/**
 * Body Contents
 */

.service-image {
	max-width: 100%;
}

.ct-info-box {
	border-bottom: 1px solid @border-color;
	padding: 0;
}

.info-boxes,
.member-boxes {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.info-box {
	width: 33%;
	box-sizing: border-box;
}

.member-box {
	padding: 0 1.6rem;
	box-sizing: border-box;
}

.info-box {
	position: relative;
	padding: 0 3rem @theme-margin/1.2;

	&:after {
		content: '';
		position: absolute;
		right: 0;
		top: 0;
		width: 1px;
		height: 100%;
		background-color: @border-color;
	}

	&:before {
		content: '';
		position: absolute;
		top: 0;
		width: 100%;
		height: 1px;
		background-color: #e0e0e0;
		left: 0;
	}

	&:nth-of-type( 3n ) {
		&:after {
			content: unset;
		}
	}

	&:nth-of-type( -n+3 ) {
		&:before {
			content: unset;
		}
	}

	&:nth-child( n+4 ) {
		padding-top: @theme-margin/1.2;
	}
}

.three.info-box {
	&:nth-child( 4n ) {
		&:after {
			content: unset;
		}
	}
}

.four.info-box {
	&:nth-child( 3n ) {
		&:after {
			content: unset;
		}
	}
}

.info-box-flat {
	.fa {
		margin-bottom: @font-size;
		color: @primary-color;
		font-size: 7.2rem;
	}
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	.info-box {
		width: 100%;

		&:after {
			content: unset;
		}
	}
}

.img-wrapper {
	display: flex;

	img {
		width: 100%;
		border-radius: .3rem;
	}
}

.stats-counter {
	.columns {
		&:first-child {
			padding-left: 0;
		}
		&:last-child {
			padding-right: 0;
		}
	}
}

.counter-wrap {
	display: inline-block;

	.counter {
		font-size: 4rem;
	}

	span {
		color: @primary-color;
	}
}

.counter-small {
	display: block;
	font-size: @font-size;
}

.video-popup {
	position: relative;

	.video-play-button {
		position: absolute;
		z-index: 10;
		top: 50%;
		left: 50%;
		transform: translateX(-50%) translateY(-50%);
		box-sizing: content-box;
		display: block;
		width: 20px;
		height: 28px;
		border-radius: 50%;
		padding: 18px 20px 18px 28px;
	}

	.video-play-button:before {
		content: "";
		position: absolute;
		z-index: 0;
		left: 50%;
		top: 50%;
		transform: translateX(-50%) translateY(-50%);
		display: block;
		width: 70px;
		height: 70px;
		// background: @primary-color;
		border-radius: 50%;
		animation: pulse-border 1500ms ease-out infinite;
	}

	.video-play-button:after {
		content: "";
		position: absolute;
		z-index: 1;
		left: 50%;
		top: 50%;
		transform: translateX(-50%) translateY(-50%);
		display: block;
		width: 70px;
		height: 70px;
		// background: @primary-color;
		border-radius: 50%;
		transition: all 200ms;
	}

	.video-play-button:hover:after {
		background-color: darken(@primary-color, 10%);
	}

	.video-play-button img {
		position: relative;
		z-index: 3;
		max-width: 100%;
		width: auto;
		height: auto;
	}

	.video-play-button span {
		display: block;
		position: relative;
		z-index: 3;
		width: 0;
		height: 0;
		border-left: 20px solid #fff;
		border-top: 15px solid transparent;
		border-bottom: 15px solid transparent;
	}

	@keyframes pulse-border {
		0% {
			transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
			opacity: 1;
		}
		100% {
			transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
			opacity: 0;
		}
	}



	.video-overlay {
		position: fixed;
		z-index: -1;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: rgba(0,0,0,0.80);
		opacity: 0;
		transition: all ease 500ms;
	}

	.video-overlay.open {
		position: fixed;
		z-index: 1000;
		opacity: 1;
	}

	.video-overlay-close {
		position: absolute;
		z-index: 1000;
		top: 15px;
		right: 20px;
		font-size: 36px;
		line-height: 1;
		font-weight: 400;
		color: #fff;
		text-decoration: none;
		cursor: pointer;
		transition: all 200ms;
	}

	.video-overlay-close:hover {
		color: @primary-color;
	}

	.video-overlay iframe {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translateX(-50%) translateY(-50%);
		box-shadow: 0 0 15px rgba(0,0,0,0.75);
	}
}

/**
 * Team Members
 */

.team-member {
	margin-top: @line-height;
	position: relative;
	z-index: 1;

	.member-info {
		padding: 1.2rem 1.6rem;

		>h3 {
			margin-bottom: .6rem;
		}
	}

	img {
		display: block;
		width: 100%;
		height: auto;
	}

	h3 {
		font-size: 3.4rem;
		margin-bottom: 0;
	}

	p {
		font-size: 1.4rem;
	}

	&:before {
		background-color: transparent;
		box-shadow: none;
		content: "";
		margin: 0 auto;
		position: absolute;
		top: 20px;
		right: 0;
		width: 100%;
		height: 100%;
		z-index: -1;
		transition: all .5s ease;
	}

	&:hover {
		&:before {
			background-color: @white-color;
			box-shadow: 0 0 4rem rgba(42, 49, 57, 0.05);
			top: 0;
		}
	}

	.member-effects {
		position: relative;

		.member-social {
			position: absolute;
			bottom: 1.2rem;
			left: 0;
			opacity: 0;
			transition: all .5s ease;

			.fa {
				color: @white-color;
				background-color: @primary-color;
				border-radius: 50%;
				margin-right: .2rem;
				width: 3rem;
				height: 3rem;
				line-height: 3rem;
				text-align: center;

				transform: rotate( -45deg );
				transition: all .5s ease;
			}
		}
	}

	&:hover {
		.member-social {
			opacity: 1;
			left: 1.6rem;

			.fa {
				transform: rotate( 0 );
			}
		}
	}
}

/**
 * Long Blurbs
 */

.long-blurb {
	margin-top: @line-height*2;

	.long-blurb-title {
		color: @primary-color;
		font-size: 3rem;
		text-align: right;
		margin-bottom: 0;
	}

	.fa {
		color: @primary-color;
		font-size: 4.8rem;
		text-align: center;
		width: 100%;
	}
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	.long-blurb .long-blurb-title {
		margin-bottom: @font-size;
	}
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	.long-blurb {
		.long-blurb-title {
			text-align: center;
		}
	}
}

/**
 * Testimonial Slider
 */
.ct-testimonials {
	color: @white-color;
	background-color: @primary-color;
	position: relative;
}
	.ct-testimonial-slider {
		.slick-dots {
			top: 0;
			left: 17.7%;
			text-align: left;

			li {
				margin: 0;
			}
		}
	}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	.ct-testimonial-slider {
		.slick-dots {
			top: unset;
			left: unset;
			bottom: -4.5rem;
			text-align: center;
			margin-top: -2rem;
		}
	}
}


	.slick-next,
	.slick-prev {
		z-index: 1;
	}


	.slider-rounded-image {

		img {
			display: block;
			margin: 0 auto;
			border: .5rem solid @white-color;
			border-radius: 50%;
			width: 12rem;
			height: auto;
		}
	}

	.testimonial-contents {
		margin-top: 4rem;

		.testimonial-content {
			font-family: "Lora", serif;
			font-size: @font-size*1.5;
			margin-bottom: @line-height;

			p,
			span {
				font-family: "Lora", serif;
				font-size: @font-size*1.5;
				margin-bottom: @line-height;
			}
		}

		.testimonial-by {
			font-size: @font-size*1.5;
			font-weight: 500;
			line-height: 1;
			margin-bottom: 0;
		}

		.testimonial-author-title {
			color: darken( @white-color, 4%);
			font-family: "Lora", serif;
			font-size: 1.4rem;
		}
	}

.ct-color-mask {
	background-color: @primary-color;
	opacity: .9;

	position: absolute;
	top: 0;
	left: 0;

	width: 100%;
	height: 100%;
}

/**
 * Footer Section
 */

.ct-footer {
	color: @white-color;
	background-color: @footer-bg-color;
	border-top: .5rem solid @primary-color;
	width: 100%;

	.widget-title {
		font-size: @font-size*1.4;
		font-weight: 700;
	}

	ul {
		list-style-position: inside;

		li {
			list-style-type: none;
			margin-bottom: 1.2rem;
		}
	}

	a {
		color: @white-color;

		&:hover {
			color: @primary-color;
		}
	}

	.fa {
		font-size: @font-size*1.5;
		margin-right: @font-size;
	}

	select {
		color: @footer-bg-color;
	}
}

.ct-footer-credits a {
	color: @secondary-color;
}

.ct-bottom-bar {
	color: darken( @white-color, 10%);
	background-color: darken( @footer-bg-color, 5%);
	padding: 1rem 0;

	span {
		font-size: 1.4rem;
	}
}

.footer-site-info {
	text-align: center;
}

.thumbnail-area {
	position: relative;

	.post-date {
		background-color: @primary-color;
		color: @white-color;
		display: inline-block;

		position: absolute;
		bottom: 0;
		right: 0;

		border: 1rem solid #43c6ac;
		outline: 2px solid #ffffff;
		outline-offset: -1rem;
		padding: .2rem .5rem;
	}

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

.post-details {
	a {
		color: @dark-color;

		&:hover {
			color: @primary-color;
		}
	}
}

.single {
	.post-details {
		margin-bottom: 1rem;
	}
}

.post-loop {
	h3 {
		display: inline-block;
		margin: 1rem 0;
		overflow-wrap: break-word;
	}

	.post-date {
		margin-bottom: 1rem;

		span {
			&::after {
				display: inline-block;
				content: "";
				border-top: .3rem solid @primary-color;
				width: 1rem;
				margin-top: 1rem;
				margin-left: .5rem;
				transform: translateY(-.4rem);
			}
		}
	}
}

.single .post-date {
	&::after {
		display: inline-block;
		content: "";
		border-top: .3rem solid @primary-color;
		width: 1rem;
		margin-top: 1rem;
		margin-left: .5rem;
		transform: translateY(-.4rem);
	}
}

.gallery-item {
    float: left;
    margin-right: 1rem;
}

.post-date,
.excerpt-comments,
.post-edit {
	display: inline-block;
}

.excerpt-author,
.excerpt-category{
	&::after {
		display: inline-block;
		content: "";
		border-top: .3rem solid @primary-color;
		width: 1rem;
		margin-top: 1rem;
		transform: translateY(-.4rem);
	}
}

.edit-link {
	&::before {
		display: inline-block;
		content: "";
		border-top: .3rem solid @primary-color;
		width: 1rem;
		margin-top: 1rem;
		transform: translateY(-.4rem);
	}
}

.post-edit-link {
    margin-left: .4rem;
}

.single-post {
	.excerpt-category{
		&::after {
			width: 0;
		}
	}
}

.excerpt-category,
.excerpt-author {
	display: inline-block;
}

.excerpt-category {
	a {
		margin-right: .4rem;
	}
}

.excerpt-author * {
	display: inline-block;

	img {
		width: 3rem;
		height: auto;
		border-radius: 50%;
	}
}

.post-body .excerpt-author {
	img {
		margin-bottom: 0;
	}
}

.post-wrap {
	border-bottom: 1px solid @primary-color;
	padding-bottom: 1.5rem;
}

.featured-display {
	padding-bottom: 0;
}

.loop-container {
	padding-bottom: 0;

	.post {
		margin-bottom: 4.5rem;
	}
}

.single-post {
	h1 {
		margin-bottom: 1rem;
	}
}

.post-details {
	margin-bottom: .5rem;
}

.post-body {
	padding-top: 4rem;
	padding-bottom: 4rem;

	img {
		margin-bottom: 1rem;
	}
}

.pagination-single .pagination-nav {
    .prev,
    .next {
    	font-weight: 500;
    }
}

.pagination-single {
	margin: @font-size*2.5 0;

	.pagination-nav {
		font-size: @font-size*1.2;

		.previous-post-wrap {
			width: 50%;
			display: inline-block;

			.previous-post {
				font-size: @font-size/1.1;
				font-weight: 500;
			}
		}

		.next-post-wrap {
			width: 50%;
			text-align: right;
			float: right;

			.next-post {
				font-size: @font-size/1.1;
				font-weight: 500;
			}
		}
	}
}

.next-post-wrap,
.previous-post-wrap {

	a {
		color: @dark-color;

		&:hover {
			color: @primary-color;
		}
	}

	position: relative;

	&:before {
		color: @primary-color;
		font-size: 2rem;
		font-weight: 300;
		font-family: Fontawesome;
		line-height: .65;
		position: absolute;
		top: -2rem;
		width: 32px;
		opacity: 0;
		visibility: hidden;
		-webkit-transition: all .2s;
		transition: all .2s;
	}

	&:hover {
		&:before {
			opacity: 1;
			visibility: visible;
			right: 0;
		}
	}

}

.next-post-wrap {
	&:before {
		content: '\f178';
		right: 2rem;
	}
}

.previous-post-wrap {

		&:before {
			content: '\f177';
			left: 2rem;
		}

		&:hover {
			&:before {
				opacity: 1;
				visibility: visible;
				left: 0;
			}
		}
}

blockquote {
	position: relative;
	font-size: @font-size+.3;
	margin-bottom: @font-size;

	p {
		font-size: @font-size+.3;
	}

	&:before {
		content: "“";
		font-size: 7rem;
		position: absolute;
		top: -1rem;
		left: -3rem;
		line-height: 1;
	}
}

.post-content {
	ul {
		margin-bottom: @font-size;
	}
}

.says,
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.archive-title,
.search-title {
	padding-bottom: 0;

	h1 {
		margin-bottom: 0;
	}
}

.search-results {
	.hentry {
		padding-bottom: 2rem;
	}
}

.error-content {
	.search-form {
		margin-top: @font-size;
	}

	input {
		box-sizing: border-box;
	}
}

.post-pagination {
	text-align: center;
	padding: 0 0 @font-size 0;

	.page-numbers {
		padding: .2rem;
	}

	.pagination .page-numbers.prev::before,
	.pagination .page-numbers.next::after {
		font-size: 2rem;
		font-weight: 300;
		font-family: Fontawesome;
		line-height: .65;
		position: absolute;
		top: .5rem;
		width: 32px;
		-webkit-transition: all .3s;
		transition: all .3s;
	}

	.pagination .next {
		padding-right: 3.3rem;
	}

	.pagination .page-numbers.next::after {
		content: '\f178';
		right: 0;
	}

	.pagination .next:hover::after {
		right: -1rem;
	}

	.pagination .prev {
		padding-left: 3.3rem;
	}

	.pagination .page-numbers.prev::before {
		content: '\f177';
		left: 0;
	}

	.pagination .prev:hover::before {
		left: -1rem;
	}
}

.gallery {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
}

.gallery-columns-3 {
	.gallery-item {
		width: 32%;
	}
}

.gallery-item {
	img {
		display: block;
		margin: 0 auto;
	}

	.gallery-icon {
    	margin-bottom: 2rem;
	}
}

.post-password-form {
	label {
		display: inline-block;
	}
}

.top-bar {
	ul {
		margin-bottom: 0;
	}
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	.top-bar {
		display: none;
	}
}

.top-bar .textwidget {
	display: inline-block;
}

/*--------------------------------------------------------------
Social Menu
--------------------------------------------------------------*/
#menu-social-items a {
    color: @white-color;
}
.menu-social {
    z-index: 2;
    display: inline-block;
}
#menu-social,
#menu-social-items {
    margin-left: 0px;
    vertical-align: top;
}
#menu-social-items li {
    padding: 0;
    text-align: center;
    font-size: 0.8em;
    position: relative;
    list-style-type: none;
    display: inline-block;
    height: 3rem;
    margin-left: .6rem;
}
.menu-social li a:before {
    display: inline-block;
    padding: 0;
    vertical-align: top;
    font-family: 'FontAwesome';
    font-size: 1.4em;
    color: @white-color;
    -webkit-font-smoothing: antialiased;
}
.social-media-icons li:hover {
    background-color: #444;
}
.social-media-icons li:hover > a {
    color: #1ED3A4;
}

/* Menu uses Font Awesome icons */
.menu-social li a[href*="facebook.com"]::before { content: '\f09a'; }
.menu-social li a[href*="twitter.com"]::before { content: '\f099'; }
.menu-social li a[href*="github.com"]::before { content: '\f09b'; }
.menu-social li a[href*="linkedin.com"]::before { content: '\f0e1'; }
.menu-social li a[href*="wordpress.com"]::before,
.menu-social li a[href*="wordpress.org"]::before { content: '\f19a'; }
.menu-social li a[href*="tumblr.com"]::before { content: '\f173'; }
.menu-social li a[href*="plus.google.com"]::before { content: '\f0d5'; }
.menu-social li a[href*="dribbble.com"]::before { content: '\f17d'; }
.menu-social li a[href*="instagram.com"]::before { content: '\f16d'; }
.menu-social li a[href*="vimeo.com"]::before { content: '\f194'; }
.menu-social li a[href*="youtube.com"]::before { content: '\f167'; }
.menu-social li a[href*="pinterest.com"]::before { content: '\f0d2'; }
.menu-social li a[href*="flickr.com"]::before { content: '\f16e'; }
.menu-social li a[href*="bitbucket.com"]::before { content: '\f171'; }
.menu-social li a[href*="digg.com"]::before { content: '\f1a6'; }
.menu-social li a[href*="reddit.com"]::before { content: '\f1a1'; }
.menu-social li a[href*="codepen.io"]::before { content: '\f1cb'; }
.menu-social li a[href*="behance.com"]::before { content: '\f1b4'; }
.menu-social li a[href*="slideshare.net"]::before { content: '\f1e7'; }
.menu-social li a[href*="/feed"]::before { content: '\f413'; }
.menu-social li a[href*="subscribe"]::before { content: '\f410'; }

.menu-social li a span::before {
    width: 20px;
    height: 20px;
    color: #999;
    border-radius: 20px;
}

/* Skip link */
.skip-link {
	position: absolute;
	top: -50px !important;
	left: 10px;

	background-color: @white-color;
	color: @primary-color;

	border: 2px solid @primary-color;
	border-radius: 3px;
	padding: 6px 10px;
	z-index: 9;

	&:focus {
		top: 0 !important;
	}
}

.read-more {
  	position: relative;
  	background-color: @primary-color;
  	color: @white-color;
	font-weight: 500;
	display: inline-block;
	border: 2px solid @primary-color;
	margin-top: @font-size;
	padding: .8rem @font-size*1.5;
	border-radius: 50px;
	box-shadow: 0px 2px 16px 0px rgba(0,0,0,0.16);
	cursor: pointer;

	&::after {
		content: "\f0da";
		font-family: 'FontAwesome';
		font-size: @font-size;
		font-weight: 400;

		opacity: 0;
		transition:  all .1s ease-in;
	}

	&:hover {
		color: @white-color;

		&::after {
		  opacity: 1;
		  margin-left: 5px;
		}
	}
}
