/*------------------------------------------------------ Frontend ------------------------------------------------------*/
/*fonts*/
@font-face {
  font-family: 'Gilroy';
  src: url('../fonts/Gilroy-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

/* global */

.open-sans-miniweb {
  font-family: "Gilroy","Open Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

html {
  scroll-behavior: smooth;
}

a:hover {
  color: #2F8880;
}

.accordion-button:not(.collapsed) {
  color: #2F8880;
  background: rgba(255, 255, 255, 0.06);
}

.card-glass{
  background: rgba(255, 255, 255, 0.02);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
}

.visits-card {
  padding: 2.75rem 2.75rem 0 2.75rem;
}

.dashboard>.dashboard-card{
  background: rgba(255, 255, 255, 0.02);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
}

.input-group-text {
  background: rgba(255, 255, 255, 0.02);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}


/* custom dropzone  */

.file-attachment-input {
	position: relative;
	display: block;
	border: 0.125rem dashed #585c59;
	text-align: center;
	overflow: hidden;
	cursor: pointer;
	border-radius: 0.3125rem;
	margin-bottom: 0;
  background: rgba(255, 255, 255, 0.02);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  padding: 1rem;
}

.file-attachment-input:hover {
	background-color: #c6d0fb1c;
}

.file-attachment-input-label {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	min-width: 100%;
	min-height: 100%;
	cursor: inherit;
	opacity: 0;
}
.file-attachment-input.disabled {
	filter: brightness(0.5);
  pointer-events: none;
}

/*Sizings*/
.offcanvas{
  width: 100vw !important;
}
@media (min-width: 768px) { 
  .offcanvas{
    width: 35vw !important;
  }
}


.paymentImages{
	width:5rem;
}

.vh-85{

}

.max-w-st-5{
	max-width:5rem;
}

.max-w-st-15{
	max-width:15rem;
}

.min-h-st-5{
	min-height:5rem;
}

.min-h-st-10{
	min-height:10.5rem;
}

.min-h-st-11{
	min-height:11.5rem;
}

.min-h-st-13{
	min-height:13.5rem;
}

.min-h-st-14{
	min-height:14rem;
}

.min-h-st-16{
  min-height:16rem;
}

.min-h-st-18{
  min-height:18rem;
}

.min-h-st-20{
	min-height:20rem;
}

.max-h-st-8{
  max-height: 8rem;
}

.mt-lg-n10 {
    margin-top: -7.5rem;
}

.w-2r{
  width: 2rem;
}

.w-3r{
  width: 3rem;
}

.w-4r{
  width: 4rem;
}

.w-5r{
  width: 5rem;
}

.w-6r{
  width: 6rem;
}

.w-7r{
  width: 7rem;
}

.w-8r{
  width: 8rem;
}

.w-5 {
  width:5%!important
}

.w-10 {
  width:10%!important
}

.w-15 {
  width:15%!important
}

.w-80{
  width: 98%!important;
}

.w-90{
  width: 90%!important;
}

.w-fit{
  width: fit-content !important;
}
.h-fit{
  height: fit-content !important;
}

.h-0{
  height: 0;
}

.h-2r{
  height: 2rem;
}

.h-4r{
  height: 4rem;
}

@media (min-width: 768px) { 
  .vh-md-85{
    height: 85vh !important;
  }
 }

@media (min-width: 992px) { 
  .min-h-st-lg-16{
    min-height:16rem;
  }

  .min-h-st-lg-20{
    min-height:20rem;
  }

  .w-lg-80{
    width: 80%!important;
  }

  .w-lg-85{
    width: 85%!important;
  }

  .w-lg-90{
    width: 90%!important;
  }
 }

 .navbar.navbar-scrolled.navbar-dark{
  background: #0D1B2A !important;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
 }

.form-check-input.is-invalid, .was-validated .form-check-input:invalid {
  background: #ffeded;
}

.form-check-input:checked {
  background-color: #2F8880;
}

.form-check-input {
  width: 2em;
  height: 2em;
}

.bg-glass{
  background: rgba(255, 255, 255, 0.02);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  padding: 1rem;
}

.bg-glass-light{
  background: rgba(255, 255, 255, 0.07);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  padding: 1rem;
}

.bg-glass-blur-0{
  background: rgba(255, 255, 255, 0.02);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  padding: 1rem;
}

.bg-glass:focus{
  background: rgba(255, 255, 255, 0.1);
}

.gradient-y-overlay-st-secondary-one::before {
  background-image: linear-gradient(to bottom,rgba(6, 26, 34,.12),rgba(6, 26, 34,.88));
}

.gradient-y-overlay-st-white-one::before {
	background-image: linear-gradient(to bottom,rgba(255, 255, 255,.12),rgba(255, 255, 255,.95));
}

.bg-st-lightgray{
  background-color: #f7f7f7;
}

.bg-st-lightblue{
  background-color:#E4ECF7;
}

.lines-background{
  background-image:url('/static/frontend/assets/images/lines-background.svg');
  background-size:cover;
}


/*Buttons*/
.btn-dark-primary{
  background-color: #0D1C30;
  color: white;
}
.btn-dark-primary:hover{
  background-color: #10233c;
  color: white;
}

.btn-outline-dark-primary{
  background: white;
  color: #0D1C30;
  border: 1px solid #0D1C30
}

.btn-outline-dark-primary:hover{
  border-color: transparent;
  background: #0D1C30 !important;
  color: white !important;
}

.btn-soft-primary {
  color: #2D8299;
}

.btn-soft-primary:focus, .btn-soft-primary:hover {
  color: #fff;
  background-color: #16424E;
}

.btn-soft-primary.disabled, .btn-soft-primary:disabled {
  color: #16424E;
  background-color: #16424E36;
}

.btn-ghost-primary {
  color: #127970;
}

.btn-ghost-primary:focus, .btn-ghost-primary:hover {
  color: #127970;
}

.btn-st-secondary{
	background-color:#061A22 !important;
	color:#D7DD00;
}
.btn-outline-web-primary {
  --bs-btn-color: var(--color-primary);
  --bs-btn-border-color: var(--color-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-primary);
  --bs-btn-hover-border-color: var(--color-primary);
  --bs-btn-focus-shadow-rgb: 55,125,255;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-primary);
  --bs-btn-active-border-color: var(--color-primary);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: aliceblue;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: var(--color-primary);
  --bs-gradient: none;
}
/*Social Icons*/
.link-title{
  color: white;
}


:root {
  --generic-color: #102335;
  --facebook-color: #0866FF;
  --instagram-color: #C13584;
  --tiktok-color: white;
  --tiktok-shadow-red: #FD3E3E;
  --tiktok-shadow-blue: #4DE8F4;
  --google-bg: #f1f1f1;
  --youtube-color: #FF0000;
  --threads-color: black;
  --x-twitter-color: black;
  --twitch-color: #6441A5;
  --discord-color: #5865F2;
  --linkedin-color: #0a66c2;
  --reddit-color: #ff4500;
  --snapchat-color: #f9f603;
  --telegram-color: #0088CC;
  --whatsapp-color: #25D366;
  --github-color: black;
  --bitbucket-color: #2684FF;
  --patreon-color: black;
  --deviantart-color: #05CC46;
  --viber-color: #7e54a0;
  --tripadvisor-color: #34e0a1;
}



/* Generic */
.fa-link{
  color: white;
}

.fa-house{
  color: white;
}

.fa-globe{
  color: white;
}

.btn-soft-light.btn-soft-generic,
.btn-soft-dark.btn-soft-generic {
  background:var(--generic-color);
}

.btn-soft-generic:hover .fa-link, 
.btn-soft-generic:hover .fa-globe, 
.btn-soft-generic:hover .fa-house,
.btn-soft-generic:hover .link-title {
  color: var(--generic-color);
}

.btn-soft-generic:hover {
  background-color: #f1f1f1;

}

/* Facebook */
.fa-facebook {
  color: var(--facebook-color);
}

.btn-soft-light.btn-soft-facebook,
.btn-soft-dark.btn-soft-facebook {
  background-color: var(--facebook-color);
}

.btn-soft-facebook:hover .fa-facebook,
.btn-soft-facebook:hover .link-title {
  color: var(--facebook-color);
}

.btn-soft-facebook:hover .fa-facebook {
  color: var(--facebook-color);
}

/* Instagram */
.fa-instagram {
  color: var(--instagram-color);
}

.btn-soft-light.btn-soft-instagram,
.btn-soft-dark.btn-soft-instagram {
  background-color: var(--instagram-color);
}

.btn-soft-instagram:hover .fa-instagram,
.btn-soft-instagram:hover .link-title {
  color: var(--instagram-color);
}

/* TikTok */
.fa-tiktok {
  color: var(--tiktok-color);
  filter: drop-shadow(2px 0px 0px var(--tiktok-shadow-red)) drop-shadow(-2px -2px 0px var(--tiktok-shadow-blue));
}

.btn-soft-light.btn-soft-tiktok,
.btn-soft-dark.btn-soft-tiktok {
  background-color: var(--threads-color);
}

.btn-soft-tiktok:hover .fa-tiktok {
  color: var(--threads-color);
}
.btn-soft-tiktok:hover .link-title{
  color: black;
}

/* Google */
.fa-google {
  background: conic-gradient(from -45deg, #ea4335 110deg, #4285f4 90deg 180deg, #34a853 180deg 270deg, #fbbc05 270deg) 73% 55% / 150% 150% no-repeat;
  -webkit-background-clip: text;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
}

.btn-soft-light.btn-soft-google .link-title,
.btn-soft-dark.btn-soft-google .link-title{
  color: black;
}

.btn-soft-light.btn-soft-google,
.btn-soft-dark.btn-soft-google {
  background-color: var(--google-bg);
}

.btn-soft-google:hover {
  background-color: white;
}

.btn-soft-google:hover .fa-google {
  background: conic-gradient(from 164deg, #ea4335 110deg, #4285f4 90deg 180deg, #34a853 180deg 270deg, #fbbc05 270deg) 73% 55% / 150% 150% no-repeat;
}

.btn-soft-google:hover .link-title{
  color: black;
}
.btn-soft-google .link-title{
  color: black;
}

/* YouTube */
.fa-youtube {
  color: var(--youtube-color);
}

.btn-soft-light.btn-soft-youtube,
.btn-soft-dark.btn-soft-youtube {
  background-color: var(--youtube-color);
}

.btn-soft-youtube:hover .fa-youtube,
.btn-soft-youtube:hover .link-title {
  color: var(--youtube-color);
}

/* Threads */
.fa-threads {
  color: var(--threads-color);
}

.btn-soft-light.btn-soft-threads,
.btn-soft-dark.btn-soft-threads {
  background-color: var(--threads-color);
}

.btn-soft-threads:hover .fa-threads,
.btn-soft-threads:hover .link-title {
  color: var(--threads-color);
}

/* X (Twitter) */
.fa-x-twitter {
  color: var(--x-twitter-color);
}

.btn-soft-light.btn-soft-x,
.btn-soft-dark.btn-soft-x {
  background-color: var(--x-twitter-color);
}

.btn-soft-x:hover .fa-x-twitter,
.btn-soft-x:hover .link-title {
  color: var(--x-twitter-color);
}

/* Twitch */
.fa-twitch {
  color: var(--twitch-color);
}

.btn-soft-light.btn-soft-twitch,
.btn-soft-dark.btn-soft-twitch {
  background-color: var(--twitch-color);
}

.btn-soft-twitch:hover .fa-twitch,
.btn-soft-twitch:hover .link-title {
  color: var(--twitch-color);
}

/* Discord */
.fa-discord {
  color: var(--discord-color);
}

.btn-soft-light.btn-soft-discord,
.btn-soft-dark.btn-soft-discord {
  background-color: var(--discord-color);
}

.btn-soft-discord:hover .fa-discord,
.btn-soft-discord:hover .link-title {
  color: var(--discord-color);
}

/* LinkedIn */
.fa-linkedin {
  color: var(--linkedin-color);
}

.btn-soft-light.btn-soft-linkedin,
.btn-soft-dark.btn-soft-linkedin {
  background-color: var(--linkedin-color);
}

.btn-soft-linkedin:hover .fa-linkedin,
.btn-soft-linkedin:hover .link-title {
  color: var(--linkedin-color);
}

/* Reddit */
.fa-reddit {
  color: var(--reddit-color);
}

.btn-soft-light.btn-soft-reddit,
.btn-soft-dark.btn-soft-reddit {
  background-color: var(--reddit-color);
}

.btn-soft-reddit:hover .fa-reddit,
.btn-soft-reddit:hover .link-title {
  color: var(--reddit-color);
}

/* Snapchat */
.fa-snapchat {
  color: var(--snapchat-color);
}

.btn-soft-light.btn-soft-snapchat,
.btn-soft-dark.btn-soft-snapchat {
  background-color: var(--snapchat-color);
}

.btn-soft-snapchat:hover .fa-snapchat,
.btn-soft-snapchat:hover .link-title {
  color: var(--snapchat-color);
}

/* Telegram */
.fa-telegram {
  color: var(--telegram-color);
}

.btn-soft-light.btn-soft-telegram,
.btn-soft-dark.btn-soft-telegram {
  background-color: var(--telegram-color);
}

.btn-soft-telegram:hover .fa-telegram,
.btn-soft-telegram:hover .link-title {
  color: var(--telegram-color);
}

/* WhatsApp */
.fa-whatsapp {
  color: var(--whatsapp-color);
}

.btn-soft-light.btn-soft-whatsapp,
.btn-soft-dark.btn-soft-whatsapp {
  background-color: var(--whatsapp-color);
}

.btn-soft-whatsapp:hover .fa-whatsapp,
.btn-soft-whatsapp:hover .link-title {
  color: var(--whatsapp-color);
}

/* GitHub */
.fa-github {
  color: var(--github-color);
}

.btn-soft-light.btn-soft-github,
.btn-soft-dark.btn-soft-github {
  background-color: var(--github-color);
}

.btn-soft-github:hover .fa-github,
.btn-soft-github:hover .link-title {
  color: var(--github-color);
}

/* Bitbucket */
.fa-bitbucket {
  color: var(--bitbucket-color);
}

.btn-soft-light.btn-soft-bitbucket,
.btn-soft-dark.btn-soft-bitbucket {
  background-color: var(--bitbucket-color);
}

.btn-soft-bitbucket:hover .fa-bitbucket,
.btn-soft-bitbucket:hover .link-title {
  color: var(--bitbucket-color);
}

/* Patreon */
.fa-patreon {
  color: var(--patreon-color);
}

.btn-soft-light.btn-soft-patreon,
.btn-soft-dark.btn-soft-patreon {
  background-color: var(--patreon-color);
}

.btn-soft-patreon:hover .fa-patreon,
.btn-soft-patreon:hover .link-title {
  color: var(--patreon-color);
}

/* DeviantArt */
.fa-deviantart {
  color: var(--deviantart-color);
}

.btn-soft-light.btn-soft-deviantart,
.btn-soft-dark.btn-soft-deviantart {
  background-color: var(--deviantart-color);
}

.btn-soft-deviantart:hover .fa-deviantart,
.btn-soft-deviantart:hover .link-title {
  color: var(--deviantart-color);
}

/* Viber */
.fa-viber {
  background-color: var(--viber-color);
  color: #ffffff;
}

.btn-soft-light.btn-soft-viber,
.btn-soft-dark.btn-soft-viber {
  background-color: var(--viber-color);
}

.btn-soft-viber:hover .fa-viber,
.btn-soft-viber:hover .link-title {
  /* color: var(--viber-color); */
  opacity: 0.9;
}

/* .btn-soft-light.btn-soft-viber, */
/* .btn-soft-dark.btn-soft-viber { */
  /* background-color: var(--viber-color); */
/* } */

/* .btn-soft-viber:hover .fa-viber, */
/* .btn-soft-viber:hover .link-title { */
  /* color: var(--viber-color); */
/* } */

.btn-soft-light.btn-soft-tripadvisor,
.btn-soft-dark.btn-soft-tripadvisor {
  background-color: var(--tripadvisor-color);
}

.btn-soft-tripadvisor:hover,
.btn-soft-tripadvisor:hover .link-title {
  color: var(--tripadvisor-color);
}

.btn-soft-facebook:hover, 
.btn-soft-instagram:hover, 
.btn-soft-tiktok:hover, 
.btn-soft-youtube:hover, 
.btn-soft-threads:hover, 
.btn-soft-x:hover, 
.btn-soft-twitch:hover, 
.btn-soft-discord:hover, 
.btn-soft-linkedin:hover, 
.btn-soft-reddit:hover, 
.btn-soft-snapchat:hover, 
.btn-soft-telegram:hover, 
.btn-soft-whatsapp:hover, 
.btn-soft-github:hover, 
.btn-soft-bitbucket:hover, 
.btn-soft-patreon:hover, 
.btn-soft-tripadvisor:hover, 
.btn-soft-deviantart:hover {
  background-color: white;
}

.btn .fa-facebook, 
.btn .fa-instagram, 
.btn .fa-tiktok, 
.btn .fa-youtube, 
.btn .fa-threads, 
.btn .fa-x-twitter, 
.btn .fa-twitch, 
.btn .fa-discord, 
.btn .fa-linkedin, 
.btn .fa-reddit, 
.btn .fa-snapchat, 
.btn .fa-telegram, 
.btn .fa-whatsapp, 
.btn .fa-github, 
.btn .fa-bitbucket, 
.btn .fa-patreon, 
.btn .fa-deviantart {
  color: white;
}

/* Font Awesome Icons */
.color-fa-pdf {
  color: #ff2015;
}

.color-fa-doc {
  color: #2a7cd3;
}

.color-fa-xls {
  color: #1fa265;
}

.color-fa-ppt {
  color: #d3512f;
}

.color-fa-zip {
  color: #e2910e;
}


.navbar.navbar-scrolled.navbar-dark {
  background-color: #061A22;
}

.devices-rotate-15 {
  transform: rotate(15deg);
}

.swiper-pagination-bullet-active {
  color: #061A22 !important;
  background: #16424E !important;
  border-color: #16424E !important;
}

.swiper-pagination-bullet-active::before, .swiper-pagination-bullet-active:hover::before {
  background-color: #061A22 !important;
}

.swiper-pagination-bullet {
  width: 1.85rem !important;
  height: 1.85rem !important;
}

.gradient-x-overlay-lg-dark-video::before {
	/* background-image: linear-gradient(to right,rgba(0, 0, 0, 0.935) 0,rgba(0, 0, 0, 0.975) 100%); */
	background-image: linear-gradient(to right,rgba(6, 26, 34, 0.905) 0,rgba(6, 26, 34, 0.985) 100%);
}

.form-control, .form-select{
  background-color: rgba(255, 255, 255, 0.02);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  color: white;
}

.form-control:focus, .form-select:focus{
  color: white;
}

.form-control:disabled {
	background-color: #1a0e0e3d;
	color: #ffffff7a;
}

.form-select > option{
  color: black;
}

.form-control:focus, .form-select:focus{
  background: rgba(255, 255, 255, 0.02);
}


.form-control-lg {
  font-size: 1.24rem;
}

.form-select-lg {
  font-size: 1.23rem;
}

.form-switch .form-check-input:not(:checked) {
  background-color: #3c4959;
} 

.w-80 {
  width: 80% !important;
}

.w-90 {
  width: 90% !important;
}

.w-95 {
  width: 95% !important;
}

.min-vh-cc-35 {
  min-height: 35vh;
}

.min-vh-cc-55 {
  min-height: 55vh;
}

.min-vh-cc-65 {
  min-height: 65vh;
}

.min-vh-cc-75 {
  min-height: 75vh;
}

.min-vh-cc-85 {
  min-height: 85vh;
}

.min-vh-cc-90 {
  min-height: 90vh;
}

.min-vh-cc-100 {
  min-height: 100vh;
}

.avatar-4xl {
	width: 12.3333333333rem!important;
/*	height:auto;*/
}

.avatar-showcase {
	width: 19rem !important;
	height:auto;
	
}

.start-30{
	left:30%;
}

.filepond--credits{
  display: none;
}

/*Navbar*/
.navbar-brand-logo{
  width:  15rem !important;
  max-width: 15rem !important;
}

/*Effects*/

.scale {
  transition: transform 0.3s ease-in-out; 
}

.scale:hover{
  scale:1.2;
}

.icon-option {
  cursor: pointer;
  padding: 10px;
  border-radius: 5px;
  margin: 5px;
  display: flex;
  align-items: center;
  transition: background-color 0.3s, transform 0.3s, border-color 0.3s;
  text-align: center;
}

.icon-option:hover {
  transform: scale(1.05);
  background-color: #f0f0f0;
}

.icon-option.selected {
  background-color: #ffffff1a;
  color: white;
  transform: scale(1.1);
}

.icon-option i {
  font-size: 1.5rem;
  transition: transform 0.3s;
}

.icon-option:hover i {
  transform: scale(1.2);
}

.icon-option:not(.selected) {
  transition: transform 0.3s, background-color 0.3s, border-color 0.3s;
}



/*Oneoffs*/
@media (max-width: 991.98px) {
  .navbar-expand-lg .navbar-collapse {
      background: rgba(255, 255, 255, 0.02);
  }
}

@media (min-width: 1600px) {
  .display-1 {
      font-size: 7rem;
  }
}

@media (min-width: 1800px) {
  .display-1 {
      font-size: 8rem;
  }
}

.elipsis{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.handle:hover{
  cursor: grab;
}

#modalLogo .cropper-view-box,
#modalLogo .cropper-face {
  border-radius: 50%;
}

.rotate-180 {
  transform: rotate(180deg);
  transition: transform 0.3s;
}

.collapseBtn {
  transition: transform 0.3s;
}

.collapseButton {
  color: #4E79BC;
}

.collapseButton:hover {
  color: #4E79BC;
}

/*Temporary Website Theme*/
:root{
  --color-primary: #4E79BC;
  --color-secondary: #0d1929;
  --color-accent: #0D1B2A;
  --color-highlight: #34BDBE;
  --color-text: #fff;
  --bg-base: #0D1C30;
}

#web.dark {
  /* Dark theme */
  --color-primary: #4E79BC;
  --color-secondary: #0d1929;
  --color-accent: #0D1B2A;
  --color-highlight: #34BDBE;
  --color-text: #fff;
  --bg-base: #0D1C30;
}

#web.light {
  /* Light theme */
  --color-primary: #F5F6F6;
  --color-secondary: #102335;
  --color-accent: #0d1929;
  --color-highlight: #34BDBE;
  --color-text: #000;
  --bg-base: #fff;
}


.color-web-primary {
  color: var(--color-primary) !important;
}

.color-web-secondary {
  color: var(--color-secondary) !important;
}

.color-web-accent {
  color: var(--color-accent) !important;
}

.color-web-highlight {
  color: var(--color-highlight) !important;
}

.color-web-text {
  color: var(--color-text) !important;
}

/**** Background ****/
.bg-web-primary {
  background-color: var(--color-primary) !important;
}

.bg-web-secondary {
  background-color: var(--color-secondary) !important;
}

.bg-web-accent {
  background-color: var(--color-accent) !important;
}

.bg-web-highlight {
  background-color: var(--color-highlight) !important;
}

.bg-web-base {
  background-color: var(--bg-base) !important;
}

.modal-header {
  background-color: var(--bg-base) !important;
  color: var(--color-text) !important;
}

/*Sass compiled*/
#web.dark {
  background-color: var(--bg-base);
}
#web.dark .dashboard .dashboard-card i, #web.dark .dashboard .dashboard-card p, #web.dark .dashboard .dashboard-card h3 {
  color: var(--color-text);
}
#web.dark .modal-dialog .modal-content {
  background: var( --bg-base);
}
#web.dark .modal-dialog .modal-header {
  background-color: var(--color-secondary);
}
#web.dark .modal-dialog .modal-header .card-header-title {
  color: var(--color-text);
}
#web.dark .modal-dialog .modal-body label,
#web.dark .modal-dialog .modal-body input:focus {
  color: var(--color-text);

}
#web.dark .modal-dialog .modal-body .file-attachment-input span {
  color: var(--color-text);
}
#web.dark .modal-dialog .modal-footer {
  background-color: var(--color-secondary);
}
#web.dark .card .card-header-title, #web.dark .card-glass .card-header-title {
  color: var(--color-text);
}
#web.dark .card label, #web.dark .card-glass label {
  color: var(--color-text);
}
#web.dark .table thead {
  background-color: var(--color-secondary);
}
#web.dark .table thead th {
  color: var(--color-text);
}
#web.dark .table tbody h5 {
  color: var(--color-text);
}
#web.dark .table tbody tr:nth-child(even) {
  background-color: var(--bg-base);
}
#web.dark .list-group .list-group-item {
  background-color: var(--bg-base);
}
#web.dark .list-group .list-group-item h6, #web.dark .list-group .list-group-item span {
  color: var(--color-text);
}
#web.dark #pricing .nav-link{
  color: white;
}
#web.dark #pricing .nav-link.active{
  background-color: var(--color-highlight);
  color: black;
}
#web.dark #tabs .nav-link{
  color: white;
  border-bottom: 1px solid gray;
}
#web.dark #tabs .nav-link.active{
  color: var(--color-primary);
  border-bottom: 1px solid var(--color-primary);
  background-color: transparent;
  box-shadow: none;
}


