/*
Theme Name: Iconica.ca
Description: Theme for Iconica.ca
Version: 1.0
Author: Iconica Communications
Theme URI: iconica.ca
*/

/*Styles are ordered in the following manner. 
With the exception of mobile items, they're generally ordered from most commonly or generally used to least commonly or specifically used.
1. General styles
2. Form items (except buttons)
3. Headers
4. Footers
5. Main content block (container, Gutenberg blocks)
6. Special modifier classes
7. Widgets
8. Classes for particular page templates
9. Miscellaneous
10. Mobile
11. Block style presets

/*REMOVE THIS LINE ON SITE LAUNCH*/#mfPreviewBar {display:none;}


/* ==================================================== SECTION 1: General Styles ==================================================== */
:root {
	--main-color: #ed1c24;
}
  
html body {
	/*background-color:#f6f6f6;*/
	color:#000;
	font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:17px;
	font-weight:400;
	line-height:1.5;
  scroll-behavior: smooth;
}
body h1, 
body h2, 
body h3, 
body h4, 
body h5, 
body h6 {
	font-weight:bold;
	margin-bottom:20px;
	margin-top:0;
}
body h4,
body h5,
body h6 {
    line-height: 1.5;
}
body h1 {
	font-size: 48px;
}
body h2 {
	font-size: 35px;
}
body h3 {
    font-size: 29px;
}
body h4 {
    font-size: 24px;
}
body h5 {
    font-size: 19px;
}
body h6 {
    font-size: 14.5px;
}
body p, 
body ul,
body ol {
    margin: 0 0 20px;
}
body ul,
body ol {
	padding-left: 20px;
}
body ul {
	list-style: outside none square;
}
body li {
    padding-bottom: 3px;
}
body a {
	color:#000;
	-webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
body a:visited {
    color: #999;
}
body a:hover,
body a:active {
	color:var(--main-color);
	text-decoration:none;
}

/* ==================================================== SECTION 2: Form items (Buttons are in section 6) ==================================================== */
body input, 
body textarea,
body select {
    border-bottom: solid 1px #777;
    border-bottom-width: 1px;
    background-color: transparent;
    border-width: 0 0 1px;
	width:100%;
}
body input[type="submit"] {
	width: auto;
	border-bottom:none;
}
body form label {
	font-weight:normal;
    width: 100%;
}
body input[type="checkbox"] {
	margin-right: 8px;
    width: auto;
}

/*Contact form 7 items*/
body span.wpcf7-list-item {
    margin-left: 0;
	width:100%;
}
body span.wpcf7-list-item input[type="checkbox"] {
    width: 10%;
    display: inline-block;
    text-align: left;
    float: left;
}
body span.wpcf7-list-item .wpcf7-list-item-label {
    display: inline-block;
    width: 80%;
}

/* Contact Form 7 Submission Response items */
body div.wpcf7-response-output,
.wpcf7 form .wpcf7-response-output,
div.wpcf7-mail-sent-ok {
	margin: 0;
	color: #fff;
  	border: none !important;
  	padding: 10px 30px !important;
	background-color: #009999; /* Blue */
}
.wpcf7 form.sent .wpcf7-response-output {
	background-color: #46b450; /* Green */
}
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
div.wpcf7-mail-sent-ng,
div.wpcf7-aborted {
	background-color: var(--main-color); /* Red */
}
.wpcf7 form.spam .wpcf7-response-output,
div.wpcf7-spam-blocked {
	background-color: #f56e28; /* Orange */
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output,
div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing {
	background-color: #ffb900; /* Yellow */
}


/* ==================================================== SECTION 3: Headers ==================================================== */

header .logo {
    line-height: 42px;
}
header .logo img {
    max-width: 200px;
    max-height: 40px;
}
header .btn {
	text-transform: uppercase;
    font-weight: bold;
}

/*========= Navbar =========*/
header .navbar {
    background-color: #fff;
	border-bottom:solid 1px #eee;
	padding: 15px;
}
header .navbar .navbar-nav >li {
	float:none;
	padding-bottom:0;
}

/* The side navigation menu */
header .navbar .sidenav {
    height: 100%; 
    width: 0; 
    position: fixed; 
    z-index: 1; 
    top: 0;
    right: -40px;
    background-color: #fff; 
    overflow-x: hidden;
    transition: 0.5s; 
}
header .navbar .sidenav .sidenav_inner {
	overflow-x:hidden;
	/* overlfow-y:auto; */
	height:100%;
	position:relative;
	padding:20px;
}
header .navbar .sidenav .sidenav_inner nav {
	overflow:hidden;
}
header .navbar .sidenav ul {
	margin:20% 0 0;
    width: 100%;
}
header .navbar .sidenav li a {
    text-decoration: none;
    font-size: 17px;
    color: #000;
    display: block;
    transition: 0.3s;
    padding: 5px 0;
	text-align:right;
	text-transform:none;
}
header .navbar .sidenav li a:hover {
	background-color:transparent;
    color:var(--main-color);
}
header .navbar .sidenav .widgets {
	text-align: right;
}

/* Side menu in its opened state */
header .navbar .sidenav .open > a,
header .navbar .sidenav .open > a:hover, 
header .navbar .sidenav .open > a:focus {
	background-color:transparent;
}
header .navbar .sidenav .caret {
	display:none;
}
header .navbar .sidenav.opened {
	min-width:300px;
	right:0px;
	width:30%;
}
header .navbar .sidenav.opened ul.dropdown-menu {
    background-color: #ccc;
	border-radius: 0;
	padding: 0 10px 0;
	box-shadow:none;
}
header .navbar .sidenav.opened ul.dropdown-menu a {
    padding-left: 10px;
}

/* The close button (top right corner) */
header .navbar .sidenav .closebtn {
    display: block;
	position: relative;
	overflow: hidden;
}
header .navbar .sidenav .closebtn a {
    display: block;
	padding: 0px;
	float: right;
	font-size: 30px;
	height: 30px;
	width: 30px;
	text-align: center;
	line-height:30px;
}

/*The open button (top right corner) */
header .navbar .openbtn {
    display: block;
	height: 30px;
	position: absolute;
	top: 20px;
	right: 20px;
	font-size: 30px;
	font-weight: normal;
	width: 30px;
}
header .navbar .openbtn .icon-bar {
   	border: solid 1px black;
	margin: 3px 0 0 4px;
	display: block;
	width: 20px;
	height: 1px;
	-webkit-transition: border 0.3s ease-out;
    transition: border 0.3s ease-out;
}
header .navbar .openbtn:hover .icon-bar {
    border-color: var(--main-color);
}
header .navbar .openbtn .icon-bar:first-child {
    margin-top: 8px;
}

/*========= Other items for the header =========*/

/*Spacer used at the top to push the content down. Compensates for the fixed header*/
.top-spacer {
	display:block;
	height:73px;
}

/*Title bar*/
.title-bar {
	background-size: cover;
    padding: 100px 0 50px;
    margin-bottom: 55px;
	text-align:center;
}
.title-bar h1 {
    font-family: "HelveticaNeueLTPro-Bd",Helvetica,Arial,sans-serif;
    font-size: 70px;
    font-weight: normal;
	font-style: normal;
    line-height: 1;
    margin-bottom: 50px;
}

/* ==================================================== SECTION 4: Footers ==================================================== */

body footer,
body footer a,
body footer input {
    color: #fff;
    font-size: 13px;
    line-height: 1.7em;
}
body footer input {
    border: solid 1px #fff;
	box-sizing: border-box !important;
    background-color: transparent;
	max-width:100%;
    padding: 13px;
}
body footer .testimonials {
    padding: 65px 0;
	background-color:#e5e5e5;
    color: #000;
}
#testimonial_carousel .carousel-inner {
    width: 90%;
    margin: 0 auto;
}
#testimonial_carousel .carousel-indicators {
    bottom: -30px;
    margin-bottom: 0;
    color: #000;
}
#testimonial_carousel .carousel-indicators li {
    border: 1px solid #999;
}
#testimonial_carousel .carousel-indicators li.active {
    background-color: #999;
}
#testimonial_carousel .carousel-control {
    width: 20px;
}
#testimonial_carousel .carousel-control span {
    top: 20%;
    left: 0;
}
#clients_carousel .carousel-indicators {
    bottom: 0;
    position: static;
    margin: 20px auto 0;
}
footer .clients {
    background-color: #151515;
	padding:65px 0;
}
footer .clients h4 {
	text-align:center;
	text-transform:uppercase;
	letter-spacing: 1px;
	font-size:15px;
	font-weight:bold;
	}
