/*   
Theme Name: Bynder Group 2019 v4
Theme URI: https://analogpixel.com
Description: Bootstrap based theme for Bynder Group
Author: Analog Pixel, Inc.
Author URI: http://analogpixel.com
Version: 4.0
*/

/* ==========================================================================
   RESET + NORMALIZE
========================================================================== */
html {font-size:10px}
html{-webkit-text-size-adjust:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{word-wrap:break-word;/* This is a small security for too long strings titles */font-family:Arial,Helvetica,sans-serif;}
.chromeframe {position:absolute;top: 0;}
/* Apply a natural box layout model to all elements: http://paulirish.com/2012/box-sizing-border-box-ftw/ */
/* * {-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;} */

/* JS required warning */
.javascript-required { background: #a00; color: #fff; font-size: 2rem; line-height: 1.3; text-align: center; padding: 15px 0; }
.javascript-required p{margin:0;padding:0;}

/* Clearfix */
.clearfix:before,.clearfix:after{content:' ';display:table;}
.clearfix:after{clear:both;}
.clearfix{*zoom:1;}

/* Helper classes */
.nobr,.phone{white-space:nowrap;}
.uppercase{text-transform:uppercase;}
.no-margin{margin:0 !important;}
.transition-opacity{-o-transition:opacity 0.25s linear;-moz-transition:opacity 0.25s linear;-khtml-transition:opacity 0.25s linear;-webkit-transition:opacity 0.25s linear;-ms-transition:opacity 0.25s linear;transition:opacity 0.25s linear;-webkit-transform:translateZ(0); }

/* General font styles */
hr {
clear: both;
border: none 0;
border-top: 1px solid #707070;
width: 100%;
height: 1px;
margin: 30px 0;
}
p, ol, ul { margin: 0 0 1.5em 0; }
b,strong,.strong,.bold { font-weight: 700; }
.large { font-size: 1.8rem; }
.small,small { font-size: 80%; line-height: 1.5; }
.lead { font-size: 1.6rem; line-height: 1.7; font-weight: 600; }

ul { line-height: 1.25; }
ul li { padding: 5px 0; }

/* ==========================================================================
   BASIC STYLES
========================================================================== */

body { background: #fff; font-size: 1.6rem; line-height: 1.5; font-family: 'Source Sans Pro'; }
body, select, input, textarea { color: #5f5e55; }

/* Default link color */
a { color: #f36d25; text-decoration: none; outline: none !important; -o-transition: color 0.3s ease; -moz-transition: color 0.3s ease; -khtml-transition: color 0.3s ease; -webkit-transition: color 0.3s ease; -ms-transition: color 0.3s ease; transition: color 0.3s ease; }
a:hover { color: #797972; }

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #f36d25; color: #fff; text-shadow: none;}
::selection {background: #f36d25; color: #fff; text-shadow: none;} 

ins {background-color: #f36d25; color: #000; text-decoration: none;}
mark {background-color: #f36d25; color: #000; font-style: italic; font-weight: 600; }

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color: #a9a9a9; }
textarea:-moz-placeholder { color: #a9a9a9; }



/* ==========================================================================
   BOOTSTRAP CHANGES
========================================================================== */

img { max-width: 100%; max-height: 100%; height: auto; }





/* SLIDEBARS */
#sb-site { background: #d4d4d3; }
#sb-site-inner { background: #fff; }
.sb-slidebar { width: 200px; background: #d4d4d3; }
body.admin-bar .sb-slidebar { padding-top: 28px; }











#sb-site {
    -webkit-box-shadow: 0px 0px 6px 4px rgba(0, 0, 0, .5);
    -moz-box-shadow: 0px 0px 6px 4px rgba(0, 0, 0, .5);
    box-shadow: 0px 0px 6px 4px rgba(0, 0, 0, .5)
}

.sb-slidebar {
    color: #fff;
    background-color: #223645
}

#sb-toggle {
    position: relative;
    display: inline-block;
	z-index: 9990;
}

#sb-toggle span {
    margin: 0 auto;
    position: relative;
    top: 10px
}

#sb-toggle span:before, #sb-toggle span:after {
    position: absolute;
    content: ''
}

#sb-toggle span, #sb-toggle span:before, #sb-toggle span:after {
    width: 25px;
    height: 4px;
    background-color: #797972;
    border-radius: 1px;
    display: block
}

#sb-toggle span:before {
    margin-top: -10px
}

#sb-toggle span:after {
    margin-top: 10px
}

#sb-toggle span {
    -webkit-transition-duration: 0s;
    transition-duration: 0s;
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

html.sb-active #sb-toggle span {
    background-color: rgba(0, 0, 0, .0);
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

#sb-toggle span:before {
    -webkit-transition-property: margin, -webkit-transform;
    transition-property: margin, transform;
    -webkit-transition-duration: .2s;
    transition-duration: .2s;
    -webkit-transition-delay: .2s, 0s;
    transition-delay: .2s, 0s
}

html.sb-active #sb-toggle span:before {
    margin-top: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition-delay: 0s, .2s;
    transition-delay: 0s, .2s
}

#sb-toggle span:after {
    -webkit-transition-property: margin, -webkit-transform;
    transition-property: margin, transform;
    -webkit-transition-duration: .2s;
    transition-duration: .2s;
    -webkit-transition-delay: .2s, 0s;
    transition-delay: .2s, 0s
}

html.sb-active #sb-toggle span:after {
    margin-top: 0;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transition-delay: 0s, .2s;
    transition-delay: 0s, .2s
}

