/*!
* 08/30/2019
* Version 1.0
* Hondros CSS RFI Styles
* wsoe@apuswsoe.info
* Andrew Paulson
*/

/* RFI Overlay Styles (and markup for no aside) */
article.content.no-sidebar {
	display: block;
	width: 100%;
	margin: 0 auto;
	max-width: 600px;
	float: none;
}
section.tagline.no-sidebar h2 {
	max-width: 600px;
	margin: 0 auto;
}

/*
 Default styles + Mobile first
 Offscreen menu style
*/
.rfi-off-canvas {
  position: absolute;
  left: -100%;
  top: 0;
  height: 100%;
  width: 100%;
  overflow-y: scroll;
  overflow-x: visible;
	-webkit-overflow-scrolling: touch;
  transition: left 0.5s ease;
  z-index: 99900000;
}

.rfi-off-canvas section {
  margin: 0 auto;
  padding: 2.5em;
  min-height: 100%;
  width: 100%;
  background-color: var(--color-brand-green);
}

.rfi-off-canvas .menu-close {
	background: #555;
  position: absolute;
  right: 1em;
  top: 1em;
}

.rfi-off-canvas .menu-close:hover,
.rfi-off-canvas .menu-close:focus {
	background: #aaa;
}
.rfi-open {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
}

/*
 On small devices, allow it to toggle...
*/
/*
 :target for non-JavaScript
 aria-expanded="true/false" will be for JavaScript
*/
.rfi-off-canvas:target,
.rfi-off-canvas[aria-expanded="true"] {
  left: 0;
  outline: none;
  -moz-box-shadow: 3px 0 12px rgba(0,0,0,.25);
  -webkit-box-shadow: 3px 0 12px rgba(0,0,0,.25);
  box-shadow: 3px 0 12px rgba(0,0,0,.25);
}

.rfi-off-canvas:target .menu-close,
.rfi-off-canvas[aria-expanded="true"] .menu-close {
  z-index: 1001;
}

.rfi-off-canvas:target section,
.rfi-off-canvas[aria-expanded="true"] section {
  position: relative;
  z-index: 1000;
}

/*
 We could us `.rfi-off-canvas:target:after`, but
 it wouldn't be clickable.
*/
.rfi-off-canvas:target + .backdrop,
.rfi-off-canvas[aria-expanded="true"] + .backdrop {
  position: absolute;
  display: block;
  content: "";
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 998;
  cursor: default;
}

#off-canvas-rfi {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
}

#rfi-info {
	color: #fff;
	flex-basis: 40%;
	flex-grow: 0;
	padding: 0 1em;
}

#rfi-info h2 {
	font-size: 2.75em;
	line-height: 1;
}
#rfi-info h3 {
	/* text-transform: capitalize; */
}
#rfi-info a, #off-canvas-rfi #rfi a {
	color: #fff;
	text-decoration: underline;
}
#rfi-info a:active, #rfi-info a:hover, #rfi a:active, #rfi a:hover {
  opacity: 0.75;
}

#rfi {
	flex-basis: 60%; /* updated - not displaying info */
	max-width: 700px;
	flex-grow: 0;
	margin: 0 auto;
	padding: 0 1em;
  color: var(--color-hondros-sec-white);
}

/* Selects any <input> element that is read-only */
/* Supported in Firefox with a prefix */
#rfi input[type="text"]:-moz-read-only {
	background-color: var(--color-rfi);
	color: var(--color-text);
	pointer-events: none;
}
/* Supported in Blink/WebKit/Edge without a prefix */
#rfi input[type="text"]:read-only {
	background-color: var(--color-rfi);
	color: var(--color-text);
	pointer-events: none;
}
/* Selects any <select> element that is disabled */
#rfi input[disabled], #rfi select[disabled] {
	background-color: var(--color-rfi);
	color: var(--color-text);
	pointer-events: none;
}
#rfi .mktInput.locked .mktFormMsg {
	display: none;
    background-color: #fff;
    padding: 20px 10px;
		margin: 0 1em;
    width: calc(100% - 2em);
    position: absolute;
    border-radius: 3px;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
    left: 0;
    color: #1E2021;
    font-size: 15px;
    line-height: 1;
}
#rfi .mktInput.locked:hover .mktFormMsg {
	display: block;
}
#rfi select, #rfi input {
	color: var(--color-text);
	border: 2px solid #fff;
	border-radius: 0;
}
#rfi select option {
	background-color: rgba(255, 255, 255, 1);
	color: var(--color-text);
}

