/*
Theme Name: Boost by Design Custom CSS Framework
Theme URI: http://boostbydesign.com
Description: Boost by Design Custom CSS Framework.
Author: Boost by Design
Author http://boostbydesign.com
Template: Total
Version: 1.3.3
*/

/**********
01 Global fonts
02 Global colors
03 UX Elements
04 Header
05 Menu
06 Slider/Hero Image
07 Essential Grid
08 Gravity Forms
09 Sidebar
10 Blog
11 Footer
12 Media Queries
**********/
/** VC STYLE ISSUE FIX **/
.vc_column_container>.vc_column-inner
{
    padding-left:0px;
    padding-right:0px;
}
.vc_row  {
 margin-left:0px;
 margin-right:0px;
}
/********** 01 Global fonts **********/
body{
  font-size: 18px;
  font-family: "Lato", sans-serif;
  color: #424242;
  font-weight:lighter;

}
p{
  font-size: 18px;
  font-family: "Lato", sans-serif;
  color: #424242;
  font-weight:600;
  width:100%;
  color:#313131;
    
}



h1, h2 {
  font-size: 48px;
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  color:inherit;
  z-index:1;
  position:relative;
  color:#313131;
}

h3 {
  font-size: 36px;
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  color:inherit;
  z-index:1;
  color:#313131;
  position:relative;
}

h4, h5, h6 {
  font-size: 24px;
  font-family: 'Poppins', sans-serif;
  text-transform: capitalize;
  font-weight: 800;
  color:inherit;
}

@media screen and (max-width:960px){
    h1,h2 {
        font-size:38px;
    }
    h3 {
        font-size:30px;
    }
}
@media screen and (max-width:767px){
    h1,h2 {
        font-size:30px;
    }
    h3 {
        font-size:26px;
    }
    h4,h5,h6 {
     font-size:24px;   
    }
}

