/*--------------------------------------------------------------------------------------
Theme Name: DENTIST
Theme URI: http://quomodotheme.website
Author URI: http://quomodotheme.website
Description: 100% Responsive, Highly Customizable, SEO Friendly Dentist HTML template using Twitter Bootstrap Latest, Search Engine Friendly.
Author: QuomodoTheme
Version: 1.0
----------------------------------------------------------------------------------------
   1. BASE CSS
    2. TOP AREA
		2.1 MAINMENU AREA
        2.2 WELCOME SLIDER AREA
	3. ABOUT AREA
	4. SERVICE AREA
	5. TEAM AREA
	6. PROMOTIONS AREA
	7. TESTMONIAL AREA
	8. APPOINMENT AREA
	9. CONTACT AREA
	10. FOOTER AREA
    11. SCROLL TO TOP
    12. PRELOADER
----------------------------------------------------------------------------------------*/


/*--------------------
   1. BASE CSS
----------------------*/

@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500,700');
.alignleft {
	float: left;
	margin-right: 15px;
}

.alignright {
	float: right;
	margin-left: 15px;
}

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

a {
	color: #252525;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

a:focus,
a:hover {
	background: none;
	color: inherit;
	outline: 0;
	text-decoration: none;
}

.nav>li>a:focus,
.nav>li>a:hover {
	background: none;
}

button:focus {
	outline: 0;
}

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

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: 600;
	margin: 0 0 15px;
}

html,
body {
	height: 100%
}

body {
	font-family: 'Poppins', sans-serif;
	font-size: 16px;
	line-height: 1.5em;
	font-weight: 400;
	color: #252525;
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

.navbar-header .collapse,
.navbar-toggle {
	border: 2px solid #ffffff;
	border-radius: 0;
}

.navbar-toggle .icon-bar {
	background: #ffffff none repeat scroll 0 0;
}


/* Remove Chrome Input Field's Unwanted Yellow Background Color */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0px 1000px white inset !important;
}

.area-title {
	margin-bottom: 80px;
	position: relative;
}


/*-----------------------------------------*/

.area-title-and-icon {
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin-bottom: 60px;
}

