FlashLens_studio/scss/_site-blocks.scss

.untree_co_slider {


	.slick-slide {
		
		margin: 0 5px;
		width: 20px;
		transform: scale(0.9);
		transition: .3s all ease;
		opacity: .4;
		&:active, &:focus {
			outline: none;
		}
		> img {

		}
		&.slick-center {
			opacity: 1;
			transform: scale(1.0);
			> img {
				box-shadow: 0 15px 30px 0 rgba($black, .2);
			}
		}	
	}

	
	.slick-list {
		margin: 0 -5px;
		padding-bottom: 50px!important;
	}

	.item {
		position: relative;
		&:before {
			content: "";
			position: absolute;
			bottom: 0;
			left: 0;
			right: 0;
			top: 0;
			background: rgb(0,0,0);
			background: linear-gradient(0deg, rgba(0,0,0,.5) 0%, rgba(0,0,0,0) 100%);
		}
	}
	
}

.untree_co_slider-wrap {
	position: relative;
	background: $light url('../images/subtle_zebra_3d.png') repeat top left;
	padding: 7rem 0;
	.nav-direction {
		position: absolute;
		z-index: 2;
		height: 50px;
		top: 50%;
		width: 100%;
		transform: translateY(-50%);
		margin-top: -25px;
		.nav-left, 
		.nav-right {
			font-size: 30px;
			width: 50px;
			height: 50px;
			line-height: 50px;
			border-radius: 50%;
			text-align: center;
			position: absolute;
			background: $primary;
			color: $white;
			> span {
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
			}
			

			&.slick-disabled {
				display: none!important;
			}
		}
		.nav-left {
			left: 14%;
			@include media-breakpoint-down(md) {
				left: 0%;
			}
		}
		.nav-right {
			right: 14%;	
			@include media-breakpoint-down(md) {
				right: 0%;
			}
		}
	}

	.property-contents {
		position: absolute;
		bottom: 20px;
		right: 20px;
		margin-top: 0px;
		width: 300px;
		padding: 30px;
		z-index: 9;
		@include media-breakpoint-down(md) {
			position: absolute;
			background: none;
			color: $white;
			bottom: 20px;
			right: 20px;
			padding: 0;
			width: auto;
			padding-left: 10px;
		}
		.current-price {
			display: block;
			font-size: 30px;
			color: $white!important;
		}
		.old-price {
			text-decoration: line-through;
			color: rgba($white, .5);
			display: block;
			margin-bottom: 10px;
			@include media-breakpoint-down(md) {
				color: $white;
			}
		}
		h2 {
			font-size: 15px;
			font-weight: 400;
			margin: 0;
			a {
				color: $white;
				@include media-breakpoint-down(md) {
					color: $white;
				}
			}
		}
		strong {
			color: $black;
			@include media-breakpoint-down(md) {
				color: $white!important;
			}
		}
	}

	.specs {
		li {
			padding-right: 20px;
		}
		.icon-wrap {
			font-size: 25px;
			margin-right: 10px;
		}
	}

	.property_details {
		position: absolute;
		bottom: 0;
		z-index: 9;
		left: 0;
		right: 0;
		color: $white;
		padding: 30px 30px 15px 30px;		
		div {
			.caption {
				color: $white;
				font-size: 12px;
			}
			.number {
				font-size: 18px;
			}
			.icon {
				font-size: 20px;
				margin-right: 10px;
				span {
					font-size: 20px;
					
				}
			}
		}
		.detail {
			position: relative;
			&:after {
				content: "";
				position: absolute;
				height: 20px;
				right: 20%;
				background: rgba($white, .5);
				width: 1px;
				top: 50%;
				transform: translateY(-50%);
			}
			&:last-child {
				&:after {
					display: none;
				}
			}
		}
	}
}

.untree_co-section {
	padding: 70px 0;
	.heading {
		font-size: 20px;
	}
	.heading-2 {
		font-size: 30px;
		color: $primary;
		@include media-breakpoint-down(md) {
			font-size: 30px;
		}
	}
}

.service {
	text-align: center;
	.icon-wrap {
		position: relative;
		margin-bottom: 20px;
		display: inline-block;
		span {
			font-size: 50px;
			color: $secondary;
		}
		&:before {
			top: 0;
			left: -10px;
			width: 55px;
			height: 55px;
			position: absolute;
			content: "";
			background: rgba($secondary, .1);
			border-radius: 50%;
		}
	}
	h3 {
		font-size: 16px;
		a {
			color: $black;
		}
	}
}