/*MiniWeb*/
:root {
  /* Light theme */
  --color-mw-primary: #F5F6F6;
  --color-mw-secondary: #102335;
  --color-mw-highlight: #34BDBE;
  --color-mw-text: #000;
  --color-mw-text-secondary: #fff;
  --bg-mw-base: #fff;
  --shadow-mw-color:#838485; 
  --hr-mw-color:#102335;

}

#miniweb.dark {
  /* Dark theme */
  --color-mw-primary: #0E2335;
  --color-mw-secondary: #F5F6F6;
  --color-mw-highlight: #34BDBE;
  --color-mw-text: #fff;
  --color-mw-text-secondary: #000;
  --color-mw-text-muted: #8c98a4 ;
  --bg-mw-base: #0D1C30;
  --shadow-mw-color:#00000096;
  --hr-mw-color:rgba(245, 246, 246, 0.3);
}

#miniweb.light {
  /* Light theme */
  --color-mw-primary: #F5F6F6;
  --color-mw-secondary: #102335;
  --color-mw-highlight: #34BDBE;
  --color-mw-text: #000;
  --color-mw-text-secondary: #fff;
  --color-mw-text-muted: #414345 ;
  --bg-mw-base: #fff;
  --shadow-mw-color:#838485; 
  --hr-mw-color:rgba(33,50,91,.1); 
}

