@charset "UTF-8"; 
/*------------------------------------------------------------------
[Master Stylesheet]
Project:	BERYL
++++ Imports ++++
++++ Reset ++++
++++ Main ++++
++++ Color Styles ++++
++++ Mediaqueries ++++
-------------------------------------------------------------------*/

/****************************/
/** Imports **/
/****************************/
@import "jquery.countdown.css";	
@import "animate.css";	
@import "owl.carousel.css";	
@import "component2.css";	
@import "font-awesome.min.css";	
@import "bootstrap.min.css";	
@import "inputtext.css";	
@import "modalcomponent.css";	
@import "pe-icon-7-stroke.css";	

$primery_color_1: #1cb9cb;
$primery_color_2: #449dde;
$primery_color_3: #96c346;
$primery_color_4: #e6ae48;
$primery_color_5: #f26522;
$primery_color_6: #f5245e;
$secondery_color:#fff;
$tertiary_color: #333333;
$background_img:url("../img/bg-dark.jpg");
$about_background_img:url("../img/leftbg.jpg");
$contact_background_img:url("../img/rightbg.jpg");


$font_head: 'Poppins', sans-serif;
$font_main: 'Ubuntu', sans-serif;

@mixin background-opacity($color, $opacity: 0.6) {
    background: $color; /* The Fallback */
    background: rgba($color, $opacity);
}

@mixin transition($transition...) {
    -moz-transition:    $transition;
    -o-transition:      $transition;
    -webkit-transition: $transition;
    transition:         $transition;
}
@mixin transform($transforms...) {
	   -moz-transform: $transforms;
	     -o-transform: $transforms;
	    -ms-transform: $transforms;
	-webkit-transform: $transforms;
          transform: $transforms;
}
@mixin transform-origin ($transform-origin...) {
    -moz-transform-origin: $transform-origin;
	     -o-transform-origin: $transform-origin;
	    -ms-transform-origin: $transform-origin;
	-webkit-transform-origin: $transform-origin;
          transform-origin: $transform-origin;
}
@mixin clear() {
	overflow:hidden;
	clear:both;
	float:none;
}

/****************************/
/** Reset **/
/****************************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, a, abbr, acronym,address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

strong{
	font-weight:bold;
}
 
body {
	color: $secondery_color;
	font-family:$font_main;
	font-size: 14px;
	font-style: normal;
	line-height:1.5;
	overflow-y:auto;
}

a:hover,a:active {
    outline: 0;
}

button:focus{
	border:none;
	outline:0;
}

ul {
    list-style: none;
}

a {
    color: $secondery_color;
    text-decoration: none;
}

a:hover {
    color: $secondery_color;
    text-decoration: none;
}

a:focus {
 	color: $secondery_color;
    text-decoration: none;
    outline: none;
}
h1,h2,h3,h4,h5,h6 {
	font-family:$font_head;
	letter-spacing:-0.5px;
	font-weight:600;
}
h1{
	color:$secondery_color;
	font-size:150px;
	line-height:180px;
	font-weight:700;
}
h2{
	color:$tertiary_color;
	font-size: 34px;
    line-height: 44px;
    margin-bottom: 20px;
}
h4{
	font-size:24px;
	line-height:30px;
	margin-bottom:20px;
	text-transform:capitalize;
}
h5{
	font-size:18px;
	line-height:25px;
	margin-bottom:5px;
	text-transform:uppercase;
	color:$secondery_color;
}
h6{
	font-size:11px;
	line-height:25px;
	margin-bottom:10px;
	text-transform:uppercase;
}
p{
	font-size:15px;
	font-weight:400;
	color:#8d8d8d;
	line-height:25px;
	&.lead {
		font-size:18px;
		line-height:29px;
		margin-bottom:0;
	}
}
.force-UTF-8{
    content: "¡";
}
/****************************/
/** Main **/
/****************************/

