/** TEST AREA **/

/** Form Chooser Customizations **/
.ggeTabPanelContainer {
	border: none;
	/* border-top: 1px solid #999; */
	border-top: 1px solid #005496;
	border-radius: 0;
}

.ggeFormChooser:active, .ggeFormChooser:focus, .ggeTabPanelContainer:active, .ggeTabPanelContainer:focus, .ggeTabPanel:active, .ggeTabPanel:focus {
	border-left: none !important;
	border-right: none !important;
	border-bottom: none !important;
	outline: none;
}

.ggeTabListItem--selected button:hover, .ggeTabListItem button:hover {
	background-color: #f37f36;
	color: #fff;
}

.ggeTabListItem--selected button {
	background-color: #005496;
	border-color: #005496;
	/* color: #005496; */
	color: #fff;
}

/** OVERRIDE THEME SECTION CONTROLS **/
section.ggeSection, section.ggePaymentPlan {
	padding-top: 0;
	padding-bottom: 0;
}

section.ggeWidget form[id] .ggeSection--donation .ggePrompt .ggePrompt__label > label {
    display: block;
    margin: 0;
    padding: 0.5em 0;
    border: 2px solid #d3d9d9;
    border-radius: 5px;
    background: transparent;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.3;
    white-space: nowrap;
    color: #333;
    min-width: unset;
    width: calc(100% - 2px);
    text-align: center;
	transition: 0.25s all;
}

section.ggeWidget form[id] .ggePrompt .ggePrompt__label > label {
    margin: 8px 16px 0 0;
    cursor: pointer;
    padding: 16px 8px 0 0;
    display: inline-block;
}

section.ggeWidget form[id] .ggeSection .ggeQuestion__caption {
    flex: 1 0 100%;
    margin-left: 0;
}
.ggePrompt .ggeQuestion__caption {
    cursor: default;
    margin-bottom: 0.5em;
}

/** STRETCH THE DONATION AMOUNTS **/
section.ggeWidget form[id] .ggeSection.ggeSection--donation fieldset[id] .ggePrompts {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-column-gap: 1em;
    justify-items: stretch;
}
section.ggeWidget form[id] .ggeSection.ggeSection--donation fieldset[id] > .ggePrompts .ggePrompt__other { grid-column: span 1;}

.ggePrompt__label { display: block; }

/** SHOW OTHER TEXT INPUT WHEN SELECTED **/
section.ggeWidget form[id] .ggeSection.ggeSection--donation .ggePrompt__other .ggePrompt.ggePrompt--checked .ggePrompt__label > label { /* display:none; */}
section.ggeWidget form[id] .ggeSection.ggeSection--donation .ggePrompt__other .ggePrompt.ggePrompt--checked + .ggePrompt:last-of-type > .ggePrompt__label > input.ggeQuestion--money {
  display: block;
}

/* CONDENSED PROFILE SECTION */
section.ggeWidget form[id] section.ggeSection--profile {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-column-gap: 1.5rem;
	justify-items: stretch;
}
/** SET HEADER AND PROFILE QUESTIONS DEFAULT COLUMN SPAN **/
section.ggeWidget form[id] .ggeSection--profile header,
	section.ggeWidget form[id] .ggeSection--profile .ggeQuestion	{ grid-column: 1/-1;}

/** SET ALTERNATE COLUMN SPAN & POSITIONING FOR SPECIFIC QUESTIONS WITH CUSTOM CSS CLASSNAMES **/
section.ggeWidget form[id] .ggeSection--profile .ggeQuestion:first-of-type,
	section.ggeWidget form[id] .ggeSection--profile .ggeQuestion:nth-of-type(2) { grid-column: span 3;}
section.ggeWidget form[id] .ggeSection--profile .ggeQuestion:nth-of-type(3) { grid-column: span 6;}

/** MAILING ADDRESS QUESTION AS GRID **/
section.ggeWidget form[id] .ggeSection .ggeAddress {
	grid-column: 1/-1;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-column-gap: 1.5rem;
	justify-items: stretch;
}
section.ggeWidget form[id] .ggeSection .ggeAddress.ggeHidden { display:none;}
section.ggeWidget form[id] .ggeSection .ggeAddress > .ggeQuestion { grid-column: span 1;}
section.ggeWidget form[id] .ggeSection .ggeAddress .ggeAddress__country { grid-column: 1/-1;}
section.ggeWidget form[id] .ggeSection .ggeAddress .ggeAddress__street1 { grid-column: 1/span 2;}

section.ggeWidget form[id] ggeQuestion.ggeSection--donation .ggePrompt__other .ggeQuestion__caption { display: none !important; }

