@font-face {
  font-family: 'hub-survey';
  src:  url('https://s3.amazonaws.com/icomoon.io/31537/HUBSurvey/hub-survey.eot?c6ymz1');
  src:  url('https://s3.amazonaws.com/icomoon.io/31537/HUBSurvey/hub-survey.eot?c6ymz1#iefix') format('embedded-opentype'),
    url('https://s3.amazonaws.com/icomoon.io/31537/HUBSurvey/hub-survey.woff2?c6ymz1') format('woff2'),
    url('https://s3.amazonaws.com/icomoon.io/31537/HUBSurvey/hub-survey.ttf?c6ymz1') format('truetype'),
    url('https://s3.amazonaws.com/icomoon.io/31537/HUBSurvey/hub-survey.woff?c6ymz1') format('woff'),
    url('https://s3.amazonaws.com/icomoon.io/31537/HUBSurvey/hub-survey.svg?c6ymz1#hub-survey') format('svg');
  font-weight: normal;
  font-style: normal;
}
.form {
  text-align: center;
  margin-top: 2em;
}
.form .group {
  padding: 1em 0; 
}
.fields {
  width: 100%;
}
.fields .field {
  padding-bottom: .5em; 
  position: relative;
  text-align: left;
}
.inline .fields .field {
  padding-bottom: .1em; 
}
.fields .field.wide {
  width: 100%;
  float: none; 
  padding-right: 0;
  display: block;
}  

.form .row { 
  padding-right: 0;
  padding-bottom: .7em; 
  display: block;
  position: relative;
}

.form fieldset { 
  color: #606060;
  display: block;
  padding-bottom: 1em;
  font-family: 'Barlow', sans-serif;
}

.form label { 
  display: inline-block;
  padding: 0 0 .2em;
  font-size: 85%;
  cursor: pointer;
  font-family: 'Barlow', sans-serif;
  text-transform: uppercase;
  font-weight: 700;
  position: inherit;
  -webkit-transition: background .3s ease-in-out;
  -moz-transition:    background .3s ease-in-out;
  -o-transition:      background .3s ease-in-out;
  -ms-transition:     background .3s ease-in-out;
  transition:         background .3s ease-in-out;   
}

@media only screen and (min-width: 740px) and (min-device-width: 480px) {  
  .fields {
    width: 100%;
    display: table;
    padding-bottom: 1em; 
  }
  .field,
  .form .col { 
    width: 50%; 
    display: table-cell;
    vertical-align: top;
  }
  .form .col { 
    padding: .5em;
  }  
  .fields.three .field { 
    width: 33.33%; 
  }  
  .form .field:first-child { 
    padding-right: 1em; 
  }
  .fields.three .field:last-child { 
    padding-left: 1em; 
  }  
  .form .field.wide:last-child { 
    padding-right: 0; 
  }    
  .form .fields.address .field:last-child { 
    padding-right: 0; 
  }
}

.form input,
.form select,
.form textarea {
  border: 1px solid rgba(0,0,0,.35);  
  border-radius: 0;
  -webkit-appearance: none;
  width: 100%;
  padding: .4em .75em .6em;  
  font-family: 'Barlow', sans-serif;
  font-weight: 300;
  font-size: 100%;
  cursor: pointer;    
  -webkit-transition: all .3s ease-in-out;
  -moz-transition:    all .3s ease-in-out;
  -o-transition:      all .3s ease-in-out;
  -ms-transition:     all .3s ease-in-out;
  transition:         all .3s ease-in-out;  
}	
.form textarea { 
  height: 10em; 
}  
@media screen and (-webkit-min-device-pixel-ratio:0) {
 
}
@media only screen and (min-width: 740px) and (min-device-width: 480px) {  
  .form input,
  .form select,
  .form textarea {
    font-size: 120%;
  }   
} 

.form input:hover,
.form select:hover,
.form textarea:hover {
  border: 1px solid rgba(0,0,0,.2);  
  -moz-box-shadow:    inset 0 -.15em 0 #7191cd;
  -webkit-box-shadow: inset 0 -.15em 0 #7191cd;
  box-shadow:         inset 0 -.15em 0 #7191cd;   
}
.form input:focus,
.form select:focus,
.form textarea:focus {  
  border: 1px solid rgba(0,0,0,.6);     
}
.form .submit { 
  padding: 0 0 1.5em; 
  text-align: center;
}
.form button { 
	background: var(--blue);
  font-family: 'Barlow', sans-serif;
  text-transform: uppercase;  
  font-weight: 700;
  padding: .5em 1em;
  border: 2px solid var(--blue);
  font-size: 1.5rem;
  color: var(--white);
  display: inline-block;
  margin: 1em 0;
  position: relative;
  -webkit-transition: all .15s ease-in-out;
  -moz-transition:    all .15s ease-in-out;
  -o-transition:      all .15s ease-in-out;
  -ms-transition:     all .15s ease-in-out;
  transition:         all .15s ease-in-out; 
  cursor: pointer;
} 


@media only screen and (min-width: 1000px) and (min-device-width: 480px) {  
	.form button {
		margin: 0;
		}
}

.form button:hover,
.form button:active { 
  background: var(--dk-blue);
}


form strong.error { 
  background: #900;
  padding: .2em .5em .3em;   
  display: block;
  white-space: nowrap;
  position: absolute; 
  left: 0;
  top: 1.5em;
  z-index: 9999;    
  font-size: .8em;
  line-height: 1;
  font-weight: 400;
  color: #fff; 
  text-transform: uppercase; 
  letter-spacing: 0;
} 
form strong.error:after { 
  height: 0; 
  width: 0;    
  margin-left: -6px;  
  content: " ";    
  position: absolute; 
  left: 15px; 
  top: 100%;
  border-color: rgba(153, 0, 0, 0);    
  border: solid transparent; 
  pointer-events: none;
  border-top-color: #900; 
  border-width: 6px; 
}
.row strong.error {
  top: 85%;
  font-size: .7em;
} 
.row strong.error:after {
  display: none;
} 

/* ---- Placeholder Text Equalizer ---- */

form input:-moz-placeholder                 { opacity: 1; }
form input::-moz-placeholder                { opacity: 1; }
form input:-ms-input-placeholder            { color: #3b4181; }
form input::-webkit-input-placeholder       { color: #3b4181; }
form input:hover:-ms-input-placeholder      { color: #ffffff; }
form input:hover::-webkit-input-placeholder { color: #ffffff; }     
form input:focus:-ms-input-placeholder      { color: #4e4e4e; }
form input:focus::-webkit-input-placeholder { color: #4e4e4e; }  

form textarea:-moz-placeholder                 { opacity: 1; }
form textarea::-moz-placeholder                { opacity: 1; }
form textarea:-ms-input-placeholder            { color: #89c143; }
form textarea::-webkit-input-placeholder       { color: #89c143; }
form textarea:hover:-ms-input-placeholder      { color: #414141; }
form textarea:hover::-webkit-input-placeholder { color: #414141; }  
form textarea:focus:-ms-input-placeholder      { color: #4e4e4e; }
form textarea:focus::-webkit-input-placeholder { color: #4e4e4e; }