.padding-zero {
	padding:0;
}
.padding-left-zero {
	padding-left:0;
}
.padding-right-zero {
	padding-left:0;
}
.padding-left-100 {
	padding-left:100px;
}
.padding-left-50 {
	padding-left:50px;
}
.padding-left-75 {
	padding-left:75px;
}
.padding-right-75 {
	padding-right:75px;
}
.padding-right-50 {
	padding-right:50px;
}
.padding-top-100 {
	padding-top:100px;
}
.sec-pad {
	padding-top:150px;
	padding-bottom:150px;
}
.sec-pad-top {
	padding-top:150px;
}
.sec-pad-bottom {
	padding-bottom:150px;
}
.margin-top-175  {
	margin-top:175px;
}
.margin-top-85 {
	margin-top:85px;
}
.margin-top-50 {
	margin-top:50px;
}
.margin-top-35 {
	margin-top:35px;
}
.margin-top-25 {
	margin-top:25px;
}
.margin-top-20 {
	margin-top:20px;
}
.margin-top-10 {
	margin-top:10px;
}
.margin-bottom-50 {
	margin-bottom:50px;
}
.margin-bottom-45 {
	margin-bottom:45px;
}
.margin-bottom-30 {
	margin-bottom:30px;
}
.margin-bottom-25 {
	margin-bottom:25px;
}
.margin-bottom-20 {
	margin-bottom:20px;
}
.margin-bottom-10 {
	margin-bottom:10px;
}
.opacity-hide {
	opacity:0!important;
	visibility:hidden!important;
}
.table-wrap {
	width:100%;
	height:100%;
	display:table;
}
.tablecell {
	vertical-align:middle;
	display:table-cell;
}
.align-center {
   @include clear;
   margin:0 auto;
}
.clearfix{
	@include clear;
}
.preloader-it {
	background: #fff;
	position: fixed;
	z-index: 1000;
	height: 100%;
	width: 100%;
	overflow:hidden!important;
}
/* Effect 1: YouTube loading */
.la-anim-1 {
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 5px;
	-webkit-transform: translate3d(-100%, 0, 0);
	transform: translate3d(-100%, 0, 0);
	pointer-events: none;
}
.la-anim-1::after {
	position: absolute;
	top: 0;
	right: 0;
	width: 100px;
	height: 100%;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.2s, box-shadow 2s 4s;
	transition: opacity 0.2s, box-shadow 2s 4s;
	-webkit-transform: rotate(2deg) translateY(-2px);
	transform: rotate(2deg) translateY(-2px);
}
.la-anim-1.la-animate {
	z-index: 100;
	opacity: 1;
	-webkit-transition: -webkit-transform 5s ease-in, opacity 1s 5s;
	transition: transform 5s ease-in, opacity 1s 5s;
	-webkit-transform: translate3d(0%, 0, 0);
	transform: translate3d(0%, 0, 0);
}
.la-anim-1.la-animate::after {
	opacity: 1;
}
.nicescroll-rails.nicescroll-rails-vr {
    z-index: 999 !important;
}
.btn{
	font-size:11px;
	color:#fff;
	display:inline-block;
	letter-spacing:1px;
	overflow:hidden;
	font-weight:700;
	position:relative;
	text-transform:uppercase;
	height:57px;
	outline:none;
	border:none;
	width:182px;
	border-radius:2px;
	padding: 7px 20px;
	.btn-label {
		padding: 14px 0;
	}
	@include transition(all 0.9s cubic-bezier(0.19, 1, 0.22, 1) 0s);
	 &:hover,&:focus,&:active {
        outline:none!important;
		border:none!important;
		color:#fff !important;
	}
	
	span {
		position:relative;
		z-index:2;
		display:inline-block;
	}
	
		.mask {
			background:rgba(0,0,0,.2);
			border-radius:2px;
			display: block;
			height: 100%;
			left: 0;
			position: absolute;
			top: 0;
			width: 0;
			z-index:1;
			@include transition(all 1.1s cubic-bezier(0.19, 1, 0.22, 1) 0s);
		}
	&:hover {
		.mask {
			width: 100%;
		}
	}
	&.alternate-bg {
		background:$tertiary_color!important;
	}
}	
.notify-cmpt.notify-form-type-3 {
	h2 {
		margin-bottom:0;
		color:$secondery_color;
	}
	.input-wrap {
		i {
			display:none;
		}
	}
	&.md-content {
		background: url('../img/newsletterimg.jpg');
		text-align:center;
		border-radius:2px;
		 p {
			margin-top:12px;
			color:#8d8d8d;	
		}
		
		.md-content-wrap {
			padding-top:123px;
		}
	}
	 .notify-btn {
		bottom: 0;
		left:0;
		position: relative;
	}
	.notify-wrap {
		
		#message {
			font-size: 15px;
			line-height: 25px;
			padding-left:0;
			padding-top: 10px;
			min-height: 35px;
		}
		#notify_close {
			cursor: pointer;
			font-size: 20px;
			position: absolute;
			right: 25px;
			top: 20px;
			span {
				color:#fff;
			}
		}
			
		.btn {
			width:335px;
			margin-top: 27px;
			-webkit-transform:translateZ(0);
			-webkit-backface-visibility: hidden;
			transform:translateZ(0);
			backface-visibility: hidden;
			padding: 0 30px!important;
			.mask {
				z-index:-1;
			}
			}
			
		.notify-input-box {
				box-shadow: none;
				width:335px;
				text-align:center;
				min-height: 57px;
				padding:0;
				color:$tertiary_color;
				background:#f7f7f9;
				margin-top:42px;
				border-radius:2px;
				border:none;
			 &:hover,&:focus,&:active {
			    box-shadow:none;
			}
		}
	}
}
.side {
	&.side-left {
		background:$background_img;
		background-size:cover;
		background-position:center;
		background-repeat:no-repeat;
		.content-wrap {
			height:100%;
			.logo {
				position:absolute;
				top:75px;
			}
			.tlt {
				@extend h1;
			}
		}
		.side-left-overlay {
			background-image:url(../img/bg_pattern.png);
			position:absolute;
			height:100%;
			width:100%;
			left:0;
			top:0;
			z-index:-1;
		}
		
		p {
			color:$secondery_color;
		}
		.social-icons-wrap {
			bottom: 75px;
			left: 75px;
			position: absolute;
			i {
				line-height: 25px;
			}
			p {
				font-size:12px;
				display:inline-block;
				float:left;
			}
		.social-icon {
				display: block;
				color:$secondery_color;
				font-size:14px;
				@include transition(all .4s ease);
				i {
					@include transition(all .4s ease);
				}
			}
			.social-icons > li {
				display: inline-block;
				float:left;
				padding-right:15px;
			}

			.social-icons {
				float:left;
			}
		}
	}
	&.side-right {
		.about-info {
			height:100%;
			.btn:nth-child(3) {
				margin-right:25px;
			}
		}
		.copyright-text p{
			position:absolute;
			left:75px;
			bottom:75px;
			font-size:11px;
		}
	}
}
.fa {
	-webkit-appearance:none;
	-webkit-backface-visibility:hidden;
}
@-webkit-keyframes back_ken {
	0% {
	-webkit-transform: scale(1);
	}

	50% {
	-webkit-transform: scale(1.2);
	}

	100% {
	-webkit-transform: scale(1) ;
	}
}
@-moz-keyframes back_ken {
	0% {
	-moz-transform: scale(1);
	}

	50% {
	-moz-transform: scale(1.2);
	}

	100% {
	-moz-transform: scale(1) ;
	}
}
@-o-keyframes back_ken {
	0% {
	-o-transform: scale(1);
	}

	50% {
	-o-transform: scale(1.2);
	}

	100% {
	-o-transform: scale(1) ;
	}
}
@keyframes back_ken {
	0% {
	transform: scale(1);
	}

	50% {
	transform: scale(1.2);
	}

	100% {
	transform: scale(1) ;
	}
}
.page {
	.close-btn {
		position:fixed;
		right:40px;
		top:25px;
		font-size:20px;
		color:$tertiary_color;
		cursor:pointer;
		z-index:1;
	}
	&.page-left {
		.about-content-wrap {
			background:#f7f7f9;
		}
		.about-img-wrap{
			overflow:hidden;
			.about-img {
				background:url(../img/aboutimg.jpg);
				background-size:cover;
				background-position:center;
				background-repeat:no-repeat;
				min-height:630px;
				animation: 60s ease 0s normal none infinite back_ken;
				-webkit-animation: 60s ease 0s normal none infinite back_ken;
			}
		}
		.services-slider-wrap {
			overflow:hidden;
			.owl-item {
				height:346px;
				cursor: move;
			}
			.owl-theme .owl-controls {
				display: none;
			}
			.services-item {
				min-height:346px;
				position:relative;
				background-size:cover!important;
				background-position:center!important;
				background-repeat:no-repeat!important;
				&.slide-1{
					background:url(../img/servcies-1.jpg);	
				}
				&.slide-2{
					background:url(../img/servcies-2.jpg);	
				}
				&.slide-3{
					background:url(../img/servcies-3.jpg);
				}
				&.slide-4{
					background:url(../img/servcies-4.jpg);	
				}
				.service-item-wrap {
					position:relative;
					min-height:346px;
					padding-top:70px;
					padding-left:70px;
					padding-right:70px;
					z-index:2;
					height:100%;
				}
				.service-item-overlay {
					position:absolute;
					height:100%;
					width:100%;
					top:0;
					left:0;
					z-index:1;
				}
				&.even {
					.service-item-overlay {
						background:rgba(51,51,51,.9);
					}	
				}
				
				.icon {
					font-size:72px;
					color:$secondery_color;
					margin-bottom:30px;
				}
				.expand-content {
					bottom:0;
					height: 0;
					right: 0;
					position: absolute;
					@include transition(all 0.8s cubic-bezier(0.7, 0, 0.3, 1) 0s);
					width: 0;
					background:$secondery_color;
					.excont {
						opacity:1;
						visibility:visible;
						padding-left:70px;
						padding-right:70px;
						padding-top:70px;
						@include transition(all 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s);
						h4 {
							color:$tertiary_color;
						}
					}
					&.expand-visible {
						width: 100%;
						height: 100%;
					}
					&.expand-content-visible {
						opacity:1;
					}
				}
				.toggle-expand {
					bottom: 0;
					color: $tertiary_color;
					height: 50px;
					position: absolute;
					right: 0;
					width: 50px;
					cursor:pointer;
					backface-visibility: hidden;
					-webkit-backface-visibility:hidden;
					span {
						left: 0;
						margin: auto;
						position: absolute;
						right: 0;
						top: 18px;
						width: 15px;
						&.minus {
							top:25px;
						}
					}
				}
			}
		}	
	}
	&.page-right {
		.contact-sec {
			.contact-sec-wrap {
				height:100%;
			}
			
			.form-horizontal .form-group {
				margin-left: 0;
				margin-right: 0;
			}
			.form-control {
				border-radius:2px;
				box-shadow:none;
				&::-webkit-input-placeholder {
				   color: #8d8d8d;
				   font-size:13px;
				   text-transform:capitalize;
				}

				&:-moz-placeholder { /* Firefox 18- */
				   color: #8d8d8d;
				   font-size:13px;
				   text-transform:capitalize;
				}

				&::-moz-placeholder {  /* Firefox 19+ */
				   color: #8d8d8d;
				   font-size:13px;
				   text-transform:capitalize;
				}

				&:-ms-input-placeholder {  
				   color: #8d8d8d;
				   font-size:13px;
				   text-transform:capitalize;
				}
			}
			.instr {
				color:#8d8d8d;
				font-size:13px;
			}
			.input__field {
				width:100%;
			}
			input.form-control {	
				height:57px;
			}
			textarea.form-control {	
				height:124px;
				padding-left:15px;
				padding-top:15px;
			}
			.btn {
				width:100%;
			}
			
			p.form-msg {
				background:transparent!important;
				clear: both;
				text-transform: capitalize;
			}
			.address-details {
				span {
					display:block;
				}
				.icon {
					font-size:30px;
				}
				.add-tag {
					font-size:14px;
					letter-spacing:-0.5px;
					font-weight:700;
					color:$tertiary_color;
					font-family:$font_head;
					text-transform:capitalize;
				}
				.add-detail {
					font-size:15px;
					color:#8d8d8d;
					display:block;
					line-height:25px;
				}
			}	
			.map-sec-wrap {
				height:100%;
				@include transition(right 0.5s ease-in-out 0s);
				#map_canvas {
					height:100%;
					width:100%;
				}
				&.ie-spacific {
					position:fixed;
					top:0;
					right:-50%;
				}
			}
		}
	}
}
.open-right .page-right.page .contact-sec .map-sec-wrap.ie-spacific {
	right:0;
}

