/* Form Styles */
#cfgfc {
    background-color: #f0f8ff;
    background: url(images/bg.jpg) no-repeat;background-position: right center;background-size: cover;
    padding: 32px;
    color:#09233a;
    font-size: 16px;
    text-align: left;
    color: #ffffff;
    display: grid;grid-template-columns: 60% 40%;grid-gap: 0;
}

#cfgfc h2{
    text-align: left;
    font-weight: 400;
    color: #ffffff;
    font-size: 24px;
    padding: 0;
    margin: 0;
}

#cfgfc {text-align: left;}

#cfgfc .gridcontent {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left;
    width: 100%;
    background-color: rgba(0,0,0,0.5);
    padding: 20px;
}

/*fieldsets*/
#cfgfc div.fieldsets {position: relative; overflow: hidden;  -webkit-transition: height 1s; /* Safari prior 6.1 */ transition: height 1s;}
#cfgfc div.fieldsets fieldset { width: 100%; display: none; position: absolute;  border: none; float: left; padding: 1px 0 50px 0;}

/*paragraphs*/
#cfgfc p {margin:12px 0 4px 0;padding:0;text-align: left;color: #ffffff}
#cfgfc p a, #cfgfc p a:visited { !important;color: #ffffff}
#cfgfc p.warning {color:red;}
#cfgfc p.warning > label { color: red;}
#cfgfc p.warning input, #cfgfc p.warning select, #cfgfc p.warning textarea  { border-color: red !important; }
#cfgfc p.loading { background-image: url('805.gif'); width: 100%; height: 64px; display: block; background-position: center center; background-repeat: no-repeat; }

/* Inputs */
#cfgfc .inputfield {font-size: 16px;font-weight: 300;}

#cfgfc input[type=button] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

#cfgfc span.select {
	position: relative !important;
	display: block !important;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	width: auto;
}
#cfgfc input[type=text], #cfgfc input[type=tel], #cfgfc input[type=number], #cfgfc input[type=email], #cfgfc select, #cfgfc textarea {
	padding: 6px;
	border: 1px solid #ededed;
	border-radius: 3px;
	margin: 3px 0 10px 0;
	width: 100%;
	box-sizing: border-box;
	color: #09233a;
    outline: none;
    font-size: 16px;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

#cfgfc input[type=range] {
    background: none;
    border:none;
    padding:0;
}

#cfgfc input[type="checkbox"] {display:none;}
#cfgfc input[type="checkbox"] + label::before {
    width: 20px;
    height: 20px;
    border-radius: 3px;
    border: 1px solid #ededed;
    background-color: #fff;
    display: block;
    content: "";
    float: left;
    margin-right: 5px;
}

#cfgfc input[type="checkbox"].required+ label::before {border-color: #09233a;}
#cfgfc p.warning input[type="checkbox"] + label::before {border-color: red;}
#cfgfc input[type="checkbox"]:checked+label::before {box-shadow: inset 0px 0px 0px 3px #fff;background-color: #09233a;}

#cfgfc .validator, .cfgfc_page .validator{margin-left: -999px;height:0;}

/* Radio Buttons */
#cfgfc .selectbutton input[type="radio"] {
  opacity: 0;
  position: fixed;
  width: 0;
}
#cfgfc .selectbutton label {
    display: block;
    text-align: center;
    line-height: 30px;
    margin-top:12px;
    width: 100%;
    background-color:#E6E6E6;
    color: #09233a;
    cursor: pointer;
    box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.4);
}
#cfgfc .selectbutton label:hover, #cfgfc .selectbutton  input[type="radio"]:checked + label {color:#ffffff;background-color:#09233a !important;}

/* YesNo Buttons */
#cfgfc .yesno {display:grid;grid-template-columns: 49% 49%;grid-gap: 2%;}
#cfgfc .triple {display:grid;grid-template-columns: 24% 24% 50%;grid-gap: 1%;}

#cfgfc .yesnobutton input[type="radio"] {
  opacity: 0;
  position: fixed;
  width: 0;
}
#cfgfc .yesnobutton label {
    display: block;
    text-align: center;
    line-height: 30px;
    width: 100%;
    background-color:#E6E6E6;
    color: #09233a;
    cursor: pointer;
    box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.4);
}
#cfgfc .yesnobutton label:hover, #cfgfc .yesnobutton input[type="radio"]:checked + label {color:#ffffff;background-color:#09233a !important;}

