/*
  // BuRPS (Budgeting Rostering and Payroll System)
  // (c) YTT Solutions Pty. Ltd. Australia
  //
  // module: new-field_styles.css
  // folder: ./css
  //
  // Build    Date     PR      Comment
  // 1.0.82   23/06/21 PR2939  NC - Created file for implementing element guidelines
*/

input, select {
  margin-left: 8px;
  margin-bottom: 28px;
}

.button-primary-blue {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #ffffff;
  height: 45px;
  background: #4068E1;
  cursor: pointer;
  padding: 0.65em 1.25em;
  border: 2px solid #4068E1;
  border-radius: 5px;
  transition: 0s;
}

.button-primary-blue:hover {
  border: 2px solid #3B60CF;
  background: #3B60CF;
  color: #ffffff;  
}

.button-primary-blue:active {
  color: #ffffff;
  background-color: #19284F;
  border-color: #19284F;
}

.button-primary-blue:focus {
  -webkit-box-shadow: 0 0 0 3px rgb(64 104 225 / 50%) !important;
  -moz-box-shadow: 0 0 0 3px rgb(64 104 225 / 50%) !important;
  box-shadow: 0 0 0 3px rgb(64 104 225 / 50%) !important;
}

.button-primary-green {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #ffffff;
  height: 45px;
  background: #51BF9A;
  cursor: pointer;
  padding: 0.65em 1.25em;
  border: 2px solid #51BF9A;
  border-radius: 5px;
  transition: 0s;
}

.button-primary-green:hover {
  border: 2px solid #49AE8C;
  background: #49AE8C;
  color: #ffffff;
}

.button-primary-green:active {
  color: #ffffff;  
  background-color: #444444;  
  border-color: #444444;
}

.button-primary-green:focus {
  -webkit-box-shadow: 0 0 0 3px rgb(81 191 154 / 50%) !important;
  -moz-box-shadow: 0 0 0 3px rgb(81 191 154 / 50%) !important;
  box-shadow: 0 0 0 3px rgb(81 191 154 / 50%) !important;
}

.button-primary-light {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #4068E1;
  height: 45px;
  background: #E8EEF7;
  cursor: pointer;
  padding: 0.65em 1.25em;
  border: 2px solid #E8EEF7;
  border-radius: 5px;
  transition: 0s;
}

.button-primary-light:hover {
  border: 2px solid #DFE5EF;
  background: #DFE5EF;
  color: #4068E1;
}

.button-primary-light:active {
  color: #ffffff;
  background-color: #4068E1;
  border-color: #4068E1; 
}

.button-primary-light:focus {
  -webkit-box-shadow: 0 0 0 3px rgb(64 104 225 / 50%) !important;
  -moz-box-shadow: 0 0 0 3px rgb(64 104 225 / 50%) !important;
  box-shadow: 0 0 0 3px rgb(64 104 225 / 50%) !important;
}

.button-primary-disabled {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #888888;
  height: 45px;
  background: #F7F7F7;
  cursor: default !important;
  padding: 0.65em 1.25em;
  border: 2px solid #F7F7F7;
  border-radius: 5px;
  transition: 0s;
}

.button-primary-disabled:hover {
  /* PR2939 Disables border on hover */
  border: 2px solid #F7F7F7;
}

.button-secondary-blue {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #4068E1;
  height: 45px;
  background: #ffffff;
  cursor: pointer;
  padding: 0.65em 1.25em;
  border: 2px solid #cccccc;
  border-radius: 5px;
  transition: 0s; 
}

.button-secondary-blue:hover {
  border: 2px solid #4068e1;
  background: rgba(131, 162, 242, 0.1);
  color: #4068e1;
}

.button-secondary-blue:active {
  color: #4068E1;
  background-color: rgba(131, 162, 242, 0.25);
  border-color: #4068E1;  
}

.button-secondary-blue:focus {
  -webkit-box-shadow: 0 0 0 3px rgb(64 104 225 / 50%) !important;
  -moz-box-shadow: 0 0 0 3px rgb(64 104 225 / 50%) !important;
  box-shadow: 0 0 0 3px rgb(64 104 225 / 50%) !important;
  border-color: #4068E1 !important;
}