/** Homepage Banner settings **/
.vc_separator h4 {color:#fff !important;}

/********** 02 Global colors **********/
.main-color{color: #8fc8ef;}
.alt-color{color: #1f487c;}
.neutral-color{color: #2a2a2a;}
.white {color: #fff !important;}
.black {color: #000 !important;}

.main-color-bg{ background-color: #8fc8ef;}
.alt-color-bg{ background-color: #1f487c;}
.neutral-color-bg{background-color: #2a2a2a;}

/** GENERAL STYLES **/
.light{font-weight:200;}
.normal {font-weight:400;}
.bold{font-weight:700;}
.center {text-align:center;}
.callout-text {letter-spacing:4px;font-size:22px;font-weight:400;}

a{color:#434343;}
a:hover,
.gif-one:hover,
.gif-two:hover,
.brand-design:hover,
.brand-outreach:hover,
.byron-gif:hover,
.jeremy-gif:hover,
#left-arrow-slider:hover,
#right-arrow-slider:hover
{text-decoration:none;cursor: pointer;}

.right {
    text-align:right;
}
/********** 03 UX Elements **********/
.dark-button{
  background-color: #1f487c;
  text-transform: uppercase;
  color: #fff;
  padding:7px 15px;
  -webkit-box-shadow: 0px 4px 10px rgba(50, 50, 50, 0.55);
  -moz-box-shadow:    0px 4px 10px rgba(50, 50, 50, 0.55);
  box-shadow:         0px 4px 10px rgba(50, 50, 50, 0.55);
}

.dark-button:hover{
  background-color: #4da8df;
  color: #fff;
}

.light-button{
  background-color: #fff;
  text-transform: uppercase;
  color: #8fc8ef;
  padding:7px 15px;
  -webkit-box-shadow: 0px 4px 10px rgba(50, 50, 50, 0.55);
  -moz-box-shadow:    0px 4px 10px rgba(50, 50, 50, 0.55);
  box-shadow:         0px 4px 10px rgba(50, 50, 50, 0.55);
}

.light-button:hover{
  background-color: #8fc8ef;
  color: #fff;
}
/********** 04 Header **********/
/**mobile nav **/
#sidr-main {
    background:#8fc8ef;
}
#overlay-header-wrap {
z-index: 100;
position:relative;

}
#site-header.not-sticky {
    opacity:1;
}
.fade-header {
  animation-name:  fade-header;
   -webkit-animation-name: fade-header;
  -moz-animation-name: fade-header;
  -webkit-animation-duration: 0.5s;
  -moz-animation-duration: 0.5s;
  animation-duration: 0.5s;
    animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards; /* Safari 4.0 - 8.0 */
    -moz-animation-fill-mode:forwards;
    animation-fill-mode: forwards;
}
/** header animation **/
.header .transparent {
    background-color:transparent;
    width:100%;
    height:80px;
}
#site-header-sticky-wrapper.is-sticky #site-header-inner {
    z-index: 10001 !important;
    padding-top:0px !important;
}
#site-header-sticky-wrapper.is-sticky #site-header.overlay-header.light-style {
    background-color:#fff !important;

}
#site-header-sticky-wrapper.is-sticky #site-header.overlay-header.light-style .dropdown-menu >li >a { 
    color:#777 !important;   
}


#site-header {padding: 0 15px !important; }
nav#site-navigation {margin-top:20px;float:right;}
.navbar-style-one .dropdown-menu>li>a{padding:0 10px;}
#site-navigation .dropdown-menu a {text-transform:capitalize !important;}
#mobile-menu {top:70px;padding-top:0px;margin-top:0px;}
#site-header-sticky-wrapper.is-sticky #site-header #mobile-menu{
    top:60px;
    background: #8fc8ef;
    padding:0 5px;
}
body.wpex-mobile-toggle-menu-icon_buttons #mobile-menu {
    height:40px;
    line-height:40px;
}
li.boost-link a span {color:#8fc8ef;}
li.light-blue-button-nav a span {
	background-color: #8fc8ef;
    color: #fff;
    border-radius: 35px !important;
    padding: 8px 30px !important;}
 li.dark-blue-button-nav a span {
	background-color: #2160b5;
    color: #fff;
    border-radius: 35px !important;
    padding: 8px 30px !important;}
@media only screen and (min-width: 960px){
#site-header.wpex-full-width .container {
    width: 85% !important;
    max-width: none !important;
}
/** .navbar-style-one { right: -10%; } **/
}
@media screen and (max-width:1100px){
		.navbar-style-one .dropdown-menu>li>a>span.link-inner {font-size:15px;}
}
@media screen and (max-width: 1030px) {
	.navbar-style-one .dropdown-menu>li>a>span.link-inner {font-size:13px;}
}

/********** 05 Menu **********/
.link-inner {
    font-size: 15px;
    font-weight: lighter;
    letter-spacing: 1px;
}

/************ ANIMATIONS ******************/
/** FILL BLUE SPAN ANIMATION ***/
@-webkit-keyframes fill {
    from {width: 0px;background-color: transparent;}
    to {width:150px; background-color: #8FC8EF;}
}
@keyframes fill {
    from {width: 0px;background-color: transparent;}
    to {width:150px; background-color: #8FC8EF;}
}

/** FILL BLUE SPAN ANIMATION ***/
@-webkit-keyframes darkfill {
    from {width: 0px;background-color: transparent;}
    to {width:150px; background-color: #2160B5;}
}
@keyframes darkfill {
    from {width: 0px;background-color: transparent;}
    to {width:150px; background-color: #2160B5;}
}

/** FOOTER CALLOUT GRADIENT CHANGE **/

/** ROTATE LEFT ANIMATION **/

@keyframes rot-left {
    0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(-270deg) scale(0.75);
    }
    100% {
        transform: rotate(-360deg) scale(1);
    }
}
@-webkit-keyframes rot-left {
     0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(-270deg) scale(0.75);
    }
    100% {
        transform: rotate(-360deg) scale(1);
    }
}
/** ROTATE RIGHT ANIMTION **/
@-webkit-keyframes rot-right {
    0% {
        transform: rotate(0deg) scale(0.85);
    }
    100% {
        transform: rotate(180deg) scale(1);
    }
}
@keyframes rot-right {
    0% {
        transform: rotate(0deg) scale(.85);
    }
    100% {
        transform: rotate(180deg) scale(1);
    }
}

/** FLOAT ANIMATION **/
@-webkit-keyframes float {
	0% {
		transform: translatey(0px);
	}
	50% {
		transform: translatey(-20px);
	}
	100% {
		transform: translatey(0px);
	}
}
@keyframes float {
	0% {
		transform: translatey(0px);
	}
	50% {
		transform: translatey(-20px);
	}
	100% {
		transform: translatey(0px);
	}
}

/** Elevate ANIMATION **/
@-webkit-keyframes elevate {
  0% { z-index:0; }
  100% { z-index:5; }
}
@keyframes elevate {
  0% { z-index:0; }
  100% { z-index:5; }
}
/** Un-Elevate ANIMATION **/
@-webkit-keyframes descend {
  0% { z-index:5; }
  100% { z-index:0; }
}
@keyframes descend {
  0% { z-index:5; }
  100% { z-index:0; }
}

/** MOVE LEFT ANIMATION **/
@-webkit-keyframes left {
  0% {-webkit-transform: translatex(0px); transform: translateX(0px); }
  100% { opacity:1;-webkit-transform: translateX(100%); transform: translateX(100%);}
}
@keyframes left {
  0% {-webkit-transform: translatex(0px);-moz-transform: translatex(0px); transition:translateX(0px); }
  100% { opacity:1;-webkit-transform: translatex(100%);-moz-transform: translatex(100%); transform:translatex(100%); }
}
/** MOVE RIGHT ANIMATION **/
@-webkit-keyframes right {
  0% { -webkit-transition:translateX(0);-moz-transition:translateX(0); transition:translateX(0); }
  100% { -webkit-transition:translateX(-50px);-moz-transition:translateX(-50px); transition:translateX(-50px); }
}
@keyframes right {
  0% { -webkit-transition:translateX(0);-moz-transition:translateX(0); transition:translateX(0); }
  100% { -webkit-transition:translateX(-50px);-moz-transition:translateX(-50px); transition:translateX(-50px); }
}
/** BLUR ANIMATION **/
@-webkit-keyframes blur {
  0% { -webkit-filter: blur(5px);-moz-filter: blur(5px); filter:blur(5px); }
  100% { -webkit-filter: blur(5px);-moz-filter: blur(5px);filter: blur(5px); }
}
@keyframes blur {
  0% { -webkit-filter: blur(5px);-moz-filter: blur(5px); filter:blur(5px); }
  100% { -webkit-filter: blur(5px);-moz-filter: blur(5px);filter: blur(5px); }
}

/** UN-BLUR ANIMATION **/
@-webkit-keyframes unblur {
  0% { -webkit-filter: blur(5px);-moz-filter: blur(5px); filter:blur(5px); }
  100% { -webkit-filter: blur(0px);-moz-filter: blur(0px);filter: blur(0px); }
}
@keyframes unblur {
  0% { -webkit-filter: blur(5px);-moz-filter: blur(5px); filter:blur(5px); }
  100% { -webkit-filter: blur(0px);-moz-filter: blur(0px);filter: blur(0px); }
}

@-webkit-keyframes showcase-left {
  0% { -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:15%;z-index:2;-ms-transform: scale(1.2); /* IE 9 */
    -webkit-transform: scale(1.2); /* Safari */
    transform: scale(1.2);}
  100% {
      -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:45%;z-index:1;-ms-transform: scale(1); /* IE 9 */
    -webkit-transform: scale(1); /* Safari */
    transform: scale(1);
  }
}
@keyframes showcase-left {
  0% { -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:15%;z-index:2;-ms-transform: scale(1.2); /* IE 9 */
    -webkit-transform: scale(1.2); /* Safari */
    transform: scale(1.2);}
  100% {
      -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:45%;z-index:1;-ms-transform: scale(1); /* IE 9 */
    -webkit-transform: scale(1); /* Safari */
    transform: scale(1);
  }
}
/** Showcase Right **/
@-webkit-keyframes showcase-right {
   0% { -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:45%;z-index:1;-ms-transform: scale(0.7); /* IE 9 */
    -webkit-transform: scale(0.7); /* Safari */
    transform: scale(0.7);}
  100% {
       -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:15%;z-index:2;-ms-transform: scale(1.2); /* IE 9 */
    -webkit-transform: scale(1.2); /* Safari */
    transform: scale(1.2);
  }
}
@keyframes showcase-right {
   0% { -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:45%;z-index:1;-ms-transform: scale(0.7); /* IE 9 */
    -webkit-transform: scale(0.7); /* Safari */
    transform: scale(0.7);}
  100% {
       -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:15%;z-index:2;-ms-transform: scale(1.2); /* IE 9 */
    -webkit-transform: scale(1.2); /* Safari */
    transform: scale(1.2);
  }
}
/** CARDS FOR ABOUT PAGE ANIMATION **/
@-webkit-keyframes cards-left {
  0% { -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:25%;z-index:2;    -moz-transform: scale(1); /* IE 9 */
    -ms-transform: scale(1);
    -o-transform: scale(1);
    -webkit-transform: scale(1); /* Safari */
    transform: scale(1);}
  100% {
      -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:0px;z-index:1;    -moz-transform: scale(0.7); /* IE 9 */
    -ms-transform: scale(0.7);
    -o-transform: scale(0.7);
    -webkit-transform: scale(0.7); /* Safari */
    transform: scale(0.7);}
}
@keyframes cards-left {
  0% { -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:25%;z-index:2;    -moz-transform: scale(1); /* IE 9 */
    -ms-transform: scale(1);
    -o-transform: scale(1);
    -webkit-transform: scale(1); /* Safari */
    transform: scale(1);}
  100% {
      -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:0px;z-index:1;    -moz-transform: scale(0.7); /* IE 9 */
    -ms-transform: scale(0.7);
    -o-transform: scale(0.7);
    -webkit-transform: scale(0.7); /* Safari */
    transform: scale(0.7);}
}
/** Cards Right **/
@-webkit-keyframes cards-right {
   0% { -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:0px;z-index:1;    -moz-transform: scale(0.7); /* IE 9 */
    -ms-transform: scale(0.7);
    -o-transform: scale(0.7);
    -webkit-transform: scale(0.7); /* Safari */
    transform: scale(0.7);}
  100% {
       -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:25%;z-index:2;    -moz-transform: scale(1); /* IE 9 */
    -ms-transform: scale(1);
    -o-transform: scale(1);
    -webkit-transform: scale(1); /* Safari */
    transform: scale(1);}
}
@keyframes cards-right {
   0% { -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:0px;z-index:1;    -moz-transform: scale(0.7); /* IE 9 */
    -ms-transform: scale(0.7);
    -o-transform: scale(0.7);
    -webkit-transform: scale(0.7); /* Safari */
    transform: scale(0.7);}
  100% {
       -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:25%;z-index:2;    -moz-transform: scale(1); /* IE 9 */
    -ms-transform: scale(1);
    -o-transform: scale(1);
    -webkit-transform: scale(1); /* Safari */
    transform: scale(1);}
}
/** CARDS FOR MOBILE ANIMATION **/
/** Cards Bottom **/
@-webkit-keyframes cards-bottom {
  0% { -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:0;z-index:2;}
  100% {
      -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:0;z-index:1;}
}
@keyframes cards-bottom {
  0% { -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:0;z-index:2;}
  100% {
      -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:0;z-index:1;}
}
/** Cards Top **/
@-webkit-keyframes cards-top {
   0% { -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:0;z-index:1;}
  100% {
       -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:0;z-index:2;}
}
@keyframes cards-top {
   0% { -webkit-filter: blur(2px);-moz-filter:blur(2px); filter:blur(2px);left:0;z-index:1;}
  100% {
       -webkit-filter: blur(0px);-moz-filter:blur(0px); filter:blur(0px);left:0;z-index:2;}
}


@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}
@-webkit-keyframes fade-slider {
  from {opacity: 0.4;} 
  to {opacity: 1;}
}

@keyframes fade-slider {
  from {opacity: 0.4;} 
  to {opacity: 1;}
}
@-webkit-keyframes fade-header {
  from {opacity: 0} 
  to {opacity: 1}
}

@keyframes fade-header {
  from {opacity: 0} 
  to {opacity: 1}
}

@-webkit-keyframes slider-right {
  from {left:-100%;opacity:0;} 
  to {left:0%;opacity:1;}
}

@keyframes slider-right {
  from {left:-100%;opacity:0;} 
  to {left:0%;opacity:1;}
}
@-webkit-keyframes slider-left {
  from {left:100%;opacity:0;} 
  to {left:0%;opacity:1;}
}

@keyframes slider-left {
  from {left:100%;opacity:0;} 
  to {left:0%;opacity:1;}
}

.fade {
  -webkit-animation-name: fade;
  -moz-animation-name:fade;
  -webkit-animation-duration: 1.5s;
  -moz-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}
.fade-slide-right {
  
  animation-name: slider-right;
  -webkit-animation-name: slider-right;
  -moz-animation-name:slider-right;
  -webkit-animation-duration: 0.5s;
  -moz-animation-duration: 0.5s;
  animation-duration: 0.5s;
}
.fade-slide-left {
  animation-name: slider-left;
  -webkit-animation-name: slider-left;
  -moz-animation-name:slider-left;
  -webkit-animation-duration: 0.5s;
  -moz-animation-duration: 0.5s;
  animation-duration: 0.5s;
}



.un-showcase {
    animation: showcase-left 0.75s linear infinite;
    -webkit-animation: showcase-left 0.75s linear infinite;
    -moz-animation: showcase-left 0.75s linear infinite;
    animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    -ms-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    -moz-transform: scale(0.7); /* IE 9 */
    -ms-transform: scale(0.7);
    -o-transform: scale(0.7);
    -webkit-transform: scale(0.7); /* Safari */
    transform: scale(0.7);
    animation-iteration-count: 1;
}
.showcase {
    animation: showcase-right 0.75s linear infinite;
    -webkit-animation: showcase-right 0.75s linear infinite;
    -moz-animation: showcase-right 0.75s linear infinite;
    animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    -ms-transform: scale(1.2); /* IE 9 */
    -webkit-transform: scale(1.2); /* Safari */
    transform: scale(1.2);
    animation-iteration-count: 1;

}



.un-feature {
    animation: cards-left 0.75s linear infinite;
    -webkit-animation: cards-left 0.75s linear infinite;
    -moz-animation: cards-left 0.75s linear infinite;
    animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    animation-iteration-count: 1;
}
.feature {
    animation: cards-right 0.75s linear infinite;
    -webkit-animation: cards-right 0.75s linear infinite;
    -moz-animation: cards-right 0.75s linear infinite;
    animation-timing-function: linear;
    animation-iteration-count: 1;

}
.mobile-un-feature {
        animation: cards-bottom 0.5s linear infinite;
    -webkit-animation: cards-bottom 0.5s linear infinite;
    -moz-animation: cards-bottom 0.5s linear infinite;
    animation-timing-function: linear;
    animation-iteration-count: 1;
}
.mobile-feature {
    animation: cards-top 0.5s linear infinite;
    -webkit-animation: cards-top 0.5s linear infinite;
    -moz-animation: cards-top 0.5s linear infinite;
    animation-timing-function: linear;
    animation-iteration-count: 1;
}

.infinite-hover {
    transform: translatey(0px);
    animation: float 6s ease-in-out infinite;
    -webkit-animation: float 6s ease-in-out infinite;
    -moz-animation: float 6s ease-in-out infinite;
}
.rotate-left {
    animation: rot-left 6s linear infinite;
    -webkit-animation: rot-left 6s ease-in-out infinite;
    -moz-animation: rot-left 6s ease-in-out infinite;
    animation-iteration-count: 1;
}
.rotate.rotate-right {
    animation: rot-right 0.8s linear infinite;
    -webkit-animation: rot-right 0.8s linear infinite;
    -moz-animation: rot-right 0.8s linear infinite;
    animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards; /* Safari 4.0 - 8.0 */
    -moz-animation-fill-mode:forwards;
    animation-fill-mode: forwards;
    
    
}


.showcase-right {
    animation: right 3s ease-in-out infinte, 
    un-blur 3s ease-in-out infinite;
    -webkit-animation: right 3s ease-in-out infinte, 
    un-blur 3s ease-in-out infinite;
    -moz-animation: right 3s ease-in-out infinte, 
    un-blur 3s ease-in-out infinite;
}
.elevate {
    animation:elevate 2s linear infinite;
    -webkit-animation: elevate 2s linear infinite;
    -moz-animation: elevate 2s linear infinite;
    animation-iteration-count:1;
}
.descend {
    animation:descend 2s linear infinite;
    -webkit-animation: descend 2s linear infinite;
    -moz-animation: descend 2s linear infinite;
    animation-iteration-count:1;
}

.blur {
    animation: blur 3s linear infinite;
    -webkit-animation: blur 3s linear infinite;
    -moz-animation: blur 3s linear infinite;
    animation-iteration-count:1;
}
.un-blur {
    animation: un-blur 3s linear infinite;
    -webkit-animation: un-blur 3s linear infinite;
    -moz-animation: un-blur 3s linear infinite;
    animation-iteration-count:1;
}
.hvr-sweep-to-right {
    display: inline-block;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:100%;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.hvr-sweep-to-right:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background:  #8fc8ef;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
/** BORDER FADE IN **/
.button{
    border: 2px solid transparent;
-webkit-transition: border-color 1s ease;
         -moz-transition: border 1s ease;
           -o-transition: border 1s ease;
          -ms-transition: border 1s ease;
              transition: border 1s ease;
              padding:10px 40px 10px 40px;
              border-radius:25px;
}

    .button:hover{
      border:2px solid #000;
    }
    .button.white:hover {
        border:2px solid #fff;
    }

/*** FONT AWESOME ICON BUTTON ARROW ***/
.hvr-icon-forward:before {
    content: "\f061";
    position: absolute;
    right: 90%;
    font-family: FontAwesome;
    transform: translateZ(0);
    transform: translate(-30px, 0);
    transition-duration: 1s;
    transition-property: transform;
    transition-timing-function: ease;
    color:#434343;
    
}
.clickable .callout-text::before,
#footer-callout-wrap .callout-text::before{
    content: "\f061";
    position: relative;
    font-family: FontAwesome;
    color:#fff;
    right:20px;
    font-weight:400;
}

.hvr-icon-forward.white:before  {
    color:#fff;
    
}
.hvr-float:focus,
.hvr-float:active,
.hvr-float.white:focus,
.hvr-float.white:active
{
  transform: translate(50px, 0);
  transition-duration: 0.5s !important;
  transition-property: transform;
  transition-timing-function: ease;
}

/**** HOMEPAGE SECTION *********************/
.homepage-banner-image {
    background-image:url('/wp-content/uploads/2018/04/home_hero_new_logo-min-min.jpg');
    width:100%;
    height: 100%;
    overflow: visible !important;
    box-sizing:border-box;
    background-size:cover;
    background-position:center bottom;
    background-repeat:no-repeat;
    margin-bottom:300px;
    
}
.banner-content {
    width:100%;
    height:100%;
    display:block;
    position:relative;
    padding-top:100px;
    min-height:425px;
    max-height:800px;
}
.smaller {
    font-size:32px;
}
@media screen and (min-width:1400px){
    .homepage-banner-image {
        background-size:cover;
    }
}

/** animated sections**/
.laptop-image {
    position:relative;
    background-image: url('/wp-content/uploads/2018/04/NEW_LAPTOP-min-optimized-min-min.png');
    width:800px;
    margin-top: 100px;
    height: 640px;
    background-size:cover;
    background-repeat:no-repeat;
    
}
.laptop-pop-image {
    position:relative;
    right:0;
    top:350px;
    background-image: url('/wp-content/uploads/2018/03/pop-out-laptop.png');
    width:100%;
    height:725px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center center;
}

.coffee-image {
    position:relative;
    right:0;
    top:200px;
    background-image: url('/wp-content/uploads/2018/03/coffee-min.png');
    width:100%;
    height:610px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: right center;
}
.dashboard-image {
    position:relative;
    background-image: url('/wp-content/uploads/2018/03/leads-dashboard-desk-min.png');
    width:100%;
    height:550px;
    right:-50px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: right center;
}
.seo-dashboard-image {
    position:relative;
    background-image: url('/wp-content/uploads/2018/03/seo_dashboard-min.jpg');
    width:100%;
    height:550px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center center;
}
.sem-dashboard-image {
    position:relative;
    background-image: url('/wp-content/uploads/2018/03/sem_dashboard-min.jpg');
    width:100%;
    height:550px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center center;
}
.web-dev-image {
    position:relative;
    background-image: url('/wp-content/uploads/2018/03/dev_screen-min.jpg');
    width:100%;
    height:550px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: center center;
}

.content-development-image {
    position:relative;
    background-image: url('/wp-content/uploads/2018/03/content-development-min.png');
    width:100%;
    height:700px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: left center;
}

.testimonial-image-seo {
    position:relative;
    background-image: url('/wp-content/uploads/2018/03/Maureen-min.png');
    width:80%;
    height:300px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: right center;
}
.testimonial-image-sem {
    position:relative;
    background-image: url('/wp-content/uploads/2018/03/Ashley-min.png');
    width:80%;
    height:300px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: right center;
}
.testimonial-image-web-development {
    position:relative;
    background-image: url('/wp-content/uploads/2018/03/Jesse-min.png');
    width:80%;
    height:300px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position: right center;
}


@media screen and (max-width:1024px){
    .testimonial-image-seo,
    .tesimonial-image-sem,
    .testimonial-image-web-development {
        top:100px;
        background-position:center center;
    }
    
}
@media screen and (max-width:767px){
    .dashboard-image {
     background-image: url('/wp-content/uploads/2018/03/facebook-reach-template-min.png');
     background-position:center center;
     margin-right:0px;
    }
    .content-development-image {
        background-position:center center;
    }
    .seo-dashboard-image,
    .sem-dashboard-image,
    .web-dev-image{
        height:370px;
    }
}

.behind-phone {
    position:relative;
    background-image:url('/wp-content/uploads/2018/02/Behind-Phone-min.png');
    width:100%;
    margin:auto;
    height:620px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    float:left;
    animation-iteration-count: 1
}
.behind-success-story {
    position:relative;
    background-image:url('/wp-content/uploads/2018/02/Behind-Phone-min.png');
    width:100%;
    margin:auto;
    height:400px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    float:left;
    right:-50%;
    top:-10%;
    animation-iteration-count: 1
}

.behind-gif {
    position:relative;
    background-image:url('/wp-content/uploads/2018/02/Behind-Phone-min.png');
    width:100%;
    margin:auto;
    height:620px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    float:left;
    animation-iteration-count: 1
}
.behind-slider {
    position:absolute;
    background-image:url('/wp-content/uploads/2018/02/Behind-Phone-min.png');
    width:100%;
    margin:auto;
    height:620px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center right;
    right:-50px;
    bottom:300px;
    animation-iteration-count: 1;
    z-index:-1;
}
.behind-portfolios {
    position:absolute;
    background-image:url('/wp-content/uploads/2018/02/Behind-Phone-min.png');
    width:100%;
    margin:auto;
    height:620px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center right;
    right:-150px;
    bottom:-20px;
    animation-iteration-count: 1;
    z-index:0;
}

.behind-cards {
    position:absolute;
    background-image:url('/wp-content/uploads/2018/02/Behind-Phone-min.png');
    width:100%;
    margin:auto;
    height:620px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center left;
    left:0px;
    bottom:0px;
    animation-iteration-count: 1;
    z-index:-1;
}
.behind-testimonial-image {
    position:relative;
    background-image:url('/wp-content/uploads/2018/02/Behind-Phone-min.png');
    width:100%;
    margin:auto;
    height:400px;
    left:-250px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    float:left;
    animation-iteration-count: 1
}
@media screen and (max-width:1024px){
    .behind-testimonial-image{
    left:0px;
    }
}
.behind-website-image {
    position:relative;
    background-image:url('/wp-content/uploads/2018/02/Behind-Phone-min.png');
    width:100%;
    margin:auto;
    height:400px;
    top:100%;
    left:0;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:left center;
    float:left;
    animation-iteration-count: 1
}

/** HOMEPAGE BANNER SECTION DESKTOP **/
.banner-left {
    display: inline-block;
    position: relative;
    width: 50%;
    height: 100%;
    padding: 100px 20px;
    padding-left: 100px;
    float: left;
}
.banner-right {
    display:inline-block;
    position:relative;
    width:50%;
    height:100%;
    float:left;
}
/*** Phone section **/
.phone-section-home {
    width:100%;
    height:100%;
    position:relative;
    clear:both;
    margin-top:100px;
}
.phone-section-home .half-left,
.phone-section-home .half-right {
    width:50%;
    height:100%;
    position:relative;
    float:left;

}
.phone-section-home .half-left .phone-image,
.phone-section-home .half-left .video{
    top:60px;
}
.phone-section-home .half-right p {
    text-align:left;
}
.phone-image {
   position:relative;
   width:100%;
   height:100%;
   max-width:300px;
   max-height:600px;
   min-width:150px;
   min-height:300px;
   margin:auto;
   background-image: url('/wp-content/uploads/2018/02/iphone-cropped-min.png');
   background-size:contain;
   background-position:center;
   background-repeat:no-repeat;
}
/** VIDEO SECTION **/

.phone-section .half-left .video {
    position:relative;
    z-index:2;
    
}
.video {
    position:relative;
    width:100%;
    height:100%;
    max-width:280px;
    max-height:580px;
    min-width:130px;
    min-height: 280px;
    position:relative;
    top:20px;
}
 #vid {
   position: absolute;
    width: 100%;
    height: 100%;
    max-width: 260px;
    max-height: 452px;
    min-width: 130px;
    min-height: 280px;
    top: 0px;
    left: 19px;
    z-index: 1;
}

/** HOMEPAGE GIF SECTION **/
.gif-row-homepage {
    padding:150px 0;
    position:relative;
}
.gif-left-row {
    padding:0 10%;
} 
.gif-rotate-section {
    margin:auto;
    width:100%;
    height:600px;
    position:absolute;
}
.gif-image {
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    width:250px !important;
    min-height:350px !important;
    height:350px !important;
    position:absolute;
    top:20%;
    left:0;
}
@media screen and (max-width:767px){
    .gif-image {
        width:250px !important;
        background-size:cover;
    }
    .gif-row-homepage
    {
        margin-top:-100px;
        padding:0 0 50px 0;
    }
}
@media screen and (max-width:560px){
        .gif-row-homepage
    {
        margin-top:-300px;
        padding:0 0 50px 0;
    }
}
.jeremy-gif {
    background-image:url('/wp-content/uploads/2018/04/jeremy_opt.gif');
    left:45%;
    z-index:0;
    filter:blur(2px);
    -moz-filter:blur(2px);
    -webkit-filter:blur(2px);
    -o-filter:blur(2px);
    -webkit-box-shadow: 0px 0px 15px 0px rgba(160, 160, 160, 0.75);
    -moz-box-shadow:    0px 0px 15px 0px rgba(160, 160, 160, 0.75);
    box-shadow:         0px 0px 15px 0px rgba(160, 160, 160, 0.75);
}
.byron-gif {
    background-image:url('/wp-content/uploads/2018/04/byron_opt.gif');
    left:15%;
    z-index:2;
    -webkit-box-shadow: 0px 0px 15px 0px rgba(160, 160, 160, 0.75);
    -moz-box-shadow:    0px 0px 15px 0px rgba(160, 160, 160, 0.75);
    box-shadow:         0px 0px 15px 0px rgba(160, 160, 160, 0.75);
}
.jeremy-gif.showcase,
.byron-gif.showcase{
    height:350px !important;
    min-height:350px !important;
    left:15%;
    z-index:2;
    filter:blur(0px);
    -moz-filter:blur(0px);
    -webkit-filter:blur(0px);
    -o-filter:blur(0px);
}
@media screen and (max-width:425px){
.jeremy-gif.showcase,
.byron-gif.showcase{
    height:300px !important;
    min-height:300px !important;
    left:15%;
    z-index:2;
    filter:blur(0px);
    -moz-filter:blur(0px);
    -webkit-filter:blur(0px);
    -o-filter:blur(0px);
} 
}


.jeremy-gif.un-showcase,
.byron-gif.un-showcase{
    left:45%;
    z-index:1;
    filter:blur(2px);
    -moz-filter:blur(2px);
    -webkit-filter:blur(2px);
    -o-filter:blur(2px);
    -moz-transform: scale(0.7); /* IE 9 */
    -ms-transform: scale(0.7);
    -o-transform: scale(0.7);
    -webkit-transform: scale(0.7); /* Safari */
    transform: scale(0.7);
}

@media screen and (max-width:960px){
    
 .behind-gif,
 .gif-rotate-section{
     height:600px;
 }   
 .gif-image {
     width:250px !important;
     min-height:350px !important;
     height:350px !important;
     top:20%;
 }
 .jeremy-gif.showcase, 
 .byron-gif.showcase {
     height:350px !important;
     min-height:350px !important;
 }
   .behind-gif {
    background-size:contain;
} 
}

@media screen and (max-width:767px){
    
 .behind-gif,
 .gif-rotate-section{
     height:600px;
 }   
 .gif-image {
     width:250px !important;
     min-height:300px !important;
     height:300px !important;
     top:25%;
 }
 .jeremy-gif.showcase, 
 .byron-gif.showcase {
     height:300px !important;
     min-height:300px !important;
 }
    .behind-gif {
    background-size:cover;
} 
}
@media screen and (max-width:560px){
   .behind-gif,
 .gif-rotate-section{
     height:350px;
 } 
 .behind-gif {
     background-size:cover;
 }
 .gif-image,
  .jeremy-gif.showcase, 
 .byron-gif.showcase,
  .jeremy-gif.un-showcase, 
 .byron-gif.un-showcase{
    width: 150px !important;
    min-height: 200px !important;
    height: 200px !important;
    top: 25%;

 }
 .jeremy-gif.showcase,
 .byron-gif.showcase{
      -moz-transform: scale(1.2); /* IE 9 */
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    -webkit-transform: scale(1.2); /* Safari */
    transform: scale(1.2);
 }
 .jeremy-gif.un-showcase,
 .byron-gif.un-showcase{
      -moz-transform: scale(0.7); /* IE 9 */
    -ms-transform: scale(0.7);
    -o-transform: scale(0.7);
    -webkit-transform: scale(0.7); /* Safari */
    transform: scale(0.7);
 }
}

/** Hompage Slideshow Section **/
#left-arrow-slider {
    position:absolute;
    top:400px;
    left:10%;
    z-index:99;
    background-image:url('/wp-content/uploads/2018/03/left-arrow-min.png');
    background-repeat:no-repeat;
    background-size:contain;
    background-position:center;
    width:36px;
    height:61px;
    
}
#right-arrow-slider {
    position:absolute;
    
    top:400px;
    right:3%;
    z-index:99;
    background-image:url('/wp-content/uploads/2018/03/right-arrow-min.png');
    background-repeat:no-repeat;
    background-size:contain;
    background-position:center;
    width:54px;
    height:87px;

}
.slideshow-container {
    width:100%;
    height:900px;
    overflow:hidden;
    position:relative;
    padding:100px 0;
    margin:auto; 
}
.mySlides {
    width:100%;
    height:100%;
    overflow:hidden;
    position:absolute;
    margin:auto;
    height:700px;
    min-height:700px;
}

