﻿.green {
  color: rgb(94, 151, 50);
}

.black {
  color: rgb(30, 30, 30);
}

.white {
  color: rgb(255, 255, 255);
}

.grey {
  color: rgb(199, 199, 199);
}

.red {
  color: rgb(255, 0, 0);
}

.blue {
  color: rgb(37, 61, 91);
}

body {
  font-family: "Gotham SSm A", "Gotham SSm B", Arial, Helvetica, sans-serif;
  color: rgb(30, 30, 30);
}

h1 {
  font-size: 3rem;
  background-color: rgb(30, 30, 30);
  color: rgb(255, 255, 255);
  line-height: 1;
  margin: 0;
  padding: 0;
}

h2 {
  font-size: 2rem;
  background-color: rgb(143, 143, 143);
  color: rgb(30, 30, 30);
}

.navbar-expand-lg .navbar-nav .dropdown-menu {
  z-index: 1021;
}

#footer {
  padding-top: 1rem;
}

#community, #finishes, #finish-category, #home {
  /*h1 { position:sticky; top:0; z-index:1020;}*/
}
#community #header, #finishes #header, #finish-category #header, #home #header {
  background: rgb(30, 30, 30);
  color: rgb(255, 255, 255);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 1020;
}
#community #header #display-toggle, #finishes #header #display-toggle, #finish-category #header #display-toggle, #home #header #display-toggle {
  font-size: 2rem;
  padding-right: 0.5rem;
}
#community #header a.btn, #community #header a.btn:visited, #finishes #header a.btn, #finishes #header a.btn:visited, #finish-category #header a.btn, #finish-category #header a.btn:visited, #home #header a.btn, #home #header a.btn:visited {
  color: rgb(255, 255, 255);
  font-size: 2rem;
  padding: 0;
}
#community h2, #finishes h2, #finish-category h2, #home h2 {
  position: sticky;
  top: 3rem !important;
  z-index: 1019;
}
#community table thead, #finishes table thead, #finish-category table thead, #home table thead {
  position: sticky;
  top: 5rem !important;
  z-index: 1018;
}
#community table td:has(img), #finishes table td:has(img), #finish-category table td:has(img), #home table td:has(img) {
  width: 300px;
}
#community table img, #finishes table img, #finish-category table img, #home table img {
  width: 300px;
  max-width: 100%;
}
#community table .no-image, #finishes table .no-image, #finish-category table .no-image, #home table .no-image {
  width: 150px;
  height: 150px;
  background: rgb(255, 255, 255);
  color: rgb(199, 199, 199);
  font-size: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 1rem auto;
}
#community .grid, #finishes .grid, #finish-category .grid, #home .grid {
  display: none;
  gap: 1rem;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 1fr;
  margin-bottom: 1rem;
}
#community .grid .grid-item, #finishes .grid .grid-item, #finish-category .grid .grid-item, #home .grid .grid-item {
  border: 1px solid rgb(241, 241, 241);
}
#community .grid img, #finishes .grid img, #finish-category .grid img, #home .grid img {
  width: auto;
  max-width: 100%;
  height: 300px;
  max-height: 100%;
  margin: 1rem auto;
  display: block;
}
#community .grid .no-image, #finishes .grid .no-image, #finish-category .grid .no-image, #home .grid .no-image {
  width: 300px;
  height: 300px;
  background: rgb(255, 255, 255);
  color: rgb(199, 199, 199);
  font-size: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 1rem auto;
}
#community .grid table tr:last-of-type th, #community .grid table tr:last-of-type td, #finishes .grid table tr:last-of-type th, #finishes .grid table tr:last-of-type td, #finish-category .grid table tr:last-of-type th, #finish-category .grid table tr:last-of-type td, #home .grid table tr:last-of-type th, #home .grid table tr:last-of-type td {
  border-bottom: none;
}
#community .no-spec, #finishes .no-spec, #finish-category .no-spec, #home .no-spec {
  font-style: italic;
  color: #ccc;
  margin-bottom: 1rem;
}

#communities ul {
  width: 100%;
  display: flex;
  align-items: center;
  padding: 8vh 8vw;
  min-height: 76vh;
  flex-direction: column;
  list-style: none;
}
#communities ul li {
  padding: 0.5rem;
}
#communities ul li a, #communities ul li a:visited {
  color: rgb(94, 151, 50);
  font-size: 2rem;
}
#communities ul li a:hover, #communities ul li a:visited:hover {
  color: rgb(67.7641791045, 108.8552238806, 36.0447761194);
}

#finish-category table thead {
  top: 3rem !important;
}

#home ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-flow: row;
  height: calc(100vh - 9rem); /*display:grid; grid-template-columns:1fr 1fr;*/
}
#home ul li {
  margin: 0;
  padding: 0;
  width: 100%;
}
#home ul li a {
  color: rgb(255, 255, 255);
  font-size: 3rem;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 900;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  -webkit-text-stroke: 0.15rem rgb(30, 30, 30);
  text-stroke: 0.15rem rgb(30, 30, 30);
}
#home ul li a::after {
  position: absolute;
  height: 100%;
  width: 100%;
  bottom: 0;
  left: 0;
  background: red;
}
#home ul li a:hover {
  -webkit-text-stroke: 0.25rem rgb(94, 151, 50);
  text-stroke: 0.25rem rgb(94, 151, 50);
}
#home ul li:first-of-type {
  background: rgb(143, 143, 143) url(/img/communities.jpg) no-repeat center center/cover;
}
#home ul li:last-of-type {
  background: rgb(227, 227, 227) url(/img/interiors.jpg) no-repeat center center/cover;
}
#home ul li:last-of-type a {
  -webkit-text-stroke: 1px solid rgb(30, 30, 30);
}

@media only screen and (max-width: 992px) {
  #home ul {
    flex-direction: column;
  }
}
