:root {
	--hoka-blue: #006FD3;
	--hoka-white: #F2F0EA;
	--hoka-sky: #00FFFF;
}

@font-face {
  font-family: 'FuturaPT';
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/FuturaPTBook.eot);
  src: url(../fonts/FuturaPTBook.eot?#iefix) format('embedded-opentype'),
       url(../fonts/FuturaPTBook.otf) format('otf'),
       url(../fonts/FuturaPTBook.svg#FuturaPTBook) format('svg'),
       url('../fonts/FuturaPTBook.ttf') format('truetype'),
       url('../fonts/FuturaPTBook.woff') format('woff'),
       url('../fonts/FuturaPTBook.woff2') format('woff2');
}
@font-face {
  font-family: 'FuturaPT';
  font-style: normal;
  font-weight: medium;
  src: url(../fonts/FuturaPTMedium.eot);
  src: url(../fonts/FuturaPTMedium.eot?#iefix) format('embedded-opentype'),
       url(../fonts/FuturaPTMedium.otf) format('otf'),
       url(../fonts/FuturaPTMedium.svg#FuturaPTMedium) format('svg'),
       url('../fonts/FuturaPTMedium.ttf') format('truetype'),
       url('../fonts/FuturaPTMedium.woff') format('woff'),
       url('../fonts/FuturaPTMedium.woff2') format('woff2');
}
@font-face {
  font-family: 'FuturaPT';
  font-style: normal;
  font-weight: bold;
  src: url(../fonts/FuturaPTHeavy.eot);
  src: url(../fonts/FuturaPTHeavy.eot?#iefix) format('embedded-opentype'),
       url(../fonts/FuturaPTHeavy.otf) format('otf'),
       url(../fonts/FuturaPTHeavy.svg#FuturaPTHeavy) format('svg'),
       url('../fonts/FuturaPTHeavy.ttf') format('truetype'),
       url('../fonts/FuturaPTHeavy.woff') format('woff'),
       url('../fonts/FuturaPTHeavy.woff2') format('woff2');
}

html,
body{
	background-color: var(--hoka-blue);
	font-family: 'FuturaPT', sans-serif;
}

a{
	color: var(--hoka-blue);
	text-decoration: underline;
}
	a:hover{
		text-decoration: none;
	}

.w-80{
	width: 80% !important;
}

.btn-white{
	background-color: var(--hoka-white);
	color: #333;
	font-family: 'FuturaPT', sans-serif;
	font-weight: 450;
	font-size: 18px;
	border: none;
}
	.btn-white:hover,
	.btn-white:active,
	.btn-white:not(:disabled):not(:disabled):active{
		background-color: var(--hoka-white);
		color: var(--hoka-blue);
		border: none;
	}
.btn-blue{
	background-color: var(--hoka-blue);
	color: #FFF;
	font-family: 'FuturaPT', sans-serif;
	font-weight: 450;
	font-size: 18px;
	border: none;
}
	.btn-blue:hover,
	.btn-blue:active,
	.btn-blue:not(:disabled):not(:disabled):active{
		background-color: #00498A;
		color: #fff;
		border: none;
	}
	.btn-blue:disabled,
	.btn-blue[disabled]{
		opacity: .3;
	}
.btn-yellow{
	background-color: #FFFF08;
	color: var(--hoka-blue);
	font-family: 'FuturaPT', sans-serif;
	font-weight: 450;
	font-size: 18px;
	border: none;
}
	.btn-yellow:hover,
	.btn-yellow:active,
	.btn-yellow:not(:disabled):not(:disabled):active{
		background-color: #FFFF08;
		color: var(--hoka-blue);
		border: none;
	}

.btn-mach-x{
	background-color: #91FFB5;
	color: #006574;
	font-family: 'FuturaPT', sans-serif;
	font-weight: 450;
	font-size: 18px;
	border: none;
}
	.btn-mach-x:hover,
	.btn-mach-x:active,
	.btn-mach-x:not(:disabled):not(:disabled):active{
		background-color: #006574;
		color: #fff;
		border: none;
	}
	
.btn-awaken-energy{
	background: transparent url(../images/awaken-button.png) center no-repeat;
	background-size: cover;
	background-color: #91FFB5;
	color: #fff;
	font-family: 'FuturaPT', sans-serif;
	font-weight: 450;
	font-size: 18px;
	border: none;
}
	.btn-awaken-energy:hover,
	.btn-awaken-energy:active,
	.btn-awaken-energy:not(:disabled):not(:disabled):active{
		background-color: #006574;
		color: #fff;
		border: none;
	}

	.btn-blue.btn-lg,
	.btn-white.btn-lg,
	.btn-yellow.btn-lg,
	.btn-mach-x.btn-lg{
		padding-top: 15px;
		padding-bottom: 15px;
	}
	
.btn-scroll-more{
	background: #F2F0EA;
	border-radius: 8px;
	color: #333;
	font-family: 'FuturaPT', sans-serif;
	font-weight: 450;
	font-size: 18px;
	border: none;
	opacity: .5;
}
	.btn-scroll-more span{
		display: inline-block;
		vertical-align: top;
	}
	.btn-scroll-more:after{
		content: "";
		display: inline-block;
		background: transparent url(../images/icon-scrollmore@2x.png) center no-repeat;
		background-size: 12px 15px;
		width: 12px;
		height: 15px;
		vertical-align: top;
		margin: 5px 0 0 15px;
	}
	.btn-scroll-more:hover,
	.btn-scroll-more:active,
	.btn-scroll-more:not(:disabled):not(:disabled):active{
		background-color: var(--hoka-white);
		color: var(--hoka-blue);
		border: none;
		opacity: 1;
	}

#nav{
	display: block;
	position: relative;
	background: var(--hoka-blue);
	padding: 20px 0;
	color: #fff;
	font-weight: 450;
	font-size: 21px;
}
	#nav .logo{
		display: inline-block;
		text-decoration: none;
		outline: none;
		position: relative;
	}
	#nav .btn-back,
	#nav .title{
		display: inline-block;
		white-space: nowrap;
		vertical-align: middle;
	}
	#nav .btn-back{
		text-decoration: none;
		outline: none;
		color: #fff;
		font-size: 28px;
		font-weight: lighter;
		margin: -8px 20px 0 0;
	}
	#nav .title{
		font-size: 21px;
	}

	#nav .btn-menu{
		position: relative;
		float: left;
		background: transparent url(../images/icon-burger.png) center no-repeat;
		background-size: 21px 14px;
		display: inline-block;
		width: 21px;
		height: 14px;
		margin: 10px 0 0;
	}
	#nav .btn-account{
		position: relative;
		float: right;
		background: transparent url(../images/icon-user.png) center no-repeat;
		background-size: 20px 20px;
		display: inline-block;
		width: 20px;
		height: 20px;
		margin: 8px 0 0;
	}
	#nav .btn-action{
		position: relative;
		float: right;
		background: transparent url(../images/icon-sort.png) center no-repeat;
		background-size: 73px 32px;
		display: inline-block;
		width: 73px;
		height: 32px;
		margin: 0;
		padding: 0;
	}

