body,html {
background-color:#131313;
font-family:"Open Sans";
color:#FFF;
height:100%;
margin:0;
padding:0;
}

p a {
color:#406bca;
text-decoration:none;
}

p a:hover {
color:#666;
}

p.bluequote {
font-size:22px;
font-weight:300;
line-height:38px;
margin:0;
}

p.quote {
font-size:30px;
font-weight:300;
line-height:44px;
margin:0;
}

p.quote2 {
font-size:18px;
font-weight:600;
line-height:30px;
margin-bottom:10px;
}

h1 {
font-size:38px;
font-weight:300;
line-height:52px;
margin:0;
}

h1.heading {
font-size:33px;
font-weight:300;
line-height:52px;
margin:0;
}

h2 {
font-size:33px;
font-weight:300;
line-height:40px;
margin:0;
}

h2.heading {
font-size:33px;
font-weight:300;
line-height:52px;
margin:0;
}

h2.subheading {
font-size:24px;
font-weight:300;
line-height:38px;
margin:0;
}

h3 {
font-size:28px;
font-weight:300;
line-height:42px;
margin:0;
}

h4 {
font-size:24px;
font-weight:300;
line-height:38px;
margin:0;
}

h5 {
font-size:18px;
font-weight:600;
line-height:30px;
margin:0;
}

p {
font-weight:400;
font-size:15px;
line-height:26px;
margin:0;
}
.p0 { padding: 0 !important; }
nav {
width:100%;
height:50px;
z-index:999;
position:absolute;
margin-top: 0;
}
nav.navmenu {
    background-color: #406bca
}
nav img {
width:100px;
padding:10px;
}

nav img:hover {
opacity:0.7;
}

nav #mobile-menu { display: none; }

nav ul {
list-style:none;
float:right;
font-size:13px;
color:#FFF;
margin:15px 16px 0 0;
}

nav li {
float:left;
text-transform:uppercase;
margin:0 1px;
}

nav li a {
color:#FFF;
padding:5px;
margin: 0 0 0 10px;
text-decoration: none;
}

nav li.social a {
margin: 0 !important;
}

nav li a:hover {
color:#406bca;
}

nav.navmenu li a:hover {
color:#333;
}

nav li i {
font-size:22px;
margin:0 0 0 10px;
}
header .full-panel {
background-position: center;
background-attachment: fixed;
}
header h1 {
padding:0 25px;
font-weight: 400;
}
header h1,header h4 {
padding:0 25px;
}
header button {
border-color: #FFF;
}
header .middle-panel {
z-index:9;
}

header ul {
list-style:none;
display:inline-block;
margin:50px auto 0;
padding:0;
}

header ul li {
width:80px;
float:left;
padding:5px;
}

header ul li i:hover {
    color: #333;
    cursor: pointer;
}

header ul li i.active {
    opacity: 0.2;
}

header .owl-item,header .owl-stage,header .owl-carousel,header .owl-stage-outer,header .item {
height:100%!important;
}

.home-header-slide .owl-nav { margin: 0 !important; padding: 0 !important; background-color: transparent !important; }

.home-header-slide .owl-prev { position: absolute;top: 50%; }

.home-header-slide .owl-next { position: absolute;top: 50%;right: 0; }

#home-case-studies .client-logo { width:140px; margin-bottom: 30px; }

footer {
position: fixed;
left: 0;
bottom: 0;
z-index: -9999999999;
width:100%;
padding:50px 0 0 0;
background-color: #FFF;
color: #333;
}
footer .auto-panel .middle-panel {
    padding: 20px 0
}
footer .auto-panel {
background-color: #FFF;
}
footer #footer-legal {
    background-color: #406bca !important;
    color: #FFF;
    text-align: center;
    height: 60px;
    margin: 20px 0 0 0;
}
footer #footer-legal a {
    color: #FFF;
}
footer #footer-legal a:hover {
    color: #333;
}


footer .col4:nth-child(1) > div { margin: 0 20px 0 0 }
footer .col4:nth-child(2) > div { margin: 0 20px 0 20px }
footer .col4:nth-child(3) > div { margin: 0 20px 0 20px }
footer .col4:nth-child(4) > div { margin: 0 0 0 20px }