/************************************************************************/
/**** Colors ****/
.color-mw-primary {
  color: var(--color-mw-primary)!important;
}

.color-mw-secondary {
  color: var(--color-mw-secondary)!important;
}

.color-mw-highlight {
  color: var(--color-mw-highlight)!important;
}

.color-mw-text {
  color: var(--color-mw-text)!important;
}

.color-mw-text-secondary {
  color: var(--color-mw-text-secondary) !important;
}

.color-mw-text-muted {
  color: var(--color-mw-text-muted) !important;
}

.color-mw-hr{
  color: var(--hr-mw-color) !important;
}

.color-mw-icon {
  color: var(--color-mw-text)!important;
}

.color-fa-pdf {
color: #ff2015;
}

.color-fa-doc {
color: #2a7cd3;
}

.color-fa-xls {
color: #1fa265;
}

.color-fa-ppt {
color: #d3512f;
}

.color-fa-zip {
color: #e2910e;
}

/**** Background ****/
.bg-mw-primary {
  background-color: var(--color-mw-primary)!important;
}

.bg-mw-secondary {
  background-color: var(--color-mw-secondary)!important;
}

.bg-mw-highlight {
  background-color: var(--color-mw-highlight)!important;
}

.bg-mw-base {
  background-color: var(--bg-mw-base)!important;
}

