/* BASE STYLES */
@import "../fonts/CenturyGothic/font-face.css";
@import "../fonts/FontAwesome/font-face.css";
@import "../fonts/GaramondRegular/font-face.css";
@import "../fonts/CenturySchoolbook/font-face.css";
@import "../fonts/Prata/font-face.css";
@import "../fonts/OpenSans/font-face.css";
/* Colors */
/* Typography */
/* Mixins */
/* Responsive Breakpoints */
/* Variables TO USE */
/* Variables used for EDGE CASES ONLY */
/* Common style rules shared accross the files */
.btn-text-default {
  font-family: "Open Sans Regular", sans-serif;
  font-weight: 700;
  letter-spacing: 1px;
  font-size: 1.6rem;
}
.btn-primary-hover {
  background-color: #EE1C25;
  border-color: #EE1C25;
}
.btn-second-hover {
  background-color: #008FD5;
  border-color: #008FD5;
}
a:focus,
button:focus,
a:active:focus,
button:active:focus,
a.active:focus,
button.active:focus,
a.focus,
button.focus,
a:active.focus,
button:active.focus,
a.active.focus,
button.active.focus {
  outline: none;
}
.btn-disabled {
  background-color: #bcbec0;
  border-color: #bcbec0;
  color: #ffffff;
  opacity: 1;
}
.btn {
  font-family: "Open Sans Regular", sans-serif;
  font-weight: 700;
  letter-spacing: 1px;
  font-size: 1.6rem;
  min-width: 13rem;
  min-height: 3rem;
  padding-left: 2rem;
  padding-right: 2rem;
  padding-top: 6px;
  padding-bottom: 6px;
  border-radius: 1px;
  border-width: 0.2rem;
  margin: 1rem auto 0;
  outline: 0 none;
  white-space: nowrap;
  -webkit-transition: background 0.4s ease, background-color 0.4s ease, border-color 0.4s ease, color 0.4s ease;
  -moz-transition: background 0.4s ease, background-color 0.4s ease, border-color 0.4s ease, color 0.4s ease;
  -ms-transition: background 0.4s ease, background-color 0.4s ease, border-color 0.4s ease, color 0.4s ease;
  -o-transition: background 0.4s ease, background-color 0.4s ease, border-color 0.4s ease, color 0.4s ease;
  transition: background 0.4s ease, background-color 0.4s ease, border-color 0.4s ease, color 0.4s ease;
  /* PRIMARY */
  /* CTA */
  /* SECONDARY (back buttons) */
}
.btn:active {
  box-shadow: none;
  -webkit-box-shadow: none;
}
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
  outline: none;
}
.btn.btn-primary {
  background-color: #1C75BC;
  border-color: #1C75BC;
  color: #ffffff;
  border-radius: 0.3rem;
  font-family: 'Open Sans SemiBold';
  /* Disabled attribute and/or btn-disabled class (when the element is a link the pseudoclass selector does not work) */
}
.btn.btn-primary:hover,
.btn.btn-primary:focus {
  background-color: #155D97;
  border-color: #155D97;
}
.btn.btn-primary:disabled,
.btn.btn-primary[disabled],
.btn.btn-primary.btn-disabled {
  background-color: #bcbec0;
  border-color: #bcbec0;
  color: #ffffff;
  opacity: 1;
}
.btn.btn-blue {
  background-color: #1C75BC;
  border-color: #1C75BC;
  color: #ffffff;
  border-radius: 5px 5px 5px 5px;
  /* Disabled attribute and/or btn-disabled class (when the element is a link the pseudoclass selector does not work) */
}
.btn.btn-blue:hover,
.btn.btn-blue:focus {
  color: #1C75BC;
  background: #ffffff;
}
.btn.btn-blue:disabled,
.btn.btn-blue[disabled],
.btn.btn-blue.btn-disabled {
  background-color: #bcbec0;
  border-color: #bcbec0;
  color: #ffffff;
  opacity: 1;
}
.btn.btn-white {
  background-color: #ffffff;
  border-color: #ffffff;
  color: #1C75BC;
  border-radius: 5px 5px 5px 5px;
  /* Disabled attribute and/or btn-disabled class (when the element is a link the pseudoclass selector does not work) */
}
.btn.btn-white:hover,
.btn.btn-white:focus {
  color: #ffffff;
  background: transparent;
  transform: scale(1.1);
  transition: all 0.3s ease;
}
.btn.btn-white:disabled,
.btn.btn-white[disabled],
.btn.btn-white.btn-disabled {
  background-color: #bcbec0;
  border-color: #bcbec0;
  color: #ffffff;
  opacity: 1;
}
.btn.btn-white-transparent {
  background-color: transparent;
  border-color: #ffffff;
  color: #ffffff;
  border-radius: 5px 5px 5px 5px;
  /* Disabled attribute and/or btn-disabled class (when the element is a link the pseudoclass selector does not work) */
}
.btn.btn-white-transparent:hover,
.btn.btn-white-transparent:focus {
  color: #ffffff;
  background: transparent;
}
.btn.btn-white-transparent:disabled,
.btn.btn-white-transparent[disabled],
.btn.btn-white-transparent.btn-disabled {
  background-color: #bcbec0;
  border-color: #bcbec0;
  color: #ffffff;
  opacity: 1;
}
.btn.btn-second {
  background-color: #1C75BC;
  border-color: #1C75BC;
  color: #ffffff;
  /* Disabled attribute and/or btn-disabled class (when the element is a link the pseudoclass selector does not work) */
}
.btn.btn-second:hover,
.btn.btn-second:focus {
  background-color: transparent;
  color: #1C75BC;
}
.btn.btn-second:disabled,
.btn.btn-second[disabled],
.btn.btn-second.btn-disabled {
  background-color: #bcbec0;
  border-color: #bcbec0;
  color: #ffffff;
  opacity: 1;
}
.btn.btn-grey {
  background-color: transparent;
  border-color: #6d6e71;
  color: #6d6e71;
}
.btn.btn-grey:hover {
  background-color: transparent;
  border-color: #6d6e71;
  color: #f47b20;
}
.btn.btn-grey:active {
  background-color: transparent;
  border-color: #f47b20;
  color: #f47b20;
}
.btn.btn-grey:disabled {
  background-color: #bcbec0;
  border-color: #bcbec0;
  color: #ffffff;
  opacity: 1;
}
.btn.btn-third {
  background-color: #003858;
  border-color: #003858;
  color: #ffffff;
}
.btn.btn-third:hover,
.btn.btn-third:focus {
  background-color: transparent;
  border-color: #003858;
  color: #003858;
}
.btn.btn-center {
  left: 50%;
  position: relative;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}
