

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

body{
	background-color: black;
	font-family: 'Roboto Condensed', sans-serif !important;
    color: white;
    font-weight: 300;
    font-size: 19px;
}

h1,h2,h3,h4,h5,h6,p,span{
	color: white;
}

#masthead{
	position: relative;
	z-index: 0;
}

#content{
	position: relative;
	z-index: 1;
	background: black;
}

.home-header-wrapper {
	height: 100vh;
	width: 100%;
	padding-bottom: 56.25%; /* 16:9 */
	position: relative;
	background-image: url('images/form-background.png');
	background-attachment: fixed;
	background-size: cover;
	background-position: 100% 0%;
	background-repeat: no-repeat;
}

.home-header-inner {
	position: absolute;
	top: 0; bottom: 0; left: 0; right: 0;
}

.header-logo{
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 80%;
	height: 80%;
	max-width: 25vw;
	margin: 0 auto;
	background-image: url('images/wicon.svg');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}

.site-branding{
	height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.standard-text{

}

label{
	color: white;
}

.gfield_label{
	font-family: 'Hind', sans-serif;
    color: white;
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: 3.2px;    
    text-transform: uppercase;	
}

input{
	height: 60px;
}

select{
	width: 100% !important;
	height: 60px;
    border: 0px;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-position: 98% 50%;
    background-size: 25px;
    background-repeat: no-repeat;
    background-image: url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="utf-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="12" version="1"><path d="M4 8L0 4h8z"/></svg>');
    padding: .5em 20px .5em 20px !important;
    border-radius: 0;
	font-family: 'Roboto Condensed', sans-serif !important;
	font-weight: 300;
	background-color: white;
}

.gfield{
	margin-bottom: 30px;
}

.ginput_container input{
	border-radius: 0;
}

.ginput_complex span label{
	margin-bottom: .5em !important;
	font-family: 'Hind', sans-serif;
    color: white;
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: 3.2px !important;    
    text-transform: uppercase;	
}

.gform_wrapper ul.gfield_radio li label{
	padding-left: 100px !important;
}

.gform_wrapper{
	margin-top: 10rem !important;
}

.green-under{
	border-bottom: 2px solid #12727B;
	width: max-content;
}

.gfield_radio label{
	font-size: 27px !important;
}


.signature-width{
	width: 368.5px;
}


.ginput_container{
	width: 100%;
}

#input_1_7{
	width: 100%;
}

.gfield_checkbox label{
	padding-left: 30px;
}

.gform_wrapper ul.gfield_checkbox li label{
	padding-left: 30px;
}


.form-header{
	z-index: 0;
	display: block;
	position: fixed;
	left: 50%;
	top: 75%;
	transform: translate(-50%, -50%);
	font-family: 'Hind', sans-serif;
    color: white;
    font-size: 24px !important;
    font-weight: 600 !important;
    letter-spacing: 4.8px;    
    text-transform: uppercase;	
    text-align: center;
}

.arrow-down{
	background-image: url(images/arrow.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 50px;
    width: 20px;
    transform: translate(-50%, -50%);
    position: fixed;
    top: 84%;
    left: 50%;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    transform-origin: bottom;
}

.bounce-4 {
    animation-name: bounce-4;
    animation-timing-function: ease;
}
@keyframes bounce-4 {
    0%   { transform: scale(1,1)    translateY(0); }
    10%  { transform: scale(1.1,.9) translateY(0); }
    30%  { transform: scale(.9,1.1) translateY(-25px); }
    50%  { transform: scale(1,1)    translateY(0); }
    100% { transform: scale(1,1)    translateY(0); }
}

.gfield_required{
	display: none;
}


#gform_submit_button_1{
	/*padding: 0px 50px 3px 50px !important;*/
	width: 233px;
    height: 40px;
    border-radius: 20px;
    border: 2px solid #ffffff;
    background-color: black;
    font-family: 'Playfair Display', serif;
    font-style: italic;
    color: white;
    font-size: 20px;
    transition: all 1s ease;
}

#gform_submit_button_1:hover{
	background-color: #12727B;
	border: 2px solid #12727B;
	transition: all 1s ease;
}

.gform_save_link{
	font-family: 'Playfair Display', serif;
    color: white;
    font-size: 20px;
    font-style: italic;
}

.gform_wrapper ul.gfield_radio li input[type=radio]:checked+label {
	font-weight: 300 !important;
}

