/* Blå bakgrund */
.bg-blue {
  background-color: #007bff !important;
}

a.bg-blue:hover, a.bg-blue:focus,
button.bg-blue:hover,
button.bg-blue:focus {
  background-color: #0056b3 !important;
}

/* Blå knapp */
.btn-blue {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}

.btn-blue:hover {
  color: #fff;
  background-color: #0069d9;
  border-color: #0062cc;
}

.btn-blue:focus, .btn-blue.focus {
  color: #fff;
  background-color: #0069d9;
  border-color: #0062cc;
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}

.btn-blue.disabled, .btn-blue:disabled {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}

.btn-blue:not(:disabled):not(.disabled):active, .btn-blue:not(:disabled):not(.disabled).active,
.show > .btn-blue.dropdown-toggle {
  color: #fff;
  background-color: #005cbf;
  border-color: #0056b3;
}

.btn-blue:not(:disabled):not(.disabled):active:focus, .btn-blue:not(:disabled):not(.disabled).active:focus,
.show > .btn-blue.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}


/*

/*-----------------------------------------------------------------------------------------------*/
 /*-----------------------------------------------------------------------------------------------*/
  :root {
	--green: #198754;
  --orange: #fd7e14;
  --gray: #6c757d;
  --pink: #e83e8c;
  --teal: #20c997;
  --blue: #007bff;
}

/* ========= BAKGRUND ========= */
.bg-blue   { background-color: var(--blue) !important; color: white; }
.bg-orange { background-color: var(--orange) !important; color: white; }
.bg-gray   { background-color: var(--gray) !important; color: white; }
.bg-pink   { background-color: var(--pink) !important; color: white; }
.bg-teal   { background-color: var(--teal) !important; color: white; }

a.bg-blue:hover, a.bg-blue:focus,
button.bg-blue:hover, button.bg-blue:focus {
  background-color: #0056b3 !important;
}

a.bg-orange:hover, a.bg-orange:focus,
button.bg-orange:hover, button.bg-orange:focus {
  background-color: #e56f10 !important;
}

a.bg-gray:hover, a.bg-gray:focus,
button.bg-gray:hover, button.bg-gray:focus {
  background-color: #5c636a !important;
}

a.bg-pink:hover, a.bg-pink:focus,
button.bg-pink:hover, button.bg-pink:focus {
  background-color: #c82368 !important;
}

a.bg-teal:hover, a.bg-teal:focus,
button.bg-teal:hover, button.bg-teal:focus {
  background-color: #1aa179 !important;
}


/* ========= KNAPPAR ========= */

.btn-blue   { background-color: var(--blue); color: white; border-color: var(--blue); }
.btn-orange { background-color: var(--orange); color: white; border-color: var(--orange); }
.btn-gray   { background-color: var(--gray); color: white; border-color: var(--gray); }
.btn-pink   { background-color: var(--pink); color: white; border-color: var(--pink); }
.btn-teal   { background-color: var(--teal); color: white; border-color: var(--teal); }

.btn-blue:hover   { background-color: #0069d9; border-color: #0062cc; }
.btn-orange:hover { background-color: #e56f10; border-color: #d9650f; }
.btn-gray:hover   { background-color: #5c636a; border-color: #545b62; }
.btn-pink:hover   { background-color: #c82368; border-color: #bd1f5d; }
.btn-teal:hover   { background-color: #1aa179; border-color: #189e74; }

.btn-blue:focus, .btn-blue.focus {
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}
.btn-orange:focus, .btn-orange.focus {
  box-shadow: 0 0 0 0.2rem rgba(253, 126, 20, 0.5);
}
.btn-gray:focus, .btn-gray.focus {
  box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
}
.btn-pink:focus, .btn-pink.focus {
  box-shadow: 0 0 0 0.2rem rgba(232, 62, 140, 0.5);
}
.btn-teal:focus, .btn-teal.focus {
  box-shadow: 0 0 0 0.2rem rgba(32, 201, 151, 0.5);
}

 


/*-----AHMODD------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/