/* Add here all your CSS customizations */
.moving-clouds {
    position: absolute;
    z-index: 1;
    bottom: 0;
    left: 0;
    width: 250.625em;
    height: 43.75em;
    -webkit-animation: cloudLoop 80s linear infinite;
    animation: cloudLoop 80s linear infinite;
  }

  @keyframes cloudLoop {
    0% {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
    100% {
      -webkit-transform: translate3d(-50%, 0, 0);
      transform: translate3d(-50%, 0, 0);
    }
  }

  .following img {
    max-width: 70px;
  }
  .navbar .getstarted,
.navbar .getstarted:focus {
  background: linear-gradient(90deg, rgba(254,254,254,1) 0%, rgba(186,4,84,1) 28%, rgba(121,9,118,1) 79%, rgba(133,0,204,1) 100%);
  color: #fff;
  padding: 10px 25px;
  margin-left: 30px;
  border-radius: 50px;
}

.navbar .getstarted:hover,
.navbar .getstarted:focus:hover {
  color: #fff;
  background: #550077;
}

/*---------------------
  Match Section
-----------------------*/

.match-section {
	padding: 70px 0 60px;
}

.ms-content h4 {
	color: #ffffff;
	font-weight: 500;
	margin-bottom: 25px;
}

.ms-content .mc-table {
	margin-bottom: 10px;
}

.ms-content .mc-table table {
	width: 100%;
}

.ms-content .mc-table table tr {
	background: rgba(21, 22, 24, 0.9);
	margin-bottom: 10px;
}

.ms-content .mc-table table tr td {
	padding: 16px 0;
	width: 200px;
}

.ms-content .mc-table table tr td img {
	height: 70px;
	width: 50px;
}

.ms-content .mc-table table tr td h6 {
	color: #ffffff;
	display: inline-block;
}

.ms-content .mc-table table tr td.left-team {
	padding-left: 40px;
}

.ms-content .mc-table table tr td.left-team img {
	float: left;
	margin-right: 10px;
}

.ms-content .mc-table table tr td.left-team h6 {
	overflow: hidden;
	line-height: 30px;
}

.ms-content .mc-table table tr td.right-team {
	text-align: right;
	padding-right: 40px;
}

.ms-content .mc-table table tr td.right-team img {
	float: right;
	margin-left: 10px;
}

.ms-content .mc-table table tr td.right-team h6 {
	float: right;
	line-height: 30px;
}

.ms-content .mc-table table tr td.mt-content {
	width: 150px;
	text-align: center;
}

.ms-content .mc-table table tr td.mt-content .mc-op {
	font-size: 14px;
	color: #ffffff;
}

.ms-content .mc-table table tr td.mt-content h4 {
	color: #ffffff;
	font-weight: 700;
	margin-top: 14px;
	margin-bottom: 12px;
}
.set-bg {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}

.points-table table {
	width: 100%;
}

.points-table table thead tr th {
	font-size: 14px;
	color: #ffffff;
	font-weight: 500;
	background: #2c2d2f;
	padding: 14px 0 13px;
}

.points-table table thead tr th.th-o {
	text-align: center;
}

.points-table table tbody {
	border: 1px solid #e5e5e5;
	border-top: none;
	border-bottom: none;
}

.points-table table tbody tr {
	border-bottom: 1px solid #e7e7e7;
}

.points-table table tbody tr td {
	text-align: center;
	font-size: 14px;
	color: #636363;
	padding: 12px 0;
}

.points-table table tbody tr td.team-name {
	text-align: left;
	width: 130px;
}

.points-table table tbody tr td.team-name img {
	height: 36px;
	width: 22px;
	margin-right: 6px;
	display: inline-block;
}

.points-table table tbody tr td.team-name span {
	display: inline-block;
	font-size: 14px;
	color: #2d2d2d;
	font-weight: 500;
}

.points-table .p-all {
	font-size: 14px;
	color: #000000;
	text-transform: uppercase;
	font-weight: 500;
	letter-spacing: 1px;
	background: #f2f2f2;
	display: block;
	text-align: center;
	padding: 15px;
}

.socket {
    width: 200px;
    height: 200px;
    position: absolute;
    left: 50%;
    margin-left: -100px;
    top: 50%;
    margin-top: -100px;
  }

  .hex-brick {
    background: #000000;
    width: 30px;
    height: 17px;
    position: absolute;
    top: 5px;
    animation-name: fade00;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    -webkit-animation-name: fade00;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
  }

  .h2 {
    transform: rotate(60deg);
    -webkit-transform: rotate(60deg);
  }

  .h3 {
    transform: rotate(-60deg);
    -webkit-transform: rotate(-60deg);
  }

  .gel {
    height: 30px;
    width: 30px;
    transition: all .3s;
    -webkit-transition: all .3s;
    position: absolute;
    top: 50%;
    left: 50%;
  }

  .center-gel {
    margin-left: -15px;
    margin-top: -15px;
    animation-name: pulse00;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    -webkit-animation-name: pulse00;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
  }

  .c1 {
    margin-left: -47px;
    margin-top: -15px;
  }

  .c2 {
    margin-left: -31px;
    margin-top: -43px;
  }

  .c3 {
    margin-left: 1px;
    margin-top: -43px;
  }

  .c4 {
    margin-left: 17px;
    margin-top: -15px;
  }

  .c5 {
    margin-left: -31px;
    margin-top: 13px;
  }

  .c6 {
    margin-left: 1px;
    margin-top: 13px;
  }

  .c7 {
    margin-left: -63px;
    margin-top: -43px;
  }

  .c8 {
    margin-left: 33px;
    margin-top: -43px;
  }

  .c9 {
    margin-left: -15px;
    margin-top: 41px;
  }

  .c10 {
    margin-left: -63px;
    margin-top: 13px;
  }

  .c11 {
    margin-left: 33px;
    margin-top: 13px;
  }

  .c12 {
    margin-left: -15px;
    margin-top: -71px;
  }

  .c13 {
    margin-left: -47px;
    margin-top: -71px;
  }

  .c14 {
    margin-left: 17px;
    margin-top: -71px;
  }

  .c15 {
    margin-left: -47px;
    margin-top: 41px;
  }

  .c16 {
    margin-left: 17px;
    margin-top: 41px;
  }

  .c17 {
    margin-left: -79px;
    margin-top: -15px;
  }

  .c18 {
    margin-left: 49px;
    margin-top: -15px;
  }

  .c19 {
    margin-left: -63px;
    margin-top: -99px;
  }

  .c20 {
    margin-left: 33px;
    margin-top: -99px;
  }

  .c21 {
    margin-left: 1px;
    margin-top: -99px;
  }

  .c22 {
    margin-left: -31px;
    margin-top: -99px;
  }

  .c23 {
    margin-left: -63px;
    margin-top: 69px;
  }

  .c24 {
    margin-left: 33px;
    margin-top: 69px;
  }

  .c25 {
    margin-left: 1px;
    margin-top: 69px;
  }

  .c26 {
    margin-left: -31px;
    margin-top: 69px;
  }

  .c27 {
    margin-left: -79px;
    margin-top: -15px;
  }

  .c28 {
    margin-left: -95px;
    margin-top: -43px;
  }

  .c29 {
    margin-left: -95px;
    margin-top: 13px;
  }

  .c30 {
    margin-left: 49px;
    margin-top: 41px;
  }

  .c31 {
    margin-left: -79px;
    margin-top: -71px;
  }

  .c32 {
    margin-left: -111px;
    margin-top: -15px;
  }

  .c33 {
    margin-left: 65px;
    margin-top: -43px;
  }

  .c34 {
    margin-left: 65px;
    margin-top: 13px;
  }

  .c35 {
    margin-left: -79px;
    margin-top: 41px;
  }

  .c36 {
    margin-left: 49px;
    margin-top: -71px;
  }

  .c37 {
    margin-left: 81px;
    margin-top: -15px;
  }

  .r1 {
    animation-name: pulse00;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-delay: .2s;
    -webkit-animation-name: pulse00;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-delay: .2s;
  }

  .r2 {
    animation-name: pulse00;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-delay: .4s;
    -webkit-animation-name: pulse00;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-delay: .4s;
  }

  .r3 {
    animation-name: pulse00;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-delay: .6s;
    -webkit-animation-name: pulse00;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-delay: .6s;
  }

  .r1 > .hex-brick {
    animation-name: fade00;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-delay: .2s;
    -webkit-animation-name: fade00;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-delay: .2s;
  }

  .r2 > .hex-brick {
    animation-name: fade00;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-delay: .4s;
    -webkit-animation-name: fade00;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-delay: .4s;
  }

  .r3 > .hex-brick {
    animation-name: fade00;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-delay: .6s;
    -webkit-animation-name: fade00;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-delay: .6s;
  }

  @keyframes pulse00 {
    0% {
      -webkit-transform: scale(1);
      transform: scale(1);
    }

    50% {
      -webkit-transform: scale(0.01);
      transform: scale(0.01);
    }

    100% {
      -webkit-transform: scale(1);
      transform: scale(1);
    }
  }

  @keyframes fade00 {
    0% {
      background: #252525;
    }

    50% {
      background: #000000;
    }

    100% {
      background: #353535;
    }
  }