:root {
  --back-color: #1D3FBE;
  --back-selected-color: #1D3FBE;
  --main-color: #1D3FBE;
  --sec-color: #C44678;
  --tre-color: #8DC7A5;
}

@font-face {
  font-family: 'urbanist';
  src: url('../../fonts/OpenSans/Urbanist-VariableFont_wght.ttf');
  font-weight: 100 700;
}

@font-face {
  font-family: 'comfortaa';
  src: url('../../fonts/Comfortaa/Comfortaa-VariableFont_wght.ttf');
  font-weight: 100 700;
}

@font-face {
  font-family: 'opensans';
  src: url('../../fonts/OpenSans/OpenSans-VariableFont_wdth,wght.ttf');
  font-weight: 100 700;
}


h1, h2, h3, h4, h5, h6 {
  font-family: 'comfortaa';
  font-weight: 400;
}

h1.bold,
h3.bold,
h4.bold,
h5.bold,
h6.bold {
  font-family: 'comfortaa';
  font-weight: bold;
}

body {
  background-color: #fff;
}
.sidebar-collapse, .nav-header {
  background-color: var(--back-color);
}

.nav-header {
  background-image: none;
}

a, 
.top-navigation .nav > li.active > a, 
.top-navigation .nav > li a:hover, 
.top-navigation .nav > li a:focus
{
  color: var(--main-color);
}

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

.nav > li.active{
  border-left: 4px solid var(--sec-color);
  background-color: var(--back-selected-color);
}

.navbar-default .nav > li {
  background-color: var(--back-selected-color);
}

.navbar-default .nav > li > a:hover, .navbar-default .nav > li > a:focus {
  background-color: var(--back-color);
}

.pace .pace-progress {
  background: var(--sec-color);
}


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

.btn-primary:hover {
  background-color: var(--main-color);
  border-color: var(--main-color);
  filter: brightness(120%);
}

.form-control {
  color: var(--back-color);
}

.form-control, .btn {
  border-radius: 8px;
}

.form-control:focus {
  border-color: var(--main-color);
}

.sm-dark{
  background-color: var(--back-color);
  color: #fff;
}

.sm-dark a {
  color: var(--sec-color);
}

.sm-dark .btn-primary {
  background-color: var(--sec-color);
  border-color: var(--sec-color);
}

.sm-dark .btn-primary:hover {
  background-color: var(--sec-color);
  border-color: var(--sec-color);
  filter: brightness(100%);
}

.sm-dark .form-control:focus {
  border-color: var(--sec-color);
}

.flag-icon {
  padding: 2px;
}

.navbar-static-top .dropdown-menu {
  left: 0!important;
  z-index: 9999;
}
.top-navigation .dropdown-menu > li > a {
  padding: 3px 20px;
}