/*======================================
Theme Name: Opioid Response
Theme URI: https://divicake.com/
Description: A custom theme build for the City of Richmond's Opioid Response team. Includes site-wide accessibility corrections and the one-click content updates under Tools > Site Updates.
Version: 2.22.3
Author: The Digital Knight LLC
Author URI: https://www.thedigitalknight.com/
Template: divi
======================================*/


/*----------Theme CSS----------*/

/* THE BASIC by valaska studio */
/* DIVI WIREFRAME UI KIT STYLES */

/*---BUTTON MODULE---*/

/* Inline Buttons */
.tbvs-inline-button .et_pb_button_module_wrapper {
    display: inline-block;
    margin-right: 30px;
}

/* Inline Buttons Centered */
.tbvs-inline-button-center .et_pb_button_module_wrapper {
    display: inline-block;
    margin-right: 15px;
    margin-left: 15px;
}
  
.tbvs-inline-button-center {
	text-align: center;
}


/*---FOOTER SECTION---*/

/* Footer Inline Navigation */
.tbvs-footer-inline-navigation ul li {
	display: inline-block!important;
	padding: 5px 10px!important;
}

.tbvs-footer-inline-navigation ul {
	padding-bottom: 0!important;
	padding-left: 0!important;
}


/*---BLURB MODULE---*/

/* Circle Icon Padding */
.tbvs-blurb .et-pb-icon-circle {
	padding: 10px;
}


/*---EMAIL OPT-IN MODULE---*/

/* Inline Email Opt-In */
@media (min-width: 479px) {
    .tbvs-email-optin-inline.et_pb_newsletter .et_pb_newsletter_fields {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
    }
    
	.tbvs-email-optin-inline.et_pb_newsletter .et_pb_newsletter_fields>* {
  		margin-right: 20px;
	}
    
    .tbvs-email-optin-inline.et_pb_newsletter .et_pb_newsletter_fields>*:last-child  {
  		margin-right: 0;
	}
}


/*---PRICING TABLES MODULE---*/

/* Pricing Table Style */
.tbvs-pricing .et_pb_frequency {
	display: block;
}

.tbvs-pricing .et_pb_dollar_sign {
	position: relative;
	margin-right: 10px;
	margin-left: 0!important;
}

.tbvs-pricing .et_pb_frequency_slash {
	display: none;
}

/* Pricing Table Bullet Style */
.tbvs-pricing-bullet .et_pb_pricing li span:before {
	font-family: ETmodules;
	content: "\4e";
	font-weight: 800;
	border: none;
	border-radius: 0;
	left: -16px;
	position: absolute;
	top: 0px;
	border-radius: 0;
}

.tbvs-pricing-bullet .et_pb_pricing li.et_pb_not_available span:before {
	content: "\4d";
}

.tbvs-pricing-bullet.et_pb_pricing_no_bullet .et_pb_pricing li {
	padding-left: 0!important;	
}

/* Pricing Table Boxed */
.tbvs-pricing-boxed .et_pb_pricing_table {
	box-shadow: 0px 2px 18px 0px rgb(0, 0, 0, 0.3);
}

/* Pricing Table Gap */
.tbvs-pricing-gap .et_pb_pricing_table_wrap {
	justify-content: space-between;
}

.tbvs-pricing-gap .et_pb_pricing_table {
	width: 31%;
    max-width: 31%;
}

.et_pb_column_4_4 .tbvs-pricing-gap .et_pb_pricing_table {
	width: 22.5%;
    max-width: 22.5%;
}

.et_pb_column_4_4 .tbvs-pricing-gap.et_pb_pricing_3 .et_pb_pricing_table {
    width: 31%;
    max-width: 31%;
}

.et_pb_column_1_2 .tbvs-pricing-gap .et_pb_pricing_table,
.et_pb_column_2_3 .tbvs-pricing-gap .et_pb_pricing_table,
.et_pb_column_3_5 .tbvs-pricing-gap .et_pb_pricing_table,
.tbvs-pricing-gap.et_pb_pricing_2 .et_pb_pricing_table {
    width: 48%;
    max-width: 48%;
}