/****************************/
/** Color Styles **/
/****************************/
.iblue {
	h6{
	color:$primery_color_1;
	}
	.la-anim-1 {
		background: $primery_color_1;
	}
	.la-anim-1::after {
		background: $primery_color_1;
	}
	.btn{
		background:$primery_color_1;
		&:hover,&:focus,&:active {
			background:$primery_color_1;
		}
		
		&:hover {
			background:$primery_color_1;
		}
	}
	.notify-cmpt.notify-form-type-3 {
		.notify-wrap {
			#message {
				color:$primery_color_1;
			}
		}
	}
	.side {
		&.side-left {
			h5 {
				.days-wrap {
					color:$primery_color_1;
				}
			}
			.social-icon {
				&:hover {
					i.fa{
						color: $primery_color_1;
					}
				}
			}
		}
	}
				
	.page {
		&.page-left {
			.services-slider-wrap {
				.services-item {
					&.odd {
						.service-item-overlay {	
							background:rgba(28,186,200,.9);
						}	
					}	
				}
			}
		}
		&.page-right {
			.contact-sec {
				h2{
					i {
						color:$primery_color_1;
					}
				}
							
				p.form-msg {
					color:$primery_color_1;
				}
				.address-details {
					.icon {
						color:$primery_color_1;
					}
				}	
			}
		}
	}
}
.dblue {
	h6{
		color:$primery_color_2;
	}
	.la-anim-1 {
		background: $primery_color_2;
	}
	.la-anim-1::after {
		background: $primery_color_2;
	}
	.btn{
		background:$primery_color_2;
		&:hover,&:focus,&:active {
			background:$primery_color_2;
		}
		
		&:hover {
			background:$primery_color_2;
		}
	}
	.notify-cmpt.notify-form-type-3 {
		.notify-wrap {
			#message {
				color:$primery_color_2;
			}
		}
	}
	.side {
		&.side-left {
			h5 {
				.days-wrap {
					color:$primery_color_2;
				}
			}
			.social-icon {
				&:hover {
					i.fa{
						color: $primery_color_2;
					}
				}
			}
		}
	}
	.page {
		&.page-left {
			.services-slider-wrap {
				.services-item {
					&.odd {
						.service-item-overlay {	
							background:rgba(67,87,193,.9);
						}	
					}	
				}
			}
		}
		&.page-right {
			.contact-sec {
				h2{
					i {
						color:$primery_color_2;
					}
				}
							
				p.form-msg {
					color:$primery_color_2;
				}
				.address-details {
					.icon {
						color:$primery_color_2;
					}
				}	
			}
		}
	}

}
.lgreen {
	h6{
		color:$primery_color_3;
	}
	.la-anim-1 {
		background: $primery_color_3;
	}
	.la-anim-1::after {
		background: $primery_color_3;
	}
	.btn{
		background:$primery_color_3;
		&:hover,&:focus,&:active {
			background:$primery_color_3;
		}
		
		&:hover {
			background:$primery_color_3;
		}
	}
	.notify-cmpt.notify-form-type-3 {
		.notify-wrap {
			#message {
				color:$primery_color_3;
			}
		}
	}
	.side {
		&.side-left {
			h5 {
				.days-wrap {
					color:$primery_color_3;
				}
			}
			.social-icon {
				&:hover {
					i.fa{
						color: $primery_color_3;
					}
				}
			}
		}
	}
	.page {
		&.page-left {
			.services-slider-wrap {
				.services-item {
					&.odd {
						.service-item-overlay {	
							background:rgba(150,195,70,.9);
						}	
					}	
				}
			}
		}
		&.page-right {
			.contact-sec {
				h2{
					i {
						color:$primery_color_3;
					}
				}
							
				p.form-msg {
					color:$primery_color_3;
				}
				.address-details {
					.icon {
						color:$primery_color_3;
					}
				}	
			}
		}
	}

}
.gyellow {
	h6{
		color:$primery_color_4;
	}
	.la-anim-1 {
		background: $primery_color_4;
	}
	.la-anim-1::after {
		background: $primery_color_4;
	}
	.btn{
		background:$primery_color_4;
		&:hover,&:focus,&:active {
			background:$primery_color_4;
		}
		
		&:hover {
			background:$primery_color_4;
		}
	}
	.notify-cmpt.notify-form-type-3 {
		.notify-wrap {
			#message {
				color:$primery_color_4;
			}
		}
	}
	.side {
		&.side-left {
			h5 {
				.days-wrap {
					color:$primery_color_4;
				}
			}
			.social-icon {
				&:hover {
					i.fa{
						color: $primery_color_4;
					}
				}
			}
		}
	}
	.page {
		&.page-left {
			.services-slider-wrap {
				.services-item {
					&.odd {
						.service-item-overlay {	
							background:rgba(230,174,72,.9);
						}	
					}	
				}
			}
		}
		&.page-right {
			.contact-sec {
				h2{
					i {
						color:$primery_color_4;
					}
				}
							
				p.form-msg {
					color:$primery_color_4;
				}
				.address-details {
					.icon {
						color:$primery_color_4;
					}
				}	
			}
		}
	}

}
.tangerine {
	h6{
		color:$primery_color_5;
	}
	.la-anim-1 {
		background: $primery_color_5;
	}
	.la-anim-1::after {
		background: $primery_color_5;
	}
	.btn{
		background:$primery_color_5;
		&:hover,&:focus,&:active {
			background:$primery_color_5;
		}
		
		&:hover {
			background:$primery_color_5;
		}
	}
	.notify-cmpt.notify-form-type-3 {
		.notify-wrap {
			#message {
				color:$primery_color_5;
			}
		}
	}
	.side {
		&.side-left {
			h5 {
				.days-wrap {
					color:$primery_color_5;
				}
			}
			.social-icon {
				&:hover {
					i.fa{
						color: $primery_color_5;
					}
				}
			}
		}
	}
	.page {
		&.page-left {
			.services-slider-wrap {
				.services-item {
					&.odd {
						.service-item-overlay {	
							background:rgba(242,101,34,.9);
						}	
					}	
				}
			}
		}
		&.page-right {
			.contact-sec {
				h2{
					i {
						color:$primery_color_5;
					}
				}
							
				p.form-msg {
					color:$primery_color_5;
				}
				.address-details {
					.icon {
						color:$primery_color_5;
					}
				}	
			}
		}
	}

}
.pink {
	h6{
		color:$primery_color_6;
	}
	.la-anim-1 {
		background: $primery_color_6;
	}
	.la-anim-1::after {
		background: $primery_color_6;
	}
	.btn{
		background:$primery_color_6;
		&:hover,&:focus,&:active {
			background:$primery_color_6;
		}
		
		&:hover {
			background:$primery_color_6;
		}
	}
	.notify-cmpt.notify-form-type-3 {
		.notify-wrap {
			#message {
				color:$primery_color_6;
			}
		}
	}
	.side {
		&.side-left {
			h5 {
				.days-wrap {
					color:$primery_color_6;
				}
			}
			.social-icon {
				&:hover {
					i.fa{
						color: $primery_color_6;
					}
				}
			}
		}
	}
	.page {
		&.page-left {
			.services-slider-wrap {
				.services-item {
					&.odd {
						.service-item-overlay {	
							background:rgba(245,36,94,.9);
						}	
					}	
				}
			}
		}
		&.page-right {
			.contact-sec {
				h2{
					i {
						color:$primery_color_6;
					}
				}
							
				p.form-msg {
					color:$primery_color_6;
				}
				.address-details {
					.icon {
						color:$primery_color_6;
					}
				}	
			}
		}
	}

}

