/* Shared */
.button {
  border-radius: 100px;
}

/* Chat Inputs override */
.chatinput {
  border: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #FFFFFF !important;
  border-bottom: 2px solid #404040 !important;
  caret-color: #FFF;
}

input[disabled] {
  color: #6c6c6d !important;
  cursor: not-allowed !important;
}

/* Scrollbar override */
* {
  scrollbar-width: thin;
  scrollbar-color: #404040 #000000;
}

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
  width: 6px;
}

*::-webkit-scrollbar-track {
  background: #000000;
  border-radius:5px;
}

*::-webkit-scrollbar-thumb {
  background-color: #404040;
  border-radius: 2.5px;
  border: 0px;
}

/* Sections */
.section {
  padding: 1rem 0 0 0;
  text-align: center;
}
.section-heading,
.section-description {
  margin-bottom: 1.2rem;
}

/* Categories */
.categories {
  background-color: #465261;
  background-size: cover;
  color: #fff;
}
.categories .section-description { 
  margin-bottom: 4rem;
}

.w3-card, .w3-card-2 {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)
}

/* Bigger than 550 */
@media (min-width: 550px) {
  .section {
    /*padding: 12rem 0 11rem;*/
    padding: 20rem 0 19rem;
  }
  .category {
    border-radius: 5px !important;
  }
  .w3-card {
    border-radius: 5px !important;
  }
  #livestream {
    border-radius: 5px !important;
  }
}

/* Bigger than 750 */
@media (min-width: 750px) {
  .section {
    /*padding: 14rem 0 15rem;*/
    padding: 20rem 0 19rem;
  }
  .section-description {
    max-width: 60%;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Bigger than 1000 */
@media (min-width: 1000px) {
  .section {
    padding: 20rem 0 19rem;
  }
}