/* -- form styles -- */

.form-row { position: relative; }
.form-row:before, .form-row:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.form-row:after { clear: both; }
.form-row { zoom: 1; }

.form-error-message,
.form-row-error-message {
  color: #95180b;
  box-shadow: 0 0 2px #95180b;
  margin-bottom: 3px;
  background: #eecbc8;
  padding: 5px;
}

.form-row-error-message {
  max-width: 400px;
}

.form-error-message {
  margin-bottom: 20px;
}

.form-row-label-help-text {
  color: #444;
  font-size: 12px;
}

@media (max-width: 767px) {
  .form-row-label-help-text {
    text-align: right;
  }
}

.form-row-help-text {
  color: #444;
  font-size: 12px;
  padding-top: 5px;
}

.input-group { position: relative; }
.input-group:before, .input-group:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.input-group:after { clear: both; }
.input-group { zoom: 1; }

.input-group-label {
  background: #f0f0f0;
  border: 1px solid #c0c0c0;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  color: #333;
  font-size: 14px;
  line-height: 34px;
  position: absolute;
  text-align: center;
  width: 30px;
  bottom: 0;
  left: 0;
  top: 0;
  z-index: 2;
}

.input-group-control {
  margin-left: -2px;
  padding-left: 30px;
  position: relative;
  z-index: 1;
}

.input-email,
.input-number,
.input-text,
.input-password {
  border: 1px solid #c0c0c0;
  -moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
  -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
  box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  box-sizing: border-box;
  color: #333;
  font-size: 14px;
  line-height: 18px;
  margin: 0;
  max-width: 400px;
  padding: 8px;
}

.input-textarea {
  border: 1px solid #aaa;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
  -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
  box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  box-sizing: border-box;
  color: #333;
  font-size: 16px;
  line-height: 1.2;
  margin: 0 5px 0 0;
  max-width: 400px;
  padding: 5px 7px;
}

.input-select {
  font-size: 18px;
  max-width: 400px;
  padding-bottom: 8px;
  padding-top: 8px;
}

.radio-group {
  list-style-type: none;
  margin: 0;
  padding: 5px 0;
}


/* -- form-sidelabels -- */

.form-sidelabels .formrow-label {
  float: left;
  padding-right: 15px;
  max-width: 150px;
  min-height: 1px;
  width: 33%;
}

.form-sidelabels .formrow-input {
  float: left;
  width: 60%;
}

.form-sidelabels .label {
  display: block;
  padding-top: 6px;
  text-align: right;
  vertical-align: middle;
}

.form-sidelabels .input-email,
.form-sidelabels .input-number,
.form-sidelabels .input-text,
.form-sidelabels .input-password,
.form-sidelabels .input-textarea,
.form-sidelabels .input-select {
  width: 100%;
}

.form-sidelabels .input-checkbox-field {
  display: block;
  float: left;
  max-width: 150px;
  padding-right: 15px;
  text-align: right;
  width: 33%;
}

.form-sidelabels .input-checkbox-label-text {
  display: block;
  float: left;
  width: 60%;
}

.form-sidelabels .form-row { padding: 0 1px; margin-bottom: 10px; }


/* -- form-toplabels -- */

.form-toplabels .form-row {
  padding: 10px 0;
  position: relative;
}

.form-toplabels .label {
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  box-sizing: border-box;
  color: #555;
  display: block;
  font-size: 16px;
  padding-bottom: 4px;
}

.form-toplabels .input-email,
.form-toplabels .input-number,
.form-toplabels .input-text,
.form-toplabels .input-password,
.form-toplabels .input-textarea,
.form-toplabels .input-select {
  width: 100%;
}

.form-toplabels .input-checkbox-field {
  display: inline-block;
  vertical-align: top;
}

.form-toplabels .input-checkbox-label-text {
  display: inline-block;
  max-width: 380px;
}

.form-toplabels .form-row-select-multiple-checkbox-choices {
  margin-top: 10px;
}

@media (max-width: 767px) {
  .input-email,
  .input-number,
  .input-text,
  .input-password,
  .input-textarea {
    font-size: 16px;
  }

  .form-toplabels .formrow-label {
    float: left;
    padding-right: 15px;
    max-width: 150px;
    min-height: 1px;
    text-align: left;
  }

  .form-toplabels .label {
    display: block;
    font-size: 13px;
    text-align: right;
    padding-top: 5px;
  }

  .form-toplabels .input-checkbox-field {
    display: block;
    float: left;
    padding-right: 15px;
    text-align: right;
    width: 33%;
  }

  .form-toplabels .input-checkbox-label-text {
    display: block;
    float: left;
    width: 60%;
  }

  .select-box {
    width: 100%;
  }
}

.select-box {
  height: 36px;
  position: relative;
}