/* Buttons */
.primary-button-mw {
  color: var(--color-mw-primary);
  background-color: var(--color-mw-secondary);
}

.secondary-button-mw {
  color: var(--color-mw-secondary);
  background-color: var(--color-mw-primary);
}

/* Cards */
.card-secondary-mw {
  background-color: var(--color-mw-secondary);
  color: var(--color-mw-primary);
}

/* Accordion */
.accordion-button-mw {
  color: var(--color-mw-primary);
}

/*Contact Buttons*/
.contact-button {
  border: .3rem solid var(--bg-mw-base);
  background-color: var(--color-mw-primary);
  border-radius: 50%;
  padding: 1rem;
}

.shadow-sm {
  box-shadow: -1px 0rem 1rem 0px var(--shadow-mw-color) !important;
}

.shadow-lg {
  box-shadow: 0 0.125rem 1.5rem 0.1125rem var(--shadow-mw-color) !important;
}

@media (min-width: 768px) { 
  .miniweb-container{
      scrollbar-width: none;
  }
  .miniweb-container::-webkit-scrollbar {
      display: none;
  }
}


.mw-title{
  border-bottom: 3px solid #3699F4;
  padding-bottom: .5rem;
}


/* Animations */

@keyframes float {
	0% {
		transform: translatey(0px);
	}
	50% {
		transform: translatey(9%);
	}
	100% {
		transform: translatey(0px);
	}
}