footer .fab { font-size: 22px; margin: 20px 15px 0 0 }
footer a {
color: #000;
text-decoration: none;
}
footer a:hover {
color: #406bca;
}
footer a:hover img {
opacity: 0.5;
}
footer hr {
color: #333;
width: 50%;
margin: 15px 0;
}
footer p {
font-size: 13px;
line-height: 20px;
}
footer .clearfix {
margin: 0;
}
footer input {
width: 100%;
padding: 10px;
margin: 0 0 10px 0;
box-sizing:border-box;
border: none;
}
footer textarea {
font-family:"Open Sans";
font-size: 13px;
width: 100%;
height: 110px;
padding: 10px;
margin: 0 0 10px 0;
box-sizing:border-box;
border: none;
}

    .video-panel { position: relative;top: 0;bottom: 0;left: 0;right: 0;height: 100%;width: 100%; background: rgba(29,29,29,0.6) }
    .video-panel .video-block { display: table; width: 100%; height: 100% }
    .video-panel .video-block .video-title { position: absolute; margin: 10px; text-align: center; color: #FFF; font-size: 15px }
    .video-panel .video-block .video-media { display: table-cell; vertical-align: middle; text-align: center; font-size: 40px; color: #FFFF }
    .video-setup { position: absolute;top: 0; }
	
.auto-panel, .full-panel {
background-color: #131313;
}


.icon-block a {
color: #FFF;
}

.icon-block a:hover {
color: #666;
}

.container {
display:inline-block;
}

.full-panel .middle-panel {
position:relative;
top:50%;
transform:translateY(-50%);
width:100%;
margin:0 auto;
padding: 80px 0
}

.auto-panel .middle-panel {
position:relative;
width:100%;
padding:80px 0;
}

.middle-panel.tb {
padding:160px 0;
}

.middle-panel.to {
padding:120px 0 60px 0;
}

.middle-panel.bo {
padding:60px 0 120px 0;
}

.bg-img-dark > div,.bg-img-light > div {
z-index:9;
position:relative;
margin:0px auto;
}

.bg-img-dark::after {
content:"";
background:rgba(29,29,29,0.7);
opacity:0.9;
top:0;
left:0;
bottom:0;
right:0;
position:absolute;
}

.bg-img-light::after {
content:"";
background:rgba(255,255,255,0.9);
opacity:0.9;
top:0;
left:0;
bottom:0;
right:0;
position:absolute;
}

.bg-img-light > .section-block {
color:#000;
}

.section-block {
max-width:1240px;
margin:0 auto;
padding:0 25px;
}

i.ico {
font-size:45px;
}

.spacer {
padding:20px;
}

.spacer-tb {
padding:20px 0;
}

.spacer-br {
padding:0 20px 10px 0;
}

.spacer-r {
padding:0 20px 0 0;
}

.spacer-l {
padding:0 0 0 20px;
}

.spacer-bl {
padding:0 0 10px 20px;
}

.spacer > button,.spacer-br > button,.spacer-bl > button {
margin-top:20px;
}

.block {
padding-bottom:100px;
}

.heading {
margin-bottom:25px;
}

.subheading {
margin-bottom:10px;
}

.txt-center {
text-align:center;
}

.light-bg {
background-color:#333;
}
.blue-bg {
background-color: #406bca;
}

.col2 {
width:50%;
float:left;
}

.col2-offset {
display:flex;
width:100%;
}

.col2-offset > div.media {
width:51%;
float:left;
position:relative;
}

.col2-offset > div.media img {
vertical-align:top;
}

.col2-offset > div.text {
width:49%;
float:left;
position:relative;
}

.col2-offset > div.text .block-container {
position:absolute;
top:0;
left:0;
bottom:0;
right:0;
}

.col2-offset > div.text .block {
display:table;
width:100%;
height:100%;
}

.col2-offset > div.text span {
display:table-cell;
vertical-align:middle;
}

.col2-offset > div.media div.media-overlay {
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
display:none;
}

.col2-offset > div.media:hover div.media-overlay {
background:rgba(29,29,29,0.6);
display:block;
}

.col2-offset > div.media div.media-overlay > span {
position:relative;
top:calc(50% - 70px);
font-size:60px;
color:#FFF;
}

.col3 {
width:33.333333333333%;
float:left;
}

.col3 .feature-panel {
position:relative;
}

.col3 .feature-panel .feature-block {
position:absolute;
width:100%;
height:100%;
z-index:9;
}

.col3 .feature-panel .feature-block .feature-text {
position:relative;
top:50%;
transform:translateY(-50%);
text-align:center;
color:#FFF;
padding:25px;
}

.col3 .feature-panel img {
display:block;
width:100%;
opacity:0.7;
}



.col3 .feature-panel:hover img {
  -webkit-animation-name: feature-panel;
  -webkit-animation-duration: 1s;
  animation-name: feature-panel;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

@-webkit-keyframes feature-panel {
  from {opacity: 0.4;}
  to {opacity: 0.1;}
}


.col3 .feature-panel:hover .feature-block .feature-text {
  -webkit-animation-name: feature-text;
  -webkit-animation-duration: 1s;
  animation-name: feature-text;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}
@-webkit-keyframes feature-text {
  from {transform: translateY(-50%);}
  to {transform: translateY(-60%);}
}


    










.col4 {
width:25%;
float:left;
}

.col5 {
width:20%;
float:left;
}

.col-half {
width:50%;
margin:0 auto;
}

.info-block {
display:flex;
}

.clearfix {
clear:both;
margin:100px 0;
}

button {
border:1px solid #406bca;
background-color:transparent;
text-transform:uppercase;
font-family:'Open Sans';
font-size:14px;
font-weight:300;
color:#FFF;
cursor:pointer;
margin:0;
padding:10px 36px;
}

button:hover {
color:#FFF;
background-color:#406bca;
}

button.dark {
border:1px solid #406bca;
color:#406bca;
}

button.dark:hover {
color:#FFF;
background-color:#406bca;
border:1px solid #406bca;
}

button.light {
border:1px solid #FFF;
color:#FFF;
}

button.light:hover {
color:#333;
background-color:#EEE;
}


#offering1::before {
content: "";
background-size:cover;
position: absolute;
width: 100%;
height: 100%;
z-index: 9;
}


#offering2::before {
content: "";
background: rgba(1,1,1,0.4);
position: absolute;
width: 100%;
height: 100%;
z-index: 9;
}

#offering {
display:inline-grid;
padding:100px 0;
z-index: 99;
}