#hero{
	display: block;
	position: relative;
	background: var(--hoka-blue);
}
	#hero .poster{
		position: relative;
		height: 132vw;
	}
		#hero .poster img{
			position: relative;
			height: 100%;
			width: auto;
			left: 50%;
			transform: translateX(-50%);
		}
	#hero .poster-video{
		height: auto !important;
	}
	#hero .btn-scroll-more{
		display: none;
		position: absolute;
		bottom: 100px;
		left: 50%;
		transform: translateX(-50%);
	}

.hero-slider,
.hero-slider .slick-track{
	width: 100%;
	height: 54vw;
	position: relative;
}
	.hero-slider .item{
		width: 100%;
		height: 54vw;
		position: relative;
		overflow: hidden;
	}
		.hero-slider .item img{
			width: 100%;
			height: auto;
		}
		.hero-slider .item a{
			display: block;
			position: relative;
			text-decoration: none;
			outline: none;
		}
	.hero-slider .slick-arrow{
		position: absolute;
		z-index: 9;
		top: 50%;
		left: 20px;
		border: none;
		background: transparent url(../images/icon-prev.png) center no-repeat;
		background-size: 35px 35px;
		width: 35px;
		height: 35px;
		font-size: 0;
		color: transparent;
		transform: translateY(-50%);
		opacity: 1;
	}
	.hero-slider .slick-next{
		background-image: url(../images/icon-next.png);
		left: auto;
		right: 20px;
	}

.section{
	display: block;
	position: relative;
	padding: 20px 0;
}
	.section2{
		padding: 32px 29px;
		color: #FFF;
		font-size: 21px;
		font-family: "FuturaPT", sans-serif;
		line-height: 27px;
		letter-spacing: -0.42px;
		font-weight: 400;
		line-height: 1.2;
	}
		.section2 p{
			margin: 0;
			padding: 0;
		}
		.section2 .container{
			padding-left: 0;
			padding-right: 0;
		}

	.section-fly{
		background: #75FBFD;
		color: var(--hoka-blue);
		font-size: 24px;
		font-weight: 500;
		letter-spacing: -0.02em;
	}

	.section-countdown{
		background: var(--hoka-sky) url(../images/hokacityrun.png) top center no-repeat;
		background-size: cover;
		color: var(--hoka-blue);
	}
		.section-countdown .siap{
			font-weight: 600;
			font-size: 20px;
			margin: 0 0 15px;
		}
		.section-countdown .wrap-countdown{
			margin: 400px 0 0;
		}
		
		.section .title{
			font-weight: 500;
			font-size: 32px;
			padding: 0;
			margin: 0;
		}

	.section-join{
		background-color: #fff;
		padding: 20px 0;
	}
	.section-detail{
		background: var(--hoka-blue) url(../images/detail.png) no-repeat center;
		background-size: cover;

	}

	.section-para .container{
		position: relative;
	}

	.section-white{
		background-color: #f2f2f2;
	}
	.section-white2{
		background-color: #fff;
	}
	.section-yellow{
		background-color: #FFFF55;
		color: var(--hoka-blue);
	}
	.section-purple{
		background-color: #6B2CE5;
	}
	.section-bluesky{
		background-color: #00ffff;
		color: var(--hoka-blue);
	}
	.section-green{
		background-color: #1DFF48;
	}
	.section-old-green{
		background-color: #006574;
	}

	.section-tnc{
		text-align: justify;
	}
		.section-tnc .title{
			text-align: center;
		}

	.section .tagline{
		font-size: 52px;
		font-weight: 700;
		letter-spacing: -1.56px;
		text-transform: uppercase;
		line-height: 0.8;
	}

	.section .img-full{
			width: 100vw;
			position: relative;
			left: 50%;
			transform: translateX(-50%);
		}
			.section .img-full img{
				width: 100%;
			}

.section-header{
	background: transparent url(../images/faq.png) top center no-repeat;
	background-size: cover;
	text-align: left;
	height: 50vw;
	padding: 0;
}
	.section-header .container{
		position: relative;
		height: 100%;
	}
	.section-header .title-faq{
		color: #FFFF08;
		font-size: 40px;
		font-style: normal;
		font-weight: 700;
		line-height: 1;
		letter-spacing: -0.8px;
		margin: 0;
		position: relative;
		top: 50%;
		transform: translateY(-50%);
	}