.button-secondary-green {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #49AE8C;
  height: 45px;
  background: #ffffff;
  cursor: pointer;
  padding: 0.65em 1.25em;
  border: 2px solid #cccccc;
  border-radius: 5px;
  transition: 0s; 
}

.button-secondary-green:hover {
  border: 2px solid #49AE8C !important;
  background: rgba(202, 239, 226, 0.1);
  color: #49AE8C;
}

.button-secondary-green:active {
  color: #49AE8C;
  background-color: rgba(202, 239, 226, 0.25);
  border-color: #49AE8C; 
}

.button-secondary-green:focus {
  -webkit-box-shadow: 0 0 0 3px rgb(73 174 140 / 50%) !important;
  -moz-box-shadow: 0 0 0 3px rgb(73 174 140 / 50%) !important; 
  box-shadow: 0 0 0 3px rgb(73 174 140 / 50%) !important;
  border-color: #49AE8C !important;
}

.button-secondary-disabled {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #CCCCCC;
  height: 45px;
  background: #ffffff;
  cursor: pointer;
  padding: 0.65em 1.25em;
  border: 2px solid #EEEEEE;
  border-radius: 5px;
  transition: 0s;
}

.button-tertiary-blue {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #4068E1;
  height: 45px;
  background: #ffffff;
  cursor: pointer;
  padding: 0.65em 1.25em;
  border: 2px solid #ffffff;
  border-radius: 5px;
  transition: 0s;  
}

.button-tertiary-blue:hover {
  border-color: transparent !important;
  background: rgba(131, 162, 242, 0.1);
  color: #4068e1;  
}

.button-tertiary-blue:active {
  color: #4068E1;
  background-color: rgba(131, 162, 242, 0.1);  
  border-color: #4068E1;
}

.button-tertiary-blue:focus {
  border-color: transparent;
  box-shadow: none !important;
  background: rgba(131, 162, 242, 0.2);
}

.button-tertiary-disabled {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #cccccc;
  height: 45px;
  background: #ffffff;
  cursor: pointer;
  padding: 0.65em 1.25em;
  border: 2px solid #ffffff;
  border-radius: 5px;
  transition: 0s;  
}

.large-field {
  font-family: 'Open Sans', sans-serif;
  border: 1px solid #D8D8D8;
  border-radius: 5px;
  height: 45px;
  line-height: 45px;
  letter-spacing: 1px;
  font-size: 16px;
  padding-left: 20px;
  color: #444444;
  transition: border-color .15s
  ease-in-out,box-shadow .15s ease-in-out;
}

.large-field:hover {
  border: 1px solid #A2A2A2;
}

.large-field:required {
  color: #444444;
  border: 1px solid #DB6056;
}

.large-field:focus {
  border-color: #83a2f2;
  -webkit-box-shadow: 0 0 0 2px rgb(64 104 225 / 50%) !important;
  -moz-box-shadow: 0 0 0 2px rgb(64 104 225 / 50%) !important;
  box-shadow: 0 0 0 2px rgb(64 104 225 / 50%) !important;
}

.small-field {
  font-family: 'Open Sans', sans-serif;
  border: 1px solid #D8D8D8;
  border-radius: 1px;
  height: 30px;
  line-height: 30px;
  font-size: 14px;
  padding-left: 15px;
  color: #444444;
  transition: border-color .15s
  ease-in-out,box-shadow .15s
  ease-in-out;  
}

.small-field:hover {
  border: 1px solid #A2A2A2; 
}

.small-field:required {
  color: #444444;
  border: 1px solid #DB6056;
}

.small-field:focus {
  border-color: #83a2f2;
  -webkit-box-shadow: 0 0 0 2px rgb(64 104 225 / 50%);
  -moz-box-shadow: 0 0 0 2px rgb(64 104 225 / 50%);
  box-shadow: 0 0 0 2px rgb(64 104 225 / 50%);  
}