:root {
  --bs-primary: #0d3c80 !important;
  --bs-success: #0ae98a !important;
  --color-light1: rgb(59, 59, 59);
  --color-light2: #43434390;
  --color-white: #ffffff;

  --swiper-theme-color: #ff6600 !important;
  --swiper-navigation-color: #ff6600 !important;
  --swiper-pagination-color: #ff6600 !important;

  --color-neutro: #494949;
  --color-black: #000000;
  --transition150: all 150ms;
  --transition300: all 300ms;
  --transition4: all 0.25s ease;
  --shadow-general: 0px 10px 15px -9px rgba(0, 0, 0, 0.7);
  --font-fm: "Poppins", sans-serif;
}

.text-primarys {
  color: var(--bs-primary) !important;
}

.sl-variant {
  color: hsl(215, 82%, 28%);
}

.text-secondarys {
  color: var(--bs-success) !important;
}

.text-blacks {
  color: var(--color-black);
}

.bg-primarys {
  background: var(--bs-primary) !important;
}

.bg-secondarys {
  background-color: var(--bs-success) !important;
}

.btn-primary {
  /* BUTTONS */
  --bs-btn-color: #fff;
  --bs-btn-bg: #0ae98a !important;
  --bs-btn-border-color: #0ae98a !important;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #0d3c80 !important;
  --bs-btn-hover-border-color: #0d3c80 !important;
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #0ae98a !important;
  --bs-btn-active-border-color: #0ae98a !important;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #0d6efd;
  --bs-btn-disabled-border-color: #0d6efd;
}

* {
  box-sizing: border-box;
  text-decoration: none;
  font-family: "Poppins", sans-serif;
  color: var(--color-black);
}

img {
  width: 100%;
  display: block;
  margin: none;
  transition: var(--transition150);
  height: auto;
}

.cl-normal {
  width: 1200px;
  margin: auto;
  transition: var(--transition150);
}
.bg-principal {
    background-color: #13161c;
}
.background-radial-gradient {
    background-color: #13161c;
    background-image: 
    radial-gradient(
        37.88% 68.62% at 50% 0,
        rgba(10, 233, 138, 0.3) 0,
        rgba(0, 124, 71, 0) 80%
      ),
      /* radial-gradient(
        10% 100% at 100% 0,
        rgba(10, 233, 138, 0.5) 0,
        rgba(0, 124, 71, 0.4) 90%,
        rgba(0, 124, 71, 0) 0
      ), */
      radial-gradient(
        100% 28.09% at 100% 10%,
        rgba(10, 233, 138, 0.2) 0,
        rgba(0, 124, 71, 0.1) 80%,
        rgba(0, 124, 71, 0) 100%
      ),
      linear-gradient(
        180deg,
        rgba(0, 124, 71, 0.075) 35.79%,
        rgba(0, 124, 71, 0.05) 80%,
        #13161c
      ),
      radial-gradient(
        74.84% 135.56% at 100% 10%,
        rgba(0, 124, 71, 0.5) 0,
        #13161c 80%
      );
  min-height: 100vh;
  background-attachment: fixed;
}
.bg-course {
    background: linear-gradient(
        180deg,
        rgba(10, 233, 138, 0.48),
        rgba(10, 233, 138, 0) 42.31%
      ),
      radial-gradient(
        326.4% 182.46% at 100% 0,
        rgba(10, 233, 138, 0.368) 0,
        rgba(0, 170, 99, 0.4) 25.86%,
        rgba(0, 196, 114, 0.4) 26.01%,
        rgba(6, 207, 195, 0.204) 87.98%,
        rgba(11, 216, 130, 0) 100%
      );
    min-height: 100vh;
    /* min-width: 100vh; */
  }
#radius-shape-1 {
  height: 220px;
  width: 220px;
  top: -60px;
  left: -130px;
  /* background: radial-gradient(#0ae98a, #000000); */
  overflow: hidden;
}

#radius-shape-2 {
  border-radius: 38% 62% 63% 37% / 70% 33% 67% 30%;
  bottom: -60px;
  right: -110px;
  width: 300px;
  height: 300px;
  /* background: radial-gradient(#0b6c2f, #00f059); */
  overflow: hidden;
}
.bg-principal-s {
    background-color: #13161c !important;
  }
  .text-primarys {
    color: var(--bs-success) !important;
  }
.bg-glass {
  background-color: hsla(0, 0%, 100%, 0.9) !important;
  backdrop-filter: saturate(200%) blur(25px);
}
.location-ref {
  display: none;
}
.location-cont:hover {
  background-color: rgba(0, 0, 0, 0.125);
}
.location-cont:hover .location-ref {
  display: flex;
}

@media screen and (max-width: 1400px) {
  .cl-normal {
    width: 900px;
    margin: auto;
  }
}

@media screen and (max-width: 960px) {
  .cl-normal {
    width: 600px;
    margin: auto;
  }
}

@media screen and (max-width: 650px) {
  .cl-normal {
    width: 85%;
    margin: auto;
  }
}

@media screen and (max-width: 480px) {
}

@media screen and (max-width: 360px) {
  .cl-normal {
    width: 92%;
    margin: auto;
  }

  .diri_logo {
    width: 30px;
  }
}