html,
body,
button,
input,
select,
optgroup,
textarea {
  color: #637381;
}

.w3-border {
  border: 1px solid #d3d8dd !important;
}

.w3-hover-over:hover,
.w3-button:hover {
  color: #637381 !important;
  background-color: #e6e9ec !important;
}

.fa,
.svg-inline--fa {
  color: inherit;
}

#header,
#copyright,
.close-nav,
.mobile-nav,
#page-title,
#highlighted,
.page-wrapper,
#footer-menu,
#top-container,
#main-container,
#bottom-container,
#footer-container,
.search-slide-wrapper,
.main-navigation-wrapper,
#top-container .top-box > div,
#footer-container .footer-box>div,
#bottom-container-inner .bottom-box>div {
  background-color: white;
  color: #637381;
}

/* 8f9da9 */

/* button animation  */
@keyframes btnBorderAnimation {
  0% {
    width: 0;
    height: 0;
    border-bottom-color: #8f9da9;
  }

  99.9999% {
    width: 100%;
    height: 100%;
    border-bottom-color: #8f9da9;
  }

  100% {
    width: 0;
    height: 0;
    border-bottom-color: transparent;
  }

}

@keyframes borderLeftColors {
  0% {
    width: 0;
    height: 0;
    border-top-color: #8f9da9;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

  50% {
    width: 100%;
    height: 0;
    border-top-color: #8f9da9;
    border-right-color: #8f9da9;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

  66% {
    width: 100%;
    height: 100%;
    border-top-color: #8f9da9;
    border-right-color: #8f9da9;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

  99.9999% {
    width: 100%;
    height: 100%;
    border-top-color: #8f9da9;
    border-right-color: #8f9da9;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

  100% {
    width: 0;
    height: 0;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

}

@keyframes borderRightColors {
  0% {
    width: 0;
    height: 0;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: #8f9da9;
    border-left-color: transparent;
  }

  50% {
    width: 100%;
    height: 0;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: #8f9da9;
    border-left-color: #8f9da9;
  }

  66% {
    width: 100%;
    height: 100%;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: #8f9da9;
    border-left-color: #8f9da9;
  }

  99.9999% {
    width: 100%;
    height: 100%;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: #8f9da9;
    border-left-color: #8f9da9;
  }

  100% {
    width: 0;
    height: 0;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

}