.et_pb_column_1_3 .tbvs-pricing-gap .et_pb_pricing_table,
.et_pb_column_1_4 .tbvs-pricing-gap .et_pb_pricing_table,
.et_pb_column_1_5 .tbvs-pricing-gap .et_pb_pricing_table,
.et_pb_column_1_6 .tbvs-pricing-gap .et_pb_pricing_table,
.et_pb_column_2_5 .tbvs-pricing-gap .et_pb_pricing_table,
.et_pb_column_3_8 .tbvs-pricing-gap .et_pb_pricing_table,
.tbvs-pricing-gap.et_pb_pricing_1 .et_pb_pricing_table {
    width: 100%;
    max-width: none;
}

@media (min-width: 767px) and (max-width: 980px) { .et_pb_column .tbvs-pricing-gap .et_pb_pricing_table {	
		max-width: 48%!important;
	}
}


/*---PERSON MODULE---*/

/* Person Social Icons Style */
.tbvs-person-circle-icon .et_pb_member_social_links a:before {
	display: block;
	height: 32px;
    width: 32px;
    line-height: 32px;
	padding: 8px;
	border: 1px solid;
	border-radius: 50%;
}

/* Fix Social Icons Last Child Margin */
.et_pb_member_social_links li:last-child {
	margin-right: 0px;
}


/*---COMPANIES SECTION---*/

/* Inline Logos At Mobile View */
@media (max-width: 980px) {
    .tbvs-inline-logo-section .et_pb_column {
        width: 29.333%!important;
        margin-right: 2%!important;
        margin-left: 2%!important;
    }

    .tbvs-inline-logo-section .et_pb_column.et_pb_column_empty {
        display: none;
    }
}


/*---CIRCLE COUNTER MODULE---*/

/* Counter Circle Size */
.tbvs-circle-counter.et_pb_circle_counter .percent, .tbvs-circle-counter.et_pb_circle_counter canvas {
    max-width: 175px;
    left: 0; 
    right: 0; 
    margin-left: auto; 
    margin-right: auto;
}


/*---BLOG MODULE---*/

/* Blog Image Left Style 1 */ 
@media (min-width: 479px) {
    .tbvs-blog-img-style1 .et_pb_post.has-post-thumbnail .entry-featured-image-url {
        float: left;
        max-width: 33%;
        margin-bottom: 0;
        margin-right: 5.5%;
    }
	
	.tbvs-blog-img-style1 .et_pb_post.has-post-thumbnail {
		margin-bottom: 25px;
	}
	
	.tbvs-blog-img-style1 .et_pb_post.has-post-thumbnail .entry-title, .tbvs-blog-img-style1 .et_pb_post.has-post-thumbnail .post-meta, .tbvs-blog-img-style1 .et_pb_post.has-post-thumbnail .post-content {
		margin-left: 38.5%;
	}
}

/* Blog Image Left Style 2 */
@media (min-width: 981px) {
    .tbvs-blog-img-style2 .et_pb_post.has-post-thumbnail .entry-featured-image-url {
        float: left;
        max-width: 50%;
        margin-bottom: 0;
        margin-right: 5.5%;
    }

	.tbvs-blog-img-style2 .et_pb_post.has-post-thumbnail .entry-title, .tbvs-blog-img-style2 .et_pb_post.has-post-thumbnail .post-meta, .tbvs-blog-img-style2 .et_pb_post.has-post-thumbnail .post-content {
		margin-left: 55.5%;
	}
}


/*---PORTFOLIO MODULE---*/

/* Portfolio Title Margin */
.tbvs-portfolio .et_pb_portfolio_item .et_pb_module_header {
	margin-top: 20px;
}

/* Filterable Portfolio Navigation */
.tbvs-portfolio-filter.et_pb_filterable_portfolio .et_pb_portfolio_filters li a {
	border: none;
	background-color: transparent;
}

.tbvs-portfolio-filter.et_pb_filterable_portfolio .et_pb_portfolio_filters li a:hover {
	background-color: transparent;
}

.tbvs-portfolio-filter.et_pb_filterable_portfolio .et_pb_portfolio_filters li a.active {
	background-color: transparent;
}