/* 
 * Hide the RADIO inputs. 
 */

.gfield_radio input {
  display: none !important;
}


/*
 * Then, style the label so it looks like however you want.
 * Here's a quick rundown of how I did it here:
 */


/*
 * Some basic positioning styles, and we give it the pointer cursor to show 
 * that it's clickable
 */

.gfield_radio label {
  display: inline-block;
  padding: 5px 10px;
  cursor: pointer;
}


/*
 * With how I decided to build this, the position: relative is super important.
 * We're going to position a pseudo element within this element(As it is the containing box)
 */

.gfield_radio label {
  position: relative;
  /*line-height: 22px;*/
}


/* 
 * Because we're using pseudo elements, a content property is required to make them appear.
 */

.gfield_radio label:before,
.gfield_radio label:after {
  content: '';
}


/*
 * We are using the :before peudo elemnt as the actual button,
 * then we'll position the :after over it. You could also use a background-image,
 * font-icon, or really anything if you want different styles.
 * For the specific style we're going for, this approach is simply the easiest, but
 * once you understand the concept you can really do it however you like.
 */

.gfield_radio label:before {
	border: 1px solid #222021;
	width: 40px;
	height: 40px;
	margin-right: 10px;
	display: inline-block;
	vertical-align: top;
	background-color: white;
	position: absolute;
	left: 0;
	top: 8px;
}

.gfield_radio label:after {
	border: 1px solid #222021;
	width: 40px;
	height: 40px;
	margin-right: 10px;
	display: inline-block;
	vertical-align: top;
	background-color: white;
	position: absolute;
	left: 0;
	top: 8px;
	opacity: 0;
	background-color: white;
	background-image: url('images/checkmark.png');
	background-size: contain;
	background-position: center;
}

/*
 * This is the most important part of this whole file, if you understand what's happening here
 * you can really make this in so many different ways.
 * 
 * We start by selecting the input inside of the label, with "label input". From there we use the 
 * ":checked" selector to *only* select the input when it is checked. We then use the immediate sibling 
 * selector(+) to select the span, and then it's pseudo element :after(What we are using to mark the button)
 * Because we already styled the :after, all we have to do is set the opacity to 1, making it fade in.
 */
.gfield_radio input:checked+label:after  {
	opacity: 1;
}

.small-revisions{
	font-size: 17px;
    font-style: italic;
    display: block;
}

.gfield_radio li{
	margin-bottom: 2rem !important;
}

#gform_fields_1{
	display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
}

#field_1_1{
	width: 100%;
    padding: 0;
}

#field_1_2{
	width: 100%;
    padding: 0;
}

#field_1_3{
	width: 100%;
    padding: 0;
}

#field_1_4{
	width: 100%;
    padding: 0;
}

#field_1_5{
	width: 100%;
}

#field_1_10{
	width: 100%;
    padding: 0;
}

#field_1_7{
	width: 70%;
    padding: 0 15px 0 0;
}

#field_1_8{
	width: 30%;
    padding: 0;
}

/* Bootstrap XS */
@media only screen and (max-width : 640px){
	#input_1_1_3{
		margin-bottom: 3rem;
	}
	.small-revisions{
		transform: translateY(-20px);
	}
}


#input_1_8{
	width: 100%;
	background-image: url('images/cal.png');
	background-repeat: no-repeat;
	background-size: 30px;
    background-position: 95% 60%;
}

#gfield_description_1_10{
	font-size: 19px;
	margin-bottom: 2rem;
}

/* Base for label styling */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
  position: relative;
  padding-left: 1.95em;
  cursor: pointer;
}

/* checkbox aspect */
[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
	content: '';
	left: 0; 
	top: 8px;

    border: 1px solid #222021;
    width: 40px;
    height: 40px;
    margin-right: 10px;
    display: inline-block;
    vertical-align: top;
    position: absolute;
    left: 0;
    top: 8px;
    background-color: white;
    background-image: url(images/checkmark.png);
    background-size: 0px;
    background-position: center;
}
/* checked mark aspect */
[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
    content: '\2713\0020';
    position: absolute;
    top: 10px;
    left: 1px;
    height: 30px;
    width: 45px;
    color: transparent;
    transition: all .2s;
    background-size: 37px;
    background-repeat: no-repeat;
    background-image: url(images/checkmark.png);
}