@keyframes pulse {
	0% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.1);
	}
	100% {
		transform: scale(1);
	}
}

.floatEffect1{
  animation: float 7s ease-in-out infinite;
}
.floatEffect2{
  animation: float 6s ease-in-out infinite;
}
.floatEffect3{
  animation: float 5s ease-in-out infinite;
}
.floatEffect4{
  animation: float 4s ease-in-out infinite;
}

/* YT */
.play-button-overlay {
  position: relative;
  display: inline-block;
}

.play-button-overlay img {
  display: block;
}

.play-button-overlay::before {
  content: '\25B6'; 
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 3em; 
  pointer-events: none;
  z-index: 1;
}

.mw-cover{
  mask-image: linear-gradient(black, transparent);
}

.mw-logo-img-center{
  top: -4rem;
  overflow: hidden;
  border: 2px solid var(--color-mw-primary);
}

.mw-logo-img-left{
  top: -2rem;
  overflow: hidden;
  border: 2px solid var(--color-mw-primary);
}

.mw-logo-img-no-cover{
  margin-top: 3rem;
  overflow: hidden;
  border: 2px solid var(--color-mw-primary);
}

.videoGallery .media-viewer {
  position: relative;
  display: block;
  flex: 1 1 calc(50% - 10px);
  max-width: calc(50% - 10px);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  aspect-ratio: 1;
}

