 @import url('https://fonts.googleapis.com/css?family=Raleway:400,700');

header {
  text-align: left;
}

.submit {
  display: none !important;
}

header img {
  width: 50%;
}

h2 {
  font-family: Raleway , sans-serif;
  font-weight: bold;
}

h3 {
  font-family: Raleway , sans-serif;
  font-weight: normal;
  display: block;
  width: 100%;
  margin: 2em  0 1em 0;
  border-bottom: 1px dotted #d3d3d3;
}

@media only screen and (min-width: 960px) {
  .container #content3.eight.columns {
    width: 40%;
  }

  .container #content2.eight.columns {
    width: 55%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 959px) {
  .container #content3.eight.columns {
    width: 35%;
  }

  .container #content2.eight.columns {
    width: 55%;
  }
}

@media only screen and (max-width: 767px) {
  .container #content3.eight.columns {
    width: 100%;
  }

  .container #content2.eight.columns {
    width: 100%;
  }
}

#content3 p
 {
  box-sizing: border-box;
  background-color: #f6f6f6;
  border-left: 2px solid black;
  padding: 4px 20px;
  width: 100%;
  margin: 1%;
  display: inline-block;
}


.addresslabel .questionlabel,
#content3 .questionlabel,
.spanc5070101 .questionlabel,
.spanc5070102 .questionlabel,
.spanc3 .questionlabel,
.spanc5070103 .questionlabel,
.spanc5070104 .questionlabel,
.spanc3 ul li,
.spanc7 .questionlabel,.spanc5072841 .questionlabel,
.spanc5072842 .questionlabel,
.spanc5072845 .questionlabel,
.spanc5072851 .questionlabel,
.spanc5072852 .questionlabel,
.spanc5072854 .questionlabel,
.spanc5073826 .questionlabel,
.spanc5070380 .questionlabel,
.spanc5070381 .questionlabel {
  font-size: 10px;
  line-height: 1.1em;
  text-transform: uppercase;
}

.spanc5073826 ul li {
  font-size: 10px;
  line-height: 1.1em;
}
.addresslabel input, 
.addresslabel select,
#content3 input, 
#content3 select,
.spanc5070101 select,
.spanc5070102 select,
.spanc3 select,
.spanc5070103 select,
.spanc5070104 select,
.spanc7 select,
.spanc5072841 select,
.spanc5072842 select,
.spanc5072845 ul li,
.spanc5072852 select,
.spanc5072854 select,
.spanc5070380 select,
.spanc5070381 select,
.spanc5073826 ul li,
.spanc5072851 select {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin-left: 0px;
  margin-bottom: 8px;
  border: 0px;
  border-bottom: 1px solid transparent;
  background: transparent;
   background-color: #f6f6f6;
}

.addresslabel input:focus,
#content3 input:focus {
  box-shadow: none;
  border: none;
  border-bottom: 1px dotted #d3d3d3;
}


/* demographics */
@media only screen and (min-width: 768px) {
  span[class^="spanc"] p {
    font-size: 1.25em;
    margin-bottom: .25em;
  }

  span[class^="spanc3"] ul li {
    width: 100%;
    font-size: 8px;
    display: block;
  }
  
  .spanc5073081 ul li {
    width: 33.333%;
    display: inline-block;
    margin-bottom: 2px;
    vertical-align: top;
  }
  
  .spanc5073081 .response_subheader {
    display: block;
    margin-top: .5em;
    font-weight: bold;
    color: #000;
  }

  span[class^="spanc"] ul li[class^="licr5080188"] {
    width: 50%;
  }
}

#p5073843, #p5073844 {
  display: none;
}


/* newsletters & deployments */

div[id^="pp"],
div[id^="pd"] {
  margin-bottom: 1em;
}

span[class^="spancp"] p .questionlabel, 
span[class^="spancd"] p .questionlabel {
  display: none;
}

span[class^="spancp"] ul, 
span[class^="spancd"] ul {
  width: 15%;
  display: inline-block;
  vertical-align: top;
}

span[class^="spancp"] ul li, 
span[class^="spancd"] ul li {
  width: 50%;
  display: inline-block;
  text-align: center;
}

@media only screen and (max-width: 480px) {
  span[class^="spancp"] ul li, 
  span[class^="spancd"] ul li {
    width: 100%;
    display: block;
    text-align: center;
  }
}

span[class^="spancp"] ul li .radiolabel, 
span[class^="spancd"] ul li .radiolabel {
  display: block;
  text-align: center;
}

div.radiolabel {
  width: 85%;
  display: inline-block;
}

div.radiolabel h6 {
  font-size: 17.5px;
  font-weight: bold;
  line-height: 1.5;
  padding-left: 10px;
  color: black;

}

div.radiolabel p {
  font-family: Raleway , sans-serif;
  line-height: 1.5em;
  font-size: 14.5px;
}

