/*
================================================================================
FORMS
================================================================================
*/

form {
  margin: 0;
}

.form-layout > table {
  width: 100%;
}

.form-group {
  position: relative;
}

/* Errors
-------------------------------------------------------------------------------- */
.form-error-1 {
  display: block;
  margin-bottom: 15px;
  font-size: 14px;
  color: red;
}

/* Label & Caption
-------------------------------------------------------------------------------- */
label {
  cursor: pointer;
}

.form-caption-1 {
  padding-right: 5px;
  padding-bottom: 5px;
  vertical-align: top;
}

.form-caption-2 {
  padding-right: 5px;
  padding-bottom: 5px;
  vertical-align: top;
}

.form-element-1 {
  vertical-align: top;
}

/* Inputs
-------------------------------------------------------------------------------- */
.form-element-1 {
  padding-right: 5px;
  padding-bottom: 15px;
}

.form-element-2 {
  padding-right: 5px;
  padding-bottom: 15px;
}

.form-control,
input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
select,
textarea {
  display: block;
  width: 100%;
  height: auto;
  min-height: 40px;
  padding: 11px 12px;
  font-size: inherit;
  line-height: initial;
  color: #555;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 0;
  box-shadow: none;
}


/* Textarea
-------------------------------------------------------------------------------- */
textarea {
  min-height: 100px;
}

/* Checkbox & Radio
-------------------------------------------------------------------------------- */
td.collection {
  padding-top: 3px;
  vertical-align: top;
}

.collection-caption label {
  padding-right: 30px;
  font-weight: normal;
}

input[type="checkbox"],
input[type="radio"] {
  margin-right: 7px;
}

/* Buttons
-------------------------------------------------------------------------------- */
.btn:not(.navbar-toggle),
button:not(.navbar-toggle),
[type="button"]:not(.navbar-toggle),
[type="submit"],
[type="reset"] {
  margin-top: 3px;
  margin-bottom: 3px;
  padding: 10px 20px;
  font-size: inherit;
  font-weight: 600;
  line-height: inherit;
  vertical-align: middle;
  border-style: solid;
  border-width: 2px;
  border-radius: 0;
  white-space: unset;
}

/* Add breathing room. But Not <input>. */
/*
.btn:not([input]):not(:last-child) {
  margin-right: 5px;
}
*/

.btn:active {
  box-shadow: none;
}

.btn:focus {
  outline: none;
}

/*
------------------
Button Sizes
------------------
*/

.btn.btn-lg {
  padding: 10px 35px;
  font-size: 120%;
}

.btn.btn-sm {
  padding: 3px 10px;
  font-size: 90%;
}

.btn.btn-xs {
  padding: 1px 5px;
  font-size: 80%;
}

/*
------------------
Default Button
------------------
*/
.btn-default,
input[type="button"],
input[type="reset"] {
  color: #333;
  background-color: var(--secondary-color);
  border-color: var(--secondary-color);
}

.btn-default:hover,
input[type="button"]:hover,
input[type="reset"]:hover {
  background-color: var(--secondary-color-hover);
  border-color: var(--secondary-color-hover);
}

/*
------------------
Primary Button
------------------
*/
.btn-primary,
[type="submit"] {
  color: #fff;
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}

.btn-primary:hover,
[type="submit"]:hover {
  background-color: var(--primary-color-hover);
  border-color: var(--primary-color-hover);
}

/*
------------------
Outline Button
------------------
*/
.btn-outline {
  color: inherit;
  background-color: transparent;
  border-color: inherit;
}

.btn-outline:hover,
.btn-outline:focus {
  color: inherit;
  background-color: rgba(240, 179, 16, 0.5);
  border-color: inherit;
}

/*
------------------
Link Button
------------------
*/
.btn.btn-link {
  padding-right: 0;
  padding-left: 0;
  color: var(--primary-color);
}

.btn.btn-link:hover {
  color: var(--primary-color-hover);
}

.btn-link::after {
  padding-left: 5px;
  font-family: "FontAwesome";
  content: "\f105";
}


/* Captcha
-------------------------------------------------------------------------------- */
.captcha-normal {
  margin-bottom: 30px;
  padding-left: 0 !important;
}

.captcha-image {
  padding-bottom: 20px;
}

.captcha-normal + .form-error-1 {
  display: block;
  margin-top: -30px;
}

/*
------------------------
Captcha Popup
------------------------
*/
.captcha-popup {
  color: #fff;
  background-color: #000;
}

.captcha-popup input[type=button] {
  margin-top: 4px;
  padding: 5px 10px;
  font-weight: bold;
  color: #333;
  text-transform: uppercase;
  background-color: #e4e4e4;
  border: 0;
}

.captcha-input input[type="text"] {
  width: 192px !important;
}