.property-entry {
	margin-bottom: 30px;
	.price {
		font-size: 30px;
		display: block;
		color: $secondary;
		margin-bottom: 15px;
	}
	.specs {
		padding: 0;
		margin: 0 0 15px 0;
		li {
			display: inline-block;
			margin-right: 10px;
			.icon-wrap {
				font-size: 26px;
				margin-right: 5px;
			}
		}
	}

	.property-specs {
		position: relative;
		background: $white;
		padding: 30px;
		width: calc(100% - 0px);
		margin-left: 0px;
		margin-right: 0px;
		margin-top: -15px;
		// box-shadow: 0 15px 30px 0 rgba($black, .05);
		
		strong {
			color: $black;
		}
		
	}

	.location {
		h3 {
			font-size: 15px;
			a {
				color: $black;
			}
		}
	}
	.more {
		position: relative;
		> a {
			position: relative;
			display: inline-block;
			width: 45px;
			height: 40px;
			background: $secondary;
			border-radius: 4px;
			span {
				color: $white;
				font-size: 20px;
				display: inline-block;
				transform: translate(-50%, -50%) rotate(180deg);
				position: absolute;
				top: 50%;
				left: 50%;

			}
		}
	}
}


.list-icons {
	li {
		margin-bottom: 30px;
		a {
			> .icon-wrap {
				display: inline-block;
				width:60px;
				height: 60px;
				flex: 0 0 60px;
				border-radius: 50%;
				background: $white;
				position: relative;
				margin-right: 20px;
				box-shadow: 0 15px 30px 0 rgba($black, .05);
				> span {
					position: absolute;
					top: 50%;
					left: 50%;
					color: $primary;
					font-size: 30px;
					transform: translate(-50%, -50%)
				}
			}
			> .text {
				color: $black;
				font-size: 16px;
				line-height: 1.5;
			}
		}
	}
}

.margin-left-offset {
	margin-left: -70px;
	position: relative;
	@include media-breakpoint-down(md) {
		margin-left: 0px;
	}
}
.subtitle {
	font-weight: 700;
	color: $secondary;
	display: block;
	font-size: 16px;
	font-weight: 400;
}

.untree_co-testimonial {
	padding: 30px 30px 30px 30px;
	background: darken($light, 5%);
	border-radius: 4px;
	color: $black;
	position: relative;
	
	blockquote {
		font-size: 16px;
		margin-bottom: 30px;
		font-style: italic;
	}
	.author {
		.author-name {
			strong {
				color: $primary;
			}
			span {
				color: darken($light, 55%);
			}
		}
		.author-picture {
			flex: 0 0 50px;
			> img  {
				width: 50px;
				border-radius: 50%;
			}
		}
	}
}

.owl-nav {
	display: none;
}
.owl-3-slider {
	.owl-carousel {
		.owl-stage-outer  {
			padding-bottom: 40px;
		}
	}
}


.properties-nav-direction {
	> a {
		display: inline-block;
		width: 40px;
		height: 40px;
		border-radius: 4px;
		background: $secondary;
		color: $white;
		position: relative;
		> span {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			font-size: 20px;
		}
		&.next {
			position: relative;
			transform: rotate(-180deg);
		}
		&:hover {
			background: $primary;
		}
	}
}


.feature-v2 {
	padding: 40px;
	border: 1px solid darken($light, 5%);
	&:hover {
		border: 1px solid transparent;
		box-shadow: 0 15px 30px 0 rgba($black, .05);
	}
	.icon-wrap {
		width: 50px;
		height: 50px;
		position: relative;
		background: $primary;
		border-radius: 4px;
		flex: 0 0 50px;
		margin-right: 40px;
		> span {
			color: $white;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			font-size: 20px;
		}
	}
	.text {
		// padding: 0 50px;
	}
	.heading {
		font-size: 18px;
		color: $black;
	}
	p {
		color: #999;
	}
}

.untree_co-pagination {
	text-align: center;
	li {
		display: inline-block;
		a, span {
			width: 40px;
			height: 40px;
			line-height: 40px;
			display: inline-block;
			border-radius: 4px;
			font-size: 18px;
		}
		span {
			background: $primary;
			color: $white;
			box-shadow: 0 5px 10px 0 rgba($black, .2)
		}
	}
}

.team {
	img {
		margin-bottom: 10px;
	}
	h3 {
		font-size: 16px!important;
		margin-bottom: 0;
	}
	p {
		font-size: 14px;
	}
}