/* ! normalize.css v1.0.0 | MIT License | git.io/normalize */
 
/* ==========================================================================
HTML5 display definitions
========================================================================== */
 
/* * Corrects `block` display not defined in IE 6/7/8/9 and Firefox 3. */
 
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; }
/* * Corrects `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. */
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
/* * Prevents modern browsers from displaying `audio` without controls.
* Remove excess height in iOS 5 devices. */
audio:not([controls]) { display: none; height: 0; }
/* * Addresses styling for `hidden` attribute not present in IE 7/8/9, Firefox 3, * and Safari 4.
* Known issue:no IE 6 support. */
[hidden] { display: none; }
/* ==========================================================================
Base
========================================================================== */
/* * 1. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using
*    `em` units.
* 2. Prevents iOS text size adjust after orientation change, without disabling
*    user zoom. */
 
html { font-size: 100%; /* 1 */
	-webkit-text-size-adjust: 100%; /* 2 */
-ms-text-size-adjust: 100%; /* 2 */ }
html, html a { -webkit-font-smoothing: antialiased; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004); }
/* * Addresses `font-family` inconsistency between `textarea` and other form
* elements. */
html, button, input, select, textarea { font-family: "proxima-nova",sans-serif;
font-style: normal;
font-weight: 400;; }
/* * Addresses margins handled incorrectly in IE 6/7. */
body { margin: 0; font-family: "proxima-nova",sans-serif;
font-style: normal; overflow-x: hidden;
font-weight: 400;-webkit-font-smoothing: antialiased; }
/* ==========================================================================
Links
========================================================================== */
/* * Addresses `outline` inconsistency between Chrome and other browsers. */
 
a:focus { outline: thin dotted; }
/* * Improves readability when focused and also mouse hovered in all browsers. */
a:active, a:hover { outline: 0; }
/* ==========================================================================
Typography
========================================================================== */
/* * Addresses font sizes and margins set differently in IE 6/7.
* Addresses font sizes within `section` and `article` in Firefox 4+, Safari 5, * and Chrome. */
 
h1 { font-size: 2em; margin: 0.67em 0; color: #353535; }
h2 { font-size: 1.5em; margin: 0.83em 0; }
h3 { font-size: 1.17em; margin: 1em 0; }
h4 { font-size: 1em; margin: 1.33em 0; }
h5 { font-size: 0.83em; margin: 1.67em 0; }
h6 { font-size: 0.75em; margin: 2.33em 0; }
/* * Addresses styling not present in IE 7/8/9, Safari 5, and Chrome. */
abbr[title] { border-bottom: 1px dotted; }
/* * Addresses style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome. */
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
/* * Addresses styling not present in Safari 5 and Chrome. */
dfn { font-style: italic; }
/* * Addresses styling not present in IE 6/7/8/9. */
mark { background: #ff0; color: #000; }
/* * Addresses margins set differently in IE 6/7. */
p, pre { margin: 1em 0; }
/* * Corrects font family set oddly in IE 6, Safari 4/5, and Chrome. */
code, kbd, pre, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
/* * Improves readability of pre-formatted text in all browsers. */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
/* * Addresses CSS quotes not supported in IE 6/7. */
q { quotes: none; }
/* * Addresses `quotes` property not supported in Safari 4. */
q:before, q:after { content: ''; content: none; }
small { font-size: 75%; }
/* * Prevents `sub` and `sup` affecting `line-height` in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
/* ==========================================================================
Lists
========================================================================== */
/* * Addresses margins set differently in IE 6/7. */
 
dl, menu, ol, ul { margin: 1em 0; }
dd { margin: 0 0 0 40px; }
/* * Addresses paddings set differently in IE 6/7. */
menu, ol, ul { padding: 0 0 0 40px; }
/* * Corrects list images handled incorrectly in IE 7. */
nav ul, nav ol { list-style: none; list-style-image: none; }
/* ==========================================================================
Embedded content
========================================================================== */
/* * 1. Removes border when inside `a` element in IE 6/7/8/9 and Firefox 3.
* 2. Improves image quality when scaled in IE 7. */
 
img { border: 0; /* 1 */
-ms-interpolation-mode: bicubic; /* 2 */ }
/* * Corrects overflow displayed oddly in IE 9. */
svg:not(:root) { overflow: hidden; }
/* ==========================================================================
Figures
========================================================================== */
/* * Addresses margin not present in IE 6/7/8/9, Safari 5, and Opera 11. */
 
figure { margin: 0; }
/* ==========================================================================
Forms
========================================================================== */
/* * Corrects margin displayed oddly in IE 6/7. */
 
form { margin: 0; }
/* * Define consistent border, margin, and padding. */
/* fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } */
/* * 1. Corrects color not being inherited in IE 6/7/8/9.
* 2. Corrects text not wrapping in Firefox 3.
* 3. Corrects alignment displayed oddly in IE 6/7. */
legend { border: 0; /* 1 */
	padding: 0; white-space: normal; /* 2 */
*margin-left: -7px; /* 3 */ }
/* * 1. Corrects font size not being inherited in all browsers.
* 2. Addresses margins set differently in IE 6/7, Firefox 3+, Safari 5, *    and Chrome.
* 3. Improves appearance and consistency in all browsers. */
button, input, select, textarea { font-size: 100%; /* 1 */
	margin: 0; /* 2 */
	vertical-align: baseline; /* 3 */
*vertical-align: middle; /* 3 */ }
/* * Addresses Firefox 3+ setting `line-height` on `input` using ` !important` in
* the UA stylesheet. */
button, input { line-height: normal; }
/* * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
*    and `video` controls.
* 2. Corrects inability to style clickable `input` types in iOS.
* 3. Improves usability and consistency of cursor style between image-type
*    `input` and others.
* 4. Removes inner spacing in IE 7 without affecting normal text inputs.
*    Known issue:inner spacing remains in IE 6. */
button, html input[type="button"], /* 1 */
input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */
	cursor: pointer; /* 3 */
*overflow: visible; /* 4 */ }
/* * Re-set default cursor for disabled elements. */
button[disabled], input[disabled] { cursor: default; }
/* * 1. Addresses box sizing set to content-box in IE 8/9.
* 2. Removes excess padding in IE 8/9.
* 3. Removes excess padding in IE 7.
*    Known issue:excess padding remains in IE 6. */
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */
	padding: 0; /* 2 */
	*height: 13px; /* 3 */
*width: 13px; /* 3 */ }
/* * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
* 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
*    (include `-moz` to future-proof). */
input[type="search"] { -webkit-appearance: textfield; /* 1 */
	-moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box; }