/* CONDENSED PAYMENT SECTION */
section.ggeWidget form[id] section.ggeSection--payment {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-column-gap: 1.5rem;
	justify-items: stretch;
}
section.ggeWidget form[id] section.ggeSection--payment header { grid-column: span 6; }

section.ggeWidget form[id] .ggePayment--cardholder { grid-column: span 3; }

/* CREDIT CARD */
section.ggeWidget form[id] section.ggeSection--payment .ggeQuestion.ggePayment--credit--nameOnCard { grid-column: span 6;}
section.ggeWidget form[id] section.ggeSection--payment .ggeQuestion.ggePayment--credit--account { grid-column: span 4;}
section.ggeWidget form[id] section.ggeSection--payment .ggeQuestion.ggePayment--credit--verification { grid-column: span 2;}
section.ggeWidget form[id] section.ggeSection--payment .ggeQuestion.ggePayment--credit--monthExpires,
section.ggeWidget form[id] section.ggeSection--payment .ggeQuestion.ggePayment--credit--yearExpires { grid-column: span 3;}

/** CARDHOLDER EMAIL FIX **/
section.ggeWidget form[id] .ggePayment--cardholder:nth-of-type(3) {
	grid-column: span 6;
}

/** MAKE BOXES FILL THE SPACE **/
input[type=text], input[type=email] {
	width: 100%;
}

/** HIDE RADIO BUTTONS - EXCEPT THIS DIDN'T WORK **/
section.ggeWidget form[id] .ggeSection--donation .ggePrompt .ggePrompt__radio { display: none;}

/* RADIO BUTTON PROMPTS IN QUESTION SECTION */
section.ggeWidget form[id] .ggeSection.ggeSection--question .ggeQuestion--mcsr fieldset[id] .ggePrompts { width: 100%;}
section.ggeWidget form[id] .ggeSection.ggeSection--question .ggeQuestion--mcsr fieldset[id] .ggePrompts .ggePrompt {
  display: inline-block;
  width: auto;
}

/** FIX THE STATE QUESTION **/
.ggeQuestion select {
	/* width: calc(100% - 34px); This was the original */
	width: 100%;
}

/** HIGHLIGHT SELECTED AMOUNT **/
section.ggeWidget form[id] .ggeSection--donation .ggePrompt.ggePrompt--checked .ggePrompt__label > label {
	background-color: #005496;
	border-color: #005496;
	color: #fff;
}

/ section.ggeWidget form[id] .ggeSection--donation .ggePrompt .ggePrompt__label > label:hover {
    color: white;
    background-color: #f37736;
    border-color: #f37736;
}

/** PREVENT THE LABEL FOR PAYMENT PLAN FROM DISAPPEARING **/
section.ggeWidget form[id] .ggeSection--donation .ggePrompt--ongoingOption.ggePrompt.ggePrompt--checked .ggePrompt__label > label {
	background: none;
	border: none;
	color: inherit;
}

/** HIDE ADDITIONAL QUESTIONS HEADER **/
section.ggeWidget form[id] .ggeSection--question header {
	display: none;
}

/** KEEP WIDTH OF OTHER OPTION WHEN TEXT FIELD IS HIDDEN **/
.ggePrompt__other { display: table; }

/** FROM ANDREW SHATTUCK **/
/* HIDE OTHER TEXT INPUT & CAPTION BY DEFAULT */
section.ggeWidget form[id] .ggeSection.ggeSection--donation .ggePrompt__other .ggePrompt:last-of-type .ggePrompt__label > input.ggeQuestion--money,
section.ggeWidget form[id] .ggeSection.ggeSection--donation .ggePrompt__other .ggePrompt:last-of-type .ggePrompt__label > span.ggeQuestion__caption { display:none;}

/* SHOW OTHER TEXT INPUT WHEN SELECTED */

