/* Animated Gradient Background */
.animated-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, #FFFDFC, #000000, #00b3ff);
    background-size: 400% 400%;
    animation: gradientAnimation 10s ease infinite;
  }
  
  /* Gradient Animation */
  @keyframes gradientAnimation {
    0% {
      background-position: 0% 50%;
    }
    50% {
      background-position: 100% 50%;
    }
    100% {
      background-position: 0% 50%;
    }
  }
  
  :root {
    font-family: 'Georgia', 'Times New Roman', serif;
    font-size: 14px;
    
}

.logo-white{
  filter: invert(28%) sepia(21%) saturate(856%) hue-rotate(213deg) brightness(94%) contrast(86%);
}
.logo-purple{
  filter: invert(28%) sepia(21%) saturate(856%) hue-rotate(213deg) brightness(94%) contrast(86%);
}

body {
    background-color: #fff7f3;
    color: #005887;
}


.bg-myNav {
  background-color: #fff7f3 ;
  border-bottom: #e6d7d0 solid 1px;
  color: #534B6F;
}

.bg-myPurple{
  background-color: #534B6F ;
  color: white;
}
.bg-myDarkPurple{
  background-color: #2a2638 ;
  color: white;
}
.border-myDarkPurple{
  border-color: #110f16;
}

.bg-My-Darker-Tan {
  background-color: #ffefe7;
}
.bg-My-Tan {
  background-color: #fff7f3 ;
}
.bg-myFooter {
  background-color: #fff7f3 ;
  border-top: #e6d7d0 solid 1px;
  color: #534B6F;
}

input.tan {
  -webkit-text-fill-color: #5a5451;
  transition: background-color 5000s ease-in-out 0s;
  
}
input.tan:focus {
  -webkit-text-fill-color: #5a5451; 
  color: #5a5451;
  background-color: #e6d7d0 !important;
  -webkit-box-shadow: 0 0 0px 1000px #e6d7d0 inset !important;
}



.extend-tan-up {
  -webkit-box-shadow: 0 -15px 0px #fff7f3 !important;

}

.extend-tan-down {
  -webkit-box-shadow: 0 20px 0px #fff7f3 !important;
}

.extend-purple-down {
  -webkit-box-shadow: 0 5px 0px #534B6F !important;
}

.extend-purple-up {
  -webkit-box-shadow: 0 -10px 0px #534B6F !important;
}

footer {
  position: relative; 
}