.area-icon {
	background: rgba(0, 0, 0, 0) -webkit-gradient(linear, left top, right top, from(#50C0D9), to(#50C0D9)) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(to right, #50C0D9, #50C0D9) repeat scroll 0 0;
	color: transparent;
	font-size: 80px;
	height: 80px;
	line-height: 1;
	margin-right: 20px;
	width: 80px;
	-webkit-background-clip: text;
	-ms-background-clip: text;
	background-clip: text;
}

.area-title-and-icon>h2 {
	margin: 0;
}

.section-padding {
	padding: 100px 0;
}

.padding-top {
	padding-top: 100px;
}

.padding-bottom {
	padding-bottom: 100px;
}

.padding-left {
	padding-left: 50px;
}

.padding-right {
	padding-right: 50px;
}

.margin-bottom {
	margin-bottom: 50px;
}

.margin-top {
	margin-top: 50px;
}

.no-margin {
	margin: 0;
}

.no-padding {
	padding: 0;
}

.gray-bg {
	background: #f4f7f7;
}

.dark-bg {
	background: #262626;
	color: #ffffff;
}


/*--------------------------
    2. TOP AREA
---------------------------*/

.top-area {
	height: 100%;
	position: relative;
	width: 100%;
}

.top-area-bg {
	background: rgba(0, 0, 0, 0) url("img/slider/slide_1.jpg") no-repeat scroll center center / cover;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.top-area-bg::after {
	background: #000000 none repeat scroll 0 0;
	content: "";
	height: 100%;
	left: 0;
	opacity: 0.75;
	position: absolute;
	top: 0;
	width: 100%;
}


/*---------------------------------
    2.1 MAINMENU AREA
-----------------------------------*/

.header-top-area {
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 999;
}

.mainmenu-area {
	position: relative;
	z-index: 9999;
}

.mainmenu-area-bg {
	background: #fff none repeat scroll 0 0;
	height: 100%;
	left: 0;
	opacity: 0.5;
	position: absolute;
	top: 0;
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	width: 100%;
}

.is-sticky .mainmenu-area-bg {
	-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
	box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
	opacity: 1;
}

.navbar {
	border-bottom: 0 none;
	border-top: 0 none;
	margin-bottom: 0;
}

.logo {
	/*	display: inline-block;*/
	margin-top: 6px;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	/*	position: relative;
	z-index: 999999;*/
}

.is-sticky .logo {
	margin-top: 3px;
}

.is-sticky .navbar-header {
	margin-top: 5px;
}

.navbar-brand {
	padding: 0;
}

.navbar-brand>img {
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	width: 100%;
}

.is-sticky .navbar-brand>img {
	width: 68%;
}

a.navbar-brand {
	color: #fff;
	font-size: 30px;
	font-weight: 600;
	letter-spacing: 3px;
	line-height: inherit;
	text-transform: uppercase;
}

.navbar-brand {
	height: auto;
}

.is-sticky .mainmenu-area {
	z-index: 99999;
}

.mainmenu {
	float: right;
}

.mainmenu li {
	display: inline;
}

.mainmenu li a {
	background: none;
	display: inline-block;
	padding: 30px 10px;
	position: relative;
	z-index: 1;
}

.mainmenu li a::before {
	background: rgba(0, 0, 0, 0) -webkit-gradient(linear, left top, right top, from(#50C0D9), to(#50C0D9)) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(to right, #50C0D9, #50C0D9) repeat scroll 0 0;
	border-radius: 50px;
	content: "";
	height: 30px;
	left: 50%;
	opacity: 0;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	width: 100%;
	z-index: -1;
}

.mainmenu li a:hover,
.mainmenu li.active a {
	background: none;
	color: #ffffff;
}

.mainmenu li a:hover::before,
.mainmenu li.active a:before {
	opacity: 1;
	width: 110%;
}

.is-sticky .mainmenu li a {
	padding: 15px 10px;
}

.mean-container .mean-bar {
	background: transparent none repeat scroll 0 0;
	min-height: 0;
	padding: 0;
}

.mean-container a.meanmenu-reveal {
	border: 1px solid #464646;
	color: #252525;
	margin-top: -37px;
	padding: 4px 5px;
	position: absolute;
}

.mean-container a.meanmenu-reveal span {
	background: #252525 none repeat scroll 0 0;
}

.mean-container .mean-nav {
	margin-top: 10px;
}


/*-----------------------------------
    2.2 TOP BAR AREA
------------------------------------*/

.top-bar {
	background: rgba(255, 255, 255, 0.5) none repeat scroll 0 0;
	border-top: 1px solid #50C0D9;
	color: #fff;
}

.top-call-to-action {
	margin-top: 5px;
}

.top-call-to-action p {
	margin-bottom: 5px;
}

.top-call-to-action a {
	color: #fff;
	margin-left: 10px;
}

.right-social-bookmark {
	text-align: right;
}

.social-bookmark li {
	display: inline;
	margin: 0 -2px;
}

.social-bookmark li a {
	color: #fff;
	display: inline-block;
	min-width: 30px;
	padding: 7px;
	position: relative;
	z-index: 1;
}

.social-bookmark li a::before {
	background: rgba(0, 0, 0, 0) -webkit-gradient(linear, left top, right top, from(#50C0D9), to(#50C0D9)) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(to right, #50C0D9, #50C0D9) repeat scroll 0 0;
	content: "";
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	width: 100%;
	z-index: -1;
}

.social-bookmark li a:hover::before {
	opacity: 1;
}

.social-bookmark li a:hover {
	color: #fff;
}


/*-----------------------------------
    2.2 WELCOME SLIDER AREA
-------------------------------------*/

.welcome-slider-area {
	height: 100%;
	position: relative;
	z-index: 9;
}

.welcome-slider-area.owl-carousel div:not(.owl-controls) {
	height: 100%;
}

.welcome-single-slide {
	z-index: 9;
	position: relative;
}

.welcome-single-slide:before {
	background: #000 url(img/pattarn.png);
	content: "";
	height: 100%;
	left: 0;
	opacity: 0.5;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
}

.welcome-text {
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: #ffffff;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	height: 100%;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	left: 0;
	margin-bottom: 15px;
	margin-right: 15px;
	position: relative;
	padding-top: 100px;
	top: 0;
	width: 100%;
}

.welcome-text h1 {
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s;
	font-size: 60px;
	font-weight: 800;
	letter-spacing: 5px;
	line-height: 1;
	margin-bottom: 30px;
	position: relative;
	text-transform: uppercase;
}

.welcome-text h2 {
	-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
	background: #ddd none repeat scroll 0 0;
	border: 1px solid #50C0D9;
	color: #252525;
	font-size: 16px;
	letter-spacing: 2px;
	margin-bottom: 30px;
	padding: 15px;
	text-transform: uppercase;
}

.welcome-text p {
	-webkit-animation-delay: 0.7s;
	animation-delay: 0.7s;
	letter-spacing: 2px;
	margin-bottom: 40px;
}

.call-to-action {
	display: inline-block;
	height: auto !important;
	margin-bottom: 0;
	margin-top: 20px;
	-webkit-animation-delay: 0.9s;
	animation-delay: 0.9s;
}

.call-to-action a {
	border: 2px solid;
	border-radius: 50px;
	color: #fff;
	display: inline-block;
	letter-spacing: 2px;
	margin: 0 5px;
	overflow: hidden;
	padding: 10px 30px;
	position: relative;
	text-transform: uppercase;
	z-index: 1;
}

.call-to-action a::before {
	background: rgba(0, 0, 0, 0) -webkit-gradient(linear, left top, right top, from(#50C0D9), to(#50C0D9)) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(to right, #50C0D9, #50C0D9) repeat scroll 0 0;
	border: 2px solid;
	border-radius: 50px;
	content: "";
	height: 100%;
	left: 0;
	opacity: 1;
	position: absolute;
	top: 0;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	width: 100%;
	z-index: -1;
}

.call-to-action a.transparent::before {
	opacity: 0;
}

.call-to-action a.transparent:hover::before {
	opacity: 1;
}

.call-to-action a:hover::before {
	opacity: 0;
}

.slider-bg-one {
	background: url(img/slider/slide_1.jpg) no-repeat scroll center center / cover;
}

.slider-bg-two {
	background: url(img/slider/slide_2.jpg) no-repeat scroll center center / cover;
}

.welcome-slider-area.owl-carousel .owl-nav>div {
	background: #fff none repeat scroll 0 0;
	display: inline-block;
	font-size: 30px;
	height: 40px;
	margin: 0 5px;
	padding-top: 5px;
	text-align: center;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	width: 40px;
}

.welcome-slider-area.owl-carousel .owl-controls {
	bottom: 7%;
	position: absolute;
	right: 8.4%;
}

.welcome-slider-area.owl-carousel .owl-nav>div:hover {
	background: #50C0D9 none repeat scroll 0 0;
	color: #fff;
}


/*-----------------------------
	3. ABOUT AREA
------------------------------*/

.read-more {
	background: rgba(0, 0, 0, 0) -webkit-gradient(linear, left top, right top, from(#50C0D9), to(#50C0D9)) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(to right, #50C0D9, #50C0D9) repeat scroll 0 0;
	border-radius: 50px;
	color: #fff;
	display: inline-block;
	letter-spacing: 1px;
	margin-right: 10px;
	margin-top: 20px;
	padding: 10px 25px;
	text-transform: uppercase;
}

.read-more:hover {
	background: #252525;
	color: #fff;
}

.about-img {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.layer-two {
	margin-top: 80px;
}


/*-----------------------------
	4. SERVICE AREA
-------------------------------*/

.service-area {
	position: relative;
}

.area-image-bg {
	background: rgba(0, 0, 0, 0) url("img/area-bg.jpg") no-repeat scroll center center / cover;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.area-image-bg::after {
	background: #999 none repeat scroll 0 0;
	content: "";
	height: 100%;
	left: 0;
	opacity: 0.1;
	position: absolute;
	top: 0;
	width: 100%;
}

.service-top-content {
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.service-menu {}

.service-menu li {
	display: block;
}

.service-menu li a {
	color: #252525;
	display: block;
	margin-bottom: 5px;
	padding: 10px;
	position: relative;
	z-index: 1;
}

.service-menu li.active a {
	color: #ffffff;
}

.service-menu li a::before,
.service-menu li a::after {
	background: rgba(0, 0, 0, 0) -webkit-gradient(linear, left top, right top, from(#50C0D9), to(#50C0D9)) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(to right, #50C0D9, #50C0D9) repeat scroll 0 0;
	content: "";
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	width: 100%;
	z-index: -1;
}

.service-menu li a::after {
	background: transparent none repeat scroll 0 0;
	border-bottom: 22px solid transparent;
	border-left: 22px solid #50C0D9;
	border-top: 22px solid transparent;
	height: 0;
	left: auto;
	opacity: 0;
	right: -22px;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: left center 0;
	transform-origin: left center 0;
	width: 0;
}

.service-menu li.active a::before,
.service-menu li:hover a::before {
	opacity: 1;
}

.service-menu li.active a::after {
	opacity: 1;
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
}

.service-content {
	background: #fff none repeat scroll 0 0;
	padding: 20px;
}

.service-details {
	border: 1px solid #50C0D9;
	padding: 20px;
}


/*----------------------------
	5. TEAM AREA
------------------------------*/

.single-team {
	text-align: center;
}

.team-member-image {
	position: relative;
}

.team-member-image::before {
	left: 0;
	position: absolute;
	top: 0;
	content: "";
	width: 0;
	height: 0;
	border-top: 1px solid #50C0D9;
	border-left: 1px solid #50C0D9;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

.team-member-image::after {
	bottom: 0;
	right: 0;
	position: absolute;
	content: "";
	width: 0%;
	height: 0%;
	border-right: 1px solid #50C0D9;
	border-bottom: 1px solid #50C0D9;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

.single-team:hover .team-member-image:before,
.single-team:hover .team-member-image:after {
	width: 100%;
	height: 100%;
}


/*.team-member-details {
	background: #f9f9f9 none repeat scroll 0 0;
	padding: 20px;
}*/

.team-member-details {
	background: rgba(0, 0, 0, 0) url("img/area-bg.jpg") no-repeat scroll center center / cover;
	padding: 20px;
}

.team-member-details h3 {
	font-weight: 500;
	margin-bottom: 5px;
}

.team-member-details .social-bookmark li a {
	color: #252525;
	height: 35px;
	padding-bottom: inherit;
	padding-left: inherit;
	padding-right: inherit;
	padding-top: 5px;
	position: relative;
	width: 35px;
	z-index: 1;
}

.team-member-details .social-bookmark li a:hover {
	color: #ffffff;
}


/*-----------------------------
	6. PROMOTIONS AREA
------------------------------*/

.promotions-area {
	position: relative;
}

.promotions-area.section-padding {
	padding-bottom: 70px;
}

.single-promotions {
	background: #fff none repeat scroll 0 0;
	margin-bottom: 30px;
	padding: 30px;
	position: relative;
	text-align: center;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	z-index: 1;
}

.single-promotions::before {
	border: 1px solid #50C0D9;
	content: "";
	height: calc(100% - 20px);
	left: 10px;
	position: absolute;
	top: 10px;
	width: calc(100% - 20px);
	z-index: -1;
}

.promotions-icon {
	background: rgba(0, 0, 0, 0) -webkit-gradient(linear, left top, right top, from(#50C0D9), to(#50C0D9)) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(to right, #50C0D9, #50C0D9) repeat scroll 0 0;
	color: transparent;
	font-size: 36px;
	margin-bottom: 20px;
	-webkit-background-clip: text;
	-ms-background-clip: text;
	background-clip: text;
}

.single-promotions h4 {
	font-weight: 500;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

.single-promotions:hover {
	-webkit-box-shadow: 0 10px 15px #999;
	box-shadow: 0 10px 15px #999;
	-webkit-transform: translateY(-5px);
	transform: translateY(-5px);
}

.single-promotions:hover h4 {
	color: #50C0D9;
}


/*-----------------------------
	7. TESTMONIAL AREA
-------------------------------*/

.testmonial-area {
	position: relative;
}

.testmonial-area-bg {
	background: url("img/testmonial/testmonial-right-bg.jpg") no-repeat scroll right center / 50% 100%, rgba(0, 0, 0, 0) -webkit-gradient(linear, right top, left bottom, from(#50C0D9), to(#50C0D9)) repeat scroll 0 0;
	background: url("img/testmonial/testmonial-right-bg.jpg") no-repeat scroll right center / 50% 100%, rgba(0, 0, 0, 0) linear-gradient(to left bottom, #50C0D9, #50C0D9) repeat scroll 0 0;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.single-testmonial {
	padding-top: 50px;
	position: relative;
}

.member-thumb {
	border-radius: 50%;
	height: 100px;
	left: 50%;
	overflow: hidden;
	position: absolute;
	top: 0;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 100px;
	z-index: 999;
}

.member-details {
	color: #ffffff;
	border-radius: 50%;
	padding: 70px 40px;
	z-index: -1;
}

.member-details h3 {
	color: #ffffff;
	display: inline-block;
	font-size: 18px;
	font-weight: 500;
	letter-spacing: 2px;
	padding-bottom: 15px;
	position: relative;
	text-transform: uppercase;
}

.member-details h3::after {
	background: #fff none repeat scroll 0 0;
	bottom: 0;
	content: "";
	height: 2px;
	left: 50%;
	position: absolute;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 100px;
}

.testmonial-area .owl-controls {
	bottom: 20px;
	left: 50%;
	position: absolute;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

.testmonial-area .owl-dot {
	background: rgba(255, 255, 255, .5);
	border-radius: 50%;
	display: inline-block;
	height: 15px;
	margin: 0 5px;
	width: 15px;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

.testmonial-area .owl-dot.active {
	background: rgba(255, 255, 255, 1);
}


/*------------------------------
	8. APPOINMENT AREA
-------------------------------*/

.top-appoinment-area {
	margin-bottom: -100px;
	position: relative;
	z-index: 9;
}

.single-appoinment-box {
	background: rgba(0, 0, 0, 0) -webkit-gradient(linear, right top, left bottom, from(#50C0D9), to(#50C0D9)) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(to left bottom, #50C0D9, #50C0D9) repeat scroll 0 0;
	border-radius: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	min-height: 200px;
	padding: 20px;
}

.single-appoinment-box h3 {
	font-size: 18px;
	font-weight: 500;
}

.single-appoinment-box input {
	background: rgba(255, 255, 255, 0.5) none repeat scroll 0 0;
	border: 0 none;
	border-radius: 50px;
	margin: 5px 0;
	padding: 15px 20px;
	width: 100%;
	-webkit-transition: 0.3s;
	transition: 0.3s;
}

.single-appoinment-box input:focus {
	outline: 0;
}

.single-appoinment-box input:focus {
	background: rgba(255, 255, 255, 0.8) none repeat scroll 0 0;
}

#date_picker,
#time_picker,
#date_picker_2,
#time_picker_2 {
	display: inline-block;
	width: 48%;
}

#time_picker,
#time_picker_2 {
	float: right;
}

.single-appoinment-box>button {
	background: rgba(255, 255, 255, 0.5) none repeat scroll 0 0;
	border: 2px solid #fff;
	border-radius: 50px;
	display: inline-block;
	letter-spacing: 1px;
	margin: 10px auto;
	max-width: 200px;
	padding: 13px 20px;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}

.single-appoinment-box>button:hover {
	background: #fff none repeat scroll 0 0;
	border-color: #fff;
}

.bottom-founder-area {
	padding-top: 250px;
	position: relative;
}

.founder-name-and-title {
	margin-bottom: 30px;
}

.founder-name-and-title>h3 {
	color: #50C0D9;
	margin-bottom: 5px;
}

.founder-details h2 {
	font-weight: 500;
	line-height: 1.5;
}

.founder-details h2 span {
	font-weight: 700;
	color: #50C0D9;
}

.founder-image {
	bottom: -100px;
	position: absolute;
	right: 0;
}


/*------------------------------
	9. CONTACT AREA
-------------------------------*/

.single-contact {
	margin-bottom: 30px;
	padding-left: 55px;
	position: relative;
}

.contact-icon {
	border: 1px solid;
	border-radius: 50%;
	color: #50C0D9;
	font-size: 25px;
	height: 45px;
	left: 0;
	padding-top: 9px;
	position: absolute;
	text-align: center;
	width: 45px;
}

.contact-details h5 {
	margin-bottom: 5px;
}


/*------------------------------
	10. FOOTER AREA
-------------------------------*/

.footer-area {
	padding: 30px 0 15px;
	position: relative;
}

.footer-area a:hover {
	color: #50C0D9;
}

.footer-copyright social-bookmark ul {
	list-style: outside none none;
	margin: 0;
	padding: 0;
	text-align: right;
	margin-bottom: 10px;
}

.footer-social-boomark {
	text-align: right;
}

.footer-social-boomark .social-bookmark li a {
	color: #252525;
	display: inline-block;
	font-size: 16px;
	height: 30px;
	margin: 0 2px;
	padding-top: 2px;
	text-align: center;
	width: 30px;
}

.footer-social-boomark .social-bookmark li a:hover {
	color: #ffffff;
}


/*------------------------------
    11. SCROLL TO TOP
-------------------------------*/

a.scrolltotop {
	background: #252525 none repeat scroll 0 0;
	bottom: 20px;
	-webkit-box-shadow: 0 0 0 7px transparent;
	box-shadow: 0 0 0 7px transparent;
	color: #ffffff;
	display: none;
	font-size: 20px;
	height: 40px;
	padding-top: 7px;
	position: fixed;
	right: 20px;
	text-align: center;
	width: 40px;
	z-index: 99;
}

a.scrolltotop:hover {
	-webkit-box-shadow: 0 0 0 0 #50C0D9;
	box-shadow: 0 0 0 0 #50C0D9;
	background: #50C0D9;
	color: #fff;
}


/*-----------------------------
    12. PRELOADER
------------------------------*/

.preloader-spinner {
	border: 5px solid #50C0D9;
}
/*----------------------------------
10.Timeline area
------------------------------*/


.timeline-panel:hover {
	-webkit-box-shadow: 0 10px 15px #999;
	box-shadow: 0 10px 15px #999;
	-webkit-transform: translateY(-5px);
	transform: translateY(-5px);
}

.timeline-panel:hover h4 {
	color: #50C0D9;
}


.timeline {
    position: relative;
    display: block;
    margin: 0;
    padding: 10px 0;
}
.timeline:after, .timeline:before {
    content: " ";
    display: table;
}
.timeline:after {
    clear: both;
}
.timeline, .timeline>li {
    list-style: none;
}
.timeline>li:nth-child(even) {
    float: left;
    clear: left;
}
.timeline>li:nth-child(odd) {
    float: right;
    clear: right;
}
.timeline-line {
    display: inline-block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 4px;
    background-color: #eee;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.timeline-line+.timeline-item {
    margin-top: -20px;
}
.timeline-group {
    display: block;
    position: relative;
    margin: 20px 0;
    text-align: center;
    float: none!important;
    z-index: 1;
}
.timeline-poster {
    margin-top: -20px;
}
.timeline-poster .btn-link {
    color: #a1aab0;
}
.timeline-poster .btn-link.active, .timeline-poster .btn-link:active, .timeline-poster .btn-link:focus, .timeline-poster .btn-link:hover {
    color: #3e5771;
}
.timeline-item {
    position: relative;
    display: inline-block;
    width: 50%;
    padding: 0 30px 20px;
}
.timeline-item:nth-child(even):after, .timeline-item:nth-child(even):before {
    content: '';
    position: absolute;
    right: 19px;
    top: 10px;
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-left: 12px solid #ccc;
    z-index: 1;
}
.timeline-item:nth-child(even):after {
    right: 20px;
    top: 11px;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-left: 11px solid #fff;
}
.timeline-item:nth-child(even)>.timeline-badge {
    right: -6px;
}
.timeline-item:nth-child(odd):after, .timeline-item:nth-child(odd):before {
    content: '';
    position: absolute;
    left: 19px;
    top: 10px;
    width: 0;
    height: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-right: 12px solid #ccc;
    z-index: 1;
}
.timeline-item:nth-child(odd):after {
    left: 20px;
    top: 11px;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-right: 11px solid #fff;
}
.timeline-item:nth-child(odd)>.timeline-badge {
    left: -6px;
}
.timeline-item.block:nth-child(even), .timeline-item.block:nth-child(odd) {
    width: 100%;
    margin-top: 5px;
}
.timeline-item.block:nth-child(even):after, .timeline-item.block:nth-child(even):before, .timeline-item.block:nth-child(odd):after, .timeline-item.block:nth-child(odd):before {
    left: 50%;
    right: auto;
    top: -11px;
    border: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid #ccc;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.timeline-item.block:nth-child(even):after, .timeline-item.block:nth-child(odd):after {
    top: -10px;
    border: 0;
    border-left: 11px solid transparent;
    border-right: 11px solid transparent;
    border-bottom: 11px solid #fff;
}
.timeline-item.block:nth-child(even)>.timeline-badge, .timeline-item.block:nth-child(odd)>.timeline-badge {
    top: -28px;
    left: 50%;
    right: auto;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.timeline-item>.timeline-badge {
    position: absolute;
    top: 12px;
    z-index: 1;
}
.timeline-item>.timeline-badge>a {
    display: inline-block;
    width: 12px;
    height: 12px;
    border: 2px solid #999;
    border-radius: 24px;
    background-color: #fff;
    text-decoration: none;
    transition: all ease .3s;
}
.timeline-item>.timeline-badge>a.active, .timeline-item>.timeline-badge>a:active, .timeline-item>.timeline-badge>a:focus, .timeline-item>.timeline-badge>a:hover {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
}
.timeline-item>.timeline-panel {
    position: relative;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
}
.timeline-item>.timeline-panel:hover .timeline-actions {
    display: block;
}
.timeline-actions {
    display: none;
}
.timeline-content, .timeline-footer, .timeline-heading, .timeline-liveliness {
    padding: 10px 0 0 10px;
}
.timeline-heading+.timeline-content {
    padding-top: 0;
}
.timeline-date {
    font-size: 14px;
    color: #aaa;
}
.timeline-embed {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0;
}
.timeline-embed .embed-element, .timeline-embed embed, .timeline-embed iframe, .timeline-embed object {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%}
.timeline-img {
    display: block;
    padding: 5px 0;
}
.timeline-img.first {
    margin-right: -10px;
}
.timeline-img.middle {
    margin-right: -10px;
    margin-left: -10px;
}
.timeline-img.last {
    margin-left: -10px;
}
.timeline-footer, .timeline-liveliness, .timeline-resume {
    border-top: 1px solid #eee;
    background-color: #fbfcfc;
}
.timeline-footer {
    border-radius: 0 0 5px 5px;
}
.timeline-avatar {
    margin-top: -2px;
    margin-right: 10px;
}
.timeline-title {
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 1.42857;
    font-weight: 600;
    color: #3e5771;
    text-decoration: none;
}
.timeline-title>small {
    display: block;
    font-size: 12px;
    line-height: 1.5;
    color: #a1aab0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.timeline .media {
    border-bottom: 1px solid #eee;
}
.timeline .media, .timeline .media p {
    font-size: 13px;
}
.timeline .media:last-child {
    border-bottom: 0;
}
@media (max-width:991px) {
    .timeline {
    padding-left: 15px;
}
.timeline-line {
    left: 15px;
}
.timeline-group {
    display: inline-block;
    margin-left: 4px;
}
.timeline-item {
    width: 100%;
    margin-top: 0!important;
    padding-right: 10px;
}
.timeline-item.block:nth-child(even), .timeline-item.block:nth-child(odd) {
    padding-bottom: 0;
}
.timeline-item.block:nth-child(even):after, .timeline-item.block:nth-child(even):before, .timeline-item.block:nth-child(odd):after, .timeline-item.block:nth-child(odd):before, .timeline-item:nth-child(even):after, .timeline-item:nth-child(even):before, .timeline-item:nth-child(odd):after, .timeline-item:nth-child(odd):before {
    left: 19px;
    top: 10px;
    border: 0;
    border-top: 12px solid transparent;
    border-bottom: 12px solid transparent;
    border-right: 12px solid #ccc;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}
.timeline-item.block:nth-child(even):after, .timeline-item.block:nth-child(odd):after, .timeline-item:nth-child(even):after, .timeline-item:nth-child(odd):after {
    left: 20px;
    top: 11px;
    border-top: 11px solid transparent;
    border-bottom: 11px solid transparent;
    border-right: 11px solid #fff;
}
.timeline-item.block:nth-child(even)>.timeline-badge, .timeline-item.block:nth-child(odd)>.timeline-badge, .timeline-item:nth-child(even)>.timeline-badge, .timeline-item:nth-child(odd)>.timeline-badge {
    top: 12px;
    left: -6px;
    right: auto;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}
}@media (max-width:480px) {
    .timeline {
    padding: 0;
}
.timeline-line {
    display: none;
}
.timeline-item {
    display: block;
    padding: 0 0 20px!important;
}
.timeline-item.block:nth-child(even), .timeline-item.block:nth-child(odd), .timeline-item:nth-child(even), .timeline-item:nth-child(odd) {
    float: none;
    clear: both;
}
.timeline-item.block:nth-child(even):after, .timeline-item.block:nth-child(even):before, .timeline-item.block:nth-child(odd):after, .timeline-item.block:nth-child(odd):before, .timeline-item.timeline-poster>.timeline-badge, .timeline-item:nth-child(even):after, .timeline-item:nth-child(even):before, .timeline-item:nth-child(odd):after, .timeline-item:nth-child(odd):before {
    display: none;
}
.timeline-item>.timeline-badge {
    top: -8px!important;
    left: 50%!important;
    margin-left: -6px;
}
}.wrapkit-content-rtl .timeline-avatar {
    margin-right: 0;
    margin-left: 10px;
}

.timeline-heading { font-size: 20px; }

/*-----TIMELINE */
/* 13 social media icons */
.social-boxes {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 1;
    background-color: #fff;
    margin-right: 5px;
    box-shadow: 5px 5px 10px #777;
}

.social-box {
    text-align: center;
    padding: 8px 15px 8px 15px;
    color: #fff;

}

.social-box a {
    color: #fff;
    text-decoration: none;
    font-size: 20px;
}
.fab{
    color:#777
}
.fas{
    color:#777
}
.fas:hover {
    color: #50C0D9;
  }
  .fab:hover {
    color: #50C0D9;
  }

@media only screen and (max-width: 600px) {
    .social-boxes {
        position: fixed;
        width:100%;
        left: 0;
        right: 0;
        bottom: 0;
        transform: translateY(0);
        flex-direction: row;
        top: auto;
        z-index:100;
        justify-content: space-around;

       
    }
    .fab{
        color:#777
    }
    .fab:hover {
        color: #50C0D9;
      }
      #progress {
          bottom: 75px;
}
}
.recent-projects-text {
    background-color: white;
    box-shadow: -1px 10px 34px 1px rgba(0,0,0,0.15);
    -webkit-box-shadow: -1px 10px 34px 1px rgba(0,0,0,0.15);
    -moz-box-shadow: -1px 10px 34px 1px rgba(0,0,0,0.15);
    padding: 40px;
    border-radius: 30px;
    width: 90%;
    margin-top: -100px;
    z-index: 1;
    position: relative;
    margin-left: 40px;
}
.recent-projects-text h5 {
    font-weight: bold;
    padding-bottom: 30px;
}
.recent-projects-text h6 {
    font-size: 32px;
    font-weight: bold;
    display: inline;
    padding-right: 15px;
}
.recent-projects-text span {
    color: #666;
    font-weight: 500;
    text-transform: uppercase;
}
.recent-projects-text i:hover svg{
    fill: white;
}
.recent-projects-text i {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    position: absolute;
    border: 1px solid #D9D9D9;
    border-radius: 50%;
    justify-content: center;
    right: 10px;
    bottom: 10px;
}
.recent-projects-text i:hover{
    background-color: #50C0D9;
}

.recent-projects-text:hover {
    box-shadow: -1px 10px 34px 1px rgb(0 0 0 / 0%);
    -webkit-box-shadow: -1px 10px 34px 1px rgb(0 0 0 / 0%);
    -moz-box-shadow: -1px 10px 34px 1px rgba(0,0,0,0.15);
}

.recent-projects-text h5,.recent-projects-text i,.recent-projects-text i svg{
      transition: .3s ease-in-out;
}

/*---------------------------
recent-projects
 ---------------------------*/
 .recent-projects-img {
    margin-bottom: 55px;
    width: 100%;
}
.recent-projects-img img{
    width: 100%;
	border-radius: 20px;
    width: 100%;
	margin-bottom: 55px;
}
#demoMap {
	width: 100%; /* This can be in pixels or any other CSS units as well */
	height: 500px; /* Set this to whatever height you want */
}

 /* 12. video */
 @media (max-width:480px) {
 .navbar .container{
	background-color: #eeeeee;
 }
}
#demoMap {
	width: 100%; /* This can be in pixels or any other CSS units as well */
	height: 500px; /* Set this to whatever height you want */
}
/* Banner */

.page-breadcrumb {
	background-color: #50C0D9;
    position: relative;
    bottom: 0;
    width: 100%;
    padding: 18px 32px;
    border-radius: 40px;
    margin-top: 40px;
    transform: translateY(25px);
}
.page-breadcrumb li {
    position: relative;
    display: inline-block;
    margin-right: 20px;
    padding-right: 20px;
    color: #fff;
    font-weight: bold;
    font-size: 16px;
    text-transform: capitalize;
}
.page-breadcrumb li:after {
  position: absolute;
  content: "|";
  right: -6px;
  top: 1px;
  color: #fff;
  font-size: 14px;
}
.page-breadcrumb li:last-child {
  padding-right: 0px;
  margin-right: 0px;
}
.page-breadcrumb li:last-child::after {
  display: none;
}
.page-breadcrumb li a {
  font-weight: bold;
  text-transform: capitalize;
  transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  font-size: 16px;
  color: white;
  text-transform: capitalize;
}
.page-breadcrumb li a:hover {
  color: #ffffff;
}
/* =================================================================*/





.service-menu2 li {
	display: block;
}

.service-menu2 li a {
	color: #252525;
	display: block;
	margin-bottom: 5px;
	padding: 10px;
	position: relative;
	z-index: 1;
}

.service-menu2 li.active a {
	color: #ffffff;
}

.service-menu2 li a::after,
.service-menu2 li a::before {
	background: rgba(0, 0, 0, 0) -webkit-gradient(linear, left top, right top, from(#50C0D9), to(#50C0D9)) repeat scroll 0 0;
	background: rgba(0, 0, 0, 0) linear-gradient(to right, #50C0D9, #50C0D9) repeat scroll 0 0;
	content: "";
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	width: 100%;
	z-index: -1;
}

.service-menu2 li a::before {
	background: transparent none repeat scroll 0 0;
	border-bottom: 22px solid transparent;
	border-right: 22px solid #50C0D9;
	border-top: 22px solid transparent;
	height: 0;
	left: auto;
	opacity: 0;
	left: -22px;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: left center 0;
	transform-origin: right center 0;
	width: 0;
}

.service-menu2 li.active a::after,
.service-menu2 li:hover a::after {
	opacity: 1;
}

.service-menu2 li.active a::before {
	opacity: 1;
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
}



/* =================================================================*/