/*========================================================================== */

/* FOR ALL FORMS 

/*========================================================================== */

form fieldset {
	border: none;
	margin: 0;
	padding: 0;
}
label, label .option, select {
	font-weight: inherit; 
}
form select {
	border: 1px solid #ccc;
	padding: 2px;
	color: #666;
	background-color: #fff;
	margin-top: 6px;
}
.webform-component-fieldset legend {
	font-weight: 500;
	padding: 1rem 0 0.5rem 0;
}
.webform-container-inline label {
	display: block;
	font-weight: 300;
}
.webform-container-inline { 
	padding-bottom: 1em; 
}
.webform-container-inline div,
.webform-container-inline div.form-item { 
	display: inline; 
}
.webform-container-inline div.description { 
	display: block; 
}
.webform-container-inline div.messages {
	display: block;
	float: left;
}
.webform-container-inline div.ajax-progress-bar div { 
	display: inherit; 
}
/* visit page email sign up */

#visit-email {
	display: flex;
	margin: 0 0 20px 0;
}
#visit-email input {
	width: 180px;
	height: 25px;
}
#visit-email button {
	background-color: #434443;
	border: none;
	color: #fff;
	font-size: .8em;
	height: 25px;
	margin: 0;
	padding: 4px;
}
#sidebar-left label,
#sidebar-left label .option,
#sidebar-left select,
#sidebar-left input { 
	font-size: 0.875rem; 
}

/* ------------------------------------------
  Overriding and smoothing out some styling issues.
  Formstack JS Form Engine

  www.exploratorium.edu/about/newsletters
------------------------------------------*/
.explo-newsletters #jsFastForms {
	font-weight: 300; 
}
.explo-newsletters .ff-form-main { 
	margin-bottom: 3em; 
}
.explo-newsletters .ff-group-row { 
	margin-bottom: 1em; 
}
.explo-newsletters .ff-section-col { 
	margin-bottom: 0.7em; 
}
.explo-newsletters .ff-item-row .ff-label-col label {
	float: left;
	margin-right: 5px;
}
.explo-newsletters .fw-row {
	margin-top: 0;
	padding-bottom: 1em;
	margin-bottom: 0.7em;
	border-bottom: 1px solid #e3e3e3;
}
.explo-newsletters .ff-label {
	font-weight: 300;
}
.explo-newsletters .footnoteDiv span,
.explo-newsletters .footnoteDiv label {
	float: left;
	padding-right: 5px;
}
.explo-newsletters label { 
	font-weight: bold; 
}
.explo-newsletters #dvFastForms .btnDiv { 
	text-align: left; 
}
.explo-newsletters .footnoteDiv { 
	display: none; 
}
.explo-newsletters #dvFastForms .ff-btn-submit {
	width: 100px;
	background-image: url(/sites/default/files/site/arrow_white_solid.png) !important;
	background-repeat: no-repeat;
	background-color: #000;
	color: white;
	background-position: 70px;
	padding: 0.5rem;
	border: 0;
	text-align: left;
}

/*-------------------------------
FOOTER NEWSLETTER FORM
--------------------------------*/

#footer #dvFastForms .ff-group-row,
#footer .ff-form-main {
	background-color: rgba(255,255,255,0);
	margin: 0;
	padding: 0;
}
#footer #dvFastForms .ff-label-col {
	padding: 5px 0px;
}
#footer #dvFastForms .ff-col-2.ff-field-col {
	width: 90%;
	height: 39px;
	color: #B1AFAF;
	background-color: #121212;
}
#footer #dvFastForms .ff-type-text, 
#footer #dvFastForms .ff-textarea, 
#footer #dvFastForms select.ff-select-type, 
#footer #dvFastForms .ff-fileupload-drop-area, 
#footer #dvFastForms .select2-container .select2-choice, 
#footer #dvFastForms .select2-container .select2-choices {
	background-color: #121212;
	border-color: #706E6E;
}
#footer .ff-group-row > .ff-item-row:first-child {
	display: none;
}
#footer .ff-item-row {
	padding-top: 0;
}
#footer #dvFastForms .ff-footer-group {
	padding: 0;
}
#footer #dvFastForms .ff-btn-submit {
	background-color: #121212;
	font-family: "akzidenz-grotesk-next", Helvetica, sans-serif;
	color: #B1AFAF;
	font-size: 0.875rem;
	border-style: solid;
	border-color: #706E6E;
	padding: 0.5rem;
	height: 39px;
}
#footer #dvFastForms .btnDiv input {
	margin-left: 0;
}
#footer #dvFastForms .btnDiv {
	text-align: left; 
}
#footer .ff-submit-btn {
	margin: 0;
}
#footer .ff-type-text, 
#footer .ff-textarea, #footer .ff-select-type, #footer .ff-select-type option {
	font-family: "akzidenz-grotesk-next", Helvetica, sans-serif;
	font-size: 0.875rem;
}
#footer #dvFastForms .btnDiv {
	text-align: left; 
}
#footer #dvFastForms .ff-btn-submit:hover {
	background-color: #111;
	color:#777;
}
#footer .btnDiv {
	display: ;
	position: absolute;
	top: 10px;
	left: 81%;
}
#footer #dvFastForms .ff-btn-submit {
	padding: 0.57rem 1rem;
}
#footer #dvFastForms .ff-item-row .ff-type-text:not(.ff-creditcard),
#footer #dvFastForms .ff-textarea, 
#footer #dvFastForms .ff-fileupload-drop-area {
	width: 91%;
}
#footer #dvFastForms .ff-group-row>.ff-item-row:not(:first-child), 
#footer #dvFastForms .ff-payment-wrapper, 
#footer #dvFastForms .ff-esignature-wrapper {
    max-width: 100%;
}
#footer .footnoteDiv {
    display: none;
}
#footer #dvFastForms .ff-invalid-msg {
  color: white;
  padding: 4px 30px 0 10px;
  background-color: rgba(150,0,8,1);
}
#footer .ff-invalid-msg {
  font-size: 0.75rem;
  line-height: 120%;
  min-width: 50%;
}
#footer #btnsubmit{
   margin-top:0;
}



