:root {
  --color-bg-primary: #084861;
  --color-primary: #BBD64C;
  --color-secondary: #7FCDBF;
  --color-primary-hover: #a3d475;
  --color-light-grey: #EEF2F4;
  --color-grey-text: #9CB6C0;
}




:root {
  font-family: 'Poppins', sans-serif;
  font-style: normal;
  font-weight: 300;
}


.dots-left {
  position: absolute;
  top: 800px;
  left: 0;
  max-width: 12vw;
  z-index: 100;
}

.dots-left img {
  width: auto;
  height: auto;
  max-width: 100%;
}

.dots-right {
  position: absolute;
  top: 3000px;
  right: 0;
  max-width: 12vw;
  z-index: 100;
}

.dots-right img {
  width: auto;
  height: auto;
  max-width: 100%;
}

.gradientBar{
  height:10px;
  background-image: linear-gradient(to right,var(--color-primary), var(--color-secondary));
}

.splitContainer__hero img {
  border-radius: 90px;
}

h2,
h3,
p,
a,
ol,
ul{

  margin-bottom: 1em;
}

h1,
h2,
h3
 {
  display:inline-block;
  margin-bottom: .5em;
}

#wrapper > header > div > div.hamburger-container.mainHeader__nav > div > ul > li > ul > li > a,
#wrapper > header > div > div.hamburger-container.mainHeader__nav > div > ul{

  margin-bottom: revert-layer
}

/* Makes the carousel sidebar have it's content vertically centered*/
.carousel-sidebar__content{
    align-content:center;
}

a.btn {

  border: solid 1px;
  border-color: #1e9fbf;
}

a.btn:hover {

  background:#fff;
  color: #1e9fbf;
  border: solid 1px;
  border-color: #1e9fbf;
}


.carousel-container {
  margin-top: -1.7vh; /* Adjust this value as needed (e.g., -1.5vh, -3vh) */
}

/*make button fixed and hover in bottom right corner of the screen*/
.fixed-bottom-right{
    position:fixed;
    bottom:10px;
    right:1em;
    z-index:10000;

}