/*
 ===========================================
 ============ Native element ===============
 ===========================================
 */
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css");
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800&display=swap');
:root {
  --primary-color: #97D700;
  --secondary-color: #002A3A;
  --tertiary-color: #fff4e6; }

html, body {
  font-family: 'Montserrat', sans-serif;
  /* font-family: 'PT Sans', sans-serif;     */
  color: #002A3A;
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: 0.025em; }

.primary-color {
  color: var(--primary-color); }

.secondary-color {
  color: var(--secondary-color); }

.tertiary-color {
  color: var(--tertiary-color); }

.green {
  color: #97D700; }

.dark_blue {
  color: #002A3A; }

.red {
  color: #BA0C2F; }

.orange {
  color: #ED8B00; }

.purple {
  color: #5C068C; }

.blue {
  color: #00A6D6; }

.cyan {
  color: #5CB8B2; }

.pink {
  color: #F04E98; }

.coral {
  color: #FFCD00; }

.bg-orange {
  background-color: #ED8B00; }

.bg-orange-light {
  background-color: #fff4e6; }

.bg-green-light {
  background-color: #f7ffe6; }

.extrasmall {
  font-size: 12px; }

.drop-shadow {
  filter: drop-shadow(5px 4px 2px #ccc); }

h2 {
  color: var(--secondary-color); }

a {
  color: var(--secondary-color);
  text-decoration: none; }

a:hover {
  text-decoration: underline; }

p {
  margin-top: 0;
  margin-bottom: 1rem; }

.table-global-wrapper table {
  margin-bottom: 30px;
  margin-top: 15px; }

.table-global-wrapper table td {
  border: 1px solid #d7d7d7;
  padding: 10px; }

.alert-top {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 99;
  opacity: 0.7;
  pointer-events: none; }

.action.primary {
  background-image: none;
  background: #08c;
  border: 1px solid #08c;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-weight: 600;
  padding: 7px 15px;
  font-size: 1.4rem;
  vertical-align: middle;
  font-weight: 400;
  line-height: 22px; }

.sticky-top {
  z-index: 9999; }

.blinking {
  animation: animate 2s linear infinite; }

@keyframes animate {
  0% {
    opacity: 0.2; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0.2; } }

.rotated {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg); }

/* === Loader === */
.loading {
  width: 50px;
  height: 50px;
  margin: 0 auto;
  border: 5px solid #f3f3f3;
  border-radius: 50%;
  border-top: 5px solid #555;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite; }

.page-loader {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 50px;
  height: 50px;
  margin: 0 auto;
  border: 5px solid #f3f3f3;
  border-radius: 50%;
  border-top: 5px solid #555;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite; }

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg); } }
@keyframes spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
/* == Transitions == */
a, button {
  transition: all ease-in 0.2s;
  -webkit-transition: all ease-in 0.2s;
  -ms-transition: all ease-in 0.2s;
  -o-transition: all ease-in 0.2s; }

/* === Header === */
.site-header {
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  border-top: 3px solid var(--secondary-color); }

.site-header .logo {
  width: 180px;
  max-width: 100%;
  margin: 0 auto;
  padding: 1rem 0; }

/* === Footer === */
.footer {
  background-color: var(--secondary-color);
  color: white; }