#offering #nav {
position:relative;
z-index:9;
display:table;
background-color: rgba(1,1,1,0.8);
width: 100%;
padding: 20px 0 0 0;
}

#offering .content i {
position:absolute;
padding:30px 25px 25px;
}

#offering .content .col3 {
background-color:rgba(1,1,1,0.8);
position:relative;
z-index:9;
display:table;
}

#offering .content .col3:hover {
background-color:#406bca;
}

#offering .content .col3 button {
position: absolute;
bottom: 30px;
}

#offering .content .col3:hover button {
border-color:#FFF;
}

#offering ul {
list-style:none;
display:inline-block;
font-size:24px;
margin:0 auto 20px;
padding:0;
}

#offering ul li.active {
border-bottom:1px solid #666;
color:#666;
}

#offering ul li {
float:left;
cursor:pointer;
margin:0 10px;
padding:5px;
}

#offering #nav ul li.active, #offering #nav ul li:hover {
cursor:pointer;
border-bottom:1px solid #406bca;
color:#406bca;
}

.scroll,.scroller {
width:100px;
text-align:center;
font-size:40px;
color:#FFF;
position:relative;
z-index:9;
cursor:pointer;
margin:-55px auto 0 auto;
}

#breadcrumb { display: inline;top: -42px;position: relative;left: 20px; font-size: 13px; }
#breadcrumb a { color: #FFF; text-decoration: none; }
#breadcrumb a:hover { color: #CCC; }

.fa-ul {
text-align:left;
line-height:26px;
font-size:15px;
}

.fa-ul li {
margin:10px 0;
}

.fa-li {
font-size:24px;
}

.action {
background-color:#406bca!important;
display:inline-block;
width:100%;
padding:60px 0;
}

.action h2 {
float:left;
}

.action p {
float:left;
margin:8px 0 0 25px;
}

.owl-item .item img:hover {
opacity:0.4;
}

.owl-carousel,.owl-carousel .owl-item {
-webkit-tap-highlight-color:transparent;
position:relative;
}

.owl-carousel {
display:none;
width:100%;
z-index:1;
}

.owl-carousel .owl-stage {
position:relative;
-ms-touch-action:pan-Y;
touch-action:manipulation;
-moz-backface-visibility:hidden;
}