.section-news{
	padding: 0;
	background-color: #fff;
}
	.section-news header,
	.section-news content{
		display: block;
		position: relative;
		padding: 24px 0;
	}
	.section-news header{
		color: #6B2CE5;
		font-size: 32px;
		font-style: normal;
		font-weight: 450;
		letter-spacing: -0.96px;
		text-transform: uppercase;
		background: #fff;
		padding-bottom: 150px;
	}
		.section-news-2 header{
			padding-bottom: calc(30vw);
		}
		.section-news-purple header,
		.section-news-blue header{
			color: var(--hoka-blue);
		}
		.section-news header h3{
			color: #6B2CE5;
			font-size: 52px;
			font-style: normal;
			font-weight: 700;
			line-height: 50px;
			letter-spacing: -1.56px;
			text-transform: uppercase;
			padding: 0;
			margin: 0 0 10px;
			opacity: .5;
		}
			.section-news-purple header h3,
			.section-news-blue header h3{
				color: var(--hoka-blue);
			}
			.section-news-2 header h3{
				opacity: 1;
			}
			.section-news header h3.small{
				font-size: 50px;
			}
		.section-news header p{
			line-height: 1;
			margin: 0;
			padding: 0;
		}
		.section-news header .slider{
			margin: 24px 0 0;
			position: relative;
		}
			.section-news header .news-slider{
				position: absolute;
				top: 0;
				z-index: 3;
			}
	.section-news content{
		background: var(--hoka-blue);
		color: #FFF;
		font-size: 24px;
		font-style: normal;
		font-weight: 400;
		letter-spacing: -0.48px;
		line-height: 1.3;
		padding-top: 150px;
	}
		.section-news-2 content{
			padding-top: calc(30vw);
		}
		.section-news-purple content{
			background: rgba(107, 44, 229, 0.20);
			color: #494845;
		}
		.section-news-blue content{
			background: rgba(0, 255, 255, 0.20);
			color: #494845;
		}
		.section-news-yellow content{
			background: #ffff55;
			color: var(--hoka-blue);
		}
		.section-news-2.section-news-purple content{
			background: rgba(107, 44, 229, 1);
			color: #fff;
		}
		.section-news-2.section-news-blue content{
			background: rgba(0, 255, 255, 1);
			color: var(--hoka-blue);
		} 
	.section-news-tag{
		color: var(--hoka-sky, #0FF);
		font-size: 32px;
		font-style: normal;
		font-weight: 450;
		line-height: 37px;
		letter-spacing: -0.96px;
		text-transform: uppercase;
	}
		.section-news-tag span.fly-human-fly{
			display: inline-block;
			background: transparent url(../images/fly-human-fly-3.png) center no-repeat;
			width: 240px;
			height: 26px;
			background-size: 240px 26px;
		}
		.section-news content .quote{
			color: var(--hoka-sky, #0FF);
			font-size: 42px;
			font-style: normal;
			font-weight: 700;
			line-height: 40px;
			letter-spacing: -1.26px;
			text-transform: uppercase;
		}

.section-awaken-energy{
	background: transparent url(../images/awaken-bg-02.jpg) center no-repeat;
	background-size: cover;
	color: #fff;
	font-size: 21px;
	font-style: normal;
	font-weight: 400;
	line-height: 27px;
	letter-spacing: -0.48px;
}

.section-awaken-energy .btn-wrap{
		position: absolute;
		bottom: 20px;
		z-index: 2;
		left: calc(var(--bs-gutter-x) * .5);
		right: calc(var(--bs-gutter-x) * .5);
	}


.section-mach-x{
	background: #006574;
	color: #91FFB5;
	font-size: 24px;
	font-style: normal;
	font-weight: 400;
	line-height: 27px;
	letter-spacing: -0.48px;
}
	.section-mach-x .btn-wrap{
		position: absolute;
		bottom: 20px;
		z-index: 2;
		left: calc(var(--bs-gutter-x) * .5);
		right: calc(var(--bs-gutter-x) * .5);
	}

.section-club{
	padding: 0;
	background: rgb(233, 246, 249);
}
	.section-club iframe{
		width: 100%;
		height: 400px;
	}

.section-update{
	background: var(--hoka-sunshine, #FFFF08);
	color: var(--hoka-blue, #006FD3);
	font-size: 16px;
	font-style: normal;
	font-weight: 450;
	line-height: 16px;
	letter-spacing: -0.32px;
}
	.section-update .subtitle{
		font-size: 24px;
		font-style: normal;
		font-weight: 400;
		line-height: 27px;
		letter-spacing: -0.48px;
		text-transform: uppercase;
		margin: 0;
	}
	.section-update .title{
		font-size: 42px;
		font-style: normal;
		font-weight: 700;
		line-height: 40px;
		letter-spacing: -1.26px;
		text-transform: uppercase;
		margin: 0 0 24px;
	}
	.section-update .link{
		color: var(--hoka-blue, #006FD3);
		font-size: 21px;
		font-style: normal;
		font-weight: 450;
		line-height: normal;
		text-decoration-line: underline;
	}

.section-winners{
	background-image: url(../images/bg-winners-25.png);
	background-size: cover;
	background-position: center bottom;
	padding: 30px 0 200px;
}
.section-winners-bg75{
	background-image: url(../images/bg-winners-75.jpg);
	background-size: cover;
	background-position: center bottom;
}
.section-winners-bg125{
	background-image: url(../images/bg-winners-125.png);
	background-size: cover;
	background-position: center bottom;
}
.section-winners-bg125-green{
	background-image: url(../images/bg-winners-125-green.png);
	background-size: cover;
	background-position: center bottom;
}
	.section-winners .title{
		color: var(--hoka-blue, #006FD3);
		text-align: center;
		font-family: 'FuturaPT', sans-serif;
		font-size: 30px;
		font-weight: 700;
		line-height: 30px;
		letter-spacing: -0.9px;
		text-transform: uppercase;
		margin: 0 0 40px;
	}
		.section-winners .title b{
			font-size: 48px;
			line-height: 38px;
			letter-spacing: -1.44px;
		}

.section-winners-next{
	background: #6B2CE5;
	font-family: 'FuturaPT', sans-serif;
	font-size: 24px;
	color: var(--hoka-sky);
	text-align: center;
	font-weight: 450;
	padding: 40px 0;
}
	.section-winners-next .title{
		font-size: 52px;
		font-weight: 700;
		line-height: 46px;
		letter-spacing: -1.56px;
		text-transform: uppercase;
	}
	.section-winners-next .desc{
		font-size: 32px;
		line-height: 35px;
		letter-spacing: -0.96px;
		text-transform: uppercase;
	}
	.section-winners-next .cat{
		color: #fff;
		font-size: 32px;
	}
	.section-winners-next .date{
		font-size: 38px;
		font-weight: 700;
		letter-spacing: -1.14px;
		text-transform: uppercase;
		line-height: 1;
	}
	.section-winners-next .badge{
		position: relative;
		width: 225px;
	}
		.section-winners-next .badge img{
			width: 100%;
		}
	.section-winners-next .link{
		color: #fff;
		font-size: 21px;
		text-decoration-line: underline;
	}

.box-winner{
	text-align: center;
	position: relative;
	margin: 0 0 20px;
}
	.box-winner h4{
		/*color: var(--hoka-blue, #006FD3);*/
		color: var(--hoka-white, #F2F0EA);
		font-family: 'FuturaPT', sans-serif;
		font-size: 32px;
		font-style: normal;
		font-weight: 700;
		line-height: 40px;
		letter-spacing: -0.96px;
		text-transform: uppercase;
		margin: 0 0 10px;
	}
	.box-winner .price{
		position: relative;
	}
		.box-winner .price img{
			width: 100%;
		}

#footer{
	display: block;
	position: relative;
	padding: 0;
	text-align: left;
	background: #2A2A37;
	color: #fff;
	font-weight: 500;
	font-size: 18px;
}
	#footer .container{
		padding-top: 40px;
		padding-bottom: 40px;
	}
	#footer .logo{
		display: inline-block;
		text-decoration: none;
		outline: none;
		position: relative;
	}
	#footer .icon{
		display: inline-block;
		white-space: nowrap;
		text-decoration: none;
		outline: none;
		margin: 0 6px;
	}
		#footer .icon:first-child{
			margin-left: 0;
		}
	#footer .copyright{
		background: #fff;
		color: #2a2a37;
		font-size: 14px;
		font-weight: 450;
	}
		#footer .copyright .container{
			padding-top: 20px;
			padding-bottom: 20px;
		}
	#footer .link{
		font-weight: 450;
		font-size: 17px;
		line-height: 22px;
		color: #FFFFFF;
		text-decoration: none;
	}
		#footer .link:hover{
			text-decoration: underline;
		}