.slider-left {
    width:50%;
    left:80px;
    height:700px;
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    position:relative;
    float:left;
    box-sizing:border-box;
    z-index:2;
}
.slider-one-left {
    background-image:url('/wp-content/uploads/2018/04/building-blocks-slider-image-min-min.jpg');
}
.slider-two-left {
    background-image:url('/wp-content/uploads/2018/04/bananas_slide-min-optimized-min.jpg');
}
.slider-three-left {
    background-image:url('/wp-content/uploads/2018/04/spartan_slide-min-optimized-min.jpg');
}
.slider-right{
    position:relative;
    padding-top:100px;
    padding-left:10%;
    padding-right:40px;
    width:45%;
    height:500px;
    top:100px;
    float:left;
    box-sizing:border-box;
    box-shadow: 0px 0px 10px 1px rgba(180, 180, 180, 0.75);
    -moz-box-shadow: 0px 0px 10px 1px rgba(180, 180, 180, 0.75);
    -webkit-box-shadow: 0px 0px 10px 1px rgba(180, 180, 180, 0.75);
    background-color:#fff;
    z-index:1;
}
.slideOne {
    left:0;
}
.slideTwo {
    left:-100%;
}
.slideThree {
    left:-200%;
}
/** MOBILE SLIDER STYLES **/
@media screen and (max-width:960px){
.mySlides {
    height:800px;
    min-height:800px;
}
.slider-left {
    width:80%;
    left:10%;
    height:400px;
}
.slider-right {
    margin-left:12.5%;
    padding-left:10%;
    width:75%;
    height:370px;
    top:-100px;
}
.behind-slider {
    bottom:480px;
}
    #right-arrow-slider {
        right:8%;
    }
}
@media screen and (max-width:560px){
.mySlides {
    height:800px;
    min-height:800px;
}
.slider-left {
    width:90%;
    left:5%;
    height:400px;
}
.slider-right {
    margin-left:7.5%;
    padding-left:10%;
    padding-right:10px;
    width:85%;
    height:420px;
    top:-100px;
 }
}







