@charset "utf-8";
/*
/*	Copyright 2012. ThemeMarket.
/*

/**************************************************/
/*	LIST OF SECTION :
		
		1) HEADER
		2) NAV
		3) TITLE
		4) ABOUT
		5) SERVICE
		6) WORKS
		7) TEAM
		8) CONTACT
		9) FOOTER
/**************************************************/
.body-wrapper, #header, #about, #services, #works, #team, #contact, #footer {
	width:100%;
	margin:0;
	padding:0;
	float:left;
	z-index:9999;
	position:relative;
}
.body-wrapper{
	background:#23272a;
}
#about, #works, #contact{
	background:#FFF;
	padding-bottom:50px;
}
#services, #team{
	padding-bottom:50px;
	background:#23272a;
}
#footer{
	background:#23272a;
}
#loading-mask {
    background-color: #000;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999999999;
	text-align:center;
	opacity:0.9;
}
#loading-mask p{
	color:#FFF;
	margin:400px 0 0 0;
	background:#000;
	text-align:center;
	font-size:20px;
}

/*------------------------------------------------------------------*/ 
/*	1) Header
/*------------------------------------------------------------------*/
.logo{
	text-align:center;
	margin:60px 0;
	z-index:10;
	bottom:0;
	position:fixed;
}
.slider{
	width:100%;
	float:left;
	position:absolute;
}

/*------------------------------------------------------------------*/ 
/*	2) Nav
/*------------------------------------------------------------------*/
#nav{
	float:left;
	width:100%;
	background:#FC5703;
	height:45px;
	border-bottom:1px solid #A13600;
	border-top:1px solid #A13600;
	clear:both;
	z-index:10000;
	box-shadow:0 0 2px #A13600;
	-moz-box-shadow:0 0 2px #A13600;
	-webkit-box-shadow:0 0 2px #A13600;
	position:relative;
	
}
#nav ul{
	list-style-type:none;
	text-align:center;
	margin:12px auto;
	width:940px;
	position:relative;
}
#nav ul li{
	display:inline-block;
	margin:0 23px;
	font-size:18px;
	line-height:1;
}
#nav ul li a{
	text-decoration:none;
	color:#FFFFFF;
	-webkit-transition:color 0.7s ease-in;  
	-moz-transition:color 0.7s ease-in;  
	-o-transition:color 0.7s ease-in;  
	transition:color 0.7s ease-in; 
	font-family:'Exobold', Arial, sans-serif;
}
#nav ul li.current a{
	color:#5E2906;
}
#nav ul li a:hover{
	color:#5E2906;
}
.sticky-wrapper{
	float:left;
	width:100%;
	
}

/*------------------------------------------------------------------*/ 
/*	3) Title
/*------------------------------------------------------------------*/
.title-white{
	padding:34px 0 22px 0;
	border-bottom:1px dashed #d9d9d9;
	float:left;
	margin-bottom:60px;
}
.title-white h1{
	color:#d9d9d9;
	margin:0;
	float:left;
	padding:0;
	font-family:'Exoextrabold', Arial, sans-serif;
}
.title-white p{
	border-left:1px solid #d9d9d9;
	float:left;
	margin:30px 0 0 50px;
	height:60px;
	padding:15px 0 0 50px;
	font-family:'Juergen', Arial, sans-serif;
	font-size:30px;
	color:#d9d9d9;
	font-weight:normal;
}

.title-black{
	padding:34px 0 22px 0;
	border-bottom:1px dashed #3c4246;
	float:left;
	margin-bottom:60px
}
.title-black h1{
	color:#3c4246;
	margin:0;
	float:left;
	padding:0;
	font-weight:bold;
	font-family:'Exoextrabold', Arial, sans-serif;
}
.title-black p{
	border-left:1px solid #3c4246;
	float:left;
	margin:30px 0 0 50px;
	height:60px;
	padding:15px 0 0 50px;
	font-family:'Juergen', Arial, sans-serif;
	font-size:30px;
	color:#3c4246;
	font-weight:normal;
}