/* checked mark aspect changes */
[type="checkbox"]:not(:checked) + label:after {
  opacity: 0;
  transform: scale(0);
}
[type="checkbox"]:checked + label:after {
  opacity: 1;
  transform: scale(1);
}
/* disabled checkbox */
[type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
  box-shadow: none;
  border-color: #bbb;
  background-color: #ddd;
}
[type="checkbox"]:disabled:checked + label:after {
  color: #999;
}
[type="checkbox"]:disabled + label {
  color: #aaa;
}
/* accessibility */
[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
  border: 2px dotted blue;
}

/* hover style just for information */
label:hover:before {
  border: 2px solid #4778d9!important;
}

.gform_wrapper .gfield_checkbox li label{
	max-width: 100%;
}

.gform_wrapper ul.gfield_checkbox li label {
	padding-left: 60px;
	font-size: 19px;
	font-style: italic;
}

.gform_wrapper ul.gfield_checkbox li input[type=checkbox]:checked+label {
	font-weight: 300 !important;
}

.gform_save_link{
	width: 270px;
    padding-left: 25px;
    text-align: start !important;
    background-image: url(images/arrow-horizontal.png);
    background-size: 34px;
    background-repeat: no-repeat;
    background-position: 95% 70%;
    transition: all 0.3s ease;
}

.gform_save_link:hover{
	transition: all 0.3s ease;
	color: #087B6D;
	background-position: 100% 70%;
	background-image: url(images/green-arrow.png);
}

.gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]){
	padding: 5px 20px !important;
	font-weight: 300;
}

.gform_wrapper textarea.large{
	font-weight: 300;
}

.content-save{
	position: fixed !important;
    height: 100vh;
    width: 100vw;
    z-index: 3 !important;
    top: 0px;
    display: block;
    background-color: black;
}

/* Bootstrap SM */
@media only screen and (max-width : 767px){
	.gform_wrapper .gform_footer a.gform_save_link{
		padding: 0 !important;
		margin: 1rem 0rem 0rem 1rem !important;
	}
}

/* Bootstrap XS */
@media only screen and (max-width : 575px){
	.header-logo{
		max-width: 50vw;
	}
}

.flower-left{
	position: absolute;
    transform: translate(-500px, 50rem);
}

.flower-right{
	position: absolute;
    transform: translate(80vw, 10rem);
}

#form {
    background-image: url('images/flower-left.png'), url('images/flower-right.png');
    background-position: 0% 70%, 100% 20%;
    background-size: 30rem;
    background-repeat: no-repeat;
}

/* Bootstrap SM */
@media only screen and (max-width : 991px){
	#form{
		background-image: none;
	}
}

.confirmation-background{
	height: 100vh;
	width: 100vw;
	background-image: url('images/form-background.png');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* Bootstrap XS */
@media only screen and (max-width : 575px){
	.home-header-wrapper{
		background-position: 30% 0%;
	    background-size: 80rem;
	}
	.form-header{
		top: 65%;
	}
	.header-logo{
		top: 40%;
	}
	.arrow-down{
		top: 80%;
	}
}

.page-id-61 #masthead{
	display: none;
}

.confirmation-text{
	z-index: 0;
    display: block;
    font-family: 'Hind', sans-serif;
    color: white;
    font-size: 24px !important;
    font-weight: 600 !important;
    letter-spacing: 4.8px;
    text-transform: uppercase;
    max-width: 600px;
    margin: 0rem 2rem 0rem 2rem;
}

.content-save .content-area .site-main{
	height: 100vh;
}

.content-save .content-area .site-main #form{
	height: 100vh;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
}

.content-save .gform_wrapper{
	margin-top: 0rem !important;
}

.gform_wrapper li.gfield.gfield_error{
	background-color: black !important;
}

.form_saved_message{
    background-image: url(images/whiteicon.png);
    background-position: 50% 0%;
    background-size: 7rem;
    background-repeat: no-repeat;
    padding-top: 10rem;
}

.form_saved_message_sent{
    background-image: url(images/whiteicon.png);
    background-position: 50% 0%;
    background-size: 7rem;
    background-repeat: no-repeat;
    padding-top: 10rem;
}

.resume_form_link_wrapper{
	overflow-wrap: break-word;
}

.partial_entry_warning{
	display: none;
}