.sb-slidebar ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.2;
    text-transform: uppercase
}

.sb-slidebar li {
    margin: 0;
    padding: 0;
    list-style-type: none
}

.sb-slidebar li a {
    display: block;
    padding: 15px 30px;
    color: #fff;
    text-decoration: none !important;
    background: #435461;
    border-bottom: 1px solid #223645
}
/* .sb-slidebar li.current_page_item a */
.sb-slidebar li a:hover {
    background: #223645;
    border-bottom: 1px solid #435461
}

.sb-slidebar li li a {
    padding: 15px 30px 15px 45px
}





/*
#nav-primary { font-size: 1.6rem; line-height: 1; text-transform: uppercase; margin-top: 30px; }
#nav-primary ul { list-style-type: none; margin: 0; padding: 0; float: right; }
#nav-primary ul li { list-style-type: none; margin: 0; padding: 0; display: inline; float: left; }
#nav-primary a { padding: 15px; color: #5f5e55; text-decoration: none; }
#nav-primary li:last-child a { padding-right: 0; }
#nav-primary li.current_page_item a,
#nav-primary li.current-page-ancestor a,
#nav-primary a:hover { color: #f36d25; text-decoration: none; }

body.single-portfolio #nav-primary li#menu-item-1865 a { color: #f36d25; }

*/










/*****     NAVIGATION SUPERFISH MENU     *****/
#nav-primary { font-size: 1.6rem; line-height: 1; text-transform: uppercase; margin-top: 30px; }
#nav-primary .sf-menu { list-style-type: none; margin: 0; padding: 0; float: right; }
#nav-primary .sf-menu ul {
	font-size: 1.6rem; 
	text-align: left;
	font-weight: 400;
	background: #fff;
	border-top: 1px solid #dedede;
	border-right: 1px solid #dedede;
	border-left: 1px solid #dedede;
	box-shadow: 2px 2px 6px rgba(0,0,0,.2);
}
#nav-primary .sf-menu li {
	padding: 0;
	background: none;
	border: none;
}
#nav-primary .sf-menu li a {
	padding: 15px;
	text-decoration: none !important;
}
#nav-primary .sf-menu li li {
	padding: 0;
}
#nav-primary .sf-menu li li a {
	color: #5f5e55 !important;
	padding: 10px 20px;
	border-bottom: 1px solid #dedede;
	background: #fff;
}
#nav-primary .sf-menu li li a:hover {
	color: #5f5e55;
	background: #eee;
}
#nav-primary .sf-menu li { }
#nav-primary .sf-menu ul li { }
#nav-primary .sf-menu ul ul li { }
#nav-primary .sf-menu li:hover,
#nav-primary .sf-menu li.sfHover a {
	color: #e24700;
}

#nav-primary .sf-menu li li a:active {
	/* background: #e24700 !important; */
}
#nav-primary .sf-menu li li.current_page_item a,
#nav-primary .sf-menu li li.current_page_ancestor a {
	color: #f36d25;
	text-decoration: none;
	/* color: #fff !important; */
	/* background: #e24700 !important; */
}


#nav-primary a { padding: 15px; color: #5f5e55; text-decoration: none; }
#nav-primary li:last-child a { padding-right: 0; }


#nav-primary li.current_page_item a,
#nav-primary li.current-page-ancestor a,
#nav-primary a:hover { color: #f36d25; text-decoration: none; }
body.single-portfolio #nav-primary li#menu-item-1865 a { color: #f36d25; }