/* Select */
#cfgfc select {-webkit-appearance: none;-moz-appearance: none;appearance: none;}
.dropdown {position: relative;}
.dropdown:after {
    content:"\f078";
    font-family: FontAwesome;
    color: #585858;
    padding: 13px 8px;
    position: absolute; right: 0; top: 15px;
    z-index: 1;
    text-align: center;
    width: 10%;
    height: 100%;      
    pointer-events: none;
    box-sizing: border-box;   
}

/* Required Border */
#cfgfc .required {
    border: 1px solid #E6E6E6 !important;
}

/* Action Buttons */
#cfgfc .buttons { height: 55px; }
#cfgfc .action-button, #cfgfc .start-button {
	width: 100px;
	background-color: #E6E6E6;
	color: #09233a;
	border: 0 none;
	border-radius: 1px;
	cursor: pointer;
	padding: 10px 5px;
	bottom: 55px;
    box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.4);
}

#cfgfc .start-button {width: 200px;}

#cfgfc .action-button:hover, #cfgfc .action-button:focus , #cfgfc .start-button:hover, , #cfgfc .start-button:focus {
	color: #ffffff; background-color: #09233a;
}
#cfgfc .cfgfcnext, #cfgfc .submit {position:absolute;right:0;-webkit-appearance: none;}
#cfgfc .cfgfcprevious {position:absolute; left:0;}

/* Submitting Animation */
.working_loading {
	font: 300 4em/150% Impact;
	color: rgba(9,35,58, 1);
	text-align: right;
	position: relative;
	left: calc(100% - 30px);
	bottom: 18px;
}

.buttons_working { display: none; }

.working_loading:after {
	content: ' .';
	animation: dots 1s steps(5, end) infinite;
	color: rgba(9,35,58, 1);
}

@keyframes dots {
	0%, 20% {
		color: rgba(9,35,58, 0);
		text-shadow:
			-.25em 0 0 rgba(9,35,58, 0),
			-.5em 0 0 rgba(9,35,58, 0);
	}
	40% {
		color: rgba(9,35,58, 0);
		text-shadow:
			-.25em 0 0 rgba(9,35,58, 0),
			-.5em 0 0 rgba(9,35,58, 1);
	}
	60% {
		color: rgba(9,35,58, 0);
		text-shadow:
			-.25em 0 0 rgba(9,35,58, 1),
			-.5em 0 0 rgba(9,35,58, 1);
	}
	80%, 100% {
		color: rgba(9,35,58, 1);
		text-shadow:
			-.25em 0 0 rgba(9,35,58, 1),
			-.5em 0 0 rgba(9,35,58, 1);
	}
}

/* Font Awesome */
.fas {-moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; line-height: 1; }
.fa-chevron-down:before{content:"\f078"}

@font-face {font-family: FontAwesome;font-style: normal;font-display: block; src: url("webfonts/fa-solid-900.eot"); src: url("webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("webfonts/fa-solid-900.woff2") format("woff2"), url("webfonts/fa-solid-900.woff") format("woff"), url("webfonts/fa-solid-900.ttf") format("truetype"); }

.fas {font-family: FontAwesome; font-weight: 900; }
.fas .fa-chevron-down {color: #FFC801;}

/* The Modal */
#cfgfc .modal {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}

/* Modal Content */
#cfgfc .modal-content {
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    border: 1px solid #888;
    width: 90%;
}

#cfgfc .modal-content p,
#cfgfc .modal-content h2,
#cfgfc .modal-content li {
    color: #09233a !important;
}

/* The Close Button */
#cfgfc .closemodal {
    color: #aaaaaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

#cfgfc .closemodal:hover,
#cfgfc .closemodal:focus {
    color: #09233a;
    text-decoration: none;
    cursor: pointer;
}

/* Cell Phone */
@media only screen and (max-width: 800px) {
    #cfgfc {
        display: block;
        padding: 16px;
        font-size:12px;
    }
    #cfgfc h2{
        font-size: 20px;
    }
    #cfgfc .outputradio label {
        font-size: 8px;
    }
    #cfgfc .outputradio label span {
        font-size: 14px;
    }
}