@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@800&display=swap');


*{
  --primary-color: #085858;
  --secondary-color: #303030;
  --black: #000000;
  --latte-color: #8b1f0a;
  --Subheading-font: 'Roboto Condensed', sans-serif;
  --Subheading-font2: 'Roboto Mono', monospace;
  --Head-Text: 'Open Sans', sans-serif;

  
  --Qoutes: 'Libre Baskerville', serif;
  --Subheading-font: 'Arvo', serif;
  --type-writer: 'Space Mono', monospace;
  --Michroma: 'Michroma', sans-serif;
  --montserrat: 'Montserrat', sans-serif;
}

body{
  margin: 0;
  padding: 0;
  background-color: #085858;
}

.page-background {
  padding-top: 0px;
  padding-bottom: 0px;
  margin: 0;
  padding: 0;
  /*background: linear-gradient(to right, #e0dfdd, #fff, #e0dfdd) !important;*/
  color: #000;
}

.nav-bg {
  /* background: linear-gradient(to right, #169b9b, #42a1a1, #4dadad) !important;
  color: #fff;
  backdrop-filter: blur(30px);
  border-top: 1px solid rgba(0, 0, 0, 0.5);
  border-left: 1px solid rgba(0, 0, 0, 0.5);
  box-shadow: 20px 20px 50px solid rgba(0, 0, 0, 0.5);
  color: #000000; */

  color: var(--seconday-color);
  background-color: var(--seconday-color);
  background: rgba(255 255 255 / 0.2);
  backdrop-filter: blur(10px);
  border-top: 1px solid rgba(0, 0, 0, 0.5);
  border-left: 1px solid rgba(0, 0, 0, 0.5);
  box-shadow: 20px 20px 50px solid rgba(0, 0, 0, 0.5);
}

.nav-btn {
  margin-left: auto;
  padding-right: 2%;
}

.navbar{
  height: 70px;
}

.navbar-nav {
  display: flex;
  justify-content: flex-end;
}

.navbar-nav li {
  justify-content: flex-end;
}

.navbar-nav li a {
  /* color: #ffffff; */
  font-weight:600;
  /* font-size:medium; */
  
}

.userDropdown a:hover{
  transform: translateX(3px);
}

.dropdown-menu a {
  position: relative;
  border-top: 1px solid var(--primary-color);
}

.dropdown-menu li a {
font-style: normal;
font-weight: 400;
}

/* .dropdown-menu{
  background-color: #085858;
  border-radius: 0;
} */
.dropdown-menu li:first-child {
  border-top: none;
}

.dropdown-item:hover{
  background-color: #108888;
  overflow: hidden;
}

.dropdown-item{
  background-color: white;
  color: #000000;
  font-weight: 00;
}

.navbar-nav li a:hover {
  color: #ffffff;
}

.navbar-brand {
  margin-left: 1%;
}

.nav-image {
  width: 110px;
  padding-bottom: 15px;
  margin-top: 5px;
}

.page-header-font-color {
  color: #000;
}

.nav-image-tag {
  color: #ffffff;
  font-weight: bold;
  font-family: 'Roboto Slab', serif;
  font-style: normal;
  font-size: 25px;
}

.nav-link-font-color {
  color: #ffffff;
  font-size: 15px;
}

.nav-link.active, .dropdown-toggle.active {
  border-bottom: 2px solid #ffffff;
}

.nav-link-font-color:hover {
  color: #8d8989;
}

.profileName{
  min-width: 20rem;
}

.nav-link-font-color-profile {
color: #ffffff;
}

.dropdown-toggle {
  color: #fff;
}

.dropdown-toggle:hover {
  color: #e0d9d9;
}


/* NEW FOOTER */
.footer-content{
  padding: 0;
  margin: 0;
}