.js .select-box-input,
.js .select-box-input select {
  border: 0;
  display: block;
  font-size: 14px;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.js .select-box-overlay {
  background-color: #fff;
  background-image: url(//www.gfamedia.org/images/glyphicons_halflings_113_thin_bottom_arrow_grey.png);
  background-repeat: no-repeat;
  background-position: 95% center;
  background-position: calc(100% - 9px) center;
  bottom: 0;
  border: 1px solid #aaa;
  -moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
  -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
  box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  box-sizing: border-box;
  color: #333;
  display: block;
  left: 0;
  font-size: 14px;
  line-height: 30px;
  max-width: 400px;
  overflow: hidden;
  padding: 2px 8px 8px;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
}

.js .form-sidelabels .select-box {
  max-width: 400px;
}

.js .form-toplabels .select-box {
  max-width: 400px;
}

.js .select-box-overlay.focused {
  border: 1px solid #000;
}

.no-js .select-box-overlay {
  display: none;
}

.ie7 .select-box-overlay,
.ie8 .select-box-overlay {
  display: none;
}

.ie7 .select-box-input,
.ie7 .select-box-input select,
.ie8 .select-box-input,
.ie8 .select-box-input select {
  border: 1px solid #ccc;
  display: block;
  position: auto;
  height: auto;
  z-index: 2;
}

.block-success,
.message-success {
  background-color: #b4ddaa;
  box-shadow: 0 0 1px 1px #529048;
  padding: 10px;
}

.message-success::before {
  content: "\f058";
  font-family: FontAwesome;
  color: #529048;
  padding-left: 5px;
  padding-right: 10px;
}

.block-error,
.message-error {
  background-color: #eecbc8;
  box-shadow: 0 0 2px #95180b;
  color: #95180b;
  padding: 10px;
}

.message-error::before {
  content: "\f071";
  font-family: FontAwesome;
  color: #95180b;
  padding-left: 5px;
  padding-right: 10px;
}

.message-warning {
  background-color: #f2ec5c;
  box-shadow: 0 0 1px 1px #bfc171;
  padding: 10px;
}

.message-warning::before {
  content: "\f071";
  font-family: FontAwesome;
  color: #84854f;
  padding-left: 5px;
  padding-right: 10px;
}

@media (max-width: 767px) {
  .js .select-box-overlay {
    background-size: 9px 6px;
    font-size: 12px;
  }
}


/* -- payment form -- */

.cc-icon-row img {
  display: inline-block;
  opacity: 0.9;
  margin-bottom: 5px;
  margin-right: 5px;
  vertical-align: middle;
}

.form-payment .label {
  color: #444;
  font-size: 13px;
  font-weight: bold;
}

.form-payment .label span {
  color: #777;
  font-size: 0.9em;
  font-weight: normal;
}

.form-payment .form-row-label-help-text {
  color: #777;
  margin-bottom: 5px;
}

/* buttons */

.dbtn,
.dbtn:visited,
.dbtn:hover,
.dbtn:active {
  background-color: #ececec;
  background-image: linear-gradient(bottom, rgb(234,234,234) 3%, rgb(238,238,238) 62%);
  background-image: -webkit-linear-gradient(bottom, rgb(224,224,224) 3%, rgb(238,238,238) 62%);
  background-image: -moz-linear-gradient(bottom, rgb(234,234,234) 3%, rgb(238,238,238) 62%);
  border: none;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
       -o-border-radius: 4px;
          border-radius: 4px;
  -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.6);
     -moz-box-shadow: 0 0 3px rgba(0,0,0,0.6);
       -o-box-shadow: 0 0 3px rgba(0,0,0,0.6);
          box-shadow: 0 0 3px rgba(0,0,0,0.6);
  color: #3c3c3d;
  cursor: pointer;
  display: inline-block;
  font-family: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
  padding: 5px 8px;
  position: relative;
  text-decoration: none;
  text-shadow: 1px 1px 0 #fff;

  *display: inline;
  zoom: 1;
}

.dbtn:hover {
  background: #ccc;
  background-image: -webkit-linear-gradient(bottom, rgb(210,210,210) 3%, rgb(242,242,242) 62%);
}

.dbtn-red,
.dbtn-red:visited,
.dbtn-red:hover,
.dbtn-red:active {
  background: rgb(149, 24, 11);
  background-image: -webkit-linear-gradient(bottom, rgb(149, 24, 11) 3%, rgb(201,32,15) 62%);
  color: #fff;
  text-shadow: none;
}

.dbtn-red:hover {
  background-image: -webkit-linear-gradient(bottom, rgb(110, 24, 11) 3%, rgb(230,32,15) 62%);
}

.dbtn-green,
.dbtn-green:visited,
.dbtn-green:hover,
.dbtn-green:active {
  background: #72974e;
  background-image: -webkit-linear-gradient(bottom, rgb(81,164,83) 3%, rgb(86,208,89) 62%);
  box-shadow: 0 0 3px rgba(0,0,0,0.9);

  color: #fff;
  text-shadow: 0 0 2px rgba(0,0,0,0.15);
}

.dbtn-green:hover {
  background-image: -webkit-linear-gradient(bottom, rgb(81,154,83) 3%, rgb(86,218,89) 62%);
}