.gradient-buttons .btn {

  background-image: linear-gradient(

    to bottom,

    rgba(255, 255, 255, 0.5),

    rgba(255, 255, 255, 0.2) 49%,

    rgba(0, 0, 0, 0.15) 51%,

    rgba(0, 0, 0, 0.05)

  );

  background-repeat: repeat-x;

}

.form-control {

  font-size: 0.9rem;

}



.bg-main {

  background-color: #000;

  color: #f0f0f0;

}



.bg-main-darker {

  background-color: #000;

  color: #f0f0f0;

}



.img-flag {

  height: 36px;

  width: 36px;

}



.table-1 td {

  border-color: #ffa500;

  background-color: #313131;

}



.table-1 tr.bg-alt td {

  background-color: #ffa500;

}



.table-1 tr.bg-hd td {

  background-color: #fff;

  color: #000;

  font-weight: bold;

  /*    border-left-color: #000;

        border-right-color: #000;

        border-top-color: #000;

        border-bottom-color: #ffa500 !important;*/

}



.th1 {

  text-align: center;

}



.td1 {

  text-align: center;

}



.blink_me {

  animation: blinker 1s linear infinite;

}



@keyframes blinker {

  50% {

    opacity: 0;

  }

}



#playForm tr.league td {

    background-color: #fff;

    color: #000;

    font-weight: bold;

}



/* #### Desktops #### */

@media screen and (min-width: 640px) {

  .th1 {

    width: 60px;

  }



  .demo-modal {

    width: 600px;

  }

}

/* #### Mobile Phones Portrait or Landscape #### */

@media screen and (max-width: 640px) {

  .th1 {

    width: auto;

    max-width: 60px;

  }



  .img-flag {

    height: 24px;

    width: 24px;

  }

}



/*.demo-modal img {

    max-width: 500px

}*/



/* Lucky */

.swal2-popup {

  background: rgba(0, 0, 0, 0.5) !important;

  backdrop-filter: blur(2px);

}



.swal2-title {

  color: #ffff00 !important;

}



.swal2-content {

  color: #ffff00 !important;

}

/*.swal-modal {

    background-color: yellow;

}*/



.swal2-html-container {

  color: #ffff00 !important;

}



.swal2-footer {

  border-top: 1px solid #ffffff33;

}

.modal-dialog {

  font-size: 0.8em;

}

.modal-header {

  color: #fff;

  border-bottom: 0;

  padding: 0.5rem 1em;

  flex-wrap: wrap;

}



.modal-header .close {

  color: #fff;

  text-shadow: none;

}



.modal-title {

  text-align: center;

  width: 100%;

  color: #fff !important;

}

.modal-title div {

  font-size: 10px;

}

.modal-header .close {

  position: absolute;

  top: 7px;

  right: 15px;

}

.modal-content {

  background-color: #181818;

  border: 2px solid rgba(228, 154, 12, 0.8);

  border-radius: 2rem;

  padding: 0; /*0.5rem 1em;*/

}



.modal-body {

  color: #fff;

  border-bottom: 0;

  padding: 0; /*0.5rem 1em;*/

}



.modal-footer {

  justify-content: center !important;

  border-top: 0;

}



.ch .modal-header {

  color: #fff;

}



.ch .modal-content {

  background-color: rgb(10, 10, 110);

}



.ch .modal-body {

  color: #fff;

}



.ch .dropdown-item img,

.ch .filter-option img {

  max-width: 24px;

}



.go .modal-header {

  color: #fff;

}



.go .modal-content {

  background-color: rgb(7, 106, 155);

}



.go .modal-body {

  color: #fff;

}



.img-modal {

  max-width: 30px;

}



.go .img-modal {

  max-width: 24px;

}



.dropdown-footer,

.dropdown-header {

  text-align: left;

}



.dropdown-footer,

.dropdown-header img {

  max-width: 24px;

}



.go .dropdown-item img,

.go .filter-option img {

  max-width: 24px;

}

#normalPlayWrapper,

#scoreExPlayWrapper,

#stepPlayWrapper {

  color: #fff;

}

#normalPlayWrapper h5,

#scoreExPlayWrapper h5,

#stepPlayWrapper h5 {

  text-align: center;

}



#normalPlayWrapper table,

#scoreExPlayWrapper table,

#stepPlayWrapper table {

  background-color: #313131;

}



#normalPlayWrapper table td,

#scoreExPlayWrapper table td,

#stepPlayWrapper table td {

  border-color: #ffa500;

}



#normalPlayWrapper table .league,

#scoreExPlayWrapper table .league,

#stepPlayWrapper table .league {

  background-color: #fff;

  color: #000;

  font-weight: bold;

}



#normalPlayWrapper table .action,

#scoreExPlayWrapper table .action,

#stepPlayWrapper table .action {

  background-color: #ffa500;

  color: #000;

  font-weight: bold;

}



.spPlayWrapper {

    border-color: #FFA500;

    margin-bottom:40px;

}

.spPlayWrapper .title, .spPlayWrapper .title h6{

    padding:5px 10px;

    background-color: #fff;

    color:#000;

	font-size:1em;

}

    .spPlayWrapper .action {

        background-color: #FFA500;

        color: #000;

        font-weight: bold;

        padding: 5px 10px;

    }



tr.team td {

  color: #fff;

}



.live-v {

  margin-right: 5px;

}



.col-time {

  width: 12%;

  vertical-align: middle !important;

}

.col-vs {

  width: 8%;

  vertical-align: middle !important;

}

.col-home,

.col-away {

  width: 36%;

  text-align: center !important;

}

.col-live {

  width: 8%;

  vertical-align: middle !important;

}



.score {

  font-size: 20px;

  font-weight: bold;

  color: rgb(253, 255, 0);

}



.equal {

  display: table; /* Make the container element behave like a table */

  width: 100%; /* Set full-width to expand the whole page */

}



.equal > [class*="col-"] {

  display: table-cell; /* Make elements inside the container behave like table cells */

}



.modal .table th,

.modal .table td {

  padding: 3px 4px;

}

.modal select.form-control {

  max-width: 80px;

  margin: 0 auto;

}

.modal select#player.form-control,

.modal select#team.form-control {

  max-width: 100%;

}



.modal-body {

  padding:2px 10px;

}

.modal-body table.sp {

  padding:2px 10px;

}

.modal select#team {

  max-width: 100%!important;

}

.modal select#player {

  max-width: 100% !important;

}



/*.modal input[type="text"].form-control {

    max-width: 150px;

    margin: 0 auto;

}*/



.line-break {

  width: 100%;

}



#playForm table {

  border: none;

}

#playForm th,

#playForm td {

  border: none;

  color: #eee;

}



#playForm tr.border-bottom th,

#playForm tr.border-bottom td {

  border-bottom: solid 1px #aaa;

  font-size: 1.1em;

}



.modal-body table input,

.modal-body table select {

  padding: 3px 6px;

}



.modal-body table input {

  width: 100%;

}



.modal-body .image {

  opacity: 0.8;

  width: 32px;

  height: 32px;

  display: inline-block;

  /*margin: 10px;*/

}



.modal-body .image:hover {

  opacity: 1;

}



.modal-body .radio-img > input {

  display: none;

}



.modal-body .radio-img > .image {

  cursor: pointer;

  background-image: url(../images/check32wr.png);

  background-position: 0 0;

}



.modal-body .radio-img > input:checked + .image {

  background-position: -35px 0;

}



.model-body label {

  margin-bottom: 0;

}