/****************************/
/** Style Swicher **/
/****************************/
@keyframes rotate-me {
  0% {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg); 
	}
  100% {
     transform: rotate(360deg); 
     -webkit-transform: rotate(360deg); 
	} 
}
@-webkit-keyframes rotate-me {
  0% {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg); 
	}
  100% {
     transform: rotate(360deg); 
     -webkit-transform: rotate(360deg); 
	} 
}
.app-customizer {
	background: #fff none repeat scroll 0 0;
    height: 82px;
    left: -105px;
    padding-left: 15px;
    padding-top: 15px;
    position: fixed;
    top: 110px;
	width: 105px;
    @include transition(left .5s ease 0s);
	z-index: 999;
	&.open-customizer {
		left: 0;
	}
	.light-dark-wrap {
		text-transform: capitalize;
		span {
			display:inline-block;
			cursor:pointer;
			color: #777;
			&.active-bg {
				color: #222222;
			}
		}
		#light_bg {
			margin-right:5px;
		}
	}
	
	.colors {
		span {
			display: inline-block;
			height: 20px;
			margin-right:4px;
			margin-top: 4px;
			width: 20px;
			cursor:pointer;
		}
		#ice_blue {
			background:$primery_color_1;
		}
		#deep_blue {
			background:$primery_color_2;
		}
		#light_green {
			background:$primery_color_3;
		}
		#golden_yellow {
			background:$primery_color_4;
		}
		#tangerine {
			background:$primery_color_5;
		}
		#pink {
			background:$primery_color_6;
		}
	}
	.app-customizer-toggle {
		position: absolute;
		background: #fff;
		left: 100%;
		top: 0;
		width: 40px;
		height: 40px;
		text-align: center;
		line-height: 40px;
		text-decoration: none;
		i {
			font-size: 16px;
			color:#222222;
			animation: rotate-me 2s infinite linear;
			-webkit-animation: rotate-me 2s infinite linear;
		}	
	}
}