/*======================================
  ACCESSIBILITY & UI REFINEMENTS  v2.1.0
  The Digital Knight

  Everything below is presentational and safe to tune. Divi's own classes are
  targeted, so these survive editing a module in the builder.
  ======================================*/

/*---------- FAQ: section headings ----------*/
/* The three group headings are how someone now navigates this page, so they
   need to read as dividers rather than as slightly larger paragraphs. */

/* No underline here. The site already marks a section with the gold divider
   module - 3px, 80px wide, used 23 times across seven pages - and adding a rule
   under the heading as well gave every section two lines doing one job. The
   gold bar is the device; this only makes the heading it belongs to read with
   enough weight to earn it. */

.opr-faq-heading,
.et_pb_text_inner > h2 {
    font-weight: 700;
    color: #1F4E79;
    letter-spacing: -0.01em;
    margin-bottom: 0;
}

/* Pull the divider up so the bar reads as part of the heading rather than as a
   floating element between two sections. Only applies where a divider actually
   follows a heading, so dividers used on their own are untouched. */

.et_pb_text:has(> .et_pb_text_inner > h2:last-child) + .et_pb_divider {
    margin-top: 10px;
}

.et_pb_divider + .et_pb_text {
    margin-top: 4px;
}

/* The gold bar is decorative, not text. The 4.5:1 minimum applies to text and
   to meaningful graphics; a section rule is neither, so #FFBA5A stays as the
   client chose it. Excluded explicitly so the contrast corrections elsewhere in
   this theme can never reach it. */

.et_pb_divider,
.et_pb_divider:before {
    color: inherit !important;
}

/*---------- FAQ: the toggle rows ----------*/
/* Question text measured #666 on the row grey, which lands on or under the
   4.5:1 minimum depending where you sample. Darkening it removes the doubt and
   makes the question read as the primary element, which it is. */

.et_pb_accordion .et_pb_toggle,
.et_pb_accordion .et_pb_accordion_item {
    border: 1px solid #E4E0D8 !important;
    border-left: 3px solid transparent !important;
    border-radius: 8px !important;
    margin-bottom: 10px !important;
    padding: 0 !important;
    background: #FBFAF8 !important;
    transition: border-color .15s ease, background-color .15s ease;
}

.et_pb_accordion .et_pb_toggle_open {
    background: #FFFFFF !important;
    border-left-color: #1F4E79 !important;
    box-shadow: 0 1px 2px rgba(26, 26, 24, .05);
}

.et_pb_accordion .et_pb_toggle:hover {
    border-left-color: #CFC8BC !important;
}

.et_pb_accordion .et_pb_toggle_open:hover {
    border-left-color: #1F4E79 !important;
}

/* The clickable title. Padding lives here rather than on the wrapper so the
   whole row is a comfortable target. */
.et_pb_accordion .et_pb_toggle_title {
    color: #1A1A18 !important;
    font-weight: 600 !important;
    font-size: 17px !important;
    line-height: 1.4 !important;
    padding: 18px 54px 18px 22px !important;
    margin: 0 !important;
    cursor: pointer;
}

.et_pb_toggle_open .et_pb_toggle_title {
    color: #1F4E79 !important;
}

/* Divi's +/- sits at very low contrast. Larger, darker, vertically centred. */
.et_pb_accordion .et_pb_toggle_title:before {
    color: #5A564E !important;
    font-size: 22px !important;
    right: 20px !important;
    top: 50% !important;
    margin-top: -11px !important;
    transition: color .15s ease;
}

.et_pb_toggle_open .et_pb_toggle_title:before {
    color: #1F4E79 !important;
}

/*---------- FAQ: the answers ----------*/
/* The content was inheriting Divi's default paragraph spacing on top of the
   module's own padding, which opened a gap between a question and its answer
   and made them look unrelated. */

.et_pb_accordion .et_pb_toggle_content {
    padding: 0 22px 20px 22px !important;
    margin: 0 !important;
    color: #3D3A36;
    font-size: 16px;
    line-height: 1.65;
    max-width: 68ch;
}

.et_pb_accordion .et_pb_toggle_content > *:first-child {
    margin-top: 0 !important;
}

.et_pb_accordion .et_pb_toggle_content > *:last-child {
    margin-bottom: 0 !important;
}