.wrap-countdown{
	display: block;
	position: relative;
	background: #fff;
	border-radius: 10px;
	padding: 15px;
}
.run-countdown{
	display: block;
}
	.run-countdown .label{
		display: inline-block;
		white-space: nowrap;
		position: relative;
		font-weight: 500;
		font-size: 18px;
		color: var(--hoka-blue);
		text-align: center;
		padding: 0;
		margin: 0 14px;
	}
		.run-countdown .label span{
			display: block;
		}
		.run-countdown .label .num{
			font-weight: 700;
			font-size: 32px;
		}

.form-join .form-label{
	color: #494845;
	font-size: 16px;
	margin: 0 0 10px;
}
	.form-join .form-label sup{
		color: var(--hoka-blue);
	}
	.form-join .form-label-block{
		display: block;
		position: relative;
	}
	.form-join .form-label .btn-link{
		float: right;
	}
	.form-join .form-label .desc{
		font-size: 14px;
		margin: 5px 0 0;
		padding: 0;
		color: rgba(73, 72, 69, 0.87);
		font-weight: 450;
	}

.form-join .form-control{
	color: #494845;
	font-size: 16px;
	padding: 12px 16px;
	background: #FFFFFF;
	border: 1px solid #CED4DA;
	border-radius: 5px;
}
	.form-join .phone{
		position: relative;
	}
		.form-join .phone:before{
			content: "+62";
			display: inline-block;
			font-size: 16px;
			position: absolute;
			top: 13px;
			left: 16px;
			opacity: .6;
		}
		.form-join .phone input{
			padding-left: 65px;
		}
	.form-join .password{
		position: relative;
	}
		.form-join .password span{
			content: "";
			display: inline-block;
			position: absolute;
			top: 16px;
			right: 16px;
			background: transparent url(../images/icon-eyeopen.png) center no-repeat;
			background-size: 20px 20px;
			width: 20px;
			height: 20px;
			cursor: pointer;
		}
			.form-join .password span.show{
				background-image: url(../images/icon-eyeclose.png);
			}
		.form-join .password input{
			padding-right: 50px;
		}
	.form-join label.check{
		display: block;
		background: rgba(73, 72, 69, 0.05);
		border-radius: 5px;
		padding: 15px;
		font-size: 16px;
		font-weight: 450;
		color: #494845;
		text-align: left;
		position: relative;
		cursor: pointer;
	}
		.form-join label.check .input,
		.form-join label.check .label{
			display: inline-block;
			margin: 0 13px 0 0;
			width: 7%;
			vertical-align: middle;
		}
		.form-join label.check .label{
			margin: 0;
			width: 85%;
		}
		.form-join label.check .input{
			position: relative;
			overflow: hidden;
		}
			.form-join label.check .input input{
				position: absolute;
				top: 0;
				left:	-50px;
			}
			.form-join label.check .input span{
				border: 2px solid var(--hoka-blue);
				border-radius: 3px;
				width: 18px;
				height: 18px;
				display: block;
				position: relative;
				background: #fff;
			}
				.form-join label.check .input span:before{
					content: "\2713";
					color: #fff;
					font-size: 17px;
					font-family: sans-serif;
					font-weight: normal;
					display: block;
					position: absolute;
					top: -6px;
					left: 0;
				}
				.form-join label.check .input input:checked + span{
					background: var(--hoka-blue);
				}

	.form-join .avatar{
		position: relative;
		width: 50%;
		text-align: center;
		display: inline-block;
	}
		.form-join .avatar .ava{
			display: inline-block;
			width: 92px;
			height: 92px;
			text-decoration: none;
			outline: none;
			position: relative;
			border-radius: 50%;
			overflow: hidden;
		}
			.form-join .avatar .ava img{
				width: 100%;
				height: auto;
				position: relative;
				top: 50%;
				transform: translateY(-50%);
			}
		.form-join .avatar .btn-change{
			text-decoration: none;
			outline: none;
			font-size: 16px;
			font-weight: 450;
			color: var(--hoka-blue);
		}

	.form-join .input-date{
		position: relative;
	}
		.form-join .input-date span{
			content: "";
			display: inline-block;
			position: absolute;
			top: 16px;
			right: 16px;
			background: transparent url(../images/icon-date.png) center no-repeat;
			background-size: 21px 21px;
			width: 21px;
			height: 21px;
			cursor: pointer;
		}

	.form-join .addon{
		position: relative;
	}
		.form-join .addon span{
			display: inline-block;
			position: absolute;
			top: 16px;
			right: 16px;
			color: #494845;
			font-size: 16px;
			font-weight: 450;
			opacity: .6;
		}

	.form-join .screenshot{
		width: 100%;
		position: relative;
		border-radius: 16px;
		overflow: hidden;
		cursor: pointer;
	}
		.form-join .screenshot img{
			width: 100%;
			height: auto;
		}
		.form-join .screenshot span{
			position: absolute;
			bottom: 20px;
			left: 50%;
			transform: translateX(-50%);
		}

#modal-join-success .title{
	font-weight: 600;
	font-size: 28px;
}

