/*--------------------------------------------------*
	GENERALLY SPEAKING, THIS IS NOT USED.
	LOOK AT _CWFORMS INSTEAD

\*--------------------------------------------------*/

/*--------------------------------------------------*    General Form Styling
    USED ON CW AND MYCW
\*--------------------------------------------------*/

html {
  box-sizing: border-box;
}

*,
*::after,
*::before {
  box-sizing: inherit;
}

.clearfix,
.row {
  zoom: 1;
}

.clearfix:before,
.row:before,
.clearfix:after,
.row:after {
  content: "\0020";
  display: block;
  height: 0;
  overflow: hidden;
}

.clearfix:after,
.row:after {
  clear: both;
}

@media only screen and (max-device-width: 1000px),
only screen and (max-width: 1000px) {
  /*! comment needed to rearrange media queries */
}

@media only screen and (max-device-width: 980px),
only screen and (max-width: 980px) {
  /*! comment needed to rearrange media queries */
}

@media only screen and (max-device-width: 768px),
only screen and (max-width: 768px) {
  /*! comment needed to rearrange media queries */
}

@media only screen and (max-device-width: 640px),
only screen and (max-width: 640px) {
  /*! comment needed to rearrange media queries */
}

@media only screen and (max-device-width: 480px),
only screen and (max-width: 480px) {
  /*! comment needed to rearrange media queries */
}


/*--------------------------------------------------*	Reset
\*--------------------------------------------------*/

input,
select {
  vertical-align: middle;
  background: transparent;
}

select,
input,
textarea {
  margin: 0;
  font-size: 100%;
  vertical-align: baseline;
  *vertical-align: middle;
}

textarea {
  overflow: auto;
  resize: vertical;
  font-family: Arial;
}

input[type="radio"] {
  vertical-align: text-bottom;
}

input[type="checkbox"] {
  vertical-align: bottom;
}

.ie7 input[type="checkbox"] {
  vertical-align: baseline;
}

label,
.ll legend,
.ll .legend,
input[type="button"],
input[type="submit"],
input[type="image"] {
  cursor: pointer;
  width: auto;
}

label,
.ll legend,
.ll .legend {
  vertical-align: top;
}

input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

fieldset {
  margin-bottom: 18px;
}

fieldset.ll {
  padding-top: 0;
}


/*--------------------------------------------------*	Inputs ( + focus + error)
\*--------------------------------------------------*/

/*

$textLike:
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="url"];


Ignored:
readonly
radio
select
file
submit
number, range, date, datetime, datetime-local, month, week, time, search, color
*/

/*--------------------------------------------------*	Inputs ( + focus + error)
\*--------------------------------------------------*/

/* Text-like */

input,
textarea {
  border: 1px solid #cbcbcb;
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
  font-size: 18px;
  line-height: 24px;
  padding: 14px 15px 11px;
  border-radius: 5px;
  width: 100%;
  box-sizing: border-box;
  -webkit-appearance: none;
}

input:focus,
textarea:focus {
  border-color: #7bc1fa;
  outline: 0;
}

.error input,
.error textarea {
  border-color: #f5402c !important;
  color: #f5402c !important;
}

input::-ms-clear,
textarea::-ms-clear {
  display: none;
}

.ie7 input,
.ie7 textarea {
  width: 93.5%;
}

.ie7 input[type="submit"] {
  width: auto;
}


/* Non-text-like */

input[type="checkbox"],
input[type="radio"],
input[type="file"] {
  border: none;
  padding: 0;
  box-shadow: none;
}

input[type="submit"] {
  border: none;
  box-shadow: none;
}

input[type="submit"]::-moz-focus-inner {
  border: 0;
}


/* Numbers */

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  display: none;
  /* Crashes Chrome on hover in older versions */
  -webkit-appearance: none;
  margin: 0;
}


/* Text-like: Placeholders */

.lph {
  position: relative;
  height: 50px;
  /* Focus */
  /* Error */
}

.lph input,
.lph textarea,
.lph label,
.lph .ll legend,
.ll .lph legend,
.lph .ll .legend,
.ll .lph .legend {
  padding: 14px 15px 11px;
  width: 100%;
  height: auto;
  text-align: left;
  background: transparent;
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
  font-size: 18px;
  line-height: 24px;
  box-sizing: border-box;
}

.lph input,
.lph textarea {
  z-index: 2;
  position: absolute;
  top: 0;
  left: 0;
}

.lph label,
.lph .ll legend,
.ll .lph legend,
.lph .ll .legend,
.ll .lph .legend {
  z-index: 0;
  color: #c9c7c7;
  display: block;
  border: 1px solid transparent;
  background: #ffffff;
  border-radius: 5px;
}