#rfi .button-rfi input {
	border: 0;
	color: var(--color-hondros-sec-black);
}

#rfi select:hover, #rfi input:hover, #rfi select:focus, #rfi input:focus {
	color: var(--color-text);
	background-color: rgba(255, 255, 255, 1);
}
#rfi .mktLblLeft li:nth-child(1),#rfi .mktLblLeft li:nth-child(2),#rfi .mktLblLeft li:nth-child(3), #rfi .mktLblLeft li:nth-child(4), #rfi .mktLblLeft li:nth-child(6), #rfi .mktLblLeft li:nth-child(7), #rfi .mktLblLeft li:nth-child(8) {
	width: 50%;
	float: left;
}
#rfi .progressIndicator > * {
  background-color: #15342c;
}
#rfi .progressIndicator .active {
  background-color: white;
}
#rfi label {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
	color: var(--color-hondros-sec-black);
}
.groupedInputs {
  display: flex;
  justify-content: space-between;
}
.groupedInputs .mktInput {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: calc(50% - 5px);
}
#rfi-overlay-content {
	text-align: center;
}
.rfi-overlay-button {
	margin: 0;
}

@media only screen and (max-width:1160px) {
	#rfi-info {
  	flex-basis: 50%;
			flex-direction: row;
	}
	#rfi-info h2 {
		font-size: 2em;
		line-height: 1;
	}
}
@media only screen and (max-width:900px) {
	section#off-canvas-rfi {
		flex-direction: column-reverse;
	}
	#rfi-info, #rfi {
    flex-basis: 100%;
		padding: 0;
	}
}
@media only screen and (max-width:767px) {
	#rfi .mktLblLeft li {
		float: none !important;
		width: 100% !important;
	}
  .groupedInputs {
    display: block;
  }
}
@media only screen and (max-width:500px) {
	.rfi-off-canvas section {
		padding: 1em;
	}
	#rfi {
    width: calc(100% - 2em);
  }
}
/* off canvas side by side fields */
#off-canvas-rfi #rfi .wForm form > div.oneField {
  flex-basis: 48%;
	max-width: 48%;
	flex-grow: 0;
	flex-shrink: 1;
}
@media only screen and (max-width:600px) {
	#off-canvas-rfi  #rfi .wForm form > div.oneField {
	  flex-basis: 100%;
		max-width: 100%;
		flex-grow: 0;
		flex-shrink: 1;
	}
}

@supports (position: fixed) {
  .rfi-off-canvas,
  .rfi-off-canvas:target + .backdrop,
  .rfi-off-canvas[aria-expanded="true"] + .backdrop {
    position: fixed;
  }
}
/* End RFI Overlay */

/* RFI in Page Overrides for LP6 */
.flex #rfi {
	flex-basis: 100%;
	max-width: 100%;
	width: 100%;
	flex-grow: 0;
	margin: 0;
	padding: 1em;
}
.flex #rfi label {
  /* white-space: normal; */
}
.flex #rfi .wFormFooter, .flex #rfi .supportInfo {
	display: none;
}
.flex #rfi .htmlContent {
	font-size: 0.8em;
	line-height: 1.25em;
}
#rfi .wForm form {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}
#rfi .wForm form > div.oneField {
	flex-basis: 100%;
	max-width: 100%;
	flex-grow: 0;
	flex-shrink: 1;
}
/* no
@media only screen and (max-width:600px) {
	#rfi .wForm form > div.oneField {
	  flex-basis: 100%;
		max-width: 100%;
		flex-grow: 0;
		flex-shrink: 1;
	}
}
@media only screen and (min-width:800px) and (max-width:1100px) {
	#rfi .wForm form > div.oneField {
	  flex-basis: 100%;
		max-width: 100%;
		flex-grow: 0;
		flex-shrink: 1;
	}
}
@media only screen and (min-width:1200px) and (max-width:1400px) {
	#rfi .wForm form > div.oneField {
	  flex-basis: 100%;
		max-width: 100%;
		flex-grow: 0;
		flex-shrink: 1;
	}
}
*/


