#bg-video {
	min-width: 100%;
	min-height: 100vh;
	max-width: 100%;
	max-height: 100vh;
	object-fit: cover;
	z-index: -1;
}

.video-overlay {
	position: absolute;
	background-color: rgba(22,34,57,0.7);
	top: 0;
	left: 0;
	bottom: 15px;
	width:100%;
	height: 99.5% !important;
}

.main-banner {
	position: relative;
	max-height: 100%;
	overflow: hidden;
}

.main-banner .caption {
	text-align: center;
	position: absolute;
	width: 80%;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
}

.main-banner .caption h2 {
	margin-top: 30px;
	margin-bottom: 30px;
	font-size: 5rem;
	text-transform: uppercase;
	font-weight: 800;
	color: #fff;
	letter-spacing: 1px;
}

.main-banner .captionend {
	text-align: center;
	position: absolute;
	width: 80%;
	left: 50%;
	top: 90%;
	transform: translate(-50%,-50%);
}

.start-now
{
	background: url(/public/images/backgrounds/start-now.jpg) !important;
 	background-repeat: no-repeat !important;
	background-size: cover !important;
	background-position:center !important;
	min-height: 100vh;
	max-height: 150vh;
}

/*.second-banner::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgb(245,245,245);
	background: linear-gradient(0deg, rgba(245,245,245,1) 0%, rgba(27,42,68,0.8) 90%);
}*/

.second-banner {
	margin-top: -5px !important;
	background-color: #f5f5f5 !important;
}

.third-banner {
	background: url(/public/images/tree-bg.png) !important;
	background-color: #f5f5f5 !important;
 	background-repeat: no-repeat !important;
	background-size: cover !important;
	background-position:center !important;
	height: 120vh;
	width: 100%;
}

.fourth-banner {
	background: url(/public/images/sr-bg-1.png) !important;
	background-color:  rgb(7, 18, 26) !important;
	background-repeat: no-repeat !important;
	background-size: cover !important;
	background-position:center !important;
	min-height: 100vh;
}

@keyframes rotate {
	100% {
		transform: rotate(1turn);
	}
}

@keyframes up-down {
	from {
	  transform: translateY(0);
	}
	to {
	  transform: translateY(15px);
	}
  }

.circle-gif {
	background: url(/public/images/champion-circle.gif) !important;
	background-color:  transparent !important;
	background-repeat: no-repeat !important;
	background-size: contain !important;
	background-position: center !important;
}

.circle-icon {
	display: block;
    float: left;
    width: 70px;
    height: 70px;
    border: 3px dotted #cfa75c;
    border-radius: 50%;
}

.circle-icon > .material-icons {
    font-size: 2.5em !important;
	padding: 15px;
	margin-top: 0px;
}

.how-to-info {
	/*border: 2px solid rgba(6, 169, 198, 1);*/
	background-color: rgba(6, 169, 198, 1);
	padding: 1.5em 2em 1.5em 2em;
}

.fifth-banner::before {
	content: "";
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: rgb(245,245,245);
	background: linear-gradient(0deg, rgba(245,245,245,0) 0%, rgba(7,18,26,0.9528186274509804) 74%);
}

.fifth-banner {
	background: url(/public/images/backgrounds/team-bg.png) !important;
 	background-repeat: no-repeat !important;
	background-size: cover !important;
	background-position:center !important;
	min-height: 50vh;
	max-height: 100vh;
	position: relative;
}

.border-team {
	border-radius: 50%;
	border: 5px solid #0bc6e3;
}

.sixth-banner {
	background: url(/public/images/backgrounds/hex-bg.jpg) !important;
	background-repeat: no-repeat !important;
	background-size: cover !important;
	background-position: center !important;
	height: 100%;
}

.count-card {
	background-color: #f5f5f5;
	border-radius: 0px !important;
	border: none;
	position: relative;
}