/* CONTACT FORM 7 */
.ajax-loader { padding: 0 20px; }
.wpcf7 .wpcf7-form-control.wpcf7-text,
.wpcf7 .wpcf7-form-control.wpcf7-textarea { font-family: 'pt_sansregular', Arial, sans-serif; font-size: 14px; line-height: 18px; outline: none; background: #ececec; border-color: #ececec; color: #5f5e55; padding: 4px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
.wpcf7 .wpcf7-form-control:focus { background: #fff; }
.wpcf7 .wpcf7-form-control.wpcf7-not-valid { border: 1px solid #b44119 !important; }
.wpcf7 .wpcf7-not-valid-tip { margin-bottom: 0; font-size: 13px !important; color: #b44119 !important; clear: both !important; display: inline-block; }
.wpcf7 .wpcf7-response-output { color: #5f5e55; margin: 25px 0 0 0 !important; padding: 0.5em 1em !important; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size: 75%; }
.wpcf7 .wpcf7-mail-sent-ok { background: #398f14; color: #fff; }
.wpcf7 .wpcf7-mail-sent-ng { background: #ff0000; color: #fff; }
.wpcf7 .wpcf7-spam-blocked { background: #ffa500; color: #fff; }
.wpcf7 .wpcf7-validation-errors { background: #f7e700; }
.wpcf7 .wpcf7-form-control.wpcf7-submit { font-size: 18px; color: #f36d25; text-transform: uppercase; text-decoration: none; font-family: 'pt_sansbold', Arial, sans-serif; font-weight: normal; padding-left: 0; padding-right: 0; }
.no-touch .wpcf7 .wpcf7-form-control.wpcf7-submit:hover { color: #797972; text-decoration: none; }

.wpcf7 label { font-weight: normal; font-size: 18px; }
.wpcf7 .form-control { -webkit-box-shadow: inset 0 0 0 rgba(0,0,0,0); box-shadow: inset 0 0 0 rgba(0,0,0,0); }
.wpcf7 .form-control:focus { border-color: #f36d25; -webkit-box-shadow: inset 0 0 0 rgba(0,0,0,0),0 0 8px rgba(243,109,39,.6); box-shadow: inset 0 0 0 rgba(0,0,0,0),0 0 8px rgba(243,109,39,.6); }




/* CYCLE SLIDESHOWS */
.cycle-slideshow { width: 100%; position: relative; z-index: 1000; }
.cycle-slideshow img { width: 100%; height: auto; z-index: 1000; }

#home-cycle-slideshow { position: relative; z-index: 1000; margin: 0 auto; max-width: 1300px; }
/*
#home-cycle-slideshow .cycle-prev { position: absolute; top: 277px; left: 5px; height: 60px; width: 40px; line-height: 60px; z-index: 1001; overflow: hidden; text-indent: -9999px; display: inline-block; background: url(./assets/img/cycle-nav.png) 0 0 no-repeat; cursor: pointer; opacity: 0.75; -o-transition: opacity 0.3s linear;
-moz-transition: opacity 0.3s linear;
-khtml-transition: opacity 0.3s linear;
-webkit-transition: opacity 0.3s linear;
-ms-transition: opacity 0.3s linear;
transition: opacity 0.3s linear;
}
#home-cycle-slideshow .cycle-next { position: absolute; top: 277px; right: 5px; height: 60px; width: 40px; line-height: 60px; z-index: 1001; overflow: hidden; text-indent: -9999px; display: inline-block; background: url(./assets/img/cycle-nav.png) -40px 0 no-repeat; cursor: pointer; opacity: 0.75; -o-transition: opacity 0.3s linear;
-moz-transition: opacity 0.3s linear;
-khtml-transition: opacity 0.3s linear;
-webkit-transition: opacity 0.3s linear;
-ms-transition: opacity 0.3s linear;
transition: opacity 0.3s linear;
}
#home-cycle-slideshow .cycle-prev:hover, #home-cycle-slideshow .cycle-next:hover { opacity: 1; }
*/


#home-cycle-slideshow .cycle-pager { z-index: 1001; text-align: center; width: 100%; position: absolute; bottom: 60px; overflow: hidden; }
#home-cycle-slideshow .cycle-pager span { z-index: 1002; cursor: pointer; padding: 15px; text-decoration: none; width: 24px; height: 24px; overflow: hidden; text-indent: -9999px; display: inline-block; background: url(./assets/img/cycle-pager.png) center center no-repeat; opacity: 0.5; filter:alpha(opacity=50); }
#home-cycle-slideshow .cycle-pager span:hover, #home-cycle-slideshow .cycle-pager span.cycle-pager-active { background: url(./assets/img/cycle-pager.png) center center no-repeat; opacity: 1; filter:alpha(opacity=100); }

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) {
/*
	#home-cycle-slideshow .cycle-prev { background: url(./assets/img/cycle-nav@2x.png) 0 0 no-repeat; background-size: 60px 60px; }
	#home-cycle-slideshow .cycle-next { background: url(./assets/img/cycle-nav@2x.png) -40px 0 no-repeat; background-size: 60px 60px; }
*/
	#home-cycle-slideshow .cycle-pager span { background: url(./assets/img/cycle-pager@2x.png) center center no-repeat; background-size: 24px 24px; }
	#home-cycle-slideshow .cycle-pager span:hover, #home-cycle-slideshow .cycle-pager span.cycle-pager-active { background: url(./assets/img/cycle-pager@2x.png) center center no-repeat; background-size: 24px 24px; }
}
@media
only screen and (-webkit-min-device-pixel-ratio: 3),
only screen and (   min--moz-device-pixel-ratio: 3),
only screen and (     -o-min-device-pixel-ratio: 3/1),
only screen and (        min-device-pixel-ratio: 3),
only screen and (                min-resolution: 288dpi),
only screen and (                min-resolution: 3dppx) {
/*
	#home-cycle-slideshow .cycle-prev { background: url(./assets/img/cycle-nav@3x.png) 0 0 no-repeat; background-size: 60px 60px; }
	#home-cycle-slideshow .cycle-next { background: url(./assets/img/cycle-nav@3x.png) -40px 0 no-repeat; background-size: 60px 60px; }
*/
	#home-cycle-slideshow .cycle-pager span { background: url(./assets/img/cycle-pager@3x.png) center center no-repeat; background-size: 24px 24px; }
	#home-cycle-slideshow .cycle-pager span:hover, #home-cycle-slideshow .cycle-pager span.cycle-pager-active { background: url(./assets/img/cycle-pager@3x.png) center center no-repeat; background-size: 24px 24px; }
}

   













/* ==========================================================================
WordPress Core
========================================================================== */
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption {
    background: #fff;
    max-width: 100%; /* Image does not overflow the content area */
   text-align: left;
    font-size: 1.3rem;
    line-height: 1.5;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 100%;
    padding: 0;
    width: auto;
}

.wp-caption .wp-caption-text {
    margin: 0 0 30px 0;
    padding: 15px 0;
}

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #eee;
	clip: auto !important;
	clip-path: none;
	color: #444;
	display: block;
	font-size: 1em;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}


/* ==========================================================================
   HEADER + FOOTER LOGO
========================================================================== */

#site-header-logo a,
#site-footer-logo a {
    display: inline-block;
    overflow: hidden;
    text-indent: -999em;
    margin: 0;
    padding: 0;
    cursor: pointer;
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transition: opacity .5s ease-in;
    -moz-transition: opacity .5s ease-in;
    transition: opacity .5s ease-in;
}
#site-header-logo a:hover, #site-footer-logo a:hover {
    opacity: .75;
    filter: alpha(opacity=75);
}



/* ==========================================================================
   HEADER
========================================================================== */
#site-header { max-height: 154px; }
#site-header-logo a {
    margin: 0 0 50px 0;
    background: transparent url(./assets/img/bynder-group-logo.svg) 0 0 no-repeat;
	width: 263px;
    height: 54px;
    background-size: 263px 54px;
}
#header-phone { margin: 15px 0; text-align: right; }
#header-phone a.phone,
#header-phone a.phone:hover { color: #5f5e55; font-weight: 700; font-size: 1.8rem; line-height: 1; }
#header-phone a.phone i { color: #f36d25; margin-right: 5px; }



/* ==========================================================================
   FOOTER
========================================================================== */
#site-footer {
	color: #fff;
	background: #223645;
	margin-top: 100px;
	padding: 30px 0;
	font-size: 1.6rem;
	line-height: 1.5;
}
#site-footer-logo a {
	margin: 0 0 15px 0;
    background: transparent url(./assets/img/bynder-group-logo-white.svg) 0 0 no-repeat;
	width: 195px;
    height: 40px;
    background-size: 195px 40px;
}
#site-footer a {
	color: #fff;
	text-decoration: underline;
}
#site-footer a:hover {
	color: #4a698f;
	text-decoration: none;
}
#site-footer a.phone,
#site-footer .social-hubspot a { text-decoration: none; }
#site-footer h5 {
	font-size: 1.6rem;
	line-height: 1.5;
	font-weight: normal;
	font-weight: 600;
	margin: 0;
}
#site-footer p { margin: 0 0 1em 0; }

#site-footer .large { font-size: 1.8rem; display: block; }
#site-footer .small { font-size: 1.4rem; line-height: 1.3; display: block; }
#site-footer .copyright { margin-top: 30px; font-size: 1.2rem; }

#site-footer ul.social { font-size: 2.4rem; line-height: 1; margin: 15px 0; padding: 0; }
#site-footer ul.social:after { content: ""; display: table; clear: both; }
#site-footer ul.social li { display: inline-block; margin: 5px; padding: 0; }
#site-footer ul.social li:first-child { margin-left: 0; }
#site-footer ul.social a { color: #fff; text-decoration: none; padding: 5px; }
#site-footer ul.social a:hover { color: #4a698f; text-decoration: none; }

#site-footer .social-hubspot { margin: 60px 0 30px 0; }
#site-footer img.hubspot-logo { margin: 15px 0; }








/* ==========================================================================
   PORTFOLIO GRID
========================================================================== */

/*
#port-index {
    margin-top: -15px;
}
*/
#port-index .port-index-item img {
    -webkit-animation: fadein 0.75s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 0.75s; /* Firefox < 16 */
        -ms-animation: fadein 0.75s; /* Internet Explorer */
         -o-animation: fadein 0.75s; /* Opera < 12.1 */
            animation: fadein 0.75s;
}
#port-index .port-index-item {
    margin: 15px 0;
    text-transform: uppercase;
    font-size: 1.8rem;
    line-height: 1.1;
    font-weight: 600;
}

