@import url("https://fonts.googleapis.com/css?family=Prata&display=swap");

html {
  scroll-behavior: smooth;
}

/* width */
::-webkit-scrollbar {
  width: 0px;
}

body {
  background-color: #000;
  color: rgb(255, 255, 255);
  overflow-x: hidden;
  font-family: "Prata", Serif;
  width: 100vw;
}

*,
*:after,
*:before {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
  border: 0 none;
  position: relative;
  outline: none;
}

a {
  color: #bf74dd;
}

a:hover {
  color: #cf2247;
  text-decoration: none;
}

span.main {
  color: #ce5684;
}

.modal-content {
  background-color: #121212;
}

@media (min-width: 576px) {
  .modal-dialog {
    max-width: 750px;
    margin: 1.75rem auto;
  }
}

@media only screen and (max-width: 764px) {
  .mobile-hide {
    display: none;
  }

  .mobile-center {
    text-align: center !important;
  }

  .carbox {
    height: 200px;
  }

  .mm-5 {
    margin-top: 1rem;
  }
}

@media only screen and (min-width: 764px) {
  .m-h-100 {
    height: 100%;
  }
}

.form-control {
  background-color: #000;
  color: #ebebeb;
  border: 1px solid #b027e6;
  border-radius: 0;
}

.form-control:focus {
  color: #ebebeb;
  background-color: #000;
  border-color: #9a27e6;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgb(230 110 39 / 25%);
}

.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-primary.dropdown-toggle:focus,
.btn-primary.focus,
.btn-primary:focus {
  box-shadow: 0 0 0 0.2rem rgb(230 110 39 / 50%);
}

/**********************************************

                SECTION STYLING

**********************************************/

.section-title {
  margin-top: 5rem;
}

.section-title h6 {
  font-size: 28px;
}

.section-title p {
  font-size: 24px;
}

.user-info {
  margin-top: 2rem;
}

.user-info a {
  color: #ffff;
}

.info-cont a.nb {
  text-decoration: underline;
}

.btn-primary {
  color: #fff;
  background-color: #000;
  border: 1px solid #d15bc1;
  border-radius: 0;
}

.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle,
.btn-primary.bg-transparent:hover {
  color: rgb(0, 0, 0);
  background-color: #cf22c1 !important;
  border-color: #cf22a4;
}

.invite-btn {
  background-color: transparent;
  color: white;
  font-size: 1.5rem;
  cursor: pointer;
}

.invite-btn:focus,
.invite-btn:active {
  border: none;
  outline: none;
}

.table {
  border: 1px solid #822499;
}

span.admin {
  color: rgb(255, 171, 234);
  text-shadow: 0 0 5px rgb(255, 171, 234);
}

.table td,
.table th {
  border: none;
  vertical-align: middle;
}

.admin-con {
  padding: 30px;
  border: 3px solid #ee78e8;
  box-shadow: 0 0 9px #e27ecc;
}

.breadc h4 {
  position: absolute;
  text-align: center;
  top: 20px;
  color: #dd41c8;
  z-index: 99;
  width: 100%;
  font-size: 18px;
}

.default-user{
  color:#4da6ff;
  text-shadow:0 0 6px rgba(77,166,255,.5);
}

.admin-role{
  color:#ffabea;
  text-shadow:0 0 6px rgba(255, 171, 234,.6);
}

/**********************************************

                    DIVIDER

**********************************************/

footer {
  text-transform: uppercase;
}

footer a {
  color: #38ff00;
  transition: color ease-in-out 0.3s;
}

footer a:hover {
  color: #80b2e4;
}