.section .fly{
	font-style: normal;
	font-weight: 500;
	font-size: 24px;
	letter-spacing: -0.02em;
	color: var(--hoka-sky);
}
	.section .fly p{
		margin: 0;
		padding: 0;
		line-height: 1.2;
	}
	.section .fly .tagline{
		font-size: 21px;
		font-weight: 600;
		letter-spacing: -0.63px;
		line-height: 30px;
	}
	.section .fly h3,
	.section .fly h4{
		font-style: normal;
		font-weight: 700;
		font-size: 72px;
		letter-spacing: -0.03em;
		text-transform: uppercase;
		margin: 0;
		padding: 0;
		line-height: 60px;
		position: relative;
	}
		.section .fly h4{
			font-size: 52px;
			line-height: 50px;
		}
		.section .fly h5{
			font-size: 42px;
			line-height: 1;
			font-weight: 700;
			letter-spacing: -1.26px;
			text-transform: uppercase;
			line-height: 40px;
		}
	.section .fly a{
		font-style: normal;
		font-weight: 700;
		font-size: 18px;
		text-decoration-line: underline;
	}
		.section .fly a:hover{
			text-decoration: none;
		}

	.section .fly-blue{
		color: var(--hoka-blue);
	}
	.section .fly-yellow{
		color: #FFFF08;
	}

	.section .fly-logo{
		width: 75%;
		max-width: 75%;
	}

.section-para .fly{
	position: relative;
	z-index: 9;
}

.section-6{
	background: var(--hoka-blue) url(../images/bg-summary.png) bottom center no-repeat;
	background-size: cover;
	background-attachment: scroll;
	padding: 34px 0;
	background-position: center top;
}
	.section-6 .fly{
		margin-bottom: 500px;
	}

.para{
	position: absolute;
	z-index: 7;
}
	[class*="para-img-"] img{
		width: 100%;
	}
	.para.para-img-1{
		top: 275px;
		width: 222px;
	}
	.para.para-img-2{
		top: 450px;
		right: 15px;
		z-index: 6;
		width: 156px;
	}

#modal-findout .modal-body{
	padding: 20px;
	position: relative;
	background: var(--hoka-sky) url(../images/bg-popup.png) center no-repeat;
	background-size: cover;
	text-align: left;
	color: var(--hoka-blue);
	font-weight: 500;
	font-size: 48px;
	letter-spacing: -1px;
}
	#modal-findout .modal-content{
		overflow: hidden;
	}
	#modal-findout .icon-close{
		display: block;
		border: none;
		outline: none;
		position: absolute;
		top: 10px;
		right: 10px;
		background: transparent url(../images/icon-close.png) center no-repeat;
		background-size: 38px 38px;
		z-index: 2;
		width: 38px;
		height: 38px;
	}
	#modal-findout .modal-content h4,
	#modal-findout .modal-content h6{
		font-style: normal;
		font-weight: 700;
		font-size: 48px;
		line-height: .7;
		letter-spacing: -1px;
		text-transform: uppercase;
	}
	#modal-findout .modal-content h6{
		font-size: 32px;
		line-height: 1;
	}
	#modal-findout .modal-content .link{
		font-weight: 400;
	}

.event-date{
	font-weight: 700;
	font-size: 52px;
	line-height: 50px;
	letter-spacing: -0.03em;
	color: var(--hoka-sky);
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	width: 150px;
}
	.section-yellow .event-date{
		color: var(--hoka-blue);
	}

.event-list{
	position: relative;
	margin: 0;
	padding: 0;
	list-style-type: none;
}
	.event-list li{
		margin: 0 0 10px;
		padding: 0;
		font-weight: 700;
		font-size: 26px;
		line-height: 33px;
		letter-spacing: -0.02em;
		color: var(--hoka-sky);
	}
		.event-list li:last-child{
			margin-bottom: 0;
		}
		.event-list li p{
			padding: 0;
			margin: 0;
			font-style: normal;
			font-weight: 450;
			font-size: 16px;
			line-height: 21px;
			color: #fff;
		}
	.section-yellow .event-list li{
		color: var(--hoka-blue) !important;
	}
	.section-yellow .event-list li p{
		color: #6B2CE5;
	}

.event-day{
	font-weight: 700;
	font-size: 38px;
	color: #fff;
	position: absolute;
	top: -10px;
	opacity: .3;
}
	.section-yellow .event-day{
		color: var(--hoka-blue);
	}

#modal-video .modal-content,
#modal-video .modal-body{
	padding: 0;
	background-color: transparent;
	border-radius: 0;
}

#sidemenu{
	position: fixed;
	z-index: 99;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: #fff;
	overflow: scroll;
	margin: 0;
	padding: 0;
	transition: all .5s ease-in;
}
	#sidemenu.open{
		left: 0;
	}
	#sidemenu .wrapper{
		position: relative;
		display: block;
		min-height: 100%;
		padding: 40px 20px 88px 20px;
		margin: 0;
		color: #494845;
		font-size: 16px;
		font-family: 'FuturaPT', sans-serif;
		font-weight: 500;
	}
	#sidemenu header{
		display: block;
		margin: 0 0 38px;
		position: relative;
		clear: both;
	}
		#sidemenu header .logo{
			display: inline-block;
			float: left;
			background: transparent url(../images/logo-lightblue.png) center no-repeat;
			background-size: 93px 26px;
			width: 93px;
			height: 26px;
			margin: 0;
			padding: 0;
			opacity: 1;
			outline: none;
			text-decoration: none;
		}
		#sidemenu header .btn-close{
			display: inline-block;
			float: right;
			background: transparent url(../images/btn-close.png) center no-repeat;
			background-size: 38px 38px;
			width: 38px;
			height: 38px;
			margin: -7px 0 0;
			padding: 0;
			opacity: 1;
			outline: none;
			text-decoration: none;
		}
	#sidemenu content{
		display: block;
		position: relative;
		margin: 0 0 38px;
		padding: 0;
	}
		#sidemenu content ul,
		#sidemenu content ul li{
			display: block;
			padding: 0;
			margin: 0;
			list-style: none;
			position: relative;
			width: 100%;
		}
			#sidemenu content ul li a{
				display: block;
				color: #494845;
				font-size: 16px;
				font-family: "FuturaPT", sans-serif;
				font-weight: 500;
				padding: 14px 15px;
				text-decoration: none;
				outline: none;
				background: transparent;
				border-right: 5px solid transparent;
			}
			#sidemenu content ul li a:hover,
			#sidemenu content ul li a:focus,
			#sidemenu content ul li a.active{
				color: #fff;
				background: #6B2CE5;
				border-right-color: var(--hoka-sky);
			}
	#sidemenu footer{
		display: block;
		position: absolute;
		z-index: 2;
		left: 0;
		right: 0;
		bottom: 0;
		background: #ddd;
		padding: 32px 15px;
		color: #494845;
		font-size: 16px;
		font-family: "FuturaPT", sans-serif;
		font-weight: 500;
	}
		#sidemenu footer .btn-account{
			display: inline-block;
			background: transparent url(../images/icon-user.png) left center no-repeat;
			background-size: 20px 20px;
			width: auto;
			height: 20px;
			margin: 0;
			padding: 0 0 0 40px;
			opacity: 1;
			text-decoration: none;
			outline: none;
			color: #494845;
			font-size: 16px;
			font-family: "FuturaPT", sans-serif;
			font-weight: 500;
			filter: brightness(0%);
		}

