:root {
  margin: 0;
  padding: 0;

  --main-color: #2a6b7f;
  --sub-color: #60afc8;

  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
}

/* old-color */
/* 
#6f00ff violet
#966fd6 lg-violet
*/

/* new-color */
/* 
#2a6b7f sea-green
#60afc8 lg-sea-green
*/


body {
  font-family: "Open Sans", Arial, sans-serif;
  background: linear-gradient(165deg, #e6e8fa 50%, #ffffff 50%) !important;
  background-size: cover;
}

.text-color {
  color: var(--main-color);
}

a {
  color: var(--main-color);
}

a:hover,
a:focus {
  color: var(--sub-color);
}

a.btn.btn-lg.btn-outline-secondary.mb-3:hover,
a.btn.btn-lg.btn-outline-secondary.mb-3:focus {
  color: var(--main-color) !important;
  background-color: #ffffff !important;
  border-color: var(--sub-color) !important;
}

.btn-bd-primary {
  color: #ffffff;
  background-color: var(--main-color);
  border-color: var(--main-color);
}

.btn-bd-primary:hover,
.btn-bd-primary:focus {
  color: #ffffff;
  background-color: var(--sub-color);
  border-color: var(--sub-color);
}

/* index */

small.pc-1 {
  color: #292828;
}

/* sidebar */

.sidebar .logo-container .logo .logo-name a {
  color: #ffffff;
}

.sidebar .logo-container .logo .logo-name a:hover,
.sidebar .logo-container .logo .logo-name a:focus {
  color: #ffffff;
}

.sidebar #btn {
  color: #e6e8fa !important;
}

.sidebar #btn:hover {
  background-color: rgba(255, 255, 255, 0.4);
  color: #ffffff;
}

.sidebar ul li a {
  color: #e6e8fa !important;
}

.sidebar ul li a:hover,
.sidebar ul li a:focus {
  color: #ffffff !important;
  background-color: rgba(255, 255, 255, 0.4);
}

.sidebar {
  color: #e6e8fa;
  background-color: var(--main-color);
}

/* auth */

.btn.btn-primary {
  background-color: var(--main-color) !important;
  border-color: var(--main-color) !important;
}

.btn.btn-primary:hover,
.btn.btn-primary:focus {
  background-color: var(--sub-color) !important;
  border-color: var(--sub-color) !important;
}

/* dashboard */

.container-title {
  color: var(--main-color) !important;
}

.row .col-auto {
  color: var(--main-color) !important;
}

.row .col-auto .profile a {
  color: var(--main-color);
  background-color: none;
  /* background-color: #e6e8fa; */
  border-color: var(--main-color) !important;
}

/* .row .col-auto .profile a:focus,
.row .col-auto .profile a:hover {
  background-color: var(--main-color) !important;
  border-color: var(--main-color) !important;
} */

.row .col-auto .profile-menu .dropdown a{
  color: #e6e8fa;
  background-color: var(--main-color);
}

.row .col-auto .profile-menu #dropdown-signout-btn {
  color: #ffffff;
  background: var(--main-color);
}

.row .col-auto .profile-menu .dropdown .dropdown-menu a {
  color: #5c5959;
  background-color: #ffffff;
}

/* footer */

small.fc {
  font-size: 1rem;
  font-weight: 400 !important;
  color: #292828;
}

small.fc a:hover {
  color: var(--sub-color);
}

@media screen and (min-width: 480px) {
  /* X-Small devices (portrait phones, 480px and up) */
}
@media screen and (min-width: 576px) {
  /* Small devices (landscape phones, 576px and up) */
}
@media screen and (min-width: 768px) {
  /* Medium devices (tablets, 768px and up) */
}
@media screen and (min-width: 992px) {
  /* Large devices (desktops, 992px and up) */
}
@media screen and (min-width: 1200px) {
  /* X-Large devices (large desktops, 1200px and up) */
}
@media screen and (min-width: 1400px) {
  /* XX-Large devices (larger desktops, 1400px and up) */
}