/*** LAPTOP SECTION ***/
.laptop {
    position:relative;
    width:100%;
    height:100%;
    background-image:url('/wp-content/uploads/2018/03/laptop-no-bounce-min.png');
    min-height:600px;
    max-height:600px;
    max-width:600px;
    margin:auto;
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
    z-index:2;

}
.service-01 {
    position:relative;
    width:100%;
    height:100%;
    background-image:url('/wp-content/uploads/2018/03/service-section-01-image.png');
    min-height:600px;
    max-height:600px;
    max-width:600px;
    margin:auto;
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
    z-index:2;

}
.service-02 {
    position:relative;
    width:100%;
    height:100%;
    background-image:url('/wp-content/uploads/2018/03/service-section-02-image.png');
    min-height:600px;
    max-height:600px;
    max-width:600px;
    margin:auto;
    background-position:center right;
    background-repeat:no-repeat;
    background-size:contain;
    margin-right:-50px;
    z-index:2;

}
.service-03 {
    position:relative;
    width:100%;
    height:100%;
    background-image:url('/wp-content/uploads/2018/03/service-section-03-image.png');
    min-height:600px;
    max-height:600px;
    max-width:600px;
    margin:auto;
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
    z-index:2;

}



/** BLUEBAR SECTION **/
.blue-bar {
    position: absolute;
    top: 50px;
    width:150px;
    background-color:#8fc8ef;
    left: 110px;
    height: 30px;
    z-index: 0;
}
.darkblue-bar {
    position: absolute;
    top: 50px;
    width:150px;
    background-color:#2160B5;
    left: 110px;
    height: 30px;
    z-index: 0;
}

/** HOMEPAGE BLUEBARS **/
.blue-bar-homepage-banner {top:120px;}
.second-bluebar {top:100px;left:20%;}
.third-bluebar  {right:20%;left:inherit;top:60px;}
.fourth-bluebar {left:35%;top:60px;right:inherit;}
.slideshow-bluebar {top:160px;left:100px;}
/** SERVICES BLUEBARS **/
.service-banner-bluebar {top:20px;left:200px;}
.service-bluebar {top:20px;left:200px; }
.bluebar-center { top: 50px; width: 50%; left:25%;}
.servicebar-two,
.servicebar-four {left:20px;width:250px;}
.servicebar-three {right:20px;left:inherit;width:250px;}
.indiv-service-bluebar {left:0;top:30px;}
.indiv-servicebar-two {left:0; top:60px;}
.indiv-service-bluebar-two {left:0px;top:60px;}
.indiv-service-silo {left:0;top:0;}

/** ABOUT BLUEBARS **/
.about-bluebar {top:330px;left:200px;}
.darkblue-bar {top:100px;left:33%;}
.second-darkblue{top:160px;left:40%;}
.third-darkblue {top:130px;left:33%;}
.fourth-darkblue {top:30px;left:33%;}

.bio-largebluebar {top:170px;left:23%;}
.bio-smallbluebar {top:170px;left:40px;}
.bio-secondsmall {top:70px;left:20px;}
.bio-secondcenter {top:70px;left:30%;}
.bio-secondlarge {top:300px;left:40px;}

.bio-bluebar {top:50px;left:20px;}

.casestudy-bluebar {top:250px;left:50%;}
.sticky-container.sticky .casestudy-bluebar {top:0px;left:0px;}
.casestudy-bluebar-two {top:10px;left:10%;}

.single-blog-bar {top:40px;left:5%;}
@media screen and (max-width:1700px){
    .darkblue-bar {left:30%;}
    .second-darkblue {left:33%;}
}
@media screen and (max-width:1500px){
    .darkblue-bar {left:29%;}
    .second-darkblue {left:28%;}
    .fourth-darkblue {left:39%;}
    .indiv-service-bluebar {left:0;top:30px;}
    .indiv-service-bluebar-two {left:0px;top:60px;}
}
@media screen and (max-width:1440px){
    .second-bluebar {
        left:10%;
    }
    .third-bluebar {
        right:10%;
    }
    .fourth-darkblue {
        left:35%;
    }
    .indiv-service-bluebar {left:0;top:30px;}
    .indiv-service-bluebar-two {left:0px;top:60px;}
}
@media screen and (max-width:1300px){
    .darkblue-bar {left:27%;}
    .second-darkblue {left:25%;}
    .fourth-darkblue {left:33%;}
    .indiv-service-bluebar {left:0;top:30px;}
    .indiv-service-bluebar-two {left:0px;top:60px;}
}
@media screen and (max-width:1100px){
    .darkblue-bar {left:26%;}
    .second-darkblue {left:23%;}
    .fourth-darkblue {left:30%;}
    .indiv-service-bluebar {left:0;top:30px;}
    .indiv-service-bluebar-two {left:0px;top:60px;}
}
@media screen and (max-width:1100px){
    .darkblue-bar {left:25%;}
    .second-darkblue {left:22%;}
    .fourth-darkblue {left:30%;}
    .indiv-service-bluebar {left:0;top:30px;}
    .indiv-service-bluebar-two {left:0px;top:60px;}
}
@media screen and (max-width:1024px){
    .service-banner-bluebar {top:220px;left:100px;}
    .darkblue-bar {left:22%;top:100px;}
    .second-darkblue {left:20%;}
    .fourth-darkblue {left:30%;}
    .indiv-service-bluebar {left:0;top:30px;}
    .indiv-service-bluebar-two {left:0px;top:60px;}
    .indiv-servicebar-two {left:0px; top:30px;}
}
@media screen and (max-width:1024px){
    .bluebar-center {top:70px;}
    .second-darkblue {left:18%;top:150px;}
    .third-darkblue {top:130px;}
    .fourth-darkblue {left:33%;top:20px;}
    .indiv-service-bluebar {left:0;top:20px;}
    .indiv-service-bluebar-two {left:0px;top:50px;}
}
@media screen and (max-width:960px){
     .service-banner-bluebar {
        top: 370px;
        left: 20px;
     }
}
@media screen and (max-width:768px){
        .service-banner-bluebar {
        top: 20px;
        left: 20px;
     } 
}
@media screen and (max-width:767px){

    .blue-bar {
        left:20px;
        top:30px;
        width:150px;
    }
    .service-banner-bluebar {
        top: 10px;
        left: 20px;
     }
    .second-bluebar {
        top:80px;
    }
    .third-bluebar {
    left: inherit;
    top: 45px;
    right: 20px;
    }
    .fourth-bluebar {
        left:38%;
        top:50px;
        right:inherit;
    }
    .service-bluebar {
        top:10px;
    }
    .bluebar-center{ 
        top: 50px; 
        width: 50%; 
        left:25%;
    }
    .indiv-servicebar-two{
        top: 40px; 
        width: 150px; 
        left:5px;        
    }
    .servicebar-three {
        right:20px;
        left:inherit;
    }
    .darkblue-bar {
        left:20%;
        top:90px;
    }
    .bio-bluebar {
        top:20px;
        left:20px;
    }
    .bio-largebluebar,
    .bio-smallbluebar
    {
        top:70px;
        left:20%;
    }
    .bio-secondsmall,
    .bio-secondcenter,
    .bio-secondlarge {
        top:80px;
        left:20%;
    }
    .second-darkblue {
        left:20%;
        top:150px;
    }
    .third-darkblue {top:120px;}
    .fourth-darkblue {left:33%;top:20px;}
    .indiv-service-bluebar {left:0;top:20px;}
    .indiv-service-bluebar-two {left:0px;top:50px;}
    
    .casestudy-bluebar {top:450px;left:20px;}
    .casestudy-bluebar-two {top:40px;left:20px;}
    
}
@media screen and (max-width:560px){
        .fourth-bluebar {
        left:30%;
        top:50px;
        right:inherit;
    }
    .darkblue-bar {
        left:10%;
        top:90px;
    }

    .second-darkblue {
        left:15%;
        top:150px;
    }
    .third-darkblue {top:120px;}
    .fourth-darkblue {left:20%;top:20px;}
    .indiv-service-bluebar {left:0;top:20px;}
    .indiv-service-bluebar-two {left:0px;top:50px;}
    .casestudy-bluebar-two {top:40px;left:20px;}
}
.blue-bar.filled {
    animation: fill 1.2s ease-in-out infinite;
    -webkit-animation: fill 1.2s ease-in-out infinite;
    -moz-animation: fill 1.2s  ease-in-out infinite;
    animation-iteration-count: 1;
}
.darkblue-bar.darkfilled {
    animation: darkfill 1.2s ease-in-out infinite;
    -webkit-animation: darkfill 1.2s ease-in-out infinite;
    -moz-animation: darkfill 1.2s  ease-in-out infinite;
    animation-iteration-count: 1;
    
}
/*** TEAM MEMBER GIF SECTION **/
.team-section {
    width: 100%;
    height: 100%;
    padding: 150px 20px;
}
.team-section .half-left,
.team-section .half-right {
    width:50%;
    height:100%;
    position:relative;
    float:left;
}
.team-section .half-left h2 {
    text-align:right;
}
p.rtl {
    text-align:right;
}


a.right {
    float:right;
}

.gif-one,.gif-two {
    width: 100%;
    height: 600px;
    max-width: 250px;
    max-height: 380px;
    top: 20%;
    position: absolute;
    background-size: cover;
    margin: auto;
    background-repeat: no-repeat;
    background-position: center;
}

.gif-slider {
	width:540px;
	margin:40px auto;
	overflow:auto;
}



