@font-face {
  font-family: Poppins-Bold;
  src: url('../fonts/Poppins/Poppins-Bold.ttf') format("opentype")
}

@font-face {
  font-family: Poppins-SemiBold;
  src: url('../fonts/Poppins/Poppins-SemiBold.ttf') format("opentype")
}

@font-face {
  font-family: Poppins-Regular_0;
  src: url('../fonts/Poppins/Poppins-Regular.ttf') format("opentype")
}

@font-face {
  font-family: Poppins-Light_0;
  src: url('../fonts/Poppins/Poppins-Light.ttf') format("opentype")
}

@font-face {
  font-family: Poppins-Medium_0;
  src: url('../fonts/Poppins/Poppins-Medium.ttf') format("opentype")
}

@font-face {
  font-family: Poppins-ExtraLight_0;
  src: url('../fonts/Poppins/Poppins-ExtraLight.ttf') format("opentype")
}

@font-face {
  font-family: Poppins-Thin_0;
  src: url('../fonts/Poppins/Poppins-Thin.ttf') format("opentype")
}

html,
body {
  overflow-x: hidden !important;
  font-family: Poppins-Regular_0;
}

main {
  margin-top: 90px;
}

#cursor {
  position: fixed;
  top: -5px;
  left: -5px;
  width: 10px;
  height: 10px;
  background-color: var(--primary-web-color);
  border-radius: 50%;
  pointer-events: none;
  z-index: 999;
}

#cursor-border {
  --size: 50px;
  position: fixed;
  top: calc(var(--size) / -2);
  left: calc(var(--size) / -2);
  width: var(--size);
  height: var(--size);
  border-radius: 50%;
  box-shadow: 0 0 0 1px var(--primary-web-color);
  pointer-events: none;
  transition: top 0.15s ease-out, left 0.15s ease-out, width 0.15s ease-out,
    height 0.15s ease-out, background-color 0.15s ease-out;
  z-index: 999;
}

.preloaderBg {
  position: fixed;
  z-index: 999999;
  top: 0;
  background: #fff;
  width: 100%;
  height: 100%;
  text-align: center;
}

.preloader {
  margin: auto;
  background: url(../media/image/logo.png) no-repeat center;
  background-size: 208px;
  width: 300px;
  height: 300px;
  position: relative;
  top: 177px;
}

.preloader2 {
  border: 5px solid #f3f3f3;
  border-top: 5px solid var(--primary-web-color);
  border-radius: 50%;
  width: 180px;
  height: 180px;
  animation: spin 1s ease-in-out infinite;
  position: relative;
  margin: auto;
  top: -64px;
}

@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}

.float-action {
  background-color: transparent;
  height: 64px;
  width: 64px;
  border-radius: 32px;
  transition: height 300ms;
  transition-timing-function: ease;
  position: absolute;
  right: 50px;
  bottom: 50px;
  text-align: center;
  z-index: 100;
  overflow: hidden;
}

.float-action:hover {
  height: 404px;
}

.float-action:hover .mainop {
  transform: rotate(360deg);
}

.mainop {
  margin: auto;
  width: 64px;
  height: 64px;
  position: absolute;
  bottom: 0;
  display: flex;
  right: 0;
  transition: transform 300ms;
  background-color: var(--primary-web-color);
  border-radius: 32px;
  z-index: 100;
  align-items: center;
  justify-content: center;
}

.mainopShadow {
  width: 64px;
  height: 64px;
  border-radius: 32px;
  position: fixed;
  right: 20px;
  bottom: 20px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}

.mainop i {
  font-size: 24px;
  color: #fff;
}

.minifab {
  position: relative;
  width: 48px;
  display: flex;
  height: 48px;
  border-radius: 24px;
  z-index: 5;
  float: left;
  margin-bottom: 8px;
  text-decoration: none;
  font-size: 18px;
  margin-left: 8px;
  margin-right: 8px;
  transition: box-shadow 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  align-items: center;
  justify-content: center;
}



.minifab:hover {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}

.minifabIcon {
  height: 24px;
  width: 24px;
  margin-top: 12px;
}


#insta {
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%) !important;
  color: #fff!important;
}

#facebook {
  background: #1877F2!important;
  color: #fff!important;
}

#twitter {
  background: #fff!important;
  color: #000!important;
}

#linkedin {
  background: #0077B5 !important;
  color: #fff !important;
}

#whatsapp {
  background: #25d366 !important;
  color: #fff !important;
}

#phone {
  color: #fff !important;
  background: #004a8b !important;
}

.float-action {
  position: fixed !important;
  right: 20px !important;
  bottom: 20px !important;
}

.cookie-popup {
  background: #f8f9fa;
  padding: 15px;
  position: fixed;
  bottom: 0;
  z-index: 100;
  width: 100%;
  text-align: center;
  border-top: 1px solid #ccc;
}

.cookie-popup a {
  color: var(--primary-web-color);
}

.cookie-popup .accept-btn {
  padding: 10px 20px; 
  background: var(--primary-web-color); 
  color: #fff; 
  border: none; 
  cursor: pointer;
}

.cookie-popup .decline-btn {
  padding: 10px 20px; 
  background: #000; 
  color: #fff; 
  border: none; 
  cursor: pointer;
}

@media screen and (max-width:768px) {
  #cursor {
    display: none !important;
  }

  #cursor-border {
    display: none !important;
  }
}