* { -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-backface-visibility:hidden;}
a, .fw-wrap ul li > div .fw-caption, header.header, .fw-caption h3, .fw-wrap ul li > div img, .newsletter-box .stay-connected, .header-nav { -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
html, body { height:100%;width:100%;}
body { font-family: 'Open Sans', sans-serif;}
/* Normal 400Normal 400 ItalicLight 300 ItalicLight 300Semi-Bold 600 ItalicSemi-Bold 600Bold 700Bold 700 ItalicExtra-Bold 800Extra-Bold 800 Italic */
a { text-decoration:none;}
.clear { clear:both;}
.wrap, .inner-wrap { margin:0 auto;max-width:1200px;padding:0 15px;}
.inner-wrap { max-width:960px;padding:30px 0}
.loader { position: fixed;left: 0px;top: 0px;width: 100%;height: 100%;z-index: 9999;background: url('../img/preloader.gif') 50% 50% no-repeat rgb(249,249,249);}
label.error { color:#ef483f;}
.go-to-top { position:fixed;bottom:20px;right:20px;background-color:#ffffff;background-image:url(../img/arrow-up.png);background-position:center;background-repeat:no-repeat;box-shadow:0 0 2px rgba(0,0,0,0.2);border:1px solid #dfdfdf;width:50px;height:50px;border-radius:3px;opacity:0;-webkit-transition:all 0.3s;z-index:1000;}
.show-gtt { opacity:1;}

.item img {
    width: 90%;
}

/* header */
header.header { background-color:rgba(255,255,255,0);position:absolute;top:0;left:0;right:0;padding:40px 0;z-index:1000;}

.logo-white { background-position:0 0;}
.logo-black { background-position:0 -44px;}
header.sticky-header { background-color:rgba(255,255,255,1);filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#ffffff');padding:15px;position:fixed;-webkit-box-shadow:0 0 7px rgba(0,0,0,0.15);-moz-box-shadow:0 0 7px rgba(0,0,0,0.15);behavior:url(PIE.htc); box-shadow: #000000 0px 0px 7px;}
header.sticky-header .header-nav ul li a { color:#222222;}
.header-control { display:none;float:right;width:50px;height: 40px;background-image:url(../img/sprite.png); background-position:0 -106px;}
.header-nav { float:right;margin-top:12px;}
.header-nav ul li { float:left;margin-left:40px;}
.header-nav ul li:first-child { margin-left:0;}
.header-nav ul li a { color:#ffffff;font-size:12px;font-weight:600;text-transform:uppercase;}
.header-nav ul li a:hover, .header-nav ul li a.active { color:#ef4035 !important;}
.header .logo { position:relative;top:-20px;}
.sticky-header .logo { top:0px;}
section { width:100%;position:relative;}
section h2 { font-size:22px;text-transform:uppercase;margin-bottom:15px;letter-spacing:1px;}
section h2 span { color:#848484;font-size:14px;font-weight:400;text-transform:lowercase;}
section h2, section p { color:#100f0f;font-weight:400;text-align:center;}
section p { font-size:14px;line-height:20px;}
section p a { color:#ef4035;}
section p a:hover { text-decoration:underline;}

/* main */
.main-landing-wrap { max-width:1000px;}
/*section#main { background-color:#ffffff;background-image:url(../img/bg-main.png);background-position:0 0;background-repeat:no-repeat;background-size:cover;height:100%;}*/
.main-landing-wrap h1 { color:#ffffff;display:block;font-size:30px;font-weight:300;line-height:48px;margin:0 auto;padding:5em 0 1em;text-align:center;}
.main-landing-wrap h1 strong { font-weight:600;}
.main-landing-wrap h2 { color:#ef4035;font-size:20px;font-weight:300;text-align:center;font-style:italic;text-transform:uppercase;}
section#main .scroll-down { position:absolute;left:50%;bottom:20px;width:60px;text-align:center;text-transform:uppercase;font-size:12px;color:#ffffff;margin-left:-30px;}
.icon-scroll-down { background-image:url(../img/sprite.png);background-position:0 0;background-repeat:no-repeat;height:32px;width:16px;margin:0 auto 10px auto;display:block;-webkit-animation:scrollDown 0.8s infinite;-moz-animation:scrollDown 0.8s infinite;animation:scrollDown 0.8s infinite;position:relative;top:0px;}

/* info bar */
#info-bar { background-color:#100f0f;box-shadow:0 -1px 5px rgba(0,0,0,0.75);padding:30px 0;}
.info-bar-inner > div { float:left;width:33%;}
.ib-start-project { width:34%;}
.info-bar-inner i.icon-ib { background-image:url(../img/sprite.png);background-repeat:no-repeat;width:34px;height:34px;float:left;}
.info-bar-inner i.icon-ibp { background-position:-17px 0;}
.info-bar-inner i.icon-ibe { background-position:-51px 0;}
.info-bar-inner h6 { color:#ffffff;float:left;margin:10px 0 0 6px;font-size:14px;font-weight:300; cursor:pointer;}
.ib-start-project a { display:table;margin:0 auto;padding:10px;border:2px solid #ef4035;color:#ffffff;font-size:14px;font-weight:300;}
.ib-start-project a:hover { background-color:#ef4035;}
.ib-email i.icon-ibe, .ib-email h6 { float:right;}

/* service */
#service { padding:50px 0;}
.page-id-10 #contact-main #service { padding-top:150px;}
#service h2 { margin-bottom:20px;}
#service p.main-para { margin:0 80px 15px 80px;}
#service ul { overflow:hidden;}
#service ul li { float:left;width:33.33%;padding:0 20px;list-style:none;cursor:pointer;background:#ffffff;height:200px;}
.page-id-10 #service ul li { background: rgba(0,0,0,0.5) !important;}
#service ul li:hover { background-color:#fafafa;}
#service ul li h3, #service ul li p { color:#ffffff;font-size:18px;font-weight:400;margin:10px 0;text-align:center;}
#service ul li p { color:#7d7d7d;font-size:14px;}
#service i.icon-service { background-image:url(../img/sprite.png);background-repeat:no-repeat;height:41px;width:41px;display:block;margin:30px auto;}
#service i.icon-uxd { background-position:0 -36px;}
#service i.icon-wd { background-position:-42px -36px;width:30px;}
#service li:hover i.icon-wd { -webkit-animation:movingHammer 0.8s infinite;-moz-animation:movingHammer 0.8s infinite;animation:movingHammer 0.8s infinite;-webkit-transform:rotate(0deg);}
#service i.icon-pseo { background-position:-73px -37px;}
#service li:hover i.icon-pseo { -webkit-animation:rotateNavigator 1.2s infinite;-moz-animation:rotateNavigator 1.2s infinite;animation:rotateNavigator 1.2s infinite;-webkit-transform:rotate(0deg);}

/* philosophy */
#philosophy { background-image:url(../img/bg-philosophy.jpg);background-position:0 0;background-repeat:no-repeat;background-size: cover;padding:138px 0;}
#philosophy h2 { color:#ffffff;font-size:32px;font-weight:300;margin-bottom:50px;}
#philosophy p { color:#ffffff;font-size:22px;}
#philosophy p span.color-red { color:#ef4035;}

/* featured work */
#featured-work { padding:30px 0;}
#featured-work .fw-wrap { overflow:hidden;margin:0 150px;}
.fw-wrap ul { margin:0 -19px;}
.fw-wrap ul li { float:left;width:33%;padding:20px;list-style:none;}
.fw-wrap ul li > div { background-color:#373737;border:4px solid #ffffff;box-shadow:0 0 4px rgba(0,0,0,0.75);overflow:hidden;position:relative;-webkit-transform:rotate(0deg);display:table;max-width:100%;margin:0 auto;}
.fw-wrap ul li > div img { width:100%;-webkit-transform:scale(1);}
.fw-wrap ul li:hover > div img { -webkit-transform:scale(1.3);}
.fw-wrap ul li > div .fw-caption { position:absolute;top:0;right:0;bottom:0;left:0;padding:40px;background-color:rgba(0,0,0,0.8);text-align:center;opacity:0;}
.fw-wrap ul li > div:hover .fw-caption { opacity:1;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7c000000,endColorstr=#7c000000);}
.fw-caption > div { position: absolute;top: 50%;left: 50%;margin: -38px 0 0 -62px;height:76px;width:126px;}
.fw-caption h3 { color:#ffffff;font-size:18px;margin-bottom:20px;position:relative;top:6px;}
.fw-caption:hover h3 { top:-3px;}
.fw-caption a { color:#ef4035; font-size:14px;border:2px solid #ef4035;padding:10px;display:block;}
.fw-caption a:hover { background-color:#ef4035;color:#ffffff;}

/* testimonial */
#testimonial { background-image:url(../img/bg-testimonials.jpg);background-position:0 0;background-repeat:no-repeat;padding:75px 0;}
#testimonial h2 { color:#ffffff;font-size:31px;font-weight:300;margin-bottom:60px;}
.slider-container { margin:0 auto;max-width:900px;}

/* our experties */
#our-experties { padding:25px 0;}
#our-experties h2 span::first-letter { text-transform:uppercase;}
#our-experties .flavour { display:block;margin:30px auto 0 auto;}
#our-experties .device-wrap { display:inline;margin:100px auto 70px auto;max-width:100%;overflow:hidden;}
.device-wrap .device-frame { display:table-cell;}
.device-frame i { background-image:url(../img/devices.png);background-repeat:no-repeat;display:block;}
.device-sm i { background-position:-181px -12px;width:44px;height:80px;margin-right:120px;}
.device-md i { background-position:-167px -123px;width:72px;height:104px;margin-right:120px;}
.device-lg i { background-position:-102px -263px;width:199px;height:120px;margin-right:120px;}
.device-xl i { background-position:-92px -420px;width:219px;height:156px;}

/* contact page */ 
.contact-landing-wrap h1 { width:100%;margin:0 auto;}
.contact-landing-wrap h2 { color:#ffffff;font-style:normal;text-transform:none;margin-top:20px;line-height:28px;}
/*section#contact-main { background-color:#ffffff;background-image:url(../img/bg-contact.png);background-position:0 0;background-repeat:no-repeat;background-size:cover;height:60%;}*/
/*section#contact-main .main-landing-wrap h1 { margin-top:13%;}*/
#contact-inner h2 { margin-top:20px;}
.contact-form { margin:50px 0;}
.contact-form > div { margin-bottom:25px;}
.contact-form .fieldset { float:left;}
.contact-form .fieldset-sm { width:33.33%;}
.contact-form .fieldset-md { width:50%;}
.contact-form .fieldset-lg { width:100%;}
.contact-form .fieldset-left { padding-right:20px;}
.contact-form .fieldset-center { padding:0 10px;}
.contact-form .fieldset-right { padding-left:20px;}
.contact-form label { display:block;margin-bottom:5px;font-size:14px;line-height:22px;}
.contact-form .fieldBox { border:1px solid #dfdfdf;padding:12px;width:100%;}
.contact-form input[type="text"]:focus, .contact-form textarea:focus,.contact-form input[type="email"]:focus { outline:1px solid #ef4035;}
.contact-form textarea { resize:none;height:75px;}
.contact-form input[type="submit"] { background-color:#ef483f;color:#ffffff;text-transform:uppercase;font-size:11px;font-weight:bold;padding:15px 20px;border:none;margin:0;outline:none;width:100%;max-width:200px;margin-top:10px;text-align:center;cursor:pointer}
.contact-form input[type="submit"]:hover{opacity:0.8}

/* portfolio page */
section#portfolio-main { background-color:#ffffff;background-image:url(../img/bg-portfolio.png);background-position:0 0;background-repeat:no-repeat;background-size:cover;height:60%;}
section#portfolio-main .main-landing-wrap h1 { margin-top:13%;}

/* portfolio page */
section#career-main { background-color:#ffffff;background-image:url(../img/bg-career.png);background-position:0 0;background-repeat:no-repeat;background-size:cover;height:60%;}
section#career-main .main-landing-wrap h1 { margin-top:13%;}

/* footer */
footer .footer-top { background-color:#1c1c1c;padding:0 0 50px 0;}
.footer-top .newsletter-box ,.footer-top .footer-menus { float:left;width:25%;}
.newsletter-box .stay-connected { *background-image:url(../img/stay-connected.png);*background-position:top center;*background-repeat:no-repeat;padding:80px 0;text-align:center;margin-bottom:10px;*border-radius:50%;width:224px;height:224px;background-size:100%;margin-left: auto;margin-right: auto;cursor:pointer;}
.newsletter-box:hover .stay-connected { background-size:110%;}
.stay-connected h5 { color:#ffffff;font-size:14px;font-weight:600;text-transform:uppercase;margin-bottom:20px;}
.stay-connected h5 .sm-separator { border:2px solid #ffffff;width:50px;margin:10px auto;}
.stay-connected h4 { color:#ffffff;font-size:16px;font-weight:600;}
.newsletter-box fieldset { margin-top:10px;}
.newsletter-box label { color:#ffffff;font-size:14px;font-weight:400;}
.newsletter-box input[type="email"] { background-color:#ffffff;border:none;padding:10px;float:left;margin:0;height:40px;}
.newsletter-box input[type="email"]::placeholder { font-style:italic;}
.newsletter-box input[type="submit"] { background-color:#ef4035;background-image:url(../img/bg-submit.png);background-repeat:no-repeat;background-position:center center;border:none;padding:12px;position:relative;float:left;height:40px;width:40px;margin:0;outline:none;cursor:pointer;}
.newsletter-box:hover input[type="submit"] { -webkit-animation:arrowMove 0.5s infinite;-moz-animation:arrowMove 0.5s infinite;animation:arrowMove 0.5s infinite;background-position:center center;}
.footer-top .important-links { float:left;width:50%;padding:45px 100px 0 150px;}
.important-links h5 { color:#ffffff;font-size:14px;font-weight:600;text-transform:uppercase;margin-bottom:50px;}
.important-links h5 a { color:#898989;padding-bottom:3px;border-bottom:2px solid #696969;}
.important-links h5 a:hover { color:#efefef;padding-bottom:1px;border-bottom:2px solid #dfdfdf;}
.important-links h6 { border-bottom:2px solid #696969;color:#c1c1c1;font-size:14px;font-weight:600;padding-bottom:3px;margin-bottom:10px;float:left;text-transform:uppercase;}
.important-links ul { display:block;}
.important-links ul li { list-style:none;line-height:22px;}
.important-links ul li a { color:#525252;font-size:12px;font-weight:600;}
.important-links ul li a:hover { color:#a5a5a5;}
.address-wrap h6 { color:#ffffff;font-size:14px;font-weight:600;margin-top:20px;}
.address-wrap address, .address-wrap p, .address-wrap p a { color:#e1e1e1;font-size:12px;font-weight:300;font-style:normal;margin-top:10px;line-height:18px;}
.address-wrap p strong { color:#ffffff;font-weight:600;margin-right:8px;}
.address-wrap p a { text-decoration:underline;}
.address-wrap p a:hover { text-decoration:none;}
.footer-top .address-wrap { float:left;width:25%; padding-top:45px;}
footer .footer-bottom { background-color:#222222;padding:15px 0;}
.footer-bottom p { color:#696969;font-size:12px;font-weight:400;text-align:center;}
.footer-bottom .social-link { display:table;margin:0 auto 10px auto;}
.social-link li { float:left;margin:0 5px;list-style:none;}
.social-link li a { background-image:url(../img/sprite.png);background-repeat:no-repeat;float:left;height:25px;width:25px;display:block;opacity:0.3;}
.social-link li a:hover { opacity:1;}
.social-link li a.fb-link { background-position:0 -79px;}
.social-link li a.tw-link { background-position:-26px -79px;}
.social-link li a.li-link { background-position:-52px -79px;}
.social-link {
    margin: 50px 0 0 0;
}
/* other */
.nicescroll-rails > div { border:none !important;}
.header-nav .current_page_item a{
	background: #fff none repeat scroll 0 0;
    border-radius: 3px;
    color: #ef4035 !important;
    padding: 7px 18px;
}
.sticky-header .current_page_item a {
    background: #000 none repeat scroll 0 0;
    color: #fff !important;
}
.fieldset-main{margin-bottom:15px}
.portfolio_banner ul{color: #848484;
    list-style: inside none circle;
    margin: 15px auto;
    text-align: left;
    width: 650px;}
.portfolio_banner ul li{padding:5px 0;font-size:14px}	
/* ###### animations ###### */
/* mouse scroll */
@-webkit-keyframes scrollDown {
	from { top:0px;}
	to { top:4px;}
}
@-moz-keyframes scrollDown {
	from { top:0px;}
	to { top:4px;}
}
@keyframes scrollDown {
	from { top:0px;}
	to { top:4px;}
}

/* moving hammer */
@-webkit-keyframes movingHammer {
	0% { -webkit-transform:rotate(0deg)}
	25% { -webkit-transform:rotate(-25deg)}
	50% { -webkit-transform:rotate(-75deg)}
	70% { -webkit-transform:rotate(-55deg)}
	80% { -webkit-transform:rotate(-75deg)}
	90% { -webkit-transform:rotate(-25deg)}
	100% { -webkit-transform:rotate(0deg)}
}
@-moz-keyframes movingHammer {
	0% { -moz-transform:rotate(0deg)}
	25% { -moz-transform:rotate(-25deg)}
	50% { -moz-transform:rotate(-75deg)}
	70% { -moz-transform:rotate(-55deg)}
	80% { -moz-transform:rotate(-75deg)}
	90% { -moz-transform:rotate(-25deg)}
	100% { -moz-transform:rotate(0deg)}
}
@keyframes movingHammer {
	0% { transform:rotate(0deg)}
	25% { transform:rotate(-25deg)}
	50% { transform:rotate(-75deg)}
	70% { transform:rotate(-55deg)}
	80% { transform:rotate(-75deg)}
	90% { transform:rotate(-25deg)}
	100% { transform:rotate(0deg)}
}

/* rotare navigator */
@-webkit-keyframes rotateNavigator {
	0% { -webkit-transform:rotate(0deg)}
	25% { -webkit-transform:rotate(-25deg)}
	50% { -webkit-transform:rotate(-55deg)}
	75% { -webkit-transform:rotate(-90deg)}
	100% { -webkit-transform:rotate(0deg)}
}
@-moz-keyframes rotateNavigator {
	0% { -moz-transform:rotate(0deg)}
	25% { -moz-transform:rotate(-25deg)}
	50% { -moz-transform:rotate(-55deg)}
	75% { -moz-transform:rotate(-25deg)}
	100% { -moz-transform:rotate(0deg)}
}
@keyframes rotateNavigator {
	0% { transform:rotate(0deg)}
	25% { transform:rotate(-25deg)}
	50% { transform:rotate(-55deg)}
	75% { transform:rotate(-25deg)}
	100% { transform:rotate(0deg)}
}

/* move arrow */
@-webkit-keyframes arrowMove {
	0% { background-position:center center;}
	100% { background-position:center right 6px;}
}
@-moz-keyframes arrowMove {
	0% { background-position:center center;}
	100% { background-position:center right 6px;}
}
@keyframes arrowMove {
	0% { background-position:center center;}
	100% { background-position:center right 6px;}
}

@media screen and (max-width:800px){
section#contact-main{
	height:auto !important;
    padding: 3em 0 1em !important;
	}	

}

/* media quries */
@media screen and (max-width:768px){
.header-nav ul li { margin-left:30px;}
#service ul li { width:100%;margin-bottom:30px;}
.fw-wrap ul li { width:50%;}
#featured-work .fw-wrap { margin:0 85px;}
.device-frame i { margin:0;}
.footer-top .newsletter-box, .footer-top .important-links, .footer-top .address-wrap { width:100%;margin-bottom:50px;padding:0 20px;text-align:center;}
.newsletter-box form,.important-links h6 { display:table;margin:0 auto;padding-left:0;margin-top:20px;}
.important-links h6 { margin-bottom:10px;float:none;}
#our-experties .device-wrap { display:block;margin-top:0;}
.device-wrap .device-frame { display:block;margin:100px auto;}
.device-frame i { margin:0 auto;}
.logo-footer { margin:0 auto;float:none;display:block;}
section#contact-main{
	height:auto !important;
    padding: 3em 0 1em !important;
	}

}

@media screen and (max-width:640px){
.header-control { display:block;}
.header-nav { float: none;position: absolute;top:82px;margin: 0;left: 0;right: 0;box-shadow:0 0 3px rgba(0,0,0,0.2);overflow:hidden;height:0;}
.sticky-header .header-nav { top:74px;}
.header-nav-height { height:371px;}
.header-nav ul { background-color:#333333;}
.header-nav ul li { display:block;float:none;margin-left:0;border-bottom:1px solid #555555;}
.header .header-nav ul li a { display:block;padding:20px;text-align:center;color:#ffffff !important;}
.header-nav ul li a:hover { background-color:#ef4035;letter-spacing:3px;}
#featured-work .fw-wrap { margin:0 20px;}
.contact-form .fieldset-sm, .contact-form .fieldset-md { width:100%;}
.contact-form .fieldset-left, .contact-form .fieldset-center, .contact-form .fieldset-right { padding:0;}
.cf-fstSec > div, .cf-lastSec .fieldset-right { margin-top:20px;}
.contact-form input[type="submit"] { max-width:100%;}

}

@media screen and (width:528px){
section#main .scroll-down {display:none;}
#main h1 { font-size:18px;margin:120px 20px 20px 20px;line-height:24px;}

}

@media screen and (max-width:480px){
.item img {
	margin-left:20px;
}
.social-link  li{
    margin-left:30px;
}
#main h1 { font-size:18px;margin:40% 20px 20px 20px;line-height:24px;}
.info-bar-inner > div { width:100%;text-align:center;}
.ib-phone, .ib-email { display:none;}
.ib-start-project a { display:block;margin:0 20%;padding:15px;}
#service p.main-para { margin:0;}
#philosophy p { font-size:18px;line-height:24px;}
.fw-wrap ul li { width:100%;}
#testimonial { background-size:cover;padding:50px 0;}
.lightSlider li p { padding:0 50px;font-size:14px;}
#our-experties .device-wrap { margin:0;}
}

.wrap.main-landing-wrap ul{
    overflow: visible !important;
	background:#FFF;
	list-style:none;
	}
.wrap.main-landing-wrap ul li{
	background:#FFF !important;
	float: left;
    width: 33.33%;
    padding: 0 20px;
    list-style: none;
    cursor: pointer;
	}
.wrap.main-landing-wrap i.icon-uxd {
    background-position: 0 -36px;
}	
.wrap.main-landing-wrap i.icon-wd {
    background-position: -42px -35px;
    width: 30px !important;
}
.wrap.main-landing-wrap i.icon-pseo {
    background-position: -73px -37px;
}
.wrap.main-landing-wrap i.icon-service {
    background-image: url(../img/sprite.png);
    background-repeat: no-repeat;
    height: 41px;
    width: 41px;
    display: block;
    margin: 30px auto;
}

@media screen and (max-width:375px){
section#contact-main{
	height:auto !important;
    padding: 3em 0 1em !important;
	}	

}