/* forms.css */ 
:root {
	--gold: #fccc0a;
	--lightBlue: #00aeed;
	--darkBlue: #004f87;
	--darkerBlue: #00456f; 
}

::placeholder {
	color: #fff;
	opacity: 0.5; 
  }
  
  ::-ms-input-placeholder { /* Edge 12 -18 */
	color: #fff;
	opacity: 0.5; 
  }

form, fieldset, legend, label, input, textarea, select, button {
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";  
}
form {
	display: inline-block; 
	box-sizing: border-box; 
	clear: both; 
	
}
fieldset {
	display: block; width: 100%; 
	border: 0px; 
	box-sizing: border-box;
}

legend {
	display: none; clear: both; width: 100%; 
	box-sizing: border-box; 
}

input[type=submit],
input[type=search],
button,
select {
	-webkit-appearance: none;
	appearance: none; 	
}


label, input, textarea, select {
	padding: 10px 15px; 
	border: 0; 
	outline: 0; 
	box-sizing: border-box; 
	font-size: 1rem; 
	font-family: "ProximaNova-Regular", Helvetica,Arial,Verdana,sans-serif;
}
textarea {
	width: 100%; min-height: 150px; 	
}


span {
	display: block; clear: both; width: 100%; 
	box-sizing: border-box; 
}

dl {
    display: inline-block;
    box-sizing: border-box;
    padding: 0px;
    margin: 0px;
    width: 100%;	
}

dl dt {
    vertical-align: top;
    width: 80px;
    font-weight: bolder;
    box-sizing: border-box;
    float: left;
    clear: left;
	margin-top: 5px; 
}

dl dd {
	vertical-align: top;
    /* width: calc(100% - 80px); */
    margin: 0px;
    padding-left: 80px; /* Match <dt /> */ 
    box-sizing: border-box;	
	margin-top: 5px; 
}

ul.form-fields {
	display: inline-block; 
	clear: both; list-style-type: none; 
	padding: 0px; margin: 0px; 
}
ul.form-fields li {
	display: block; width: 100%; clear: both; 
	box-sizing: border-box; 
	margin-top: 10px; 
}
ul.form-fields li:first-child {
	margin-top: 0px; 	
}


ul.form-fields li.form-actions {
	display: block; width: 100%; clear: both; 
	margin-top: 20px; text-align: right; 
}



ul.form-fields li label {
	display: block; clear: both; 
	width: 100%; 
}



i.ui-toggle {
	display: inline-block; width: 35px; height: 20px; 
	margin: 0px; padding: 0px;
	position: relative; 
	overflow: hidden; 
}
	/* The "button" */ 
	i.ui-toggle input[type=checkbox] {
		display: block; width: 20px; height: 20px; 
		border: 2px solid var(--gold); 
		-webkit-appearance: none; 
		appearance: none; 
		line-height: 100%; 
		margin: 0px; padding: 0px; 
		-webkit-border-radius: 20px;
		border-radius: 20px;		
		position: absolute; 
		top: 0px; left: 0px; 
		z-index: 3; 
		cursor: pointer !important; 
		-webkit-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;	
		background-color: var(--darkerBlues); 
		/*
		-webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.5);
		box-shadow: 0 0 10px 0 rgba(0,0,0,0.5);
		*/
	}
	
	i.ui-toggle input[type=checkbox]:checked {
		left: auto; right: 0px; 
	}
	
	/* The "container" */ 
	i.ui-toggle label {
		display: block; width: 100%; height: 100%; 
		box-sizing: border-box; content: ""; 
		-webkit-border-radius: 20px;
		border-radius: 20px;	
		border: 2px solid var(--gold);
		background-color: var(--darkBlue); 
		line-height: 100%; 	
		margin: 0px; padding: 0px; 
		-webkit-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;			
	}
	
	i.ui-toggle input[type=checkbox]:checked + label {
		background-color: var(--gold); 
	}

	input.download, 
	a.button.download {
		background-image: url('../images/static/download-icon-blue.svg'); 
		background-repeat: no-repeat; 
		background-position: right 10px top 4px; 
		padding-right: 40px; 
	}
	
	input.external-link, 
	a.button.external-link {
		background-image: url('../images/static/icon-globe-v2-white.svg'); 
		background-repeat: no-repeat; 
		background-position: right 10px top 4px; 
		padding-right: 40px; 
	}		
	
	
	input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
	textarea,
	select {
		border: 2px solid #fff; 
		background-color: #fff; 
		color: #333; 
		visibility: visible; 
		display: block; 
		-webkit-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;		
		border-radius: 2px; 	
			
	}
	input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):focus,
	textarea:focus,
	select:focus {
		border: 2px solid #fff; 
		visibility: visible; 
		display: block; 
	}

	input::placeholder, 
	select::placeholder, 
	textarea::placeholder {
		color: #333; 
		opacity: 0.8; 	
	}
	
	input[type=checkbox]{
		display: inline-block; width: 30px; height: 30px; 
		border: 2px solid #fff; 
		-webkit-appearance: none; 
		appearance: none; 
		padding: 0px; margin: 0px; box-sizing: border-box; 
		vertical-align: middle; 
		line-height: 100%; 
		cursor: pointer !important; 
		position: relative; top: -2px; /* Slight shift for better alignment */ 
		-webkit-transition: all 500ms ease-in-out;
		transition: all 500ms ease-in-out;		
	}
	
	input[type=checkbox]:checked {
		border: 2px solid #fff; 
	}	
 
	
	select {
		-webkit-appearance: none;
		appearance: none; 
		cursor: pointer !important; 	
	}
	
	
	input[type=submit],
	input[type=button],
	button,
	.button {
		appearance: none; 		
		cursor: pointer !important; 
		transition: all 500ms ease-in-out;		
		border-radius: 2px;
		display: inline-block; 
		padding: 10px 15px;
		font-size: 1.2rem; 
		margin: 10px 0px;  
		text-transform: uppercase;		
		text-decoration: none; 		
		font-family: "Rambla", sans-serif;
		font-weight: 700;
		font-style: normal;		
		background-color: #F78764; 
		color: #fff !important; 
		width: 100%; 
		text-decoration: none !important; 
		text-align: center !important; 
		box-sizing: border-box;
	}

	input[type=submit].white,
	input[type=button].white,
	button.white,
	.button.white {
		background-color: #fff; color: #5D538D !important; 
	}
	input[type=submit].white:hover,
	input[type=button].white:hover,
	button.white:hover,
	.button.white:hover {
		background-color: #fff; color: #5D538D !important; 
	}	
	

	
.notification {
	display: inline-block; box-sizing: border-box; 
	width: 100%; padding: 20px; margin: 20px auto;
	font-size: 1rem; 
	text-align: left; 
}
	.notification p {
		margin: 0px; 
		margin-top: 15px; 	
	}
	.notification p:first-child {
		margin-top: 0px; 	
	}
	
	.notification a.close {
		display: inline-block; 
		margin-top: 20px; 	
	}

.notification.success {
	border: 1px solid #c3e6cb; 
	background-color: #d4edda;
	color: #0b2e13;
}
.notification.error	 {
	border: 1px solid #f5c6cb; 
	background-color: #f8d7da;
	color: #491217;
}
.notification.warning {
	border: 1px solid #ffeeba; 
	background-color: #fff3cd;
	color: #533f03;
}
.notification.info {
	border: 1px solid #bee5eb; 
	background-color: #d1ecf1;
	color: #062c33;
}