html, body {
  background-color: #2f2b2f;
  width: 100%;
  font-family: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

h1, h2, h3, h4, h5, h6 {
  color: #fff;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 2rem;
}

a {
  text-decoration: none;
}

p {
  color: #fff;
}

#dist-btn {
  color: #FF875F !important;
  border-color: #FF875F!important;
      box-shadow: 0 0 0 0.1rem #FF875F;
}
#dist-btn:hover {
  color: #2f2b2f !important;
  background-color: #FF875F;
}

#wrk-btn {
  color: #ff1f5c !important;
  border-color: #ff1f5c !important;
      box-shadow: 0 0 0 0.1rem #ff1f5c;
}
#wrk-btn:hover {
  color: #2f2b2f !important;
  background-color: #ff1f5c;
}

#bomb-btn {
  color: #24FF1F !important;
  border-color: #24FF1F !important;
      box-shadow: 0 0 0 0.1rem #24FF1F;
}
#bomb-btn:hover {
  color: #2f2b2f !important;
  background-color: #24FF1F;
}

#havoc-btn {
  fill: #5160b7 !important;
  border-color: #5160b7 !important;
      box-shadow: 0 0 0 0.1rem #5160b7;
}
#havoc-btn:hover {
  fill: #2f2b2f !important;
  background-color: #5160b7;
}

#fl3x-btn {
  fill: #00ff04 !important;
  border-color: #00ff04 !important;
      box-shadow: 0 0 0 0.1rem #00ff04 ;
}
#fl3x-btn:hover {
  fill: #2f2b2f !important;
  background-color: #00ff04;
}

#cert-btn {
  fill: #ff00cb !important;
  border-color: #ff00cb !important;
      box-shadow: 0 0 0 0.1rem #ff00cb ;
}
#cert-btn:hover {
  fill: #2f2b2f !important;
  background-color: #ff00cb;
}

#burp-btn {
  fill: #f63 !important;
  border-color: #f63 !important;
      box-shadow: 0 0 0 0.1rem #f63;
}
#burp-btn:hover {
  fill: #2f2b2f !important;
  background-color: #f63;
}

#phish-btn {
  fill: #3e7acc !important;
  border-color: #3e7acc !important;
      box-shadow: 0 0 0 0.1rem #3e7acc;
}
#phish-btn:hover {
  fill: #2f2b2f !important;
  background-color: #3e7acc;
}

#websoc-btn {
  fill: #9d002b !important;
  border-color: #9d002b !important;
      box-shadow: 0 0 0 0.1rem #9d002b;
}
#websoc-btn:hover {
  fill: #2f2b2f !important;
  background-color: #9d002b;
}

#wall-btn {
  fill: #04AA00 !important;
  border-color: #04AA00 !important;
      box-shadow: 0 0 0 0.1rem #04AA00;
}
#wall-btn:hover {
  fill: #2f2b2f !important;
  background-color: #04AA00;
}

.selected {
  background-color: #9315b7;
}

.avatar {
  width: 15rem;
  height: 15rem;
  margin-right: 2rem;
  border-radius: 50%;
  border-style: solid;
  border-width: thick;
  border-color: #9315b7
}

.header {
  margin-bottom: 0px;
  font-size: 3rem;
}

.btn-small {
  color: #9315b7 !important;
  border-color: #9315b7;
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 0.050rem solid transparent;
  padding: 0.175rem 0.75rem;
  line-height: 1.5;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  box-shadow: 0 0 0 0.15rem #9315b7;
  margin-top: 25px;
  margin-right: 10px;
}

.btn {
  color: #9315b7 !important;
  border-color: #9315b7;
  display: inline-block;
  font-weight: 400;
  text-align: center;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 0.125rem solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1.5rem;
  line-height: 1.5;
  border-radius: 0.5rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  box-shadow: 0 0 0 0.2rem #9315b7;
  margin-top: 25px;
  margin-right: 25px;
}

.btn:hover {
  color: #2f2b2f !important;
  background-color: #9315b7;
}

.title {
  display: grid;
}

.copyright_fixed {
  position: fixed;
  bottom: 0px;
  left: 0px;
  right:0px;
}

.containd_border {
  margin-top: 1rem;
  margin-bottom: 5rem;
  border: 1px solid #9315b7;
}

.social_button {
  margin-right: 10px;
}

#root {
  margin: auto;
  width: 80%;
  margin-top: 15%;
  margin-bottom: 10%;
  padding: 10px;
  display: list-item;
}

#header {
  display: flex;
}

#subheading {
  margin-bottom: 0px;
}

#social {
  color: #9315b7;
  display: flex;
  font-size: 2rem;
}

.light_hr {
  border-top: 0.125rem solid rgba(255, 255, 255, 0.1)
}
