/* Styles for the two Toll Credits Exchange Pilot Program pages | March 2023 */

/* Home page | Adjustments to two existing column classes only for these Toll Credits Exchange (TCE) pages */
/* If concerned with implementing this, the other option is to create two similarly named classes with all the original properties plus these. If this is done, remember to change the classes specified on the TCE pages. */
#col-wrap-outer {padding-bottom: 0px;} /* Changes padding-bottom of 5% */
.col-wrap {padding-bottom: 0px;} /* Changes padding-bottom of 3% */

/* Pilot Program page | Top section, flex styles */
.pilot-flex {display: flex; flex-flow: row wrap; row-gap: 0px; padding: 0px;}
.tc-pilot-left {width: 64%; flex-grow: 0; flex-shrink: 1; flex-basis: auto; background: url(../images/background_toll_credit_bil.png) no-repeat center; background-size: auto 100%;}
.tc-pilot-right {width: 36%; flex-grow: 0; flex-shrink: 1; flex-basis: auto;
  display: flex; background-color: #00893D;}

/* Pilot Program page | Top section, left column */
.logo-container {background: #fff; padding: 1% 0;}
/*.logo-container h1 {text-indent : -9999px; height: 0px; margin: 0px; padding: 0px;}*/
.logo-container h1, .tc-overview-left h1 {font-size: 0;
  width: 1px;
  height: 1px;
  display: inline-block;
  overflow: hidden;
  position: absolute!important;
  border: 0!important;
  padding: 0!important;
  margin: 0!important;
  clip: rect(1px,1px,1px,1px);}

.tc-pilot-left img.toll-credits-logo {margin: 0 auto; display: block; float: none; width: 65%; flex-grow: 0; flex-shrink: 1; flex-basis: auto; align-content: stretch; position: relative; z-index: 3;}
.bil-main {color: #fff; font-size: 18px; font-weight: 900;}
.bil-main p {line-height: 1.7em; padding: 0 14% 3% 14%;}
.bil-main p:first-of-type {padding: 7% 14% 3% 14%;}
.bil-main p:last-of-type {padding: 0 14% 5% 14%;}
.bil-main a {color: #fff; text-decoration: underline;}
.bil-main a:link, .bil_main a:visited {color: #fff; text-decoration: underline;}
.bil-main a:hover, .bil_main a:active {color: #eee; text-decoration: underline;}

/* Pilot Program page | Top section, right column */
.tc-pilot-right-image {
	width: 100%;
	height: 96.5%;
	margin: 0 auto;
	padding: 20px;
}
.tc-pilot-right img {
	height: inherit;
	width: 100%;
	object-fit: none;
}
.gantry-image-768 {
	display: none;
}
.gantry-image-900 {
	display: none;
}
.gantry-image-1200 {
	display: block;
}

/* Pilot Program page and Pilot Program Overview page | Top section, green (emerald) right column */
.emerald {color: #fff; background-color: #00893D;}
.emerald h3 {font-size: 26px; font-family: Oswald, arial, sans-serif; margin: 15px 0 10px 10%; padding-top: 0px; border-bottom: none;}
.emerald p {margin-left: 10%; margin-right: 10%; line-height: 1.5em;}

/* Pilot Program page | Lower section */
.article-row {
	background-color: #00893D;
}
.article {
	width: 45%;
	margin: 3% auto;
	padding: 1% 0 2% 0;
	color: #fff;
}
.article h2 {margin-bottom: 20px; color: #fff;}
.article p {font-size: 1.1em; margin: 0 0 10px 0; line-height: 1.2em;}
.article a:link, .article a:visited {color: #fff; text-decoration: none;}
.article a:focus, .article a:hover {color: #fff; text-decoration: underline;}

/* Pilot Program Overview page, left section */
.overview-flex {display: flex; flex-flow: row wrap; row-gap: 0px; padding: 0px;}
.tc-overview {padding: 1% 14% 4% 15%;}
.tc-overview h2 {color: #fff; font-family: Oswald, Arial, sans-serif; font-size: 32px; border-bottom: none;}
.tc-overview-left {width: 65%; flex-grow: 0; flex-shrink: 1; flex-basis: auto;}
.tc-overview-left img.toll-credits-logo {margin: 1% auto; display: block; float: none; width: 65%; flex-grow: 0; flex-shrink: 1; flex-basis: auto; align-content: stretch;}
.tc-overview-left p {font-family: 'Roboto', Arial, sans-serif; font-size: 14px; line-height: 1.6em; margin-bottom: 25px;}
.tc-overview-right {width: 35%; flex-grow: 0; flex-shrink: 1; flex-basis: auto; align-content: stretch; margin-top: 1%;}
.background-dk-slate {color: #fff; background-color: #404040;}

.app-updates {width: 65%; margin: 20px auto; padding: 10px 20px 10px 10px; border: solid 3px #6b5bad; border-radius: 18px;  text-align: center;}
.app-updates-left {width: 50%; float: left;}
.app-updates-right {width: 40%; float: right;}
.app-updates-left h3 {color: #4675b6; font-size: 26px; font-family: Oswald, Arial, sans-serif; background-color: inherit; margin: 0 0 0 0; border-bottom: none;}
.app-updates-right p {margin-top: 15px; margin-bottom: 0px;}
.app-accordion {
	width: 66%;
	margin: 30px auto 30px auto;
	padding: 10px 10px;
	border: solid 1px #babfb9;
}
.app-accordion span {background: #fff;}
.answer-toggle {
	display: block;
	color: #757575;
	font-size: 1.2em;
	line-height: 1.4em;
	margin: 0 auto;
	padding: 0;
	font-weight: 400;
	font-family: 'Roboto', Arial, sans-serif;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
	border-bottom: 0;
}
.answer-toggle button span {
	content: url("../images/plus_sign.png");
}
.answer-toggle.active button span {
	content: url("../images/minus_sign.jpg");
}
.answer-toggle::before {
	content: none;
}
.answer-toggle.active::before {
	content: none;
}
.answer-toggle:hover, .answer-toggle.active {
	color: #404040;
	text-decoration: none;
	font-weight: 500;
}
.answer-content {
	display: none;
	margin: 0 auto;
	padding: 10px 0 10px 2.7%;
}
.publicationTitle a, .publicationTitle .publicationTitle-button {
	font-family: Oswald, Arial, sans-serif;
	text-transform: none;
	font-weight: 400;
	color: #404040;
	font-size: 1em;
	letter-spacing: 0.01em;
	line-height: 1.25em;
	margin: 0px;
	background: transparent;
	border: 0;
	text-align: left;
	width: 100%;
}
.publicationTitle-button span {float: right;}
.format-options {
	width: 100%;
	clear: both;
	margin: 10px 0;
	color: #ccc;
}
.item-desc p {
	margin-bottom: 15px;
}
.item-desc ul {
	margin: 0 0 0 30px;
}
.item-desc ul li {
	font-family: 'Roboto', Arial, sans-serif;
	font-size: 14px;
	line-height: 1.6em;
	margin-bottom: 10px;
}
.item-desc ul:first-child {
	margin-top: 10px;
}
.item-desc :last-child {
	padding-bottom: 0px;
}

/* Media Queries for the Pilot Program page and the Pilot Program Overview page */
@media only screen and (max-width: 1200px) {
	.pilot-flex img.toll-credits-logo, .overview-flex img.toll-credits-logo {
		-ms-flex: 0 1 80%;
		-webkit-box-flex: 0;
		flex: 0 1 80%;
	}
	.gantry-image-900 {
		display: none;
	}
	.gantry-image-1200 {
		display: block;
	}
	.article {
		width: 60%;
	}
}
@media only screen and (max-width: 900px) {
	.pilot-flex, .overview-flex {
		flex-flow: column;
	}
	.tc-pilot-left, .tc-overview-left {
		width: 100%;
		-ms-flex: 0 1 auto;
		-webkit-box-flex: 0;
		flex: 0 1 auto;
	}
	.tc-pilot-right {
		width: 100%;
		/* height: 100vh; */
		-ms-flex: 0 1 auto;
		-webkit-box-flex: 0;
		flex: 0 1 auto;
		background-color: #00893D;
	}
	.tc-overview-right {
		width: 100%;
		-ms-flex: 0 1 auto;
		-webkit-box-flex: 0;
		flex: 0 1 auto;
	}
	.gantry-image-1200 {
		display: none;
	}
	.gantry-image-900 {
		display: block;
	}
	.gantry-image-768 {
		display: none;
	}
	.tc-pilot-left img.toll-credits-logo, .tc-overview-left img.toll-credits-logo {
		width: 75%;
		-ms-flex: 0 1 100%;
		-webkit-box-flex: 0;
		flex: 0 1 100%;
	}
	.article {
		width: 80%;
	}
}
@media only screen and (max-width: 768px) {
	.gantry-image-1200 {
		display: none;
	}
	.gantry-image-900 {
		display: none;
	}
	.gantry-image-768 {
		display: block;
	}
	.article {
		width: 90%;
	}
	.app-accordion, .app-updates {
		width: 100%;
		padding-right: 1%;
		padding-left: 1%;
	}
}
@media only screen and (max-width: 479px) {
	.tc-pilot-left img.toll-credits-logo, .tc-overview-left img.toll-credits-logo {
		width: 95%;
		-ms-flex: 0 1 100%;
		-webkit-box-flex: 0;
		flex: 0 1 100%;
	}
	.gantry-image-1200 {
		display: block;
	}
	.gantry-image-900 {
		display: none;
	}
	.gantry-image-768 {
		display: none;
	}
	.app-accordion, .app-updates {
		width: 95%;
		padding-right: 1%;
		padding-left: 1%;
	}
}