.portal-formfield, .portal-formfield-container select {
  padding: 4px 6px 4px 6px;
  height: 26px;
  border: solid 2px #999;
  border-radius: 4px;
  margin: 4px;
}

.portal-formfield:focus, .portal-formfield-container select:focus {
  border: solid 2px #444;
}

select.portal-formfield, .portal-formfield-container select {
  height: 30px;
}

.portal-formlabel, .portal-formlabel-inline {
  display: block;
  margin-top: 8px;
  margin-bottom: 4px;
}

.portal-formlabel-inline {
  display: inline-block;
}

/* Button Styles */

.portal-button {
  box-shadow:inset 0px 39px 0px -24px #ff3737;
  background-color:#e40000;
  border-radius:4px;
  border:1px solid #ffffff;
  display:inline-block;
  cursor:pointer;
  color:#ffffff;
  font-family:Arial;
  font-size:15px;
  padding:6px 15px;
  text-decoration:none;
  text-shadow:0px 1px 0px #b23e35;
}

input.portal-button:hover, button.portal-button:hover, span.portal-button:hover {
  box-shadow:inset 0px 39px 0px -24px #444;
  background-color:#222;
  text-shadow:0px 1px 0px #000;
}
input.portal-button:active, button.portal-button:active, span.portal-button:active {
  position:relative;
  top:1px;
}

.portal-button-small {
  box-shadow:inset 0px 35px 0px -24px #ff3737;
  background-color:#e40000;
  border-radius:4px;
  border:1px solid #ffffff;
  display:inline-block;
  cursor:pointer;
  color:#ffffff;
  font-family:Arial;
  font-size:12px;
  padding:4px 10px;
  text-decoration:none;
  text-shadow:0px 0.1px 0px #b23e35;
}

input.portal-button-small:hover, button.portal-button-small:hover, span.portal-button-small:hover {
  box-shadow:inset 0px 35px 0px -24px #444;
  background-color:#222;
  text-shadow:0px 1px 0px #000;
}
input.portal-button-small:active, button.portal-button-small:active, span.portal-button-small:active {
  position:relative;
  top:1px;
}


/* Login Form Styles */

.portal-btn-login {
    box-shadow:inset 0px 39px 0px -24px #ff3737;
    background-color:#e40000;
    border-radius:4px;
    border:1px solid #ffffff;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:15px;
    padding:6px 15px;
    text-decoration:none;
    text-shadow:0px 1px 0px #b23e35;
  }

  input.portal-btn-login:hover {
    box-shadow:inset 0px 39px 0px -24px #444;
    background-color:#222;
    text-shadow:0px 1px 0px #000;
  }
  input.portal-btn-login:active {
    position:relative;
    top:1px;
  }

  .portal-login-formlabel {
    width: 130px;
  }

  .portal-login-formfield {
    width: 250px;
    margin-right: 0px !important;
  }

/* Checkbox and Radio Styles */

/* Default Checkbox Styles */

.o-checkbox input[type="checkbox"],
.o-checkbox .o-checkbox-checked {
    display: none;
}

.o-checkbox input[type="checkbox"]:checked ~ .o-checkbox-checked
{
    display: inline-block;
}

.o-checkbox input[type="checkbox"]:checked ~ .o-checkbox-unchecked
{
    display: none;
}

.o-checkbox-unchecked {
  color: #333;
  font-size: 16px;
}

.o-checkbox-checked {
  color: #333;
  font-size: 16px;
}

.o-checkbox:hover {
  color: #000;
  cursor: pointer;
}

.o-checkbox:hover .o-checkbox-unchecked, .o-checkbox:hover .o-checkbox-checked  {
  color: #000;
  cursor: pointer;
}

.o-checkbox span {
  padding-right: 5px;
}

.o-checkbox {
  padding-right: 8px;
}


.o-checkbox input[type="checkbox"]:disabled ~ .o-checkbox-checked
{
    color: #999;
}

.o-checkbox input[type="checkbox"]:disabled ~ .o-checkbox-unchecked
{
  color: #999;
}

.o-checkbox input[type="checkbox"]:disabled ~ span
{
    color: #999;
}

.o-checkboxdisabled input[type="checkbox"] ~ .o-checkbox-checked
{
    color: #999;
}

.o-checkboxdisabled input[type="checkbox"] ~ .o-checkbox-unchecked
{
  color: #999;
}

.o-checkboxdisabled input[type="checkbox"] ~ span
{
    color: #999;
}


/* END Default Checkbox Styles */

/* Default Radio Button Styles */

.o-radiobtn input[type="radio"],
.o-radiobtn .o-radiobtn-checked {
    display: none;
}

.o-radiobtn input[type="radio"]:checked ~ .o-radiobtn-checked
{
    display: inline-block;
}

.o-radiobtn input[type="radio"]:checked ~ .o-radiobtn-unchecked
{
    display: none;
}

.o-radiobtn-unchecked {
  color: #BEBEBE;
  font-size: 16px;
}

.o-radiobtn-checked {
  color: var(--primary-hub-colour);
  font-size: 16px;
}

.o-radiobtn:hover {
  color: var(--secondary-hub-colour);
  cursor: pointer;
}

.o-radiobtn:hover .o-radiobtn-unchecked, .o-radiobtn:hover .o-radiobtn-checked  {
  color: var(--secondary-hub-colour);
  cursor: pointer;
}

.o-radiobtn span {
  padding-right: 5px;
}

.o-radiobtn {
  padding-right: 8px;
}