/** CLEAR FLOATS **/
.banner-right::after,.banner-left::after,
.homepage-banner-image::after,.banner-content::after,.phone-section-home .half-left .video::after,
.phone-section-home::after,
.phone-section-home .half-left::after, .phone-section-home .half-right::after,
.team-section .half-left::after, .team-section .half-right::after,.team-section::after
{
    content: "";
    clear: both;
    display: table;
}

    
/*** HOMEPAGE MOBILE EDITS **/
@media screen and (max-width:2560px){ 
    .homepage-banner-image {
        height:750px;
    }
    .banner-left {
        width:40%;
        padding-left:100px;
    }
    .phone-section-home .half-right,
    .team-section .half-left{    
    padding: 40px 10%;
    position: relative;
    }
        
}
@media screen and (max-width:1700px){ 
    .homepage-banner-image {
        height:710px;
    }
    .banner-left {
        width:50%;
    }
}
@media screen and (max-width:1440px){
    .homepage-banner-image {
        height:610px;
        background-size:cover;
    }
    .phone-section-home .half-right,
    .team-section .half-left{    
    padding: 40px 5%;
    position: relative;
    }
    .gif-left-row {
        padding:0 5%;
    }
    
}
@media screen and (max-width:1340px){
    .banner-left {
        width:50%;
        position:relative;
    }
    .banner-right {
        display:inline-block;
        width:50%;
        height:100%;
        top:60px;
    }
    .laptop-image {
        width:100%;
        height:550px;
        margin-top:0;
        top:0px;
        float:right;
        background-size: contain;
        background-position: center right;
    }
}
@media screen and (max-width:1200px){
    .laptop-image {
        top:50px;
    }
}
@media screen and (max-width:980px){
    .banner-left{
        width:90%;
    }
    .banner-right {
        width:100%;
        display:block;
        top:0px;
    }
    .laptop-image {
        top:-150px;
        background-position:center;
    }
    .homepage-banner-image {
        margin-bottom:150px;
    }
    .phone-section-home{
        top:-100px;
        margin-top:0px;
    }
}
@media screen and (max-width:767px){
    .homepage-banner-image {
        height:600px;
        overflow:visible !important;
        background-size:cover;
        background-position:center;
        margin-bottom:50px;
    }
    .banner-left,.banner-right {
        width:100%;
        height:100%;
        position:relative;
        top:0px;
    }
    .banner-left {
        padding:20px;
        top:30px;
    }
    .banner-right{
        top:-180px;
    }
    
    h1 {
        font-size:30px;
    }
    .smaller {
        font-size:24px;
    } 
    .laptop-image {
        height:400px;
        width:100%;
        margin-top:0px;
        top:-30px;
        z-index:99;
        background-position:center;
    }
    .phone-section-home {
        top:-200px;
    }
    .phone-section-home .half-left,
    .phone-section-home .half-right,
    .team-section .half-left, 
    .team-section .half-right{
        width:100%;
        height:100%;
        padding:40px 20px;
        margin:auto;
    }
    
}
@media screen and (max-width:600px){
    .phone-image {
        width:auto;
        height:auto;
        max-width:300px;
        max-height:460px;
    }
    img#vid {
    width: 70%;
    left: 53px;
    top: -3px;
    height: auto;
    }
}
@media screen and (max-width:560px){
    .laptop-image {
        height:350px;
        width:100%;
        margin-top:120px;
    }
    .behind-phone {
        height:450px;
    }
    p {
        font-size:18px;
    }
    .phone-section-home {
        top:-330px;
        padding:20px 20px;
    }
}
@media screen and (max-width:425px){
    .laptop-image {
        height:300px;
        width:100%;
    }
    .video {
        top:55px !important;
    }
}
@media screen and (max-width:375px) {
        .laptop-image {
        height:250px;
        width:100%;
        z-index:99;
    }
    
    .video {
        top:48px !important;
    }
    img#vid {
    width: 56%;
    left: 69px;
    /* top: -3px; */
    height: auto;
    }
    .behind-phone {
        height:370px;
    }

}
@media screen and (max-width:370px){
    img#vid {
        left:62px;
    }
}
@media screen and (max-width:350px){
    .video {
        top:48px !important;
    }
    #imgvid {
        width:59%;
        left:57px;
    }
}
@media screen and (max-width:340px){
    img#vid {
        width:64%;
        left:44px;
    }
    .video {
    top: 48px !important;
}
}
@media screen and (max-width:320px){
    img#vid {
    width: 66%;
    left: 42px;
    /* top: -3px; */
    height: auto;
    }
    .phone-image {
        top:0px !important;
    }
    .video {
        top:48px !important;
    }
}
/** PORTFOLIO SECTION **/
.portfolio-circle-section {
    width: 50%;
    height: 300px;
    min-height: 300px;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 0;
}
.fade-fast {
  -webkit-animation-name: fade;
  -moz-animation-name:fade;
  -webkit-animation-duration: 0.3s;
  -moz-animation-duration: 0.3s;
  animation-name: fade;
  animation-duration: 0.3s;
}
@media screen and (max-width:768px){

.behind-portfolios{
   right:-50px;
   bottom: 0px;
   height:300px;
   background-size:cover;
  }
  .portfolio-circle-section {
      width:250px;
  }
}


/** INDIVIDUAL SILO SERVICE **/
.indiv-silo-row {
padding:0 10%;
width:100%;
height:100%;
position:relative;
overflow:visible !important;
}
.service-icon {
    position:relative;
    top:-180px;
    left:150px;
    z-index:0;
    max-width:400px !important;
}
.indiv-service-left {
    width:50%;
    position:relative;
    height:100%;
}
.indiv-left-section h1,
.indiv-left-section p {
    z-index:1;
    position:relative;
}
.social-icon-col {
    width:40%;
    position:relative;
    height:100%;
    margin-left:10%;
}
.testimonial-col {
    width:55%;
    position:relative;
    height:100%;
    margin-left:10%;
    padding-right:10%;
    padding-top:50px;
}
.testimonial-col p {
    line-height: 1.8em;
    font-size:24px;
}
.testimonial-image-col {
    width:25%;
    position:relative;
    height:100%;
    margin-left:10%;
}
.quotes {
    z-index:1;
    position:relative;
    left:0px;
    top:0;
}
.web-dev-laptop-section {
 max-height:700px;
}

@media screen and (max-width:1440px){
    .indiv-service-left{ 
    width:60%;
    padding-right:50px;
    }
    .social-icon-col {
        width:30%;
    }
    .social-icon-col .service-icon {
        left:20px;
    }
}
@media screen and (max-width:1240px){
    .indiv-service-left{ 
    width:100%;
    z-index:1;
    padding-bottom:100px;
    }
    .social-icon-col {
        width:100%;
        margin-left:0;
    }
    .social-icon-col .service-icon {
        display:none;
        
    }
}
@media screen and (max-width:1024px){
    .testimonial-col {
    width:100%;
    position:relative;
    height:100%;
    margin: 0 auto;
    padding:0 5%;
    padding-top:50px;
}
.testimonial-image-col {
    width:100%;
    position:relative;
    height:100%;
    margin: 0 auto;
    padding:0 5%;
}

}
@media screen and (max-width:767px){
    .indiv-service-left {
        padding-right:0px;
        padding-bottom:50px;
    }
        .social-icon-col .service-icon {
        left:30%;
        top:-400px;
        opacity:0.4;
        position:absolute;
        
    }
    .web-dev-laptop-section {
        padding:20px 5%;
       
    }
}
@media screen and (max-width:560px){
        .indiv-silo-row {
            width:100%;
            padding:20px 20px;
        }

        .social-icon-col {
        margin:0 auto;
        text-align:center;
        padding-top:40px;
        }
        
        .testimonial-col {
        width:100%;
        position:relative;
        height:100%;
        margin: 0 auto;
        padding:0 20px;
        padding-top:50px;
        }
        .testimonial-image-col {
        width:100%;
        position:relative;
        height:100%;
        margin: 0 auto;
        padding:0 20px;
        }
}


/********** 06 Slider/Hero Image **********/

/********** 07 Essential Grid **********/

/********** 08 Gravity Forms **********/
.alt-form{
    color: #777;
    padding: 6px 12px;
    display: inline-block;
    font-size: 32px !important;
    transition: .15s linear border;
    -webkit-appearance: none;
    border: none;
    background: transparent;
    line-height: 1.0;
    border-bottom: 2px solid #4da8df;
    font-style: italic;
}

.main-form{

}
/********** 09 Sidebar **********/
.sidebar-box .widget-title{
  font-size:18px;
  color:#01426b;
  font-weight:bold;
  font-family:"Gibson", serif;
}
.sidebar-box {
  margin: 10px 0px
}
.social-media-widget-area {
    clear:both;background-color:#8fc8ef;padding:20px;display:inline-block;width:100%;height:100%;
}
.social-media-widget-area h6,
.digital-marketing-widget-area h6
{
    text-align:center;float:left; width:50%;position:relative;display:inline-block;margin-top:20px;
}
.digital-marketing-widget-area h6 {
    color:#fff;
}
.digital-marketing-widget-area {
    clear:both;background-color:#2160b5;padding:20px;display:inline-block;width:100%;height:100%;
}
.image-wrap{
    float:left; width:50%;position:relative;display:inline-block;text-align:center;
}

@media screen and (max-width:1366px){
    .social-media-widget-area h6,
.digital-marketing-widget-area h6,
.image-wrap {
    width:100%;
    float:none;
    display:block;
}
}
.sidebar-box .widget-title {
    font-weight:900;
    margin:30px 0 10px;
    font-family: "Poppins", sans-serif;
    text-transform: none;
    font-size: 20px;
}
/** sidebar form **/
div#gform_wrapper_3 {
    background-color:#f7f7f7 !important;
    padding:20px;
}
li#field_3_1,
li#field_3_2 {
    padding-right: 0px !important;
    margin-top:0px !important;
}
#gform_wrapper_3 li.hidden_label input {
    margin-top:5px;
}
input#input_3_1,
input#input_3_2
{
    width:100%;
    text-align:center;
    background-color:#fff;
    
}
input#gform_submit_button_1 {
    width:100%;
    text-align:center;
    border-radius:17px !important;
    background-color:#2160b5;
    text-transform:capitalize;
}
input#gform_submit_button_3 {
    width:100%;
    text-align:center;
    border-radius:17px !important;
    background-color:#8fc8ef;
    text-transform:capitalize;
}
input#gform_submit_button_3:hover {
    border:none !important;
    
}

@media screen and (max-width:1024px){
    .image-wrap,
    .social-media-widget-area h6,
    .digital-marketing-widget-area h6 {
        width:100%;
        float:none;
        clear:both;
        text-align:center;
        margin:10px auto;
    }
    
}
/********** 10 Blog **********/
.blog-swoop {
    height:250px;
    position:relative;
}
@media screen and (min-width:1500px){
    .blog-swoop {
        height:400px;
    }
}
#blog-archive {
    padding:40px 5%;
}


/** filter settings **/
ul.vcex-blog-filter.vcex-filter-links.clr,
ul.page-numbers {
    margin: 20px auto;
    width: 100%;
    text-align: center;
    position: relative;
    justify-content: center;
    display: flex;
}
@media screen and (max-width:767px){
    ul.vcex-blog-filter.vcex-filter-links.clr,
    ul.page-numbers {
        display:block;
    }
    #blog-archive {
        margin-top:-200px;
    }
}

.active>.theme-button.minimal-border,
.page-numbers.current {
    background-color:#2160b5 !important;
    color:#fff !important;
}
.theme-button.minimal-border:hover,
ul.page-numbers li:hover {
    background-color:#8fc8ef !important;
     color:#fff !important;
}
a.page-numbers:hover {
    color:#fff !important;
}

/** archive blog button **/
.vcex-blog-entry-readmore-wrap.entry-readmore-wrap.clr a {
   border-radius: 17px;
   text-transform: capitalize;
}
.vcex-blog-entry-media.entry-media {
    text-align:center;
    margin:auto;
}
.vcex-blog-entry-details.entry-details {
   text-align: center;
}
/****** blog single page **************/

.blog-featured {
    padding:40px 0;
}

.single-post .entry {
    margin-bottom: 40px;
    padding: 0 5%;
}

.single-post .page-header {
    display:none;
}
.single-post .content-area {
    width: 100%;
    padding: 20px 2.5%;
}
.has-sidebar .content-area {
    width:100%;
    max-width:70% !important;
}
.single-post aside#sidebar {
    width: 100%;
    max-width: 30%;
    padding: 20px 2.5%;
}
.post-pagination .post-next{
margin-right:2%;
}
.post-pagination .post-prev {
margin-left:2%;
}