/*****************************************************/
/* Mediaqueries */
/*****************************************************/
@media only screen and (max-width: 1600px) {
	h1 {
		font-size:100px;
		line-height:110px;
	}
}
@media only screen and (max-width: 1400px) {
	.padding-left-sm-40 {
		padding-left:40px;
	}
	.padding-right-sm-40 {
		padding-right:40px;
	}
	.sec-pad-sm {
		padding-top:90px;
		padding-bottom:90px;
	}
	h1 {
		font-size:60px;
		line-height:70px;
	}
	h2 {
		font-size: 24px;
		line-height: 34px;
	}	
	.side {
		&.side-left {
			.content-wrap {
				.logo {
					top:40px;
				}
			}
			.social-icons-wrap {
				bottom: 40px;
				left: 40px;
			}
		}
		&.side-right {
			.copyright-text p{
				left:40px;
				bottom:40px;
			}
		}
	}
}
@media only screen and (max-width: 1024px) {
h4 {
	font-size: 18px;
	line-height: 27px;
}
h5 {
	margin-bottom:20px;
}
.hover {
	display:none;
}

.side {
	width: 100%;
	.logo {
		margin-bottom:100px;
	}
	.social-icons-wrap {
		margin-top:100px;
	}
	&.side-left,&.side-right {
		position: relative;
	}
	&.side-left .social-icons-wrap,
	&.side-left .content-wrap .logo {
		position:static;
	}
}

.full-height {
	min-height:auto!important;
}
.address-detail {
	.copyright-text {
		display:block;
	}
}
	
.page {
    position: static;
    width: 100%;
	
	&.page-left {
		-webkit-transform: translateX(0px);
		-ms-transform: translateX(0px);
	    transform: translateX(0px);
		position: static;
			.about-content-wrap {
				height:auto!important;
			}
			.about-img-wrap,.about-content-wrap {
				width:100%;
			}
			.services-slider-wrap .services-item .expand-content .excont,
			.services-slider-wrap .services-item .service-item-wrap{
				padding-left: 35px;
				padding-right: 35px;
				padding-top: 35px;
			}	
	}
	&.page-right {
		left: 0;
		-webkit-transform: translateX(0px);
		-ms-transform: translateX(0px);
	    transform: translateX(0px);
		position: static;
			.contact-sec .map-sec-wrap {
				height:300px!important;
			}
			.col-md-6.contact-sec-wrap {
				width:100%;
			}
			.col-md-6.map-sec-wrap {
				width:100%;
			}
			.address-details .copyright-text {
				margin-top:10px;
				p{
					font-size:11px;
				}
			}
	}

}	
	.close-btn {
		display:none;
	}
	.open-left .side-right,
	.open-right .side-left {
	-webkit-transform: translateX(0) scale(1);
	-ms-transform: translateX(0) scale(1);
	    transform: translateX(0) scale(1);
	}

	.open-left .side-left,
	.open-right .side-right
	{
	z-index: 200;
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	    transform: translateX(0);
	}
		
	.open-left .side-left .main,
	.open-right .side-right .main
	{
	-webkit-transform: translateY(0) translateX(0) scale(1);
	-ms-transform: translateY(0) translateX(0) scale(1);
	 transform: translateY(0) translateX(0) scale(1);
	opacity: 1;
    visibility: visible;
	}
	.open-left .page-left,
	.open-right .page-right	{
	-webkit-transform: translateX(0%);
	-ms-transform: translateX(0%);
	    transform: translateX(0%);
	}
	.reset-layout .page, 
	.splitlayout.open-right .page-left, 
	.splitlayout.open-left .page-right,
	.splitlayout.close-right .page-left, 
	.splitlayout.close-left .page-right {
		position:static;
	}

	.btn:hover .mask {
		width: 0;
	}
	.btn:hover, .btn:focus, .btn:active {
		color:#fff;
	}
	.side-right .social-icons .social-icon:hover span {
		transform: translateY(0px);
		-webkit-transform: translateY(0px);
		-ms-transform: translateY(0px);
	}
}
@media only screen and (max-width: 850px) {
	.notify-cmpt.notify-form-type-3 .notify-wrap .notify-input-box,
	.notify-cmpt.notify-form-type-3 .notify-wrap .btn
	{
		width:100%;
	}
}
@media only screen and (max-width: 767px) {
	.sec-pad-xs {
		padding-top:50px;
		padding-bottom:50px;
	}
	h1 {
		font-size:55px;
		line-height:65px;
	}
	.margin-bottom-xs-50 {
		margin-bottom:50px;
	}
}
@media only screen and (max-width: 736px) {

	.notify-cmpt.notify-form-type-3 .notify-wrap .notify-input-box,
	.notify-cmpt.notify-form-type-3 .notify-wrap .btn
	{
		margin-top:15px;
	}	
	.notify-cmpt.notify-form-type-3.md-content .md-content-wrap {
		padding-top:40px;
	}
}
@media only screen and (max-width: 414px) {
	h1 {
		font-size:45px;
		line-height:55px;
	}
}