:root {
  --main-color-red: #c01466;
  --main-color-darkblue: #010a2d;
  --main-color-lightblue: #b0deed;
  --main-color-gray: #424242;
  --main-color-green: #25D17F;
  --main-color-white: #fff;
}

@font-face {
  font-family: UbuntuThin;
  src: url("/fonts/Ubuntu-Th.ttf");
}

@font-face {
  font-family: Ubuntu;
  src: url("/fonts/Ubuntu-R.ttf");
}

@font-face {
  font-family: UbuntuBold;
  src: url("/fonts/Ubuntu-B.ttf");
}

@font-face {
  font-family: UbuntuLight;
  src: url("/fonts/Ubuntu-L.ttf");
}

@font-face {
  font-family: UbuntuMedium;
  src: url("/fonts/Ubuntu-M.ttf");
}

html,
body {
  margin: 0;
  padding: 0;
  background-color: #fff;
  overflow-x: hidden;
  font-family: UbuntuThin;
}

body {
  font-family: UbuntuThin;
  font-weight: 100;
}

#convertToCo2SupplierLink {
  float:left;
  margin-top: 40px;
  color: var(--main-color-darkblue);
  cursor: pointer;
  font-weight: bold;
}

#convertToCo2SupplierLink:hover {
  color: var(--main-color-red) !important;
}

/*.noscroll {
  overflow: hidden;
}*/

/*.overlay {
  position: fixed;
  overflow-y: scroll;
}*/

[aria-hidden="true"] {
  display: none;
}
[aria-hidden="false"] {
  display: block;
}

/* -------------------top bar---------------- */

.alert-light {
  background-color: transparent !important;
  border-color: transparent !important;
  z-index: 800;
}

.top-bar-link {
  text-align: right;
  z-index: 10;
  pointer-events: all;
  padding-right: 3vw;
  z-index: 990;
  pointer-events: none;
}

a {
  pointer-events: all;
}

.text-uppercase{
  text-transform: uppercase !important;
}

.top-bar span {
  font-size: 18px;
  padding-left: 15px;
  padding-right: 15px;
  font-family: UbuntuThin;
  display: inline-block;
  color: #fff;
  /*background-color: #C4C4C4;*/
}

.top-bar span a {
  color: #fff;
  text-decoration: none;
}

/* -------------------top bar---------------- */

/* -------------------nav bar----------------- */

nav {
  width: 100%;
  line-height: 60px;
}

/* -------------------nav bar----------------- */

#mainBackground {
  position: absolute;
  min-width: 75vmax !important;
  min-height: 75vmax !important;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(
    transparent,
    rgba(175, 222, 237, 1),
    rgb(255, 255, 255),
    transparent,
    transparent,
    transparent,
    transparent
  );
  animation: lightUp 3s cubic-bezier(0, 12, 0.6, 0.91) forwards;
}

.closebtn i.fas {
  /* font-size: 25px; */
}

@keyframes lightUp {
  0% {
    height: 0;
    width: 0;
  }
  100% {
    height: 100vmax;
    width: 100vmax;
  }
}

/* Animation */

#particleCanvas {
  position: fixed;
  top: 0vmin;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
  z-index: 5;
}

#particleCanvas::before {
  animation-name: enlighten;
  animation-fill-mode: forwards;
  animation-duration: 2s;
}

#storeBanner {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 26%;
  background-color: var(--main-color-lightblue);
  z-index: 3000;
  border-top: 1px solid var(--main-color-darkblue);
  font-family: "UbuntuThin";
  display: none;
}

#storeBannerContainer {
  display: flex;
  z-index: 1;
  background-color: #b0deedbf;
}

#storeBannerContent a {
  color: var(--main-color-red);
}

#storeBannerBackground {
  background-image: url(/img/newDotsDigital.svg);
  background-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
}
#storeBannerTitle {
  font-family: "UbuntuBold";
}

#storeBannerContent {
  position: relative;
  align-self: center;
  padding: 30px;
  color: var(--main-color-darkblue);
  margin: auto;
  font-size: 20px;
  font-family: 'Ubuntu';
  /* max-width: revert; */
}

