@charset "utf-8";

/* CSS Document */



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

[Master Stylesheet]



Project:	Architecture

Version:	1.0

Last change:	Initial RELEASED 

Primary use:	Architecture, Design, Construction

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



/* google font */

@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);

@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,300,700);







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



[Table of contents]



1. body

2. common Classes

2. header 

3. navigation / navbar

4. sections

4. footer



NOTE: Every section is commented before starting.



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



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

[Typography]



Body 		:		font-family: 'Montserrat', sans-serif;

Paragraph	:		font-family: 'Roboto Slab', serif;

Input, 

textarea,

title	:		font-family : 'Raleway, sans-serif'  +   font-family: 'Tangerine', cursive;




.enquire-now{
background-color:#FFD580
}

# [Headings]



h1,

.h1 	font-size:98px



h2,

.h2     font-size: 42px



h3,

.h3     font-size:32px



h4,

.h4     font-size:28px



h5,

.h5     font-size:24px



h6,

.h6     font-size:18px





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





body{

	background:#fff;

	font-family: 'Roboto Slab', serif;

}

*{

	margin:0px;

	padding:0px;

}



h1{

	font-weight:700;

	font-family:'Montserrat', sans-serif;

	font-size:85px;

	text-transform:uppercase; 

	color:#000;

}

h2{

	font-weight: 700;

	font-size:42px;

	font-family:'Montserrat', sans-serif;

	color:#222222;

}

h3{

	font-weight:700;

	font-size:32px;

	font-family:'Montserrat', sans-serif;

}

h4{

	

	font-weight: 300;

	font-size:24px;

	font-family:'Montserrat', sans-serif;

}

h5{

	font-weight:700;

	font-size:24px;

	font-family:'Montserrat', sans-serif;

    text-transform: uppercase;



}

h6{ 

	font-weight: 600;

	font-size:18px;

	font-family:'Montserrat', sans-serif;

}

p{

	font-weight:300;

	font-size:20px;

	line-height:36px;

	color:#222222;

}



a{

	text-decoration:none;

}

li{

	list-style:none;

}

a .img{

	border:none;



}

a{transition: background-color 0.5s ease; transition: color 1s; -webkit-transition: color 1s; -o-transition: .5s; -ms-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s;}

a:hover {transition: background-color 0.5s ease; }

img{ width:100%;}

img:hover {transition: background-color 0.5s ease; }

.clear{

	clear:both;

}

.height5{	height:5px; }

.height10{	height:10px; }

.height15{	height:15px; }

.height20{ 	height:20px; }

.height25{	height:25px; }

.height30{	height:30px; }

.height35{	height:35px; }

:focus{ outline:none;}







/*..... HEADER One ......*/



.header-one{ position:absolute; z-index:100; width:100%;}

.header{padding:25px 15px;}

.header .logo{float:left; width:175px;}

.header .logo img{ width:100%;}

.header .navigation{ float:right; font-family: 'Montserrat', sans-serif; margin:10px 0 10px 0;}

.header .navigation ul{ float:left;}

.header ul li{float: left; margin: 0 0 0 40px;}

