@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;400;600;900&display=swap');

body,html{
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  margin: 0;
}
.menu {
    background: #f0f0f0;
    padding: 0;
    color:  white;
    width: 250px;
    position: fixed;
    z-index: 10;
    height: 100vh;
}
a.nav-link {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
}
.nav-item {
    margin: 0 10px;
}
.nav-link.active{
  background-color: #0f61ab !important;
}
.content{
    padding: 0;
}
.custom-content{
  font-size: 20px;
}
.logo {
    width:120px;
}
@media only screen and (max-width: 600px) {
  .logo {
      width:70px;
  }
}
.menu_item:hover{
  background: #0f61ab;
  color: white;
}
.menu_item {
    display: block;
    border-bottom: 1px solid gray;
    padding: 10px;
    transition: 0.4s ease;
    color: black;
    cursor: pointer;
}
.menu_item_active{
  background: #0f61ab;
  color: white;
}
.slides{
  position: relative;
}
.slide{
  width: 100%;
  height: 100vh;
  position: absolute;
  transition: 1.5s;
  opacity: 0;
}
.active_slide{
  opacity: 1;
}
.one{
  background-image: url('../images/slide_1.png'), url('../images/slide_1bg.png');
  background-repeat: no-repeat, no-repeat;
  background-size: contain, cover;
  background-position: right center, center center;
}
.two{
  background-image: url('../images/slide_2.png'), url('../images/slide_2bg.png');
  background-repeat: no-repeat, no-repeat;
  background-size: contain, cover;
  background-position: right center, center center;
}
.three{
  background-image: url('../images/slide_3.png'), url('../images/slide_3.jpg');
  background-repeat: no-repeat, no-repeat;
  background-size: contain, cover;
  background-position: right center, center center;
}
.four{
  background-image: url('../images/slide_4.png'), url('../images/slide_4bg.png');
  background-repeat: no-repeat, no-repeat;
  background-size: contain, cover;
  background-position: right center, center center;
}

/* Color of the links BEFORE scroll */
.navbar-scroll .nav-link,
.navbar-scroll .navbar-toggler-icon,
.navbar-scroll .navbar-brand {
  color: #fff;
}

/* Color of the links AFTER scroll */
.navbar-scrolled .nav-link,
.navbar-scrolled .navbar-toggler-icon,
.navbar-scrolled .navbar-brand {
  color: #fff;
}

/* Color of the navbar AFTER scroll */
.navbar-scroll,
.navbar-scrolled {
  background-color: #cbbcb1;
}
.mask-custom::before {
      -webkit-backdrop-filter: blur(5px);
    -moz-backdrop-filter: blur(5px);
    -o-backdrop-filter: blur(5px);
    -ms-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  background-color: rgba(255, 255, 255, .15);
}
.mask-custom {
      -webkit-backdrop-filter: blur(5px);
    -moz-backdrop-filter: blur(5px);
    -o-backdrop-filter: blur(5px);
    -ms-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  background-color: rgba(255, 255, 255, .15);
}

.navbar-brand {
  font-size: 1.75rem;
  letter-spacing: 3px;
}


.scrollStatus-progress {
  height: 5px !important;
  background: rgb(15 97 172) !important;
}