#port-index .port-index-item a {
    -webkit-transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    transition: all .2s ease-in;
}

#port-index .port-index-item a {
    position: relative;
    display: block;
    text-decoration: none;
}

#port-index .port-index-item a:hover {
    text-decoration: none;
}

#port-index .port-index-item .overlay {
    padding: 10px 0 0;
    display: inline-block;
}

.no-touch #port-index .port-index-item .overlay {
    padding: 0;
}

.no-touch #port-index .port-index-item .overlay {
    opacity: 1;
    filter: alpha(opacity=100);
    display: block;
    padding: 15px;
    position: absolute;
    bottom: 0;
    left: 0;
    top: 0;
    right: 0;
    width: 100%;
    background: rgba(34, 54, 69, .4);
    text-shadow: 2px 2px 5px rgba(0, 0, 0, .75);
}

.no-touch #port-index .port-index-item a, .no-touch #port-index .port-index-item a:hover {
    color: #fff;
    text-decoration: none;
}

.no-touch #port-index .port-index-item a .overlay {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    transition: all .2s ease-in;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.no-touch #port-index .port-index-item a:hover .overlay {
    opacity: 1;
    filter: alpha(opacity=100);
}








h1,.h1 { font-size: 3.4rem; font-weight: 700; margin-bottom: 0.75em; }
h2,.h2 { font-size: 2.8rem; font-weight: 400; margin-bottom: 0.25em; }
h3,.h3 { font-size: 2.2rem; font-weight: 400; margin-bottom: 0.25em; }
h4,.h4 { font-size: 1.8rem; font-weight: 600; margin-bottom: 0.25em; }
header.entry-header h1 { font-weight: 400; }
body.single-portfolio h1 { font-weight: 400; }