.owl-carousel .owl-stage:after {
content:".";
display:block;
clear:both;
visibility:hidden;
line-height:0;
height:0;
}

.owl-carousel .owl-stage-outer {
position:relative;
overflow:hidden;
-webkit-transform:translate3d(0,0,0);
}

.owl-carousel .owl-item,.owl-carousel .owl-wrapper {
-webkit-backface-visibility:hidden;
-moz-backface-visibility:hidden;
-ms-backface-visibility:hidden;
-webkit-transform:translate3d(0,0,0);
-moz-transform:translate3d(0,0,0);
-ms-transform:translate3d(0,0,0);
}

.owl-carousel .owl-item {
min-height:1px;
float:left;
-webkit-backface-visibility:hidden;
-webkit-touch-callout:none;
}

.owl-carousel .owl-item img {
display:block;
width:100%;
cursor:pointer;
}

.owl-carousel .owl-item img:hover {
opacity:0.5;
}

.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev {
cursor:pointer;
-webkit-user-select:none;
-khtml-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
}

.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev,.owl-carousel button.owl-dot {
background:0 0;
color:inherit;
border:none;
font:inherit;
padding:0!important;
}

.owl-carousel.owl-loading {
opacity:0;
display:block;
}

.owl-carousel.owl-refresh .owl-item {
visibility:hidden;
}

.owl-carousel.owl-drag .owl-item {
-ms-touch-action:pan-y;
touch-action:pan-y;
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
}

.owl-carousel.owl-grab {
cursor:grab;
}

.owl-carousel.owl-rtl {
direction:rtl;
}

.owl-carousel .animated {
animation-duration:1s;
animation-fill-mode:both;
}

.owl-carousel .owl-animated-in {
z-index:0;
}

.owl-carousel .owl-animated-out {
z-index:1;
}

.owl-carousel .fadeOut {
animation-name:fadeOut;
}

.owl-height {
transition:height .5s ease-in-out;
}

.owl-carousel .owl-item .owl-lazy {
opacity:0;
transition:opacity .4s ease;
}

.owl-carousel .owl-item .owl-lazy:not([src]),.owl-carousel .owl-item .owl-lazy[src^=""] {
max-height:0;
}

.owl-carousel .owl-item img.owl-lazy {
transform-style:preserve-3d;
}

.owl-carousel .owl-video-wrapper {
position:relative;
height:100%;
background:#000;
}

.owl-carousel .owl-video-play-icon {
position:absolute;
height:80px;
width:80px;
left:50%;
top:50%;
margin-left:-40px;
margin-top:-40px;
background:url(owl.video.play.png) no-repeat;
cursor:pointer;
z-index:1;
-webkit-backface-visibility:hidden;
transition:transform .1s ease;
}

.owl-carousel .owl-video-play-icon:hover {
-ms-transform:scale(1.3,1.3);
transform:scale(1.3,1.3);
}

.owl-carousel .owl-video-tn {
opacity:0;
height:100%;
background-position:center center;
background-repeat:no-repeat;
background-size:contain;
transition:opacity .4s ease;
}

.owl-carousel .owl-video-frame {
position:relative;
z-index:1;
height:100%;
width:100%;
}

.owl-theme .owl-dots,.owl-theme .owl-nav {
text-align:center;
-webkit-tap-highlight-color:transparent;
}

.owl-theme .owl-nav[class*=owl-] {
color:#FFF;
font-size:14px;
background:#D6D6D6;
display:inline-block;
cursor:pointer;
border-radius:3px;
margin:5px;
padding:4px 7px;
}

.owl-theme .owl-nav[class*=owl-]:hover {
background:#869791;
color:#FFF;
text-decoration:none;
}

.owl-theme .owl-nav .disabled {
opacity:.5;
cursor:default;
}

.owl-theme .owl-dots .owl-dot {
display:inline-block;
zoom:1;
}

.owl-theme .owl-dots .owl-dot span {
width:10px;
height:10px;
background:#D6D6D6;
display:block;
-webkit-backface-visibility:visible;
transition:opacity .2s ease;
border-radius:30px;
margin:5px 7px;
}

.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span {
background:#869791;
}

header,.full-panel {
height:100%;
}