@media screen and (max-width:960px){


.single-post .content-area {
    width:100%;
    max-width: 100%;
    padding:20px;
}
.has-sidebar .content-area { 
    max-width:100% !important;
}
.single-post aside#sidebar {
    width:100%;
    max-width: 60%;
    padding:20px;
    margin-top:0px;
    float:left;
} 
.single-post div#sidebar-inner {
    margin-top:0px;
}

}
@media screen and (max-width:767px){
   .single-post aside#sidebar {
    width:100%;
    max-width: 100%;
    padding:20px;
    margin-top:0px;
    
}  
}



/**** ABOUT PAGE STYLES ************/
.about-page-container {
    background-color:#1D1D1D;
}
.about-page-content {
    background-color:#1D1D1D;
    height:100%;
    width:100%;
}
.about-page-content-top {
    background-color:#1D1D1D;
    width:100%;
    height:100%;
    padding:0 0 20px 0;
}
.about-section {
    width:100%;
    height:100%;
    padding:40px 10%;
    margin:auto;
    position:relative;
}
.about-grid {
    position:relative;
    width:100%;
    height:100%;
    max-width:1200px;
    padding:20px;
    box-sizing:border-box;
    margin:auto;
    overflow:hidden;
}
.about-grid-two {
    position:relative;
    width:100%;
    height:100%;
    max-width:1200px;
    padding:20px;
    box-sizing:border-box;
    margin:auto;
    overflow:hidden;
}
.about-grid-two .grid-left,
.about-grid-two .grid-middle,
.about-grid-two .grid-right {
    width:33%;
    float:left;
}
.bio {
    visibility:hidden;
    background-color:rgba(66,120,191,0.95);
    width:100%;
    height:100%;
    padding:20px;
    min-height:540px;
    max-height:540px;
    margin:auto;
    padding-top:110px;
    position:relative;
}

.about-grid-two .bio {
    visibility:hidden;
    background-color:rgba(66,120,191,0.95);
    width:100%;
    height:100%;
    padding:20px;
    min-height:450px;
    max-height:450px;
    margin:auto;
    padding-top:20px;
}
.bio p {
    line-height:1.15em;
}
/* .about-grid-two #gary-grid .bio {
    visibility:hidden;
    background-color:rgba(66,120,191,0.95);
    width:100%;
    height:100%;
    padding:20px;
    min-height:905px;
    max-height:905px;
    margin:auto;
    padding-top:250px;
} */

.top-row,
.bottom-row {
    width:100%;
    height:100%;
    max-height:1200px;
    min-height:540px;
    margin:2.5px 2.5px;
}
.top-row-two {
    width:100%;
    height:100%;
    max-height:1200px;
    min-height:450px;
    margin:2.5px 2.5px;
}
/********* FIRST GRID ***/
#byron-grid {
    float:left;
    width:calc(65% - 5px);
    margin-right:5px;
    min-height:540px;
    max-height:540px;
    background-image: url('/wp-content/uploads/2018/04/GRAPH_4_fixed.gif');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    box-sizing:border-box;
    position:relative;
}
#karin-grid {
    float:left;
    width:calc(65% - 5px);
    margin-left:5px;
    min-height:540px;
    max-height:540px;
    background-image: url('/wp-content/uploads/2018/04/GRAPH_1_fixed.gif');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    box-sizing:border-box;
    position:relative;
    
}

#jeremy-grid{
    float:left;
    width:calc(35% - 5px);
    min-height:540px;
    max-height:540px;
    background-image: url('/wp-content/uploads/2018/04/GRAPHVID_7_fixed.gif');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    box-sizing:border-box;
    margin-left:5px;
    position:relative;
}
#chaeli-grid{
    float:left;
    width:calc(35% - 5px);
    min-height:540px;
    max-height:540px;
    background-image: url('/wp-content/uploads/2018/04/GRAPHVID_9_fixed.gif');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    box-sizing:border-box;
    margin-right:5px;
    position:relative;
}

/** SECOND GRID **/
#gina-grid {
    float:left;
    width:calc(100% - 5px);
    margin-right:5px;
    min-height:450px;
    max-height:450px;
    background-image: url('/wp-content/uploads/2018/04/GRAPHVID_8_fixed.gif');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    box-sizing:border-box;
    margin-right:5px;
    margin-bottom:5px;
    position:relative;
}
#zack-grid {
    float:left;
    width:calc(100% - 5px);
    min-height:450px;
    max-height:450px;
    background-image: url('/wp-content/uploads/2018/04/GRAPH_3_fixed.gif');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    box-sizing:border-box;
    margin-right:5px;
    position:relative;
    
}

#alex-grid{
    float:left;
    width:calc(100% - 5px);
    min-height:450px;
    max-height:450px;
    background-image: url('/wp-content/uploads/2018/04/GRAPHVID_6_fixed.gif');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    box-sizing:border-box;
    margin-left:5px;
    margin-bottom:5px;
    position:relative;
}
#sinan-grid{
    float:left;
    width:calc(100% - 5px);
    min-height:450px;
    max-height:450px;
    background-image: url('/wp-content/uploads/2018/04/GRAPH_5_fixed.gif');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    box-sizing:border-box;
    margin-left:5px;
    position:relative;
}
#gary-grid{
    /* float:left;
    width:calc(100%);
    min-height:905px;
    max-height:905px;
    background-image: url('/wp-content/uploads/2018/04/GRAPH_2_fixed.gif');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    box-sizing:border-box;
    position:relative; */
    float:left;
    width:calc(35% - 5px);
    min-height:540px;
    max-height:540px;
    background-image: url('/wp-content/uploads/2018/04/GRAPH_2_fixed.gif');
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    box-sizing:border-box;
    margin-right:5px;
    position:relative;

}


#karin-grid,
#chaeli-grid {
    margin-top:5px;
}
#byron-grid:hover .bio,
#jeremy-grid:hover .bio,
#karin-grid:hover .bio,
#chaeli-grid:hover .bio,
#gina-grid:hover .bio,
#zack-grid:hover .bio,
#gary-grid:hover .bio,
#alex-grid:hover .bio,
#sinan-grid:hover .bio {
    visibility:visible !important;
    cursor:pointer;
}


/** Fearless Brands Section **/

.fearless-brands,
.brand-container{
    width:100%;
    height:100%;
    overflow:auto;
    position:relative;
    padding:80px 0;
    margin:auto;
}
.fearless-heading{
    padding:80px 0;
    height:100%;
    position: relative;
}
.fearless-brands .right {
    text-align:right;
}
.brand-outreach,.brand-design {
    width:45%;
    height:auto;
    margin:20px 1.25%;
    position:relative;
    float:left;
    padding:60px 5%;
    top:0;
    display:inline-block;
}


.brand-outreach {
    background-color:#2160B5;
    margin-right:10%;
    right:0;
    position: absolute;
    height: fit-content;
    margin-top: 384px;
    z-index:3;
    left:25%;
    filter:blur(0px);
    -moz-filter:blur(0px);
    -o-filter:blur(0px);
    -webkit-filter:blur(0px);

}
.brand-design {
     background-color:#8FC8EF;
     left:0;
     z-index:0;
    filter:blur(2px);
    -moz-filter:blur(2px);
    -o-filter:blur(2px);
    -webkit-filter:blur(2px);
}
/** DESKTOP STYLES **/
.brand-outreach.feature,
.brand-design.feature{
 left:25%;
 filter:blur(0px);
 -moz-filter:blur(0px);
 -webkit-filter: blur(0px);
 -o-filter:blur(0px);
 z-index:2;
}
.brand-outreach.un-feature,
.brand-design.un-feature{
 left:0%;
 filter:blur(2px);
 -moz-filter:blur(2px);
 -webkit-filter: blur(2px);
 -o-filter:blur(2px);
 z-index:0;
     -moz-transform: scale(0.7); /* IE 9 */
    -ms-transform: scale(0.7);
    -o-transform: scale(0.7);
    -webkit-transform: scale(0.7); /* Safari */
    transform: scale(0.7);
}
/** MOBILE STYLES **/

.brand-design.mobile-feature{
 left:0;
 filter:blur(0px);
 -moz-filter:blur(0px);
 -webkit-filter: blur(0px);
 -o-filter:blur(0px);
 top:0px;
 z-index:2;
}
.brand-design.mobile-un-feature{
 left:0;
 filter:blur(2px);
 -moz-filter:blur(2px);
 -webkit-filter: blur(2px);
 -o-filter:blur(2px);
 z-index:0;
 top:20px;
}
.brand-outreach.mobile-feature {
 left:0;
 filter:blur(0px);
 -moz-filter:blur(0px);
 -webkit-filter: blur(0px);
 -o-filter:blur(0px);
 top:-700px;
 z-index:2;    
}
.brand-outreach.mobile-un-feature{
 left:0;
 filter:blur(2px);
 -moz-filter:blur(2px);
 -webkit-filter: blur(2px);
 -o-filter:blur(2px);
 z-index:0;
 top:-680px;
}

@media screen and (min-width:1240px){
.brand-outreach,
.brand-design,
.brand-outreach.feature,
.brand-design.feature,
.brand-outreach.un-feature,
.brand-design.un-feature {
  margin-left:15%;
   }
}
@media screen and (max-width:767px){
    .brand-outreach.feature,
    .brand-design.feature {
    margin-left:0%;
   }
   .brand-outreach,
   .brand-design,
      .brand-outreach.feature.mobile,
   .brand-design.feature.mobile,
   .brand-outreach.un-feature.mobile,
   .brand-design.un-feature.mobile {
    left:0%;
}
}
.brand-circle-container {
  width:50%;
  height:100%;
  left:0px;
  position:absolute;
}
.brand-outreach:hover > .brand-design {
-webkit-filter: blur(4px);
-moz-filter: blur(4px);
-ms-filter: blur(4px);
-o-filter: blur(4px);
filter: blur(4px);
z-index:0;
}
.brand-design:hover .brand-outreach {
-webkit-filter: blur(4px);
-moz-filter: blur(4px);
-ms-filter: blur(4px);
-o-filter: blur(4px);
filter: blur(4px);
z-index:0;
}

.boost-location:before {
    content: "";
    width : 100%;
    height: 100%;
    -moz-filter: blur(1px);
    -ms-filter: blur(1px);
    -o-filter: blur(1px);
    filter: blur(1px);
}
    .find-us a.white {
        margin-left:80px;
    }
@media screen and (max-width:1224px){
  .brand-outreach,.brand-design { 
   width:65%;   
  }
}

@media screen and (max-width:767px){
#byron-grid,
#jeremy-grid,
#karin-grid,
#gary-grid,
#gina-grid,
#zack-grid,
#gary-grid,
#alex-grid,
#sinan-grid {
    width:100%;
    height:100%;
    max-height:540px;
    min-height:540px;
    float:none;
    display:block;
    margin:10px auto;
    margin-left:0px;
    margin-right:0px;
}
.top-row,
.bottom-row,
.top-row-two,
.about-grid-two .grid-left, .about-grid-two .grid-middle, .about-grid-two .grid-right{
    width:100%;
    height:100%;
    margin:0 auto;
    float:none;
    overflow:hidden;
    clear:both;
}
.about-grid-two .bio,
/* .about-grid-two #gary-grid .bio{
    min-height:540px;
    max-height:540px;
    padding-top:40px;
} */
.bio {
    padding-top:20px;
}
.bio p,
.brand-design p,
.brand-outreach p {
    font-size:20px;
    line-height:1.1em;
    margin-bottom:10px;
}
.brand-outreach,
.brand-design {
    float:none;
    margin:10px auto;
    width:100%;
    height:100%;
    display:block;
}
.brand-outreach, .brand-design {
    width:75%;
    position:relative;
}
   .brand-outreach,
   .brand-outreach.mobile-feature{
       margin-top:20px;
       top:0px;
       top:-700px;
       width:75%;
   } 
       .find-us a.white {
        margin-left:20px;
    }
}
@media screen and (max-width:560px){
    .brand-outreach {
        top:-800px;
    }
    .brand-outreach,
    .brand-design,
    .brand-outreach.mobile-feature,
    .brand-design.mobile-feature,
    .brand-outreach.mobile-un-feature,
    .brand-design.mobile-un-feature{
        width:95%;
    }
    .brand-outreach, .brand-outreach.mobile-feature{
        top:-850px;
    }
}