/* ==========================================================================
   HUBSPOT FORM
========================================================================== */

.hs-form label { font-weight: 600;}
.hs-form .hs-error-msgs label { font-size: 1.4rem; color: #900; }
ul.hs-error-msgs { list-style-type: none; margin: -1em 0 1em 0; padding: 0; }
.hs-form input[type="text"], .hs-form input[type="password"], .hs-form input[type="datetime"], .hs-form input[type="datetime-local"], .hs-form input[type="date"], .hs-form input[type="month"], .hs-form input[type="time"], .hs-form input[type="week"], .hs-form input[type="number"], .hs-form input[type="email"], .hs-form input[type="url"], .hs-form input[type="search"], .hs-form input[type="tel"], .hs-form input[type="color"], .hs-form input[type="file"], .hs-form textarea, .hs-form select {
margin: 0 0 1em 0;
padding: 7px;
width: 100%;
border-radius: 6px;
border: 1px solid rgb(185, 185, 185);
font-size: 1.8rem;
}
.hs_submit, .hs-submit { margin-top: 30px; }
.sidebar-widget .hs_submit, .sidebar-widget .hs-submit { margin-top: 0; }






/* ==========================================================================
   PAGE HEADER
========================================================================== */

.page-banner {
	font-size: 1.8rem;
	line-height: 1.3;
	font-weight: 400;
	text-align: center;
	color: #5f5e55;
	background: #f7f7f7;
	padding: 15px 30px;
	margin-bottom: 60px;
}
.page-banner-imgfade {
	color: #fff;
	text-shadow: 1px 1px 10px rgba(0,0,0,0.7);
	padding: 60px 30px;
	margin-bottom: 60px;
	background-size: cover !important;
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: center center;
    -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
         -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
}
.page-banner h1, .page-banner .h1 { font-size: 3.4rem; font-weight: 700; line-height: 1.1; margin-bottom: 0; }
.page-banner a { color: #5f5e55; text-decoration: none; }
.page-banner .btn { text-shadow: none; }

keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}



/* ==========================================================================
   BUTTONS
========================================================================== */

.btn::after { content: " \00BB"; }
.btn,
.hs-button { border-radius: 4px; font-size: 1.6rem; font-weight: 600; text-transform: uppercase; }
.btn-primary-alt,
a.btn-primary-alt,
.hs-button.primary { border-radius: 4px; font-size: 1.6rem; color: #fff; border: 1px solid #f36d25; background: #f36d25; text-decoration: none; text-align: left; text-align: left; padding: 10px 20px; }
.btn-primary-alt:hover,
.hs-button.primary:hover { color: #f36d25; border: 1px solid #f36d25; background: #fff; text-decoration: none; }
.btn-primary-alt:not(:disabled):not(.disabled).active, .btn-primary-alt:not(:disabled):not(.disabled):active, .show>.btn-primary-alt.dropdown-toggle {
	color: #fff;
	border-color: #d53900;
	background: #d53900;
}

.btn-lg.phone { font-size: 2.2rem; }
a.btn-default-alt { color: #5f5e55; }
.btn-default-alt { color: #fff; border: 1px solid #f36d25; background: #fff; text-decoration: none; text-align: left; text-align: left; padding: 20px; }
.btn-default-alt:hover { color: #fff; border: 1px solid #fff; background: #f36d25; text-decoration: none; }
.btn-default-alt:not(:disabled):not(.disabled).active, .btn-default-alt:not(:disabled):not(.disabled):active, .show>.btn-default-alt.dropdown-toggle {
	color: #fff;
	border-color: #d53900;
	background: #d53900;
}





/*
https://www.cattlegrid.info/2018/06/21/5-column-layout-with-bootstrap-4.html
https://bootstrapcreative.com/bootstrap-4-media-queries/
*/
.col-fifth,
.col-sm-fifth,
.col-md-fifth,
.col-lg-fifth,
.col-xl-fifth {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
.col-fifth {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}
@media (min-width: 576px) {
    .col-sm-fifth {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 768px) {
    .col-md-fifth {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 992px) {
    .col-lg-fifth {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 1200px) {
    .col-xl-fifth {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}





#sidebar.widget-area { padding: 30px 0; }
.widget-area h2.widget-title { font-size: 2.2rem; font-weight: 400; margin-top: -5px; }
.widget-area ul { list-style-type: none; margin: 0; padding: 0; font-size: 1.8rem; line-height: 1.3; }
.widget-area ul li { list-style-type: none; margin: 0 0 .7em 0; padding: 0; }


#home-services h2 { color: #4a698f; margin: 1em; }
#home-services ul { color: #797871; margin-bottom: 0; font-size: 1.8rem; }
#home-services .col-md-4:last-child ul { margin-bottom: 1.5em; }
/*
#home-services ul li:before {
    content: '\b7\a0';
    position:absolute;
    right:100%
}
#home-services ul li {
    list-style:none;
    position:relative;
}
*/


.blog-index-item { margin: 0; }
.blog-index-item img {
	border: 1px solid #707070;
	padding: 0;
    -webkit-animation: fadein 0.75s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 0.75s; /* Firefox < 16 */
        -ms-animation: fadein 0.75s; /* Internet Explorer */
         -o-animation: fadein 0.75s; /* Opera < 12.1 */
            animation: fadein 0.75s;
}
.blog-index-item h2.entry-title { font-size: 2.0rem; line-height: 1.3; }
.blog-index-item .posted-on { font-size: 1.2rem; }

.blog-index-item .post-thumbnail {
    position: relative;
   display: inline-block;
	margin: 0 0 15px 0;
}

.blog-index-item .post-thumbnail .overlay {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transition: all .2s ease-in;
    -moz-transition: all .2s ease-in;
    transition: all .2s ease-in;
    display: inline-block;
   position: absolute;
    bottom: 0;
    left: 0;
    top: 0;
    right: 0;
    width: 100%;
    background: rgba(34, 54, 69, .2);
}

.blog-index-item a.post-thumbnail:hover .overlay {
    opacity: 1;
    filter: alpha(opacity=100);
}

/* blog */
body.single img.attachment-post-thumbnail {
	border: 1px solid #707070;
	margin: 0 0 30px 0;
}
body.single .posted-on { font-size: 1.4rem; display: inline-block; margin: 15px 0; }


.post-navigation { margin-top: -15px; }







#home-hero {
	font-size: 1.8rem;
	line-height: 1.3;
	font-weight: 400;
	background: #222;
	color: #fff;
	padding: 60px 0;
	margin: 0;
}
#home-hero h1 {
	font-size: 4.0rem;
	line-height: 1.1;
	font-weight: 700;
	margin-bottom: 0.5em;
}
#home-hero .h2 {
	font-size: 2.0rem;
	line-height: 1.1;
	font-weight: 600;
	margin-bottom: 10px;
	display: block;
}
#home-hero .h3 {
	font-size: 2.0rem;
	line-height: 1.1;
	font-weight: 600;
	margin-bottom: 20px;
	display: block;
	text-transform: uppercase;
}
#home-hero [class*=col] { padding-left: 60px; padding-right: 60px; }
#home-hero.page-banner a { color: #fff; }
#home-hero.page-banner a:hover { color: #f36d25; }


/*==================================================
=            Bootstrap 4 Media Queries             =
==================================================*/
@media only screen {
#sb-toggle { display: inline-block; }
#nav-primary { display: none; }
	.page-banner h1, .page-banner .h1 { font-size: 2.4rem; }
	#site-footer .social-hubspot { margin: 15px 0 0 0; }
	#sidebar.widget-area { border-top: 1px solid #707070; margin-top: 60px; }
	#site-footer { padding: 30px 0 80px 0; }
	#home-hero [class*=col] { padding-left: 15px; padding-right: 15px; }


#site-header-logo a {
    margin: 0 0 15px 0;
	width: 197px;
    height: 41px;
    background-size: 197px 41px;
}
#header-phone { margin: 15px 0 10px 0; text-align: center; }


}
@media only screen and (min-width: 576px) {
	.page-banner h1, .page-banner .h1 { font-size: 2.9rem; }
	#site-footer { padding: 30px 0; }
#home-hero { font-size: 1.6rem; }
#home-hero .h2 { font-size: 1.8rem; }
}
@media only screen and (min-width: 768px) {
	.page-banner h1, .page-banner .h1 { font-size: 3.4rem; }
	#site-footer .social-hubspot { margin: 60px 0 30px 0; }
	#sidebar.widget-area { border-top: none; margin-top: 0; }
#home-hero [class*=col] { padding-left: 30px; padding-right: 30px; }
#site-header-logo a {
    margin: 0 0 50px 0;
	width: 263px;
    height: 54px;
    background-size: 263px 54px;
}
}
@media only screen and (min-width: 992px) {
#sb-toggle { display: none; }
#nav-primary { display: block; }
#header-phone { margin: 15px 0; text-align: right; }
	#home-hero { font-size: 1.8rem; }
	#home-hero .h2 { font-size: 2.0rem; }
	#home-hero [class*=col] { padding-left: 60px; padding-right: 60px; }
}
@media only screen and (min-width: 1200px) {

}


section.section-padding-sm { padding-top: 30px; padding-bottom: 30px; }
section.section-padding-md { padding-top: 60px; padding-bottom: 60px; }
section.section-gray-bg { background: #f7f7f7; }
section.section-page-banner-above { margin-top: -60px; }

/* SERVICES */
section.section-services-ul ul.fa-ul { font-size: 1.8rem; margin-top: 1em; margin-bottom: -1em; }
section.section-services-ul ul.fa-ul li { margin: 0 0 1.5em 0;  }
section.section-services-ul ul.fa-ul span.fa-li { color: #f36d25; }



#services-index h3 { margin-bottom: 15px; }
#services-index h3 a { color: #5f5e55; }
#services-index h3 a:hover { color: #f36d25; }
#services-index ul { list-style-type: none; margin: 0; padding: 0; }
#services-index ul li { list-style-type: none; margin: 0; padding: 0; }
#services-index img { margin-bottom: 15px; }


img.img-half { zoom: 50%; }
img.img-quarter { zoom: 25%; }


.delay-100ms { animation-delay: 100ms; }
.delay-200ms { animation-delay: 200ms; }
.delay-300ms { animation-delay: 400ms; }
.delay-400ms { animation-delay: 400ms; }
.delay-500ms { animation-delay: 500ms; }
.delay-500ms { animation-delay: 600ms; }
.delay-700ms { animation-delay: 700ms; }
.delay-800ms { animation-delay: 800ms; }
.delay-900ms { animation-delay: 900ms; }
.delay-1000ms { animation-delay: 1000ms; }
.delay-1100ms { animation-delay: 1100ms; }
.delay-1200ms { animation-delay: 1200ms; }
.delay-1300ms { animation-delay: 1300ms; }
.delay-1400ms { animation-delay: 1400ms; }
.delay-1500ms { animation-delay: 1500ms; }
.delay-1600ms { animation-delay: 1600ms; }
.delay-1700ms { animation-delay: 1700ms; }
.delay-1800ms { animation-delay: 1800ms; }
.delay-1900ms { animation-delay: 1900ms; }
.delay-2000ms { animation-delay: 2000ms; }
.delay-2100ms { animation-delay: 2100ms; }
.delay-2200ms { animation-delay: 2200ms; }
.delay-2300ms { animation-delay: 2300ms; }
.delay-2400ms { animation-delay: 2400ms; }
.delay-2500ms { animation-delay: 2500ms; }
.delay-2600ms { animation-delay: 2600ms; }
.delay-2700ms { animation-delay: 2700ms; }
.delay-2800ms { animation-delay: 2800ms; }
.delay-2900ms { animation-delay: 2900ms; }
.delay-3000ms { animation-delay: 3000ms; }



.orange { color: #f36d25; }

.col-center-vert { display: flex; align-items: center; }


body.page-id-9 #site-footer,
body.page-template-page-services #site-footer,
body.page-template-page-about #site-footer,
body.home #site-footer { margin-top: 0; }


body.page-template-page-services .page-banner { margin-bottom: 0; }



#services-index-slim .col-* { padding: 0; }
#services-index-slim a { display: block; height: 100%; font-weight: 600; font-size: 1.6rem; line-height: 1.3; padding: 15px 10px; margin: 0 -15px; text-transform: uppercase; text-decoration: none; -o-transition: all 0.25s linear; -moz-transition: all 0.25s linear; -khtml-transition: all 0.25s linear; -webkit-transition: all 0.25s linear; -ms-transition: all 0.25s linear; transition: all 0.25s linear; -webkit-transform:translateZ(0); }
#services-index-slim a:hover { color: #5f5e55; background: #eee; text-decoration: none; }
#services-index-slim a.active { color: #5f5e55; background: #fff; text-decoration: none; }




.port-stat-num { display: block; font-size: 4.8rem; weight: 600; color: #4a698f; }
.port-stat { display: block; margin-bottom: 15px; }


.col-pricing-item { margin: 50px 0 15px 0; }
.col-pricing-item-alt { margin: 30px 0 15px 0; }

.pricing-item { font-size: 1.4rem; text-align: center; padding: 10px 0; border-left: 1px solid #bcbcbc; border-right: 1px solid #bcbcbc; border-bottom: 1px solid #bcbcbc; }
.pricing-item p { margin: 15px; }
.pricing-item ul { border-top: 1px solid #bcbcbc; list-style-type: none; margin: 15px; padding: 0; }
.pricing-item ul li { border-bottom: 1px solid #bcbcbc; list-style-type: none; margin: 0; padding: 5px 0; }
.pricing-item-price { font-weight: 600; font-size: 2.2rem; line-height: 1.3; display: block; }
.pricing-item-name { color: #fff; text-align: center; font-size: 1.3rem; padding: 15px; }
.pricing-item-name h3 { font-weight: 600; }
.pricing-item-name-blue { color: #fff; background: #4a698f; border: 1px solid #4a698f; border: 1px solid #4a698f; }
.pricing-item-name-green { color: #fff; background: #819e6e; border: 1px solid #819e6e; border: 1px solid #819e6e; }
.pricing-item-name-orange { color: #fff; background: #f36d25; border: 1px solid #f36d25; border: 1px solid #f36d25; }

.pricing-item a.btn-blue { color: #fff; background: #4a698f; }
.pricing-item a.btn-blue:hover { color: #4a698f; background: #fff; border: 1px solid #4a698f; }

.pricing-item a.btn-green { color: #fff; background: #819e6e; }
.pricing-item a.btn-green:hover { color: #819e6e; background: #fff; border: 1px solid #819e6e; }

.pricing-item a.btn-orange { color: #fff; background: #f36d25; }
.pricing-item a.btn-orange:hover { color: #f36d25; background: #fff; border: 1px solid #f36d25; }

.pricing-item-desc { background: #ebeef2; padding: 5px; margin: 10px 0 20px 0; }



.testimonial-bubbles {
	display: flex ;
	flex-direction: column;
	align-items: center;
	width: 100%;
	padding: 0 15px;
	margin-top: -60px;
	display: flex;
	flex-direction: column;
}
.messages {
	display: flex;
	flex-direction: column;
	font-size: 2rem;
	color: #fff;
}
.message {
	border-radius: 20px;
	padding: 15px 30px;
	margin-top: 5px;
	margin-bottom: 5px;
	display: inline-block;
}
.message p { margin: 0 0 0.5em 0; }
.message .byline { display: block; font-weight: 600; font-size: 1.6rem; line-height: 1; }
.message .byline .small { font-weight: 400; font-size: 1.4rem; line-height: 1; }
.message img { padding-top: 20px; }
.yours {
	align-items: flex-start;
}
.yours .message {
	background-color: #4a698f;
	position: relative;
}
.yours .message:before {
	content: "";
	position: absolute;
	z-index: 0;
	bottom: 0;
	left: -7px;
	height: 20px;
	width: 20px;
	background: #4a698f;
	border-bottom-right-radius: 15px;
}
.yours .message:after {
	content: "";
	position: absolute;
	z-index: 1;
	bottom: 0;
	left: -10px;
	width: 10px;
	height: 20px;
	background: #f7f7f7;
	border-bottom-right-radius: 10px;
}
.mine {
	align-items: flex-end;
}
.mine .message {
	background: #4a698f;
	position: relative;
}
.mine .message:before {
	content: "";
	position: absolute;
	z-index: 0;
	bottom: 0;
	right: -8px;
	height: 20px;
	width: 20px;
	background: #4a698f;
	background-attachment: fixed;
	border-bottom-left-radius: 15px;
}
.mine .message:after {
	content: "";
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: -10px;
	width: 10px;
	height: 20px;
	background: #f7f7f7;
	border-bottom-left-radius: 10px;
}
.owl-stage {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.owl-item{
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	height: auto !important;
}