section.ggeWidget form[id] .ggeSection.ggeSection--donation .ggePrompt__other .ggePrompt.ggePrompt--checked .ggePrompt__label > label { /* display:none; */ }
section.ggeWidget form[id] .ggeSection.ggeSection--donation .ggePrompt__other.ggePrompt--checked .ggePrompt:last-of-type .ggePrompt__label > input.ggeQuestion--money,
section.ggeWidget form[id] .ggeSection.ggeSection--donation .ggePrompt__other .ggePrompt.ggePrompt--checked + .ggePrompt:last-of-type > .ggePrompt__label > input.ggeQuestion--money {
  display: block;
	margin: 3px 0 0 0;
	padding: .5em;
	border: 1px solid #005496;
	border-radius: 5px;
    /* background-color: #f36f21; */
	background-color: #005496;
	font-size: 20px;
	font-weight: bold;
	line-height: 1.3;
	white-space: nowrap;
	color: white;
	min-width: unset;
  width: calc(100% - 1em - 2px);
	text-align: center;
}
section.ggeWidget form[id] .ggeSection.ggeSection--donation .ggePrompt__other .ggePrompt.ggePrompt--checked + .ggePrompt:last-of-type > .ggePrompt__label > input.ggeQuestion--money:active,
section.ggeWidget form[id] .ggeSection.ggeSection--donation .ggePrompt__other .ggePrompt.ggePrompt--checked + .ggePrompt:last-of-type > .ggePrompt__label > input.ggeQuestion--money:focus
{
  background-color: #ffffff !important;
	color: #f36f21 !important;
  box-shadow: 0 0 5px rgba(243, 111, 33, 1) !important;
	border-color: #f36f21 !important;
}

/** OTHER CUSTOMIZATIONS **/
/** CUSTOM h1 **/
.ggeSection header h1, h1.sectHead {
	color: #005396;
	/* font-size: 27px; */
	font-size: 1.2em;
	margin: 1.7em 0 0.75em 0;
}

.ogf-addinfo textarea {
	width: 100%;
}

.ogf-addinfo {
	margin-top: 24px;
}

/** Lightening & styling the boxes **/
.ggeQuestion--required input[type="text"],
.ggeQuestion--required input[type="email"],
.ggeQuestion--required .ggeAddress__street2 input[type="text"],
.ggeQuestion input[type="text"],
.ggeQuestion select,
.ggeQuestion textarea {
	/* border-color: #c9c0bb; */
	background-color: #fdfdfd;
	border: 2px solid #d3d9d9;
	border-radius: 5px;
	color: #000;
	padding: 6px 10px;
	transition: 0.5s all;
}

.ggeQuestion--required input[type="text"]:focus,
.ggeQuestion--required input[type="email"]:focus,
.ggeQuestion--required .ggeAddress__street2 input[type="text"]:focus,
.ggeQuestion input[type="text"]:focus,
.ggeQuestion select:focus {
	border-color: #f36f21;
}

/** Airing out the form a little **/
.ggeQuestion {
	margin-bottom: 5px;
}

.ggeQuestion__label {
	color: #333;
	font-size: 90%;
}

/** Restyling Required Fields **/
.ggeQuestion--required label {
	font-weight: normal;
}

.ggeQuestion--required label::after {
	color: rgba(51, 51, 51, 0.75);
	content: "[Required]";
	font-size: 65%;
	margin-left: 5px;
	text-transform: uppercase;
}

.ggeSection--donation .ggeQuestion--required label::after,
.ggeQuestion--required .ggeAddress__street2 label::after {
	content: "";
}

/** Anonymous Checkbox **/
section.ggeWidget form[id] .ggeSection.ggeSection--profile .ggeQuestion--mcsr .ggePrompt__label {
	color: #333;
	display: table-cell !important;
	font-size: 90%;
}

section.ggeWidget form[id] .ggeSection.ggeSection--profile .ggeQuestion--mcsr .ggePrompt__label > label {
	margin-left: 9px;
}

/** Hiding Payment Information **/
.ggePayment--cardholder.ggeAddress {
	/* display: none  !important; */
}

/** Error Handling **/
.ggeQuestion--error {
	background: none;
}

.ggeQuestion--error label::before {
	color: #7f0000;
	content: "\f071";
	font-family: "FontAwesome";
	margin-right: 5px;
}

.ggeQuestion--error input[type="text"],
.ggeQuestion--error input[type="email"],
.ggeQuestion--error .ggeAddress__street2 input[type="text"],
.ggeQuestion--error input[type="text"],
.ggeQuestion--error select {
	background-color: rgba(127, 0, 0, 0.15);
	border-color: #7f0000;
}

.ggeQuestion__error {
	font-size: 75%;
}

/** Main Questions Section **/
section.ggeWidget form[id] section.ggeSection--question {
	display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-column-gap: 1em;
    justify-items: stretch;
}

/** Blocking and styling **/
.config-full {
	grid-column: span 6;
}

.config-half {
	grid-column: span 3;
	width: calc(100% - 10px);
}

.config-third {
	grid-column: span 2;
	width: calc(100% - 10px);
}

/** Toggle Tweaks **/
.toggle-div {
	transition: 0.25s all;
}

