/*
Theme Name: sb_blog_theme
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.11
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sb_blog_theme
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

sb_blog_theme is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
    ## Links
    ## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
    ## Posts and pages
    ## Comments
# Infinite scroll
# Media
    ## Captions
    ## Galleries
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust:     100%;
}

body {
    margin: 0;
    -webkit-font-smoothing: antialiased;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
    display: block;
}

audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline;
}

audio:not([controls]) {
    display: none;
    height: 0;
}

[hidden],
template {
    display: none;
}

a {
    background-color: transparent;
    transition: 0.2s;
    color: #30aade;
    outline: 0;
}

a:active,
a:hover {
    outline: 0;
    transition: 0.2s;
}

abbr[title] {
    border-bottom: 1px dotted;
}

b,
strong {
    font-weight: bold;
}

dfn {
    font-style: italic;
}

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

mark {
    background: #ff0;
    color: #000;
}

small {
    font-size: 80%;
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

img {
    border: 0;
}

svg:not(:root) {
    overflow: hidden;
}

figure {
    margin: 1em 40px;
}

hr {
    box-sizing: content-box;
    height: 0;
}

pre {
    overflow: auto;
}

code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

#header_iframe_container {
    opacity: 0;
    height: 80px;
    position: absolute;
    width: 100%;
}

#footer_iframe_container {
    width: 100%;
    font-smoothing: auto;
    -webkit-font-smoothing: auto;
}

#footer_iframe_container li, #footer_iframe_container li a, #footer_iframe_container h3 {
    font-smoothing: auto;
    -webkit-font-smoothing: auto;
}

.single-post #header_iframe_container {
    height: 80px;
}

.post-button-wrapper {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.post-button-link {
    color: white !important;
    text-decoration: none;
    display: table;
    padding: 7px 30px;
    font-weight: 500;
    border-radius: 20px;
    background: #30aade;
    background: linear-gradient(135deg, #5bd2f0 0%, #30aade 83%);
    font-size: 16px !important;
}

a.post-button-link:hover {
    color: white;
    transform: scale(1.05, 1.05);
    text-decoration: none !important;
}

a.post-button-link:active {
    color: white;
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}

button {
    overflow: visible;
}

button,
select {
    text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}

button[disabled],
html input[disabled] {
    cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

input {
    line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
}

legend {
    border: 0;
    padding: 0;
}

textarea {
    overflow: auto;
}

optgroup {
    font-weight: bold;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

table.code {
    width: 700px;
    margin: auto;
}

table.comparison {
    width: 500px;
    margin: auto;
}

table.comparison > tbody > tr > td {
    border-bottom: none !important;
}

td > ul {
    padding-left: 18px;
}

td > ul > li {
    line-height: 40px;
}

td {
    font-size: 18px;
}

td > code {
    font-size: 18px;
}

thead {
    font-weight: bold;
    display: table-header-group;
    vertical-align: middle;
    line-height: 2em;
    font-size: 18px;
    max-width: 700px;
    margin: 0 auto 40px auto;
    clear: both;
    text-align: left !important;
    border-collapse: separate;
    border-spacing: 2px;
}

td,
th {
    padding-top: 2px;
    padding-right: 24px;
    border-bottom: 1px solid #ececec;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
    color: #404040;
    font-family: 'Montserrat', Helvetica, sans-serif;
    font-size: 16px;
    font-size: 1rem;
    line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
}

p {
    margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
    font-style: italic;
}

cite {
	color: #333333;
	margin-top: 10px; 
	display: inline-block;
}

blockquote {
    background: #f7f7f7;
    padding: 35px;
    box-sizing: border-box;
	color: #333333;
    font-style: italic;
    transform: scale(1.09,1.09);
    max-width: 700px;
    margin: 60px auto;
}

blockquote span {
    color: #767676;
    font-weight: 500;
    font-size: 17px;
    padding-left: 15px;
}

blockquote p {
    margin: 0px !important;
    font-size: 23px !important;
    font-weight: 400;
}

blockquote .quote-attr {
    font-size: 14px !important;
    margin-top: 14px !important;
}

address {
    margin: 0 0 1.5em;
}

pre {
    background: #eee;
    font-family: "Courier 10 Pitch", Courier, monospace;
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 1.6;
    margin-bottom: 1.6em;
    max-width: 100%;
    overflow: auto;
    padding: 1.6em;
}

code,
kbd,
tt,
var {
    font-family: Monospace, Consolas, "Andale Mono", "DejaVu Sans Mono";
    font-size: 18px;
    line-height: 36px;
}

article li {
    font-size: 18px;
    padding-bottom: 20px;
}

abbr,
acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}

mark,
ins {
    background: #fff9c0;
    text-decoration: none;
}

big {
    font-size: 125%;
}

h3.section-title {
    font-weight: 700 !important;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
    box-sizing: border-box;
}

*,
*:before,
*:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
    box-sizing: inherit;
}

body {
    background: #fff; /* Fallback for when there is no custom background color defined. */
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: "";
}

blockquote,
q {
    quotes: "" "";
}

hr {
    background-color: #ccc;
    border: 0;
    height: 1px;
    margin-bottom: 1.5em;
}

ul,
ol {
    margin: 0 0 1.5em 3em;
}

ul {
    list-style: disc;
}

ol {
    list-style: decimal;
}

li > ul,
li > ol {
    margin-bottom: 0;
    margin-left: 1.5em;
}

dt {
    font-weight: bold;
}

dd {
    margin: 0 1.5em 1.5em;
}

img {
    height: auto; /* Make sure images are scaled correctly. */
    max-width: 100%; /* Adhere to container width. */
}

figure {
    margin: 1em 0; /* Extra wide images within figure tags don't overflow the content area. */
}

table {
    margin: 0 0 1.5em;
    width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    border: none;
    border-radius: 3px;
    background: #30aade;
    color: #fff;
    font-size: 12px;
    font-size: 14px;
    padding: 10px 20px 9px 20px;
    outline: 0;
    transition: 0.2s;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
    background: #44b7e8;
    transition: 0.2s;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
    color: #666;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 3px;
}

select {
    border: 1px solid #ccc;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
    color: #ffffff;
}

textarea {
    width: 100%;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
    color: #30aade;
    outline: 0;
}

a:visited {
    color: #30aade;
    outline: 0;
}

a:hover,
a:active {
    outline: 0;
    color: #0084bd;
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation {
    clear: both;
    display: block;
    float: left;
    width: 100%;
}

nav#site-navigation div.menu-main-container {
    float: right;
}

.main-navigation ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.main-navigation li {
    float: left;
    position: relative;
}

.main-navigation a {
    display: block;
    text-decoration: none;
}

.main-navigation ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    float: left;
    position: absolute;
    top: 1.5em;
    left: -999em;
    z-index: 99999;
}

.main-navigation ul ul ul {
    left: -999em;
    top: 0;
}

.main-navigation ul ul a {
    width: 200px;
}

.main-navigation ul ul li {

}

.main-navigation li:hover > a,
.main-navigation li.focus > a {
}

.main-navigation ul ul :hover > a,
.main-navigation ul ul .focus > a {
}

.main-navigation ul ul a:hover,
.main-navigation ul ul a.focus {
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
    left: auto;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
    left: 100%;
}

.main-navigation .current_page_item > a,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_ancestor > a,
.main-navigation .current-menu-ancestor > a {
}

/* Small menu. */
.main-navigation.toggled ul {
    display: block;
}

.menu-toggle {
    display: none;
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
    margin: 0 0 1.5em;
    overflow: hidden;
}