/* ------------------------------------------

AFTER DARK NEWSLETTER SIGN UP POP UP 
IMPORTANT NOTE Always use a wrapper class/id, to prevent conflicts with other forms.

--------------------------------------------*/
 #afterdark-pop #form1{
    height: 20.533em;
    position: fixed; 
    bottom: 20.533em; 
    right: 2em;
    z-index: 99;
	max-width:18.667em;
	min-height:20.533em;
	background-image: url("../images/afterdark-pop-background.gif");
	background-repeat: no-repeat;
	border: 0.667em solid black;
	box-shadow: 0 0.267em 0.533em 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
} 

#afterdark-pop #form1{
    font-size:0.700em;
    text-align: left;
    margin-top:2.333em;
}

#afterdark-pop {
    height: 20.533em;
    position: fixed; 
    bottom: 20.533em; 
    right: 2em;
    z-index: 99;
	max-width:18.667em;
	min-height:20.533em;
	background-image: url("../images/afterdark-pop-background.gif");
	background-repeat: no-repeat;
	border: 0.667em solid black;
	box-shadow: 0 0.267em 0.533em 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/* styling to stack label on top of input */
#afterdark-pop #ffSection0 .ff-item-row{
    display: flex;
    flex-direction: column;
}
.cssanimations.csstransforms #afterdark-pop {
    -webkit-transform: translateY(20.533em);
    -moz-transform:    translateY(20.533em);
    visibility: visible; 
    -webkit-animation: fadein 2s,  1.5s 4.5s;
    animation: fadein 2s,  1.5s 4.5s;
}

@-webkit-keyframes fadein {
      from {bottom: 0; opacity: 0;} 
      to {bottom: 20.533em; opacity: 1;}
}

@keyframes fadein {
      from {bottom: 0; opacity: 0;}
      to {bottom: 20.533em; opacity: 1;}
}
.afterdark-pop-inner {
	max-width:16.933em;
	min-height:18.667em;
	margin: 1.333em 0 0 1.433em;
	background-color: #000;
	color: #fff;
	font-size: 1.200em;
	font-weight: 300;
	}	
#afterdark-pop-close {
	position: absolute;
	width:1.5em;
	height:1.5em;
	margin-left:11.9em;
	background-image: url('../images/close-x-hover.gif');
	background-color: #000;
	background-repeat:none;
	opacity: 0.5;
	-webkit-transition-duration: 0.4s; 
    transition-duration: 0.4s;
}
#afterdark-pop-close:hover {
	opacity: 1;
}	
.afterdark-pop-text{
	margin-top:0;
	padding:1.333em 1.333em 2.333em 1.333em;
}	
#afterdark-pop input#Contact.npe01__HomeEmail__c {
    width: 100%;
    font-size: 0.933em !important;
	text-align: left;
	padding: 0.533em 0.533em 0.533em 0.533em !important;
}
#afterdark-pop #btnsubmit {
    background-color: #000; 
    border: 0.067em solid #fff;
    color: #fff;
    padding: 0.533em 2.133em;
	margin-top:1.333em;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 0.933em;
	text-transform: uppercase;
	width:100%;
	-webkit-transition-duration: 0.4s; 
    transition-duration: 0.4s;
}		
#afterdark-pop #btnsubmit:hover {
    background-color: #fff; 
    color: #000;
}