.clearfloat {
  background: transparent;
  border: none;
  height: 0px;
  clear: both;
}




input[type="submit"] {
  border: none;
  border-radius: 0px;
  background-color: #323a45;
  color: #fff;
  font-weight: normal;
  font-size: 14px;
  text-shadow: none;
  width: 100%;
  box-sizing: border-box;
  padding: .75em;
  margin: 20px 4px;
}

input[type="submit"]:hover {
  border: none;
  background-color: #666666;
  color: #fff;
}


/* other fillin */

.otherfillin {
  display: inline-block;
  max-width: 100%;
  box-sizing: border-box;
  background-color: #000;
  padding: 4px 20px;
  width: 100%;
  margin: 1%;
  margin-top: -1%;
}

.otherfillin p,
#content3 .drg-element-type-demographic.drg-element-sub-type-type-1 ~ .otherfillin p {
  width: 100%;
  background-color: #000;
  padding: 0px;
  margin: 0px;
}

.otherfillinlabelomeda {
  display: inline-block;
  width: 30%;
  color: #fff;
  box-sizing: border-box;
}

.otherfillin input,
#content3 .drg-element-type-demographic.drg-element-sub-type-type-1 ~ .otherfillin input {
  color: #ccc;
  display: inline-block;
  box-sizing: border-box;
  width: 70%;
  max-width: 70%;
  border-top: 0px;
  border-left: 0px;
  border-right: 0px;
  border-radius: 0px;
  padding: 0px;
  margin-bottom: 0px;
  border-bottom: 1px dashed #999;
  background: transparent;
}

.otherfillin input:focus,
#content3 .drg-element-type-demographic.drg-element-sub-type-type-1 ~ .otherfillin input:focus {
  color: #fff;
  border-top: 0px;
  border-left: 0px;
  border-right: 0px;
  box-shadow: none;
  border-bottom: 1px dashed #ccc;
}


/* Multi-Select Demographics */

#content3 p.drg-element-type-demographic.drg-element-sub-type-type-2 {
  margin-bottom: 0px;
}

.drg-element-type-demographic.drg-element-sub-type-type-2 ul {
  width: 100%;
  max-height: 128px;
  border: 2px solid #f6f6f6;
  border-left-color: #000;
  margin: 0 1%;
  box-sizing: border-box;
  overflow: auto;
  display: block;
}

.drg-element-type-demographic.drg-element-sub-type-type-2 ul li {
  margin-bottom: 0px;
}

@media only screen and (min-width: 960px) { /* this may not be needed on all forms */
  .drg-element-type-demographic.drg-element-sub-type-type-2 ul li {
    width: 100%;
    display: inline-block;
  }
}

.drg-element-type-demographic.drg-element-sub-type-type-2 ul li {
  position: relative;
}

.drg-element-type-demographic.drg-element-sub-type-type-2 input[type="checkbox"] {
  display: none;
}

.drg-element-type-demographic.drg-element-sub-type-type-2 input[type="checkbox"] + .checkboxlabel {
  background: #f6f6f6;
  font-size: 11px;
  line-height: 1em;
  display: block;
}

.drg-element-type-demographic.drg-element-sub-type-type-2 input[type="checkbox"] + .checkboxlabel label {
  width: 100%;
  padding: 4px;
  display: block;
  box-sizing: border-box;
}

.drg-element-type-demographic.drg-element-sub-type-type-2 input[type="checkbox"]:checked + .checkboxlabel {
  background: #ccc;
}

.drg-element-type-demographic.drg-element-sub-type-type-2 input[type="checkbox"] ~ .otherfillin {
  display: none;
}

.drg-element-type-demographic.drg-element-sub-type-type-2 input[type="checkbox"]:checked ~ .otherfillin {
  width: 40%;
  background-color: transparent;
  padding: 4px;
  display: block;
  position: absolute;
  top: 3px;
  right: 0px;
}

.drg-element-type-demographic.drg-element-sub-type-type-2 input[type="checkbox"]:checked ~ .otherfillin input {
  font-size: 10px;
  color: #333;
  padding: 0px 4px;
  background: rgb(255,255,255);
  background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.0) 100%);
  border: 1px solid #fff;
}


/* Fixed-Position Validation */

.highlight {
  color: #994444;
}

font[color="red"],
span[style="color: red;"] {
  color: #994444 !important;
}

ul.validation {
  position: fixed;
  bottom: 0px;
  left: 0px;
  background: #ff0000;
  width: 100%;
  margin-bottom: 0px;
  max-height: 5em;
  overflow: auto;
  z-index: 9999;
}

ul.validation li {
  color: #fff;
  text-align: center;
}

ul.validation li:first-of-type {
  padding-top: .25em;
}

ul.validation li:last-of-type {
  padding-bottom: : .5em;
}

ul.validation li:only-of-type {
  padding-top: .25em;
  padding-bottom: .5em;
}


/* Inline Validation */

.validation { color: #FF0000; }