header .full-panel::after {
content:"";
background:rgba(29,29,29,0.5);
opacity:0.9;
top:0;
left:0;
bottom:0;
right:0;
position:absolute;
}









#modal {
    position: absolute;
    z-index: 10000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #333;
    display: none;
    z-index: 9999999;
}
#modal .full-panel .middle-panel {
    padding: 0;
}
.modal-open {
    cursor: pointer;
}
img.modal-open:hover {
    opacity: 0.5;
}
#modal-close {
    float: right;
    font-size: 40px;
    padding: 30px;
    line-height: 0;
    cursor: pointer;
	position: relative;
	z-index:9;
}
#modal img {
    width: 150px;
    margin: 20px 0;
}

#modal .content img, #modal .content video {
    width: 80%
}



.scroll-ani {
    background-repeat: no-repeat;
    background-clip: content-box;
    background-size: cover;
    display: none;
}

.scroll-ani.pl {
    padding-left: 20px;
}

.scroll-ani.pr {
    padding-right: 20px;
}













.col3 .feature-panel .feature-block .feature-text p,.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled,.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn {
display:none;
}

.col3 .feature-panel:hover .feature-block .feature-text p,.info-block img,.no-js .owl-carousel,.owl-carousel.owl-loaded {
display:block;
}

.action button,.owl-carousel.owl-rtl .owl-item {
float:right;
}

.owl-carousel.owl-hidden {
opacity:0;
}

.owl-theme .owl-nav,.owl-theme .owl-nav.disabled+.owl-dots {
margin-top:10px;
}
















@media only screen and (max-device-width: 667px) {
    















h1 {
font-size:28px;
line-height:39px;
}

h1.heading {
font-size:25px;
line-height:39px;
}

h2 {
font-size:25px;
line-height:30px;
}

h3 {
font-size:21px;
line-height:30px;
}

h4 {
font-size:17px;
line-height:29px;
}

h5 {
font-size:14px;
line-height:22px;
}

p {
font-size:12px;
line-height:20px;
}


    nav li { float: none !important; padding: 5px 0 }
    
    nav ul { width: 100%;
display: none;
margin: -55px 0 0 0;

background-color:
#406bca;

padding: 55px 0 10px 0; }

    nav li.social { display: none; }

    nav #mobile-menu { width: 20px;

font-size: 20px;

padding: 8px 14px;
        margin: 5px 5px 0 0; position: relative;

float: right; display: block; cursor: pointer; }


    .col2 { width: 100%; }
    
    .col2-offset { display: inline-block; }
    
    .col2-offset > div.text { width: 100%; }

    .col2-offset > div.text .block-container { position: relative; }
    
    .col2-offset > div.text .block-container .block { padding-bottom: 20px; }
    
    .col2-offset > div.media { width: 100%; }
    
    
    #case-studies .col2-offset > div.media { display: none !important; }
    
    .col3 { width: 100%; float: none }
    
    .col4 { width: 100%; float: none }
    
    
    .col5 { width: 100%; float: none; margin: 20px 0 }
    
    .middle-panel.bo { padding: 60px 0 }
    
    
    .info-block { display: block; }
    
    .scroll-ani.pl { padding: 0; }



    header .full-panel { height: 100%; }
    
    header .full-panel .middle-panel { transform: translateY(-50%) !important; }
    
    header ul li { width: 50px; }
    
   i.ico { font-size: 30px; }
    
    
    .full-panel { height: auto; }



    .full-panel .middle-panel { transform: none; padding: 40px 0; }


    .info-block { display: inline-block; }
    
   
    
    .scroll, .scroller { display: none; }
    
    .spacer { padding: 20px 0 }

    
    #offering { padding: 0; }
    
    #offering .content .col3 { height: auto !important; padding-bottom: 40px; }
    
    #offering .content .col3 button { bottom: auto; }
    
    #offering ul {
        font-size: 18px;
    }   
    
    #offering ul li { float: none; }
    
    #offering .section-block { padding: 0; }
    
    #footer-action p { margin: 8px 0 20px 0; }
    
    #footer-action button { float: left; }
    
    #top { display: none; }
    
    footer .col4:nth-child(2) > div,
    footer .col4:nth-child(3) > div,
    footer .col4:nth-child(4) > div {
        display: none;
    }
    
    footer { min-height: 300px }
    
    .col-half { width: 90%; }


}