.c-circle-menu{
	position:fixed;
	bottom:50px;
	left:12px;
	z-index:1000;
	/* width:600px; */
	height:99px;
	border-radius:24px
}
@media (min-width:480px) and (min-height:480px){
	.c-circle-menu{
		width:96px;
		height:96px;
		border-radius:48px
}
}
.c-circle-menu__items{
	display:block;
	list-style:none;
	position:absolute;
	z-index:2;
	margin:0;
	padding:0
}
.c-circle-menu__item{
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:50px;
	height:50px;
	border-radius:0px;
	opacity:0;
	-webkit-transition:opacity,-webkit-transform;
	transition:opacity,-webkit-transform;
	transition:transform,opacity;
	transition:transform,opacity,-webkit-transform;
	-webkit-transition-duration:.3s,.3s;
	transition-duration:.3s,.3s;
	-webkit-transition-timing-function:cubic-bezier(.35,-.59,.47,.97);
	transition-timing-function:cubic-bezier(.35,-.59,.47,.97)
}
.c-circle-menu__item:nth-child(1){
	-webkit-transition-delay:.4s;
	transition-delay:.4s
}
.c-circle-menu__item:nth-child(2){
	-webkit-transition-delay:.3s;
	transition-delay:.3s
}
.c-circle-menu__item:nth-child(3){
	-webkit-transition-delay:.2s;
	transition-delay:.2s
}
.c-circle-menu__item:nth-child(4){
	-webkit-transition-delay:.1s;
	transition-delay:.1s
}
.c-circle-menu__item:nth-child(5){
	-webkit-transition-delay:0s;
	transition-delay:0s
}
.c-circle-menu.is-active .c-circle-menu__item{
	-webkit-transition-timing-function:cubic-bezier(.35,.03,.47,1.59);
	transition-timing-function:cubic-bezier(.35,.03,.47,1.59);
	opacity:1
}
.c-circle-menu.is-active .c-circle-menu__item:nth-child(1){
	-webkit-transition-delay:0s;
	transition-delay:0s;
	-webkit-transform:translate(+344px,-0);
	transform:translate(+160px,-0)
}
@media (min-width:480px) and (min-height:480px){
	.c-circle-menu__item{
		width:82px;
		height:82px;
		border-radius:10px;
		background-color:black;
}
	.c-circle-menu.is-active .c-circle-menu__item:nth-child(1){
		-webkit-transform:translate(+290px,0);
		transform:translate(+290px,0) 
}
}
.c-circle-menu.is-active .c-circle-menu__item:nth-child(2){
	-webkit-transition-delay:.1s;
	transition-delay:.1s;
	-webkit-transform:translate(+130px,-59px);
	transform:translate(+150px,-70px)
}
@media (min-width:480px) and (min-height:480px){
	.c-circle-menu.is-active .c-circle-menu__item:nth-child(2){
		-webkit-transform:translate(+254px,-99px);
		transform:translate(+254px,-99px)
}
}
.c-circle-menu.is-active .c-circle-menu__item:nth-child(3){
	-webkit-transition-delay:.2s;
	transition-delay:.2s;
	-webkit-transform:translate(+100px,-145px);
    transform:translate(+120px,-135px)
}
@media (min-width:480px) and (min-height:480px){
	.c-circle-menu.is-active .c-circle-menu__item:nth-child(3){
		-webkit-transform:translate(+204px,-204px);
		transform:translate(+204px,-204px)
}
}
.c-circle-menu.is-active .c-circle-menu__item:nth-child(4){
	-webkit-transition-delay:.3s;
	transition-delay:.3s;
	-webkit-transform:translate(+50px,-163px);
	transform:translate(+60px,-180px)
}
@media (min-width:480px) and (min-height:480px){
	.c-circle-menu.is-active .c-circle-menu__item:nth-child(4){
		-webkit-transform:translate(+111px,-267px);
		transform:translate(+111px,-267px)
}
}
.c-circle-menu.is-active .c-circle-menu__item:nth-child(5){
	-webkit-transition-delay:.4s;
	transition-delay:.4s;
	-webkit-transform:translate(-0,-210px);
	transform:translate(-0,-210px)
}
.c-circle-menu__link{
	display:block;
	width:100%;
	height:100%;
	border-radius:10px;
	box-shadow:inset 0 0 0 2px rgb(255, 179, 0)
}
@media (min-width:480px) and (min-height:480px){
	.c-circle-menu.is-active .c-circle-menu__item:nth-child(5){
		-webkit-transform:translate(0,-298px);
		transform:translate(0,-298px)
}
	.c-circle-menu__link{
		border-radius:10px
}
}
.c-circle-menu__link img{
	display:block;
	max-width:100%;
	height:auto
}
.c-circle-menu__link:hover{
	box-shadow:inset 0 0 0 2px #0019fd
}
.c-circle-menu__toggle{
	display:block;
	position:absolute;
	z-index:100;
	margin:0;
	padding:0;
	width:60px;
	height:60px;
	background-image: linear-gradient(360deg, rgb(255 193 25), rgb(233 202 119), rgb(251, 246, 188));
	box-shadow: rgb(0 0 0 / 33%) 0px 0px 1px, rgba(0, 0, 0, 0.66) 0px 0px 4px 0px, rgb(251 213 11) 0px 0px 5px 2px inset, rgb(249 0 0) 0px 0px 4px 3px inset;
	font:inherit;
	font-size:0;
	text-indent:-9999px;
	border-radius:10px;
	-webkit-transition:background .3s;
	transition:background .3s;
	cursor:pointer;
	border:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
}
@media (min-width:480px) and (min-height:480px){
	.c-circle-menu__toggle{
		width:60px;
		height:60px;
		border-radius:10px;
		background-color:black;
	    
}
}
.c-circle-menu__toggle.is-active,.c-circle-menu__toggle:focus,.c-circle-menu__toggle:hover{
	outline:0;
	background-color:#9e2000
}
.c-circle-menu__toggle span,.c-circle-menu__toggle span::after,.c-circle-menu__toggle span::before{
	display:block;
	position:absolute;
	height:4px;
	background:rgb(0, 0, 0);
	border-radius:0px
}
.c-circle-menu__toggle span{
	top:22px;
	left:10px;
	right:10px;
	-webkit-transition:background .3s;
	transition:background .3s
}
@media (min-width:480px) and (min-height:480px){
	.c-circle-menu__toggle span,.c-circle-menu__toggle span::after,.c-circle-menu__toggle span::before{
		height:7px;
		border-radius:0px
}
	.c-circle-menu__toggle span{
		top:25px;
		left:10px;
		right:10px;
		
}
}
.c-circle-menu__toggle span::after,.c-circle-menu__toggle span::before{
	left:0;
	width:100%;
	content:"";
	-webkit-transition-duration:.3s,.3s;
	transition-duration:.3s,.3s;
	-webkit-transition-delay:.3s,0s;
	transition-delay:.3s,0s
}
.c-circle-menu__toggle span::before{
	top:-8px;
	-webkit-transition-property:top,-webkit-transform;
	transition-property:top,-webkit-transform;
	transition-property:top,transform;
	transition-property:top,transform,-webkit-transform
}
.c-circle-menu__toggle span::after{
	bottom:-8px;
	-webkit-transition-property:bottom,-webkit-transform;
	transition-property:bottom,-webkit-transform;
	transition-property:bottom,transform;
	transition-property:bottom,transform,-webkit-transform
}
@media (min-width:480px) and (min-height:480px){
	.c-circle-menu__toggle span::before{
		top:-16px
}
	.c-circle-menu__toggle span::after{
		bottom:-16px
}
}
.c-circle-menu__toggle.is-active span{
	background:0 0
}
.c-circle-menu__toggle.is-active span::before{
	top:0;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	-webkit-transition-delay:0s,.3s;
	transition-delay:0s,.3s
}
.c-circle-menu__toggle.is-active span::after{
	bottom:0;
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);
	-webkit-transition-delay:0s,.3s;
	transition-delay:0s,.3s
}
.c-circle-menu__mask{
	position:fixed;
	top:0;
	left:0;
	z-index:1;
	visibility:hidden;
	opacity:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,.8);
	-webkit-transition:opacity .3s,visibility .3s;
	transition:opacity .3s,visibility .3s
}
.c-circle-menu__mask.is-active{
	opacity:1;
	visibility:visible
}
.riwayat-container {
	background: #ffffff;
	color: #222222;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	padding: 10px;
	font-size: 12px;
	border: 1px solid #222222;
}
.riwayat-box-2 {
	display: flex;
	flex-direction: column;
	width: 100%;
}
.riwayat-box-21 {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.riwayat-box-22 {
	display: flex;
	flex-direction: column;
}