.posts-navigation {
    width: 100%;
    clear: both;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous,
.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
    color: #778ea8;
    border: 2px solid #cfdae6;
    padding: 10px 22px 8px 22px;
    display: table;
    clear: both;
    text-align: center;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    margin: 5px auto 10px auto;
    float: none;
    transition: 0.2s;
}

.comment-navigation .nav-previous a,
.posts-navigation .nav-previous a,
.post-navigation .nav-previous a,
.comment-navigation .nav-next a,
.posts-navigation .nav-next a,
.post-navigation .nav-next a {
    color: #778ea8;
}

.comment-navigation .nav-previous:hover,
.posts-navigation .nav-previous:hover,
.post-navigation .nav-previous:hover,
.comment-navigation .nav-next:hover,
.posts-navigation .nav-next:hover,
.post-navigation .nav-next:hover {
    transition: 0.2s;
    transform: scale(1.05,1.05);
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000; /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
    outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
    display: inline;
    float: left;
    margin-right: 1.5em;
}

.alignright {
    display: inline;
    float: right;
    margin-left: 1.5em;
}

.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after {
    content: "";
    display: table;
    table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after {
    clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
    margin: 0 0 1.5em;
}

/* Make sure select elements fit in widgets. */
.widget select {
    max-width: 100%;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
    display: block;
}

.hentry {
    margin: 0 0 1.5em;
}

.byline,
.updated:not(.published) {
    display: none;
}

.single .byline,
.group-blog .byline {
    display: inline;
}

.page-content,
.entry-content,
.entry-summary {
    margin: 1.5em 0 0;
}

.page-links {
    clear: both;
    max-width: 700px;
    margin: 1em auto;
    font-weight: 500;
}

.page-links a {
    margin: 0px 5px;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
    word-wrap: break-word;
}

.bypostauthor {
    display: block;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation, /* Older / Newer Posts Navigation (always hidden) */
.infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */
    display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
    display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
    border: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
    width: 100%;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
    margin-bottom: 1.5em;
    max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption .wp-caption-text {
    margin: 0.8075em 0;
}

.wp-caption-text {
    text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
    margin-bottom: 1.5em;
}

.gallery-item {
    display: inline-block;
    text-align: center;
    vertical-align: top;
    width: 100%;
}

.gallery-columns-2 .gallery-item {
    max-width: 50%;
}

.gallery-columns-3 .gallery-item {
    max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
    max-width: 25%;
}

.gallery-columns-5 .gallery-item {
    max-width: 20%;
}

.gallery-columns-6 .gallery-item {
    max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
    max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
    max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
    max-width: 11.11%;
}

.gallery-caption {
    display: block;
}

/* Begin custom styles */
.logo img{
    width: 110px;
    height: auto;
}

.logo {
    float: left;
    display: inline-block;
    margin-top: 20px;
    transition: 0.2s;
}


.blog-layout-new .site-header, .page-template-video-template .site-header, .page-template-case-template .site-header {
    position:relative;
}

body.home .postBottomCallout, body.category .postBottomCallout {
    display: none;
}

.screenshot {
    max-width: 480px !important;
    box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.1);
}

@media screen and (min-width: 897px) {
    .blog-layout-new .site-header nav ul li a, .page-template-video-template .site-header nav ul li a, .page-template-case-template .site-header nav ul li a {
        color: #404040 !important;
    }
    .blog-layout-new .site-header nav ul ul li a:hover, .page-template-video-template .site-header nav ul ul li a:hover, .page-template-case-template .site-header nav ul ul li a:hover {
        color: #ffffff !important;
    }
}
.blog-layout-new .icon-logo, .page-template-video-template .icon-logo, .page-template-case-template .icon-logo {
    background-image: url("./img/logo-dark.svg");
}
.blog-layout-new .nav_dropdown_ul, .page-template-video-template .nav_dropdown_ul, .page-template-case-template .nav_dropdown_ul {
    -webkit-box-shadow: 0 0 30px rgba(0,0,0,.1);
    box-shadow: 0 0 30px rgba(0,0,0,.1);
}

.featured_article {
    color: #fff;
    text-align: center;
    padding: 125px 0px 125px 0px;
    position:relative;
    background-size: cover !important;
}
.featureTextContainer {
    z-index:10;
    position:relative;
}

.featured_article span {
    text-transform: uppercase;
    color: rgba(255,255,255,0.6);
    font-size: 13px;
    letter-spacing: 2px;
    display: inline-block;
    margin-bottom: 15px;
    -webkit-font-smoothing: auto;
    font-smoothing: auto;
}

.featured_article h1, .post_header h1 {
    font-size: 54px;
    margin: 0 auto;
    max-width: 860px;
    line-height: 1.3em;
	text-transform: none;
}

.featured_article a {
    color: #fff;
    background: transparent;
    border-radius: 4px;
    border: 2px solid #fff;
    padding: 12px 20px 10px 20px;
    display: inline-block;
    text-decoration: none;
    transition: 0.2s;
    text-transform: uppercase;
    font-size: 13px;
}

.featured_article a:hover {
    transition: 0.2s;
    transform: scale(1.05,1.05);
}

.featured_article p {
    line-height: 1.8em;
    max-width: 750px;
    font-size: 18px;
    margin: 0 auto;
    margin-top: 5px;
    margin-bottom: 35px;
}

.featured_article p a {
    border: 0px;
    padding: 0px;
    text-transform: none;
    line-height: 1.8em;
    font-size: 18px;
    pointer-events: none;
    cursor: default;
}

.featured_article p a:hover {
    transition: 0s;
    transform: scale(1,1);
}

#main {
    max-width: 1200px;
    margin: 0 auto;
}