.footer{
  background: #085858;
  color:white;
  /* padding-left: 50px; */
  backdrop-filter: blur(30px);
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  border-left: 1px solid rgba(0, 0, 0, 0.5);
  box-shadow: 20px 20px 50px solid rgba(0, 0, 0, 0.5);
  
  .links{
    ul {list-style-type: none;}
    li a{
      color: white;
      transition: color .2s;
      &:hover{
        text-decoration:none;
        color:#4180CB;
        }
    }
  }  
  .about-company{
    i{font-size: 25px;}
    a{
      color:white;
      transition: color .2s;
      &:hover{color:#4180CB}
    }
  }

  .location{
    margin-top: 10px;
    display: flex;
    justify-content: center;
    a {
      text-decoration: none;
      color: white;
      font-weight: lighter;
      font-size:smaller;
      font-family: var(--Head-Text);
    }
    .address{
      justify-items: center;
      justify-content: center;
    }
  }

  .links {
    margin-top: 8px;
    .explore{
      font-size:smaller;
      font-weight: lighter;
      font-family: var(--Head-Text);
    }
  }

.links ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

/* .links ul li {
  align-content: center;
} */

/* .links ul li a{
  color: white;
} */
  .links ul li{
    display: flex;
    justify-content: center;
    align-content: center;
    color: white;
    transition: color .2s;
    text-decoration:none;
    padding-right: 6px;
    padding-left: 6px;
    background-color: #ffffff;
    border-radius: 50%;
    padding-bottom: 3px;
  }
  .links ul li:hover{
    background-color: #aaaaaa;
    /* fill: #4180CB; */
    transform: translateY(2px);
  }
}

.links ul li a svg{
  color: #ffffff;
}
/* li a svg:first-child {
  fill: #000000;
  transition: fill 0.3s;
} */

.links li:first-child:hover a svg {
  fill: #1900ff;
}
.links li:nth-child(2):hover a svg {
  fill: #c72121;
}
.links li:nth-child(3):hover a svg {
  fill: #000000;
}
.links li:nth-child(4):hover a svg {
  fill: #ffffff;
}
.links li:nth-child(5):hover a svg {
  fill: #104df5;
}
.links li:nth-child(6):hover a svg {
  fill: #000000;
}
.links li:last-child:hover a svg {
  fill: #ff2626;
}


/* END NEW FOOTER */

/* @keyframes logoAni {
  from {
    transform: translateX(-300px);
  }
  to {
    transform: translateX(0);
  }
} */
@keyframes logoAni {
	0% {
		animation-timing-function: ease-in;
		opacity: 1;
		transform: translateY(-45px);
	}

	24% {
		opacity: 1;
	}

	40% {
		animation-timing-function: ease-in;
		transform: translateY(-24px);
	}

	65% {
		animation-timing-function: ease-in;
		transform: translateY(-12px);
	}

	82% {
		animation-timing-function: ease-in;
		transform: translateY(-6px);
	}

	93% {
		animation-timing-function: ease-in;
		transform: translateY(-4px);
	}

	25%,
	55%,
	75%,
	87% {
		animation-timing-function: ease-out;
		transform: translateY(0px);
	}

	100% {
		animation-timing-function: ease-out;
		opacity: 1;
		transform: translateY(0px);
	}
}

.navbar-brand {
  animation: logoAni 2s ease 0s 1 normal forwards;
}

.form-group .font-bold{
  color: #1eda1e;
  font-style: normal;
}

@keyframes slideleft {
  from {
    transform: translateX(-300px);
  }
  to {
    transform: translateX(0);
  }
}

/* .accordion-content{
  animation: slideleft 0.400s ease-in;
}

@keyframes slideright {
  from {
    transform: translateX(300px);
  }
  to {
    transform: translateX(0);
  }
} */

.table-sid-data {
  animation: slideright 0.400s ease-in;
}

.table-sid-data span{
  font-weight: bold;
}

/* AutoDropdown setup */
.dropdown:hover>.dropdown-menu {
  display: block;
}

.dropdown>.dropdown-toggle:active {
    pointer-events: none;
}