/*------------------------------------------------------------------*/ 
/*	4) About
/*------------------------------------------------------------------*/
.idea{
	background:url(../img/idea.png) no-repeat;
	background-position:94% 0%;
	height:550px;
	margin-bottom:30px;
}
.idea-desc{
	float:left;
	width:460px;
}
.idea-desc h1{
	font-weight:bold;
	margin:0;
	padding:0;
}
h1.n1{ font-size:83px; margin-bottom:-30px; color:#333333; font-family:'Exomedium', Arial, sans-serif; }
h1.n2{ font-size:55px; margin-bottom:-30px; color:#333333; font-family:'Exothin', Arial, sans-serif; }
h1.n3{ font-size:65px; color:#fc5703; font-family:'Exobold', Arial, sans-serif; }
.idea-desc h4{
	text-transform:uppercase;
	margin:0;
}
.idea-icons{
	width:460px;
	float:left;
	margin-left:20px;
	height:550px;
	position:relative;
	display:block;
	z-index:1000;
}
span.icons{
	position:absolute;
	float:left;
	display:block;
}
span.icon1{margin:129px 0 0 122px;}
span.icon2{margin:95px 0 0 241px;}
span.icon3{margin:33px 0 0 222px;}
span.icon4{margin:58px 0 0 291px;}
span.icon5{margin:72px 0 0 150px;}
span.icon6{margin:135px 0 0 279px;}
span.icon7{margin:136px 0 0 225px;}
span.icon8{margin:106px 0 0 322px;}
span.icon9{margin:109px 0 0 178px;}
span.icon10{margin:210px 0 0 206px;}
span.icon11{margin:160px 0 0 177px;}
span.icon12{margin:155px 0 0 332px;}
span.icon13{margin:179px 0 0 142px;}
span.icon14{margin:207px 0 0 269px;}
span.icon15{margin:280px 0 0 197px;}
span.icon16{margin:229px 0 0 164px;}
span.icon17{margin:250px 0 0 238px;}
span.icon18{margin:275px 0 0 282px;}
span.icon19{margin:182px 0 0 298px;}
span.icon20{margin:328px 0 0 201px;}
span.icon21{margin:310px 0 0 239px;}
span.icon22{margin:319px 0 0 274px;}
span.icon23{margin:223px 0 0 305px;}
span.icon24{margin:356px 0 0 239px;}
span.idea-contact{
	background:url(../img/ideacontact.png) no-repeat;
	background-position:0% 0%;
	display:block;
	width:49px;
	height:37px;
	float:left;
	margin:425px 0 0 230px;
	position:absolute;
}
span.contact-text{
	float:left;
	position:absolute;
	font-family:'Juergen', Arial, sans-serif;
	font-size:30px;
	color:#d9d9d9;
	margin:330px 0 0 380px;
	-webkit-transform: rotate(-30deg);/* Safari */
	-moz-transform: rotate(-30deg);/* Firefox */
	-ms-transform: rotate(-30deg);/* IE */
	-o-transform: rotate(-30deg);/* Opera */
}
.approach{
	padding:0 0 15px 0;
	z-index:1000;
}
.approach h4.ap-tit{
	text-transform:uppercase;
	margin:0 0 20px 0;
	color:#464A55;
}
.approach-line{
	width:0px;
	height:210px;
	margin-top:-13px;
	background:url(../img/approach2.png) no-repeat;
	background-position:135px 0;
	position:absolute;
	z-index:-1;
	
}
.approach1{
	width:102px;
	height:102px;
	padding:30px;
	float:left;
	margin:-1px 99px 0 -1px;
	background:#FFFFFF;
	background:url(../img/approach-circle.png) no-repeat;
	text-align:center;
	opacity:0;
}
.approach2{
	width:102px;
	height:102px;
	padding:30px;
	float:left;
	margin:19px 99px 0 -1px;
	background:#FFFFFF;
	background:url(../img/approach-circle.png) no-repeat;
	text-align:center;
	opacity:0;
}
.approach3{
	width:102px;
	height:102px;
	padding:30px;
	float:left;
	margin:-1px 98px 0 -1px;
	background:#FFFFFF;
	background:url(../img/approach-circle.png) no-repeat;
	text-align:center;
	opacity:0;
}
.approach4{
	width:102px;
	height:102px;
	padding:30px;
	float:left;
	margin:19px 0 0 -1px;
	background:#FFFFFF;
	background:url(../img/approach-circle.png) no-repeat;
	text-align:center;
	opacity:0;
}
.approach h4{
	margin:5px 0 0 0;
	text-transform:uppercase;
	color:#d9d9d9;
}

/*------------------------------------------------------------------*/ 
/*	5) Service
/*------------------------------------------------------------------*/
.all-service{
	float:left;
	overflow:hidden;
}
.service-circles{
	float:left;
	height:783px;
	background:url(../img/service-line.png) no-repeat;
	background-position:48% 50%;
}
.service-circles img{
	margin:35px 0 0 0;
}
.service-circles h4{
	margin:10px 0 0 0;
	font-size:15px;
	text-transform:;
}
.center-circle{
	background:url(../img/service-center.png) no-repeat;
	width:310px;
	height:310px;
	position:absolute;
	margin:236px 0 0 328px;
	text-align:center;
	z-index:1000;
}
.center-circle img{
	margin:80px 0 0 0;
}
.center-circle h4{
	color:#FFF;
	text-transform:uppercase;
}
.service1, .service2, .service3, .service4, .service5, .service6{ background:url(../img/service-circle.png) no-repeat; width:168px; height:168px; text-align:center;}
.service1{
	margin:0 0 0 388px;
	position:absolute;
}
.service2{
	margin:152px 0 0 121px;
	position:absolute;
}
.service3{
	margin:152px 0 0 657px;
	position:absolute;
}
.service4{
	margin:463px 0 0 121px;
	position:absolute;
}
.service5{
	margin:463px 0 0 657px;
	position:absolute;
}
.service6{
	margin:617px 0 0 388px;
	position:absolute;
}
.service-description {
	text-align:center;
	margin-top:0px;
}
.service-description p, .service-description h4{
	color:#FFF;
	margin-right:10px;
	margin-left:10px;
	text-align:left
}
.service-description h4{
	text-transform:uppercase;
	margin-bottom:0;
}
@-webkit-keyframes spin {  
from {  
    -webkit-transform: rotate(0deg);
}  
to {  
    -webkit-transform: rotate(360deg); 
    }  
}
@-webkit-keyframes spinback {  
from {  
    -webkit-transform: rotate(0deg);  
}  
to {  
    -webkit-transform: rotate(-360deg);  
    }  
}
.service-circles{  
    -webkit-animation-name: spin;  
    -webkit-animation-iteration-count: infinite;  
    -webkit-animation-timing-function: linear;  
    -webkit-animation-duration: 40s; 
}  
.service1, .service2, .service3, .service4, .service5, .service6{  
    -webkit-animation-name: spinback;  
    -webkit-animation-iteration-count: infinite;  
    -webkit-animation-timing-function: linear;  
    -webkit-animation-duration: 40s;  
}

/*------------------------------------------------------------------*/ 
/*	6) WORKS
/*------------------------------------------------------------------*/
.work-item{
	margin-bottom:10px;
	height:320px;
}
.view-item{
	width:280px;
	height:180px;
	border:10px solid #d9d9d9;
	box-shadow:0 0 2px #666666;
	margin-bottom:20px;
}
.view-item>img{
	width:280px;
	height:180px;
}
.mask{
	width:280px;
	height:180px;
}
.work-item h4{
	margin-top:13px;
	text-align:center;
	margin-bottom:7px;
}
.work-item p{
	text-align:center;
	margin-top:0;
}
.view-item>img {
   -webkit-transform: scaleY(1);
   -moz-transform: scaleY(1);
   -o-transform: scaleY(1);
   -ms-transform: scaleY(1);
   transform: scaleY(1);
   -webkit-transition: all 0.7s ease-in-out;
   -moz-transition: all 0.7s ease-in-out;
   -o-transition: all 0.7s ease-in-out;
   -ms-transition: all 0.7s ease-in-out;
   transition: all 0.7s ease-in-out;
}
.view-item .mask {
   background-color: rgba(255, 231, 179, 0.3);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}

.view-item p {
   color: #FFF;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   border-bottom: 1px solid rgba(255, 255, 255, 0.2);
   background: transparent;
   margin: 20px 20px 0px 20px;
   padding-bottom:10px;
}
.view-item a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transform: scale(0);
   -moz-transform: scale(0);
   -o-transform: scale(0);
   -ms-transform: scale(0);
   transform: scale(0);
   -webkit-transition: all 0.5s linear;
   -moz-transition: all 0.5s linear;
   -o-transition: all 0.5s linear;
   -ms-transition: all 0.5s linear;
   transition: all 0.5s linear;
   background:url(../img/magnify.png) no-repeat center;
   width:25px;
   height:25px;
   display:block;
   margin:15px 0 0 92px;
   padding:6px 35px;
   border:1px solid rgba(255, 255, 255, 0.2);
}
.view-item a.info:hover{
	border:1px solid rgba(255, 255, 255, 1);
}
.view-item:hover>img {
   -webkit-transform: scale(10);
   -moz-transform: scale(10);
   -o-transform: scale(10);
   -ms-transform: scale(10);
   transform: scale(10);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
}
.view-item:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.view-item:hover p,.view-item:hover a.info {
   -webkit-transform: scale(1);
   -moz-transform: scale(1);
   -o-transform: scale(1);
   -ms-transform: scale(1);
   transform: scale(1);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.view-item {
   float: left;
   overflow: hidden;
   position: relative;
   text-align: center;
   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6;
   cursor: default;
   background:#FC5703;
}
.view-item .mask,.view-item .content {
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view-item img {
   display: block;
   position: relative;
}
/*------------------------------------------------------------------*/ 
/*	7) TEAM
/*------------------------------------------------------------------*/
a.twitter  { background:#fff url(../img/social/twitter.png) no-repeat center; margin:0 0 0 120px;}
a.facebook { background:#fff url(../img/social/facebook.png) no-repeat center; margin:42px 0 0 162px;}
a.vimeo    { background:#fff url(../img/social/vimeo.png) no-repeat center; margin:98px 0 0 175px;}
a.skype    { background:#fff url(../img/social/skype.png) no-repeat center; margin:153px 0 0 162px;}
a.linkedin { background:#fff url(../img/social/linkedin.png) no-repeat center; margin:195px 0 0 120px;}


a.social-icons{
	width:45px;
	height:45px;
	border-radius:100px;
	-moz-border-radius:100px;
	-webkit-border-radius:100px;
	display:block;
	position:absolute; 
}
a.social-icons:hover{
	background-color:#FC5703;
}
.team-members{
	background:url(../img/team-line.png) no-repeat;
	background-position:1px 170px;
	margin:0 45px 20px 45px;
	width:230px;
	float:left;
	height:400px;
	text-align:left;
}
.team-members h4{
	text-transform:uppercase;
}
.team-members h4, .team-members p{
	color:#FFF;
	margin-bottom:5px;
	margin-top:0;
}
.member-image{
	width:160px;
	height:160px;
	border:5px solid #d9d9d9;
	box-shadow:0 0 2px #666666;
	border-radius:160px;
	-moz-border-radius:160px;
	-webkit-border-radius:160px;
	background:#FFF;
	margin-top:35px;
	margin-bottom:60px;
	overflow:hidden;
}
.member-image img{
	width:160px;
	height:160px;
	border-radius:160px;
	-moz-border-radius:160px;
	-webkit-border-radius:160px;
	overflow:hidden;
	vertical-align:baseline;
	z-index:1;
	position:relative;
}
.about-team h4{
	color:#FFF;
	text-transform:uppercase;
	margin-bottom:0;
}
.about-team p{
	color:#FFF;
}

/*------------------------------------------------------------------*/ 
/*	8) Contact
/*------------------------------------------------------------------*/
.map{
	width:100%;
	height:400px;
	border-bottom:10px solid #d9d9d9;
	border-top:10px solid #d9d9d9;
	float:left;
	clear:both;
	box-shadow:0 0 1px #333333;
	-moz-box-shadow:0 0 1px #333333;
	-webkit-box-shadow:0 0 1px #333333;
}
span.address-text{
	background:url(../img/home.png) no-repeat left top;
	padding:0 0 0 30px;
	clear:both;
	display:block;
}
span.email-text{
	background:url(../img/message.png) no-repeat left top;
	padding:0 0 0 30px;
	clear:both;
	background-position:0 3px;
	display:block;
}
span.phone-text{
	background:url(../img/phone.png) no-repeat left top;
	padding:0 0 0 30px;
	clear:both;
	display:block;
}
.form{
	margin:40px 0 0 0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#333333;
}
.input-section{
	float:left;
	clear:both;
	width:100%;
	margin:0 0 20px 0;
	padding:0;
}
.input-section input{
	float:left;
	width:278px;
	height:18px;
	border:1px solid #dddddd;
	background:#fbfbfb;
	padding:5px 10px;
	box-shadow:0 1px 1px #999999;
	-moz-box-shadow:0 1px 1px #999999;
	-webkit-box-shadow:0 1px 1px #999999;
}
.input-section textarea{
	float:left;
	width:278px;
	height:100px;
	border:1px solid #dddddd;
	background:#fbfbfb;
	padding:10px;
	resize:vertical;
	box-shadow:0 1px 1px #999999;
	-moz-box-shadow:0 1px 1px #999999;
	-webkit-box-shadow:0 1px 1px #999999;
	font-family:inherit;
	font-size:14px;
}
.input-section label{
	margin:5px 0 0 20px;
	float:left;
}
.input-section a.send{
	width:280px;
	height:20px;
	text-align:center;
	background:#fc5703;
	display:block;
	color:#FFF;
	text-decoration:none;
	text-transform:uppercase;
	font-weight:bold;
	padding:5px 10px;
	box-shadow:0 1px 1px #a13600;
	-moz-box-shadow:0 1px 1px #a13600;
	-webkit-box-shadow:0 1px 1px #a13600;
	border-bottom:1px solid #a13600;
}
.alertMessage ul li{
	margin:0 0 15px 0;
	color:#a13600;
	font-size:12px;
}
.alertMessage ul{
	margin:0 0 0 15px;
	padding:0;
}
/*------------------------------------------------------------------*/ 
/*	9) Footer
/*------------------------------------------------------------------*/
#footer{
	text-align:center;
	padding:20px 0;
}
#footer p{
	color:#4b4e51;
	font-family:'Exoregular', Arial, sans-serif;
	font-size:14px;
	margin:5px 0 0 0;
}
#footer p a{  
	color:#4b4e51; 
	text-decoration:none;
	-webkit-transition:color 1s ease-in;  
	-moz-transition:color 1s ease-in;  
	-o-transition:color 1s ease-in;  
	transition:color 1s ease-in;  
}  
#footer p a:hover{color:#FFF;}
#footer ul{
	list-style-type:none;
	text-align:center;
	margin:10px 0;
	padding:0;
}
#footer ul li{
	width:50px;
	height:50px;
	display:inline-table;
}
a.foot-icons{
	width:50px;
	height:50px;
	display:block;
}
a.foot-facebook { background:url(../img/social/facebook2.png) no-repeat center; }
a.foot-twitter { background:url(../img/social/twitter2.png) no-repeat center; }
a.foot-skype { background:url(../img/social/skype2.png) no-repeat center; }
a.foot-linkedin { background:url(../img/social/linkedin2.png) no-repeat center; }
a.foot-vimeo { background:url(../img/social/vimeo2.png) no-repeat center; }

a.foot-facebook:hover { background:url(../img/social/facebook.png) no-repeat center; }
a.foot-twitter:hover { background:url(../img/social/twitter.png) no-repeat center; }
a.foot-skype:hover { background:url(../img/social/skype.png) no-repeat center; }
a.foot-linkedin:hover { background:url(../img/social/linkedin.png) no-repeat center; }
a.foot-vimeo:hover { background:url(../img/social/vimeo.png) no-repeat center; }