.popover-body {
  color: #212529;
  font-weight: semibold;
}

.color-mw-hr-blue {
  color: #5a90c4 !important;
}

.dash-link:hover {
  opacity: 0.8;
}

.pagination-dark {
	--bs-pagination-bg: #0d1929;
	--bs-pagination-active-bg: #2a3749;
	--bs-pagination-active-border-color: #2a3749;
	--bs-pagination-disabled-color: #383f46;
  	--bs-pagination-disabled-bg: #172231;
}

.profile-stats{
  display: flex;
  justify-content: start;
}

.alert-soft-helpers {
  color: #7ac1ff;
  background-color: rgba(126, 159, 221, 0.15);
}

@media (min-width: 1550px) { 
  .profile-stats{
    justify-content: space-between;
  }
}

/* Mosaic Grid Container */
.mosaic-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 10px; /* Adjust the gap between items as needed */
}

/* Mosaic Grid Items */
.mosaic-item {
  position: relative;
  overflow: hidden;
  border-radius: 0.5rem;
}

/* Image Styling */
.mosaic-item img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover; /* Ensure images cover the area */
}

/* Caption Container */
.caption-container {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
  color: white;
  padding: 0.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Caption Text */
.caption-text {
  flex-grow: 1;
  text-align: left;
}

/* Link Icon */
.caption-container a {
  color: white;
  text-decoration: none;
}

.rotate {
  transform: rotate(180deg);
  transition: transform 0.3s ease;
}