.fa-toggle-on, .fa-toggle-off {
	transition: 0.25s all;
}

.fa-toggle-on:hover, .fa-toggle-off:hover {
	color: #f36f21;
}

/** Recurring Form Tweaks **/
section.ggePaymentPlan {
	font-size: 90%;
}

section.ggePaymentPlan fieldset {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

section.ggePaymentPlan fieldset label {
	border: none !important;
}

section.ggePaymentPlan fieldset label:hover {
	background-color: inherit !important;
	color: inherit !important;
}

section.ggePaymentPlan fieldset label .ggePrompts .ggePrompt--oneTimeOption {
	display: none;
}

section.ggeWidget form[id] .ggeSection--donation .ggePrompt .ggePrompt__label > label:hover {
}

.ggePrompt--oneTimeOption {
	display: none;
}

/** ----- Giving Form Page CSS ------ **/

/** Fund Declaration **/
#fundinfo {
	color: #333;
	margin-left: 20px;
	width: calc(70% - 36px);
}

.funderror {
	color: #f36f37;
	padding-bottom: 18px;
}

.funderror i {
	font-size: 150%;
	top: 3px;
}

.fundselection {
	background-color: #005496;
	/* border: 2px solid #d3d9d9; */
	border: 2px solid #005496;
	border-radius: 5px;
	color: #ccc;
	font-size: 90%;
	padding: 8px;
}

.fundselection a {
	color: #d3d9d9;
	float: right;
	font-size: 150%;
	padding-left: 10px;
	padding-bottom: 10px;
	transition: 0.5s all;
}

.fundselection a:hover {
	color: #f36f37;
}

.funddetail {
	/* color: #f36f37; */
	/* color: #d3d9d9; */
	color: #fff;
	font-size: 1.2em;
	font-weight: bold;
}

/** Column/Section Set-Ups **/
.main-col {
	/* background-color: light-blue; */
	/* float: left; */
	/* flex: 1 0 auto; */
	order: 1;
	padding-right: 16px;
	width: calc(70% - 16px);
}

.sec-col {
	/* background-color: yellow; */
	/* float: right; */
	/* flex: 1 0 auto; */
	order: 2;
	padding-top: 2rem;
	padding-left: 16px;
	padding-right: 16px;
	width: calc(30% - 32px);
}

.ter-col {
	/* flex: 1 0 auto; */
	order: 3;
	width: calc(100% - 12px);
}

/** Toggle Controls & Accompanying CSS Classes **/
#gift-options, #ways-to-give {
	color: #333;
	font-size: 90%;
}

.controls {
	display: flex;
	flex-direction: column;
}

.ctrl-row, .owg-row {
	align-items: center;
	display: flex;
	justify-content: flex-start;
	margin: 5px 0;
}

.no-bus /* Hide these when Corporate Gift is selected */ {
}

#ways-to-give {
	margin-top: 36px;
}

#ways-to-give .owg-row {
	background-color: rgba(229,225,230,0.3);
	cursor: pointer;
	height: 5vh;
}

.toggle-div, .owg-icon {
	float: left;
	margin-right: 10px;
	transition: 0.5s all;
}

.owg-icon i {
	font-size: 1.5em;
	margin-left: 10px;
}

.owg-ai {
	padding: 10px;
	transition: 0.5s all;
	width: calc(100% - 20px);
}

.owg-ai a, .owg-ai span {
	display: block;
	font-size: 0.9em;
	padding-top: 10px;
	text-transform: uppercase;
	transition: 0.5s all;
}

.owg-ai a:hover {
	color: #f36f21;
}

.active1, .active2, .active3, .active4, .active5, .active6 {
	color: #005496;
}

.ogf-inhonor {
	display: inherit;
}

.filterhead {
	border: 2px solid #005496;
	/* color: #333;*/
	color: #005496;
	font-size: 1.2em;
	margin-top: 18px;
	margin-bottom: 18px;
	padding: 5px 0;
	text-align: center;
	text-transform: uppercase;
	width: 100%;
}

.turn-off {
		display: none !important;
}

.turn-on {
	display: block;
}

/** Recognition Name Caption **/
section.ggeWidget form[id] .ggeSection--profile .ggeQuestion:nth-of-type(3) .ggeQuestion__caption,
section.ggeWidget form[id] .ggeSection--profile .ggeQuestion:nth-of-type(7) .ggeQuestion__field .ggeQuestion__caption {
	background-color: #d3d9d9;
	color: #333;
	font-size: 75%;
	margin-top: -5px;
	margin-left: 2px;
	padding: 9px 10px 7px;
	width: 100%;
}