#storeBannerClose {
  position: absolute;
  top: 5px;
  right: 15px;
  font-weight: bold;
  font-size: 25px;
  cursor: pointer;
}

.enlargeOnHover {
  transition: 0.5s;
}

.enlargeOnHover:hover {
  transform: scale(1.1);
}

#product-video-button{
  display: grid;
  grid-template-columns: minmax(0, 2.25rem) 1fr;
  gap: 20px;
  position: absolute;
  right: 10vmin;
  bottom: 10vmin;
  cursor: pointer;
  z-index: 10;
}

#product-video-button img {
  width: clamp(1.6rem, 1.45rem + 0.75vw, 2.25rem);
}

#product-video-button-2{
  display: grid;
  grid-template-columns: 5rem 1fr;
  gap: 20px;
  position: absolute;
  right: 10vmin;
  bottom: 0;
  cursor: pointer;
  align-items: center;
  z-index: 10;
}

#product-video-button-2 img {
  width: clamp(1.6rem, 1.45rem + 0.75vw, 2.25rem);
}


#storeBannerImage {
  border: 20px solid var(--main-color-darkblue);
  border-radius: 15px;
  margin: 5px;
  max-width: 35vw;
  max-height: 25vh;
  justify-self: center;
  margin-right: 5%;
  z-index: 1;
}
/* ----------------banner------------------*/

@keyframes enlighten {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes enlightenScale {
  from {
    opacity: 0;
    height: 0%;
  }
  to {
    opacity: 1;
    height: 100%;
  }
}

/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

.notifyjs-corner {
  z-index: 999999999 !important;
}

.wg-drop.country-selector {
  background-color: unset !important;
}

#loadScreenLoadingGif {
  height: 40vmin;
  width: 40vmin;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

#loading-page {
  background-color: rgba(255, 255, 255, 0.63);
  text-align-last: center;
  position: fixed;
  width: 100vw;
  z-index: 999999;
  height: 100vh;
  margin-top: 0vh;
  backdrop-filter: blur(6px);
}

.footer-holder-n{
  padding: 80px 5vmin 0 14vmin;
}

@media (max-width: 992px) {

  .footer-holder-n{
   padding: 80px 20px 0 0px;
}
  
  #head_top_academy_icon {
    display: inline-block;/* !important; */
  }

  #fullTextCard_body {
    display: block;    
  }

  #fullTextCard_body img {
    max-width: 90%;
    height: unset
  }

  .navbar-brand,
  #header-navigation-info {
    display: none;
  }

  .mainBackgroundHolder {
    margin-top: 50vh;
  }

  .img_line {
    display: none;
  }

  .img_dot_text {
    position: relative !important;
  }

  #top-bar {
    /* padding-left: 10px; */
  }

  .txt1 {
      font-size: 45px;
  }

  #index-first-banner {
      /* margin-top: 0 !important; */
  }

  #home-legal-tech-image {
      display: none;
  }

  #index-cards {
      margin-bottom: 50px;
  }

  .card-set-one {
      height: auto;
  }

  #particleCanvas {
      display: none;
  }

  .particleCanvas {
      display: none;
  }

  #mainBackground {
      top: 400px;
  }

  .heading-2 {
      margin-top: 100px;
  }

  .heading-3 {
      margin-top: 100px;
  }

  .heading-4 {
      margin-top: 100px;
  }

  .heading-5 {
      margin-top: 0px;
  }

  .new-section {
      padding-top: 100px;
      padding-bottom: 100px;
  }
}

@media (max-width: 576px) {
  .txt1 {
      font-size: 24px;
  }

  .subtitle_link_list {
      display: none;
  }

  .title1 {
      font-size: 48px;
  }

  .section-one h1 {
      font-size: 64px;
  }

  .section-one-span {
      font-size: 48px;
  }

  .section-one p {
      /* font-size: 18px; */
  }

  .section-one a {
      /* font-size:16px; */
  }

  .section-one-span h1 {
      font-size: 48px;
  }

  .section-one-span p {
      /* font-size: 18px; */
  }

  .section-one-span a {
      /* font-size:18px; */
  }

  .ref-p {
      /* font-size: 18px; */
  }

  .bigImage {
      width: 361px;
      height: 115px;
  }
}