body {
  margin: 0;
  padding: 0;
  background-color: #161616;
  width: 100%;
  position: relative;
  font-family: "Roboto", sans-serif;
}

* {
  box-sizing: border-box;
}

@font-face {
  font-family: "br-bold";
  src: url("../fonts/Brandon_bld.otf");
}
@font-face {
  font-family: br-blk;
  src: url("../fonts/Brandon_blk.otf");
}
@font-face {
  font-family: "br-med";
  src: url("../fonts/Brandon_med.otf");
}
@font-face {
  font-family: "br-reg";
  src: url("../fonts/Brandon_reg.otf");
}
@font-face {
  font-family: br-reg-it;
  src: url("../fonts/Brandon_reg_it.otf");
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.logo-main {
  position: absolute;
  top: 20px;
  left: 20px;
  width: 101px;
}

::-webkit-input-placeholder {
  font-size: 16px;
  color: #fff;
  text-transform: uppercase;
}

:-ms-input-placeholder {
  font-size: 16px;
  color: #fff;
  text-transform: uppercase;
}

::placeholder {
  font-size: 16px;
  color: #fff;
  text-transform: uppercase;
  font-weight: 400;
  font-family: "br-reg";
  opacity: 0.7;
}

.login-section {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100vh;
}

.login-section .login-box {
  max-width: 386px;
  background-color: #110238;
  padding: 50px;
  opacity: 0.6;
}

.login-section .login-box input {
  border: solid 1px #cbd50d;
  background-image: linear-gradient(103deg, #2d2255, #2d2255);
  width: 100%;
  margin-bottom: 20px;
  padding: 10px 15px;
  color: #fff;
  font-size: 16px;
}

.login-section .login-box .remember-box label::before {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  border: solid 1px #d0d0d0;
  background-color: #5600ff;
  border-radius: 100%;
  display: inline-block;
  left: 0;
}

.login-section .login-box .remember-box input {
  opacity: 0;
  margin: 0;
  height: 0;
  width: 0;
}

.login-section .login-box .remember-box label {
  font-family: "br-reg";
  font-size: 16px;
  text-align: center;
  color: #ffffff;
  text-transform: uppercase;
  opacity: 0.7;
  vertical-align: bottom;
  position: relative;
  padding-left: 30px;
  cursor: pointer;
}

.login-section .login-box .remember-box {
  margin-bottom: 20px;
}

.login-section .login-box .remember-box input:checked + label::after {
  position: absolute;
  content: "";
  background-color: #eae339;
  width: 20px;
  height: 20px;
  border-radius: 100%;
  left: 2px;
  top: 2px;
}

.login-section .login-box .submit-btn {
  width: 56px;
  height: 56px;
  border: solid 1px #cbd50d;
  border-radius: 100%;
  outline: none;
  float: right;
  margin-right: -30px;
  margin-bottom: 0;
  position: relative;
  color: #cbd50d;
  font-size: 30px;
  padding: 0;
}

.submit-btn:focus {
  background-image: linear-gradient(to bottom, #fb56b5e0, #2c0dd5) !important;
}

.settings-menu {
  position: absolute;
  top: 25px;
  right: 134px;
  padding: 12px 10px;
  box-shadow: 0 10px 17px 0 rgba(0, 0, 0, 0.23);
  border-style: solid;
  border-width: 1px;
  border-image-source: linear-gradient(135deg, #4900ff, #9c86fb);
  border-image-slice: 1;
  background-color: #212121;
  z-index: 1;
}

.settings-menu .setting-icon {
  text-align: right;
}

.settings-menu .setting-icon img {
  cursor: pointer;
}

.settings-menu ul {
  padding-left: 0;
  margin-bottom: 0;
  margin-top: 5px;
}

.settings-menu ul li {
  margin-bottom: 10px;
  list-style: none;
}

.settings-menu ul li:last-child {
  margin-bottom: 0;
}

.settings-menu ul li a {
  background-color: #5600ff;
  padding: 7px;
  font-family: "br-reg";
  font-size: 14px;
  text-align: center;
  color: #ffffff !important;
  display: block;
  cursor: pointer;
  text-decoration: none;
  width: 240px;
}

.settings-menu ul li a:hover {
  color: #9c86fb;
}

.heading-main {
  font-family: "br-bold";
  font-size: 68px;
  font-weight: bold;
  color: #9c86fb;
  margin: 0;
  text-transform: uppercase;
  padding-top: 100px;
}

.heading-two {
  font-family: "br-bold";
  font-size: 40px;
  color: #ffffff;
  margin-top: 60px;
  margin-bottom: 20px;
}

.event-add-up {
  border: solid 1px #9c86fb;
  padding: 30px;
}

.event-add-up form {
  display: flex;
  flex-wrap: wrap;
}

.event-add-up .form-input {
  flex-basis: 28%;
  padding: 10px;
}

.event-add-up .submit-input {
  flex-basis: 16%;
  text-align: right;
  align-self: center;
}

.event-add-up input {
  width: 100%;
  border: solid 1px #d0d0d0;
  background-color: #2a2a2a;
  padding: 10px 15px;
  color: #fff;
  font-size: 16px;
}

.event-add-up .submit-btn {
  width: 56px;
  height: 56px;
  border: solid 1px #cbd50d;
  border-radius: 100%;
  outline: none;
  color: #cbd50d;
  font-size: 30px;
  padding: 0;
  cursor: pointer;
}

.upcoming-events .events-main {
  display: flex;
  flex-wrap: wrap;
}

.upcoming-events .events-main .event1 {
  flex-basis: 49%;
  padding: 10px 10px 10px 0px;
  background-image: linear-gradient(132deg, #2c1a4d, #22194c);
  padding: 20px;
  margin-right: 2%;
  margin-bottom: 20px;
}

.upcoming-events .events-main .event1:nth-child(even) {
  margin-right: 0;
}

.upcoming-events .events-main .event1 h3 {
  font-family: "br-bold";
  font-size: 30px;
  margin: 0;
  color: #9c86fb;
  cursor: pointer;
}

.upcoming-events .events-main .event1 h4 {
  font-family: "br-med";
  font-size: 20px;
  margin: 0;
  color: #fff;
  padding: 10px 0;
}

.upcoming-events .events-main .event1 .actions-event {
  text-align: right;
}

.upcoming-events .events-main .event1 .actions-event a {
  opacity: 0.41;
  font-family: "br-reg";
  font-size: 15px;
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
}

.upcoming-events .events-main .event1 .actions-event span {
  color: #ffffff;
  opacity: 0.41;
  vertical-align: text-bottom;
}

.online-view {
  box-shadow: 0 10px 17px 0 rgba(0, 0, 0, 0.23);
  border-style: solid;
  border-width: 1px;
  border-image-source: linear-gradient(132deg, #4900ff, #9c86fb);
  border-image-slice: 1;
  background-color: #212121;
  position: absolute;
  right: 50px;
  top: 25px;
  width: 53px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.online-view .yellow-btn {
  width: 15px;
  height: 15px;
  border-radius: 100%;
  box-shadow: 0 2px 11px 0 #cbd50d;
  background-color: #cbd50d;
}

.events-setup-section p {
  font-family: "br-reg";
  font-size: 25px;
  font-weight: bold;
  color: #fff;
}

.event-setup-main {
  display: flex;
  flex-wrap: wrap;
}

.event-setup-main .event-box {
  flex-basis: 31.3%;
  margin: 1%;
  background-color: #3000ff;
  padding: 40px;
}

.event-setup-main .event-box h3 {
  font-family: "br-bold";
  font-size: 27px;
  font-weight: bold;
  color: #9c86fb;
  margin: 0;
}

.event-setup-main .event-box .colors-circles {
  display: flex;
  flex-wrap: wrap;
  margin-top: 30px;
}

.event-setup-main .event-box .colors-circles .big {
  flex-basis: 77%;
  padding-right: 2%;
}

.event-setup-main .event-box .colors-circles .small {
  flex-basis: 23%;
}

.event-setup-main .event-box .colors-circles .big .circlebig {
  background-color: red;
  width: 200px;
  height: 200px;
  border-radius: 100%;
  cursor: pointer;
  border: 1px solid #000;
}

.event-setup-main .event-box .colors-circles .small .purple {
  background-color: #9c86fb;
  width: 60px;
  height: 60px;
  border-radius: 100%;
  margin-bottom: 10px;
  cursor: pointer;
}

.event-setup-main .event-box .colors-circles .small .white {
  background-color: #fff;
  width: 60px;
  height: 60px;
  border-radius: 100%;
  margin-bottom: 10px;
  cursor: pointer;
}

.event-setup-main .event-box .colors-circles .small .yellow {
  background-color: #cbd50d;
  width: 60px;
  height: 60px;
  border-radius: 100%;
  margin-bottom: 10px;
  cursor: pointer;
}

.event-setup-main .event-box.upload-logo .file-upload {
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  height: 100%;
}

.event-setup-main .event-box.upload-logo input[type=file] {
  display: block;
  opacity: 0;
  text-align: center;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.event-setup-main .event-box.upload-logo .file-upload .file-up {
  position: relative;
}

.event-setup-main .advertisement .banner-ads {
  margin-top: 30px;
}

.event-setup-main .advertisement .banner-ads .upload-ad {
  display: flex;
  flex-wrap: wrap;
  border: solid 1px #fff;
  padding: 10px;
}

.event-setup-main .advertisement .banner-ads .upload-ad .name {
  flex-basis: 75%;
}

.event-setup-main .advertisement .banner-ads .upload-ad .add-up {
  flex-basis: 25%;
}

.event-setup-main .advertisement .banner-ads h4 {
  font-size: 18px;
  color: #fff;
  font-weight: 600;
  margin: 0;
}

.event-setup-main .advertisement .banner-ads p {
  font-size: 14px;
  color: #fff;
  font-weight: 400;
  margin: 0;
}

.event-setup-main .advertisement .banner-ads .file-up {
  text-align: center;
  position: relative;
}

.event-setup-main .advertisement .banner-ads .file-up img {
  width: 50%;
}

.event-setup-main .advertisement .banner-ads .upload-ad .add-up input[type=file] {
  display: block;
  opacity: 0;
  text-align: center;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.event-setup-main .advertisement .banner-ads .placement-ad {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1 {
  padding: 5px;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1.time {
  flex-basis: 30%;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1.time input {
  width: 40px;
  height: 30px;
  background-color: transparent;
  color: #fff;
  padding: 5px;
  border: 1px solid #fff;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1.norotation {
  flex-basis: 40%;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1.rotate {
  flex-basis: 30%;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1 label {
  padding-left: 25px;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1.time label {
  padding-left: 10px;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1 input[type=text] {
  width: 30px;
  height: 25px;
  border: 1px solid #fff;
  background-color: transparent;
  color: #fff;
  margin-top: 5px;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1 label {
  font-size: 11px;
  color: #fff;
  font-weight: 400;
  margin: 0;
  position: relative;
  display: inline-block;
  font-family: "br-reg";
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1 input[type=checkbox] {
  opacity: 0;
  margin: 0;
  visibility: hidden;
  height: 0;
  width: 0;
  display: block;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1 label:before {
  position: absolute;
  content: "";
  width: 20px;
  height: 20px;
  border: 1px solid #fff;
  border-radius: 100%;
  left: 0px;
  top: 0px;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1.time label:before {
  display: none;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1.show {
  flex-basis: 25%;
}

.event-setup-main .advertisement .banner-ads .placement-ad.show-ads .between {
  flex-basis: 40%;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1.show label:before {
  display: none;
}

.event-setup-main .advertisement .banner-ads .placement-ad .place1.show label {
  font-weight: bold;
  font-size: 14px;
  padding-left: 0;
  font-family: "br-bold";
}

.event-setup-main .advertisement .banner-ads .placement-ad.show-ads .between label {
  padding-left: 25px;
}

.event-setup-main .advertisement .banner-ads .placement-ad.show-ads .between label:before {
  left: 0;
}

.event-setup-main .advertisement .banner-ads .placement-ad input:checked + label::after {
  position: absolute;
  content: "";
  background-color: #fff;
  width: 18px;
  height: 18px;
  border-radius: 100%;
  left: 1px;
  top: 1px;
  border: 1px solid #000;
}

.event-setup-main .advertisement .banner-ads .placement-ad.show-ads {
  padding-top: 5px;
}

.participants-form {
  margin-top: 40px;
  border: solid 1px #fff;
}

.participants-form .form-div {
  display: flex;
  flex-wrap: wrap;
  padding: 20px 0;
  align-items: center;
}

.participants-form .form-div .phooto {
  flex-basis: 20%;
  position: relative;
  text-align: center;
  padding: 5px;
}

.participants-form .form-div .firstlastname {
  flex-basis: 30%;
  display: flex;
  flex-wrap: wrap;
  padding: 5px;
}

.participants-form .form-div .gernderweight {
  flex-basis: 40%;
  padding: 5px;
}

.participants-form .form-div .submit-div {
  flex-basis: 10%;
  padding: 5px;
  display: flex;
  align-items: flex-end;
}

.participants-form .form-div .phooto input[type=file] {
  display: block;
  opacity: 0;
  text-align: center;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.participants-form .form-div .firstlastname .name {
  flex-basis: 20%;
  text-align: center;
}

.participants-form .form-div .firstlastname .fields {
  flex-basis: 80%;
}

.participants-form .form-div .firstlastname .fields input {
  border: solid 1px #d0d0d0;
  background-color: #2a2a2a;
  padding: 10px;
  color: #fff;
  width: 100%;
  margin-bottom: 20px;
}

.participants-form .form-div .firstlastname .fields input:last-child {
  margin-bottom: 0;
}

.participants-form .form-div .firstlastname .name p {
  font-size: 16px;
  color: #fff;
  font-weight: 500;
  font-family: "br-reg";
}

.participants-form .form-div .gernderweight .gender {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 10px;
  align-items: center;
}

.participants-form .form-div .gernderweight .gender:last-child {
  padding-bottom: 0;
}

.participants-form .form-div .gernderweight .gender .name {
  flex-basis: 40%;
  padding-right: 20px;
}

.participants-form .form-div .gernderweight .gender .fields {
  flex-basis: 30%;
  padding: 5px;
}

.participants-form .form-div .gernderweight .gender .name p {
  font-size: 16px;
  color: #fff;
  font-weight: 500;
  text-align: right;
  margin: 0;
  font-family: "br-reg";
}

.participants-form .form-div .gernderweight .gender .fields label {
  position: relative;
  font-family: "br-reg";
}

.participants-form .form-div .gernderweight .gender label:before {
  position: absolute;
  content: "";
  width: 20px;
  height: 20px;
  border: 1px solid #fff;
  border-radius: 100%;
  left: 0px;
  top: 0px;
}

.participants-form .form-div .gernderweight .gender input:checked + label::after {
  position: absolute;
  content: "";
  background-color: #fff;
  width: 18px;
  height: 18px;
  border-radius: 100%;
  left: 1px;
  top: 1px;
  border: 1px solid #000;
}

.participants-form .form-div .gernderweight .gender input[type=radio] {
  opacity: 0;
  margin: 0;
  visibility: hidden;
  height: 0;
  width: 0;
  display: block;
}

.participants-form .form-div .gernderweight .gender label {
  font-size: 18px;
  color: #fff;
  font-weight: 400;
  margin: 0;
  position: relative;
  padding-left: 25px;
  font-family: "br-reg";
}

.participants-form .form-div .gernderweight .gender .weightinput input {
  border: solid 1px #d0d0d0;
  background-color: #2a2a2a;
  width: 80%;
  margin: auto;
  padding: 5px 10px;
  color: #fff;
  font-size: 16px;
}

.participants-form .form-div .gernderweight .gender .fields .kgs {
  display: block;
  padding-bottom: 10px;
}

.participants-form .form-div .gernderweight .gender .fields .kgs:last-child {
  padding-bottom: 0;
}

.participants-form .form-div .submit-btn {
  width: 56px;
  height: 56px;
  border: solid 1px #cbd50d;
  border-radius: 100%;
  outline: none;
  float: right;
  margin-bottom: 0;
  position: relative;
  color: #cbd50d;
  font-size: 30px;
  padding: 0;
  cursor: pointer;
}

.participants-form .form-div .submit-btn:disabled {
  width: 56px;
  height: 56px;
  border: solid 1px gray;
  border-radius: 100%;
  outline: none;
  float: right;
  margin-bottom: 0;
  position: relative;
  color: gray;
  font-size: 30px;
  padding: 0;
}

.player-profile-section {
  margin-top: 50px;
}

.player-profile-section .container {
  display: flex;
  flex-wrap: wrap;
}

.player-profile-section .player1 {
  flex-basis: 31%;
  padding: 30px;
  margin: 1%;
  text-align: center;
  position: relative;
}

.player-profile-section .player1 p {
  margin-bottom: 5px;
}

.delete-particioant {
  color: #fff;
  cursor: pointer;
  position: absolute;
  top: 5px;
  right: 8px;
}

.player-profile-section .player1 .pic {
  max-width: 200px;
  margin: auto;
  border-radius: 100%;
  height: 200px;
  overflow: hidden;
  background-color: #fff;
  position: relative;
}

.player-profile-section .player1 .pic img {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
}

.player-profile-section .player1 h3 {
  font-family: "br-bold";
  font-size: 30px;
  text-align: center;
  color: #9c86fb;
  text-transform: uppercase;
  margin-top: 40px;
}

.participants-section h2 {
  position: relative;
}

.participants-section h2 .plus-icon {
  padding-left: 20px;
  cursor: pointer;
}

.events-setup-section .bracket-setting {
  background-color: #3000ff;
  padding: 50px;
  margin-top: 40px;
}

.events-setup-section .bracket-setting h3 {
  font-family: "br-bold";
  font-size: 40px;
  color: #ffffff;
  margin-top: 0;
}

.events-setup-section .bracket-setting .rounds-main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.events-setup-section .bracket-setting .rounds-main .title {
  flex-basis: 25%;
}

.events-setup-section .bracket-setting .rounds-main .round-no {
  flex-basis: 75%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.events-setup-section .bracket-setting .rounds-main .title h4 {
  font-family: "br-bold";
  font-size: 30px;
  line-height: 1.4;
  color: #9c86fb;
  text-transform: uppercase;
}

.events-setup-section .bracket-setting .rounds-main .title select {
  border: solid 1px #fff;
  background-color: transparent;
  color: #fff;
  font-size: 20px;
  padding: 10px 40px 10px 10px;
  font-family: "br-bold";
}

.events-setup-section .bracket-setting .rounds-main .title select * {
  background-color: #110238;
}

.events-setup-section .bracket-setting .rounds-main .round-no .rounds-options {
  flex-basis: 20%;
  text-align: center;
}

.events-setup-section .bracket-setting .rounds-main .round-no .rounds-options input {
  width: 62px;
  height: 62px;
  border: solid 1px #000;
  font-family: "br-reg";
  font-size: 14px;
  font-weight: 300;
  text-align: center;
  color: #5600ff;
  border-radius: 100%;
  display: block;
  margin: auto;
  outline: none;
  background-color: #cbd50d;
  margin-top: 0 !important;
}

.events-setup-section .bracket-setting .rounds-main .round-no .rounds-options input.lifttimeinput {
  width: 40px;
  height: 40px;
  border: solid 1px #cbd50d;
  font-family: "br-reg";
  font-size: 12px;
  font-weight: 300;
  text-align: center;
  color: #5600ff;
  border-radius: 0;
  display: inline-block;
  margin: auto;
  outline: none;
  margin-right: 5px;
  background-color: #cbd50d;
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.events-setup-section .bracket-setting .rounds-main .round-no .rounds-options p {
  font-size: 14px;
  font-weight: 400;
  text-align: center;
}

.events-setup-section .bracket-setting .rounds-main .round-no .rounds-options input[type=radio] {
  width: 0;
  height: 0;
  opacity: 0;
  display: block;
  line-height: 0;
}

.events-setup-section .bracket-setting .rounds-main .round-no .rounds-options label {
  width: 59px;
  height: 57px;
  border: solid 1px #9c86fb;
  font-family: "br-reg";
  font-size: 35px;
  font-weight: 300;
  text-align: center;
  color: #9c86fb;
  border-radius: 100%;
  display: block;
  margin: auto;
}

.events-setup-section .bracket-setting .rounds-main .round-no .rounds-options input[type=radio]:checked + label {
  border: solid 1px #cbd50d;
  background-color: #cbd50d;
  color: #fff;
}

.events-setup-section .bracket-setting .rounds-main .round-no .rounds-options input[type=checkbox] {
  width: 0;
  height: 0;
  opacity: 0;
  display: block;
  line-height: 0;
}

.events-setup-section .bracket-setting .rounds-main .round-no .rounds-options input[type=checkbox]:checked + label {
  border: solid 1px #cbd50d;
  background-color: #cbd50d;
  color: #fff;
  background-image: url("../images/tick.png");
  background-repeat: no-repeat;
  background-position: center;
}

.contestants-making-section {
  margin-top: 40px;
}

.contestants-making-section .container {
  display: flex;
  flex-wrap: wrap;
}

.contestants-making-section .contestants-make {
  flex-basis: 70%;
  display: flex;
  flex-wrap: wrap;
  padding-right: 20px;
}

.contestants-making-section .show-contestants {
  flex-basis: 30%;
}

.contestant-1 {
  flex-basis: 50%;
  padding: 10px;
  position: relative;
  margin-bottom: 30px;
  overflow: hidden;
  padding-right: 40px;
  padding-top: 5px;
  padding-bottom: 15px;
}

.contestant-1 input {
  border: solid 1px #d0d0d0;
  background-color: #2a2a2a;
  color: #fff;
  font-size: 20px;
  font-family: "br-med";
  width: 90%;
  padding: 10px;
  margin-bottom: 20px;
  float: right;
}

.contestant-1 input:first-child {
  margin-top: 10px;
}

.contestant-1 input:last-child {
  margin-bottom: 0 !important;
  top: 4px;
}

.contestant-1:before {
  position: absolute;
  content: "";
  background: url("../images/yellow-line.png");
  background-repeat: no-repeat;
  background-position: left;
  height: 100%;
  width: 35px;
  top: -8px;
  left: 22px;
}

.ebent-setup-2contestant.contestant-1:before {
  top: 0px !important;
}

.contestants-making-section .show-contestants {
  padding: 20px;
  background-color: #232224;
}

.contestants-making-section .show-contestants h3 {
  font-family: "br-bold";
  font-size: 30px;
  color: #ffffff;
  margin: 0;
  text-align: center;
}

.audience-section {
  display: flex;
  flex-wrap: wrap;
}

.audience-section .player-1 {
  flex-basis: 33.33%;
}

.audience-section .time-bar {
  flex-basis: 33.33%;
}

.audience-section .player-1 .player-img {
  width: 230px;
  height: 230px;
  border-radius: 100%;
  overflow: hidden;
  margin: auto;
  margin-top: 100px;
}

.audience-section .player-1 .player-img img {
  width: 100%;
}

.audience-section .player-1 h2.heading-two {
  margin-top: 20px;
  text-align: center;
  margin-bottom: 0;
  color: #fff;
}

.audience-section .player-1 h2.heading-two span {
  width: 15px;
  height: 15px;
  border-radius: 100%;
  box-shadow: 0 2px 11px 0 #cbd50d;
  background-color: #cbd50d;
  display: inline-block;
  vertical-align: middle;
  font-family: "br-bold";
  margin-bottom: 6px;
  visibility: hidden;
}

.audience-section .player-1 p {
  font-family: "br-bold";
  font-size: 30px;
  text-align: center;
  color: #fff;
}

.audience-section .numbers-per-round {
  display: flex;
  flex-wrap: wrap;
  margin-top: 50px;
  justify-content: center;
}

.audience-section .numbers-per-round .round1 {
  flex-basis: 20%;
  padding: 5px;
  text-align: center;
}

.audience-section .numbers-per-round .round1 .yes-no img {
  max-width: 100%;
}

.audience-section .numbers-per-round .round1 .select-yes-no select {
  width: 100%;
  padding: 5px;
  margin-top: 20px;
  background-color: transparent;
  color: #fff;
}

.audience-section .numbers-per-round .round1 .weight-lift h4 {
  font-family: "br-bold";
  font-size: 29px;
  font-size: 23px;
  font-weight: bold;
  text-align: center;
  color: #cbd50d;
  margin-top: 0;
  word-break: break-word;
}

.audience-section .numbers-per-round .round1 .weight-lift .nothing {
  width: 32px;
  height: 32px;
  border: solid 5px #979797;
  border-radius: 100%;
  margin: auto;
  margin-bottom: 10px;
}

.audience-section .player-1 .scoring {
  text-align: center;
  padding-top: 40px;
}

.audience-section .player-1 .scoring h3 {
  font-family: "br-bold";
  font-size: 40px;
  color: #cbd50d;
}

.audience-section .player-1 .scoring h4 {
  font-family: "br-reg";
  font-size: 25px;
  color: #cbd50d;
}

.audience-section .player-1 .scoring p {
  font-family: "br-reg";
  font-size: 25px;
  color: #cbd50d;
}

.audience-section .time-bar .stop-watch {
  width: 90%;
  padding: 20px;
  border: 3px solid #3000ff;
  border-top: 0;
  margin: auto;
}

.audience-section .one-bar-to-win {
  height: 70%;
  display: flex;
  padding-top: 75px;
}

.audience-section .one-bar-to-win .inner-div {
  flex-basis: 100%;
  display: flex;
  flex-wrap: wrap;
}

.audience-section .one-bar-to-win .one-bar {
  flex-basis: 50%;
  padding-right: 10px;
}

.audience-section .one-bar-to-win .one-bar.to-win {
  padding-left: 10px;
  padding-right: 0 !important;
}

.audience-section .one-bar-to-win .one-bar h4 {
  font-family: "br-bold";
  font-size: 20px;
  text-align: center;
  color: #fff;
}

.audience-section .one-bar-to-win .one-bar .bar-show {
  margin: auto;
  position: relative;
}

.audience-section .one-bar-to-win .one-bar .bar-show span {
  width: 80%;
  padding: 10px;
  font-size: 30px;
  color: #fff;
  text-align: center;
  display: block;
  background-color: #4900ff;
  margin: auto;
}

.audience-section .one-bar-to-win .one-bar .bar-show input {
  width: 80%;
  padding: 10px;
  font-size: 30px;
  color: #fff;
  text-align: center;
  display: block;
  background-color: #525252;
  border: 3px solid #4900ff;
  margin: auto;
  box-sizing: border-box;
  height: 65px;
}

.audience-section .one-bar-to-win .one-bar.to-win .bar-show input {
  border: 3px solid #cbd50d;
}

.audience-section .one-bar-to-win .one-bar .bar-show.left:before {
  position: absolute;
  content: "";
  border-right: 35px solid #474747;
  border-top: 25px solid transparent;
  border-bottom: 25px solid transparent;
  left: -61px;
  top: 7px;
  display: none;
}

.audience-section .one-bar-to-win .one-bar .bar-show.right:after {
  position: absolute;
  content: "";
  border-left: 35px solid #474747;
  border-top: 25px solid transparent;
  border-bottom: 25px solid transparent;
  right: -61px;
  top: 7px;
  display: none;
}

.audience-section .one-bar-to-win .one-bar.to-win .bar-show span {
  background-color: #cbd50d;
}

.advertisement {
  position: relative;
}

.advertisement img.bottom-logo {
  position: absolute;
  left: 10px;
  bottom: 10px;
}

.advertisement .show-add {
  width: 80%;
  margin: auto;
  height: 120px;
  background-color: #000;
  border: 1px solid #fff;
  margin-top: 30px;
}

.advertisement .show-add h4 {
  font-family: "br-bold";
  font-size: 40px;
  text-align: center;
  color: #ffffff;
}

.audience-section .numbers-per-round .round1 .weight-lift input {
  padding: 4px;
  color: #fff;
  border: solid 3px #cbd50d;
  background-color: #525252;
  width: 100%;
  font-size: 20px;
  text-align: center;
}

.audience-section .numbers-per-round .round1 .yes-no span.cross {
  font-size: 49px;
  font-weight: bold;
  color: #979797;
}

.select-yes-no select option {
  background-color: #000;
}

.audience-section .numbers-per-round .round1 .yes-no span.tick {
  font-size: 49px;
  font-weight: bold;
  color: #cbd50d;
}

.brackets-section .brackets-main {
  display: flex;
  flex-wrap: wrap;
}

.brackets-section .brackets-main .playof-1 {
  width: 350px;
  padding-right: 10px;
}

.save-all-btn {
  position: fixed;
  top: 25px;
  right: 400px;
  background-image: linear-gradient(to bottom right, #7556fb, #4400ff);
  border: 0;
  padding: 10px 24px;
  border-radius: 0;
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  z-index: 99;
}

button.save-all-btn[disabled] {
  background-color: #999;
}

.matchcomplete span.complete {
  width: 28px;
  height: 28px;
  border-radius: 100%;
  background-color: #eae339;
  color: #000;
  padding-top: 2px;
  display: block;
  text-align: center;
  position: absolute;
  right: 1px;
  top: 43%;
  transform: translateY(-50%);
  font-size: 20px;
}

.matchcomplete .toplay {
  background-color: #2a1f4b;
  border: 1px solid #594a92;
  color: #594a92;
  width: 28px;
  height: 28px;
  border-radius: 100%;
  padding-top: 4px;
  padding-left: 2px;
  display: block;
  text-align: center;
  position: absolute;
  right: 1px;
  top: 43%;
  transform: translateY(-50%);
  font-size: 13px;
}

.mat-dialog-container {
  background-color: #161616;
}

.timer-time {
  font-size: 80px;
  font-family: "Orbitron", sans-serif;
  color: white;
  text-align: center;
}

.time-btns {
  border: 0;
  padding: 0;
  margin: 0 10px;
  outline: none;
}

.timer-btn-div {
  text-align: center;
}

.select-jerk-snatch select {
  display: block;
  margin: auto;
  background-color: transparent;
  color: #fff;
  border: 1px solid #fff;
  padding: 10px;
  margin-bottom: 20px;
  font-size: 17px;
  text-transform: uppercase;
}

.end-match-btn {
  padding: 10px 30px;
  background-color: green;
  color: #fff;
  border: 0;
  border-radius: 5px;
  margin: auto;
  display: table;
  margin-top: 20px;
}

.end-match-btn:focus {
  background-color: #66d466;
}

.select-jerk-snatch select option {
  background-color: #161616;
}

.winnerInput {
  border: 1px solid yellow !important;
}

.colorpicker-popup.mat-dialog-container {
  padding: 10px;
  width: 50%;
  height: 50%;
}

.btn-ok-colorpicker {
  padding: 5px 10px;
  border: 0;
  background-color: green;
  color: #fff;
  border-radius: 5px;
  margin-top: 10px;
  margin-right: 10px;
}

.btn-cancel-colorpicker {
  padding: 5px 10px;
  border: 0;
  background-color: red;
  color: #fff;
  border-radius: 5px;
  margin-top: 10px;
  margin-right: 10px;
}

.gray-btn {
  width: 15px;
  height: 15px;
  border-radius: 100%;
  box-shadow: 0 2px 11px 0 red;
  background-color: red;
}

.reset-buttons {
  margin-top: -30px;
  margin-bottom: 30px;
  text-align: center;
}

.round-div {
  display: flex;
  flex-wrap: wrap;
}

.cdk-overlay-pane {
  max-width: 60vw !important;
}

.mat-dialog-container {
  padding: 40px !important;
}

.showhide {
  visibility: visible !important;
}

/*---------- ribbon banner component -------------------*/
.ribbonBanner {
  display: flex;
  flex-wrap: wrap;
}

.ribbonBanner .playerpart {
  flex-basis: 35%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.ribbonBanner .scorepart {
  flex-basis: 28%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  border: 2px solid #110238;
  margin: 0 1%;
}

.ribbonBanner .playerpart .logo {
  flex-basis: 20%;
}

.ribbonBanner .playerpart .playerinf {
  flex-basis: 55%;
}

.ribbonBanner .playerpart .towin {
  flex-basis: 25%;
  border: 2px solid yellow;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.ribbonBanner .playerpart .towin .v-center {
  flex-basis: 100%;
}

.ribbonBanner .playerpart .playerinf .inner-playerinf {
  display: flex;
  flex-wrap: wrap;
  text-align: right;
  align-items: center;
}

.ribbonBanner .playerpart .playerinf .inner-playerinf .name-player {
  flex-basis: 70%;
  padding: 10px;
}

.ribbonBanner .playerpart .playerinf .inner-playerinf .player-img {
  flex-basis: 30%;
  text-align: center;
}

.ribbonBanner .scorepart .onbar {
  flex-basis: 25%;
}

.ribbonBanner .scorepart .onbar p {
  color: #fff;
  font-size: 1vw;
  text-align: center;
  margin-bottom: 0;
}

.ribbonBanner .scorepart .timer222 {
  flex-basis: 50%;
}

.ribbonBanner .scorepart .timer222 .timer-time {
  font-size: 2vw;
  line-height: 1;
}

.ribbonBanner .scorepart .timer222 .stop-watch {
  padding: 15px 0px;
}

.ribbonBanner .scorepart .timer222 h1 {
  font-size: 2vw;
  margin-bottom: 0;
}

.ribbonBanner .playerpart .playerinf .inner-playerinf .player-img img {
  width: 70px;
  border-radius: 100%;
  padding: 10px;
  height: 70px !important;
}

.ribbonBanner .playerpart .playerinf .inner-playerinf .heading-two {
  font-family: "br-bold";
  font-size: 1.5vw;
  color: #ffffff;
  margin-bottom: 0;
  margin-top: 0;
}

.ribbonBanner .playerpart .playerinf .inner-playerinf h3 {
  font-size: 2vw;
  margin-bottom: 0;
  FONT-WEIGHT: 600;
}

.ribbonBanner .playerpart .logo .logo-main {
  position: unset;
  top: unset;
  left: unset;
  width: 100%;
  padding: 11px;
}

.ribbonBanner .playerpart .towin p {
  margin: 0;
  text-align: center;
  color: #fff;
  font-size: 0.8vw;
}

.ribbonBanner .playerpart .towin span {
  font-size: 1.7vw;
  color: #fff;
  text-align: center;
  display: block;
  line-height: 1;
}

.player222 .name-player {
  text-align: left;
}

@media only screen and (min-width: 1750px) {
  .ribbonBanner .playerpart .playerinf .inner-playerinf .player-img img {
    width: 100px;
    border-radius: 100%;
    padding: 10px;
    height: 100px !important;
  }
}

/*# sourceMappingURL=face-off.css.map */