.header ul li span{ color: #868686; font-size: 11px; margin: 5px 3px 0 0; float: left;}

.header ul li a{color:#fff; text-transform:uppercase; font-size:16px;}



@media (max-width: 768px) {

	.header .logo {

		float: left;

		width: 125px;

	}



		.header .logo img {

			width: 80%;

		}

}



.icons8-facebook {

	order: 2;

	display: inline-block;

	width: 25px;

	height: 25px;

	background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAB3ElEQVR4nO2az2rCQBDG9ah9tP65DQgmOYkHLzVa6NEVBHv0GdpUgg8iIvER9KwI8SpevjJhA22NJmpl13Q/mFuyzG+/2c2G2ULB6EYEoAzgCUALwKvicGUu5VMAigBeAGygnzZyYotZID75jel0ik6nA8uyQERKw7IsCCEQBEEM9HEUBkCbn/I8T3nydCCGw2EM4x6CuGPr2AnVyVJKSGfCxDUjF1NUTqoTpZTgMpO6P1hWtm0rT5RSwnGcGKSVBBJhqk6SMoaUMCCkgRtkHCH1DpCOjvDO6Ps+FosFttttFKvVCuPxGL1e7zZAGo0Glsvl0QMV6Q5SqVQwn89TT4akO8hgMEiFuAmQyWSCXICs1+u9pBmu2WyiWq2eNJZSkN1utwdSq9XOGkspSJIuHEsYEPqPjpyjMAzzARIEQT5ARqNRPkD6/X4+QOr1un4gWcAuHEsYEDKOkCktMmuEzK4Fs/2S+Y78lPmyk35HlPa1Gz1/BeKkNHoeI0QhtAfpdrtHW298QWCT9Q9NJchsNouboaU9EAnDzfioBXwtmEvD9/14Dp4TIb5dGPD4KXaGy0yH5qht21E5SSdY71lvP7jSOt0UshOpEL+ASgAeJNSb4nBlLslrwqign74AjK4jNUBggw4AAAAASUVORK5CYII=") 50% 50% no-repeat;

	background-size: 100%;

}



.icons8-instagram {

	order: 2;

	display: inline-block;

	width: 25px;

	height: 25px;

	background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAENElEQVR4nO1ayU4bQRBNciAX+ITkTyBf0SQxYBkrghuMQ6RcEBizyB8ACBD4xHIjBiXhF4CbQQIkLyiIVfIRbEsgveh1psPEeGzPAm0nKakkazxdXW+6+lVN1zx79q8KgDYAHQACACIAPvuktBUwbbc9lvMtAD4A2AJQwuNLyZyLc7b4AeA5AAEgQ+tnZ2dIJpOIxWIwDAPd3d0QQviitGUYhrTNOTiXKT8A9AF44SWENmgpk8lgbGzMN6fr1eHhYRwdHSlASQCtTkG8BrB3d3eHxcVFdHZ2PjkIYSrnXlpaAn2hTwBeOVmJvevra0SjUW0ARJkyIuiTCab6yjAOGU5EryOURA0dGRnB7e0twXzh/q0GpIt3MZx0Oy1sNJFIqD3zzg7ESwA5bmyde0LUUPqWzWYJJFuRmk3ObsiQEmVKijYlXAnIFrlbp4NTU1PI5/NS+bvavefn5wTyrRJTlZiIdALJ5/O/Uzt/V7t3Y2NDVQD35QyAN7zKJWsWIOPj4+rWDisQFmsYGBjw7Exvby9mZ2exu7sry4xSqSSVv3mN/4VCoZqhNTk5WXWewcHBh+wF4BOvBINB1wC6urqwtraGQqFQsyK8ubnB6uqqHON2vmAwqMwNWYFEecWt0f7+fkWJUlKpFObm5uRTYzGoCkJe29tjYv4lpHqOdTuvKVFfgNARFdtkEmbfWmNGR0cV68ixbsH4BoShoVbi4ODANvbt9hLHqJUJBAL6gHBPUPh0nYCwgrm4uJA2lpeX9QChE9y0lHrCyU5ZYVNY2YYcPgxfgJBG1cZ2C0KpIoCZmZmnB8KcQCETeQUyPz8vbe3s7Dw9EMU6pFivQEjNlDOHtZ4vQIrForTS09PjGQhtUIrFYnMDUVm6UCj8D62G2OwLCwvS1vb2tj76JXV6BbK/vy9tTU9P602IrJ3cguCrtdaEKISQpTjl6uoK4XC4OUsUIYQs9FjwqaKRjtU7lsAPDw/l2HQ6rbdoFGVlPJ9uPaeTDKfLy0s5hmP7+vpcze0rEAVGrYwiAJYdzNjMM9RIJCLZSW1stRJuQQgbIENeX3UZGisrK+p8tqrwHu4JN+EkHr7qfrQCee/X4QOZh1UsC8DT01NZAVD5m9dIsW7eXYT94cPbhjsOEg50YmJCAWm3Amllzab7gE440M3NzYcHdCaY7yzNdTsonL1GfP0DhPUQuxnCa/z+lDFs17nNHR8fN0tbIWPb8VXsxZ6dbodF7UZPZ0UQlnZ0kq23RgyxkfvW23rV1puFwWQztJGaPrFYTCXbVN1tamt7mkupuz2dSCRUezpVd3u6bGXYPcXJyQni8biWVcjlcmpPrDv+YKDCJxxpWiJ3s1NE+lMFoV9O05ZhGDJjM9mp4ybPn3BUoOYwe3asAPD4UjTnCvvyUU2VkGs3qZqfJsV9UtqiTdp2F0J/g/wEevfgzsPjtc8AAAAASUVORK5CYII=") 50% 50% no-repeat;

	background-size: 100%;

}



.icons8-linkedin {

	order: 2;

	display: inline-block;

	width: 25px;

	height: 25px;

	background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAACKklEQVR4nO2aPWsqQRSGTZncn3ZvbnfAYlfEr8ImmBtIpa6NpPYnJF4R7K0sRK1E0R9grSASQdTGjzfMMJvca2ZdJZCZlXnhbZbjch7PnJlhZkMho4AIwA2A3wDuATwqdkbkcnMOwBWABwBz6Ke5+GOvToH4y37R7XaRz+dhWRaISKkty4LjOOj1ei7Qy1EYAH9YVLlcVp48ebhSqbgwGS+IH6x0rBKqkyUfi8q8SntGNBMfTqoTJR+zYSb003NY2batPFHycSQScUHuZSAcU3WSdKKFHANCl1CRZDKJTqeDxWLB3Wq1EI/HgwcyHA4/LbWqpusvgazXaxxqtVoFD6T3sUV4F3sWOJBYLIZms/lfjyQSieCBkEYWMiC4iIp46ZyYbDbL16LZbIbNZsNnwtFohFqtxntQexC2cA4GAxzTcrlEsVjUG2QymeAUbbdb5HI5fUHO0XQ6RTgc1h9kt9v5xpRKJX1B6vU6UqkUj0un02g0Gp6x7XZbTxCvzaVs28M0Ho/1BPFqYHZGINPKZzOqDCQajUrfyZ7LtN/v9QT56nvJgJCpiFRmaJHpETKzFpnpVy4y6wjMKQq+28f2Whdz0XPLER1HeaLk40KhcPTqjX0gMFd1lnuO+/2+exl6/QlEwLDLeH4FrDpZ8nC1WnWrcSeF+OeDgTKLYpVhw0yHnrFtmw8nUQmm51O/fsiI0ummV1YJX4gDoGsAvwTUk2JnRC7ynjAK6ac3eIKKk7wzydwAAAAASUVORK5CYII=") 50% 50% no-repeat;

	background-size: 100%;

}



.icons8-whatsapp {

	order: 2;

	display: inline-block;

	width: 25px;

	height: 25px;

	background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFoElEQVR4nO2a208cdRTHSWqMNfH2D1jjg48apd6qSa3xzQejddjdckmKPOADsFlu4RKIlQfKAxDaCtiacllaKLyYEB4ssjQC2XBLDQQRlGuBcksJKGy5fc13OtPObmd2Z3Z3dnnwJL9kGWZ/8/vM/M4533N2YmL+N20DcAzA6wBiAXwqjVjp2LGYo2oAXgJgBVALYATAQ2jbQ+mcGgAWAC8eBYCPAdwEsM0VLi8vw+VyoaGhAaWlpcjPz0dmZqY4+JnH+D+es7KyIoPxuzcAfBQNgFMA7nAV9+/fR0tLC9LS0iAIgqGRnp6OW7duiTdAMheADyIB8AqAnwAczs3NobKyEhaLxTCA7+AcnGt+fp4wBwB+5HY1C+I9ANPb29uoq6uD1WoNGcB3WK1Wcevt7OwQ6G8AJ8MNIQDwTE1Nidsh3ABqW256epowHgBnwwWRwsftdrtx7tw50yEEacTHx6O/v58w+wC+CRUijhBdXV1h8YVgfMflcskwZ0PxiYe8K2b4gxEYt9tNGDpOrFGIlwFM0SciuZ0EP9tsZmaGMH8ZimYMsYxOkXBsvSMjIwMeD30ftUaS3SFDbLQXL/iMxsZGOc+8rwfkDpOdHr+Ii4vDxYsX4XQ6xYTGv80EsVqtuHfvHmF+1aOdUFFRoQuip6fHSw1evnzZ9KdSVVUlX+6UP5Cb1E56Qu3169efkrUMDmaDWCwWWXA6/UnxbQrAQJPZbDZsbGyoavTCwkLTYVpbW3mpfwG8oAbC2kCXii0oKNAsNrjdIhHBJPtaDaSWclrPRHRsLdvb20NKSorpMKurq7zcFTWQEcoBPZMwGGjZ4eEh7Ha76SDd3d283O9qNbaHElrPJFyolnV2dpoOITzJKR6vHoDUFBBLUb0TSZLBy8bGxsRAEAmQsrIy+bKvKUFO8gidWO9ENTXsHXhbW1tbRCAEQRCjo2TvKEHO8IjD4TCUZWdnZ71AqIUipc8cDod82U+UIKd5JCsry9Bkubm5YpRS2uTkZEQUs0MD5C0eKSoqMjwhxaWv9fX1mV7DFGpsrRM8QgcKZlJWkL7GYighIcFvCOf1ghWaZRrO/gwrMKrYYCbl3R8ZYfPQ26ii1fyOEMw3tMXFRVRXVxuOdo2Pwu/OUy1YAP29vb1BP+qkpCSMj48/BbO/v4+Ojg6kpqaK5+Xk5MgFkpetr68bajOpJkQJpIbKN5R9m5iYiLt370LNGBSGhoawtbUFf1aho4RQSJQf1EC+CiZyqcns9vb2x1vHqF24cMGIslAVjccBbIUrqZWUlGBtbc0QxO7urrhFA83NNWrKeAnmBouWcIVORi3qt83NzYAQfILXrl0LOCfX5rewUvSywl6yMkGWl5djcHBQdH5fW1pa0q3zqp6Uuh9qgkgwtxk2wwmiHOfPnxf94OrVq2LYLS4u1t3FtNlsWFhYIMRtvxASyC+jo6OmgYQympqa5HbQu4Egng8lMZo57Ha7nH+q9TyNz3lmdnZ21Bcu+AQNbndqUl0tUwBVDx48ML3RFkIT++2AEBLIn0z90V68oAi1khRhqPtSL4RY7rJDclS208DAgAyRrAtCAvn24OAAycnJUYfIyMiQewI7up+EAuTniYmJqG8lp9MpR6dJ3T6hgHgWwCZbkYEcj+VtfX29WAVeunQpLHKGczBjLzxKdswT1UG9EaFV6vICeXl5YhFDCc4ff2R9B+APfqAw5I/+wahm5gbePMVbEJ0Bk50ORz9obm4WW0J8vMPDw8qF8/2R3wB8D+AzJk7pe3xRhun2H57EBbE4YwZmKcobQ0C+wsEam8c4NyORVE/IKtYZUDvpNZbsCh23I72i8Z30Zs/xAN9lCfCF9KIMf1N+fAdUjA7A6usK6wlNKR6KAXiDdwbAcyHOwxbsqwDelFpNZ6Snd+JIv+YUcwTsP5iy2KJxwlvMAAAAAElFTkSuQmCC") 50% 50% no-repeat;

	background-size: 100%;

}


.form input{
font-family:
'Open Sans', sans-serif !important;
}
.form textarea{
font-family:'Open Sans', sans-serif !important;
width:14.4rem !important;
}
.form h1{
width:15rem !important;}
@media (max-width: 768px) {
	.form h1{
		width:auto !important;
}

.form textarea{
width:16rem !important;
}
	.icons8-facebook {

		width: 30px !important;

		height: 30px !important;

	}

	.icons8-pinterest {

		width: 30px !important;

		height: 30px !important;

	}
.icons8-houzz {

		width: 30px !important;

		height: 30px !important;

	}

	.icons8-instagram {

		width: 30px !important;

		height: 30px !important;

	}



	.icons8-linkedin {

		width: 30px !important;

		height: 30px !important;

	}

	

	.icons8-whatsapp {

		width: 30px !important;

		height: 30px !important;

	}

	.social {

			position: fixed;

			/* top: -90px !important; */

		}

	.awards {

		background: url(../images/awards-bg.jpg) no-repeat fixed;

		width: 100%;

		background-size: 110%;

	}

}



/*. navigtion hover ..*/

	.header-one .header a, a > span, .header-two .header a, a > span {

		position: relative;

		color: inherit;

		text-decoration: none;

	}



		.header-one .header .navigation ul li a:before, a:after, a > span:before, a > span:after, .header-two .header .navigation ul li a:before, a:after, a > span:before, a > span:after {

			content: '';

			position: absolute;

			transition: transform .5s ease;

		}



	.header-one .header .navigation ul li a, .header-two .header .navigation ul li a {

		display: inline-block;

		overflow: hidden;

		color: #fff;

	}



		.header-one .header .navigation ul li a:before, .header-two .header .navigation ul li a:before {

			left: 0;

			bottom: 8px;

			width: 100%;

			height: 2px;

			transform: translateX(-100%);

		}



		.header-one .header .navigation ul li a:hover:before, .header-two .header .navigation ul li a:hover:before {

			transform: translateX(0);

		}



	.header-one .header .navigation ul li.select a:before, .header-two .header .navigation ul li.select a:before {

		transform: translateX(0);

	}



	.header .navigation .language {

		float: right;

		margin: 0 0 0 15px;

		border-left: solid 2px #868686;

		padding: 0 0 0 12px;

	}



		.header .navigation .language a {

			color: #c8c7c7;

			text-transform: uppercase;

		}



			.header .navigation .language a:hover {

				color: #fff;

			}





	/*..... HEADER ONE ON SCROLL ......*/

	.header-two {

		position: absolute;

		z-index: 100;

		width: 100%;

		background-color: #000;

	}



		.header-two .header {

			background: #000;

			padding: 20px 0;

		}



			.header-two .header .navigation {

				margin: 10px 0 0 0;

			}



			.header-two .header .logo {

				width: 236px;

			}







	/*..... HEADER TWO MAIN ......*/

	.header-two-main {

		position: inherit;

		z-index: 1002;

		width: 100%;

	}



		.header-two-main .header {

			background: #fff;

			padding: 12px 4%;

		}



			.header-two-main .header .navigation .language {

				margin: 0 0 0 5px;

			}



			.header-two-main .header .logo {

				width: 220px;

			}



			.header-two-main .header ul li {

				margin: 0px;

			}



				.header-two-main .header ul li a {

					color: #999;

					padding: 14px 38px;

				}



					.header-two-main .header ul li a:hover {

						color: #fff;

					}



				.header-two-main .header ul li.select a {

					color: #333333;

				}



			.header-two-main .header .navigation .language a {

				color: #4a4a4a;

			}



				.header-two-main .header .navigation .language a:hover {

					color: #000;

				}













	.divider-dark {

		background: url(../images/divider-dark.png) repeat-x;

		height: 50px;

	}





/*.....Contact Us Modal Pop Up......*/

.login-popup{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 1099;
	background-color:rgba(0,0,0,0.6);
	visibility: hidden;
	opacity: 0;
	transition: all 1s ease;
}
.login-popup.show{
	visibility:visible;
	opacity: 1;
}
.login-popup .box{
	background-color:#ffffff;
	width: 750px;
	position: absolute;
	left: 50%;
	top:50%;
	transform:translate(-50%,-50%);
	display: flex;
	flex-wrap: wrap;
	opacity: 0;
	margin-left: 50px;
	transition: all 1s ease;

}
.login-popup.show .box{
	opacity: 1;
	margin-left: 0;
}
.login-popup .box .img-area{
	flex:0 0 50%;
	max-width: 50%;
	position: relative;
	overflow: hidden;
	padding:30px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.form form input,textarea{
	margin: 0.4rem 0;
    padding: 0.2rem 1rem;
}
.login-popup .box .img-area h1{
	font-size: 30px;
}
.login-popup .box .img-area .img{
	position: absolute;
	left:0;
	top:0;
	width: 100%;
	height: 100%;
	background-image: url('images/slides/slidebg1.jpg');
	background-size: cover;
	background-position: center;
	/* animation: zoomInOut 7s linear infinite; */
	z-index: -1;

}

.login-popup .box .form{
	flex:0 0 50%;
	max-width: 50%;
	padding:30px;
}

.login-popup .box .form h1{
	color: #000000;
    font-size: 30px;
    justify-content: center;
    /* margin: 0px 0px 10px 0px; */
    text-align: center;
}
.login-popup .box .form .form-control{
	height: 45px;
	margin-bottom: 30px;
	width: 100%;
	border:none;
	border-bottom:1px solid #cccccc;
	font-size: 15px;
	color:#000000;
}
.login-popup .box .form .form-control:focus{
	outline: none;
}
.login-popup .box .form label{
	font-size: 15px;
	color:#555555;
}
.login-popup .box .form .btn{
	width: 100%;
    background-color: #FFD580;
    margin-top: 14px;
    height: 45px;
    border: none;
    border-radius: 10px;
    font-size: 15px;
    text-transform: uppercase;
    color: #ffffff;
    cursor: pointer;
}
.login-popup .box .form .btn:focus{
	outline: none;
}

.login-popup .box .form .close{
	position: absolute;
	right: 10px;
	top:0px;
	font-size: 30px;
	cursor: pointer;
}

/*responsive*/
@media(max-width: 767px){
	.login-popup .box{
		width: calc(100% - 30px);
	}
	.login-popup .box .img-area{
		display: none;
	}
	.login-popup .box .form{
		flex: 0 0 100%;
        max-width: 100%;
	}
}








	/*..... COMMEN CLASSES ......*/



	/*.. heading ..*/

	.gray-bg {

		background: #f7f8f9;

	}



	.sec-space {

		padding: 110px 0;

	}



	.main-heading {

		text-align: center;

	}



		.main-heading h4 {

			text-transform: uppercase;

			letter-spacing: 11px;

		}



		.main-heading h1 {

			background: url(../images/black-wave.png) no-repeat center 108px;

			padding: 0 0 18px 0;

			margin: -14px 0 0 0;

		}



		.main-heading span {

			font-family: 'Montserrat', sans-serif;

			font-size: 20px;

			margin: 12px 0 0 0;

			display: inline-block;

		}



		.main-heading.white h4 {

			color: #fff;

			text-transform: uppercase;

			letter-spacing: 11px;

		}



		.main-heading.white h1 {

			background: url(../images/white-wave.png) no-repeat center 125px;

			color: #fff;

		}



		.main-heading.white span {

			color: #fff;

		}



	.black-btn {

		font-family: 'Montserrat', sans-serif;

		font-size: 15px;

		background: #000;

		color: #fff;

		text-transform: uppercase;

		border-radius: 40px;

		padding: 20px 65px;

		display: inline-block;

		border: solid 2px #000;

	}



		.black-btn:hover {

			background: #fff;

			border: solid 2px #000;

			color: #000;

		}



	input[type=submit], input[type=button] {

		font-family: 'Montserrat', sans-serif;

		font-size: 15px;

		text-transform: uppercase;

		border-radius: 40px;

		padding: 20px 65px;

		display: inline-block;

		background: #fff;

		border: solid 2px #000;

		color: #000;

		transition: background-color 0.5s ease;

		transition: color 1s;

		-webkit-transition: color 1s;

		-o-transition: .5s;

		-ms-transition: .5s;

		-moz-transition: .5s;

		-webkit-transition: .5s;

		transition: .5s;

	}



		input[type=submit]:hover {

			background: #000;

			color: #fff;

			border: solid 2px #000;

			transition: background-color 0.5s ease;

		}



	.read-more-btn {

		font-family: 'Montserrat', sans-serif;

		font-size: 15px;

		color: #fff;

		text-transform: uppercase;

		border-radius: 40px;

		padding: 20px 65px;

		display: inline-block;

	}



		.read-more-btn:hover {

			background: #000;

			color: #fff;

		}



	span.big-text {

		font-size: 54px;

		font-weight: 300;

		text-transform: uppercase;

	}















	/*..... MAIN TEXT ......*/



	.our-studio {

		text-align: center;

		margin: 110px 0 0 0;

	}



		.our-studio .icons {

			display: inline-block;

		}



			.our-studio .icons i {

				font-size: 142px;

				float: left;

			}



				.our-studio .icons i:nth-of-type(1) {

					margin: 10px 30px 0 0;

				}



				.our-studio .icons i:nth-of-type(2) {

				}



				.our-studio .icons i:nth-of-type(3) {

				}



		.our-studio span {

			font-size: 28px;

			font-weight: 300;

			width: 80%;

			display: inline-block;

			line-height: 40px;

		}







	/*..... OUR PROJECTS ......*/



	.projects {

		margin: 48px 0 0 0;

		display: inline-block;

	}



		.projects .project-sec {

			text-align: center;

			margin: 0 0 48px 0;

		}



			.projects .project-sec .detail {

				background: #fff;

				text-align: center;

				padding: 22px 0;

				margin: -65px 0 0 0;

				position: relative;

				width: 94%;

				display: inline-block;

			}



				.projects .project-sec .detail span.number {

					font-family: 'Montserrat', sans-serif;

					font-size: 90px;

					margin: -22px 6px 0 0;

					display: inline-block;

					color: #7f7f7f;

				}



				.projects .project-sec .detail .text {

					display: inline-block;

					text-align: left;

				}



				.projects .project-sec .detail h6 {

					text-transform: uppercase;

				}



				.projects .project-sec .detail span.tags {

				}



	.view-all {

		text-align: center;

	}





	.all-projects {

		margin: 120px 15px 0 15px;

	}



	.projects .project-sec .project-title {

		text-align: left;

		margin: 15px 0 0 0;

		float: left;

	}



		.projects .project-sec .project-title .text h6 {

			text-transform: uppercase;

		}



	.projects .projects-main {

		margin: 0 0 65px 0;

		display: inline-block;

		padding: 0 30px;

	}



	.all-projects .view-all {

		margin: 20px 0 0 0;

	}







	/*..... PROCESS ......*/

	.process span {

		font-family: 'Montserrat', sans-serif;

		font-size: 110px;

		font-weight: 700;

		position: absolute;

		z-index: -1;

		opacity: 0.2;

	}



	.process .text {

		margin: 48px 0 0 0;

	}



		.process .text h3 {

			text-transform: uppercase;

		}



		.process .text p {

			margin: 26px 0 0 0;

		}







	/*..... CLIENTS WORDS ......*/

	.clients-words {

		background-image: url("../images/a.jpg");

		width: 100%;

		text-align: center;

		background-size: 110%;

	}



	.kind-words {

		margin: 75px 0 0 0;

	}



		.kind-words p {

			color: #fff;

			width: 75%;

			display: inline-block;

		}



		.kind-words span {

			font-family: 'Montserrat', sans-serif;

			font-size: 18px;

			text-transform: uppercase;

			display: block;

			margin: 10px 0 0 0;

		}



			.kind-words span.client {

				color: #fff;

				display: inline-block;

			}









	/*..... FOOTER ......*/

	.footer {

		background: #0c0c0c url(../images/divider-white.png) repeat-x;

	}



		.footer .footer-detail {

			text-align: center;

			margin: 150px 0 0 0;

			display: block;

		}



			.footer .footer-detail .footer-sec {

				color: #fff;

			}



				.footer .footer-detail .footer-sec h3 {

					background: url(../images/white-small-wave.png) no-repeat center bottom;

					padding: 0 0 28px 0;

					text-transform: uppercase;

				}



				.footer .footer-detail .footer-sec span {

					font-weight: 100;

					margin: 40px 0 0 0;

					display: block;

					font-size: 20px;

					line-height: 28px;

				}



				.footer .footer-detail .footer-sec .social-icons {

					margin: 40px 0 0 0;

					display: inline-block;

				}



					.footer .footer-detail .footer-sec .social-icons a {

						color: #fff;

						border: solid 1px #262626;

						border-radius: 30px;

						width: 90px;

						height: 60px;

						display: inline-block;

						font-size: 26px;

						line-height: 60px;

						margin: 0 3px;

					}



						.footer .footer-detail .footer-sec .social-icons a.fb {

							background: #6476a8;

							border: solid 1px #6476a8;

						}



						.footer .footer-detail .footer-sec .social-icons a.tw {

							background: #C13584;

							border: solid 1px #C13584;

						}



						.footer .footer-detail .footer-sec .social-icons a.gp {

							background: #0a66c2;

							border: solid 1px #0a66c2;

						}



		.footer .footer-bottom {

			background: url(../images/building-dark.png) no-repeat center;

			width: 100%;

			height: 80px;

			margin: 45px 0 0 0;

		}



			.footer .footer-bottom .copyrights {

				background: #0c0c0c;

				position: absolute;

				margin: 80px 0 0px 0;

				width: 100%;

				padding: 0 0 15px 0;

			}



			.footer .footer-bottom p {

				color: #8d8d8d;

				float: left;

				font-size: 16px;

			}



			.footer .footer-bottom span {

				color: #8d8d8d;

				font-size: 16px;

				float: right;

			}



			.footer .footer-bottom a:hover {

				color: #fff;

			}







	/*..... FOOTER LIGHT ......*/

	.footer-light {

		background: #f7f8f9 url(../images/divider-dark.png) repeat-x;

	}



		.footer-light .footer-detail {

			text-align: center;

			margin: 150px 0 0 0;

			display: block;

		}



			.footer-light .footer-detail .footer-sec {

				color: #000000;

			}



				.footer-light .footer-detail .footer-sec h3 {

					background: url(../images/black-small-wave.png) no-repeat center bottom;

					padding: 0 0 28px 0;

					text-transform: uppercase;

				}



				.footer-light .footer-detail .footer-sec span {

					font-weight: 100;

					margin: 40px 0 0 0;

					display: block;

					font-size: 20px;

					line-height: 28px;

				}



				.footer-light .footer-detail .footer-sec .social-icons {

					margin: 0 0 0 0;

					display: inline-block;

				}



					.footer-light .footer-detail .footer-sec .social-icons a {

						color: #000000;

						width: 40px;

						height: 60px;

						display: inline-block;

						font-size: 26px;

						line-height: 60px;

						margin: 0 3px;

					}



						.footer-light .footer-detail .footer-sec .social-icons a.fb {

							color: #333;

						}



						.footer-light .footer-detail .footer-sec .social-icons a.tw {

							color: #333;

						}



						.footer-light .footer-detail .footer-sec .social-icons a.gp {

							color: #333;

						}



		.footer-light .footer-bottom {

			background: url(../images/building-white.png) no-repeat center;

			width: 100%;

			height: 80px;

			margin: 45px 0 0 0;

		}



			.footer-light .footer-bottom .copyrights {

				background: #f7f8f9;

				position: absolute;

				margin: 80px 0 0px 0;

				width: 100%;

				padding: 0 0 15px 0;

			}



			.footer-light .footer-bottom p {

				color: #565656;

				float: left;

				font-size: 16px;

			}



			.footer-light .footer-bottom span {

				color: #565656;

				font-size: 16px;

				float: right;

			}



			.footer-light .footer-bottom a:hover {

				color: #000;

			}







	/*..... SUB BANNER ......*/

	.sub-banner {

		padding: 0 0 0 0;

	}



		.sub-banner .text-detail {

			margin: 80px 0 0 0

		}



			.sub-banner .text-detail h2 {

				text-transform: uppercase;

				width: 60%;

			}



			.sub-banner .text-detail p {

				margin: 10px 0 0 0;

				float: left;

			}



			.sub-banner .text-detail ul {

				float: left;

				padding: 0 0 5px 0;

			}



				.sub-banner .text-detail ul li {

					float: left;

				}



					.sub-banner .text-detail ul li a {

						color: #0d0d0d;

					}



					.sub-banner .text-detail ul li.item-select a {

						color: #959494;

					}



					.sub-banner .text-detail ul li span {

						margin: 0 5px;

					}







	.sub-content {

		margin: 50px 0 0 0;

	}





	/*..... ABOUT US ......*/

	.some-about {

	}



		.some-about p {

		}



		.some-about .about-detail {

			margin: 60px 0 0 0;

			float: left;

		}



			.some-about .about-detail ul {

				background: #f7f8f9;

				padding: 20px 0;

			}



				.some-about .about-detail ul li {

					line-height: 48px;

				}



					.some-about .about-detail ul li span {

						font-size: 20px;

						font-family: 'Montserrat', sans-serif;

						font-weight: 100;

					}



						.some-about .about-detail ul li span.number {

							font-size: 18px;

							margin: 0 12px 0 -6px;

						}





	/*..... FUN FACTS ......*/

	.fun-facts {

		border-bottom: solid 5px #eeeeee;

		border-top: solid 5px #eeeeee;

		padding: 80px 0;

		margin: 80px 0 0 0;

	}



		.fun-facts img {

			width: auto;

			margin: 50px 0 0 0;

		}



		.fun-facts .fun-facts-detail {

			text-align: center;

		}



		.fun-facts span.counter {

			font-size: 98px;

			font-family: 'Montserrat', sans-serif;

			font-weight: bold;

		}



		.fun-facts span {

			display: block;

			margin: -14px 0 0 0;

		}





	/*..... OUR TEAM ......*/

	.our-team {

		margin: 75px 0 0 0;

		width: 100%;

		float: left;

	}



		.our-team .team {

			margin: 0 0 55px 0;

			float: left;

		}



			.our-team .team .detail {

				margin: 20px 0 0 0;

			}



				.our-team .team .detail .name {

					float: none;

					text-align: center;

				}



					.our-team .team .detail .name h5 {

					}



					.our-team .team .detail .name span {

						font-size: 16px;

						font-family: 'Montserrat', sans-serif;

					}



				.our-team .team .detail .social-icons {

					float: right;

					margin: 14px 0 0 0;

				}



					.our-team .team .detail .social-icons a {

						float: left;

						margin: 0 0 0 5px;

					}



					.our-team .team .detail .social-icons i {

						color: #222222;

						border: solid 1px #555;

						border-radius: 100%;

						padding: 10px;

						font-size: 16px;

						transition: background-color 0.5s ease;

					}



						.our-team .team .detail .social-icons i:hover {

							color: #fff;

							background: #222;

						}



				.our-team .team .detail p {

					float: left;

					margin: 15px 0 0 0;

					font-size: 18px;

					line-height: 28px;

				}







	/*..... CLIENTS LOGO ......*/

	.clients .clients-logo {

		margin: 100px 0 0 0;

	}







	/*..... AWARDS ACHIEVEMENTS ......*/

	.awards {

		background: url(../images/awards-bg.jpg) no-repeat fixed;

		width: 100%;

		background-size: 110%;

	}



	.achievements {

		margin: 90px 0 0 0;

		float: left;

	}



		.achievements .achiev-sec {

			float: left;

			width: 45%;

			margin: 0 0 28px 0;

		}



			.achievements .achiev-sec.right {

				float: right;

			}



			.achievements .achiev-sec h1 {

				color: #fff;

				float: left;

				opacity: 0.5;

			}



			.achievements .achiev-sec p {

				color: #fff;

				float: right;

				width: 85%;

				margin: 10px 0 0 0;

			}









	/*..... NEWS ......*/

	.left-side {

		float: left;

		width: 50%;

	}



	.right-side {

		float: right;

		width: 50%;

	}



	.news {

		margin: 0 0 120px 0;

	}



		.news .news-sec {

			margin: 0 0 120px 0;

		}



		.news .news-sec2 {

			margin: 44px 0 80px 0;

		}



		.news .news-sec .news-main span {

			padding: 10px 25px;

			margin: -44px 0 0 0;

			float: left;

			position: relative;

			color: #fff;

			font-size: 18px;

		}



		.news .news-sec .detail {

			margin: 48px 0 0 0;

		}



			.news .news-sec .detail a {

				font-size: 20px;

				border-bottom: solid 1px #000;

				margin: 30px 0 0 0;

				float: left;

				padding: 0 0 4px 0;

				color: #000;

			}



	.new-older {

		padding: 32px 0 0 0;

		border-top: solid 4px #d4d4d4;

	}



		.new-older .more-post {

			color: #222;

		}



			.new-older .more-post.older {

				float: left;

			}



			.new-older .more-post.newsest {

				float: right;

			}



			.new-older .more-post i {

				font-size: 32px;

				float: left;

			}



			.new-older .more-post span {

				font-size: 20px;

				float: left;

				margin: 4px 0 0 12px;

			}



			.new-older .more-post.newsest span {

				margin: 4px 12px 0 0;

			}









	/*..... NEWS DETAIL ......*/

	.news-detail {

	}



		.news-detail .detail-sec {

		}



			.news-detail .detail-sec .detail-images {

				display: block;

			}



				.news-detail .detail-sec .detail-images img {

					float: left;

					width: 48%;

				}



					.news-detail .detail-sec .detail-images img.right {

						float: right;

					}



			.news-detail .detail-sec .text {

				margin: 52px 0 0 0;

				float: left;

				width: 100%;

			}



				.news-detail .detail-sec .text p {

					margin: 15px 0 0 0;

					display: block;

				}



			.news-detail .detail-sec .quote {

				width: 100%;

				float: left;

				margin: 75px 0 0 0;

			}



				.news-detail .detail-sec .quote span {

					background: url(../images/quote.png) no-repeat 0 15px;

					font-size: 28px;

					font-weight: 100;

					padding: 0 0 0px 66px;

					float: left;

				}



		.news-detail .next-posts {

			border-top: solid 4px #d4d4d4;

		}



			.news-detail .next-posts .arrows {

				float: left;

				margin: 15px 0 0 0;

			}



				.news-detail .next-posts .arrows a {

					color: #000000;

					font-size: 24px;

					margin: 0 10px 0 0;

					float: left;

				}



			.news-detail .next-posts .grid-news {

				float: right;

				margin: 15px 0 0 0;

			}



				.news-detail .next-posts .grid-news a {

					color: #000000;

					font-size: 32px;

					margin: 0 10px 0 0;

					float: left;

				}





		.news-detail .comments .comment-sec {

			margin: 65px 0 0 0;

		}



			.news-detail .comments .comment-sec img {

				float: left;

				width: 90px;

				border-radius: 100%;

				margin: 0 30px 0 0;

			}



			.news-detail .comments .comment-sec .detail {

			}



				.news-detail .comments .comment-sec .detail h6 {

					text-transform: uppercase;

				}



				.news-detail .comments .comment-sec .detail span {

					font-size: 16px;

					color: #565656;

					margin: 8px 0 0 0;

					float: left;

				}



				.news-detail .comments .comment-sec .detail a {

					margin: 8px 0 0 12px;

					display: inline-block;

				}



					.news-detail .comments .comment-sec .detail a:hover {

						color: #000;

					}



				.news-detail .comments .comment-sec .detail p {

					font-size: 18px;

					line-height: 23px;

					margin: 12px 0 0 0;

				}



			.news-detail .comments .comment-sec.reply-sec {

				background: #fdf6e8;

				padding: 35px 30px;

			}



		.news-detail .comment-form .form {

			margin: 30px 0 0 0;

		}



			.news-detail .comment-form .form input[type=text] {

				border: none;

				border-bottom: solid 2px #c2c2c2;

				width: 100%;

				font-size: 18px;

				color: #222222;

				padding: 0px 0 10px 0;

				margin: 0 0 30px 0;

			}



			.news-detail .comment-form .form textarea {

				border: none;

				border-bottom: solid 2px #c2c2c2;

				width: 100%;

				font-size: 18px;

				color: #222222;

				padding: 0px 0 10px 0;

				margin: 0 0 30px 0;

				height: 202px;

			}









	/*..... CONATCT US ......*/

	.contact-detail {

	}



		.contact-detail .office {

			float: left;

			width: 350px;

			margin: 0 0 60px 0;

		}



			.contact-detail .office.office-right {

				float: right;

			}



			.contact-detail .office h5 {

				text-transform: uppercase;

			}



			.contact-detail .office .detail {

				float: left;

				margin: 15px 0 0 0;

			}



			.contact-detail .office span {

				font-size: 20px;

				display: block;

				line-height: 31px;

			}



				.contact-detail .office span.address {

					margin: 30px 0 0 0;

				}



		.contact-detail .inquiries h5 {

			text-transform: uppercase;

		}



		.contact-detail .inquiries .form {

			margin: 20px 0 0 0;

		}



			.contact-detail .inquiries .form input[type=text] {

				border: none;

				/*border-bottom: solid 2px #c2c2c2;*/

				width: 100%;
				
				background-color: #eee;

				font-size: 16px;

				color: #222222;

				padding: 10px 0 10px 10px;

				margin: 0 0 10px 0;

			}



			.contact-detail .inquiries .form textarea {

				border: none;

				/*border-bottom: solid 2px #c2c2c2;*/

				width: 100%;
				
				background-color: #eee;

				font-size: 16px;

				color: #222222;

				padding: 10px 0 10px 10px;

				margin: 0 0 10px 0;

				height: 202px;

			}



	/*..... MAP ......*/

	#find-us {

		height: 520px;

		width: 100%px;

	}



	.gm-style-iw * {

		display: block;

		width: 270px !important;

		overflow: hidden;

	}



	.gm-style-iw h4, .gm-style-iw p {

		margin: 0;

		padding: 0;

	}



	.gm-style-iw a {

		color: #4272db;

	}





	/*..... WORK ......*/

	.all-work {

		margin: 0 0 120px 0;

	}







	/*..... WORK DETAIL ......*/

	.project-features {

		background: #f7f8f9;

		padding: 35px;

		float: left;

		width: 100%;

	}



		.project-features .feature-sec {

			float: left;

			width: 20%;

			text-align: center;

		}



			.project-features .feature-sec h6 {

			}



			.project-features .feature-sec span {

				margin: 5px 0 0 0;

				display: block;

			}



	.project-detail {

		text-align: center;

		padding: 75px 0;

		display: inline-block;

		width: 100%;

	}



		.project-detail .detail-sec {

			width: 82%;

			display: inline-block;

		}



		.project-detail img {

			width: auto;

		}



		.project-detail .text {

			margin: 42px 0 0 0;

		}



			.project-detail .text h3 {

				text-transform: uppercase;

				font-weight: 800;

			}



			.project-detail .text p {

				margin: 10px 0 0 0;

			}



	.project-images {

		margin: 0 0 120px 0;

		display: inline-block;

	}



		.project-images img {

			margin: 0 0 30px 0;

		}











	.video-sec {

		background: url(../images/video-bg.jpg) no-repeat fixed;

		height: 100%;

		width: 100%;

		text-align: center;

		padding: 155px 0;

	}



	.design-text {

	}



		.design-text h4 {

			text-transform: uppercase;

		}



		.design-text p {

			margin: 10px 0 0 0;

		}



	.parallax-bg {

		background: url(../images/parallax-bg.jpg) no-repeat fixed;

		width: 100%;

		height: 615px;

	}


	.cb-header {

		position: fixed;

		left: 0;

		visibility: hidden;

	}

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

Main components 

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

.cd-header {
    position: fixed;
    top: 0;
    right: 0;

    height: 50px;

    z-index: 1003;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.cd-primary-nav-trigger {
    top: 30px !important;
    right: 15px !important;
}

@media only screen and (min-width: 768px) {
    .cd-header {

        background: transparent;
        box-shadow: none;
    }
}

@media only screen and (min-width: 1170px) {
    .cd-header {
        -webkit-transition: background-color 0.3s;
        -moz-transition: background-color 0.3s;
        transition: background-color 0.3s;
        /* Force Hardware Acceleration in WebKit */
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    .cd-header.is-fixed {
        /* when the user scrolls down, we hide the header right above the viewport */
        position: fixed;
        top: -80px;
        background-color: #666;
        -webkit-transition: -webkit-transform 0.3s;
        -moz-transition: -moz-transform 0.3s;
        transition: transform 0.3s;
    }

    .cd-header.is-visible {
        /* if the user changes the scrolling direction, we show the header */
        -webkit-transform: translate3d(0, 100%, 0);
        -moz-transform: translate3d(0, 100%, 0);
        -ms-transform: translate3d(0, 100%, 0);
        -o-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }

    .cd-header.menu-is-open {
        /* add a background color to the header when the navigation is open */

    }
}

.cd-logo {
    display: block;
    position: absolute;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    left: .875em;
}

.cd-logo img {
    display: block;
}

@media only screen and (min-width: 768px) {
    .cd-logo {
        left: 2.6em;
    }
}

.cd-secondary-nav {
    position: absolute;
    top: 50%;
    bottom: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 10em;
    /* hidden on small devices */
    display: none;
}

.cd-secondary-nav li {
    display: inline-block;
    margin-left: 2.2em;
}

.cd-secondary-nav a {
    display: inline-block;
    color: white;
    text-transform: uppercase;
    font-weight: 700;
}

@media only screen and (min-width: 768px) {
    .cd-secondary-nav {
        display: block;
    }
}

.cd-primary-nav-trigger {
    position: absolute;
    right: 0;
    top: 0;

    height: 100%;
    width: 50px;
    background-color: #03263d;
}

.cd-primary-nav-trigger .cd-menu-text {
    color: white;
    text-transform: uppercase;
    font-weight: 700;
    /* hide the text on small devices */
    display: none;
}

.cd-primary-nav-trigger .cd-menu-icon {
    /* this span is the central line of the menu icon */
    display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    bottom: auto;
    right: auto;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 18px;
    height: 2px;
    background-color: #000;
    -webkit-transition: background-color 0.3s;
    -moz-transition: background-color 0.3s;
    transition: background-color 0.3s;
    /* these are the upper and lower lines in the menu icon */
}

.cd-primary-nav-trigger .cd-menu-icon::before,
.cd-primary-nav-trigger .cd-menu-icon:after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #000;
    right: 0;
    -webkit-transition: -webkit-transform .3s, top .3s, background-color 0s;
    -moz-transition: -moz-transform .3s, top .3s, background-color 0s;
    transition: transform .3s, top .3s, background-color 0s;
}

.cd-primary-nav-trigger .cd-menu-icon::before {
    top: -5px;
}

.cd-primary-nav-trigger .cd-menu-icon::after {
    top: 5px;
}

.cd-primary-nav-trigger .cd-menu-icon.is-clicked {
    background-color: rgba(255, 255, 255, 0);
}

.cd-primary-nav-trigger .cd-menu-icon.is-clicked::before,
.cd-primary-nav-trigger .cd-menu-icon.is-clicked::after {
    background-color: #000;
}

.cd-primary-nav-trigger .cd-menu-icon.is-clicked::before {
    top: 0;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
}

.cd-primary-nav-trigger .cd-menu-icon.is-clicked::after {
    top: 0;
    -webkit-transform: rotate(225deg);
    -moz-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    -o-transform: rotate(225deg);
    transform: rotate(225deg);
}

@media only screen and (min-width: 310px) {
    .cd-primary-nav-trigger {
        padding: 11px 0;
        border-radius: 7px;
        background-color: #fff;
        height: 30px;
        line-height: 30px;
        right: 2.2em;

        bottom: auto;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);

    }

    .cd-header.menu-is-open {
        position: fixed;
    }

    .cd-primary-nav-trigger .cd-menu-text {
        display: inline-block;
    }

    .cd-primary-nav-trigger .cd-menu-icon {
        left: auto;
        right: 1em;
        -webkit-transform: translateX(0) translateY(-50%);
        -moz-transform: translateX(0) translateY(-50%);
        -ms-transform: translateX(0) translateY(-50%);
        -o-transform: translateX(0) translateY(-50%);
        transform: translateX(0) translateY(-50%);
    }
}

.cd-primary-nav {
    /* by default it's hidden - on top of the viewport */
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;

    z-index: 1002;
    text-align: center;
    padding: 50px 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow: auto;
    /* this fixes the buggy scrolling on webkit browsers - mobile devices only - when overflow property is applied */
    -webkit-overflow-scrolling: touch;
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
}

.cd-primary-nav li {
    font-size: 22px;
    font-size: 1.375rem;
    font-weight: 300;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: .2em 0;
    text-transform: capitalize;
}

.cd-primary-nav a {
    display: inline-block;

    -webkit-transition: background 0.2s;
    -moz-transition: background 0.2s;
    transition: background 0.2s;
    font-family: 'Raleway', sans-serif;
    color: #fff;
    font-size: 88px;
    font-weight: 900;
    text-transform: uppercase;
}

.cd-primary-nav a:hover {
    color: #111;
}

.cd-primary-nav .social-icons {
    margin: 60px 0 0 0;
}

.cd-primary-nav .social-icons a {
    padding: 0px;
    width: auto;
    font-size: 36px;
}

.cd-primary-nav .social-icons a:hover {
    background: none;
}

.cd-primary-nav .social-icons span {
    font-size: 36px;
    border-radius: 100%;
}

.cd-primary-nav .social-icons span:hover {
    background: #fff;
    color: #111;
}

.cd-primary-nav .cd-label {
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 14px;
    font-size: 0.875rem;
    margin: 2.4em 0 .8em;
}

.cd-primary-nav .cd-social {
    display: inline-block;
    margin: 0 .4em;
}

.cd-primary-nav .cd-social a {
    width: 44px;
    height: 44px;
    padding: 0;
    background-image: url("../img/cd-socials.svg");
    background-repeat: no-repeat;
    /* image replacement */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

.cd-primary-nav .cd-facebook a {
    background-position: 0 0;
}

.cd-primary-nav .cd-instagram a {
    background-position: -44px 0;
}

.cd-primary-nav .cd-dribbble a {
    background-position: -88px 0;
}

.cd-primary-nav .cd-twitter a {
    background-position: -132px 0;
}

.cd-primary-nav.is-visible {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

@media only screen and (min-width: 768px) {
    .cd-primary-nav {
        padding: 80px 0;
    }
}

@media only screen and (min-width: 1170px) {
    .cd-primary-nav li {
        font-size: 30px;
        font-size: 1.875rem;
    }

    .cd-primary-nav .cd-label {
        font-size: 16px;
        font-size: 1rem;
    }
}

.cd-intro {
    position: relative;
    height: 100%;
    background: url("../img/cd-background-img.jpg") no-repeat center center;
    background-size: cover;
    z-index: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.cd-intro h1 {
    position: absolute;
    width: 90%;
    max-width: 1170px;
    left: 50%;
    top: 50%;
    bottom: auto;
    right: auto;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    color: white;
    font-size: 20px;
    font-size: 1.25rem;
    font-weight: 300;
    text-align: center;
}

@media only screen and (min-width: 768px) {
    .cd-intro h1 {
        font-size: 30px;
        font-size: 1.875rem;
    }
}

@media only screen and (min-width: 1170px) {
    .cd-intro {
        height: 700px;
    }
}

.cd-main-content {
    position: relative;
    z-index: 1;
}

.cd-main-content p {
    line-height: 1.6;
    margin: 2em 0;
}

@media only screen and (min-width: 1170px) {
    .cd-main-content p {
        font-size: 20px;
        font-size: 1.25rem;
    }
}





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

Simple Drop menu 

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


ul.sub-menu {
    text-align: left;
    display: inline;
    margin: 0 0 0 -1px;
    padding: 15px 4px 17px 0;
    list-style: none;
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
    z-index: 1500;

}


.navi ul.sub-menu li {
    position: relative;

    background: #000;

    width: auto;
    cursor: pointer;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;

    border-left: none;
    line-height: 50px;
    text-align: center;
    margin: -1px 0 0 0;
}

.navi ul.sub-menu li:last-child {
    border-bottom: none;
}

.navi ul.sub-menu a {
    font-weight: 500 !important;
    text-transform: uppercase;
    padding: 12px 52px;
    line-height: 21px;
    background: none;
    width: 100px;
    margin: 0px !important;
    color: #fff !important;
    font-size: 14px;
    margin: 0px;
    display: block;
}

.navi ul.sub-menu a:hover {
    background: none;
    color: #fff !important
}

.navi ul.sub-menu li:hover a {
    color: #fff !important
}



.navi ul li ul {
    padding: 0;
    position: absolute;


    width: 200px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    display: none;
    opacity: 0;
    visibility: hidden;
    -webkit-transiton: opacity 0.2s;
    -moz-transition: opacity 0.2s;
    -ms-transition: opacity 0.2s;
    -o-transition: opacity 0.2s;
    -transition: opacity 0.2s;
}

.navi ul li ul li {
    background: #555;
    display: block;
    color: #fff;

}

.navi ul li ul li:hover {
    border-right: none !important;
    background: #EF4035;
    color: #fff;
}

.navi ul li:hover ul {
    display: block;
    opacity: 1;
    visibility: visible;
    padding: 15px 0 0 0;
    margin: 0 0 0 20px;
}


.arrow-up {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid black;
    text-align: center;
    left: 45%;
    position: relative;
}