/* End RFI in Page */

/* WFORMS Overrides (Form Builder) */
#rfi .wForm {
	padding: 0;
	font-family: inherit;
	color: var(--color-hondros-sec-black);
}
#rfi .wForm .inputWrapper {
	display: block;
}
#rfi .wFormContainer .wFormTitle {
	padding: 0;
	font-weight: 400;
}
#rfi .wForm .oneField {
	padding: 0;
}
#rfi .wForm form > div.oneField {
	margin-top: 0;
}
#rfi .wForm select, #rfi .wForm input, #rfi .wForm input[type="text"], #rfi .wForm input[type="time"], #rfi .wForm input[type="number"], #rfi .wForm input[type="url"], #rfi .wForm input[type="email"],
#rfi .wForm textarea {
	display: inline-block;
	text-decoration: none;
	-webkit-appearance: none;
	color: var(--color-hondros-sec-black);
	background-color: #fcfcfc;
	border: 1px solid var(--color-brand-gray);
	border-radius: 2px;
	width: 100%;
	text-align: left;
	margin-bottom: .5em;
}
#rfi input.validate-email {
	text-transform: none;
}
#rfi .wForm select:focus, #rfi .wForm input:focus {
	display: inline-block;
	text-decoration: none;
	-webkit-appearance: none;
	color: var(--color-hondros-sec-black);
	background-color: #fff;
	border: 1px solid var(--color-brand-gray);
	border-radius: 0;
	width: 100%;
	text-align: left;
	margin-bottom: .5em;
}
#rfi .wForm label.label {
	font-size: 90%;
	padding: 0;
}
#rfi .wForm .labelsAbove label.preField {
	padding-bottom: 4px;
}
#rfi .wForm label.preField {
	min-width: auto;
	padding-right: 5px;
}
div.actions {
	width: 100%;
}
#rfi .wForm input[type="submit"] {
	width: 100%;
	color: #fff;
	background-color: var(--color-brand-royal-blue);
	border-color: var(--color-brand-royal-blue);
	border-radius: 5rem;
	pointer-events: all;
	text-align: center;
}
#rfi .wForm input[type="submit"]:hover {
	color: #fff;
	background-color: var(--color-brand-royal-blue--light);
	border-color: var(--color-brand-royal-blue--light);
}
#rfi .wForm select option {
	background-color: rgba(255, 255, 255, 1);
	color: var(--color-hondros-sec-black);
}
#rfi .wForm button, #rfi .wForm input, #rfi .wForm select, #rfi .wForm input.primaryAction, #rfi .wForm input[type="text"], #rfi .wForm input[type="time"], #rfi .wForm input[type="number"],
#rfi .wForm input[type="url"], #rfi .wForm input[type="email"], #rfi .wForm textarea {
	transition: 0.3s;
	-moz-transition: 0.3s;
	-webkit-transition: 0.3s;
	padding: 0.75em;
	display: inline-block;
	font-size: 16px;
}
#rfi .wForm .inline div.oneField {
	width: 100%;
}
#rfi .wForm .htmlSection {
	border: none;
	padding: 0 0 0 2px;
	margin-bottom: 10px;
}
#rfi .wForm .actions {
	border: none;
}
#rfi .wForm input[type="submit"] {
  font-family: "Avenir-Black", sans-serif;
  font-size: 1em;
}
#rfi #tfa_93, #rfi #tfa_96, #rfi #tfa_97, #rfi #tfa_104 {
	display: none;
}
#rfi .wForm .reqMark::after {
    color: var(--color-hondros-sec-white);
}