.btn.btn-full {
  width: 100%;
  min-height: 45px;
}
.btn.btn-light {
  background: transparent;
  color: #A7A9AC;
  margin: 0;
  border: 0.5px solid #A7A9AC;
  font-family: 'Open Sans SemiBold';
  border-radius: 0.3rem;
}
.btn.btn-light:hover,
.btn.btn-light:focus {
  color: #6D6E71;
  border: 0.5px solid #6D6E71;
}
.btn.btn-light.btn-back {
  margin-right: 1rem;
}
.btn.btn-green,
.btn.btn-success {
  background-color: #36B449;
  border-color: #36B449;
  color: #ffffff;
}
.btn.btn-green:hover,
.btn.btn-success:hover,
.btn.btn-green:focus,
.btn.btn-success:focus {
  background-color: transparent;
  border-color: #36B449;
  color: #36B449;
}
.btn.btn-red {
  background-color: #EE1C25;
  border-color: #EE1C25;
  color: #ffffff;
}
.btn.btn-red:hover,
.btn.btn-red:focus {
  background-color: transparent;
  border-color: #EE1C25;
  color: #EE1C25;
}
.btn.btn-danger {
  background-color: #EE1C25;
  border-color: #EE1C25;
  color: #ffffff;
}
.btn.btn-danger:hover,
.btn.btn-danger:focus {
  background-color: transparent;
  border-color: #EE1C25;
  color: #EE1C25;
}
.btn.small {
  font-size: 1.4rem;
}
.btn.full-width {
  width: 100%;
}
.btn.btn--homepage-section {
  min-width: 25rem;
}
.btn.btn--long {
  padding-left: 70px;
  padding-right: 70px;
}
.btn.btn-wrap {
  white-space: normal;
}
.btn.btn__login {
  /* make the login button look like the register */
  min-width: 133px;
}
.btn-tertiary {
  color: #1C75BC;
  text-decoration: none;
  font-weight: normal;
  background: none;
  border: none;
  padding: 0;
  text-align: left;
}
.btn-tertiary.btn {
  letter-spacing: 0;
}
.btn-tertiary.disabled {
  color: #bcbec0;
}
.btn-tertiary.disabled:hover {
  text-decoration: none;
  color: #bcbec0;
}
.btn-tertiary:hover {
  color: #1C75BC;
  text-decoration: underline;
  font-weight: normal;
}
.btn-tertiary:focus {
  color: #1C75BC;
}
table .btn {
  margin-top: 0;
}
/* HOW WILL YOU USE HOAMPAGE? buttons */
.htwhp__button {
  min-width: 192px;
}
.btn--nowrap {
  white-space: nowrap;
}
.btn-tertiary--underline {
  color: #1C75BC;
  text-decoration: none;
  font-weight: normal;
  background: none;
  border: none;
  padding: 0;
  text-align: left;
  text-decoration: underline;
}
.btn-tertiary--underline.btn {
  letter-spacing: 0;
}
.btn-tertiary--underline.disabled {
  color: #bcbec0;
}
.btn-tertiary--underline.disabled:hover {
  text-decoration: none;
  color: #bcbec0;
}
.btn-tertiary--underline:hover {
  color: #1C75BC;
  text-decoration: underline;
  font-weight: normal;
}
.btn-tertiary--underline:focus {
  color: #1C75BC;
}
.showModalButton {
  cursor: pointer;
}
