/* Font and Background Color */
body {
    background-color: var(--color6) ;
    font-family: Verdana, sans-serif;
  }
h1 h2 h3 h4 h5 h6 {
  font-family: Georgia, serif;
}

/* Navbar  */
/* change the background color */
.navbar-custom {
  background-color: var(--color3);
}
/* change the brand and text color */
.navbar-custom .navbar-brand,
.navbar-custom .navbar-text,
.navbar-custom .nav-item:visited .nav-link {
  color: var(--color5);
}

/* change the link color */
.navbar-custom .navbar-nav .nav-link {
  color: var(--color5);
}

/* change the color of active or hovered links */
.navbar-custom .nav-item:focus .nav-link,
.navbar-custom .nav-item:hover .nav-link {
  color: var(--color6);
}

/* change the color of active or hovered links */
.navbar-custom .navbar-brand:focus,
.navbar-custom .navbar-brand:hover {
  color: var(--color6);
}

.navbar-custom .navbar-brand.active,
.navbar-custom .nav-item.active .nav-link {
  color: var(--color4);
}

/* for dropdowns only */
.navbar-custom .navbar-nav .dropdown-menu {
  background-color: var(--color4);
}

/* dropdown item text color */
.navbar-custom .navbar-nav .dropdown-item {
  color: var(--color1);
}

/* dropdown item hover or focus */
.navbar-custom .navbar-nav .dropdown-item:hover,
.navbar-custom .navbar-nav .dropdown-item:focus {
  color: var(--color3);
  background-color: var(--color5);
}

.navbar-toggler{
  /* outline: 1px solid var(--color5); */
  box-shadow: 0 0 1px var(--color5);
}



/* Background text */
p.backgroundinfo{
  text-align: justify;
}
.intro-line{
  border-bottom-width: thin;
  border-bottom-style: solid;
  border-bottom-color: var(--color5);
}

/* Profile links */
a.profile:link {
  color: var(--color1)
}
a.profile:hover,
a.profile:focus {
  color: var(--color3)
}
a.profile:visited {
  color: var(--color4)
}

/* Category Tiles */
a.hometile{
  text-decoration: none;
}
.container{
  flex-wrap: wrap
}
.shadow{
  background-color: var(--color4)
}
.shadow:hover{
  background-color: var(--color5)
}
/* X-Large or larger */
@media screen and (min-width: 992px) {
  h3.homebox{
    color: var(--color2);
    font-size: 40px; 
  }
}
/* Large or smaller */
@media screen and (max-width: 992px) {
  h3.homebox{
    color: var(--color2);
    font-size: 30px; 
  }
}
/* Medium or smaller */
@media screen and (max-width: 768px) {
  h3.homebox{
    color: var(--color2);
    font-size: 20px; 
  }
}
/* Small or smaller */
@media screen and (max-width: 576px) {
  h3.homebox{
    color: var(--color2);
    font-size: 30px; 
  }
}
.padding-0{
  padding-right:0;
  padding-left:0;
  padding-bottom:5px;
}
.padding-left{
  padding-right:0;
  padding-left:20px;
  padding-bottom:5px;
}
.padding-right{
  padding-right:20px;
  padding-left:0;
  padding-bottom:5px;
}
.padding-middle{
  padding-right:7px;
  padding-left:7px;
  padding-bottom:5px;
}
.icon-span{
  font-size: 10vw; 
  color: var(--color3)
}
.neg-top-pad{
  margin-top:-60px;
}