footer .clients img {
    width: 100%;
    height: auto;
}
footer .footer-main, 
footer .verybottom {
    background-color: #000;
	padding:65px 0;
}
footer .verybottom {
	padding:0 0 30px;
}
footer .logo {
	margin-bottom:40px;
}
footer .logo img {
    width: 160px;
}
footer .col-md-4 {
    max-width: 100%;
    overflow-x: hidden;
}
footer h3 {
    font-size: 15px !important;
	text-transform: uppercase;
	font-weight: bold;
	margin: 0 0 20px;
	letter-spacing: 1px;
}
footer .menu {
    list-style: none;
	padding-left: 0;
	text-transform: none;
}
footer .menu li {
    padding: 0;
}
footer .menu a {
	font-size: 18px;
	line-height: 1.1em;
	padding: 5px 0;
	display: inline-block;
}
footer .menu a:hover {
    color: var(--main-color);
}
footer .wpcf7-checkbox span {
    margin: 0 0 15px;
}
footer input[type="submit"] {
    background-color: #fff;
	border-width:0px;
    color: #000;
    text-transform: uppercase;
}
footer input[type="submit"]:hover {
    background-color: var(--main-color);
	-webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
footer .sm-widget {
    text-align: left;
}
footer .sm-widget a {
	background-image: url('images/sm-sprite-reversed.png');
    margin: 0 15px 0 0;
}
/* Cloudflare turnstile box */
footer .cf7sr-g-turnstile {
  overflow: hidden;
}

/* ==================================================== SECTION 5: Main content block (container, Gutenberg blocks) ==================================================== */

body .fullpage {
	overflow:hidden;
	height: 100vh;
}
body .fullpage .wrapper-inner,
body .fullpage.wp-block-cover,
body .add_revslider_bg .wrapper-inner {
	align-items:normal;
	display:flex;
	flex-direction:column;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	padding-left:0;
	padding-right:0;
	justify-content: normal;
}
.add_revslider_bg .wrapper-inner {
  padding: 0 !important;
}
body section.main {
	margin-bottom:30px;
}
body section.main > .row {
    margin: 0;
}
body section.main .article * {
	max-width: 100%;
	height: auto;
}
body .thumbnail {
    border: none;
    border-radius: 0;
    padding:0;
	transition: opacity 0.4s;
}
body .thumbnail:hover {
	opacity: 0.85;
}
body .thumbnail img {
    width: 100%;
}

/*Wordpress default image gallery items*/
body .gallery-item img {
    width: 100%;
    border: none !important;
}

/* !-- WP WYSIWYG Editor Styles -- */
.entry-content img {
	margin: 0 0 1.5em 0;
	}
.alignleft, img.alignleft {
	margin-right: 1.5em;
	display: inline;
	float: left;
	}
.alignright, img.alignright {
	margin-left: 1.5em;
	display: inline;
	float: right;
	}
.aligncenter, img.aligncenter {
	margin-right: auto;
	margin-left: auto;
	display: block;
	clear: both;
	}
.wp-caption {
	margin-bottom: 1.5em;
	text-align: center;
	padding-top: 5px;
	}
.wp-caption img {
	border: 0 none;
	padding: 0;
	margin: 0;
	}
.wp-caption p.wp-caption-text {
	line-height: 1.5;
	font-size: 10px;
	margin: 0;
	}
	
/* ========= Gutenberg Block items ========= */
/*Wrapper block*/
body .wp-block-editor-blocks-wrapper .wrapper-inner {
    max-width: 1140px;
	padding-left: 15px;
	padding-right: 15px;
	box-sizing: content-box;
}

/*Buttons*/
body .article .wp-block-buttons {
	padding-bottom:20px;
}
body .wp-block-buttons > .wp-block-button {
    margin-right: 10px;
	margin-bottom:10px;
}
body .wp-block-button__link, 
body .article a.wp-block-button__link {
    border-radius: 0;
    background-color: var(--main-color);
	color:#fff;
    font-size: 12px;
	font-weight: bold;
	letter-spacing: 1px;
    padding: 25px 52px;
    text-transform: uppercase;
	-webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
body .wp-block-button__link:hover, 
body .article a.wp-block-button__link:hover {
	background-color:#a71016;
}
body .wp-block-button__link:visited {
	color:#fff;
}

/*Blog post grid*/
body .ugb-blog-posts .ugb-blog-posts__featured-image {
    border-radius: 0;
}
body .ugb-blog-posts .ugb-blog-posts__featured-image a {
    padding-bottom: 66% !important;
}
body .ugb-blog-posts .ugb-blog-posts__title {
    font-size: 28px;
}
body .ugb-blog-posts .ugb-blog-posts__title a {
	font-weight:bold;
}
body .ugb-blog-posts .ugb-blog-posts__meta {
    color: #000;
    font-size: inherit;
	font-weight:bold;
}

/*Columns*/
body .wp-block-column {
    position: relative;
}
body .wp-block-column:not(:first-child) {
    margin-left: 1.5%;
}
body .wp-block-column:not(:last-child) {
    margin-right: 1.5%;
}
body .wp-block-column:last-child {
    margin-right: 0px;
}

/*Iconica fullwidth*/
.wp-block-iconica-fullwidth-wrapper {
    background-color: #444;
}
.wp-block-iconica-fullwidth-wrapper .wrapper-inner {
	max-width:1140px;
	margin:0 auto;
	padding-left: 5%;
    padding-right: 5%;
}

/*Allow fullwidth content*/
.entry-content .alignwide {
	margin-left  : -80px;
	margin-right : -80px;
}
.entry-content .alignfull {
	margin-left  : calc( -100vw / 2 + 100% / 2 );
	margin-right : calc( -100vw / 2 + 100% / 2 );
	max-width    : 100vw;
}
.alignfull > img {
	width: 100vw;
}

/*Blog article items*/
.article h1,
.article h2,
.article h3,
.article h4 {
    margin-top: 35px;
}
.article h1:first-child,
.article h2:first-child,
.article h3:first-child,
.article h4:first-child {
    margin-top: 0;
}
.article a {
    color: var(--main-color);
}

/*Blockquotes*/
body blockquote {
    border-left: solid 5px #000;
    text-align: left;
}
body blockquote h3,
body blockquote p {
    font-size: 20px;
	font-weight: normal;
	margin-bottom: 15px;
}
body blockquote h3:last-child,
body blockquote p:last-child {
	margin: 0;
}

/*Images*/
.article figure	{
    padding-bottom: 20px;
}
.wp-block-image img {
    height: auto;
}

/*Vimeo embed*/
body .wp-block-embed-vimeo iframe {
  	height: 100% !important;
}

/* ==================================================== SECTION 6: Special modifier classes ==================================================== */

/*
Class name: very_large
Used on header text
*/
body .very_large {
	font-family: "HelveticaNeueLTPro-Bd",Helvetica,Arial,sans-serif;
	font-size:140px;
	font-weight: normal;
	font-style: normal;
	line-height:0.92;
}

/*
Class name: very_large_lvl2
Used on header text
*/
body .very_large_lvl2 {
	font-family: "HelveticaNeueLTPro-Bd",Helvetica,Arial,sans-serif;
	font-size:70px;
	font-weight: normal;
	font-style: normal;
	line-height:1;
	margin-bottom:50px;
}

/*
Class name: spacer_desktop
*/
.spacer_desktop { /*Spacer elements that are disabled on mobile devices*/
}

/*
Class name: dark_bg
For content that has dark backgrounds
*/
.dark_bg { 
	color:#fff;
}

/*
Class name: disclaimer
Apply on disclaimer or fine print texts
*/
.disclaimer,
.disclaimer a { 
    font-size: 11px;
    line-height: 1.3em;
}

/*
Class name: move_down
Turns a button block into a "v" button. With fullpage.js running, clicking on it lets you scroll to the next content section. Apply this class to a button block.
*/
.move_down a, 
a.move_down { 
    background-image: url('images/button-downarrow.png');
    background-size: contain;
    display: block;
    height: 0px;
    width: 0px;
    background-repeat: no-repeat;
    font-size: 0;
    background-color: transparent;
	-webkit-transition: all 0.3s ease-out;
	padding:13px 35px;
    transition: all 0.3s ease-out;
}
.move_down a:hover,
a.move_down:hover {
	background-color:transparent;
	opacity: 0.5;
}
.no_margin,
.no_margin .wp-block-column {
	margin-bottom: 0 !important;
	margin-top: 0 !important;
}

/*
Class name: highlighted
*/
.highlighted {
	color:var(--main-color);
}

/*
Class name: required
*/
.required {
	color:var(--main-color);
}

/*
Class name: link_list
For making list of links
*/
ul.link_list { 
    list-style: none;
	padding-left:0px;
    text-transform: uppercase;
}
ul.link_list a {
	font-weight:bold;
}
.reduced_bottom_margin {
	margin-bottom:3px;
}

/* 
Class Name: read_more
*/
.read_more {
	font-size:18px;
	text-decoration:underline;
}

/* 
Class Name: notice
*/
.notice {
    background-color: #dadada;
    padding: 10px;
}

/*
Class name: btn
Converts links into buttons
*/
body .btn,
input[type="submit"] {
    background-color: var(--main-color);
    color: #fff;
    font-weight: bold;
    border-radius: 0;
    padding: 10px 15px;
	-webkit-transition: all 0.3s ease-out;
	text-decoration:none;
    transition: all 0.3s ease-out;
}
body .btn:hover,
input[type="submit"]:hover { 
	background-color:#a71016;
	color:#fff;
	animation:none;
}
body .btn:visited {
	color:#fff;
}

/*
Class Name: pagination
Used on blog pages
*/
body .pagination {
	font-weight: bold;
	letter-spacing: 2px;
}

/* 
Class Name: fullpg_align_top
Used on pages that use fullpage.js Apply to section panels where you want the content to "stick" to the top of the screen all the time*/
.fullpg_align_top .fp-tableCell {
	vertical-align:top !important;
}

/* 
Class Name: media-text-linked
Turns into a 2-column Gutenberg Columns block to behave like the Media & Text block */
body .media-text-linked {
	display: grid;
	grid-template-columns: auto 50%;
	align-items: center;
}
body .media-text-linked .wp-block-column:first-child {
	padding:8%;
}

/* 
Class Name: page-nav
Used mainly on pagination links for the following templates:
page-portfolio_item_case-study.php
page-portfolio_item.php
*/
.page-nav > div {
    display: inline-block;
}
.page-nav a {
    font-weight: bold;
    text-transform: uppercase;
    padding: 0 5px;
}

/*
Class name: fullwidth
Sets width to 100%. Also applies that to some of its nested containers
*/
.fullwidth,
.fullwidth .wrapper-inner-blocks {
	width:100% !important;
}

/*
Class name: animated_button
Changes an element's background to a red-orange gradient every 3 seconds
*/
.animated_button {
    background-size: 200% 200%;
    display: inline-block;
    animation: gradientAnimation 1.5s infinite alternate;
}

@keyframes gradientAnimation {
    0% {
      background-color:var(--main-color);
    }
    100% {
	  background-color: #a71016;
    }
}

/* ==================================================== SECTION 7: Widgets ==================================================== */

/*Social media widget*/
.sm-widget {
    text-align: right;
    margin-top: 10px;
}
footer .sm-widget {
	margin-top:20px;
}
.sm-widget a {
	background-image: url('images/sm-sprite.gif');
	background-size: 700%;
	display: inline-block;
	width: 15px;
	height: 15px;
	margin-left: 15px;
	background-repeat: no-repeat;
}
.sm-widget a.facebook {
	background-position:top left;
}
.sm-widget a.twitter {
    background-position: -30px 0px;
}
.sm-widget a.youtube {
	background-position: -45px 0px;
}
.sm-widget a.instagram {
	background-position: -15px 0px;
}
.sm-widget a.linkedin {
	background-position: -60px 0px;
}
.sm-widget a.vimeo {
    background-position: -75px 0;
}
.sm-widget a.feedburner {
    background-position: -90px 0px;
}
.sm-widget a:hover {
	background-position-y: -15px;
}
header .right .sm-widget {
    text-align: right;
}

/*Business snapshot widget*/
.__ssw_snapshot_widget {
    padding: 0 !important;
    box-shadow: none !important;
}
.__ssw_snapshot_widget .__ssw_title {
    text-align: left !important;
}
.__ssw_snapshot_widget .__ssw_submit_button {
    text-transform: uppercase !important;
    font-weight: bold !important;
    font-size: 12px !important;
    padding: 25px;
    height: auto !important;
    background-color: var(--main-color) !important;
}

/* ==================================================== SECTION 8: Classes for particular page templates ==================================================== */

/* ========= Front-Page.php (Homepage) ========= */

.home h1 {
	font-size: 48px;
}
.home h2 {
	font-size: 45px;
}
.home h3 {
    font-size: 35px;
}
.home h4 {
    font-size: 18px;
    font-weight: 500;
}
.home h4,
.home h5,
.home h6 {
	font-weight:normal;
    color: var(--main-color);
}
.home .section_intro .wp-block-column:first-child {
	width:75%;
}
/*.home .section_intro2 .wp-block-column:first-child {
    flex-basis:62%;
}
.home .section_intro2 .wp-block-column:last-child {
    flex-basis:38%;
}*/
.home .section_intro2 .wp-block-media-text {
    grid-template-columns: 10% auto;
	align-items: flex-start;
}
.home .section_creative_design {
    background: url(images/bg_creative_design2.jpg);
	background-position: center right;
	background-repeat:no-repeat;
	background-size:cover;
	align-content: center;
}
.home .section_creative_design .wp-block-column:first-child {
    flex-basis:60%;
}
.home .section_creative_design .wp-block-column:last-child {
    flex-basis:40%;
}

/*Tweak special content modifyers*/
body.home .very_large {
	font-family: "HelveticaNeueLTPro-Bd",Helvetica,Arial,sans-serif;
    font-weight: normal;
	font-style: normal;
	font-size: 140px;
}
body.home .very_large_lvl2 {
	font-family: "HelveticaNeueLTPro-Bd",Helvetica,Arial,sans-serif;
    font-size: 70px;
    font-weight: normal;
	font-style: normal;
	font-size:70px;
}

body.home footer .clients h4 {
	color:#fff;
}

/* ========= Front-Page.php (Homepage) AND Page-fullpgJS.php ========= */

.fp-tableCell .wrapper-inner {
    padding: 50px 0;
}

/*Revslider background*/
.add_revslider_bg .fp-tableCell {
    position: relative;
}
.add_revslider_bg .wrapper-inner {
	height:100%;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.add_revslider_bg .wrapper-inner-blocks {
	/*position: relative;
	display: table;*/
	width:100%;
}
/*.add_revslider_bg .wp-block-columns {
	vertical-align: middle;
	display: table-cell;
}*/
.add_revslider_bg .forcefullwidth_wrapper_tp_banner {
	position:absolute !important;
	top:0;
	left:0;
	z-index:-999;
}

/*Panels that have "scroll down" buttons*/
.add_move_down_btn .wp-block-columns {
	position:relative;
}
.add_move_down_btn a.move_down {
    position: absolute;
    bottom: 40px;
}

/* ========= Home.php and Archive.php ========= */
body.blog .post,
body.archive .post {
    margin-bottom: 70px;
}
body.blog .thumbnail,
body.archive .thumbnail {
    margin-bottom: 30px;
}
body.archive h1 {
    text-transform: capitalize;
}

/* ========= Single.php ========= */
.single-post .secondary_title {
    margin-top: -15px;
	font-size: 25px;
    font-weight: normal;
}
.single-post .article {
    margin-bottom: 55px;
}
.single-post .date {
    font-weight: bold;
    text-transform: uppercase;
}
.single-post .blog-hero {
	background-color:#e5e5e5;
	margin-bottom:55px;
}
.single-post .blog-hero img {
    width: 100%;
    height: auto;
}
.single-post .taxonomies {
	font-size: 13px;
    padding-bottom: 30px;
	text-transform: capitalize;
}
.single-post .taxonomies .tags,
.single-post .taxonomies .categories {
    width: 110px;
    display: inline-block;
    text-transform: uppercase;
    font-weight: bold;
}

/* Pagination */
.single-post .pagination {
    width: 100%;
}

/* ========= Sidebar items ========= */
aside > div {
    margin-bottom: 60px;
}
aside > div > h4 {
	color: #000;
	font-weight: bold;
	font-size: 24px;
	line-height:1.2;
	margin-bottom: 15px;
}
aside ul {
    padding-left: 0;
    list-style: none;
}
aside a {
    color: var(--main-color);
    font-weight: bold;
    text-decoration: underline;
}

/* ========= Page-Portfolio.php ========= */
.page-template-page-portfolio .title-bar {
	margin-bottom:0;
}
.page-template-page-portfolio .title-bar .row > div,
.page-template-page-portfolio footer .row > div {
    padding: 0 15px !important;
}
.page-template-page-portfolio section.main {
	margin-bottom:0px;
}

/*Filtered gallery*/
ul.simplefilter {
    padding-left: 0;
}
body .simplefilter li {
    border-radius: 20px;
	background-color: #000;
	border-bottom: none !important;
	color: #fff;
	font-size:13px;
	font-weight: bold !important;
	margin: 0 3px 10px;
	padding: 10px 20px;
	-webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
	text-transform: capitalize;
}
body .simplefilter li:hover {
	background-color: var(--main-color);
}
body .simplefilter li.active::after {
	display:none;
}
.filtr-container.row {
    width: 100%;
}
body .filtr-item {
	background-color:#000;
	padding: 0 !important;
}
body .filters-div .portfolio_thumbnail {
    opacity: 1;
	-o-transition: .5s;
	-ms-transition: .5s;
	-moz-transition: .5s;
	-webkit-transition: .5s;
	transition: .5s;
}
body .filters-div .portfolio_thumbnail:hover {
	opacity:0.5;
}
body .lb-outerContainer {
    border-radius: 0;
    background-color: transparent;
}
body .lb-data .lb-details {
    display: none;
}

/* ========= Page-Portfolio_Item.php ========= */
.page-template-page-portfolio_item .carousel-inner > .item > img, 
.page-template-page-portfolio_item .carousel-inner > .item > a > img {
    width: 100%;
}
.page-template-page-portfolio_item .page-nav {
    padding: 25px 15px;
	text-align:right;
}

.page-template-page-portfolio_item .page-nav .col-sm-8 {
    text-align: right;
}
.carousel-control.right, .carousel-control.left {
    background-image: none !important;
}

/* ========= Page-portfolio_item_case-study.php ========= */
body.page-template-page-portfolio_item_case-study section.main {
	margin-bottom:0;
}
.page-template-page-portfolio_item_case-study section.page-nav {
    text-align: center;
    padding: 80px 0;
}

/* ==================================================== SECTION 9: Miscellaneous ==================================================== */
.scroll_top {
	background-color: rgba(0,0,0,0.4);
	background-image: url('images/button-back-top.png');
	display: block;
	position: fixed;
	bottom: 20px;
	right: 90px;
	z-index: 999;
	background-size: 50%;
	background-repeat: no-repeat;
	height: 40px;
	width: 50px;
	background-position: center center;
}
.scroll_top:hover {
	background-color: rgba(0,0,0,0.6);
}

/*Hide Google Recaptcha badge*/
.grecaptcha-badge { 
    visibility: hidden;
}

/*For use with Advanced Floating Content plugin*/
body .afc_popup .img {
    top: 15px;
    right: 15px;
    width: 33px;
    height: 33px;
    padding: 33px 33px 0 0;
    background-image: url("images/close.png");
}

/* Fancybox popup for showing contact forms */
#scheduling_fancybox {
  padding: 30px;
}

/* ==================================================== SECTION 10: Mobile ==================================================== */

/*For desktops wider than 1024 px only*/
@media (min-width: 1024px) {
	.align_bottom { /*Parent element needs to have position:relative for this to work*/
		margin-bottom: 1em !important;
		position:absolute;
		bottom:0;
	}
}

/* For smaller screens */
@media (max-width: 1200px) {
	body .container,
	body a.block_collapse,
	body .wp-block-editor-blocks-wrapper .wrapper-inner { /*EB wrapper gutenberg element*/
		padding-left: 5%;
		padding-right: 5%;
		max-width: none;
	}
	body .very_large,
	body.home .very_large {
		font-size:125px;
	}
}
@media (max-width: 992px) {
	body .container {
		max-width: none;
	}
	body .very_large,
	body.home .very_large {
		font-size:100px;
	}
	.parallax {
		/*background-size:200% !important;*/
		background-color:#000;
		background-repeat:no-repeat;
	}
}
@media (max-width: 768px) {
	body .container {
		max-width: none;
	}
	body .row {
		margin-right: -5%;
		margin-left: -5%;
	}
	body .has-2-columns .wp-block-column {
    	flex-basis: 47%;
	}
	body .has-3-columns .wp-block-column {
    	flex-basis: 31%;
	}
	body .very_large,
	body.home .very_large {
		font-size:80px;
	}
	body .very_large_lvl2,
	body.home .very_large_lvl2 {
		font-size:60px;
	}
	body aside {
		bottom:-30px;
    	padding: 50px 0 0px;
    	background-color: #dcddde;
    	overflow: hidden;
	}
	.single-post .taxonomies .row {
		margin-left: 0;
	}
	.single-post .taxonomies .categories, 
	.single-post .taxonomies .col-sm-8 {
		padding-left: 0;
	}
	#fancybox-wrap {
		max-width: 90%;
		min-height: 80%;
	}
}
@media (max-width: 576px) {
	body .container {
		max-width: none;
	}
	.sidenav.opened {
		width:100%;
	}
	header nav .col-xs-3:first-child {
		padding-left: 0;
	}
	header .btn {
		font-size:10px;
		font-weight:normal;
		padding:10px;
	}
	header .logo img {
		max-width: 100%;
	}
	body .has-2-columns .wp-block-column,
	body .has-3-columns .wp-block-column {
    	flex-basis: 100%;
		margin:0;
	}
	body .wp-block-button__link {
		font-size: 14px;
		padding: 10px 25px;
	}
	.title-bar {
		padding: 50px 0 0;
	}
	.title-bar h1 {
		font-size: 40px;
		margin-bottom:20px;
	}
	body .very_large,
	body.home .very_large {
		font-size:60px;
	}
	body .very_large_lvl2,
	body.home .very_large_lvl2 {
		font-size:50px;
		line-height:1;
	}
	body .wp-block-column {
		flex-basis:100% !important;
		width:100% !important;
	}
	body .media-text-linked {
		display: block;
	}
	body .media-text-linked .wp-block-column:first-child {
		padding:5%;
	}
	.page-nav > div {
    	display: block;
	}
	.parallax {
		background-size:150% auto !important;
		padding: 20px 0 !important;
	}
}
@media (max-width: 375px) {
	body.home .very_large {
		font-size:50px;
	}
}

/* ==================================================== SECTION 11: Block style presets ==================================================== */
.has-black-background-color {
  background-color: #000000;
}
.has-black-background-color a {
  color: #fff;
  text-decoration: underline;
}

.has-white-background-color {
  background-color: #ffffff;
}

.has-white-color {
	color:#fff;
}