.logo-mach-x{
	width: 220px;
	height: 68px;
}

.section-period{
	background: var(--hoka-sky) url(../images/bg-period.png) center no-repeat;
	background-size: cover;
	padding: 50px 0;
}

.period-slider{
	position: relative;
	display: block;
}
	.period-slider .wrapper{
		position: relative;
		width: 100%;
	}
	.period-slider .item{
		display: block;
		text-decoration: none;
		outline: none;
		position: relative;
		margin: 0 40px;
	}
		.period-slider .item img{
			width: 100%;
			max-width: 100%;
			height: auto;
		}
			.period-slider .item.inactive img{
				filter: grayscale(100%) brightness(50%);
			}
	.period-slider .slick-arrow{
		position: absolute;
		z-index: 9;
		top: 50%;
		left: 0;
		border: none;
		background: transparent url(../images/icon-prev.png) center no-repeat;
		background-size: 35px 35px;
		width: 35px;
		height: 35px;
		font-size: 0;
		color: transparent;
		transform: translateY(-50%);
		opacity: 1;
	}
	.period-slider .slick-next{
		background-image: url(../images/icon-next.png);
		left: auto;
		right: 0;
	}
	.period-slider .slick-dots,
	.period-slider .slick-dots li{
		padding: 0;
		margin: 0;
		list-style: none;
		display: block;
		text-align: center;
	}
		.period-slider .slick-dots li{
			display: inline-block;
			margin: 0 3px;
		}
			.period-slider .slick-dots li button{
				display: block;
				border: none;
				background: #fff;
				font-size: 0;
				color: transparent;
				width: 5px;
				height: 5px;
				border-radius: 50%;
				padding: 0;
				margin: 0;
			}
			.period-slider .slick-dots li.slick-active button{
				width: 7px;
				height: 7px;
			}

.section-total{
	padding: 32px 0;
}
.total-title{
	color: #FFF;
	font-size: 32px;
	font-family: 'FuturaPT', sans-serif;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.96px;
	text-transform: uppercase;
	margin: 0;
	padding: 0;
}
.total-number{
	color: var(--hoka-sky);
	font-size: 52px;
	font-family: "FuturaPT", sans-serif;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -1.56px;
	text-transform: uppercase;
	margin: 0;
	padding: 0;
}
.total-desc{
	display: block;
	width: 100%;
	color: #FFF;
	font-size: 18px;
	font-family: "FuturaPT", sans-serif;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.54px;
	text-transform: uppercase;
	border-radius: 8px;
	background: #9572E7;
	padding: 8px;
}
.total-table{
	background: #fff;
	border-radius: 8px;
	padding: 14px 12px;
	display: block;
	position: relative;
	text-align: center;
}
	.total-table h5{
		color: #6B2CE5;
		font-size: 32px;
		font-family: "FuturaPT", sans-serif;
		font-weight: 700;
		line-height: 1;
		letter-spacing: -0.96px;
		text-transform: uppercase;
		margin: 0;
		padding: 0;
	}
	.total-table h3{
		color: #006FD3;
		font-size: 52px;
		font-family: "FuturaPT", sans-serif;
		font-weight: 700;
		line-height: 1;
		letter-spacing: -1.56px;
		text-transform: uppercase;
		margin: 0 0 10px;
		padding: 0;
	}
	.total-table table{
		border-collapse: collapse;
		width: 100%;
		table-layout: fixed;
		text-align: center;
	}
	.total-table table tr{
		border-bottom: 1px solid rgba(73, 72, 69, 0.15);
	}
	.total-table table tr:last-child{
		border-bottom-color: transparent;
	}
		.total-table table tr td{
			color: #494845;
			font-size: 14px;
			font-family: "FuturaPT", sans-serif;
			font-weight: 450;
			padding: 10px;
			width: 20%;
		}
		.total-table table tr td:nth-child(2){
			width: 50%;
		}
		.total-table table tr td:nth-child(3){
			width: 30%;
		}
		.total-table table tr.head td{
			color: #006FD3;
			font-size: 15px;
			font-family: "FuturaPT", sans-serif;
			font-weight: 600;
		}

