/* ================= Table of Contents ==================

		1. Basic Styling
			1.1 Fonts
			1.2 Common Elements
			1.3 Button & Input
			1.4 Common Classes
		2. Header & Top Elements
		3. Footer
		4. Home Page
			4.1 Landing Section 
			4.2 Integrative Psychiatry 
			4.3 Meet the Doctor 
			4.4 Services 
			4.5 Testimonials 
	*/
	/* ====================================================

		1. Basic Styling

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

		/* ================================================
			1.1 Fonts
		================================================ */

			.avenir-regular{
				font-family: 'Avenir Next Regular';
			}
			.avenir-medium{
				font-family: 'Avenir Next Medium';
			}
			.baskerville{
				font-family: 'Baskerville', serif;
			}

		/* ================================================
			1.2 Common Elements
		================================================ */

			*{
				margin: 0 auto;
				padding: 0;
				-webkit-box-sizing: border-box; 
				-moz-box-sizing: border-box; 
				box-sizing: border-box;
				list-style: none;		
			}
			body {
				height: auto;	
				overflow: auto;		
				text-align: left;
				font-family: 'Avenir Next Regular', sans-serif;
				line-height: 1.5;
				background: #fff;			
			}
			.container{
				width: 1620px;
				margin: 0 auto;
				padding: 0 10px;
				overflow: hidden;
			}
			a{
				text-decoration: none;
				color: inherit;
				outline: 0;
			}
			h1{
				font-size: 75px;
				line-height: 102px;
				font-weight: 400;
				letter-spacing: 0.5px;
				color: #839DB2;
				font-family: 'Avenir Next Medium';
			}
			h1 span{
				font-family: 'Baskerville', serif;
				font-weight: 0;
				padding: 0 20px;
			}
			h4{
				font-size: 45px;
				color: #839DB2;
				text-transform: uppercase;
				line-height: 61px;
				font-family: 'Avenir Next Medium', sans-serif;
			}
			p{
				font-size: 18px;
				line-height: 30px;
				font-family: 'Avenir Next Regular', sans-serif;
				color: #A49F9C;	
			}
			.transition, nav ul li a:after{
				-webkit-transition: all 0.2s;
		        -moz-transition: all 0.2s;
		        -o-transition: all 0.2s;
		        -ms-transition: all 0.2s;
		        transition: all 0.2s;
			}

		/* ================================================
			1.3 Button & Input
		================================================ */

			button{
				border: none;
				outline: none;
			}
			input, select, textarea{
				border: none;
				outline: none;
				resize:none;
			    background: transparent;
			    -webkit-appearance: none;
			    -moz-appearance: none;
			    -o-appearance: none;
			    appearance: none;
			}
			textarea{
				-webkit-appearance: textarea;
				-webkit-rtl-ordering: logical;
		    	-webkit-user-select: text;
			}
			textarea::-ms-expand{
				display: none;
			}

		/* ================================================
			1.4 Common Classes
		================================================ */

			.col{
				float: left;
			}
			.col-1-2{
				width: 50%;
			}
			.col-1-3{
				width: 33.33%;
			}
			.col-1-4{
				width: 25%;
			}	
			.verticalCover{
				width: 100%;
				height: 100%;
				position: absolute;
				overflow: hidden;
			    display: table;
				z-index: 9;
			}
			.verticalOne{
				height:auto;
			    width:100%;
			    margin:auto;
			    top: 0;
			    bottom: 0;
			    display: table-cell;
			    vertical-align: middle;
			}
			.alignLeft{
				text-align: left;
			}
			.alignCenter{
				text-align: center;
			}			
			.alignRight{
				text-align: right;
			}
			.bgImage{
				background: url(../images/icons/no-image/logo-bg.png) no-repeat center center;
		  		background-position: center center;
		  		-webkit-background-size: cover;
				-moz-background-size: cover;
				-o-background-size: cover;
				background-size: cover;
				background-repeat: no-repeat;
			}
			.bgImage img{
				width: 100%;
				height: auto;
				display: block;
			}
			.fullTransparentBg{
				height: 100vh;
				width: 100vw;
				background: rgba(0,0,0,.48);
				position: fixed;
				left: 0;
				top: 0;
				z-index: 999;
				display: none;
				overflow: hidden;
			}
			.relative{
				position: relative;
			}
			.oh{
				overflow: hidden;
			}
			.circular{
				-webkit-border-radius: 100%;
		        -moz-border-radius: 100%;
		        -o-border-radius: 100%;
		        border-radius: 100%;
			}
			.lineMargin{
				height: 2px;
				width: 51px;
				background: #839DB2;
				margin: 40px auto;
				display: block;
			}
			.commonPadding{
				padding: 150px 0;
			}

		/* ================================================
			1.5 Loading Effect
		================================================ */

			#overlay{
				position: fixed;
				z-index: 9999999;
				top: 0;
				left: 0;
				bottom: 0;
				right: 0;
				background: #fff;
				-webkit-transition: 1s 0.4s;
				-moz-transition: 1s 0.4s;
				-o-transition: 1s 0.4s;
				transition: 1s 0.4s;
			}
			#progress{
				height: 1px;
				background: #839DB2;
				position: absolute;
				width: 0;
				top: 50%;
			}
			#progstat{
				position: absolute;
				top: 50%;
				margin-top: -40px;
				color: #839DB2;
				width: 100%;
				font-size: 20px;
				font-family: sans-serif;
				letter-spacing: 0;
			}

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

		2. Header & Top Elements 

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

		header{
			top: 0;
			left: 0;
			width: 100%;
			z-index: 9999;
			position: fixed;
			padding: 40px 0;
			border-bottom: solid 1px #ffffff;
		}
		header.fixed{
			background: #fff;
			border-bottom: solid 1px #f0f0f0;	
			padding: 20px 0;		
		}
		header .logo{
			position: absolute;
			left: 0;
			top: 0;
		}
		header .logo img{
			width: auto;
			display: block;
		}
		nav,
		nav ul{
			text-align: center;
		}
		nav ul li{
			display: inline-block;
			vertical-align: top;			
		}
		nav ul li a{
			display: block;
			color: #A49F9C;
			font-family: 'Avenir Next Regular', sans-serif;
			font-size: 16px;
			position: relative;
			font-weight: 200;
		}
		nav ul li a:after{
			position: absolute;
			content: '';
			top: 4px;			
			width: 1px;
			background: #A49F9C;
		}
		nav ul li:last-child a:after{
			display: none;
		}
		nav ul li a:hover,
		nav ul li a.current{
			color: #839DB2;
		}
		header .logo,
		header .logo img{
			height: 36px;
		}
		nav ul li{
			margin: 0 40px;
		}
		nav ul li a{
			line-height: 36px;
			letter-spacing: 2px;
		}
		nav ul li a:after{
			height: 29px;
			right: -40px;
		}
		header.fixed nav ul li a:after{
			height: 16px;
			top: 10px;
		}
		#menuBtn{
			display: none;
		}

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

		3. Footer

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

		footer{
			background: #839DB2;
		}
		footer h4{
			color: #fff;
			font-weight: 200;
			letter-spacing: 8px;
			line-height: 1;
		}
		footer hr{
			width: 40px;
			outline: none;
			border: none;
			height: 1px;
			background: #fff;
			margin: 60px auto;
		}
		footer p{
			color: #fff;
			font-size: 16px;
			letter-spacing: 1px;
		}
		footer p:hover{
			text-decoration: underline;
		}
		footer p span{
			font-family: 'Baskerville', serif;
			padding-right: 28px;
			font-size: 14px;
			position: relative;
		}
		footer p, footer p span{
			line-height: 20px;
		}
		footer p span:after{
			position: absolute;
			content: '';
			top: 0px;
			right: 14px;
			height: 16px;
			width: 1px;
			background: #fff;
		}
		footer .first, footer .second, footer .third{
			float: left;
		}
		footer .first{
			width: 330px;
		}
		footer .second{
			text-align: center;
			width: -webkit-calc(100% - 430px);
	        width: -moz-calc(100% - 430px);
	        width: -o-calc(100% - 430px);
	        width: calc(100% - 430px);
		}
		footer .second p{
			width: 50%;
			float: left;		
		}
		footer .second a:nth-child(1) p{
			text-align: right;
			padding-right: 10%;
		}
		footer .second a:nth-child(2) p{
			padding-left: 10%;
			text-align: left;
		}
		footer .third{
			width: 100px;
		}
		footer ul.social{
			text-align: right;
		}
		footer ul.social li{
			display: inline-block;
			vertical-align: top;
			margin: 0 2px;
		}
		footer ul.social li img{
			height: 26px;
			width: 26px;
			display: block;
		}
		footer .brandLine{
			margin-top: 92px;
		}
		footer .brandLine img{
			height: 40px;
		}
		footer .brandLine:before,
		footer .brandLine:after{
			position: absolute;
			content: '';
			background: #fff;
			top: 20px;
			height: 1px;
			width: -webkit-calc(50% - 60px);
	        width: -moz-calc(50% - 60px);
	        width: -o-calc(50% - 60px);
	        width: calc(50% - 60px);
		}
		footer .brandLine:before{
			left: 0;
		}
		footer .brandLine:after{
			right: 0;
		}

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

		4. Home Page 

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

		/* ================================================
			4.1 Landing Section 
		================================================ */

			#landingSection .container{
				height: 100vh;
			}
			#landingSection .titleHolder{
				height: 60px;
				margin-top: -240px;
			}
			#landingSection .titleHolder h1{
				line-height: 60px;
				width: 100%;
				position: absolute;
				top: 0;
				left: 0;
				margin-top: 102px;
				-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
				filter: alpha(opacity=0);
				-moz-opacity: 0;
				-khtml-opacity: 0;
				opacity: 0;
				line-height: 64px;
			}
			#landingSection p{
				max-width: 620px;
			}
			#landingSection img.flower,
			#landingSection img.lines{
				position: absolute;
				left: 50%;
			}
			#landingSection img.flower{
				height: 745px;
				width: 806px;				
				margin-left: -403px;
				bottom: -284px;
				z-index: 12;
			}
			#landingSection .divider{
				position: absolute;
				bottom: 0;
				height: 1px;
				width: 1192px;
				background: #839DB2;
				left: 50%;
				margin-left: -596px;
			}
			#landingSection img.lines{
				height: 902px;
				width: 902px;
				margin-left: -451px;
				z-index: 10;
				bottom: -451px;
			}
			#landingSection .cover{
				position: absolute;
				height: 451px;
				width: 902px;
				left: 50%;
				margin-left: -451px;
				z-index: 11;
				background: rgba(255,255,255,.9);
			}
			.infiniteRotate{
			    -webkit-animation-name: spinnerRotate;
			    -webkit-animation-duration: 50s;
			    -webkit-animation-iteration-count: infinite;
			    -webkit-animation-timing-function: linear;
			    -moz-animation-name: spinnerRotate;
			    -moz-animation-duration: 50s;
			    -moz-animation-iteration-count: infinite;
			    -moz-animation-timing-function: linear;
			    -ms-animation-name: spinnerRotate;
			    -ms-animation-duration: 50s;
			    -ms-animation-iteration-count: infinite;
			    -ms-animation-timing-function: linear;
			}
			@-webkit-keyframes spinnerRotate
			{
			    from{-webkit-transform:rotate(0deg);}
			    to{-webkit-transform:rotate(360deg);}
			}
			@-moz-keyframes spinnerRotate
			{
			    from{-moz-transform:rotate(0deg);}
			    to{-moz-transform:rotate(360deg);}
			}
			@-ms-keyframes spinnerRotate
			{
			    from{-ms-transform:rotate(0deg);}
			    to{-ms-transform:rotate(360deg);}
			}

		/* ================================================
			4.2 Integrative Psychiatry 
		================================================ */

			#integrativePsychiatry{
				height: 460px;
			}
			#integrativePsychiatry .container{
				position: absolute;
				height: auto;
				width: 100%;
				left: 0;
				top: 120px;
				z-index: 99;
			}
			#integrativePsychiatry h4,
			#meetTheDoctor h4,
			#testimonies h4{
				margin-bottom: 40px;
			}

		/* ================================================
			4.3 Meet the Doctor 
		================================================ */

			#meetTheDoctor{
			}
			#meetTheDoctor .container{
				border-bottom: solid 1px #839DB2;
			}
			#meetTheDoctor .col-1-2{
				height: 860px;
			}
			#meetTheDoctor img{
				height: 50%; 
				position: absolute;
				right: 30%;
				top: 25%;
				-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
				filter: alpha(opacity=0);
				-moz-opacity: 0;
				-khtml-opacity: 0;
				opacity: 0;
			}

		/* ================================================
			4.4 Wellness 
		================================================ */

			#wellness .commonPadding{
				padding-bottom: 0;
			}
			#wellness .container{
				border-bottom: solid 1px #839DB2;
				padding-bottom: 150px;
			}
			#wellness .inner,
			#servDesc .inner{
				max-width: 1400px;
			}
			#wellness .imgHolder{
				height: 150px;
			}
			#wellness .imgHolder img.back,
			#wellness .imgHolder img.front{
				position: absolute;
				left: 50%;
			}
			#wellness .imgHolder img.front{
				height: 80px;
				width: 80px;
				top: 35px;
				margin-left: -40px;
				z-index: 4;
			}
			#wellness .imgHolder img.back{
				height: 150px;
				width: 150px;
				top: 0;
				margin-left: -75px;
				z-index: 3;
				-webkit-transform: scale(0.5);
				-moz-transform: scale(0.5);
				-ms-transform: scale(0.5);
				-o-transform: scale(0.5);
				transform: scale(0.5);
			}
			.zoomIn{
				-webkit-animation: zoomIn 1.2s normal forwards;
				-moz-animation: zoomIn 1.2s normal forwards;
				-ms-animation: zoomIn 1.2s normal forwards;
				-o-animation: zoomIn 1.2s normal forwards;
				animation: zoomIn 1.2s normal forwards;
			}
			@-webkit-keyframes zoomIn
			{
			    0%{-webkit-transform:scale(0.5);}
			    100%{-webkit-transform:scale(1);}
			}
			@-moz-keyframes zoomIn
			{
			    0%{-moz-transform:scale(0.5);}
			    100%{-moz-transform:scale(1);}
			}
			@-ms-keyframes zoomIn
			{
			    0%{-ms-transform:scale(0.5);}
			    100%{-ms-transform:scale(1);}
			}
			@-o-keyframes zoomIn
			{
			    0%{-o-transform:scale(0.5);}
			    100%{-o-transform:scale(1);}
			}
			@keyframes zoomIn
			{
			    0%{transform:scale(0.5);}
			    100%{transform:scale(1);}
			}
			#wellness .col-1-3{
				height: 400px;
				overflow: hidden;
				position: relative;
			}
			#wellness .col-1-3:after{
				position: absolute;
				content: '';
				height: 6px;
				width: 6px;
				top: 160px;
				right: 0;
				background: #839DB2;
				-webkit-border-radius: 100%;
		        -moz-border-radius: 100%;
		        -o-border-radius: 100%;
		        border-radius: 100%;
			}
			#wellness .col-1-3:last-child:after{
				display: none;
			}
			#wellness h5{
				font-family: 'Avenir Next Medium';
				color: #839DB2;
				font-size: 20px;
				margin-bottom: 20px;
			}
			#wellness p{
				color: #839DB2;
				font-size: 16px;
				line-height: 28px;
				padding: 0 68px;
			}

		/* ================================================
			4.4 Services 
		================================================ */

			#services p{
				line-height: 45px;
			}
			#services p span{
				font-size: 28px;
			}
			#servDesc{
				background: #EDEEEF;
			}
			#servDesc h4{
				margin-bottom: 40px;
			}
			#servDesc .col-1-2:nth-child(1){
				padding-right: 180px;
			}
			#servDesc .col-1-2:nth-child(2){
				padding-left: 180px;
			}

		/* ================================================
			4.5 Testimonials 
		================================================ */

			#testimonies .slides p, #testimonies .slides h5{
				max-width: 860px;
			}
			#testimonies .slides p{
				position: relative;
			}
			#testimonies .slides p:after{
				position: absolute;
				content: url(../img/icons/quote.svg);
				top: -30px;
				left: -80px;
				height: 100px;
				width: 102px;
				-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=015)";
				filter: alpha(opacity=015);
				-moz-opacity: .15;
				-khtml-opacity: .15;
				opacity: .15;
			}
			#testimonies .slides h5{
				font-family: 'Baskerville', sans-serif;
				font-size: 20px;
				line-height: 28px;
				color: #A49F9C;
				font-weight: 200;
			}
			#testimonials{
				max-width: 1084px;
				position: relative;
				padding-bottom: 40px;
			}
			#testimonials ul.slides li{
				position: relative;
				height: 480px;
			}
		
			/* ====== FlexSlider Settings ====== */

			.flex-direction-nav a{
				display: block;
				width: 26px;
				height: 16px;
				cursor: pointer;
				z-index: 99;
				position: absolute;
				top: 50%;
				margin-top: -10px;
				text-shadow: none;
				color: transparent;
				outline: none;
			}
			.flex-direction-nav a:hover{
			}
			.flex-direction-nav .flex-prev{
				left: -10px;
				background: url(../img/icons/prev.svg) no-repeat 50% 50%;
				position: absolute;
				-webkit-transition: all 0.2s ease-in-out;
			    -moz-transition: all 0.2s ease-in-out;
			    -o-transition: all 0.2s ease-in-out;
			    -ms-transition: all 0.2s ease-in-out;
			    transition: all 0.2s ease-in-out;
			}
			.flex-direction-nav .flex-next{
				right: -10px;
				background: url(../img/icons/next.svg) no-repeat 50% 50%;
				position: absolute;
				-webkit-transition: all 0.2s ease-in-out;
			    -moz-transition: all 0.2s ease-in-out;
			    -o-transition: all 0.2s ease-in-out;
			    -ms-transition: all 0.2s ease-in-out;
			    transition: all 0.2s ease-in-out;
			}
			.flex-direction-nav .flex-prev,
			.flex-direction-nav .flex-next{
				-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
				filter: alpha(opacity=0);
				-moz-opacity: 0;
				-khtml-opacity: 0;
				opacity: 0;
			}
			#testimonies:hover .flex-direction-nav .flex-prev{
				left: 10px;
			}
			#testimonies:hover .flex-direction-nav .flex-next{
				right: 10px;
			}
			#testimonies:hover .flex-direction-nav .flex-prev,
			#testimonies:hover .flex-direction-nav .flex-next{
				-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
				filter: alpha(opacity=100);
				-moz-opacity: 1;
				-khtml-opacity: 1;
				opacity: 1;
			}
			.flex-control-nav{
				width: 100%;
				height: 12px;
				display: block;
				position: absolute;
				text-align: center;
				z-index: 99;
				bottom: 0px;
			}
			.flex-control-nav ul{
				width: 100%;
			}
			.flex-control-nav li{
				display: inline-block;
			}
			.flex-control-nav li a{
				display: inline-block;
				margin: 0 8px;
				height: 8px;
				width: 8px;
				-webkit-border-radius: 100%;
		        -moz-border-radius: 100%;
		        -o-border-radius: 100%;
		        border-radius: 100%;
				color: transparent;
				cursor: pointer;
				background: #839DB2;
				position: relative;
				-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
				filter: alpha(opacity=50);
				-moz-opacity: 0.5;
				-khtml-opacity: 0.5;
				opacity: 0.5;
			}
			.flex-control-nav li a.flex-active{		
				-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
				filter: alpha(opacity=100);
				-moz-opacity: 1;
				-khtml-opacity: 1;
				opacity: 1;
			}

		/* ================================================
			4.6 Media Rooms 
		================================================ */

			#mediaRoom{
				height: auto;
				border-top: solid 1px #f0f0f0;
			}
			ul.selectors{
				text-align: center;
			}
			ul.selectors li{
				display: inline-block;
				vertical-align: top;
				margin: 0 40px;
				border-bottom: solid 1px #fff;
				color: #A49F9C;
				font-family: 'Avenir Next Regular';
				font-size: 20px;
				cursor: pointer;
			}
			ul.selectors li:hover, ul.selectors li.current{
				border-bottom: solid 1px #839DB2;
				font-family: 'Avenir Next Medium';
				color: #839DB2;
			}
			.selectedContents{
				padding-top: 86px;
			}
			.selectedContents .content{
				text-align: center;
				display: none;
				height: 380px;
			}
			.selectedContents .current{
				display: inherit;
			}
			.selectedContents .content .one{
				display: inline-block;
				vertical-align: top;
				text-align: center;
				width: auto;
				padding: 0 48px;
				margin-bottom: 86px;
			}
			.selectedContents .content .one:last-child{
				margin-bottom: 0;
			}
			.selectedContents .content .one img{
				max-height: 185px;
				width: auto;
				display: block;
				margin-bottom: 40px;
			}
			.selectedContents .content .one h5{
				color: #A49F9C;
				height: 52px;
				font-size: 16px;
				margin-bottom: 10px;
			}
			.selectedContents .content .one p{
				font-size: 16px;
			}
			.selectedContents .content .one h5.heightAuto{
				height: auto;
				margin-bottom: 10px;
			}