.icon-before {
    width:fit-content;
    margin:20px auto;
}
.icon-before:before {
    
    content: "";
    display:inline-block;
    background-image: url("/wp-content/uploads/2018/02/arrow-down-left.png");
    background-repeat:no-repeat;
    background-size:contain;
    right:10px;
    top:10px;
    width:32px;
    height:32px;
    position:relative;
    
}

.find-us {
    position:relative;
    width:100%;
    height:100%;
    margin:auto;
}

.find-us h3 {
    margin-bottom:80px;
}

.location-links {
position: relative;
bottom: 6px;
margin-right: 80px;
margin-left:10px;
}
.far-left {
    position:absolute;
    left:-20px;
    z-index:-1;
}
.boost-location {
    background-image: url('/wp-content/uploads/2018/03/boost-location-image-optimized-min.jpg');
    width:100%;
    height:100%;
    min-height:600px;
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center center;
    padding-top:200px;
    padding-left:80px;
}
@media screen and (max-width:767px){
    .find-us {
    margin-top: -750px;

    }
    .find-us a.white {
        margin:30px auto;
    }
    .find-us a.white:last-child {
        margin-left:20px;
    }
    .location-links {
        margin-right:0px;
    }
    .boost-location {
        padding-left:20px;
    }
}
.boost-location h3,
.boost-location p {
    font-family: 'Fugaz One', cursive;
    text-shadow: 2px 1px 6px #000;
}


.services-banner-image {
    background-image:url('/wp-content/uploads/2018/04/about-bannr-optimized.png');
    background-size:cover;
    background-repeat:no-repeat;
    background-position: center center;
    width:100%;
    height:100%;
    min-height:900px;
    margin-bottom:100px;
    
}

.services-banner-left {
    width:50%;
    margin-top:200px;
    padding-left:200px;
}
.services-banner-right{
    width:100%;
    float:left;
    position:relative;
    top:-240px;
}


/** SUCCESS STORIES SECTION **/
.success-headline{
    font-size:38px;
    line-height:42px;
    font-weight:900;
}
.success-subheadline {
    letter-spacing:3px;
    position:relative;
    top:20px;
    font-weight:900;
}
.small-text {
    font-size:14px;
    font-weight:900;
}

.blue-section-left .success-headline {
    font-size:45px;
    line-height:48px;
}
@media screen and (max-width:1400px){
    .success-headline{
    font-size:38px;
    line-height:42px;
    }
}
@media screen and (max-width:1200px){
    .success-headline{
    font-size:35px;
    line-height:40px;
    }
}
@media screen and (max-width:767px){
    .success-headline{
    font-size:30px;
    line-height:35px;
    }
}
.shadow{
box-shadow: 5px 5px 13px -2px #777777;
-webkit-box-shadow: 5px 5px 13px -2px #777777;
-moz-box-shadow: 5px 5px 13px -2px #777777;
-o-box-shadow: 5px 5px 13px -2px #777777;
}

.services-blue-section{
    width: 100%;
    height: 500px;
    border-radius: 100px;
    margin: 40px auto;
    padding:160px 80px 20px 80px;
    position: relative;
    top: 20px;
    background-image: linear-gradient(to right bottom, #8fc8ef, #6eaee2, #5094d4, #367ac6, #2160b5);
}
.services-blue-section p {
    font-weight:400;
}

.blue-section-left {
    width:40%;
    display:inline-block;
    position:absolute;
    margin-left:10%;
    margin-right:10%;
    left:0;
}
.blue-section-right {
    width:30%;
    position:absolute;
    display:inline-block;
    left:60%;
}
.blue-section-one-third {
    width:50%;
    position:relative;
    text-align:left;
    float:left;
    
}
.blue-section-one-third.last {
    width:100%;
    position:relative;
    text-align:left;
    float:left;
    padding:0 20px;
}
@media screen and (max-width:1024px){
    .services-blue-section {
    width: 100%;
    height: 550px;
    border-radius: 45px;
    margin: 40px auto;
    padding:175px 80px 20px 80px;
    margin-top: 0;
    margin-bottom: 80px;
    position: relative;
    top:60px;
}
    
    .blue-section-left {
    width: 100%;
    display: block;
    position: absolute;
    left: 0;
    margin-left:0px;
    margin-top:100px;
    top: 40px;
    }
    .blue-section-right{
    width: 100%;
    position: absolute;
    display: inline-block;
    padding-top: 20px;
    bottom: 40px;
    left: 0;
    }
    .blue-section-one-third {
    width: 50%;
    position: relative;
    text-align: center;
    margin:0;
    float: left;
    }
    .blue-section-one-third.last {
    width: 100%;
    position: relative;
    text-align: center;
    float:none;
    }
    
    
    
}/**end media query **/
@media screen and (max-width:767px){
     .services-blue-section {
        width: 90%;
     }
}
@media screen and (max-width:500px){
    .services-blue-section {
     height:650px; 
     margin-top:70px;
     top:20px;
    }
    .blue-section-one-third {
    width: 100%;
    position: relative;
    text-align: center;
    margin:0;
    float: left;
    }
    .blue-section-right{
        padding:0 10px;
    }
    .blue-section-left {
        margin-right:0;
        margin-top:40px;
    }
    .success-headline {
        font-size:28px;
        line-height:30px;
    }
}
@media screen and (max-width:425px){
    .blue-section-left {
        margin-top:0px;
    }
}


@media screen and (max-width:1400px){
    .coffee-image {
        top:250px;
    }
}
@media screen and (max-width:1350px){
    .services-banner-left {
        width:70%;
    }
}
@media screen and (max-width:1100px){
.services-banner-left,
.services-banner-right {
    width:100%;
    position:relative;
    padding-left: 80px !important;
    padding-right:80px !important;
    padding-top: 100px !important;
    margin-top:0px !important;
    float:none;
}
.services-banner-right {
    top:-200px;
    padding-right:0px !important;
}
.about-bluebar{
    top: 130px;
    left: 80px;
   }
} /** end 1100 media query **/
@media screen and (max-width:767px){
.services-banner-left,
.services-banner-right {
    width:100%;
    position:relative;
    padding-left: 20px !important;
    padding-right:20px !important;
    padding-top: 100px !important;
}
.about-bluebar {
    left: 20px;
    top: 115px;
}
.services-banner-right {
    padding-right:0px !important;
    top:-150px !important;
    padding-top:0px !important;
    
}
.boost-location {
    min-height:400px;
    padding-top:100px;
}
.services-banner-image {
    margin-bottom:40px !important;
}

} /** end 767 media query **/



/************* END OF ABOUT PAGE STYLES *********/
/************* SERVICES PAGE STYLES *************/
.services-banner-section {
    width:100%;
    height:100%;
    position:relative;
    overflow:visible !important;
    min-height:1000px;
}

.left-service-banner {
    width:60%;
    max-width:1200px;
    position:relative;
    margin-top:300px;
    padding-left:200px;
}
.right-service-banner {
    width:40%;
    
    position:relative;
    padding-right:100px;
}

@media screen and (max-width:1024px) {
    
    .left-service-banner {
        width:100%;
        padding:200px 10% 20px 10%;
        margin:0 auto;
    }

    .right-service-banner {
     width:100%;
         
    }
    .laptop-pop-image {
     width:100%;
     top:50px;
     height:525px;
    }

}
@media screen and (max-width:960px) {
    .left-service-banner {
        width:100%;
        padding:350px 20px 0 20px;
    }
    .right-service-banner {
        width:100%;
        padding-right:0px;
    }
    .laptop-pop-image {
     width:80%;
     background-position:center center;
     margin:0 auto;
     top:100px;
    }
}
@media screen and (max-width:768px){
    .left-service-banner {
        padding:0px 20px;
        margin-top:200px;
    }
}

/** END OF BANNER SECTION **/
/** 3 col Section **/
.three-col-service {
    width:100%;
    padding:100px 20px;
}
.service-col {
 width:33%;
 padding:0 20px;
}
/** SERVICE SECTIONS ANIMATED **/
.service-section-animated{
    width:100%;
    position:relative;
    padding:50px 20px;
}
.service-half {
    width:50%;
    padding:0 20px;
}
.padding-left {
    padding-left:10% !important;
}
.padding-right{
    padding-right:10% !important;
}
.about-banner-left-padding{
    padding-right:5%;
}
@media screen and (max-width:1500px){
    .about-banner-left-padding {
        padding-right:20px;
        width:70%;
    }
    .coffee-image {
        height:500px;
    }
}
@media screen and (max-width: 1440px){
    .padding-left {
        padding-left:5% !important;
    }
    .padding-right {
        padding-right:5% !important;
    }
}
@media screen and (max-width:1300px){
        .padding-left {
        padding-left:2.5% !important;
    }
    .padding-right {
        padding-right:2.5% !important;
    }
    .about-banner-left-padding {
        width:80%;
    }
    .coffee-image {
        top:250px;
        height:450px;
    }
}
@media screen and (max-width:1024px){
    .service-col {
        width:100%;
        padding:20px 10%;
        margin:20px auto;
    }
    .three-col-service {
        padding:20px 20px;
    }
    .service-section-animated {
        padding:50px 20px;
    }
    .coffee-image {
        top:150px;
        height:450px;
    }
    .services-banner-image {
        max-height:950px;
        min-height:800px;
    }
    .about-page-content-top{
        max-height:1100px;
    }
    .about-banner-left-padding {
        width:100%;
    }
}
@media screen and (max-width:767px){
    .three-col-service {
        padding:50px 20px;
    }
    .service-col {
        padding:20px 0;
    }
    .page-id-4084 .service-col p,
    .page-id-3965 .service-col p,
    .page-id-4082 .service-col p
    {
        text-align:left;
    }
    .service-half {
        width:100%;
    }
    .service-section-animated {
        padding:50px 20px;
    }
    .service-01,
    .service-02,
    .service-03 {
        max-height:450px;
        min-height:450px;
    }
    .padding-left {
        padding-left:0 !important;
    }
    .padding-right {
        padding-right:20px !important;
        padding-left:20px !important;
    } 
    .left-service-banner {
    padding: 0px 20px !important;
    }
        .coffee-image {
        top:225px;
        height:300px;
    }
}
@media screen and (max-width:560px){
    .service-01,
    .service-02,
    .service-03{
        max-height:350px;
        min-height:350px;
    }
    .coffee-image {
        height:250px;
    }
}







/** Case Studies CSS **/
.sticky-container {
    overflow:hidden;
}


/************* END OF SERVICES PAGE STYLES *********/
/********** Footer Callout ******/
.close {
    right: 50px;
    position: relative;
    z-index: 2;
    top: -40px;
    background: transparent;
    border-radius: 50%;
}

#footer-callout-wrap{
background: #8fc8ef; /* Old Browsers */
background: -webkit-linear-gradient(right,#8fc8ef,#4a9edb); /*Safari 5.1-6*/
background: -o-linear-gradient(right,#8fc8ef,#4a9edb); /*Opera 11.1-12*/
background: -moz-linear-gradient(right,#8fc8ef,#4a9edb); /*Fx 3.6-15*/
background: linear-gradient(to left, #8fc8ef, #4a9edb); /*Standard*/

text-align:center;
border-top:none;
border-bottom:none;
z-index:1;
}
#footer-callout-wrap .callout-text:hover {
cursor: pointer;
}
.clickable {
    width: 100%;
    height: 200px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}
.clickable h4 {
    margin:0;
    position:relative;
    top:50%;
    font-weight:400;
    
}
@media screen and (max-width:767px){
    .clickable h4 {
        top:40%;
    }
}
/* Sweep To Right */
.hvr-sweep-to-right {
  display: inline-block;
  vertical-align: middle;
  background: #8fc8ef; /* Old Browsers */
  background: -webkit-linear-gradient(left,rgba(143, 200, 239,0.7),rgba(74, 158, 219,0.7)); /*Safari 5.1-6*/
  background: -o-linear-gradient(left,rgba(143, 200, 239,0.7),rgba(74, 158, 219,0.7)); /*Opera 11.1-12*/
  background: -moz-linear-gradient(leftt,rgba(143, 200, 239,0.7),rgba(74, 158, 219,0.7)); /*Fx 3.6-15*/
  background: linear-gradient(to right, rgba(143, 200, 239,0.7), rgba(74, 158, 219,0.7)); 
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  -webkit-transition-property: background;
  transition-property: background;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  z-index:2;
}



.hvr-sweep-to-right:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background:#8fc8ef;
      -webkit-box-shadow: -15px 0 5px -15px #8fc8ef;
      -moz-box-shadow: -15px 0 5px -15px #8fc8ef;
          box-shadow: -15px 0 5px -15px #8fc8ef;
  background: -webkit-linear-gradient(left,rgba(143, 200, 239,0.7),rgba(74, 158, 219,0.7)); /*Safari 5.1-6*/
  background: -o-linear-gradient(left,rgba(143, 200, 239,0.7),rgba(74, 158, 219,0.7)); /*Opera 11.1-12*/
  background: -moz-linear-gradient(leftt,rgba(143, 200, 239,0.7),rgba(74, 158, 219,0.7)); /*Fx 3.6-15*/
  background: linear-gradient(to right, rgba(143, 200, 239,0.7), rgba(74, 158, 219,0.7)); 
 
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-sweep-to-right:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active {
  color: #8fc8ef;
    -webkit-box-shadow: -15px 0 5px -15px #8fc8ef;
          box-shadow: -15px 0 5px -15px #8fc8ef;
    background: #8fc8ef; /* Old Browsers */
  background: -webkit-linear-gradient(right,rgba(143, 200, 239,0.7),rgba(74, 158, 219,0.7)); /*Safari 5.1-6*/
  background: -o-linear-gradient(right,rgba(143, 200, 239,0.7),rgba(74, 158, 219,0.7)); /*Opera 11.1-12*/
  background: -moz-linear-gradient(right,rgba(143, 200, 239,0.7),rgba(74, 158, 219,0.7)); /*Fx 3.6-15*/
  background: linear-gradient(to left, rgba(143, 200, 239,0.7), rgba(74, 158, 219,0.7)); 
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  -webkit-transition-property: background;
  transition-property: background;
  -webkit-transition-duration: 1s;
  transition-duration: 1s;    

}
.hvr-sweep-to-right:hover:before, .hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  
}

.vc_column-inner {margin-bottom: 0px !important;}

/********** 11 Footer **********/
.footer-main{width:100%;overflow:visible;height:100%;max-height:120px;}
@media screen and (max-width:767px){
    .footer-main {
        max-height:inherit;
    }
}
.footer-middle,.phone-section {float:left;width:50%;text-align:left;margin:0 auto;position:relative;}
.footer-left,.footer-right{text-align: center;color:#fff;float:left;width:25%;height:100%;}
.social-footer{width:auto;height:100%;}
.entry ul {margin: 0 0 0 0 ;}
li.footer-text, p.footer-text{font-size:14px;color:#fff;text-transform:lowercase;font-weight:100;}
.social-section a{width:26px;height:26px;position:relative; margin:0 10px;display:inline-block;}
.social-section a .social {display:flex;justify-content:center;flex-direction:row;}
a.footer-link,div.footer-links p {color:#fff;}
.footer-links {width:100%;text-align:center;color:#fff;}
.footer-locations{height:100%;float:left;text-align: center;margin-top:5px;}
.social-section{width:50%;float:left;margin:10px auto;display:flex;justify-content: flex-end;}

.left-margin {margin:0 20px;}
.footer-right a img {
    position:absolute;
    top:-120px;
    z-index:1;
    right:11.5%;
}

#facebook,
#twitter,
#youtube,
#linkedin,
#behance,
#googleplus
 {
    width:26px;
    height:26px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center center;
    float:right;
    margin:0 auto;
 }
#facebook {
    background:url("/wp-content/uploads/2018/03/facebook-icon-min.png");
}
#facebook:hover {
    background:url('/wp-content/uploads/2018/03/facebook-icon-blue-min.png');
}
#twitter {
    background:url("/wp-content/uploads/2018/03/twitter-icon-min.png");
}
#twitter:hover {
    background:url('/wp-content/uploads/2018/03/twitter-icon-blue-min.png');
}
/** 
#youtube {
    background:url('/wp-content/uploads/2017/06/social-youtube-circular-butto.png');
}
#youtube:hover {
    background:url('/wp-content/uploads/2018/03/youtube-blue-icon-e1520889939142.png');
}
#linkedin{
    background:url('/wp-content/uploads/2017/06/Group-4.png');
}
#linkedin:hover {
    background:url('/wp-content/uploads/2018/03/linkedin-blue-icon-e1520889950682.png');
}
**/
#behance {
    background:url('/wp-content/uploads/2018/03/behance-icon-min.png');
}
#behance:hover {
    background:url('/wp-content/uploads/2018/03/behance-icon-blue-min.png');
}
#googleplus{
    background:url('/wp-content/uploads/2018/03/googleplus-icon-min.png');
}
#googleplus:hover {
    background:url('/wp-content/uploads/2018/03/googleplus-icon-blue-min.png');
}

