@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
		@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@400;500;700&display=swap');
		
.active-h {
	color: #24adeb!important;
}

		.header-item {
		height: auto;
    background-color: #24adeb;
    margin-top: 16px;
    border-radius: 30px;
    padding: 10px 20px;
		}

		.nav-link:hover {
			color: #24adeb;
		}

		.pkonten a {
			color: #24adeb;
		}

		@media only screen and (max-width: 481px) {
		.posisikapalo1{
		margin-top: 0.2em!important;
		}
        .kapalo1{
        font-size: 2em!important;
        }
		}

@media only screen and (min-width: 481px) and (max-width: 768px) {
		.posisikapalo1{
		margin-top: 1.2em!important;
		}		
.kapalo1{
        font-size: 2.3em!important;
        }
		}
		
		
		@media only screen and (min-width: 768px) {
		
		html{
		font-size:14px;
		}
		.container-fluid{
			padding-left:5em!important;
			padding-right:5em!important;

		}
		
		.topnav .navbar-nav .nav-link:hover {
    color: #24ADEB!important;
		
		
		}
        }
		@media only screen and (min-width: 768px) and (max-width:1115px) {
		.kapalo1{
			font-family: poppins;
			font-size: 2.5em!important;
			line-height: 150%!important;
			}
			
			.isikapalo{
		    color: #FFF;
			font-family: Roboto;
			font-size: 1.1em;
			font-style: normal;
			font-weight: 400;
			line-height: 150%;
			margin-top: 20px;
			letter-spacing: 0.9px;
		}
		}
		
		@media only screen and (min-width: 1115px){
		.kapalo1{
			font-family: poppins;
			font-size: 4em!important;
			line-height: 150%!important;
			}
			
			.isikapalo{
		    color: #FFF;
			font-family: Roboto;
			font-size: 1.5em;
			font-style: normal;
			font-weight: 400;
			line-height: 150%;
			margin-top: 20px;
			letter-spacing: 0.9px;
		}
		}
		@media only screen and (max-width: 767px) {
		html{
		font-size:12px;
		}
		.divgambarunggulan{
		padding:padding: 0em 10em;
		}
		.hpilang{
		display:none!important;
		}
		.kapalo1{
		    font-family: poppins;
			
			line-height: 150%!important;
		}
		.isikapalo{
		    color: #FFF;
			font-family: Roboto;
			font-size: 1em;
			font-style: normal;
			font-weight: 400;
			line-height: 150%;
			margin-top: 20px;
			letter-spacing: 0.9px;
		}
		}
		#page-topbar {
			background-color:transparent!important;
		}
		.page-content{
			background-color:transparent;
			padding-left: 0px;
			padding-right: 0px;
			padding-bottom:0px!important;
		}
@media only screen and (max-width: 1700px) {
		.page-title-box{
		background-color:transparent;		
		height: 70vw;
		}
}
@media only screen and (min-width: 1701px) {
		.page-title-box{
		background-color:transparent;	
        height: 37vw;
		}
.gambaratas{
height:40vw;
overflow:hidden;
}
}

		.gambaratas{
		position: absolute;
			top: 0px;
			left: 0px;
		}
		
		.posisikapalo1{
			margin-top: 2.5em;
		}
		
		.palingatas{
		padding-top: 12em!important;
    padding-bottom: 6em!important;
    max-width: 100%!important;
    margin-top: -7em!important;
	}
	
		body, .main-content, .palingatas{
		background: var(--gradiaent, linear-gradient(117deg, #151837 5.13%, #295E8A 98.52%));
		}
		.labelkapalo{
		color: var(--CTA-Button, #24ADEB);
		text-align: center;
		font-family: Poppins;
		font-size: 1.2em;
		font-style: normal;
		font-weight: 700;
		line-height: 150%; /* 24px */
		}
		.kapalo2{
		color: var(--White, #FFF);
		text-align: center;
		font-family: Roboto;
		font-size: 2.5em;
		font-style: normal;
		font-weight: 900;
		line-height: 120%; /* 57.6px */
		
		}
		.pkonten{
		color: var(--nonaktif-buton, #FFF);
		font-family: Roboto;
		font-size: 1.2em;
		font-style: normal;
		font-weight: 400;
		line-height: 150%; 
		}
		
		.panjang{
		text-align:justify;
		}
		
		.akaki{
		color: var(--nonaktif-buton, #FFF)!important;
		text-decoration:none;
		font-family: Roboto;
		font-size: 1.2em;
		font-style: normal;
		font-weight: 400;
		line-height: 200%; 
		width:100%;
		
		
		}
		.pkontenbold{
		color: var(--nonaktif-buton, #FFF);
		font-family: Roboto;
		font-size: 1.5em;
		font-style: normal;
		font-weight: 700;
		line-height: 150%; 
		}
		
		
		.bagian{
		margin-top:5em;
		padding-top:1em;
		padding-bottom:2em;
		
		}
		.kapalo4{
		color: var(--White, #FFF);
text-align: center;
font-family: Roboto;
font-size: 1.4em;
font-style: normal;
font-weight: 700;
line-height: 140%; 
		}
		
		.kapalo5{
		color: var(--White, #FFF);
text-align: center;
font-family: Roboto;
font-size: 1.6em;
font-style: normal;
font-weight: 700;
line-height: 140%; 
text-align: left;
    padding-top: 2em;
    padding-bottom: 1em;
		}
		
		
		.imgproduk{
		margin-bottom:1.5em;
		}
		
		.btn-birumuda{
			font-family: Roboto;
			color: #fff;
			background-color: #24ADEB;
			padding: 11px;
			border-radius: 25px;
			min-width: 150px;
			
		}
		
		.btn-putih{
			font-family: Roboto;
			color: #24ADEB;
			background-color: #fff;
			padding: 11px;
			border-radius: 25px;
			min-width: 150px;
			
		}
		
		.btn-petak{
			border-radius: 5px!important;
			
			
		}
		
		.btn-hoverputih:hover{
		color: #40326E!important;
		background-color: #fff!important;
		}
		.btn-kosong{
			font-family: Roboto;
			color: #fff!important;
			border:none!important;
			outline: none!important;

			
		}
		
		.btn-kosong:focus,.btn-kosong:active {
		   outline: none !important;
		   box-shadow: none;
		}
		
		.btn-birumuda:hover{
		color:#FFFFFF;
		background-color:#111111;
		}
		
		.btn-putih:hover{
		color: #fff;
		background-color: #121127;
		}
		
		@media only screen and (min-width: 768px) {
		.ditangah{
		margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
		}
		}
		.panuah{
		margin-left:0px;
		margin-right:0px;
		padding-left:0px;
		padding-right:0px;
		background: var(--Gradiaent, linear-gradient(94deg, #0EC7FF 0.37%, #4462FF 98.33%));
		max-width:100%!important;
		padding-top:5em;
		padding-bottom:5em;
		margin-bottom: 10em;
		
		}
		.panuahbiru{
		margin-left:0px;
		margin-right:0px;
		margin-top:0px;
		padding-left:0px;
		padding-right:0px;
		background: var(--gradiaent, linear-gradient(117deg, #151837 5.13%, #295E8A 98.52%));
		max-width:100%!important;
		padding-top:7em;
		padding-bottom:7em;
		
		}
		
		.col-mitra{
		padding: 10px 20px;
		}
		
		.kaki{
		background:#121127!important;
		margin:0px!important;
		padding-bottom:0px!important;
		}
		.ini_a{
		text-decoration:none;
		color:#24ADEB;
		
		}
		.ini_a:hover{
		color:#fff;
		}