body.home .site-main article, body.category .site-main article, body.home .site-main article, body.category .site-main article {
    width: 33.3%;
    margin-bottom: 70px;
    box-sizing: border-box;
    padding: 0px 45px;
    /*
    max-height: 380px;
    height: 400px;
    overflow: hidden;
    float: left;*/
}
.blog-layout .site-main {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

body.home .site-main article .postImgLInk, body.category .site-main article .postImgLInk, .otherPosts .postImgLInk {
    display: inline-block;
    max-height: 220px;
    overflow: hidden;
    width: 100%;
    margin-bottom: 5px;
    outline: 0;
}
.postimgwrapper {
    position:relative;
}
.postimgwrapper img {
    display:block;
    width:auto;
}

body.home .site-main article .postImgLInk:hover, body.category .site-main article .postImgLInk:hover, .otherPosts .postImgLInk:hover {
    transition: 0.2s;
    transform: scale(1.03,1.03);
}

h2.entry-title, .otherPosts h3 {
    line-height: 1.4em;
    font-size: 24px;
    margin-top: 5px;
    margin-bottom: 4px;
}

.entry-title a {
    text-decoration: none;
    color: #30aade;
    transition: 0.2s;
    font-weight: 500;
}

.entry-title a:hover {
    color: #0084bd;
    transition: 0.2s;
}

.cat_filters {
    border-bottom: 1px solid #eaeaea;
    padding: 13px 0px;
    background: #fff;
    width: 100%;
}

.cat_filters ul {
    max-width: 1200px;
    margin: 0 auto;
    display: table;
    padding-left: 0px;
    text-align:center;
}

.cat_filters ul li {
    list-style: none;
    display: inline;
    text-align: center;
    padding: 0px 20px;
}

.cat_filters ul li a {
    color: #909090;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 11.5px;
    letter-spacing: 1px;
}

.cat_filters ul li a:hover, .cat_filters ul li a.active {
    color: #30aade;
}

body.home article .article_meta_date, article .article_meta_cat a, body.single-post .article_meta_date,  body.single-post .article_meta_cat a, body.category .article_meta_date,  body.category .article_meta_cat a {
    color: #9a9a9a;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
    pointer-events: none;
    text-decoration: none;
    line-height: 1.15rem;
    display: inline-block;
}

header.entry-header img, .otherPosts img {
    max-height: 240px;
    outline: 0;
    transition: 0.2s;
}

body.home .site-main article .entry-content, body.category .site-main article .entry-content {
    margin-top: 0px;
}

body.home .site-main article .entry-content p, body.category .site-main article .entry-content p {
    margin-top: 10px;
    font-size: 15px;
    line-height: 1.6em;
    max-height: 75px;
    overflow: hidden;
    margin-bottom: 0px;
}

.post_header {
    color: #fff;
    text-align: center;
    padding: 150px 0px 90px 0px;
    margin-bottom: 45px;
    background-size: cover !important;
    background-position: center !important;
    background-attachment: unset !important;
}
.post_header_new {
    margin:0;
    padding:0;
    height:auto;
    color: #404040;
}

.post_header p a {
    color: #fff !important;
}
.post_header_new p a {
    color: #30aade !important;
}
.post_header p a:hover {
    color: #fff !important;
    opacity:.8;
    text-decoration: none !important;
}
.post_header_new p a:hover {
    color: #0084bd !important;
}
.header-new-image {
    max-width:1048px;
    margin:50px auto 50px auto;
    -webkit-box-shadow: 0 .5rem 2rem rgba(0,0,0,.25)!important;
    box-shadow: 0 .5rem 2rem rgba(0,0,0,.25)!important;
    position:relative;
    display:inline-block;
}

.post_header_new .header-new-image {
    margin: 110px auto 50px auto;
}

@media screen and (max-width: 1100px) {
    .header-new-image {
        max-width:90vw;
    }
}
@media screen and (max-width: 896px) {
    .header-new-image {
        margin:20px auto 50px auto;
    }
}
.header-new-image img {
    display:block;
}
.gradient-overlay {
    background-color:#33eeff;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

body.single-post article, .comments-area, .share_article {
    /* 
    max-width: 700px;
    margin: 0 auto;
    */
}

body.single-post article p {
    line-height: 2em;
    font-size: 18px;
    max-width: 700px;
    margin: 0px auto 40px auto;
}

.video-iframe {
    width: 100%;
    max-width: 640px !important;
}

.app-store {
    width: 200px !important;
}

body.single-post article h2, body.single-post article h3, body.single-post article h4, body.single-post article h5, body.single-post article h6 {
    line-height: 1.4em;
    margin: 50px auto 40px auto;
    width: 100%;
    max-width: 700px;
}

body.single-post ol, body.single-post ul {
    max-width: 700px;
    margin: 0px auto 40px auto;
}

body.single-post article h2 {font-size: 35px; font-weight: 500;}
body.single-post article h3 {font-size: 25px; font-weight: 500;}
body.single-post article h4 {font-size: 20px; font-weight: 600;}
body.single-post article h5 {font-size: 20px; font-weight: 600;}
body.single-post article h6 {font-size: 20px; font-weight: 600;}

body.single-post article img {
    margin: 45px auto;
    max-width: 800px;
    display: block;
    border-radius: 10px;
}

body.single-post article figcaption {
    line-height: 1.7em;
    font-size: 14px;
    max-width: 700px;
    margin: -20px auto 40px auto;
    color: #707070;
    text-align: center;
}

body.single-post article p a {
    text-decoration: none;
}

body.single-post article p a:hover {
    color: #30aade;
    text-decoration: underline;
}

.otherPosts {
    background: #f8f8f8;
    padding: 0px 0px 55px 0px;
    float: left;
    width: 100%;
    margin-top: 50px;
}

.otherPosts h2, .share_article h2 {
    color: #797979;
    font-size: 17px;
    font-weight: 600;
    text-align: center;
    margin-top: 50px;
    margin-bottom: 45px;
    -webkit-font-smoothing: auto;
    font-smoothing: auto;
    letter-spacing: 0.3px;
}
.share_article h2 {
    text-align:left;
    margin:10px 0;
    font-size: 15px;
}

.otherPosts .container {
    max-width: 1200px;
    margin: 0 auto;
}

.otherPosts .container > div {
    max-width: 33.3%;
    box-sizing: border-box;
    float: left;
    padding: 0px 60px;
}

.otherPosts .container div h3 {
    text-decoration: none;
    color: #30aade;
    transition: 0.2s;
    font-weight: 600;
    line-height: 1.3em;
    font-size: 20px;
}

.otherPosts .container div h3 a {
    text-decoration: none;
}

.otherPosts .container div h3 a:hover {
    text-decoration: none;
    color: #0084bd;
}

.load_more {
    color: #778ea8;
    border: 2px solid #cfdae6;
    padding: 10px 22px 8px 22px;
    display: table;
    margin: 0 auto;
    clear: both;
    text-align: center;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 30px;
}

.load_more:hover {
    transform: scale(1.05,1.05);
    text-decoration: none;
    color: #778ea8;
}

.inifiniteLoader {
    margin: 0 auto;
    display: none;
    width: 43px;
    height: 43px;
    margin-bottom: 30px;
    clear: both;
    opacity: 0.6;
}

.inifiniteLoader img {
    width: 45px;
    height: auto;
    display: block;
    margin: 0 auto;
}

.fadeIn {
    animation: fadeIn 1s;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/*@keyframes fadeIn {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; }
}

.fadeIn body {
  animation-name: fadeIn;
  animation-delay: 0.5s;
  animation-duration: 0.55s;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(0.2, 0.3, 0.25, 0.9);
}*/

.fixed {
    position: fixed;
    top: 0;
    z-index: 999;
}

div#primary {
    margin-top: 55px;
}

.comments-area {
    border-top: 1px solid #ececec;
    padding: 70px 0px 70px 0px;
    margin: 45px auto 0px auto;
    max-width: 700px;
}

.comment-list {
    padding: 0px;
    margin: 0px;
    margin-bottom: 75px;
}

.comment-list li {
    list-style: none;
    margin-top: 25px;
    display: inline-block;
}

.comments-area h3 {
    margin: 0px;
}

.comment-respond {
    margin-top: 15px;
}

.comments-area p, .comments-area span, .comments-area li, .comments-area input, .comments-area textarea, .comments-area form label {
    font-size: 16px;
}

.comments-area textarea {
    max-height: 90px;
    padding: 7px;
}

.comments-area input {
    padding: 7px;
}

.comments-area form label {
    display: block;
    margin-bottom: 3px;
}

.comments-area span.says {
    display: none;
}

.comments-area .comment-author, .comments-area .comment-author a {
    float: left;
    display: inline-block;
    text-decoration: none;
    cursor: text;
    font-size: 13px;
    color: #464c4c;
}

.comment-author img {
    display: none;
}

.comments-area .comment-metadata {
    margin-left: 10px;
    float: left;
    display: inline-block;
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    max-width: 52px;
}

.comments-area .comment-metadata a {
    cursor: text;
    pointer-events: none;
    text-decoration: none;
    color: #9dacb4;
}

.comment-meta {
    display: block;
    float: left;
    width: 100%;
}

.comments-area .comment-content p {
    font-size: 16px;
    margin-bottom: 0px;
    margin-top: 3px;
}

.comment-content {
    float: left;
    width: 100%;
}

.comments-area .reply a {
    color: #9dacb4;
    text-decoration: none;
    font-size: 13px;
}

.comments-area .reply a:hover {
    text-decoration: underline;
}

.comments-area input[type="button"], .comments-area input[type="submit"] {
    font-size: 13px;
    font-weight: 500;
    padding: 10px 20px 9px 20px;
    margin-top: 5px;
}

.comments-area .comment-awaiting-moderation {
    text-align: left;
    float: left;
    width: 100%;
    color: #9dacb4;
    margin: 10px 0px 0px 0px;
    font-size: 15px;
}

.share_article {
    max-width: 700px;
    margin: 0 auto;
    padding: 30px 0px 70px 0px;
    margin-bottom: 40px;
}

.share_article a {
    display: block;
    float: left;
    width: 30px;
    height: 30px;
    margin-right: 15px;
}

.share_article .facebook {
    background: url('img/icon_facebook.svg') no-repeat 50% 50%;
    background-size: 30px 30px;
}

.share_article .twitter {
    background: url('img/icon_twitter.svg') no-repeat 50% 50%;
    background-size: 30px 30px;
}

.share_article .pinterest {
    background: url('img/icon_pinterest.svg') no-repeat 50% 50%;
    background-size: 30px 30px;
}

.share_article a:hover {
    transform: scale(1.06,1.06);
}

.ss_ipad {
    float: left;
    padding: 80px 65px 47px 65px;
    border: 3px solid #a0a0a0;
    border-radius: 20px;
    margin: 20px 0px 60px 0px;
    background: black;
    box-shadow: 0px 0px 14px 4px rgba(0,0,0,0.1);
}

.ss_ipad img {
    border: 2px solid #272727;
    padding: 0px !important;
}

.ss_ipad:after {
    content: '';
    display: block;
    width: 45px;
    height: 45px;
    background: #000;
    border-radius: 100%;
    margin: 0 auto;
    position: relative;
    top: 27px;
    border: 1px solid #272727;
}

.ss_ipad2 {
    border: 2px solid #a0a0a0;
    padding: 30px;
    margin: 60px auto 60px auto;
    border-radius: 20px;
    max-width: 450px;
}

.ss_ipad2 img {
    padding: 0px !important;
    margin: 0px !important;
    transform: none !important;
    border: 2px solid #a0a0a0;
    width: 100% !important;
}

.ss_web {
    border: 1px solid #bfbfbf;
    padding: 25px 0px 0px 0px;
    margin: 60px auto;
    max-width: 800px;
    border-radius: 7px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.ss_web img {
    padding: 0px !important;
    margin: 0px !important;
    transform: none !important;
    border-top: 1px solid #bfbfbf;
    width: 100% !important;
    max-width: 800px !important;
}

.sidebyside {
    display: inline-flex;
    margin: auto;
    justify-content: center;
    flex-wrap: wrap;
}

.sidebyside div {
    width: 48%;
    padding: 15px !important;
    border-radius: 15px;
    min-width: 300px;
    margin-top: 25px;
}

.sidebyside h5 {
    margin: 0 auto;
    display: block;
    text-align: center;
    margin-bottom: 10px !important;
    margin-top: 10px !important;
    font-weight: 500 !important;
}

.postBottomCallout {
    max-width: 700px;
    margin: 60px auto 0px auto;
    padding: 30px 30px 40px 30px;
    box-sizing: border-box;
    background: #eaf6fa;
    border-radius: 10px;
    transform: scale(1.09,1.09);
    font-size: 16px;
}

.postBottomCallout p {
    margin-bottom: 0px !important;
    font-size: 16px !important;
}

.postBottomCallout a {
    margin-top: 25px;
    padding: 4px 27px;
}

#sb-category-page-header {
    background: #30aade;
    background: -moz-linear-gradient(139deg, #3074de 0%, #b332e5 100%);
    background: -webkit-linear-gradient(139deg, #3074de 0%, #b332e5 100%);
    background: linear-gradient(139deg, #3074de 0%, #b332e5 100%);
    color: #fff;
    padding: 100px 0px 50px 0px;
}

.sb-container {
    text-align: center;
}

.sb-container h1 {
    font-weight: 600;
}

body.single.single-post .blog-layout-old header#sb_site_header {
    background: #ffffff;
}

@media screen and (max-width: 1230px) {
    .container {padding: 0px 3%;}
}

@media screen and (max-width: 1070px) {
    body.home .site-main article .entry-content p, body.category .site-main article .entry-content p {height: 53px; max-height: 53px;}
    .otherPosts .container div {padding: 0px 30px;}
}

@media screen and (max-width: 990px) {
    header.entry-header img, .otherPosts img {max-height: none; height: auto;}
    body.home .site-main article, body.category .site-main article, body.home .site-main article, body.category .site-main article {width: 50%;}
    body.home .site-main article .entry-content p, body.category .site-main article .entry-content p {height: 68px; max-height: 68px;}
    .blog-layout-old .post_header {padding: 140px 0px 50px 0px;}
}

@media screen and (max-width: 800px) {
    .featured_article h1, .post_header h1 {font-size: 3.5em; max-width: 90%;}
    .featured_article p {max-width: 90%;}
}

@media screen and (max-width: 760px) {
    .cat_filters ul li {padding: 0px 10px;}
    body.home .site-main article, body.category .site-main article, body.home .site-main article, body.category .site-main article {padding: 0px 30px;}
    body.single-post article, .comments-area, .share_article {width: 90%; max-width: 90%; margin: 0 auto;}
    body.single-post article p {font-size: 17px;}
    .otherPosts .container div {padding: 0px 20px;}
    body.single-post article img {padding: 20px 0px; width: 100%; box-sizing: border-box;}
    .ss_web, .sidebyside {max-width: 100%;}
}

@media screen and (max-width: 660px) {
    body.home .site-main article .entry-content p, body.category .site-main article .entry-content p {height: 53px; max-height: 53px;}
    .cat_filters {display: none;}
}

@media screen and (max-width: 540px) {
    .featured_article h1, .post_header h1 {font-size: 2.3em;}
    .featured_article p {font-size: 16px;}
    .featured_article {padding: 125px 0px 100px 0px;}
    body.home .site-main article, body.category .site-main article, body.home .site-main article, body.category .site-main article {width: 90%; float: none; margin: 0 auto; margin-bottom: 70px; height: auto; max-height: none;}
    body.home .site-main article .entry-content p, body.category .site-main article .entry-content p {height: 68px; max-height: 68px;}
    .otherPosts .container div {width: 80%; max-width: 80%; padding: 0px; margin: 50px auto; float: none;}
}

@media screen and (max-width: 400px) {
    body.home .site-main article, body.category .site-main article, body.home .site-main article, body.category .site-main article {padding: 0px;}
    .main-navigation li:first-child {display: none;}
    .ss_ipad2 {padding: 20px;}
}

@media screen and (max-width: 370px) {
    .site-header nav {margin-top: 23px;}
    .featured_article h1, .post_header h1 {font-size: 2em;}
    .post_header p {width: 95%; margin: 0 auto; margin-top: 13px;}
}

/* Start Additional Utility Classes*/
.font-size-sm {
    font-size: .8em;
}
/*End Additional Utility Classes*/
/*Start Footer*/
.feat_footer {
    margin-top:50px;
    padding: 160px 0px;
    text-align: center;
    background: #30aade;
    background-image: url(./img/bg_home_startNow.png),
        linear-gradient(90deg, #0065af 0%, #008ad5 100%);
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    color: #fff;
}
.feat_footer .container {
    overflow: visible;
    position: relative;
    z-index: 1;
}
.feat_footer .container h1 {
    color: #fff;
    font-size: 3.3em;
    max-width: 700px;
    margin: 0 auto 30px auto;
    line-height: 1.28em;
}
.feat_footer p {
    max-width:600px;
    margin:0 auto 50px auto;
}
.feat_footer .container a.btn_square_blue {
    transform: scale(1.3, 1.3);
    background: linear-gradient(135deg, #fdd972 0%, #d66d4d 83%);
}
.feat_footer .container a.btn_square_blue:hover {
    background: linear-gradient(135deg, #f3ce67 0%, #dc633f 83%);
    transform: scale(1.33, 1.33);
}
.feat_footer:after {
    content: "";
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    background: linear-gradient(80deg, #00497e 0%, #1fa0e7 100%);
    opacity: 0.5;
    pointer-events: none;
}

.feat_footer form {
    max-width: 450px;
    margin: 0 auto;
}
.feat_footer form label {
    display:none;
}
.feat_footer form .hs-form-field > label {
    display:block;
    text-align:left;
    font-size:.9em;
    line-height: 1.2em;
    margin-bottom: 5px;
}
.feat_footer form input {
    width: 100% !important;
    padding: 13px 13px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    box-sizing: border-box;
    border: none;
    font-size: 0.9rem;
    color: #fff;
}
.feat_footer form input::placeholder {
    color: rgba(255, 255, 255, 0.7);
}
.feat_footer form input[type="submit"] {
    background: linear-gradient(135deg, #fdd972 0%, #d66d4d 83%);
    color: #fff;
    font-size: 1.15rem;
    border-radius: 7px;
    font-weight: 500;
    width: auto !important;
    padding: 15px 40px;
    outline: 0;
    cursor: pointer;
    transition: 0.2s;
}
.feat_footer form input[type="submit"]:hover {
    transform: scale(1.05, 1.05);
    transition: 0.2s;
}
.feat_footer form .hs-form-field {
    position: relative;
    text-align:left;
}
.feat_footer form fieldset .hs-error-msgs {
    display: none;
    color: #c90707;
    position: absolute;
    top: 40px;
    right: 10px;
}
.feat_footer form li.hs-form-booleancheckbox {
    display: inline-block;
    list-style: none;
    width: 100%;
    float: left;
    padding-bottom: 15px;
    margin-bottom: 7px;
}
.feat_footer form .hs_error_rollup {
    display: none;
}
.feat_footer form li.hs-form-booleancheckbox label {
    display: inline;
    text-align: left !important;
    cursor: pointer;
    color: #fff;
}
.feat_footer form li.hs-form-booleancheckbox input {
    display: inline-block;
    float: left !important;
    width: auto !important;
    margin: 8px 10px 0px 0px;
    border: none;
    border-radius: 2px;
}
.feat_footer form li.hs-form-booleancheckbox span {
    text-align: left !important;
    font-weight: 300;
    text-transform: none;
    font-size: 0.9rem;
    float: left;
    letter-spacing: 0px;
}
.feat_footer form input[type="text"]:focus,
.feat_footer form input[type="email"]:focus,
.feat_footer form input[type="tel"]:focus,
.feat_footer form select:focus,
.feat_footer form textarea:focus {
    outline: 0;
    font-size: 1.15rem;
    transition: 0.2s;
}

.feat_footer select, .feat_footer input {
    margin-bottom: 15px;
}

.feat_footer select {
    width: 100% !important;
    padding: 15px 10px;
    transition: 0.25s;
    border: 1px solid transparent;
    border-radius: 4px;
    outline: none;
    background-color: rgba(255, 255, 255, 0.2);
    color: #fff;
    font-family: 'Montserrat', Helvetica, sans-serif;
    font-size: 0.9rem;
    font-weight: 300;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.feat_footer select option {
    color: #000;
}

.feat_footer select::placeholder {
    color: rgba(255,255,255, .15);
}

.hs_i_accept_marketing_promotions ul {
    padding: 0px;
    margin: 1em 0px;
}
/*End Footer*/

/* Begin Case Study Form Styles */
.case_study_form {
    margin: 20px 0px 30px 0px;
}

.case_study_form form {
    margin-bottom: 20px;
    width: 370px;
    position: relative;
    height: 65px;
    text-align: left;
}

.case_study_form form label {
    font-weight: 500;
    font-size: 0.8rem;
    padding-left: 0px;
    font-style: normal;
}

.case_study_form form span {
    padding-left: 0px;
    font-size: 0.8rem;
}

.case_study_form .submitted-message p {
    line-height: 1.5em;
}

.case_study_form .submitted-message p a {
    color: #e78e00;
    text-decoration: underline;
    font-size: 18px;
    line-height: 1.5em;
}

.case_study_form .submitted-message p a:hover {
    text-decoration: none;
    color: #e78e00;
}

.case_study_form form input {
    border-radius: 4px;
    border: 1px solid #dddddd;
    font-size: 0.9rem;
    padding: 5px 10px;
    box-sizing: border-box;
    display: block;
    width: 270px;
    float: left;
    outline: 0;
}

.case_study_form form input[type="submit"] {
    background: #30aade;
    color: #fff;
    box-shadow: 0px 5px 0px 0px #1287b9;
    border: none;
    outline: 0;
    padding: 4px 15px;
    font-weight: 500;
    margin: 0px;
    cursor: pointer;
    transition: 0.2s;
    width: auto;
    position: absolute;
    right: 0;
}

.case_study_form form input[type="submit"]:hover {
    transform: scale(1.03,1.03);
    transition: 0.2s;
}

.case_study_form form .hs_error_rollup ul li label {
    font-size: 0.7rem;
    color: #e78e00;
    font-weight: 400;
    line-height: 15px;
}

.case_study_form form .hs-error-msgs {
    margin: 0px;
    padding: 0px;
    width: 100%;
    float: left;
}

.case_study_form form .hs-error-msgs li {
    margin: 0px;
    line-height: 15px;
    list-style: none;
}

.case_study_form form .hs-error-msgs li label {
    font-size: 0.7rem;
    color: #e78e00;
    font-weight: 400;
    line-height: 15px;
}

.case_study_form form .hs-error-msgs li label:before {
    display: none;
}

.case_study_form form .hs_email .hs-error-msgs {
    display: none !important;
    opacity: 0;
    position: absolute;
}

@media screen and (max-width: 490px) {
    .case_study_form form input, .case_study_form form input[type="submit"] {width: 100%;}
    .case_study_form form {width: 100%; height: 130px;}
    .case_study_form form input[type="submit"] {position: relative; margin-top: 10px;}
    .case_study_form form .hs-error-msgs li {padding-bottom: 0px;}
}
/* End Case Study Form Styles */

.resourcePageContainer {
    background: #f8f6f4;
}

.resourcePageContainer h1.entry-title {
    text-align: center;
    font-size: 50px;
    font-weight: bold;
    line-height: 1.3em;
    max-width: 860px;
    margin: 75px auto 25px auto;
    position: relative;
    z-index: 1;
}

.resourcePageContainer header .header-new-image {
    margin: 0 auto;
    float: none;
    border-radius: 10px;
    display: block;
    position: relative;
    z-index: 1;
    height: 587px;
    cursor: pointer;
    transition: 0.2s;
}

.videoPageContainer header .header-new-image:after {
    content: '';
    display: block;
    background: url(img/icon_video_play.svg) no-repeat 50% 50%;
    background-size: 130px auto;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    transition: 0.2s;
}

.videoPageContainer header .header-new-image:hover:after {
    transition: 0.2s;
    background: url(img/icon_video_play.svg) no-repeat 50% 50%;
    background-size: 145px auto;
}



.resourcePageContainer header {
    padding-top: 50px;
    background: #f8f6f4;
    position: relative;
}

.resourcePageContainer header:after {
    background: #fff url(img/bg_confetti.svg) repeat-y 0% 0%;
    background-size: cover;
    content: '';
    display: block;
    position: absolute;
    top: -30px;
    left: 0;
    width: 100%;
    height: 550px;
    border-bottom: 1px solid #dcdcdc;
    z-index: 0;
}

.resourcePageContainer h2, .resourcePageContainer h3, .resourcePageContainer h4, .resourcePageContainer h5, .resourcePageContainer h6 {
    line-height: 1.5em;
}

.resourcePageContainer h2 {
    font-size: 2em;
}

.resourcePageContainer h3 {
    font-size: 1.7em;
}

.resourcePageContainer h4 {
    font-size: 1.5em;
}

.resourcePageContainer h5 {
    font-size: 1.2em;
}

.resourcePageContainer h6 {
    font-size: 1em;
}

.resourcePageContainer .entry-content {
    margin: 0px;
}

.resourcePageContainer .entry-content p {
    line-height: 2.2em;
    margin: 30px 0px;
}

.resourcePageContainer article {
    margin: 0 auto 50px auto;
    max-width: 800px;
    float: none;
    display: block;
}

.resourcePageContainer .wp-block-image {
    margin: 0 auto;
    float: none;
}

.video1_overlay, .video2_overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 999;
    opacity: 0;
    left: -100%;
    top: 0;
    transition: opacity .5s;
    -webkit-transition: opacity .5s;
}

.video1_overlay .vid_container, .video2_overlay .vid_container {
    width: 100%;
    height: 100.5%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    border-radius: 10px;
    overflow: hidden;
}

.noShadow {
    background: transparent !important;
    box-shadow: none !important;
}

.video1_overlay .vid_container iframe#video1, .video2_overlay .vid_container video {
    width: 100%;
    border: none;
    outline: 0;
    border-radius: 10px;
}

.video2_overlay .vid_container video {
    height: auto;
}

.video1_overlay .vid_container .fluid-width-video-wrapper, .video2_overlay .vid_container .fluid-width-video-wrapper {
    height: 100%;
}

/* Begin New Callouts CSS */
.callout_1, .callout_2 {
    background: #fcfaed;
    background-size: cover;
    border-radius: 15px;
    padding: 60px 70px;
    box-sizing: border-box;
    max-width: 800px;
    margin: 40px auto;
    position: relative;
}

.callout_1:before, .callout_2:before {
    content: '';
    display: block;
    pointer-events: none;
    background: url('img/squiggles_bottom_left.svg') no-repeat 0% 100%;
    background-size: 230px auto;
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: -14px;
    left: -3%;
}

.callout_1:after, .callout_2:after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    pointer-events: none;
    background: url('img/squiggles_bottom_right.svg') no-repeat 100% 100%;
    background-size: 220px auto;
    bottom: -9px;
    right: 1%;
}

.callout_1 span.top_left, .callout_2 span.top_left {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    pointer-events: none;
    background: url('img/squiggles_top_left.svg') no-repeat 0% 0%;
    background-size: 200px auto;
    top: -16px;
    left: -2%;
}

.callout_1 span.top_right, .callout_2 span.top_right {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    pointer-events: none;
    background: url('img/squiggles_top_right.svg') no-repeat 100% 0%;
    background-size: 220px auto;
    top: -13px;
    left: 6%;
}

body.single-post .callout_1 h1, body.single-post .callout_1 h2, body.single-post .callout_1 h3, body.single-post .callout_1 h4, body.single-post .callout_1 h5, body.single-post .callout_1 h6 {
    margin: 0px 0px 30px 0px;
}

body.single-post .callout_1 p, body.single-post .callout_2 p {
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 1.85em;
}

body.single-post .callout_1 p:last-child {
    margin-bottom: 0px;
}

.callout_1 form {
    margin: 40px 0px 20px 0px;
    width: 100%;
    position: relative;
    height: 65px;
    text-align: left;
}

body.single-post .callout_1 form span {
    font-weight: 600;
    font-size: 0.85rem;
}

.callout_1 .submitted-message p, .callout_2 .submitted-message p {
    line-height: 1.5em;
}

.callout_1 .submitted-message p {
    margin-top: 20px;
}

.callout_1 .submitted-message p a, .callout_2 .submitted-message p a {
    color: #e78e00;
    text-decoration: underline;
    font-size: 16px;
    line-height: 1.5em;
}

.callout_1 .submitted-message p a:hover, .callout_2 .submitted-message p a:hover {
    text-decoration: none;
    color: #e78e00;
}

.callout_1 form input {
    border-radius: 4px;
    border: 1px solid #dddddd;
    font-size: 0.9rem;
    padding: 7px 10px;
    box-sizing: border-box;
    display: block;
    width: 80%;
    float: left;
    color: #848484;
    outline: 0;
}

.callout_1 form input:focus, .callout_2 form input:focus {
    color: #6d6d6d;
}

.callout_1 form input[type="submit"] {
    background: #30aade;
    color: #fff;
    border: none;
    outline: 0;
    padding: 8px 18px;
    font-weight: 500;
    margin: 0px;
    cursor: pointer;
    transition: 0.2s;
    width: auto;
    position: absolute;
    right: 0;
}

.callout_1 form input[type="submit"]:hover, .callout_2 form input[type="submit"]:hover {
    transform: scale(1.03,1.03);
    transition: 0.2s;
}

.callout_1 form .hs_error_rollup ul li label, .callout_2 form .hs_error_rollup ul li label {
    font-size: 0.7rem;
    color: #e78e00;
    font-weight: 400;
    line-height: 15px;
}

.callout_1 form .hs-error-msgs, .callout_2 form .hs-error-msgs {
    margin: 3px 0px 0px 0px;
    padding: 0px;
    width: 100%;
    float: left;
}

.callout_1 form .hs-error-msgs li, .callout_2 form .hs-error-msgs li {
    margin: 0px;
    line-height: 15px;
    list-style: none;
}

.callout_1 form .hs-error-msgs li label, .callout_2 form .hs-error-msgs li label {
    font-size: 0.7rem;
    color: #e78e00;
    font-weight: 400;
    line-height: 15px;
}

.callout_1 form .hs-error-msgs li label:before, .callout_2 form .hs-error-msgs li label:before {
    display: none;
}

.callout_1 form .hs_email .hs-error-msgs, .callout_2 form .hs_email .hs-error-msgs {
    display: none !important;
    opacity: 0;
    position: absolute;
}

@media screen and (max-width: 680px) {
    .callout_1 form input {width: 70%;}
}


@media screen and (max-width: 520px) {
    .callout_1 form input {width: 65%;}
}

@media screen and (max-width: 470px) {
    .callout_1 form input {width: 100%;}
    .callout_1 form input[type="submit"], .callout_2 form input[type="submit"] {width: 100% !important; position: relative; margin-top: 10px !important;}
    .callout_1 form {height: 140px; margin-top: 30px; overflow: visible;}
    .callout_1 form .hs-error-msgs li, .callout_2 form .hs-error-msgs li {padding-bottom: 0px;}
    .callout_1, .callout_2 {padding: 50px 40px 50px 40px;}
    .callout_1:before, .callout_2:before {background-size: 150px auto; bottom: -5px;}
    .callout_1 span.top_left, .callout_2 span.top_left {background-size: 140px auto; left: -5%; top: -18px;}
    .callout_1 span.top_right, .callout_2 span.top_right {background-size: 150px auto; left: 15%; top: -1px}
    .callout_1:after, .callout_2:after {background-size: 150px auto;}
}

/* Callout style 2 */
.callout_2 {
    background: linear-gradient(90deg, #6200b8 0%, #2f00ff 100%);
    color: #fff;
}

body.single-post .callout_2 h1, body.single-post .callout_2 h2, body.single-post .callout_2 h3, body.single-post .callout_2 h4, body.single-post .callout_2 h5, body.single-post .callout_2 h6 {
    font-weight: 500;
    margin: 0px 0px 30px 0px;
    font-size: 30px;
}

body.single-post .callout_2 p {
    margin: 0px 0px 15px 0px;
}

body.single-post .callout_2 p:last-child {
    margin-bottom: 0px;
}

.callout_2 div.text {
    width: 47%;
    float: left;
}

.callout_2 .hbspt-form {
    width: 47%;
    float: right;
}

body.single-post .callout_2 form span {
    color: #fff;
    font-weight: 600;
    font-size: 0.85rem;
}

.callout_2 form input {
    border-radius: 4px;
    border: 1px solid #dddddd;
    font-size: 0.9rem;
    padding: 7px 10px;
    box-sizing: border-box;
    display: block;
    width: 100%;
    outline: 0;
    margin-bottom: 15px;
    color: #848484;
}

.callout_2 form input[type="submit"] {
    background: #fedc76;
    color: #000;
    border: none;
    outline: 0;
    padding: 8px 18px;
    font-weight: 500;
    cursor: pointer;
    transition: 0.2s;
    width: auto;
    float: right;
    margin: 5px 0px 0px 0px;
}

.callout_2 form .hs-error-msgs li label {
    color: #f3be6a !important;
}

.callout_2 form .hs-error-msgs {
    opacity: 0 !important;
    position: absolute !important;
}

.callout_2 form .hs_error_rollup .hs-error-msgs {
    opacity: 10 !important;
    position: relative !important;
    margin-top: -10px;
}

.callout_2 .submitted-message p a {
    color: #ffd086;
}

@media screen and (max-width: 720px) {
    .callout_2 div.text, .callout_2 .hbspt-form {width: 100%;}
    .callout_2 .hbspt-form {margin-top: 20px;}
}

@media screen and (max-width: 470px) {
    .callout_2 .hbspt-form {margin-bottom: 15px;}
}

/* Callout style 3 */
.callout_3 {
    background: #fafafa;
    border-radius: 15px;
    box-sizing: border-box;
    padding: 60px;
    max-width: 800px;
    margin: 40px auto;
    position: relative;
    overflow: hidden;
    border: 1px solid #ececec;
}

.callout_3:after {
    content: '';
    display: block;
    background: url(img/logo-dark.svg) no-repeat 110% 100%;
    background-size: 75% auto;
    width: 100%;
    height: 100%;
    bottom: -6%;
    left: 0;
    position: absolute;
    opacity: 0.03;
    pointer-events: none;
}

body.single-post .callout_3 p {
    margin: 0px;
    font-size: 17px;
    font-weight: 600;
    z-index: 10;
    position: relative;
}

body.single-post .callout_3 a {
    background: #30aade;
    color: #fff;
    border-radius: 4px;
    padding: 12px 25px 12px 25px;
    font-weight: 500;
    margin: 20px 0px 0px 0px;
    display: inline-block;
    transition: 0.2s;
    z-index: 10;
    position: relative;
    line-height: 1.5em;
    text-align: center;
}

body.single-post .callout_3 a:hover {
    transform: scale(1.03,1.03);
    transition: 0.2s;
}

@media screen and (max-width: 640px) {
    .callout_3, .callout_4 {padding: 40px 30px !important;}
}

@media screen and (max-width: 490px) {
    .callout_3:after {background-size: auto 75%; left: 20%; background-position: 0 100%;}
}

/* Callout style 4 */
.callout_4 {
    background: #fafafa;
    border-radius: 15px;
    box-sizing: border-box;
    color: #15455a;
    padding: 40px 60px;
    max-width: 800px;
    margin: 40px auto;
    position: relative;
    border: 1px solid #ececec;
}

body.single-post .callout_4 p {
    margin: 0px;
    font-family: Georgia, serif;
    color: #15455a;
    font-size: 22px;
    display: block;
    line-height: 1.75em;
    font-weight: 600;
}

body.single-post .callout_4 span {
    margin-top: 25px;
    padding-top: 25px;
    display: block;
    width: 100%;
    position: relative;
    font-size: 17px;
}

body.single-post .callout_4 span:before {
    display: block;
    content: '';
    position: absolute;
    width: 200px;
    height: 2px;
    background: #c7d0d3;
    top: 0;
    left: 0;
}

.wp-block-embed {
    max-width: 700px;
    margin: 0px auto 40px auto;
}

/* Styles for vimeo widget embed */
.wp-block-embed.is-type-video {
    max-width: 800px;
    position: relative;
    overflow: unset;
    height: 450px;
    margin: 70px auto 95px auto;
}

.wp-block-embed.is-type-video .wp-block-embed__wrapper {
    width: 100%;
    height: 100%;
}

.wp-block-embed.is-type-video .wp-block-embed__wrapper iframe {
    width: 100%;
    height: 100%;
    max-width: unset;
}

.wp-block-embed.is-type-video figcaption {
    max-width: 800px;
    margin: 15px 0px 0px 0px;
}

/* Begin New 404 CSS */
body.error404 #header_iframe_container, body.error404 #footer_iframe_container, body.error404 .a2a_kit {
    display: none;
}

.container_404 {
    background: linear-gradient(90deg, #6200b8 0%, #2f00ff 100%);
    width: 100%;
    height: 100%;
    position: fixed;
}

.container_404:after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: url('https://www.simplebooth.com/img/ebook_ch7.svg') no-repeat 130% 0%;
    background-size: auto 100%;
}

.container_404 .text_container {
    color: #fff;
    height: 90%;
    width: 48%;
    background: rgba(47,26,117,0.8);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 30px;
    box-sizing: border-box;
    border-radius: 10px;
    padding: 0px;
    z-index: 10;
}

.container_404 .text_container:before {
    content: '';
    display: block;
    position: absolute;
    background: url(img/squiggles_404_top.svg) no-repeat 0% 0%;
    background-size: 100% auto;
    width: 103%;
    height: 100%;
    top: -11px;
    left: -11px;
}

.container_404 .text_container:after {
    content: '';
    display: block;
    position: absolute;
    background: url('img/squiggles_404_bottom.svg') no-repeat 0% 100%;
    background-size: 100% auto;
    width: 103%;
    height: 100%;
    bottom: -11px;
    left: -10px;
}

.container_404 .text {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    box-sizing: border-box;
    padding: 30px 70px;
    z-index: 10;
}

.container_404 .logo {
    display: block;
    margin-top: 0px;
}

.container_404 .logo img {
    display: block;
    outline: 0;
    width: 100px;
    height: auto;
    margin-bottom: 20px;
}

.container_404 .text h1 {
    font-size: 60px;
    line-height: 1.1em;
    margin: 0px 0px 20px 0px;
    font-weight: 600;
}

.container_404 .text p {
    margin: 0px;
    font-size: 1.04rem;
}

.container_404 .text p strong {
    font-weight: 600;
}

.container_404 .text a.btn  {
    background: linear-gradient(180deg, #feb55c 0%, #fa5e52 100%);
    border-radius: 5px;
    display: inline-block;
    color: #fff;
    font-weight: 500;
    padding: 15px 25px 13px 25px;
    line-height: 1.45rem;
    font-size: 1.04rem;
    transition: 0.2s;
    margin-top: 25px;
    text-align: center;
}

.container_404 .text a.btn:hover {
    transform: scale(1.03,1.03);
}

body.single-post .sb-lead-form-insert {
    background: #f8f6f4;
    padding: 45px;
    box-sizing: border-box;
    max-width: 800px;
    margin: 45px auto;
    border-radius: 20px;
}

body.single-post .sb-lead-form-insert h2 {
    margin: 0px;
    font-size: 32px;
}

body.single-post .sb-lead-form-insert p {
    margin: 5px 0px 25px 0px !important;
}

body.single-post .sb-lead-form-insert .fsBody {
    background: transparent !important;
    overflow: visible;
}

body.single-post .sb-lead-form-insert .fsBody form {
    max-width: unset !important;
}

body.single-post .sb-lead-form-insert .fsBody form input:focus, body.single-post .sb-lead-form-insert .fsBody form textarea:focus {
    color: #444 !important;
}

body.single-post .sb-lead-form-insert .fsBody button[type="submit"] {
    font-weight: 500;
}

@media screen and (max-width: 1200px) {
    .container_404:after {background-position: 180% 0%;}
}

@media screen and (max-width: 1110px) {
    .container_404:after {background-position: 390px 0%;}
}

@media screen and (max-width: 1020px) {
    .container_404 .text_container {width: 55%;}
}

@media screen and (max-width: 850px) {
    .wp-block-embed.is-type-video {
        max-width: 700px;
        height: 400px;
    }
}

@media screen and (max-width: 830px) {
    .container_404 .text_container {width: 65%;}
}

@media screen and (max-width: 740px) {
    .container_404 .text_container {width: 90%;}
    .container_404:after {display: none;}

    .wp-block-embed.is-type-video {
        height: 365px;
    }
}

@media screen and (max-width: 640px) {
    .wp-block-embed.is-type-video {
        height: 330px;
        margin: 45px auto 80px auto;
    }
}

@media screen and (max-width: 590px) {
    .wp-block-embed.is-type-video {
        height: 300px;
    }
}

@media screen and (max-width: 530px) {
    .container_404 .text_container {left: 20px;}

    .wp-block-embed.is-type-video {
        height: 275px;
        margin: 40px auto 75px auto;
    }
}

@media screen and (max-width: 480px) {
    .wp-block-embed.is-type-video {
        height: 240px;
    }
}

@media screen and (max-width: 440px) {
    .container_404 {overflow: auto;}
    .container_404 .text_container {left: unset; margin: 25px auto 0px auto; position: relative; transform: unset; top: unset; height: auto;}
    .container_404 .text h1 {font-size: 45px;}
    .container_404 .text {position: relative; top: unset; transform: unset; padding: 40px;}

    .wp-block-embed.is-type-video {
        height: 225px;
    }
}

@media screen and (max-width: 400px) {
    .wp-block-embed.is-type-video {
        height: 200px;
    }
}

@media screen and (max-width: 350px) {
    .wp-block-embed.is-type-video {
        height: 175px;
    }
}

@media screen and (max-width: 330px) {
    .container_404 .text h1 {font-size: 40px;}
}

@media screen and (min-width: 1770px) {
    .container_404:after {background-position: 125% 0%;}
}

@media screen and (max-width: 1430px) and (min-height: 860px) {
    .container_404:after {background-position: 440px 0%;}
}
/* End New 404 CSS */

/* Begin Mobile Table Styles */
.mobile_table_container {
    max-width: 1000px;
    margin: 45px auto;
    border: 1px solid #ececec;
    border-bottom: 0px;
    overflow-x: auto;
    box-sizing: border-box;
    padding: 0px;
}

.mobile_table_container figure {
    margin: 0px;
    width: 100% !important;
    display: block !important;
}

.mobile_table_container table {
    margin-bottom: 0px;
}

.mobile_table_container table thead, .mobile_table_container table tbody, .mobile_table_container table th, .mobile_table_container table td, .mobile_table_container table tr {
    font-size: 0.9rem;
    line-height: 1.2rem;
}

.mobile_table_container table th, .mobile_table_container table td {
    padding: 10px;
}

.mobile_table_container table thead th {
    font-weight: 600;
}

.mobile_table_container tbody tr:nth-child(odd) {
    background: #fbfbfb;
}

.hubspot_form_container {
    max-width: 500px;
    margin: 0 auto;
    background: rgba(255,255,255,0.45);
    border-radius: 10px;
    padding: 40px 20px 20px 40px;
    box-sizing: border-box;
}

body.single-post article .klaviyo-form {
    background: #f8f5ef;
    padding: 45px 20px;
    box-sizing: border-box;
    max-width: 800px;
    margin: 0px auto 40px auto;
    border-radius: 20px;
}

body.single-post article .klaviyo-form p {
    margin-bottom: 15px !important;
}

body.single-post article .klaviyo-form div[data-testid="form-component"] p {
    margin-bottom: 5px !important;
}

body.single-post article .klaviyo-form button {
    font-weight: 400 !important;
    transition: 0.2s;
    padding: 0px 15px !important;
}

body.single-post article .klaviyo-form button:hover {
    background: #44b7e8 !important;
    transition: 0.2s;
}

@media screen and (max-width: 1060px) {
    .mobile_table_container {max-width: 700px;}
}
/* End Mobile Table Styles */

@media screen and (max-width: 960px) {
    .resourcePageContainer header .header-new-image {height: 470px;}
    .resourcePageContainer header:after {height: 450px;}
}

@media screen and (max-width: 870px) {
    .resourcePageContainer article {padding: 0px 20px; box-sizing: border-box;}
    .resourcePageContainer h1.entry-title {padding: 0px 20px;}
}

@media screen and (max-width: 800px) {
    .resourcePageContainer header .header-new-image {height: 400px;}
    .resourcePageContainer header:after {height: 360px;}
}

@media screen and (max-width: 660px) {
    .resourcePageContainer header:after {height: 300px;}
    .resourcePageContainer header .header-new-image {height: 350px;}
}

@media screen and (max-width: 640px) {
    .video2_overlay {top: 40px;}
}

@media screen and (max-width: 540px) {
    .resourcePageContainer header:after {height: 260px; background-size: 700px;}
    .resourcePageContainer header .header-new-image {height: 300px;}
}

@media screen and (max-width: 460px) {
    .resourcePageContainer h1.entry-title {font-size: 2.6em;}
    .videoPageContainer header .header-new-image:after {background-size: 90px auto;}
    .video2_overlay {top: 60px;}
}

@media screen and (max-width: 400px) {
    .resourcePageContainer header:after {height: 210px;}
    .resourcePageContainer header .header-new-image {height: 230px;}
    .resourcePageContainer h1.entry-title {font-size: 2.2em; margin: 60px auto 15px auto;}
}

@media screen and (max-width: 340px) {
    .video2_overlay {top: 50px;}
}

a.wp-block-button__link {
    font-weight: 500;
    font-size: 16px;
    padding: 12px 30px;
}