.et_pb_accordion .et_pb_toggle_content p {
    margin: 0 0 12px !important;
    padding-bottom: 0 !important;   /* Divi adds 1em globally to every p */
}

.et_pb_accordion .et_pb_toggle_content ul,
.et_pb_accordion .et_pb_toggle_content ol {
    margin: 0 0 14px !important;
    padding-left: 22px !important;
    line-height: 1.6;
}

.et_pb_accordion .et_pb_toggle_content li {
    margin-bottom: 7px !important;
    padding-bottom: 0 !important;
}

.et_pb_accordion .et_pb_toggle_content a {
    color: #1F4E79;
    text-decoration: underline;
    text-underline-offset: 2px;
    font-weight: 600;
}

.et_pb_accordion .et_pb_toggle_content a:hover,
.et_pb_accordion .et_pb_toggle_content a:focus {
    color: #14304A;
}

/* A phone number inside an answer is an action, not prose. */
.et_pb_accordion .et_pb_toggle_content a[href^="tel:"] {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* The ewa-rteLine divs pasted in from the source document collapse to nothing
   between lines, so they read as one run-on paragraph. */
.et_pb_accordion .et_pb_toggle_content .ewa-rteLine {
    margin-bottom: 6px;
}

.et_pb_accordion .et_pb_toggle_content .ewa-rteLine:empty {
    display: none;
}

/*---------- Focus, for keyboard users ----------*/
.et_pb_accordion .et_pb_toggle_title:focus-visible,
.et_pb_accordion h3.et_pb_toggle_title:focus-visible {
    outline: 2px solid #8A5A00 !important;
    outline-offset: -2px;
    border-radius: 6px;
}

@media (max-width: 600px) {
    .et_pb_accordion .et_pb_toggle_title {
        font-size: 16px !important;
        padding: 16px 46px 16px 16px !important;
    }
    .et_pb_accordion .et_pb_toggle_content {
        padding: 0 16px 18px 16px !important;
        font-size: 15.5px;
    }
}

/*---------- Body content: lists and rhythm ----------*/
/* Applies to every Divi Text module, so About, Seeking Information and
   Additional Resources all set lists the same way.

   Two problems were visible on About. The bullets sat almost flush with the
   body text, so a list did not read as indented at all. And the gap between a
   lead-in sentence and its list was inconsistent - generous after "The guide
   includes:", absent after "Important notes:" - because Divi applies a global
   1em padding-bottom to every paragraph, which the list then either kept or
   collapsed depending on the markup around it. */

.et_pb_text_inner ul,
.et_pb_text_inner ol,
.et_pb_toggle_content ul,
.et_pb_toggle_content ol {
    margin: 0 0 1.4em;
    padding-left: 1.6em;
    line-height: 1.6;
}

.et_pb_text_inner li,
.et_pb_toggle_content li {
    margin-bottom: .5em;
    padding-bottom: 0;
    padding-left: .25em;
}

.et_pb_text_inner li:last-child,
.et_pb_toggle_content li:last-child {
    margin-bottom: 0;
}

/* Nested lists step in rather than restarting at the same indent. */
.et_pb_text_inner li > ul,
.et_pb_text_inner li > ol {
    margin: .5em 0 0;
    padding-left: 1.4em;
}

/* A sentence ending in a colon belongs with the list beneath it. Divi's global
   paragraph padding pushes them apart, so it is removed for that one case. */
.et_pb_text_inner p + ul,
.et_pb_text_inner p + ol {
    margin-top: -.35em;
}

.et_pb_text_inner p:has(+ ul),
.et_pb_text_inner p:has(+ ol) {
    padding-bottom: .35em;
    margin-bottom: 0;
}

/* Fallback for browsers without :has(). Slightly less tight, still consistent. */
@supports not (selector(:has(*))) {
    .et_pb_text_inner p + ul,
    .et_pb_text_inner p + ol {
        margin-top: -.6em;
    }
}

/* The bullet itself was too light to register at this text size. */
.et_pb_text_inner ul > li::marker,
.et_pb_toggle_content ul > li::marker {
    color: #1F4E79;
}

.et_pb_text_inner ol > li::marker,
.et_pb_toggle_content ol > li::marker {
    color: #5A564E;
    font-weight: 700;
}

/* Space after a list before the next paragraph, so sections do not run
   together. */
.et_pb_text_inner ul + p,
.et_pb_text_inner ol + p {
    margin-top: .2em;
}

@media (max-width: 600px) {
    .et_pb_text_inner ul,
    .et_pb_text_inner ol {
        padding-left: 1.3em;
    }
}

/*---------- Additional Resources: the .resource-item blocks ----------*/
/* This markup is already well structured - .resource-list wrapping a
   .resource-item per entry - and there is CSS for it in
   Divi > Theme Options > Custom CSS. The trouble is one line of that CSS:

       .resource-item p { margin: 0; }

   which removes every paragraph gap inside an entry. That is why the FeedMore
   block runs together, why "You may be required to:" sits flush against its
   list, and why Meadowbridge reads as six lines with no separation.

   Three class levels are used below so these win over the Theme Options rules
   without !important - Divi prints that custom CSS after the stylesheets, so
   matching specificity would lose. */

/* No width or margin is set here on purpose.

   An earlier version capped this block at 780px and centred it with
   margin-inline: auto. Inside a 1080px column that resolves to a 150px margin
   on each side, so every entry sat 150px to the right of the "Meetings" and
   "Housing" headings above it - which reads as a large accidental indent, and
   was reported as one.

   The site's own CSS in Divi > Theme Options already sets
   .resource-list { max-width: 700px; margin: 0 } - a sensible reading measure,
   left-aligned with the headings. Leaving it alone is the correct answer. */

.et_pb_text_inner .resource-item {
    padding: 18px 0;
    border-bottom: 1px solid #E4E0D8;
}

.et_pb_text_inner .resource-item:first-child {
    padding-top: 4px;
}

.et_pb_text_inner .resource-item p {
    margin: 0 0 .55em;
    line-height: 1.6;
    color: #3D3A36;
    font-size: 16px;
    padding-bottom: 0;     /* Divi's global 1em on every paragraph */
}

.et_pb_text_inner .resource-item p:last-child {
    margin-bottom: 0;
}

/* The first line of an entry is its name. Whether it is bold text or a bold
   link, it should read as the entry's title. */
.et_pb_text_inner .resource-item > p:first-child {
    font-size: 17px;
    margin-bottom: .4em;
}

.et_pb_text_inner .resource-item > p:first-child strong {
    color: #14304A;
    font-weight: 700;
}

.et_pb_text_inner .resource-item a {
    color: #1F4E79;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.et_pb_text_inner .resource-item a:hover,
.et_pb_text_inner .resource-item a:focus {
    color: #14304A;
}

/* A sentence ending in a colon belongs with the list under it, but "belongs
   with" is not the same as "touching". */
.et_pb_text_inner .resource-item p + ul,
.et_pb_text_inner .resource-item p + ol {
    margin-top: .1em;
}

.et_pb_text_inner .resource-item ul,
.et_pb_text_inner .resource-item ol {
    margin: 0 0 .55em;
    padding-left: 1.5em;
}

.et_pb_text_inner .resource-item li {
    margin-bottom: .38em;
    line-height: 1.55;
    padding-bottom: 0;
}

.et_pb_text_inner .resource-item li:last-child {
    margin-bottom: 0;
}

/* Contact blocks are a single paragraph broken with <br>, so the line spacing
   has to come from the break rather than from paragraph margins. */
.et_pb_text_inner .resource-item br {
    line-height: 2;
}

/* Closing dates and similar notices were disappearing into the body copy. */
.et_pb_text_inner .resource-item em {
    color: #8A5A00;
    font-style: italic;
}

/* A sub-heading inside an entry - "Little Free Food Pantries" and the two that
   follow it - needs air above it, or it reads as part of the entry before. */
.et_pb_text_inner .resource-item p > strong:only-child {
    display: inline-block;
    padding-top: 2px;
}

@media (max-width: 600px) {
    .et_pb_text_inner .resource-item {
        padding: 15px 0;
    }
    .et_pb_text_inner .resource-item ul,
    .et_pb_text_inner .resource-item ol {
        padding-left: 1.25em;
    }
}