.section-dashboard{
	padding: 0;
}
	.section-dashboard .bg-purple{
		position: relative;
		background: #6B2CE5;
		padding: 20px 0 100px;
	}
	.section-dashboard .bg-bluesky{
		position: relative;
		background: #0ff;
		padding: 0;
		height: 265px;
	}

	.section-dashboard .title{
		color: #0FF;
		font-size: 26px;
		font-family: "FuturaPT", sans-serif;
		font-weight: 500;
		padding: 0;
		margin: 0 0 20px;
	}

	.section-dashboard .profile{
		position: relative;
		margin: 0 0 20px;
	}
		.section-dashboard .profile .avatar,
		.section-dashboard .profile .info,
		.section-dashboard .profile .btn-edit{
			display: inline-block;
			vertical-align: middle;
			position: relative;
			margin: 0 15px 0 0;
		}
		.section-dashboard .profile .avatar{
			width: 72px;
			height: 72px;
			border-radius: 50%;
			overflow: hidden;
		}
			.section-dashboard .profile .avatar img{
				width: 100%;
				height: auto;
				position: relative;
				top: 50%;
				transform: translateY(-50%);
			}
		.section-dashboard .profile .info{
			color: #FFF;
			text-align: left;
			font-size: 16px;
			font-family: 'FuturaPT', sans-serif;
			font-weight: 500;
		}
			.section-dashboard .profile .info h3{
				font-size: 24px;
				font-family: 'FuturaPT', sans-serif;
				font-weight: 600;
				margin: 0;
				padding: 0;
			}
		.section-dashboard .profile .btn-edit{
			text-decoration: none;
			outline: none;
			background: transparent url(../images/icon-edit.png) center no-repeat;
			background-size: 33px 33px;
			width: 33px;
			height: 33px;
			margin: 0;
			position: absolute;
			top: 50%;
			right: 0;
			transform: translateY(-50%);
		}

	.section-dashboard .leader{
		position: relative;
		border-radius: 16px;
		background: linear-gradient(180deg, #1DFF48 0%, #FFFF08 100%);
		padding: 17px 15px;
		margin: 0 0 20px;
	}
		.section-dashboard .leader .icon,
		.section-dashboard .leader .info,
		.section-dashboard .leader .btn-leader{
			display: inline-block;
			vertical-align: middle;
			position: relative;
			margin: 0 15px 0 0;
		}
			.section-dashboard .leader .icon{
				background: transparent url(../images/icon-25k.png) center no-repeat;
				background-size: 40px 40px;
				width: 40px;
				height: 40px;
			}
				.section-dashboard .leader .icon-25{
					background-image: url(../images/icon-25k.png);
				}
				.section-dashboard .leader .icon-50{
					background-image: url(../images/icon-50k.png);
				}
				.section-dashboard .leader .icon-75{
					background-image: url(../images/icon-75k.png);
				}
				.section-dashboard .leader .icon-100{
					background-image: url(../images/icon-100k.png);
				}
			.section-dashboard .leader .info{
				color: var(--hoka-blue, #006FD3);
				text-align: left;
				font-size: 21px;
				font-family: 'FuturaPT', sans-serif;
				font-weight: 600;
			}
				.section-dashboard .leader .info sup{
					font-weight: 450;
				}
			.section-dashboard .leader .btn-leader{
				margin: 0;
				color: #CC4360;
				font-size: 14px;
				font-family: 'FuturaPT', sans-serif;
				font-weight: 450;
				text-decoration: underline;
				text-transform: uppercase;
				position: absolute;
				top: 50%;
				right: 15px;
				transform: translateY(-50%);
				line-height: 1;
			}
				.section-dashboard .leader .btn-leader:hover,
				.section-dashboard .leader .btn-leader:focus{
					text-decoration: none;
				}
	.section-dashboard .dashboard-menu{
		width: 100%;
		position: absolute;
		top: 100%;
		z-index: 2;
	}

.dashboard-menu{
	padding: 0;
	margin: 0;
	list-style: none;
	position: relative;
	background: #fff;
	border-radius: 16px;
	overflow: hidden;
	font-size: 14px;
	font-family: 'FuturaPT', sans-serif;
	color: var(--grey, #494845);
}
	.dashboard-menu li{
		display: block;
		position: relative;
		border-bottom: 1px solid rgba(73, 72, 69, 0.15);
	}
		.dashboard-menu li:after{
			content: "";
			display: block;
			position: absolute;
			top: 50%;
			right: 15px;
			width: 10px;
			height: 10px;
			border: 2px solid #494845;
			background: transparent;
			border-top: none;
			border-left: none;
			transform: rotate(-45deg) translateY(-50%);
		}
		.dashboard-menu li a{
			display: block;
			text-decoration: none;
			outline: none;
			position: relative;
			color: var(--grey, #494845);
			padding: 15px;
		}
		.dashboard-menu li h6{
			margin: 0;
			padding: 0;
			color: var(--hoka-blue, #006FD3);
			font-size: 16px;
			font-weight: 600;
		}

.run-history{
	padding: 0;
	margin: 0;
	list-style: none;
	position: relative;
}
	.run-history li{
		display: block;
		padding: 14px 0;
		border-bottom: 1px solid rgba(73, 72, 69, 0.15);
		color: #494845;
		font-size: 18px;
		font-weight: 450;
		line-height: 18px;
		position: relative;
	}
	.run-history li .screenshot,
	.run-history li .info{
		display: inline-block;
		vertical-align: middle;
		position: relative;
	}
	.run-history li .screenshot{
		width: 80px;
		height: 80px;
		position: relative;
		overflow: hidden;
		border-radius: 16px;
		margin: 0 14px 0 0;
		text-decoration: none;
		outline: none;
	}
		.run-history li .screenshot img{
			width: 100%;
			height: auto;
			position: relative;
		}
		.run-history li .info .date{
			color: var(--hoka-blue, #006FD3);
			font-size: 21px;
			font-weight: 600;
			line-height: 20px;
			padding: 0;
			margin: 0 0 6px;
		}
	.run-history li:after{
		content: "";
		display: block;
		position: absolute;
		z-index: 2;
		background: transparent url(../images/ic-rejected.png) center no-repeat;
		background-size: 32px 32px;
		width: 32px;
		height: 32px;
		top: 50%;
		transform: translateY(-50%);
		right: 0;
	}
		.run-history li.approved:after{
			background-image: url(../images/ic-approved.png);
		}

#modal-sort .modal-body{
	color: #000;
	font-size: 18px;
}
	#modal-sort .modal-body h4{
		color: #494845;
		text-align: center;
		font-size: 28px;
		font-weight: 600;
		text-transform: uppercase;
		padding: 0;
		margin: 0 0 15px;
	}
	#modal-sort .modal-body h6{
		color: #494845;
		font-size: 16px;
		font-weight: 450;
		opacity: .6;
		padding: 0;
		margin: 0 0 12px;
	}
	#modal-sort .modal-body p{
		padding: 0;
		margin: 0 0 12px;
	}
	#modal-sort .modal-body input[type=radio]{
		margin: 0 12px 0 0;
	}

.share-box{
	border-radius: 16px;
	background: var(--hoka-blue);
	margin: 100px 0;
	padding: 20px;
	color: #FFF;
	text-align: center;
	font-size: 18px;
}
	.share-box h4{
		font-size: 28px;
		font-weight: 600;
	}
	.share-box .social{
		text-decoration: none;
		outline: none;
		display: inline-block;
		margin: 0 10px;
		background: transparent url(../images/icon-link.png) center no-repeat;
		background-size: 42px 42px;
		width: 42px;
		height: 42px;
	}
	.share-box .social-whatsapp{
		background-image: url(../images/icon-whatsapp.png);
	}
	.share-box .social-instagram{
		background-image: url(../images/icon-instagram2.png);
	}
	.share-box .social-facebook{
		background-image: url(../images/icon-facebook2.png);
	}

.faq-content{
	position: relative;
	color: var(--hoka-blue);
	font-size: 21px;
	font-style: normal;
	font-weight: 400;
	letter-spacing: -0.42px;
	line-height: 1;
}
	.faq-content h3{
		font-size: 24px;
		font-style: normal;
		font-weight: 600;
		line-height: 27px;
		letter-spacing: -0.48px;
		text-transform: uppercase;
	}

.mekanisme-content{
	color: #494845;
	font-size: 16px;
	font-style: normal;
	font-weight: 450;
	line-height: normal;
}
	.mekanisme-content ol li{
		margin: 0 0 12px;
	}

.news-slider,
.news-slider .item{
	width: 100%;
	height: 56vw;
	position: relative;
}
	.news-slider .slick-arrow{
		position: absolute;
		z-index: 3;
		background: transparent url(../images/ic-right.png) center no-repeat;
		background-size: 36px 36px;
		width: 36px;
		height: 36px;
		font-size: 0;
		color: transparent;
		border: none;
		bottom: 3px;
		right: 3px;
	}
		.news-slider .slick-prev{
			right: 37px;
			background-image: url(../images/ic-left.png);
		}
	.news-slider .item img{
		width: 100%;
		height: auto;
		position: relative;
		top: 50%;
		transform: translateY(-50%);
	}

.hero-poster{
	position: relative;
	overflow: hidden;
	color: #FFF;
	font-size: 24px;
	font-style: normal;
	font-weight: 500;
	line-height: 27px;
	letter-spacing: -0.48px;
}
	.hero-poster.bg{
		background: var(--hoka-blue) center no-repeat;
		background-size: cover;
	}
	.hero-poster .bg{
		width: 100%;
		height: auto;
	}
	.hero-poster .wrap{
		width: 100%;
		position: absolute;
		top: 0;
		padding: 32px 0;
	}
		.hero-poster .wrap.bottom{
			top: auto;
			bottom: 0;
		}
		.hero-poster .wrap.green{
			color: #91FFB5;
		}
	.hero-poster .fly-human-fly{
		background: transparent url(../images/fly-human-fly-4.png) left center no-repeat;
		background-size: 257px 170px;
		height: 170px;
		color: transparent;
		margin: 0 0 20px;
	}

.section-price-info{
	background: linear-gradient(135deg, #A0CF74 0%, #FFF871 100%);
	color: var(--hoka-blue, #006FD3);
	text-align: center;
}
	.section-price-info.p50k{
		background: linear-gradient(180deg, #CC6446 0%, #E5CE6E 100%);
		color: #fff;
	}
	.section-price-info.p75k{
		background: linear-gradient(180deg, #B04F79 0%, #CB6648 100%);
		color: #fff;
	}
	/** .section-price-info.p100k{ */
	/**	background: linear-gradient(225deg, #B14C7C 0%, #548EC9 100%); */
	/**	color: #fff; */
	/**} */
	.section-price-info.p100k{
		background: linear-gradient(275deg, #B84482 0%, #3774B6 100%);
		color: #fff;
	}
/* 	.section-price-info.p125k{ */
/* 		background: linear-gradient(135deg, #5D9EE0 0%, #D5DB77 100%); */
/* 		color: #fff; */
/* 	} */
	.section-price-info.p125k{
		background: linear-gradient(275deg, #D9DD77 10%, #5D9EE0 100%);
		color: #fff;
	}
	.section-price-info h5{
		color: var(--hoka-blue, #006FD3);
		font-size: 38px;
		font-style: normal;
		font-weight: 700;
		line-height: 40px;
		letter-spacing: -1.14px;
		text-transform: uppercase;
		padding: 0;
		margin: 0 0 40px;
	}
		.section-price-info.p50k h5,
		.section-price-info.p75k h5,
		.section-price-info.p100k h5,
		.section-price-info.p125k h5{
			color: #fff;
		}
	.section-price-info .period{
		display: inline-block;
		background: transparent url(../images/icon-25k.png) center no-repeat;
		background-size: 225px 225px;
		width: 225px;
		height: 225px;
		margin: 0 0 40px;
	}
		.section-price-info.p50k .period{
			background-image: url(../images/icon-50k.png);
		}
		.section-price-info.p75k .period{
			background-image: url(../images/icon-75k.png);
		}
		.section-price-info.p100k .period{
			background-image: url(../images/icon-100k.png);
		}
		.section-price-info.p125k .period{
			background-image: url(../images/icon-125k.png);
		}
	.section-price-info .price{
		position: relative;
		padding: 20px 0;
		border-bottom: 1px solid #fff;
		text-align: center;
	}
		.section-price-info .price.noline{
			border: none;
		}
		.section-price-info .price.l75 img{
			width: 75%;
		}
.section-price-when{
	background: #6B2CE5;
	padding: 40px 0;
	color: var(--hoka-sky, #0FF);
	text-align: center;
	font-size: 24px;
	font-style: normal;
	font-weight: 450;
	line-height: 25px;
	letter-spacing: -0.72px;
}
	.section-price-when h4{
		font-size: 38px;
		font-style: normal;
		font-weight: 700;
		line-height: normal;
		letter-spacing: -1.14px;
		text-transform: uppercase;
	}
.section-price-how{
	background: #DBFAFB;
	color: #494845;
	font-size: 21px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: -0.42px;
}
	.section-price-how h5{
		color: var(--hoka-blue, #006FD3);
		font-size: 24px;
		font-style: normal;
		font-weight: 700;
		line-height: 27px;
		letter-spacing: -0.48px;
	}

img.hoka-club{
	width: 111px;
	height: 55px;
}

.club-update{
	display: block;
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}
	.club-update li{
		display: block;
		position: relative;
		margin: 0 0 30px;
		padding: 0;
		list-style: none;
	}
		.club-update li .date,
		.club-update li .info{
			display: inline-block;
			vertical-align: middle;
			position: relative;
		}
		.club-update li .date{
			color: #FFF;
			font-size: 18px;
			font-style: normal;
			font-weight: 700;
			line-height: 18px;
			letter-spacing: -0.54px;
			text-transform: uppercase;
			width: 80px;
			height: auto;
			text-align: center;
			background-color: var(--hoka-blue);
			margin: 0 15px 0 0;
			padding: 20px 0;
		}
			.club-update li .date b{
				font-size: 44px;
				line-height: 40px;
				letter-spacing: -1.32px;
			}
		.club-update li .info{
			font-size: 16px;
			font-style: normal;
			font-weight: 450;
			line-height: 16px;
			letter-spacing: -0.32px;
		}
		.club-update li .info .title{
			font-size: 18px;
			font-style: normal;
			font-weight: 700;
			line-height: 21px;
			letter-spacing: -0.36px;
			text-transform: uppercase;
			margin: 0 0 5px;
		}
		.club-update li .info p{
			margin: 0 0 5px;
		}
	.club-update li .info{
		width: 70%;
	}