/*======================================
Theme Name: Audacity Marketing
Theme URI: https://audacity.marketing/
Description: Custom theme for Audacity Marketing Clients.
Version: 2.9
Author: Audacity Marketing
Author URI: https://audacity.marketing/
Template: Divi
======================================*/

/* You can add your own CSS styles here. Use !important to overwrite styles if needed. */

/*=============
|| Variables ||
=============*/
/* Ignore Syntax Error for Variables */

:root {
/* Site Fonts */
--site-head-font: 'Rubik',Helvetica,Arial,Lucida,sans-serif;
--site-body-font: 'Lato',Helvetica,Arial,Lucida,sans-serif;
	
/* Accent Color */
--accent-color: #042959;
--accent-color2: #F2C23F;

/* Background Color */
--adm-bg1: #fff;
--adm-bg2: #E6E6E6;

/*Text Color*/
--adm-lt-txt: #042959;
--adm-bk-txt: #fff;
}

/*==============
||  Page CSS  ||
==============*/


/* Vertical align for modules with background elements. */
.vert-align { 
    display: flex; 
    flex-direction: column; 
    justify-content: center;
} 

/* PART 1 - Before Lazy Load */
img[data-lazyloaded]{
	opacity: 0;
}

/* PART 2 - Upon Lazy Load */
img.litespeed-loaded{
	-webkit-transition: opacity .5s linear 0.2s;
	-moz-transition: opacity .5s linear 0.2s;
	transition: opacity .5s linear 0.2s;
	opacity: 1;
}

/*Sets the text highlight color to the primary theme color.*/
::-moz-selection, ::selection {
	color: var(--accent-color);
	background: var(--accent-color2);
}



/*=================
||  Mobile Menu  ||
=================*/
@media only screen and (max-width: 980px) {
	.et_fixed_nav #main-header, 
	.et_fixed_nav #top-header,
	.et_non_fixed_nav.et_transparent_nav #main-header,
	.et_non_fixed_nav.et_transparent_nav #top-header {
    	position: fixed;
	}
	#logo {
		display: none;
	}
	#main-header {
    	-webkit-box-shadow: 0 3px 50px rgba(0,0,0,.2);
    	-moz-box-shadow: 0 3px 50px rgba(0,0,0,.2);
    	box-shadow: 0 3px 50px rgba(0,0,0,.2);
	}
	.mobile_nav.opened .mobile_menu_bar:before {
 		content: '\4d';
	}
	#et-top-navigation span.mobile_menu_bar:before, 
	#et-top-navigation span.mobile_menu_bar:after {
		color: var(--accent-color, #444) !important;
	}
}

.et_mobile_menu {
    overflow: scroll !important;
    max-height: 80vh;
}

.et_mobile_menu {
	border-top: 3px solid var(--accent-color, #444);
	background: #fff!important;
}

.et_mobile_menu li a {
    display: block;
    padding: 20px 5%;
    border-bottom: 1px solid rgba(0,0,0,.03);
    text-align: center;
    font-size: 24px;
	color: #000!important;
}

/*==============
|| Custom CSS ||
==============*/
/* You can add your own CSS styles here. Use !important to overwrite styles if needed. */

/*Styling for the global contact form*/
.adm-contact-form .et_pb_contact_field .dfb_input_icon:after,.adm-contact-form .et_pb_contact_field:after {right:20px}
.adm-contact-form .field_label {margin-left:20px}

/*Footer styling for the footer version of the global contact form*/
.adm-footer-contact .adm-contact-form .field_label, .adm-footer-contact .adm-contact-form .form-title {display: none;}
.adm-footer-contact .adm-contact-form .de_fb_form_field {width:100%;margin-right:0px;margin-bottom:0px!important;}
.adm-footer-contact .adm-contact-form .de_fb_form_field .divi-form-builder-field {padding: 15px;}
.adm-footer-contact .adm-contact-form .de_fb_form_field:last-of-type {grid-column: 1 / span 2;}
.adm-footer-contact .adm-contact-form .divi-form-wrapper {
	display: grid;
	gap: 15px;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: repeat(auto);
}


/*Blurb Stylings*/
.adm-blurb ol li {counter-increment: item;list-style:none;}
.adm-blurb ol li:before {
	margin-right: 10px;
	content: counter(item);
	font-weight:700;
	background: #f0bb29;
	color:#fff;
	margin-bottom:10px;
	font-size:18px;
	width:1.5em;
	text-align: center;
	display: inline-block;
}
.adm-blurb ul li {list-style:none;}
.adm-blurb ul li:before {
	content:"";
	width:15px;
	height:15px;
	background:#042959;
	position:absolute;
	margin-top:6px;
	margin-left: -1.5em;
}