.lph input:focus,
.lph textarea:focus {
  background-color: rgba(255, 255, 255, 0.7);
  filter: progid: DXImageTransform.Microsoft.gradient(startColorstr=#B3FFFFFF, endColorstr=#B3FFFFFF);
}

.lph.error input,
.lph.error>label,
.ll .lph.error>legend,
.ll .lph.error>.legend {
  color: #f5402c !important;
}


/* With a value */

.lph-val input,
.lph-val textarea {
  color: #4a4a4a;
  background: #ffffff;
}

.lph-val input:focus,
.lph-val textarea:focus {
  background: #ffffff;
}

.lph-val label,
.lph-val .ll legend,
.ll .lph-val legend,
.lph-val .ll .legend,
.ll .lph-val .legend {
  display: none;
}


/* Selects */

.custom-select {
  position: relative;
  height: 50px;
  /* Focus */
  /* Error */
}

.custom-select .fff {
  position: absolute;
  top: 0;
  left: 0;
  background: url("select-arrow.png") right center no-repeat;
  height: 100%;
  font-size: 18px;
  line-height: 24px;
  border: 1px solid #c0c0c0;
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
  color: #4a4a4a;
  padding: 14px 15px 11px;
  border-radius: 5px;
  width: 100%;
  box-sizing: border-box;
}

.custom-select select,
.custom-select option {
  -webkit-appearance: none;
}

.custom-select select {
  opacity: 0;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 2;
  cursor: pointer;
  width: 100%;
  height: 100%;
}

.custom-select select:focus+.fff,
.custom-select select:active+.fff {
  border-color: #7bc1fa;
}

.custom-select.error .fff {
  border-color: #f5402c;
  color: #f5402c;
}


/* Error - this is outside the .custom-select class on purpose, when error class is put on parent element */

.error .custom-select .fff {
  border-color: #f5402c !important;
  color: #f5402c !important;
}


/* Checkboxes, Radios */

.custom-check {
  position: relative;
  display: block;
  margin: 10px 0px;
  clear: both;
  height: 36px;
  overflow: hidden;
}

.custom-check>input {
  padding: 0;
  margin: 0;
  height: 36px;
  width: 36px;
  position: absolute;
  left: 0;
  opacity: 0;
  display: block;
  cursor: pointer;
}

.custom-check>label,
.ll .custom-check>legend,
.ll .custom-check>.legend {
  padding: 0 0 0 46px;
  cursor: pointer;
  vertical-align: middle;
  display: table-cell;
  font-size: 14px;
  line-height: 16px;
  color: #333232;
  text-transform: none;
}

.custom-check:not(#foo)>input+label,
.ll .custom-check:not(#foo)>input+legend,
.ll .custom-check:not(#foo)>input+.legend {
  background: url("checkbox-large-v=2.png") 0 0 no-repeat;
  height: 36px;
}

.custom-check:not(#foo)>input[type=checkbox]:hover+label,
.ll .custom-check:not(#foo)>input[type=checkbox]:hover+legend,
.ll .custom-check:not(#foo)>input[type=checkbox]:hover+.legend,
.custom-check:not(#foo)>input[type=checkbox]+label:hover,
.ll .custom-check:not(#foo)>input[type=checkbox]+legend:hover,
.ll .custom-check:not(#foo)>input[type=checkbox]+.legend:hover,
.custom-check:not(#foo)>input[type=radio]:hover+label,
.ll .custom-check:not(#foo)>input[type=radio]:hover+legend,
.ll .custom-check:not(#foo)>input[type=radio]:hover+.legend,
.custom-check:not(#foo)>input[type=radio]+label:hover,
.ll .custom-check:not(#foo)>input[type=radio]+legend:hover,
.ll .custom-check:not(#foo)>input[type=radio]+.legend:hover {
  background-position: 0 -36px;
}

.custom-check:not(#foo)>input[type=checkbox]:checked+label,
.ll .custom-check:not(#foo)>input[type=checkbox]:checked+legend,
.ll .custom-check:not(#foo)>input[type=checkbox]:checked+.legend,
.custom-check:not(#foo)>input[type=radio]:checked+label,
.ll .custom-check:not(#foo)>input[type=radio]:checked+legend,
.ll .custom-check:not(#foo)>input[type=radio]:checked+.legend {
  background-position: 0 -72px;
}

.custom-check:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+label,
.ll .custom-check:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+legend,
.ll .custom-check:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+.legend,
.custom-check:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+label,
.ll .custom-check:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+legend,
.ll .custom-check:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+.legend {
  background-position: 0 -108px;
}

.custom-check:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus:hover+label,
.ll .custom-check:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus:hover+legend,
.ll .custom-check:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus:hover+.legend,
.custom-check:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+label:hover,
.ll .custom-check:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+legend:hover,
.ll .custom-check:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+.legend:hover,
.custom-check:not(#foo)>input[type=radio]:not(:active):not(:checked):focus:hover+label,
.ll .custom-check:not(#foo)>input[type=radio]:not(:active):not(:checked):focus:hover+legend,
.ll .custom-check:not(#foo)>input[type=radio]:not(:active):not(:checked):focus:hover+.legend,
.custom-check:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+label:hover,
.ll .custom-check:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+legend:hover,
.ll .custom-check:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+.legend:hover {
  background-position: 0 -144px;
}

.custom-check:not(#foo)>input[type=checkbox]:checked:focus+label,
.ll .custom-check:not(#foo)>input[type=checkbox]:checked:focus+legend,
.ll .custom-check:not(#foo)>input[type=checkbox]:checked:focus+.legend,
.custom-check:not(#foo)>input[type=checkbox]:active+label,
.ll .custom-check:not(#foo)>input[type=checkbox]:active+legend,
.ll .custom-check:not(#foo)>input[type=checkbox]:active+.legend,
.custom-check:not(#foo)>input[type=radio]:checked:focus+label,
.ll .custom-check:not(#foo)>input[type=radio]:checked:focus+legend,
.ll .custom-check:not(#foo)>input[type=radio]:checked:focus+.legend,
.custom-check:not(#foo)>input[type=radio]:active+label,
.ll .custom-check:not(#foo)>input[type=radio]:active+legend,
.ll .custom-check:not(#foo)>input[type=radio]:active+.legend {
  background-position: 0 -180px;
}

.custom-check.med {
  position: relative;
  display: block;
  margin: 10px 0px;
  clear: both;
  height: 25px;
  overflow: hidden;
}

.custom-check.med>input {
  padding: 0;
  margin: 0;
  height: 25px;
  width: 25px;
  position: absolute;
  left: 0;
  opacity: 0;
  display: block;
  cursor: pointer;
}

.custom-check.med>label,
.ll .custom-check.med>legend,
.ll .custom-check.med>.legend {
  padding: 0 0 0 35px;
  cursor: pointer;
  vertical-align: middle;
  display: table-cell;
  font-size: 14px;
  line-height: 16px;
  color: #333232;
  text-transform: none;
}

.custom-check.med:not(#foo)>input+label,
.ll .custom-check.med:not(#foo)>input+legend,
.ll .custom-check.med:not(#foo)>input+.legend {
  background: url("checkbox-med-v=2.png") 0 0 no-repeat;
  height: 25px;
}

.custom-check.med:not(#foo)>input[type=checkbox]:hover+label,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:hover+legend,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:hover+.legend,
.custom-check.med:not(#foo)>input[type=checkbox]+label:hover,
.ll .custom-check.med:not(#foo)>input[type=checkbox]+legend:hover,
.ll .custom-check.med:not(#foo)>input[type=checkbox]+.legend:hover,
.custom-check.med:not(#foo)>input[type=radio]:hover+label,
.ll .custom-check.med:not(#foo)>input[type=radio]:hover+legend,
.ll .custom-check.med:not(#foo)>input[type=radio]:hover+.legend,
.custom-check.med:not(#foo)>input[type=radio]+label:hover,
.ll .custom-check.med:not(#foo)>input[type=radio]+legend:hover,
.ll .custom-check.med:not(#foo)>input[type=radio]+.legend:hover {
  background-position: 0 -25px;
}

.custom-check.med:not(#foo)>input[type=checkbox]:checked+label,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:checked+legend,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:checked+.legend,
.custom-check.med:not(#foo)>input[type=radio]:checked+label,
.ll .custom-check.med:not(#foo)>input[type=radio]:checked+legend,
.ll .custom-check.med:not(#foo)>input[type=radio]:checked+.legend {
  background-position: 0 -50px;
}

.custom-check.med:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+label,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+legend,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+.legend,
.custom-check.med:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+label,
.ll .custom-check.med:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+legend,
.ll .custom-check.med:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+.legend {
  background-position: 0 -75px;
}

.custom-check.med:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus:hover+label,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus:hover+legend,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus:hover+.legend,
.custom-check.med:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+label:hover,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+legend:hover,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+.legend:hover,
.custom-check.med:not(#foo)>input[type=radio]:not(:active):not(:checked):focus:hover+label,
.ll .custom-check.med:not(#foo)>input[type=radio]:not(:active):not(:checked):focus:hover+legend,
.ll .custom-check.med:not(#foo)>input[type=radio]:not(:active):not(:checked):focus:hover+.legend,
.custom-check.med:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+label:hover,
.ll .custom-check.med:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+legend:hover,
.ll .custom-check.med:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+.legend:hover {
  background-position: 0 -100px;
}

.custom-check.med:not(#foo)>input[type=checkbox]:checked:focus+label,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:checked:focus+legend,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:checked:focus+.legend,
.custom-check.med:not(#foo)>input[type=checkbox]:active+label,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:active+legend,
.ll .custom-check.med:not(#foo)>input[type=checkbox]:active+.legend,
.custom-check.med:not(#foo)>input[type=radio]:checked:focus+label,
.ll .custom-check.med:not(#foo)>input[type=radio]:checked:focus+legend,
.ll .custom-check.med:not(#foo)>input[type=radio]:checked:focus+.legend,
.custom-check.med:not(#foo)>input[type=radio]:active+label,
.ll .custom-check.med:not(#foo)>input[type=radio]:active+legend,
.ll .custom-check.med:not(#foo)>input[type=radio]:active+.legend {
  background-position: 0 -125px;
}

.custom-check.small {
  position: relative;
  display: block;
  margin: 10px 0px;
  clear: both;
  height: 22px;
  overflow: hidden;
}

.custom-check.small>input {
  padding: 0;
  margin: 0;
  height: 22px;
  width: 22px;
  position: absolute;
  left: 0;
  opacity: 0;
  display: block;
  cursor: pointer;
}

.custom-check.small>label,
.ll .custom-check.small>legend,
.ll .custom-check.small>.legend {
  padding: 0 0 0 32px;
  cursor: pointer;
  vertical-align: middle;
  display: table-cell;
  font-size: 14px;
  line-height: 16px;
  color: #333232;
  text-transform: none;
}

.custom-check.small:not(#foo)>input+label,
.ll .custom-check.small:not(#foo)>input+legend,
.ll .custom-check.small:not(#foo)>input+.legend {
  background: url("checkbox-small-v=2.png") 0 0 no-repeat;
  height: 22px;
}

.custom-check.small:not(#foo)>input[type=checkbox]:hover+label,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:hover+legend,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:hover+.legend,
.custom-check.small:not(#foo)>input[type=checkbox]+label:hover,
.ll .custom-check.small:not(#foo)>input[type=checkbox]+legend:hover,
.ll .custom-check.small:not(#foo)>input[type=checkbox]+.legend:hover,
.custom-check.small:not(#foo)>input[type=radio]:hover+label,
.ll .custom-check.small:not(#foo)>input[type=radio]:hover+legend,
.ll .custom-check.small:not(#foo)>input[type=radio]:hover+.legend,
.custom-check.small:not(#foo)>input[type=radio]+label:hover,
.ll .custom-check.small:not(#foo)>input[type=radio]+legend:hover,
.ll .custom-check.small:not(#foo)>input[type=radio]+.legend:hover {
  background-position: 0 -22px;
}

.custom-check.small:not(#foo)>input[type=checkbox]:checked+label,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:checked+legend,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:checked+.legend,
.custom-check.small:not(#foo)>input[type=radio]:checked+label,
.ll .custom-check.small:not(#foo)>input[type=radio]:checked+legend,
.ll .custom-check.small:not(#foo)>input[type=radio]:checked+.legend {
  background-position: 0 -44px;
}

.custom-check.small:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+label,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+legend,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+.legend,
.custom-check.small:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+label,
.ll .custom-check.small:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+legend,
.ll .custom-check.small:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+.legend {
  background-position: 0 -66px;
}

.custom-check.small:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus:hover+label,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus:hover+legend,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus:hover+.legend,
.custom-check.small:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+label:hover,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+legend:hover,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:not(:active):not(:checked):focus+.legend:hover,
.custom-check.small:not(#foo)>input[type=radio]:not(:active):not(:checked):focus:hover+label,
.ll .custom-check.small:not(#foo)>input[type=radio]:not(:active):not(:checked):focus:hover+legend,
.ll .custom-check.small:not(#foo)>input[type=radio]:not(:active):not(:checked):focus:hover+.legend,
.custom-check.small:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+label:hover,
.ll .custom-check.small:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+legend:hover,
.ll .custom-check.small:not(#foo)>input[type=radio]:not(:active):not(:checked):focus+.legend:hover {
  background-position: 0 -88px;
}

.custom-check.small:not(#foo)>input[type=checkbox]:checked:focus+label,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:checked:focus+legend,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:checked:focus+.legend,
.custom-check.small:not(#foo)>input[type=checkbox]:active+label,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:active+legend,
.ll .custom-check.small:not(#foo)>input[type=checkbox]:active+.legend,
.custom-check.small:not(#foo)>input[type=radio]:checked:focus+label,
.ll .custom-check.small:not(#foo)>input[type=radio]:checked:focus+legend,
.ll .custom-check.small:not(#foo)>input[type=radio]:checked:focus+.legend,
.custom-check.small:not(#foo)>input[type=radio]:active+label,
.ll .custom-check.small:not(#foo)>input[type=radio]:active+legend,
.ll .custom-check.small:not(#foo)>input[type=radio]:active+.legend {
  background-position: 0 -110px;
}

.ll .custom-check label,
.ll .custom-check legend,
.ll .custom-check .legend {
  text-transform: none;
}


/* STRUCTURE + ERRORS: Checkboxes */

fieldset.boxes {
  margin-bottom: 12px;
}

.req-boxes.error legend,
.req-boxes.error .legend {
  color: #f5402c;
}


/* FIELDS: Disabled */

input[readonly="readonly"],
.lph input[readonly="readonly"] {
  background: #f6f6f6;
  box-shadow: none;
}

input[readonly="readonly"]:focus,
.lph input[readonly="readonly"]:focus {
  background: #f6f6f6;
  border-color: #c0c0c0;
}


/* Contained input form style */

/* Currently being used on create a campaign and create an account forms */

.lii {
  position: relative;
}

.lii .in-input {
  position: absolute;
  top: 10px;
  left: 16px;
  font-family: "Proxima-Nova-n6", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 600;
  z-index: 5;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
  line-height: 22px;
}

.lii input {
  height: 70px;
}

.lii input,
.lii label,
.lii .ll legend,
.ll .lii legend,
.lii .ll .legend,
.ll .lii .legend {
  padding: 33px 15px 5px;
  letter-spacing: 1px;
}

.lii .lph {
  height: 70px;
}

.lii .lph label,
.lii .lph .ll legend,
.ll .lii .lph legend,
.lii .lph .ll .legend,
.ll .lii .lph .legend {
  line-height: 27px;
  height: 70px;
  background: none;
}

.lii.custom-select {
  height: 70px;
}

.lii.custom-select .fff {
  padding: 33px 15px 5px;
  line-height: 27px;
}

.lii.duo {
  height: 70px;
  border-radius: 5px;
  border: 1px solid #c0c0c0;
}

.lii.duo input {
  height: 68px;
}

.lii.duo .duo-1 input,
.lii.duo .duo-2 input {
  border: none;
}

.lii .duo-1:before {
  content: '';
  display: block;
  position: absolute;
  z-index: 50;
  background: #cbcbcb;
  width: 1px;
  height: 20px;
  bottom: 11px;
  right: 0;
}

.lii.trio {
  height: 70px;
  border-radius: 5px;
  border: 1px solid #c0c0c0;
}

.lii.trio input {
  height: 68px;
}

.lii.trio .trio-1 input,
.lii.trio .trio-2 input,
.lii.trio .trio-3 input {
  border: none;
}

.lii.trio .trio-1:before,
.lii.trio .trio-2:before {
  content: '';
  display: block;
  position: absolute;
  z-index: 50;
  background: #cbcbcb;
  width: 1px;
  height: 20px;
  bottom: 11px;
  right: 0;
}

.lii .side-amount .money-sign {
  position: absolute;
  z-index: 80;
  top: 36px;
  left: 15px;
  font-size: 15px;
  line-height: 22px;
  color: #c9c7c7;
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
}

.lii .side-amount label,
.lii .side-amount .ll legend,
.ll .lii .side-amount legend,
.lii .side-amount .ll .legend,
.ll .lii .side-amount .legend,
.lii .side-amount input {
  padding-left: 30px;
}

.lii .mycw-custom-url .pre-url {
  position: absolute;
  z-index: 80;
  top: 37px;
  left: 15px;
  font-size: 18px;
  color: #c9c7c7;
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
  letter-spacing: 1px;
  line-height: 22px;
}

.lii .mycw-custom-url label,
.lii .mycw-custom-url .ll legend,
.ll .lii .mycw-custom-url legend,
.lii .mycw-custom-url .ll .legend,
.ll .lii .mycw-custom-url .legend,
.lii .mycw-custom-url input {
  padding-left: 195px;
}


/*--------------------------------------------------*	General Structure
\*--------------------------------------------------*/

.form-inner {
  padding-top: 30px;
  padding-bottom: 30px;
  border: 1px solid #EAEAEA;
  border-radius: 5px;
}

@media only screen and (max-device-width: 768px),
only screen and (max-width: 768px) {
  .form-inner {
    border: none;
  }
}


/* LABELS: Fieldsets */

fieldset {
  background: transparent;
}

.form-inner fieldset.fieldset {
  border-bottom: 1px solid #eaeaea;
  padding-bottom: 30px;
  margin-bottom: 30px;
}

fieldset.fieldset .text p {
  margin: 0 auto 1em;
  width: 480px;
}

fieldset.fieldset.last {
  border-bottom: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}


/* STRUCTURE: Rows */

.row {
  margin-bottom: 30px;
  margin-left: 260px;
  margin-right: 260px;
  position: relative;
  width: auto;
}

hr.light {
  margin: 30px 0 29px;
  border: 0;
  border-bottom: 1px solid #eaeaea;
  background-color: #eaeaea;
  color: #eaeaea;
  height: 0px;
}


/*	SUBMIT
\*--------------------------------------------------*/

.form-submit {
  padding: 40px 0;
  margin-top: -1px;
  position: relative;
  clear: both;
  text-align: center;
}

.form-submit.arrow {
  background: url("end-form-arrow.gif") center top no-repeat;
}

@media only screen and (max-device-width: 768px),
only screen and (max-width: 768px) {
  .form-submit.arrow {
    background: none !important;
    padding-top: 0px;
  }
}


/*--------------------------------------------------*	Labels
\*--------------------------------------------------*/

label,
.ll legend,
.ll .legend {
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
  font-size: 22px;
  line-height: 22px;
  color: #6b6b6b;
  display: block;
}

legend,
.legend {
  width: 100%;
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
  font-size: 22px;
  line-height: 36px;
  text-align: center;
  height: 36px;
  text-transform: none;
  margin-bottom: 18px;
  display: block;
}


/*Errors*/

.error label,
.error .ll legend,
.ll .error legend,
.error .ll .legend,
.ll .error .legend,
.error .legend,
.error legend {
  color: #f5402c;
}


/* LABELS: LEFT */

.ll {
  position: relative;
  clear: both;
}

.ll label,
.ll legend,
.ll .legend,
.ll legend,
.ll .legend {
  text-align: right;
  position: absolute;
  width: 240px;
  left: -260px;
  top: 16px;
  height: 50px;
  text-transform: lowercase;
}


/* LABELS: LEFT: Undo some of it */

.ll .custom-check label,
.ll .custom-check legend,
.ll .custom-check .legend,
.ll .custom-check legend,
.ll .custom-check .legend,
.ll .lph label,
.ll .lph legend,
.ll .lph .legend,
.ll .lph legend,
.ll .lph .legend {
  text-align: left;
  position: static;
  width: 100%;
  height: auto;
}


/* LABELS: Top */

.lt label,
.lt .ll legend,
.ll .lt legend,
.lt .ll .legend,
.ll .lt .legend {
  margin-bottom: 5px;
}


/* LABELS: Optional */

.optional>label:before,
.ll .optional>legend:before,
.ll .optional>.legend:before {
  content: '*optional';
  color: #2e9df7;
  font-size: 12px;
  margin-right: 7px;
}


/*--------------------------------------------------*	Field Specific
\*--------------------------------------------------*/

/* Combine fields */

.duo {
  border-radius: 5px;
  height: 50px;
  padding-top: 0;
  box-sizing: border-box;
  position: relative;
  /* Errors */
}

.duo .lph {
  width: 50%;
  float: left;
  /* Some styles to make the focus styles work right an not clock the shadows */
}

.duo .lph label,
.duo .lph .ll legend,
.ll .duo .lph legend,
.duo .lph .ll .legend,
.ll .duo .lph .legend {
  position: relative;
}

.duo .lph input,
.duo .lph label,
.duo .lph .ll legend,
.ll .duo .lph legend,
.duo .lph .ll .legend,
.ll .duo .lph .legend {
  box-shadow: none;
  top: 0px;
  left: 0px;
  border-radius: 0;
}

.duo .lph.duo-2 label,
.duo .lph.duo-2 .ll legend,
.ll .duo .lph.duo-2 legend,
.duo .lph.duo-2 .ll .legend,
.ll .duo .lph.duo-2 .legend,
.duo .lph.duo-2 input {
  width: 100%;
}

.duo .sep {
  position: absolute;
  top: 12px;
  left: 50%;
  font-family: "Proxima-Nova-n6", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 600;
  font-size: 20px;
  z-index: 5;
}

.duo .sep:nth-child(1) {
  left: 50%;
}

.duo .sep:nth-child(0) {
  left: 0%;
}

.duo .duo-1 input,
.duo .duo-1 label,
.duo .duo-1 .ll legend,
.ll .duo .duo-1 legend,
.duo .duo-1 .ll .legend,
.ll .duo .duo-1 .legend {
  border-radius: 5px 0 0 5px;
}

.duo .duo-2 input,
.duo .duo-2 label,
.duo .duo-2 .ll legend,
.ll .duo .duo-2 legend,
.duo .duo-2 .ll .legend,
.ll .duo .duo-2 .legend {
  border-radius: 0 5px 5px 0;
}

.duo .error {
  border-color: #f5402c !important;
}

.duo.lined .duo-1 input {
  border-right: none;
}

.trio {
  border-radius: 5px;
  height: 50px;
  padding-top: 0;
  box-sizing: border-box;
  position: relative;
  /* Errors */
}

.trio .lph {
  width: 33.3333333333%;
  float: left;
  /* Some styles to make the focus styles work right an not clock the shadows */
}

.trio .lph label,
.trio .lph .ll legend,
.ll .trio .lph legend,
.trio .lph .ll .legend,
.ll .trio .lph .legend {
  position: relative;
}

.trio .lph input,
.trio .lph label,
.trio .lph .ll legend,
.ll .trio .lph legend,
.trio .lph .ll .legend,
.ll .trio .lph .legend {
  box-shadow: none;
  top: 0px;
  left: 0px;
  border-radius: 0;
}

.trio .lph.trio-3 label,
.trio .lph.trio-3 .ll legend,
.ll .trio .lph.trio-3 legend,
.trio .lph.trio-3 .ll .legend,
.ll .trio .lph.trio-3 .legend,
.trio .lph.trio-3 input {
  width: 100%;
}

.trio .sep {
  position: absolute;
  top: 12px;
  left: 33.3333333333%;
  font-family: "Proxima-Nova-n6", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 600;
  font-size: 20px;
  z-index: 5;
}

.trio .sep:nth-child(2) {
  left: 66.6666666667%;
}

.trio .sep:nth-child(1) {
  left: 33.3333333333%;
}

.trio .sep:nth-child(0) {
  left: 0%;
}

.trio .trio-1 input,
.trio .trio-1 label,
.trio .trio-1 .ll legend,
.ll .trio .trio-1 legend,
.trio .trio-1 .ll .legend,
.ll .trio .trio-1 .legend {
  border-radius: 5px 0 0 5px;
}

.trio .trio-3 input,
.trio .trio-3 label,
.trio .trio-3 .ll legend,
.ll .trio .trio-3 legend,
.trio .trio-3 .ll .legend,
.ll .trio .trio-3 .legend {
  border-radius: 0 5px 5px 0;
}

.trio .error {
  border-color: #f5402c !important;
}

.trio.lined .trio-2 input {
  border-width: 1px 0;
}

.ie7 .trio input,
.ie7 .trio label,
.ie7 .trio .ll legend,
.ll .ie7 .trio legend,
.ie7 .trio .ll .legend,
.ll .ie7 .trio .legend {
  width: 85%;
}


/* FIELDS: USD */

.form-donation {
  text-align: left;
}

.form-donation input::-ms-clear {
  display: none;
}

.form-donation label,
.form-donation .ll legend,
.ll .form-donation legend,
.form-donation .ll .legend,
.ll .form-donation .legend {
  text-indent: -9999px;
}

.form-donation span {
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
  font-size: 18px;
  top: 14px;
  position: absolute;
  z-index: 99;
  margin: 0 15px 0 15px;
}

.form-donation .curr {
  text-align: right;
  right: 0;
}

.form-donation #donation {
  text-align: center;
}

.form-amount {
  /*for IE10 'X' on input*/
}

.form-amount input::-ms-clear {
  display: none;
}

.form-amount input {
  padding-left: 45px !important;
  /*for mobile*/
  padding-right: 60px;
  position: relative;
  z-index: 10;
  background: #ffffff;
}

.form-amount span {
  color: #d6d6d6;
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
  font-size: 18px;
  position: absolute;
  top: 16px;
  z-index: 99;
}

.form-amount span.right {
  right: 20px;
}

.form-amount span.left {
  left: 20px;
}

.form-amount input[disabled="disabled"] {
  z-index: 0;
}

.pay button {
  border: none;
  background: #2e9df7;
  border-radius: 4px;
  color: #ffffff;
  margin: 10px auto 30px auto;
  -webkit-appearance: none;
  outline: none;
  box-shadow: none;
  display: inline-block;
  font-family: "Proxima-Nova-n6", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 600;
  font-size: 12px;
  line-height: 28px;
  text-transform: uppercase;
  position: relative;
  width: 47%;
  height: 70px;
  -webkit-transition: 0.1s linear background;
  -moz-transition: 0.1s linear background;
  transition: 0.1s linear background;
  padding: 0;
  cursor: pointer;
}

.pay button.pp {
  margin-left: 4%;
}

.pay button span {
  display: inline-block;
  position: static;
  text-indent: -9999px;
  margin-left: 8px;
  vertical-align: middle;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
}

.pay button span.credit-card {
  background-image: url("credit-card.png");
  width: 29px;
}

.pay button span.paypal {
  margin: 2px 0 0 3px;
  width: 62px;
  background-image: url("paypal.png");
}

input[disabled="disabled"] {
  z-index: 0;
}

.m-no-touch .pay button:hover {
  background-color: #3da4f8;
}

.form-url .lph .url {
  position: absolute;
  left: 0;
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
  font-size: 18px;
  line-height: 24px;
  padding: 14px 15px 11px;
  z-index: 10;
}

.form-url .lph input,
.form-url .lph label,
.form-url .lph .ll legend,
.ll .form-url .lph legend,
.form-url .lph .ll .legend,
.ll .form-url .lph .legend {
  padding-left: 175px;
}


/* FIELDS: Twitter */

.form-twitter label::after,
.form-twitter .ll legend::after,
.ll .form-twitter legend::after,
.form-twitter .ll .legend::after,
.ll .form-twitter .legend::after {
  content: '@';
  position: absolute;
  top: 0px;
  left: 275px;
  color: #c9c7c7;
  font-size: 22px;
  z-index: 100;
  display: block;
}

@media only screen and (max-device-width: 640px),
only screen and (max-width: 640px) {

  .form-twitter label::after,
  .form-twitter .ll legend::after,
  .ll .form-twitter legend::after,
  .form-twitter .ll .legend::after,
  .ll .form-twitter .legend::after {
    content: none;
  }
}

.form-twitter input {
  padding-left: 40px;
  *padding-left: 15px;
}


/* FIELDS: Text: State Field */

.form-state {
  width: 60%;
  float: left;
  margin-right: 5%;
}

.form-state .fff {
  *width: 246px;
}

.form-zip {
  width: 35%;
  float: left;
  clear: none;
}


/* FIELDS: Credit Card */

.cards {
  position: absolute;
  top: 13px;
  right: 15px;
  height: 25px;
  width: 39px;
}

.cards .card {
  display: none;
}

.cards .card.selected {
  background-position: center top;
  background-repeat: no-repeat;
  display: block;
  height: 25px;
  width: 39px;
}

.cards .card.visa {
  background-image: url("visa_sprite.gif");
}

.cards .card.amex {
  background-image: url("amex_sprite.gif");
}

.cards .card.master {
  background-image: url("mastercard_sprite.gif");
}

.cards .card.discover {
  background-image: url("discover_sprite.gif");
}


/* FIELDS: CC Info */

.form-cc-mm {
  width: 85px;
  float: left;
  margin-right: 20px;
}

.form-cc-mm select,
.form-cc-mm .fff {
  *width: 55px;
}

.form-cc-yy {
  width: 110px;
  float: left;
}

.form-cc-yy select,
.form-cc-yy .fff {
  *width: 80px;
}

.form-cc-cvc {
  width: 180px;
  float: right;
}

.form-cc-cvc label,
.form-cc-cvc .ll legend,
.ll .form-cc-cvc legend,
.form-cc-cvc .ll .legend,
.ll .form-cc-cvc .legend {
  float: left;
  width: auto;
  height: auto;
  padding: 16px 0 0 0;
  vertical-align: middle;
  position: static;
}

.form-cc-cvc input {
  width: 90px;
  *width: 60px;
  float: right;
}

.form-cc-cvc a {
  vertical-align: middle;
  color: #2e9df7;
  font-size: 16px;
  position: relative;
  top: -1px;
  text-decoration: none;
}


/* FIELDS: Other */

.other {
  margin-top: 30px;
  display: none;
  clear: both;
}


/*--------------------------------------------------*	Error Messages
\*--------------------------------------------------*/

.error-message {
  display: none;
  text-align: left;
  position: absolute;
  z-index: 10;
  width: 162px;
  right: -175px;
  top: 2px;
  height: 45px;
  background: url("error-box.png") left center no-repeat;
  font-family: "Proxima-Nova-n3", "Proxima-Nova-1", "Proxima-Nova-2", "Proxima Nova", sans-serif;
  font-weight: 300;
  font-size: 12px;
  line-height: 14px;
  color: #fff;
}

.error-message span {
  padding: 0 15px;
  display: table-cell;
  height: 44px;
  width: 100%;
  vertical-align: middle;
}

.ie7 .error-message span {
  display: block;
}

.lt .error-message {
  top: auto;
  bottom: 3px;
}

.error-message.invalid_error,
.error-message.format_error {
  background-image: none;
}

.error-message.invalid_error :before,
.error-message.format_error :before {
  content: '';
  display: block;
  position: absolute;
  left: -19px;
  top: 14px;
  border: 10px solid transparent;
  border-right-color: #de4b50;
}

.error-message.invalid_error span,
.error-message.format_error span {
  color: #fff;
  border-radius: 3px;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.5);
  overflow: visible;
  background-color: #de4b50;
  padding: 15px;
}


/* Hide the specific messages, unless they should be shown */

.error .error-message {
  display: block;
  /* Show the general message */
}

.error .error-message.format_error,
.error .error-message.taken,
.error .error-message.match,
.error .error-message.conflict {
  display: none;
}

.error.format_error .error-message {
  display: none;
}

.error.taken .error-message.taken,
.error.conflict .error-message.conflict,
.error.match .error-message.match,
.error.format_error .error-message.format_error {
  display: block;
}

.error-star {
  display: none;
  color: red;
  font-style: normal;
}

.error {
  /*for Countries validation on non-supported countryies like Laos*/
  /* Remove error styling for nested inputs where one is NOT required */
}

.error .error-star {
  display: inline;
}

.error .error-text {
  font-size: 14px;
  line-height: 24px;
  margin-top: 10px;
  color: #f5402c;
  display: block !important;
}

.error .not-req {
  border-color: silver;
  color: #4A4A4A;
}


/* For responsive forms */

body.responsive .row {
  margin-left: 23%;
  margin-right: 23%;
}


/* iPhone [portrait + landscape] */

@media only screen and (max-device-width: 640px),
only screen and (max-width: 640px) {
  body.responsive {
    /*errors*/
  }

  body.responsive .showme {
    display: block;
  }

  body.responsive .hideme {
    display: none;
  }

  body.responsive .row {
    margin: 0 0 20px 0;
  }

  body.responsive .custom-select,
  body.responsive .lph {
    height: 45px;
  }

  body.responsive .lii.custom-select,
  body.responsive .lii .lph {
    height: 70px;
  }

  body.responsive .lph input,
  body.responsive .lph textarea,
  body.responsive .lph label,
  body.responsive .lph .ll legend,
  .ll body.responsive .lph legend,
  body.responsive .lph .ll .legend,
  .ll body.responsive .lph .legend {
    font-size: 18px;
    padding: 9px 12px;
  }

  body.responsive .lii .lph input,
  body.responsive .lii .lph textarea,
  body.responsive .lii .lph label,
  body.responsive .lii .lph .ll legend,
  .ll body.responsive .lii .lph legend,
  body.responsive .lii .lph .ll .legend,
  .ll body.responsive .lii .lph .legend {
    padding: 33px 15px 5px;
  }

  body.responsive .ll input,
  body.responsive .ll textarea {
    font-size: 18px;
    padding: 9px 12px;
  }

  body.responsive .ll label,
  body.responsive .ll legend,
  body.responsive .ll .legend,
  body.responsive .ll .legend {
    position: relative;
    text-align: left;
    font-size: 18px;
    width: auto;
    left: 0;
    top: -6px;
    height: 18px;
    margin: 0;
  }

  body.responsive .ll .lph label,
  body.responsive .ll .lph legend,
  body.responsive .ll .lph .legend,
  body.responsive .ll .lph .legend {
    top: 0;
    height: auto;
  }

  body.responsive .custom-select .fff {
    line-height: 18px;
  }

  body.responsive .form-zip {
    margin-top: -19px;
  }

  body.responsive .form-zip .lph label,
  body.responsive .form-zip .lph .ll legend,
  .ll body.responsive .form-zip .lph legend,
  body.responsive .form-zip .lph .ll .legend,
  .ll body.responsive .form-zip .lph .legend {
    display: none;
  }

  body.responsive .trio,
  body.responsive .duo,
  body.responsive .custom-select {
    height: 45px;
  }

  body.responsive .lii.trio,
  body.responsive .lii.duo,
  body.responsive .lii.custom-select {
    height: 70px;
  }

  body.responsive .form-cc-mm {
    margin-right: 6px;
  }

  body.responsive .form-cc-cvc {
    width: auto;
    float: right;
    margin-top: -18px;
  }

  body.responsive .form-cc-cvc input {
    float: none;
  }

  body.responsive .form-cc-cvc label,
  body.responsive .form-cc-cvc .ll legend,
  .ll body.responsive .form-cc-cvc legend,
  body.responsive .form-cc-cvc .ll .legend,
  .ll body.responsive .form-cc-cvc .legend {
    padding: 0;
    float: none;
  }

  body.responsive .custom-check label,
  body.responsive .custom-check .ll legend,
  .ll body.responsive .custom-check legend,
  body.responsive .custom-check .ll .legend,
  .ll body.responsive .custom-check .legend {
    position: static;
    font-size: 14px;
  }

  body.responsive .form-state label,
  body.responsive .form-state .ll legend,
  .ll body.responsive .form-state legend,
  body.responsive .form-state .ll .legend,
  .ll body.responsive .form-state .legend {
    display: none;
  }

  body.responsive .cards {
    top: 28px;
  }

  body.responsive .optional label:before,
  body.responsive .optional .ll legend:before,
  .ll body.responsive .optional legend:before,
  body.responsive .optional .ll .legend:before,
  .ll body.responsive .optional .legend:before {
    position: absolute;
    right: 0;
  }

  body.responsive .form-url .showme {
    display: block !important;
    font-size: 14px;
    color: #c9c7c7;
  }

  body.responsive .form-url .url {
    display: none;
  }

  body.responsive .form-url input,
  body.responsive .form-url .lph label,
  body.responsive .form-url .lph .ll legend,
  .ll body.responsive .form-url .lph legend,
  body.responsive .form-url .lph .ll .legend,
  .ll body.responsive .form-url .lph .legend {
    padding-left: 15px !important;
  }

  body.responsive .error-message {
    top: 72px;
    color: #f5402c;
    width: 100%;
    background: none;
    height: auto;
    left: 0;
  }

  body.responsive .error-message :before {
    content: '';
    display: none;
  }

  body.responsive .error-message span {
    width: 100%;
    padding: 10px;
  }
}