/* * Removes inner padding and search cancel button in Safari 5 and Chrome
* on OS X. */
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
/* * Removes inner padding and border in Firefox 3+. */
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
/* * 1. Removes default vertical scrollbar in IE 6/7/8/9.
* 2. Improves readability and alignment in all browsers. */
textarea { overflow: auto; /* 1 */
vertical-align: top; /* 2 */ }
/* ==========================================================================
Tables
========================================================================== */
/* * Remove most spacing between table cells. */
table { border-collapse: collapse; border-spacing: 0; }
/* ==========================================================================
Global Styles
========================================================================== */
a { color: #353535; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }
a:hover, a:focus { color: #2f4f8e; text-decoration: none; }
p { color: #8c9398; word-spacing: 1px; line-height: 25px; font-size: 14px; }
h2 { font-size: 15px; color: #353535; text-transform: uppercase; font-weight: bold; }
/* h2::after { content: " "; border: solid 1px #ca3c5d; display: block; width: 35px; margin: 25px auto; } */
.section-padding { padding: 90px 0 100px }
.section-padding2 { padding: 90px 0 0px }

.section-padding#contact{padding: 90px 0 40px}
.dark-bg {  background: linear-gradient(100deg,#38d29c,#31aded);
    -webkit-animation: Gradient 8s ease infinite;
    -moz-animation: Gradient 8s ease infinite;
    animation: Gradient 8s ease infinite;
    position: relative; }
.light-bg { background-color: #fff; }
.dark-box { background: #f3f5f8; -webkit-box-shadow: 0px 3px 0px 0px #f0f2f4; -moz-box-shadow: 0px 3px 0px 0px #f0f2f4; box-shadow: 0px 3px 0px 0px #f0f2f4; }
.light-box {  /* -webkit-box-shadow: 0px 3px 0px 0px #f0f2f4; -moz-box-shadow: 0px 3px 0px 0px #f0f2f4; box-shadow: 0px 3px 0px 0px #f0f2f4; */ padding: 20px 0; }
/* .light-box:hover, .light-box:focus { -webkit-box-shadow: 0px 3px 0px 0px  #C93D3D; -moz-box-shadow: 0px 3px 0px 0px  #C93D3D; box-shadow: 0px 3px 0px 0px  #C93D3D; } */
.box-hover { transition: all 500ms ease-in-out; -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; }
.box-hover:hover, .box-hover:focus { transform: translate(0, -15px); -webkit-transform: translate(0, -15px); -ms-transform: translate(0, -15px); }
.wrapper { height: 650px; }
.nopadding { padding: 0; }
/* .inner { padding-top: 170px; } */
/* ==========================================================================
Navigation
========================================================================== */
/*
nav { background-color: #242830; margin-top: -1px; }
nav ul { list-style: none; padding: 0; }
nav ul li { color: rgba(255, 255, 255, 0.6); display: block; border-bottom: 1px dotted rgba(255, 255, 255, 0.2); transition: all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; padding-left: 0; position: relative; }
nav ul li:last-child { border: none; }
nav ul li a { color: rgba(255, 255, 255, 0.6); display: block; padding: 20px; transition: all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; padding-left: 0; position: relative; }
nav ul li a:hover, nav ul li a:focus { text-decoration: none; color: rgba(255, 255, 255, 1); }
*/
.logo-tr { position: absolute; left: 30px; top: 10px;  }
.logo-tr h2{font-weight: 300; letter-spacing: 0.3rem;font-family: 'Merriweather', serif; font-size: 20px; color: #232731}
#trigger-overlay { cursor: pointer;     background: none;
    border: 0px; outline: none; }
#trigger-overlay{ position: absolute; right: 25px; top: 3px; display: block; }
trigger-overlay2 { cursor: pointer;     background: none;border: 0px; outline: none; }
#trigger-overlay2{ position: absolute; right: 25px; top: 3px; display: block;  background: none;border: 0px; outline: none;}
#trigger-overlay{ position: absolute; right: 25px; top: 3px; display: block;  background: none;border: 0px; outline: none;}


#nav-toggle div, #nav-toggle div:before, #nav-toggle div:after { cursor: pointer; border-radius: 1px; -moz-border-radius: 1px; -webkit-border-radius: 1px; -o-border-radius: 1px; height: 3px; width: 35px; background: #353535; position: absolute; display: block; content: ''; }
#nav-toggle div:before { top: -10px; }
#nav-toggle div:after { bottom: -10px; }
#nav-toggle div, #nav-toggle div:before, #nav-toggle div:after { transition: all 500ms ease-in-out; -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; }
.navicon { position: relative; width: 100%; height: 60px; background: #fff;margin-top: -14px;}
.navicon2 { position: relative; width: 100%; height: 60px;margin-top: -14px;}
.topnav{display: none;}
.topnav.sticky{display: block; position: fixed; width: 100%; z-index:10; }
.indicator { position: absolute; right: 0 !important;  }
.pull { display: none; }
.case-inner-main .col-md-8{margin-bottom: 50px; }
.case-title p{text-transform: uppercase; font-weight: 600; letter-spacing: 5px; padding-bottom: 5px;}

.more-casestudies{background-color: #444444} 
/* .case-inner ul{list-style-position: inside;} */
.case-inner ul li{color: #8c9398;
    word-spacing: 1px;
    line-height: 1em;}
.ss{height: 60px;}
/* ==========================================================================
Hero
========================================================================== */
.hero { background:rgba(197,53,53,0.96); -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; padding: 65px 0 300px 0; height: auto;  }
.hero h1 { font-size: 40px; letter-spacing: 12px; margin: 10px; }
.hero h1 span { color: #a1a9b0; display: inline-block; }
.hero p { letter-spacing: 1px; }
.learn-more-btn { background: rgba(61, 201, 179, 1); padding: 20px 40px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; color: #fff; text-transform: uppercase; letter-spacing: 1px; display: inline-block; -webkit-box-shadow: 0px 3px 0px 0px #309383; -moz-box-shadow: 0px 3px 0px 0px #309383; box-shadow: 0px 3px 0px 0px #309383; margin: 60px 0 0; font-weight: bold; }
.learn-more-btn:hover, .learn-more-btn:focus { background: rgba(61, 201, 179, 0.6); color: #fff; }
/* ==========================================================================
Intro
========================================================================== */
.intro { background: #EBEBEB; }
.intro p { margin: 30px 0 0; color: #606060; font-size: 18px; }
.intro h1{font-size: 30px; font-weight: 700; color: #606060;}
h1.arrow { font-size: 12px; text-transform: uppercase; color: #353535; letter-spacing: 7px;  font-weight: bold; padding-bottom: 20px;}
.intro .btn-dark{font-size: 14px; letter-spacing: 0.9px; color: #666666; border: 1px solid #666666;position: relative;}
h1.arrow:after {bottom: 0;
left: 50%;
height: 1px;
width: 70px;
content: " ";
margin-left: -35px;
position: absolute;
background: #970015; }
.title-v1{z-index: 1;
position: relative;
text-align: center;
margin-bottom: 40px;}
.casestudy .col-md-5 h1{font-size: 30px;font-weight: 600;}
.casestudy p.arrow{ font-size: 12px; text-transform: uppercase; color: #ffffff; letter-spacing: 5px;  font-weight: bold;}
.casestudy p.arrow:after {bottom: 45px;
left: 10%;
height: 1px;
width: 45px;
content: " ";
margin-left: -35px;
position: absolute;
background: #970015; }
.title-v1{z-index: 1;
position: relative;
text-align: center;
margin-bottom: 60px;}
.casestudy a.btn-dark{color: #fff; border: 1px solid #bababa}
.casestudy a.btn-dark:hover{color: #000; }
.hire{padding: 50px 0px; }
.hire .col-md-8 h2{font-size: 18px;}
.hire .col-md-8 p{font-size: 18px; font-weight: 400;}
.hire .col-md-8 a.btn-dark{color: #000;}
.hire .col-md-8 a.btn-dark:after{background-color: #000;}
.hire .col-md-8 a.btn-dark:hover{color: #fff;}
.hire .col-md-8 a.btn-dark{position: relative;}
.hire .col-md-8 a.btn-dark:hover{color: #fff;}
#contact .col-md-12 a.btn-dark:hover{color: #000; }
#contact .col-md-12 a.btn-dark{border-color: #fff;}
/* ==========================================================================
Features
========================================================================== */
.features-wrapper, .team-wrapper { margin: 70px 0 0; }
/* .shadow { text-shadow: rgb(55, 181, 161) 1px 1px, rgb(55, 181, 161) 2px 2px, rgb(55, 181, 161) 3px 3px, rgb(55, 181, 161) 4px 4px, rgb(55, 181, 161) 5px 5px, rgb(55, 181, 161) 6px 6px, rgb(55, 181, 161) 7px 7px, rgb(55, 181, 161) 8px 8px, rgb(55, 181, 161) 9px 9px, rgb(55, 181, 161) 10px 10px, rgb(55, 181, 161) 11px 11px, rgb(55, 181, 161) 12px 12px, rgb(55, 182, 162) 13px 13px, rgb(55, 183, 163) 14px 14px, rgb(56, 184, 164) 15px 15px, rgb(56, 185, 165) 16px 16px, rgb(56, 186, 166) 17px 17px, rgb(57, 187, 167) 18px 18px, rgb(57, 188, 168) 19px 19px, rgb(57, 189, 169) 20px 20px, rgb(58, 191, 170) 21px 21px, rgb(58, 192, 171) 22px 22px, rgb(58, 193, 172) 23px 23px, rgb(59, 194, 173) 24px 24px, rgb(59, 195, 174) 25px 25px, rgb(59, 196, 175) 26px 26px, rgb(60, 197, 176) 27px 27px, rgb(60, 198, 177) 28px 28px, rgb(60, 199, 178) 29px 29px, rgb(61, 201, 179) 30px 30px; } */
.icon { height: 175px; width: 175px; line-height: 175px; max-width: 100%; background: #ff426e; border-radius: 50%; -o-border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; display: block; color: #fff; font-size: 55px; text-align: center; vertical-align: middle; position: relative; margin: 0 auto 50px; }
#features .col-md-6{padding: 0;}
/* ==========================================================================
iPhone Section
========================================================================== */
.iphone { width: 45%;  float: left; height: 100%;  z-index: 1; margin-top: 160px}
.fluid-white { width: 50%; background: #fff; float: right; height: 100%; z-index: 2; }
.responsive-services { position: relative; }
/* ==========================================================================
Swag
========================================================================== */
.swag { background: url('../img/plants-bg.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-attachment: fixed; padding: 50px 0; }
.swag h1 { color: #fff; font-size: 40px; text-transform: uppercase; letter-spacing: 5px; }
.swag h1 span { display: block; font-size: 25px; margin-top: 20px; }
.down-arrow-btn { width: 40px; height: 40px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%; background: rgba(255,0,69,0.8); display: inline-block; margin: 10px auto 20px; color: #fff; font-size: 16px; line-height: 40px; text-align: center; }
.down-arrow-btn:hover, .down-arrow-btn:focus { color: #fff; background: rgba(202,60,84,1); }
/* ==========================================================================
Portfolio
========================================================================== */
.effects { padding-left: 15px; }
.effects .img { position: relative; margin-bottom: 50px; position: relative; z-index: 1; overflow: hidden; }
.effects .img:nth-child(n) { margin-right: 5px; }
.effects .img:first-child { margin-left: -15px; }
.effects .img:last-child { margin-right: 0; }
.effects .img img { display: block; margin: 0; padding: 0; height: auto; }
.overlay { display: block; position: absolute; z-index: 20; background: rgba(255,25,68,0.8); overflow: hidden; transition: all 0.5s; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; }
a.close-overlay { display: block; position: absolute; top: 0; right: 0; z-index: 100; width: 45px; height: 45px; font-size: 20px; font-weight: 700; color: #fff; line-height: 45px; text-align: center; background-color: #000; cursor: pointer; }
a.close-overlay.hidden { display: none; }
a.expand { display: block; position: absolute; z-index: 100; text-align: center; color: #fff; font-weight: 600; font-size: 14px; text-transform: uppercase; line-height: 30px; }
.overlay-effect .img i { font-size: 30px; }
.overlay-effect .overlay { bottom: 0; left: 0; right: 0; width: 100%; height: 100%; opacity: 0; }
.overlay-effect .overlay a.expand { left: 0; right: 0; bottom: 47%; margin: 0 auto -30px auto; }
.overlay-effect .img.hover .overlay { height: 100%; opacity: 1; }
.img img { width: -webkit-calc(100% + 40px) !important; width: calc(100% + 40px) !important; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -moz-transition: opacity 0.35s, -moz-transform 0.35s; -o-transition: opacity 0.35s, -o-transform 0.35s; -webkit-transform: translate3d(-40px, 0, 0); transform: translate3d(-40px, 0, 0); -ms-transform: translate3d(-40px, 0, 0); }
.img:hover img { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -ms-transform: translate3d(-40px, 0, 0); }
.designs { position: absolute; left: 0; right: 0; margin-left: auto; margin-right: auto; top: 50px; }
#portfolio{background-color: #fff; padding: 90px 130px;}
#portfolio ul{padding: 0;}
#portfolio li{list-style: none; display: inline-block; margin: 5px}
/* ==========================================================================
Subscribe
========================================================================== */
.subscribe { background: url('../img/keyboard-bg.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-attachment: fixed; padding: 120px 0 140px; }
.subscribe h1 { color: #fff; margin-bottom: 40px; }
.subscribe h1 span { display: block; font-size: 15px; text-transform: uppercase; font-weight: bold; margin-top: 20px; letter-spacing: 1px; }
.subscribe input[type=text] { background-color: rgba(255, 255, 255, 0.1); border: solid 1px #fff; padding: 20px; width: 30%; color: #fff; }
.subscribe input[type=submit] { background: rgba(202,60,60,0.5); border: solid 1px rgba(202,60,86,0.5); padding: 20px; color: #fff; text-transform: uppercase; letter-spacing: 1px; transition: all 0.5s ease; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; }
.subscribe input[type=submit]:hover { background: rgba(202,60,60,0.86); border: solid 1px rgba(202,60,60,0.92); color: #fff; }
/* ==========================================================================
CTA
========================================================================== */
.ignite-cta { background-color: #E02C3F; padding: 70px 0; }
.ignite-btn { display: inline-block; padding: 14px 53px; color: #fff; border: solid 1px #fff; text-transform: uppercase; font-weight: bold; letter-spacing: 1px; }
.ignite-btn:hover, .ignite-btn:focus { color: #000;
background: #FFF;}
.ignite-cta h1{font-size: 40px;
line-height: 40px;
color: #FFF;
font-weight: 700;
margin: 0 25px;
text-align: center; padding-bottom: 50px;}



/* ==========================================================================
Team
========================================================================== */
.team img { margin-bottom: 40px; }
ul.social-buttons { list-style: none; margin: 0; padding: 0; }
ul.social-buttons li { display: inline-block; margin-right: 10px; }
ul.social-buttons li:last-child { margin-right: 0; }
.social-btn { width: 40px; height: 40px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%; background: #242830; display: inline-block; color: #fff; font-size: 17px; line-height: 40px; text-align: center; }
.social-btn:hover, .social-btn:focus { background: #ca3c3c; color: #fff; }
.social { margin: 40px 0px 20px 0px; color: #fff }
/* ==========================================================================
Contact
========================================================================== */
.up-btn { width: 50px; height: 50px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%; background: rgba(202,60,91,0.5); display: block; margin: 0 auto; color: #fff; font-size: 18px; line-height: 46px; text-align: center; position: absolute; top: -26px; left: 0; right: 0; margin-left: auto; margin-right: auto; }
.up-btn:hover, up-btn:focus { color: #fff; background: rgba(202,60,103,1); }
.contact-details { margin: 70px 0; }
.contact-details h2 { font-size: 20px; color: #595959}
.contact-details p{color: #ffffff}
.contact-details a{color: #ffffff; -webkit-transition: all 500ms ease;
-moz-transition: all 500ms ease;
-ms-transition: all 500ms ease;
transition: all 500ms ease;}
.contact-details a:hover{color: #bebebe}
.contact-details h2 span { display: block; color: #ffffff; text-transform: uppercase;  font-size: 25px; margin-top: 15px; }
.contact-wrap { position: relative; }
#contact{background-color: #f7d635;}
/* ==========================================================================
Footer
========================================================================== */
footer a { color: #5d5f60; }
footer { background-color: #000000; padding: 0px 0 0px; text-align: center; }
footer .col-md-12{z-index: 1;
position: relative;
text-align: center;
}
/*
footer .col-md-12 p::after{bottom: 0;
left: 10%;
position: absolute;
background: #970015;
top: 0;
height: 1px;
width: 80%;
content: " ";
background: #970015; margin-bottom: 10px; }
*/
.title-v1{z-index: 1;
position: relative;
text-align: center;
}


footer p { color: #4d4d4d; padding-top: 10px; }
footer .title-v1{margin-bottom: 0px;}
ul.legals { list-style: none; color: #fff; line-height: 1.5em; }
ul.legals li { display: inline-block; }
ul.legals li::after { content: " |"; }
ul.legals li:last-child::after { content: ""; }
.legals { text-align: left; }
.credit { text-align: right; }
/* ==========================================================================
FlexSlider Custom CSS
========================================================================== */
#servicesSlider { margin-top: 70px; }
/* ul.slides li { margin-bottom: 20px; } */
/* ==========================================================================
Waypoints
========================================================================== */
.wp1, .wp2, .wp3, .wp4, .wp5, .wp6 { visibility: hidden; }
.bounceInLeft, .bounceInRight, .fadeInUp, .fadeInUpDelay, .fadeInDown, .fadeInUpD, .fadeInLeft, .fadeInRight { visibility: visible; }
.delay-05s { animation-delay: 0.5s; -webkit-animation-delay: 0.5s; }
.delay-1s { animation-delay: 1s; -webkit-animation-delay: 1s; }
.delay-2s { animation-delay: 1s; -webkit-animation-delay: 1s; }
.delay-0.5s { animation-delay: 1s; -webkit-animation-delay: 1s; }
.wp3 { /* background: url('https://lh4.ggpht.com/5FZtGjSIu4VHgNM_DUcWsbnN_palMc__IX_EaEWc5XInm-72Ql-BBVc3EqoPDizD_Deqfk3p6YrNOZDykUc=s0#w=553&h=350') no-repeat center center; */ background-position: 200px 10px; height: 100%; }


#hero div.scroll {
position: absolute;
bottom: 200px;
left: 50%;
margin-left: -24.5px;
}
#hero div.scroll span.scroll-down {
color: #FFF;
display: block;
font-size: 42px;
width: 16px;
height: 30px;
border: 2px solid #000000;
position: relative;
margin: 0 auto 5px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
#hero div.scroll span.scroll-down:before {
content: '';
display: block;
position: absolute;
top: 8px;
width: 2px;
height: 4px;
background: #000000;
left: 50%;
margin-left: -1px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
#hero div.scroll .scroll-text {
text-transform: uppercase;
font-weight: 400;
font-size: 12px;
text-align: center;
float: left;
color: #FFF;
letter-spacing: 1px;
color: #000
}
 a.btn-dark {
display: inline-block;
margin: 35px 10px 0;
padding: 12px 35px;
position: relative;

}
.jobs a.btn-dark {position: relative;}
.jobs a.btn-dark:after {background: #000000}
.jobs a.btn-dark:hover {color: #fff}



.btn-dark:after {
	width: 100%;
	height: 0;
	bottom: 0;
	left: 0;
	background: #fff;
}

.buttons .btn-dark:hover,
.buttons .btn-dark:active, .viewport .btn-dark:hover,
.viewport .btn-dark:active, .intro .btn-dark:hover,
.intro .btn-dark:active {
	color: #000;
	
}
.effect-hera .btn-dark {
font-size: 14px;
letter-spacing: 0.9px;
color: #000;
border: 1px solid #FFFFFF;
position: relative;
}
.btn-dark:hover:after,
.btn-dark:active:after {
	height: 100%;
}
.btn-dark:after {
	content: '';
	position: absolute;
	z-index: -1;
	-moz-transition-property: all;
-o-transition-property: all;
-webkit-transition-property: all;
transition-property: all;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
-webkit-transition-duration: 0.2s;
transition-duration: 0.2s;
-moz-transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-o-transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
}


/*
.btn-dark:hover {
color: #FFF;
background: #333;
}
*/
.btn-dark {
display: block;
color: #333;
border: 1px solid #333;
padding: 15px;
font-size: 14px;
font-weight: 600;
letter-spacing: 1px;
text-align: center;
text-transform: uppercase;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}

.buttons .btn-dark{border: 1px solid rgba(38,38,38,0.36); color: #fff; padding: 12px 50px; letter-spacing: 2px; font-weight: 600; font-size: 14px;}
.buttons .btn-dark.viewbtn{padding: 12px 45px;}
/* .buttons .btn-dark:hover{background-color: #ffffff; color: #000; } */
/*
#full-screen {
width: 100%;
height: 100%;
position: relative;
z-index: 101;
-ms-box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
#full-screen .fscreen-bg {
width: 100%;
height: 100%;
overflow: hidden;
display: block;
}
*/
#fullpage .container{top: 30%;}
#fullpage .mainlogo{top: 10%;position: relative; z-index: 9999}
#fullpage .textcnt{top: 12%;position: relative;z-index: 9999}
#fullpage .buttons{top: 14%;position: relative;z-index: 9999}
#fullpage .bounces{top:40%;position: relative;z-index: 9999}
#fullpage a.bounces{font-size: 45px; color: #fff}
#fullpage .textcnt h1{color: #FFFFFF; font-size: 48px; margin: 0; padding: 0; margin:  10% 0px 0px 0px; font-weight: 600; }
#fullpage .textcnt p{color:#E29698; font-size: 24px; margin: 10px 0px 0px 0px; font-weight: 400;}
#work img{max-width: 100%;}
#work a.btn-dark{border: 2px solid #929292; color: #ffffff; }

#work .workbtns a.btn-dark{border: 2px solid #929292; color: #444; }
#work .workbtns a.btn-dark:hover{color: #fff; }

#work a.btn-dark:hover{color: #444;}
#work .col-xs-6{padding-left: 0px; padding-right: 0px;}
#work{padding-bottom: 90px;}
#contact{padding-bottom: 90px}
#contact h1.arrow{color: #232731}
#fullpage .mainlogo::after {content: " ";border: solid 1px #970015;display: block;width: 50px;margin: 25px auto;}
#contact .col-md-12 h1{text-transform: none; font-size: 30px; color: #fff; font-weight: 400;}
#contact .col-md-12 h3{text-transform: none; font-size: 16px; color: #fff; font-weight: 400;}
#contact .col-md-12 a{color: #fff; margin-top: 10px;}
#contact .col-md-12 p {color: #fff; font-weight: 400;} 
#contact .col-md-12 .address h2{font-size: 18px;} 
#contact .col-md-12 .address h3{font-size: 13px; color: #fff;} 

#contact .col-md-12 .social a{padding: 20px 40px; font-size: 20px;}
/* --- Container configuration ---------------------------------------------------------- */
.viewport {
    float: left;
   
    overflow: hidden;
    position: relative;
   
}

/* This is so that the 2nd thumbnail in each row fits snugly. You will want to add a similar
   class to the last thumbnail in each row to get rid of the margin-right. */
.no-margin {
    margin-right: 0;
}

/* --- Link configuration that contains the image and label ----------------------------- */

.viewport a img {
    
   
    position: relative;
    
    
}

/* --- Label configuration -------------------------------------------------------------- */
.viewport .mouseover span {
    display: none;
    font-size: 3.0em;
    font-weight: 400;
    height: 100%;
    padding-top: 120px;
    position: absolute;
    text-align: center;
    text-decoration: none;
    width: 100%;
    z-index: 100;
    left: 0;
    top:0;
}
    .viewport .mouseover span em {
        display: block;
        font-size: 0.45em;
        font-weight: normal;
    }

/* --- Dark hover background ------------------------------------------------------------ */
.dark-background {background-color: #6d6d6d;color: #fff;
    text-shadow: #000 0px 0px 20px;}
.dark-background em {color: #ccc; }

.viewport .btn-dark{border: 1px solid #ffffff; color: #fff; display: inline-block;}
/*
.viewport .btn-dark:hover{background-color: #ffffff; color: #000; moz-transition-property: all;
-o-transition-property: all;
-webkit-transition-property: all;
transition-property: all;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
-webkit-transition-duration: 0.2s;
transition-duration: 0.2s;
-moz-transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-o-transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
-webkit-transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
}*/
.casestudy{background: url("../img/image1.jpg") center center no-repeat;-webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        min-height: 400px;margin-bottom: 1px}
.casestudy .col-md-5 h1{color: #fff; line-height: 1.25em; }   
.casestudy .col-md-7 {text-align: right; margin-top: 40px;}
.abouthead.casehead{background: none; color: #000} 
.abouthead.casehead .abouttxt h2{color: #ffffff;}  
/**
 * You could create multiple hover background classes for different looks depending on the
 * image type. Use your imagination!
 */
 
	#myVideo{
		position: absolute;
		right: 0;
		bottom: 0;
		top:0;
		right:0;
		width: 100%;
		height: 100%;
		z-index: 10;
		background-size: 100% 100%;
 		background-color: black; /* in case the video doesn't fit the whole page*/
  		background-image: /* our video */;
  		background-position: center center;
  		background-size: contain;
   		object-fit: cover; /*cover video background */
	}



	/* Layer with position absolute in order to have it over the video
	* --------------------------------------- */
	#section0 .layer{
		position: absolute;
		z-index: 2;
		width: 100%;
		left: 0;
		top: 43%;
		height: 100%;
	}

#fullpage span.dark-overlay {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: url("../img/top_image.jpg") center center fixed #C42E32;
/*
background: -webkit-gradient(linear,50% 0,50% 100%,color-stop(100%,rgba(0,0,0,0)),color-stop(0%,rgba(0,0,0,.7)));
background: -webkit-linear-gradient(bottom,rgba(0,0,0,0),rgba(0,0,0,.7));
background: -moz-linear-gradient(bottom,rgba(0,0,0,0),rgba(0,0,0,.7));
background: -o-linear-gradient(bottom,rgba(0,0,0,0),rgba(0,0,0,.7));
background: linear-gradient(bottom,rgba(0,0,0,0),rgba(0,0,0,.7));
*/

z-index: 122;
}
#home{background-color: #fff;}
#fullpage{background: #C42E32; }
#home_work{background-color: #e6e6e6; padding: 100px 0px; text-align: center;}
#home_work .img-responsive{margin: 0 auto;}
#home_work h1{font-size: 40px; font-weight: 700; padding-bottom: 30px; text-transform: uppercase;}
#home_features{background: #000000; color: #fff; padding: 100px 0px;}
#home_features h1{font-size: 40px;color: #fff; padding-bottom: 50px;  }
#home_features .col-md-9{margin-top: 40px;}
#home_features .add-bottom-half h1{font-size: 40px; font-weight: 700; padding-bottom: 30px; text-transform: uppercase;}
#home_features .add-bottom-half{padding-bottom: 50px;}
#home_features .home-features-text{font-size: 17px; font-weight: 500;}
h1.aboutpage{font-size: 40px; font-weight: 700; padding-bottom: 30px; text-transform: uppercase; color: #171717}
.about{background-color: #fff;}
.about p{font-size: 18px; }
.imageheight{position: relative;}
.image{}
.abouthead{min-height: 400px; background: url("../img/about-us.jpg") center center #000000; background-size: cover;}
.capabilities{background-color: #fff;}
.capa-list .col-md-8{border-bottom: 2px solid #b7b7b7; border-top: 2px solid #b7b7b7; text-align: left; padding: 0;}
.capa-list .col-md-4{padding-right: 50px;padding-left: 0px;}
.capa-list ul li{list-style: none; text-align: left; border-bottom: 1px solid #a7a7a7; font-size: 18px; color: #606060; padding: 30px 0px;}
.capa-list ul li:last-child{border: 0px;}
.capa-list ul{margin: 0; padding: 0;}
.jobs{background-color: #fff;}
.capabilities p{font-size: 18px;}
.jobs p{font-size: 18px;}
.clients{background: #EBEBEB}
.clients p{font-size: 18px;}
.culture{background: #EBEBEB}
.culture p{font-size: 18px;}
.abouttxt{ text-align: left; padding: 50px 0px }
.abouttxt h1{font-size: 50px; color: #232731; text-transform: inherit; margin: 0;}
.abouttxt p{color: #424242;
    font-weight: 400;
    font-style: normal;
    line-height: 1.7;
    font-size: 20px;}
.quote.casest{border-top: 2px solid #898989; background: #EBEBEB}
p.desport{
font-size: 3.0em;
font-weight: 400;
height: 100%;
padding-top: 120px;
position: absolute;
text-align: center;
text-decoration: none;
width: 100%;
z-index: 100;

left: -10%;;
}
.outer {
    
    display: -webkit-box;
    -webkit-box-align: center;
     
    display: -moz-box;
    -moz-box-align: center;

    display: -ms-flexbox;
    -ms-flex-align: center;

    display: box;
    box-align: center;
        -webkit-align-items: center;
  align-items: center;
}
.des{position: absolute; top: 30%; }

.des h2{color: #fff; font-size: 30px; font-weight: 700; color: #fff; letter-spacing: 2px; padding: 0px 30px;}
.des p:before{bottom: 45px;
left: 50%;
height: 1px;
width: 70px;
content: " ";
margin-left: -35px;
position: absolute;
background: #970015; }
.casehead.projectimg{background: url("../img/image1.png") center center no-repeat;-webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        min-height: 500px;}

.des p{text-transform: uppercase; font-size: 12px; color: #fff; letter-spacing: 5px; font-weight: 700;padding-top: 30px;}
.quote{background-color: #232323; padding: 50px 0px 70px 0px; text-align: center;}
.quote span{color: #8c9398}
#features h1.arrow{/* padding-bottom: 70px; */}
blockquote {
  
  
  padding: 0.5em 10px;
  quotes: "\201C""\201D""\2018""\2019";
}
blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 9em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.5em;
}
blockquote:after {
  color: #ccc;
  content: close-quote;
  font-size: 9em;
  line-height: 0.1em;
  margin-right: 0.25em;
  vertical-align: -0.5em;
}
blockquote h1 {
  display: inline;
  padding: 0px 300px;
  font-size: 18px;
  font-weight: 700;color: #AAAAAA;
}
.quote p{font-size: 18px;}
.box {
/* if not using border-box 
width: 218px; 
*/

padding: 15px;
margin: 10px;
float: left;

-webkit-border-radius: 5px;
border-radius: 5px;

-webkit-box-shadow: 0px 0px 5px 1px #aaa;
box-shadow: 0px 0px 5px 1px #aaa;
}

.box { width: 33%; margin-bottom: 15px; padding: 15px;  }	
.box.large{ width: 66%; }
.box > div  { color: #fff; background-color: #000; padding: 20px; }


.clientsnew {
  margin-bottom: 0px;
  position: relative
}

.aboutcs.clientsnew div:nth-child(7n) {
  border-right: none;
}
.aboutcs.clientsnew div:nth-child(5n) {
  border-right: 1px solid #F3F3F3;
}
.aboutcs.clientsnew:before{background: #EBEBEB}
.clientsnew:before {
  content: "";
  width: 100%;
  height: 2px;
  background: #fff;
  position: absolute;
  bottom: 0px;
  left: 0;
  right: 0;
}
.newclts.clientsnew:before {
  content: "";
  width: 100%;
  height: 2px;
  background: #EBEBEB;
  position: absolute;
  bottom: 0px;
  left: 0;
  right: 0;
  
}
.clientsnew div {
  width: calc(100%/5 - 4px);
  float: left;
  display: table;
  height: 140px;
  border-right: 1px solid #F3F3F3;
  border-bottom: 1px solid #F3F3F3;
}


.aboutcs.clientsnew div {
  width: calc(100%/7 - 4px);
  float: left;
  display: table;
  height: 140px;
  border-right: 1px solid #F3F3F3;
  border-bottom: 1px solid #F3F3F3;
}
.aboutcs.clientsnew div img {
  max-width: 100px;
}

.clientsnew div span {
  display: table-cell;
  vertical-align: middle;
}
.clientsnew div img {
  max-width: 160px;
}
.clientsnew div:nth-child(5n) {
  border-right: none;
}
#main {
margin-top: 10px;
}

.updates .col-md-3{background: #fff; min-height: 400px; text-align: center; color: #777777; font-size: 20px;margin: 30px 50px 0px 0px;}

.isotope-item {
  z-index: 2;

}
 
.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}
 
.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
          transition-duration: 0.8s;
}
 
.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
          transition-property: height, width;
}
 
.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
          transition-property:         transform, opacity;
}
.black{
   background: url('../img/work.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
   min-height: 400px;
   opacity: .9;
  }
  
  /*
.grey{
      background: url('../img/work.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
      opacity: .9;

     
    }
*/
.parallax-window {min-height: 400px;background: transparent;}
.newcase .grey .text-des{width: 100%}
.grey .text-des{visibility: visible; position: absolute; top: 20%; text-align: center;}
.grey .text-des h2, .grey .text-des p{visibility: visible; z-index: 99; }
.grey .text-des h2{text-transform: none; padding: 0px 80px;}
.grey a{z-index: 999}
.grey a.btn-dark{color: #fff; border: 1px solid #fff;top: 30%; position: absolute; left: 30%;}
.grey a.btn-dark:hover{color: #000; ;}
.grey .text-des p.arrow{ font-size: 12px; text-transform: uppercase; color: #ffffff; letter-spacing: 3px; margin-top: 35px; font-weight: 400;}
.grey .text-des p.arrow:after {bottom: 51px;left: 50%;height: 1px;width: 70px;content: " ";margin-left: -35px;position: absolute;background: #970015; }
.workbtns{margin-top: 30px;}
.workbtns a.btn-dark:hover{color: #fff;}
.workbtns a.btn-dark:after{ background: #000}
.title-v1{z-index: 1;position: relative;text-align: center;margin-bottom: 60px; margin-top: 40px;}
.abouttxt.topcs .title-v1{ margin-top: 110px;}
.title-v1 p{color: #232731;}
.newcase .grey .text-des{visibility: visible; position: absolute; top: 20%; left: 0%; }
.newcase .grey .text-des h2{color: #fff; font-size: 12px; top: 20%; font-weight: 600; line-height: 1.5em;}
.newcase .grey a.btn-dark{top: 15%; left: 20%;}
.newcase .grey .text-des p.arrow:after{bottom: 41px;left: 50%;width: 49px;}
.newcase .grey .text-des p.arrow{margin-top: 20px}

.grey:hover .text-des h2, .grey:hover .text-des p{visibility: hidden; opacity: 0}

.grey .text-des h2{color: #fff; font-size: 20px; top: 20%; font-weight: 600; line-height: 1.5em;}
.grey.col-lg-4{padding: 0; margin-right: 1px; float: left;
  margin-bottom: 1px;width: calc(100%/2 - 2px);position: relative;      height: 530px;
-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;

}
/*
.grey.col-lg-4:nth-child(3n) {
  margin-right: 0;
  width: calc(100%/3);
}
*/

.grey.col-md-4{padding: 0; margin-right: 1px;
  margin-bottom: 1px;position: relative;      height: 162px;
background: url('../img/work2.jpg') no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;
margin-right: 35px; width: 300px
}
.grey.col-md-4:nth-child(3n) {
}
    
.more-casestudies {padding: 10px 0px 90px 0px}
.more-casestudies .col-md-12 h2{color: #fff; margin: 30px 0px;}
.seperater a.btn-dark:after{background: #000; }
.seperater a.btn-dark:hover{ }
.seperater a.btn-dark{position: relative}

.grid {
	position: relative;
	clear: both;
	margin: 0 auto;
	padding: 1em 0 4em;
	
	text-align: center;
}
.grey .overlay {
  background-color: #474747;
  opacity: 0.8;
  z-index: 0
}
.grey:hover * {
  visibility: visible;
}
.grey * {
  visibility: hidden;
  transition: opacity .3s linear;
}
.overlay {
  height: 100%;
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
}
/*
.grey .button {
  position: absolute;
  top: 50%;
  margin-top: -20px;
  left: 50%;
  margin-left: -90px;
  opacity: 0;
}

.grey .button {
  position: absolute;
  top: 50%;
  margin-top: -20px;
  left: 50%;
  margin-left: -90px;
  opacity: 0;
}
*/
.grey:hover * {
  visibility: visible;
}
.grey:hover *.button {
  opacity: 1;
}
.button.outline {
  border: 1px solid white;
  padding: 0 17px;
  line-height: 40px;
  background-color: transparent;
}

/* Common style */
.grid figure {
	position: relative;
	float: left;
	overflow: hidden;
	margin: 10px 1%;
	
	width: 100%;
	height: auto;
	background: #3085a3;
	text-align: center;
	cursor: pointer;
}



.grid figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure figcaption > a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.grid figure h2 {
	word-spacing: -0.15em;
	font-weight: 300;
}

.grid figure h2 span {
	font-weight: 800;
}

.grid figure h2,
.grid figure p {
	margin: 0;
}

.grid figure p {
	letter-spacing: 1px;
	font-size: 68.5%;
}



/* Individual effects */


/*-----------------*/
/***** Hera *****/
/*-----------------*/

div.effect-hera {
	background: #303fa9;
}

div.effect-hera h2 {
	font-size: 158.75%;
}

div.effect-hera h1,
div.effect-hera p {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-50%,-50%,0);
	transform: translate3d(-50%,-50%,0);
	-webkit-transform-origin: 50%;
	transform-origin: 50%;
}

div.effect-hera figcaption::before {
	}

#menuContainer{width: 100%}
div.effect-hera p a {
	color: #303030;
}

div.effect-hera p a:hover,
div.effect-hera p a:focus {
	opacity: 1;
	-webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

div.effect-hera p a{
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	position: relative;
}


/*
div.effect-hera:hover figcaption::before {
	opacity: 1;
	-webkit-transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(1,1,1);
	transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(1,1,1);
}
*/

div.effect-hera:hover a {
	opacity: 1;
	/*
-webkit-transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(1,1,1);
	transform: translate3d(-50%,-50%,0) rotate3d(0,0,1,0deg) scale3d(1,1,1);
*/
	
}

div.effect-hera:hover h2 {
	opacity: 0;
	-webkit-transform: translate3d(-50%,-50%,0) scale3d(0.8,0.8,1);
	transform: translate3d(-50%,-50%,0) scale3d(0.8,0.8,1);
}

div.effect-hera:hover p i:empty {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0); /* just because it's stronger than nth-child */
	opacity: 1;
}



/* Media queries */
@media screen and (max-width: 50em) {
	.content {
		padding: 0 10px;
		text-align: center;
	}
	.grid figure {
		display: inline-block;
		float: none;
		margin: 10px auto;
		width: 100%;
	}
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

/* Overlay style */
.overlayss {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: linear-gradient(100deg,#38d29c,#31aded);
}

/* Overlay closing cross */
.overlayss .overlay-close {
	width: 80px;
	height: 80px;
	position: absolute;
	right: 20px;
	top: 20px;
	overflow: hidden;
	border: none;
	background: url(../img/cross.png) no-repeat center center;
	text-indent: 200%;
	color: transparent;
	outline: none;
	z-index: 10000;
}

/* Menu style */
.overlayss nav {
	text-align: center;
	position: relative;
	top: 50%;
	height: 60%;
	font-size: 54px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.overlayss ul {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	display: inline-block;
	height: 100%;
	position: relative;
}

.overlayss ul li {
	display: block;
	height: 20%;
	height: calc(100% / 5);
	min-height: 54px;
}

.overlayss ul li a {
	font-weight: 300;
	display: block;
	color: #fff;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}

.overlayss ul li a:hover,
.overlayss ul li a:focus {
	color: #e3fcb1;
}

/* Effects */
.overlay-hugeinc {
	opacity: 0;
	visibility: hidden;
	-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
	transition: opacity 0.5s, visibility 0s 0.5s;
}

.overlay-hugeinc.open {
	opacity: 1;
	visibility: visible;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
	z-index: 999999;
}

.overlay-hugeinc nav {
	-webkit-perspective: 1200px;
	perspective: 1200px;
}

.overlay-hugeinc nav ul {
	opacity: 0.4;
	-webkit-transform: translateY(-25%) rotateX(35deg);
	transform: translateY(-25%) rotateX(35deg);
	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
	transition: transform 0.5s, opacity 0.5s;
}

.overlay-hugeinc.open nav ul {
	opacity: 1;
	-webkit-transform: rotateX(0deg);
	transform: rotateX(0deg);
}

.overlay-hugeinc.close nav ul {
	-webkit-transform: translateY(25%) rotateX(-35deg);
	transform: translateY(25%) rotateX(-35deg);
}

@media screen and (max-height: 30.5em) {
	.overlay nav {
		height: 70%;
		font-size: 34px;
	}
	.overlay ul li {
		min-height: 34px;
	}
}

.projectscope{background: #F0F0F0; padding: 20px 30px}
.projectscope a.btn-dark{ margin: 0;}
.projectscope .calltoaction{text-align: right;}
.features-slider {
    position: relative;
    top:-20px;
}

.features-slider ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.features-slider ul li {
    width: 100%;
}
.abouttxt.topcs{top: 110px}
.abouthead.casehead .abouttxt.casestudyss h2{color: #000;}
.case-inner p{font-size: 18px;
    line-height: 30px;
    width: 80%;
    margin: 0 auto;
    text-align: center;
    color: #555;}
.smalldesc{padding-top: 60px;}
.brdr{border-left: 2px solid #dadada;}
.brdr .pds{padding-bottom: 30px;}
.brdr .col-md-6 h2{margin: 0; line-height: 1.5em;}
.brdr .col-md-6 p{margin: 0; line-height: 1.5em;}

.loop{padding-top: 30px;}
input[type="text"], input[type="email"], input[type="tel"], input[type="file"],input[type="url"] {
  padding: 8px 25px;
  border: 1px solid #D3D3D3;
  font-size: 13px;
  line-height: 13px;
  box-shadow: none;
  margin: 0;
  height: 49px;
  border-radius: 4px;
  color: #797879;
  width: 100%;
/*   font-family: 'Avenir W01', "Century Gothic", CenturyGothic, AppleGothic, sans-serif; */
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -webkit-appearance: none;
  transition: border-color .5s ease;
}
input[type="file"]{background-color: #ffffff;padding: 15px 25px!important;}
input[type="tel"]{margin-bottom: 20px}
input[type="url"]{margin-bottom: 20px}

textarea {
  padding: 15px 25px;
  border: 1px solid #D3D3D3;
  font-size: 13px;
  line-height: 13px;
  box-shadow: none;
  margin: 0;
  border-radius: 4px;
  color: #797879;
  line-height: 16px;
  width: 100%;
  height: 203px;
  resize: none;
/*   font-family: 'Avenir W01', "Century Gothic", CenturyGothic, AppleGothic, sans-serif; */
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  transition: border-color .5s ease;
}
 fieldset .button {
  float: right;
  width: 100px;
  min-width: 100px;
}
.button.green, #commentform .submit {
  background-color: #363636;
  color: #fff;
}
button.button, input[type="submit"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  border: none;
  cursor: pointer;
}
input[type=submit], input[type=button], button {
  margin: 0!important;
  padding: 10px 35px!important;
  border: 0px;
  background-color: #4a2424;
  color: #fff;
}
 textarea {
  margin-bottom: 20px;
}
 input[type="text"], input[type="email"] {
  margin-bottom: 20px;
}
.forms{background: #EDEDED }
/* .locations{background-color: #444444;} */
.locations .col-md-4{background-color: #fff; padding: 10px;   }
.locations .col-md-4 p{color: #000; line-height: 1em;  font-size: 15px;}
.locations .col-md-12.headoff{background-color: #fff; padding: 10px; border-top: 1px solid #c2c2c2;  }
.locations .col-md-12.headoff p{color: #000; line-height: 1em;  font-size: 15px;}
.locations .col-md-12.headoff{margin-bottom: 40px;}

.locations .col-md-4.headoff{margin-bottom: 10px; margin-left: 35%}
.title-v5{z-index: 1;text-align: center;}
h1.hed { font-size: 12px; text-transform: uppercase; color: #c2c2c2;  font-weight: bold; margin-bottom: 10px;}
.col-md-4.clientdtls{text-align: right;}
.clientwrk .col-md-12 img{text-align: center; display: inline-block;}

.pds .col-md-3{padding: 0px;}
.pds .col-md-6 h2, .pds .col-md-6 p {padding: 0px; margin: 0;}
.pds .col-md-6{padding-top: 5px;}

.clientwrk{text-align: center;}
.morewrks .pds{text-align: left; padding-bottom: 20px;}
.clientdescr{padding: 0px 300px; }
.clientwrk .title-v1{margin-bottom: 0px;}
.clntloc2{margin-top: 40px;}
.blog-inner h1{padding: 0px 0px; margin: 0;font-size: 38px; line-height: 1.25em; text-align: left;text-transform: capitalize;
    text-align: left; font-weight: 700;
    font-size: 38px;
    /* font-family: 'Droid Serif', serif; */}
    .blog-inner p{width: 100%; text-align: left; display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    font-family: 'Droid Serif', serif;margin-top: 29px;    font-size: 21px;
    line-height: 1.58;
    letter-spacing: -0.003em;}
.tagcloud a.tags{text-align: left; font-size: 15px; color: rgba(0,0,0,0.6);
    background: rgba(0,0,0,0.05);border-radius: 3px;margin: 0; padding: 10px;}
.tagcloud{text-align: left;}
.blogpost .container{border-top: 1px solid #d3d1d1; }
.blogpost .col-md-3{padding: 0; margin: 0;}
.blogpost .col-md-3 img{width: 200px; height: 200px;}

.blogpost .col-md-7 h2{font-size: 2rem;line-height: 3rem;text-transform:  capitalize;}
.blogpost .col-md-7{padding-top: 10px; margin: 0;}

.blogpost:hover .container{background-color: #989898; }
.blogpost:hover .container .col-md-6 h2{color: #ffffff; cursor: pointer }
.openps{margin-top: 50px;}
.openps .col-md-2{background-color: #fff; margin-left: 10px;text-align: left; padding: 20px;min-height: 480px; margin-top: 20px;}
.openps .col-md-2 p{font-size: 13px;}
.openps .col-md-2 h3{font-size: 25px;}
.capabilities.new{background-color: #EDEDED;  }
p.careers{color: #dadada; padding: 0px 50px;}
.case-inner ul li{text-align: left; color: #4d4d4d;font-family: 'Droid Serif', serif; 
    line-height: 1.58;
    font-size: 21px;}
    
 #Container .mix{
	display: none;
}
.openps .col-md-3{background-color: #fff; margin-left: 10px;text-align: left; padding: 20px;min-height: 350px; margin-top: 20px; width: 24%;}
.openps .col-md-3 p{font-size: 13px; }
.openps .col-md-3 p.bt{font-size: 13px; color: #a52c2c}
.workbtns.apbtns{margin-top: -15px}
.workbtns.apbtns a.btn-dark{margin: 0;}
.openps .col-md-3 h3{font-size: 25px;}
.filter{display: inline-block; cursor: pointer; font-size: 20px; margin-left: 50px; padding-bottom: 15px}
.filter.active{border-bottom: 3px solid #a63c3c;}
.filter:first-child{margin-left: 0px;}
.filtercrs{border-bottom: 1px solid #adadad;}
.careerssp .title-v1{margin-bottom: 10px;}
.openps a:hover{color: #a52c2c}
.hd-link a{position: absolute;
    right: 100px;
    top: 20px;
    display: block;
    background: none;
    border: 0px;
    outline: none; color: #232731; font-size: 18px; font-weight: normal}

.locations_new h1{color: #c4c4c4; font-size: 17px; font-weight: 600}
.locations .locations_new .col-md-4  p{color: #878787; font-size: 15px;line-height: 1.5em; margin: 0;font-weight: 400 }
.locations .locations_new .col-md-4 .world  p{color: #3f3f3f; font-size: 17px; line-height: 1.5em; margin: 0;font-weight: 400}
.locations .locations_new .col-md-4 .world  p span{color: #878787; font-size: 17px; line-height: 1.5em; margin: 0;  font-weight: 400}
.locations .locations_new .col-md-4 .world{margin-top: 40px;}
.blog {background-color: #F4F5F7; padding: 50px 0px;}
.blog .title_v2 {background-color: #F4F5F7;padding: 10px 0px;}
.blog .col-md-2 {
    padding: 0px !important;
    margin: 18px;
/*     background-color: #ffffff; */
    width: 250px;
    height: 375px;
   /*
 -webkit-box-shadow: 0px 0px 3px 2px rgba(173,170,173,1);
    -moz-box-shadow: 0px 0px 3px 2px rgba(173,170,173,1);
    box-shadow: 0px 0px 3px 2px rgba(173,170,173,1);
*/
}
.content-img p.meta_til {
    position: absolute;
    top: 92px;
    background-color: #FEF13C;
    padding: 5px 10px;
    color: #000;
    font-size: 13px;
    font-weight: 600;
    font-family: 'myriad-pro', sans-serif;
}
.blog .content {
    padding: 0px 10px;
    font-family: 'myriad-pro', sans-serif;
}
.blog .col-md-2 .content a {
    color: #2C44FF;
}
.blog .col-md-2 .content span {
    color: #989898;
}
.blog .col-md-2 .content p {
    color: #737373;
}
.text {
    height: 5.6em;
    line-height: 1.4em;
    overflow: hidden;
    position: relative;
}
.text:after {
    background: linear-gradient(to right, rgba(255, 255, 255, 0), #FFFFFF 50%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    bottom: 0;
    content: "...";
    font-weight: bold;
    padding: 0 20px 1px 45px;
    position: absolute;
    right: 0;
}
.blog .col-md-2 .content a {
    color: #2C44FF;
}
.blog .container-fluid{padding-left: 15px; padding-right: 15px;}
.content-img {
    display: block;
    overflow: hidden;
    width: 100%;
    height: 0;
    position: relative;padding-bottom: 55.308681%;
}
.content-img img{ width: 100%;}
.blog .col-md-2 .content {padding: 10px 10px;}
.mix .supsystic-social-sharing{display: none!important;}
.lightbox{display: none;}
.featherlight .featherlight-close-icon{display: none;}
.featherlight-inner .col-md-7 h3{font-size: 17px;color: #173659; padding-left: 20px;}
.featherlight-inner .col-md-5.right{text-align: right; padding: 10px 30px;}
.featherlight-inner .col-md-5.right a{color: #888888}
.featherlight-inner .col-md-5.right a:hover{color: #173659}
.featherlight .featherlight-content{background: #000!important}
.home_blog h2{text-transform: none; font-size: 16px;}
.blog.home_blog{background: #fff}
.blog.home_blog .title_v2{background-color: #fff}
.text2 {
    height: 2.6em;
    line-height: 1.4em;
    overflow: hidden;
    position: relative;
}
.text2:after {
    background: linear-gradient(to right, rgba(255, 255, 255, 0), #FFFFFF 50%) repeat scroll 0 0 rgba(0, 0, 0, 0);
    bottom: 0;
    content: "...";
    font-weight: bold;
    padding: 0 20px 1px 45px;
    position: absolute;
    right: 0;
}