.marker {
    position:relative;
    top:6px;
}
.footer-right p a,
.phone-section p{
    font-size:25px;
}
@media screen and (min-width:1600px){
    .social-section {
        justify-content:flex-end;
    }
}
@media screen and (max-width:1024px){
    .footer-right p a {
        font-size:20px;
    }
}
.footer-right p span {
    font-weight: bold;
    top: 5px;
    font-size: 35px;
    position: relative;
}
.footer-right p {
    height: 100%;
    margin-bottom: 0px;
    bottom: 15px;
    position: relative;
}
.footer-section{
    overflow:visible !important;
}
@media screen and (max-width:1120px){
    .social-section{width:100%;display:flex;justify-content:center;float:none;margin-left:0;text-align:center;height:26px;}
    .social{float:none;text-align:center;padding:10px;}
    .phone-section {text-align:center;margin-top:20px;width:100%;}
    .desktop-only {display:none;}
    .left-margin {margin: 0 0;}
    .footer-left,.footer-right{
        width:30%;
        text-align:center;
    }
    .footer-middle {
        width:40%;
    }
}
.footer-locations ul {list-style-type:none;display:inline-flex;}
.footer-locations li {width:auto;border-right:1px solid #fff;text-align:center;padding-left:8px;padding-right:10px;}
.footer-locations li:first-child {border-left:1px solid #fff;}
.image-container {width:297px;height:45px;overflow:hidden;position:relative;margin:0 auto;}
.image-container img {
     position:relative;
     top:5px;
}

/** footer blog div **/
.blog-section {
    font-size:25px;
    font-weight:600;
    margin-top:-10px;
    position:relative;
}
.blog-section a {
    width:50%;
    height:25px;
}

.blog-section a:hover,
.phone-section a:hover,
.footer-right a:hover{
    color:#8fc8ef !important;
}

/** CLEAR BOTH **/
.foote-main:after,.footer-left:after,.footer-right:after,.footer-middle:after {
  content: "";
  display: table;
  clear: both;
}
/** FOOTER CALLOUT FORM **/
.gform_wrapper .gfield_required {
    display:none;
}
form#gform_1 {
    width:60%;
}
@media screen and (max-width:768px){
    form#gform_1{
    width:80%;
    }
}
input#input_1_1,
input#input_1_3,
input#input_1_5,
input#input_1_6,
li#field_1_5,
li#field_1_6,
li#field_1_7,
li#field_1_8,
li#field_1_9,
textarea#input_1_3
{
 width:100%;
 text-align:center;
}
.gform_wrapper ul.gfield_radio li {
    text-align:left;
} 
li.gchoice_1_7_1,
li.gchoice_1_8_2,
li.gchoice_1_9_2{
    margin-bottom:10px !important;
}

input#gform_submit_button_1:hover {
    border:none;
}
/********** 12 Media Queries **********/
/**Footer **/
@media screen and (max-width:800px){

  div.footer-left,div.footer-right,div.footer-middle,div.footer-locations,div.footer-links,.footer-locations ul {width:100%;margin:0 auto;display:block;text-align:center;padding:10px 20px;}
  div.social-section {
      margin:0 5px;
  }
  .footer-locations li {border:none;padding:10px 10px;font-size:20px;}
.footer-locations li:first-child {border:none;}

}
/** testimonial section **/
.testimonial-name{
    font-size:14px;
    font-weight:bold;
    font-style:italic;
}
.service-two-col-right {
    padding:0 10% 0 20px;
}
@media screen and (max-width:1240px){
 .service-two-col-right{
     padding:0 5% 0 20px;
 }   
}
@media screen and (max-width:767px){
    .service-two-col-right {
        padding: 0 0;
    }
}
.single-case-study #site-header.overlay-header.light-style #mobile-menu a {
    background: transparent !important;
}

 
 /** pop up settings**/
 /** make backgrounds transparent **/
 .wph-modal.module_id_1 .hustle-modal .hustle-modal-body,
.wph-modal.module_id_1 .hustle-modal footer,
.wph-modal.module_id_1 .hustle-modal .hustle-modal-optin_field,
.wph-modal.module_id_1 .hustle-modal .hustle-modal-optin_field:hover,
.wph-modal.module_id_1 .hustle-modal .hustle-modal-optin_field input:hover{
    background:transparent !important;
}
/** modal typography **/
.hustle-modal article h2 {
    font-size:44px !important;
}
.hustle-modal article p {
    margin:0 !important;
    font-size:18px !important;
    line-height:20px !important;
}

/** modal footer **/
.wph-modal.module_id_1 .hustle-modal footer {
    top:0px !important;
    position:relative;
}
.wph-modal.module_id_1 .hustle-modal .hustle-modal-optin_field {
    display: block !important;
    width: 50% !important;
    margin: 0 auto 20px auto !important;
}

.hustle-modal-optin_field {
    border:1px solid #fff;
}
form.hustle-modal-optin_form {
    display:inline-block !important;
    width:100% !important;
}
.wph-modal.module_id_1 .hustle-modal form .hustle-modal-optin_button button {
    margin:auto;
    
}

@media screen and (max-width:705px){
    .wph-modal.module_id_1 .hustle-modal form .hustle-modal-optin_button button
     {
         width:50% !important;
     }
}

@media screen and (min-width:601px){
    #vid {
        width:100%;
        height:100%;
    }
}
@media screen and (max-width:600px){
    #vid {
        height: 350px;
        width: 263px;
        top: -5px;
    }
}
@media screen and (max-width:375px){
    #vid {
    height: 282px;
    width: 159px;
    left: 24%; 
    }
}
@media screen and (max-width:360px){
    #vid {
    height: 282px;
    width: 159px;
    left: 22%; 
    }
}
@media screen and (max-width:350px){
    #vid {
    height: 282px;
    width: 165px;
    left: 20%; 
    }
}
@media screen and (max-width:340px){
    #vid {
    height: 282px;
    width: 164px;
    left: 19%; 
    }
}
@media screen and (max-width:330px){
    #vid {
    height: 282px;
    width: 158px;
    left: 47px;
    }
} 
@media screen and (max-width:320px){
    #vid {
    height: 282px;
    width: 158px;
    left: 42px;
    }
}
/** blog post series **/

#post-series-title {
    background-color:#2160b5 !important;
    color:#fff !important;
}
#post-series {
    background-color:#fff !important;
}
#post-series .post-series-current {
    color:#424242 !important;
}
/** before after hover **/
.twentytwenty-overlay:hover {
    display:none;
}

#cn-notice-text {
    font-size: 16px;
}

.cookie-notice-container {
    padding: 25px 6%;
}

.cn-button.wp-default {
    font-size: 16px;
    background: #fff;
    padding: 10px 20px;
    text-transform: uppercase;
}
.cn-button.wp-default {
    color: #2160b5 !important;
}

.is-sticky li.light-blue-button-nav a span,
.is-sticky li.dark-blue-button-nav a span {
    color: #777777;
}