/** Anonymous Block/Statement **/
#AnonymousStatement {
	border-left: 18px solid rgba(229,225,230,0.3);
	color: #333;
	font-size: 90%;
	padding: 9px 18px;
}

#AnonymousStatement span {
	display: block;
	font-size: 0.9em;
	text-transform: uppercase;
}

/** One-Time Gift Interstitial **/
#interstitial {
	background-color: #d9e6ef;
	display: flex;
		align-items: center;
		justify-content: space-between;
	padding: 20px;
	width: 100%;
}

#btn-recurring {
	background-color: #5c676f;
	border-radius: 10px;
	color: #fff;
	cursor: pointer;
	float: right;
	margin-left: 20px;
	padding: 7px 11px;
}

/** Hide Native GGE Elements **/
.ggeEmbed, footer.ggeFooter {
	display: none;
}

/** MOBILE STYLES **/
.mobo {
	display: none;
}

@media (max-width: 599px) {
	
	.mobo {
		display: inherit;
	}
	
	.nomob {
		display: none;
	}
	
	.main-col {
		order: 2;
		width: calc(100% - 16px);
	}

	.sec-col {
		order: 1;
		padding-top: 0;
		width: calc(100% - 32px);
	}

	#fundinfo {
		width: calc(100% - 40px);
	}
	
	.filterhead {
		border: none;
		font-size: 1.34em;
		font-weight: bold;
		margin-bottom: 0.5em;
		text-align: left;
		text-transform: none;
	}
	
	.ggeTabPanelContainer {
		border: none !important;
		margin-right: 1em;
		padding: 0;
	}
	
	.ggeTabListItem {
		margin-top: 9px;
		width: 100%;
	}
	
	.ggeTabListItem button {
		border: 2px solid #d3d9d9;
		border-radius: 5px;
		width: 100%;
	}
	
	section.ggeWidget form[id] .ggeSection.ggeSection--donation fieldset[id] .ggePrompts {
		grid-template-columns: 1fr 1fr;
		grid-column-gap: 1em;
		justify-items: stretch;
	}
	
	section.ggeWidget form[id] .ggeSection.ggeSection--donation fieldset[id] .ggePrompt {
		margin-bottom: 12px;
	}
	
	section.ggeWidget form[id] .ggeSection.ggeSection--donation fieldset[id] > .ggePrompts .ggePrompt__other {
		grid-column: span 2;
	}
	
	.ggePaymentPlan--ongoingOption__interval {
		display: block;
		width: 100%;
	}
	
	section.ggePaymentPlan fieldset label {
		max-width: 100%;
	}

	section.ggeWidget form[id] section.ggeSection--profile,
	section.ggeWidget form[id] section.ggeSection--question,
	section.ggeWidget form[id] section.ggeSection--payment {
		display: block;
	}

	section.ggeWidget form[id] .ggeSection .ggeAddress {
		display: block;
	}
	section.ggeWidget form[id] .ggeSection .ggeAddress.ggeHidden { display:none;}
	section.ggeWidget form[id] .ggeSection .ggeAddress > .ggeQuestion { grid-column: span 1;}
	section.ggeWidget form[id] .ggeSection .ggeAddress .ggeAddress__country { grid-column: 1/-1;}
	section.ggeWidget form[id] .ggeSection .ggeAddress .ggeAddress__street1 { grid-column: 1/span 2;}
	
	#interstitial {
		display: block;
		width: calc(100% - 20px);
	}
	
	#btn-recurring {
		float: none;
		margin-left: 0;
		margin-top: 9px;
		text-align: center;
	}
	
	#ways-to-give {
		margin-top: 18px;
	}

}

/* CONFIRMATION MESSAGE TWEAKS */
.ggeConfirmation h1 {
	border: 1px solid #005496;
	font-size: 1.5em;
	letter-spacing: 2px;
	margin-bottom: 10px;
	padding: 5px;
	text-align: center;
	text-transform: uppercase;
}

.ggeConfirmationMessage {
	color: #f36f21;
	font-size: 1.25em;
	margin-bottom: 10px;
	text-align: center;
}

.ggeConfirmationMessage span {
	color: #333;
	display: block;
	font-size: 1em;
	padding-top: 10px;
}

.ggeConfirmationCode, .ggeConfirmationCharge {
	color: rgba(51, 51, 51, 0.75);
	font-size: .85em;
	text-align: center;
}

h1.HeroArchive-title {
	font-family: Newsreader, serif;
	font-size: 8vh;
	font-weight: bold;
	text-shadow: 5px 5px 5px #000;
}