html {
   	line-height: 1.15;
   }



   body {
   	margin: 0;
   }
   * {
   	box-sizing: border-box;
   	border-width: 0;
   	border-style: solid;
   }
   html {
   font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
   	font-size: 17px;
   }
   body {
   	font-weight: 400;
   	font-style: normal;
   	text-decoration: none;
   	text-transform: none;
   	letter-spacing: normal;
   	line-height: 1.15;
   	color: var(--dl-color-basiccolor-black);
   	background-color: var(--dl-color-basiccolor-white);
   	fill: var(--dl-color-basiccolor-black);
   }
   .under_tagline {
   	font-size: 20px;
   	font-style: italic;
   	text-align: center;
 
   	padding-bottom: 10px;
   }
   .hari21 {
   	text-align: left;
   	width: 100%;
   	max-width: 550px;
   	font-size: 18px;
   	margin-top: 15px;
   	margin-bottom: 10px;
   	padding: 20px 15px;
   	border: 0.25em solid transparent;
   	background: linear-gradient(white, white) padding-box, repeating-linear-gradient(-45deg, #f69ec4 0, #f69ec4 12.5%, transparent 0, transparent 25%, #7eb4e2 0, #7eb4e2 37.5%, transparent 0, transparent 50%) 0 / 1.25em 1.25em;
   	line-height: 24px;
   }
   .eksklusif {background-color: var(--dl-color-webcolor-color_90); color:#FFFFFF; border-radius:4px; padding:2px 10px;  font-size:22px; }
   .imoji {
   	font-size: 42px
   }
   .button, .input {
   	padding: .5rem 1rem
   }
   .button, .button-lg-2, .h1 {
   	text-align: center
   }
   .button-lg, .button-lg-2 {
   	font-size: x-large;
   	box-shadow: rgba(0, 0, 0, .35) 0 1px 5px;
   	transition: .5s
   }
   :root {
   	--dl-size-size-16px: 16px;
   	--dl-size-size-48px: 48px;
   	--dl-size-size-96px: 96px;
   	--dl-size-size-144px: 144px;
   	--dl-size-size-192px: 192px;
   	--dl-size-size-288px: 288px;
   	--dl-size-size-988px: 988px;
   	--dl-space-space-space_8: 8px;
   	--dl-space-space-space_16: 16px;
   	--dl-space-space-space_24: 24px;
   	--dl-space-space-space_32: 32px;
   	--dl-space-space-space_48: 48px;
   	--dl-space-space-space_64: 64px;
   	--dl-space-space-space_80: 80px;
   	--dl-space-space-space_98: 96px;
   	--dl-radius-radius-radius4: 4px;
   	--dl-radius-radius-radius8: 8px;
   	--dl-radius-radius-cardradius: 8px;
   	--dl-radius-radius-imageradius: 8px;
   	--dl-radius-radius-inputradius: 24px;
   	--dl-radius-radius-buttonradius: 24px;
   	--dl-color-basiccolor-black: #0B0C0B;
   	--dl-color-basiccolor-white: #ffffff;
   	--dl-color-othercolor-button: #20AC00
   }
 
   /* @font-face { */
   	/* font-family: Inter; */
   	/* font-style: normal; */
   	/* font-weight: 800; */
   	/* src: url(fonts/800.woff2) format('woff2'); */
   	/* font-display: swap */
   /* } */
   /* @font-face { */
   	/* font-family: Gloria Hallelujah; */
   	/* font-style: normal; */
   	/* font-weight: 600; */
   	/* src: url(fonts/GloriaHallelujah.woff2) format('woff2'); */
   	/* font-display: swap */
   /* } */
   /* @font-face { */
   	/* font-family: Oswald-Bold; */
   	/* font-weight: 900; */
   	/* src: url(fonts/Oswald-Bold.woff2) format('woff2'); */
   	/* font-display: swap */
   /* } */
   .input {
   	width: 100%
   }
   .textarea {
   	padding: .5rem
   }
   .button-lg, .button-lg-2, .button-secondary, .button-secondary:hover {
   	color: var(--dl-color-basiccolor-white)
   }
   .bg_produk {border-radius:10px; margin-top:25px;}
   .list {
   	width: 100%;
   	margin: 1em 0;
   	display: block;
   	padding: 0 0 0 1.5rem;
   	list-style-type: none;
   	list-style-position: outside
   }
   .section-container {
   	flex: 0 0 auto;
   	width: 100%;
   	display: flex;
   	position: relative;
   	align-items: center;
   	padding-top: var(--dl-space-space-space_48);
   	flex-direction: column;
   	padding-bottom: var(--dl-space-space-space_48)
   }
   .navigation-max-width {
   	margin-left: auto;
   	margin-right: auto;
   	padding: 10px;
   	border-bottom-width: 1px;
   	border-color: #cfcfcf;
   	max-width: 900px;
   	text-align: center;
   	color: #a52f2f;
   	font-size: 15px;
   }
   .max-content-container {
   	width: 100%;
   	display: flex;
   	z-index: 1;
   	max-width: 650px;
   	align-items: center;
   	padding-left: var(--dl-space-space-space_16);
   	padding-right: var(--dl-space-space-space_16);
   	flex-direction: column;
   	justify-content: center
   }
   .button-lg {
   	border: 1px solid #e1f9dc;
   	padding: 15px 30px;
   	background: linear-gradient(to bottom, #1e9e0c 5%, #5cb811 100%);
   	border-radius: 30px;
   	background-color: var(--dl-color-othercolor-button)
   }
   .button-lg-2 {
   	border: 1px solid #e1f9dc;
   	padding: 12px 18px;
   	background: linear-gradient(to bottom, #1e9e0c 5%, #5cb811 100%);
   	border-radius: 50px;
   	background-color: var(--dl-color-othercolor-button)
   }
   .h1, .title_1 {
   	font-size: 40px;
	text-align:center;
font-family: system-ui, sans-serif;
font-weight: 900;
letter-spacing: -0.06em;

   }
   .button-md {
   	padding: 12px 24px
   }
   .button-secondary {
   	cursor: pointer;
   	font-style: normal;
   	transition: .3s;
   	font-weight: 500;
   	line-height: 1;
   	border-color: transparent;
   	border-radius: var(--dl-radius-radius-radius4);
   	background-color: #ffffffff
   }
   .button-secondary:hover {
   	background-color: #d9232eff
   }
   .orderviawa {background-color:#25D366; padding:6px 12px; border-radius:18px;  text-decoration: none }
   .orderviawa img {margin-bottom:-5px;}
   .mobile-menu {
   	top: 0;
   	left: 0;
   	width: 100%;
   	height: 100vh;
   	padding: 32px;
   	z-index: 100;
   	position: absolute;
   	transform: translateX(100%);
   	transition: .5s;
   	flex-direction: column;
   	background-size: cover;
   	justify-content: space-between;
   	background-color: #fff
   }
   .thq-input, .thq-select {
   	background-color: #fbfaf9
   }
   .img_border {
   	width: 100%;
   	border: 2px solid #fff;
   	border-radius: 12px
   }
   .img_radius {
   	border-radius: 12px
   }
   .h1 {
   	font-weight: 700
   }
  .title_2 {
   	fill: #000000;
   	color: #000000;
   	font-weight: 800;
   	font-style: normal;
   	text-align: center;

   }
   .title_2 {
   	font-size: 38px
   }
   .max-width-650 {
   	max-width: 650px
   }
   .max-width-500 {
   	max-width: 500px
   }
   .max-width-420 {
   	max-width: 500px
   }
   .max-width-550 {
   	max-width: 550px
   }
   .thq-body-large {
   	font-size: 18px;
   	font-family: Noto Sans;
   	line-height: 1.5
   }
   .thq-body-small {
   	font-size: 16px;
   	line-height: 1.5
   }
   .thq-section-padding {
   	width: 100%;
   	display: flex;
   	position: relative;
   	max-width: 550px;
   	align-items: center;
   	flex-direction: column
   }
   .thq-section-max-width {
   	width: 100%
   }
   .thq-card {
   	width: 100%;
   	display: flex;
   	align-items: stretch;
   	border-radius: var(--dl-radius-radius-cardradius);
   	flex-direction: column
   }
   .navigation-icon2, .thq-icon-small {
   	width: 24px;
   	height: 24px
   }
   .Content {
   	font-size: 16px;

   	font-weight: 400;
   	line-height: 1.15;
   	text-transform: none;
   	text-decoration: none
   }

   .pertanyaanproblem-feature-card div {
   	font-size: 28px;
   	padding-right: 5px;
   }
   .pertanyaanproblem-feature-card {
   	color: #000;
   	width: 100%;
   	display: flex;
   	position: relative;
   	font-size: 18px;
   	max-width: 500px;
   	align-items: flex-start;
   	border-radius: 6px;
   	margin-bottom: 8px;
   	flex-direction: row;
   	padding: 12px 10px 10px;
   	justify-content: flex-start;
   	background-color: #fffef7;
   }
   .listdetail-feature-card, .listdetail2-feature-card, .listdetailprice-feature-card {
   	position: relative;
   	border-color: var(--dl-color-webcolor-color_50);
   	border-radius: 8px;
   	display: flex
   }
   .pertanyaanproblem-image {
   	width: var(--dl-size-size-48px);
   	margin-top: 2px;
   	object-fit: cover;
   	margin-right: var(--dl-space-space-space_8)
   }
   .pertanyaanproblem-text {
   	fill: var(--dl-color-basiccolor-black);
   	color: var(--dl-color-basiccolor-black);
   	font-size: 18px;
   	line-height: 24px;
   }
   .pertanyaanproblem-text b {
   	font-size: 20px
   }
   .listdetail-feature-card, .listdetail2-feature-card {
   	width: 100%;
   	font-size: 17px;
   	align-items: flex-start;
   	margin-bottom: 12px;
   	flex-direction: row;
   	padding: 12px 10px 6px;
   	justify-content: flex-start;
   	background-color: var(--dl-color-webcolor-color_10);
   	border-left-width: 0;
   	border-bottom-width: 3px
   }
   

   

   
   .listdetail-image, .listdetail2-image {
   	max-width: 32px;
   	object-fit: cover;
   	margin-right: 8px
   }
   .listdetail-image3 {
   	max-width: 64px;
   	object-fit: cover;
   	margin-right: 12px;
   	margin-top: 15px;
   	margin-left: 10px;
   }
   .listdetail-text, .listdetail2-text {
   	color: #000000;
   	font-size: 18px;
   	line-height: 24px;
   }
   .listdetail-text b, .listdetail2-text b {
   	font-size: 20px
   }
   .listdetail-text2 {
   	color: #000000;
   	padding-top: 15px;
   	padding-bottom: 15px;
   }
   .listdetail-text2 div {
   	margin-bottom: 10px;
   	font-size: 15px;
   	color: #474747;
   }
   .listdetail-text2 h3 {
   	margin-block-start: 5px;
   	margin-block-end: 5px;
   	font-size: 20px;
   }
   .listdetail-root-class-name30 {
   	background-color: transparent
   }
   .listdetail-root-class-name46 {
   	background-color: #ffffffff
   }
   .listdetailprice-feature-card {
   	width: 100%;
   	font-size: 17px;
   	align-items: center;
   	padding-top: var(--dl-space-space-space_8);
   	padding-left: 7px;
   	margin-bottom: 10px;
   	padding-right: 10px;
   	flex-direction: row;
   	padding-bottom: 6px;
   	justify-content: flex-start;
   	background-color: var(--dl-color-webcolor-color_50);
   	border-width: 1px
   }
   .listdetailprice-image {
   	max-width: 32px;
   	object-fit: cover;
   	margin-right: 6px
   }
   .listdetailprice-text {
   	color: #000000;
   	font-size: 18px;
   	font-style: normal;
   	font-weight: 500
   }
   .testimonial8-max-width {
   	gap: 64px;
   	width: 100%;
   	display: flex;
   	align-items: center;
   	flex-direction: row
   }
   .testimonial8-container {
   	align-items: start
   }
   .testimonial8-content {
   	grid-area: span 1/span 1/span 1/span 1
   }
   .testimonial8-column, .testimonial8-column2 {
   	top: 10%;
   	padding: var(--dl-space-space-space_16);
   	position: sticky;
   	transform: rotate(-2deg);
   	margin-bottom: 32px;
   	background-color: #fff
   }
   .testimonial8-stars, .testimonial8-stars1, .testimonial8-stars2 {
   	fill: #0ebd18;
   	display: flex;
   	align-items: center;
   	flex-direction: row
   }
  .home-text002, .testimonial8-root-class-name {
   	fill: var(--dl-color-basiccolor-black);
   	color: var(--dl-color-basiccolor-black)  ;
    font-family:"courier new"
   }
   .testimonial8-text {
   	height: auto;
   	margin-top: var(--dl-space-space-space_8);

   	margin-bottom: var(--dl-space-space-space_8)
   }
   .home-text001, .home-text048, .home-text061, .home-text082, .home-text107, .home-text151 {
   	font-family: "courier NEW"
   }
   .testimonial8-text1, .testimonial8-text4, .testimonial8-text7 {
   	height: auto;
   	font-style: normal;
   	font-weight: 600
   }
   .home-text009, .home-text013, .home-text016, .home-text020, .home-text025, .home-text029, .home-text031, .home-text035, .home-text038, .home-text044, .home-text066, .home-text074, .home-text076, .home-text078, .home-text080, .home-text087, .home-text095, .home-text099, .home-text101, .home-text112, .home-text120, .home-text149, .home-text167, .home-text185, .home-text190, .home-text195, .home-text201, .home-text203, .home-text207, .home-text214 {
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-weight: 700;
letter-spacing: -0.04em;
   }
   .home-text159 {    margin-top:10px; color:#514000
       }

.home-text214 h3 {margin-bottom:3px;}
   .home-text167 {
   	font-size: 30px;
   	padding: 8px;
   }
   .testimonial8-text2, .testimonial8-text5, .testimonial8-text8 {
   	height: auto
   }
   .testimonial8-column1 {
   	top: 10%;
   	padding: var(--dl-space-space-space_16);
   	position: sticky;
   	transform: rotate(2deg);
   	margin-bottom: 32px;
   	background-color: #ffffff
   }
   .testimonial8-text3, .testimonial8-text6 {
   	height: auto;
   	margin-top: var(--dl-space-space-space_8);
   	margin-bottom: var(--dl-space-space-space_8)
   }
   .home-container {
   	width: 100%;
   	display: flex;
   	position: relative;
   	min-height: 100vh;
   	overflow-x: hidden;
   	align-items: center;
   	flex-direction: column
   }
   .home-main {
   	flex: 0 0 auto;
   	width: 100%;
   	display: flex;
   	align-items: flex-start;
   	flex-direction: column
   }
   .home-hero {
   	padding-bottom: 0;
   	background-color: var(--dl-color-basiccolor-white)
   }
   .home-text001 {
   	font-size: 17px;
   	font-style: italic;
   	text-align: center;
   	padding-top: var(--dl-space-space-space_16);
	letter-spacing: -0.06em; color:green;
   }
   .home-heading-container {
   	flex: 1;
   	display: flex;
   	align-items: center;
   	flex-direction: column;
   	justify-content: center;
	max-width:550px;
   }

   .home-text010, .home-text018, .home-text027, .home-text042, .home-text097, .home-text177, .home-text197 {
   	text-decoration: underline
   }
   .home-image {
   	width: 100%;
   	margin-top: var(--dl-space-space-space_24);
   	margin-bottom: var(--dl-space-space-space_16)
   }
   .home-image01, .home-text007 {
   	margin-bottom: var(--dl-space-space-space_32)
   }
   .home-text007 {
   	color: var(--dl-color-basiccolor-black);
   	font-size: 26px;
   	align-self: center;
   	margin-top: var(--dl-space-space-space_16);
   	text-align: center;
   	line-height: 1.4
   }
   .home-link {
   	width: 100%;
   	display: flex;
   	flex-direction: row;
   	justify-content: center;
   	text-decoration: none
   }
   .home-image01 {
   	width: auto;
   	margin-top: var(--dl-space-space-space_24);
   	object-fit: cover
   }
   .home-portofolio {
   	padding-top: 0;
   	background-color: var(--dl-color-webcolor-color_50)
   }
   .home-text015, .home-text023, .home-text033, .home-text040 {
   	fill: var(--dl-color-basiccolor-white);
   	line-height: 1.4;
   	padding-top: var(--dl-space-space-space_16);
   	padding-left: var(--dl-space-space-space_24);
   	border-radius: var(--dl-radius-radius-radius8);
   	padding-right: var(--dl-space-space-space_24);
   	padding-bottom: var(--dl-space-space-space_16);
   	color: var(--dl-color-basiccolor-white);
   	align-self: center
   }
   .home-text033 span {
    font-size:17px;  margin-top:15px; } 
    

    
    
   .home-text040  span {
    font-size:18px;   }


   .home-image02, .home-image08 {
   	margin-top: 0;
   	object-fit: cover
   }
   .home-text012, .home-text030, .home-text037 {
   	max-width: 550px;
   	align-self: center;
   	text-align: center;
   	margin-bottom: var(--dl-space-space-space_24)
   }
   .home-text015, .home-text033, .home-text040 {
   	font-size: 20px;
   	margin-top: var(--dl-space-space-space_32);
   	text-align: center;
   	background-color: var(--dl-color-webcolor-color_90)
   }
   
     .home-text033  {
  margin-top:5px; } 
  
  
   .home-portofolio01 {
   	background-color: var(--dl-color-webcolor-color_10)
   }
   .home-features, .home-features03 {
   	width: 100%;
   	display: flex;
   	max-width: auto;
   	align-items: center;
   	flex-direction: column
   }
   .home-text016 {
   	font-size: 26px;
   	margin-bottom: var(--dl-space-space-space_8)
   }
   .home-image05, .home-text023 {
   	margin-bottom: var(--dl-space-space-space_16)
   }
   .home-text020 {
   	font-size: 54px;
   	text-align: center;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
font-weight: 800;
letter-spacing: -0.04em;
   }
   .home-text021, .home-text022 {
   	font-weight: 400;
   	margin-top: var(--dl-space-space-space_24)
   }
   .home-text021 {
   	font-size: 24px;
   	font-style: normal;
   	text-align: center
   }
   .home-text022 {
   	font-size: 18px;
   	font-style: italic
   }
   .home-text048 {
   	font-size: 18px;
   	text-align: center
   }
   .home-text047 {
   	text-align: center
   }
   .home-text047, .home-text048, .home-text105 {
   	font-style: normal
   }
   .home-image03, .home-image19 {
   	object-fit: cover
   }
   .home-text023 {
   	margin-top: var(--dl-space-space-space_16);
   	background-color: var(--dl-color-webcolor-color_90);
   	font-size: 18px;
   	padding-top: var(--dl-space-space-space_32);
   	padding-bottom: var(--dl-space-space-space_32);
   }
   .home-portofolio02, .home-portofolio03 {
   	background-color: var(--dl-color-basiccolor-white)
   }
   .home-image04, .home-image06, .home-image09, .home-image11, .home-image16, .home-image18, .home-image20, .home-image21, .home-image25, .home-image26, .home-image29 {
   	width: 100%;
   	max-width: 0;
   	align-self: center;
   	object-fit: cover;
   	border-radius: 10px
   }
   .home-portofolio02 {
   	padding-top: var(--dl-space-space-space_32);
   	padding-bottom: var(--dl-space-space-space_32)
   }
   .home-portofolio03, .home-portofolio04 {
   	padding-top: 0;
   	padding-bottom: var(--dl-space-space-space_32)
   }
   .home-image05 {
   	margin-top: 0;
   	object-fit: cover
   }
   .home-features01, .home-features02, .home-features04, .home-features05, .home-features06, .home-features09, .home-features10 {
   	color: var(--dl-color-basiccolor-white);
   	width: 100%;
   	display: flex;
   	max-width: auto;
   	align-items: center;
   	flex-direction: column
   }
   .home-container1, .home-container2 {
   	display: flex
   }
   .home-link1, .home-link2 {
   	width: 100%;
   	display: flex;
   	align-self: center;
   	margin-top: var(--dl-space-space-space_24);
   	flex-direction: row;
   	justify-content: center;
   	text-decoration: none
   }
   .home-text052, .home-text053, .home-text054, .home-text057, .home-text058, .home-text079 {
   	text-decoration: underline;
   	font-weight: 700
   }
   .home-text036, .home-text045 {
   	text-align: center
   }
   .home-image07 {
   	align-self: center;
   	object-fit: cover;
   	border-radius: 10px
   }
   .home-portofolio04 {
   	padding-left: 0;
   	padding-right: 0;
   	background-color: var(--dl-color-webcolor-color_50)
   }
   .home-text046 {
   	fill: var(--dl-color-basiccolor-black);
   	color: var(--dl-color-basiccolor-white);
   	align-self: center;
   	margin-top: var(--dl-space-space-space_48);
   	text-align: center;
   	font-weight: 700;
   	line-height: 1.3;
   	border-radius: var(--dl-radius-radius-radius8);
   	margin-bottom: var(--dl-space-space-space_8);
   	background-color: var(--dl-color-webcolor-color_90)
   }
   .home-image10, .home-image22 {
   	margin-top: var(--dl-space-space-space_16);
   	align-self: center
   }
   .home-text047 {
   	line-height: 1.5;
   	margin-bottom: 0
   }
   .home-image10, .home-image22 {
   	max-width: auto;
   	object-fit: cover;
   	border-radius: 10px;
   	margin-bottom: var(--dl-space-space-space_16)
   }
   .home-text048 {
   	align-self: center;
   	margin-top: 0;
   	font-weight: 700;
   	line-height: 1.4;
   	margin-bottom: var(--dl-space-space-space_8)
   }
   .home-text051, .home-text061, .home-text107 {
   	text-align: center;
   	line-height: 1.3;
   	align-self: center
   }
   .home-portofolio05 {
   	padding-top: var(--dl-space-space-space_32);
   	background-color: var(--dl-color-basiccolor-white)
   }
   .home-image12 {
   	margin-bottom: var(--dl-space-space-space_32)
   }
   .home-text051 {
   	font-size: 22px
   }
   .home-text052, .home-text053 {
   	font-size: 30px
   }
   .home-text060 {
   	background-color: var(--dl-color-theme-accent2)
   }
   .home-image13 {
   	margin-top: var(--dl-space-space-space_8);
   	object-fit: cover;
   	margin-bottom: var(--dl-space-space-space_8)
   }
   .home-text061, .home-text107 {
   	font-size: 24px;
   	border-radius: var(--dl-radius-radius-radius8);
   	background-color: var(--dl-color-webcolor-color_50)
   }
   .home-text062, .home-text083, .home-text108 {
   	fill: #000000;
   	color: #120303;
   	margin-top: var(--dl-space-space-space_16);
   	text-align: center;
   	margin-bottom: 0
   }
   .home-text065, .home-text072, .home-text111, .home-text118 {
   	fill: var(--dl-color-basiccolor-black);
   	text-align: center
   }
   .home-text065, .home-text111 {
   	color: var(--dl-color-basiccolor-black);
   	padding: var(--dl-space-space-space_24);
   	font-size: 1.15rem;
   	max-width: 500px;
   	margin-top: 0;
   	line-height: 28px;
   	padding-top: 12px;
   	padding-left: var(--dl-space-space-space_16);
   	border-radius: var(--dl-radius-radius-radius8);
   	margin-bottom: 0;
   	padding-right: var(--dl-space-space-space_16);
   	padding-bottom: var(--dl-space-space-space_16);
   	background-color: var(--dl-color-basiccolor-white)
   }
   .home-text067, .home-text088, .home-text113 {
   	font-weight: 700;
   	text-decoration: line-through
   }
   .home-text068, .home-text069, .home-text089, .home-text090, .home-text114, .home-text115 {
   	color: var(--dl-color-othercolor-button);
   	font-weight: 700;
   	text-decoration: underline
   }
   .home-text069, .home-text090, .home-text115 {
   	font-size: 1.55rem
   }
   .home-image14, .home-image15, .home-image17 {
   	width: 70%;
   	max-width: auto;
   	align-self: center;
   	margin-top: var(--dl-space-space-space_8);
   	object-fit: cover;
   	border-radius: 10px;
   	margin-bottom: var(--dl-space-space-space_8);  max-width:350px;
   }
   .home-text072, .home-text082, .home-text086, .home-text118 {
   	border-radius: var(--dl-radius-radius-radius8)
   }
   .home-container3 {
   	flex: 0 0 auto;
   	width: 100%;
   	height: auto;
   	display: flex;
   	max-width: 500px;
   	align-items: center;
   	flex-direction: column;
   	justify-content: center
   }
   .home-text072, .home-text118 {
   	color: var(--dl-color-basiccolor-black);
   	padding: var(--dl-space-space-space_24);
   	font-size: 1rem;
   	max-width: 350px;
   	margin-top: 0;
   	line-height: 1.4;
   	margin-bottom: 0;
   	background-color: var(--dl-color-webcolor-color_10)
   }
   .home-text077, .home-text102, .home-text104 {
   	font-style: normal;
   	font-weight: 400
   }
   .home-text105, .home-text143, .home-text152 {
   	font-weight: 700
   }
   .home-portofolio06 {
   	padding-top: var(--dl-space-space-space_48);
   	padding-left: 0;
   	padding-right: 0;
   	background-color: var(--dl-color-webcolor-color_10)
   }
   .home-text082 {
   	font-size: 24px;
   	align-self: center;
   	text-align: center;
   	line-height: 1.3;
   	background-color: #fff
   }
   .home-text086, .home-text093 {
   	fill: var(--dl-color-basiccolor-black);
   	color: var(--dl-color-basiccolor-black);
   	font-size: 1rem;
   	margin-top: 0;
   	margin-bottom: 0;
   	text-align: center;
   	max-width: 350px
   }
   
 
   
   .home-text086 {
   	padding: var(--dl-space-space-space_24);
   	line-height: 28px;
   	padding-top: 12px;
   	padding-left: var(--dl-space-space-space_16);
   	padding-right: var(--dl-space-space-space_16);
   	padding-bottom: var(--dl-space-space-space_16);
   	background-color: var(--dl-color-webcolor-color_10)
   }
   .home-text093, .home-text126, .home-text165, .home-text181, .home-text184, .home-text213 {
   	line-height: 1.4
   }
   .home-text165 {
       margin-top:15px;
   }

   .home-portofolio07, .home-text093 {
   	background-color: var(--dl-color-basiccolor-white)
   }
   .home-text093 {
   	padding: var(--dl-space-space-space_24);
   	border-radius: var(--dl-radius-radius-radius8);
   }
   .home-text126, .home-text142 {
   	font-size: 20px;
   	border-radius: var(--dl-radius-radius-radius8)
   }
   .home-portofolio07 {
   	padding-top: var(--dl-space-space-space_48);
   	padding-left: 0;
   	padding-right: 0
   }
   .home-portofolio08 {
   	padding: 0
   }
   .home-portofolio09 {
   	padding-top: var(--dl-space-space-space_48);
   	padding-bottom: var(--dl-space-space-space_32);
   	background-color: var(--dl-color-webcolor-color_90)
   }
   .home-features07 {
   	width: 100%;
   	max-width: 500px;
   	margin-bottom: var(--dl-space-space-space_16);
   	flex-direction: column
   }
   .home-features08 {
   	display: flex;
   	flex-direction: column
   }
   .home-text123 {
   	fill: var(--dl-color-basiccolor-white);
   	color: var(--dl-color-basiccolor-white);
   	margin-top: var(--dl-space-space-space_16);
   	text-align: center;
   	margin-bottom: var(--dl-space-space-space_32)
   }
   .home-text126 {
   	fill: var(--dl-color-basiccolor-black);
   	color: var(--dl-color-basiccolor-black);
   	padding: var(--dl-space-space-space_32);
   	max-width: 500px;
   	margin-top: 0;
   	text-align: center;
   	padding-left: var(--dl-space-space-space_16);
   	padding-right: var(--dl-space-space-space_16);
   	background-color: var(--dl-color-basiccolor-white)
   }
   .home-text139, .home-text142 {
   	color: #120303;
   	text-align: center;
   	fill: #000000;
   	line-height: 26px;
   }
   .home-portofolio10, .home-portofolio11 {
   	padding-top: var(--dl-space-space-space_48);
   	padding-left: 0;
   	padding-right: 0;
   	padding-bottom: var(--dl-space-space-space_48);
   	background-color: var(--dl-color-webcolor-color_10)
   }
   .home-portofolio11 {
   	background-color: var(--dl-color-webcolor-color_50)
   }
   .home-text139 {
   	margin-top: var(--dl-space-space-space_16);
   	margin-bottom: 0
   }
   .home-text142 {
   	padding: var(--dl-space-space-space_32);
   	margin-top: 0;
   	padding-left: var(--dl-space-space-space_16);
   	margin-bottom: var(--dl-space-space-space_16);
   	padding-right: var(--dl-space-space-space_16);
   	background-color: var(--dl-color-basiccolor-white)
   }
   .home-text143, .home-text144 {
   	color: var(--dl-color-othercolor-button);
   	font-size: 28px;  line-height:32px;
   }
   .home-image23, .home-text151 {
   	margin-bottom: var(--dl-space-space-space_8)
   }
   .home-container4 {
   	flex: 0 0 auto;
   	width: 100%;
   	display: flex;
   	align-items: center;
   	justify-content: center
   }
   .home-pricing {
   	display: flex;
   	align-items: center;
   	padding-top: 0;
   	flex-direction: column;
   	padding-bottom: var(--dl-space-space-space_24)
   }
   .home-image23 {
   	margin-top: var(--dl-space-space-space_24);
   	object-fit: cover
   }
   .home-text151 {
   	fill: #000000;
   	color: #120303;
   	font-size: 24px;
   	max-width: 550px;
   	align-self: center;
   	text-align: center
   }
   .home-text152 {
   	color: #333232;
   	width: auto;
   	font-size: 2.3rem;
   	max-width: 500px;
   	text-align: center;

   }
   .home-image24, .home-link3 {
   	width: 100%;
   	margin-top: var(--dl-space-space-space_24); margin-bottom:10px;
   }
   .home-image24 {
   	align-self: center;
   	object-fit: cover;
   	border-radius: 10px;
   	margin-bottom: var(--dl-space-space-space_24)
   }
   .home-text155 {
   	font-size: 24px;
   	margin-top: var(--dl-space-space-space_24);
   	margin-bottom: var(--dl-space-space-space_16)
   }
   .home-text156, .home-text161 {
   	font-size: 2.1rem;
   	font-weight: 700;
   	text-align: center
   }
   .home-text156 {
   	margin-bottom: var(--dl-space-space-space_8)
   }
   .home-text156 span {
       font-size:28px;
   }

   .home-text163, .home-text211 {
   	text-decoration: line-through
   }
   .home-text164, .home-text165 {
   	color: var(--dl-color-basiccolor-white);
   	font-size: 2.5rem;
   	background-color: var(--dl-color-webcolor-color_90);
   	border-radius: 10px;
   }
   .home-link3 {
   	display: flex;
   	flex-direction: row;
   	justify-content: center;
   	text-decoration: none
   }
   .home-text171 {
   	font-size: 16px;
   	margin-top: var(--dl-space-space-space_24)
   }
   .home-text172 {
   	border: 2px dashed #d10003;
   	padding: var(--dl-space-space-space_8);
   	max-width: 400px;
   	font-style: italic;
   	margin-top: var(--dl-space-space-space_32);
   	text-align: center;
   	padding-top: var(--dl-space-space-space_16);
   	padding-left: var(--dl-space-space-space_16);
   	border-radius: var(--dl-radius-radius-radius8);
   	padding-right: var(--dl-space-space-space_16);
   	padding-bottom: var(--dl-space-space-space_16)
   }
   .home-container6, .home-container7 {
   	padding-top: var(--dl-space-space-space_48);
   	width: 100%;
   	display: flex
   }
   .home-container5 {
   	width: 100%;
   	justify-content: center;
   	background-color: var(--dl-color-webcolor-color_10)
   }
   .home-text175 {
   	fill: #000000;
   	color: #120303;
   	margin-top: var(--dl-space-space-space_16);
   	text-align: center;
   	margin-bottom: var(--dl-space-space-space_32)
   }
   .home-footer, .home-max-width1 {
   	color: var(--dl-color-basiccolor-white)
   }
   .home-image27, .home-text180 {
   	margin-bottom: var(--dl-space-space-space_16)
   }
   .home-container6 {
   	padding-bottom: var(--dl-space-space-space_48);
   	justify-content: center;
   	background-color: var(--dl-color-webcolor-color_90)
   }
   .home-max-width1 {
   	text-align: center;
   	align-items: center;
   	flex-direction: column;
   	justify-content: space-between
   }
   .home-image27 {
   	object-fit: cover
   }
   .home-text180 {
   	font-size: 32px
   }
   .home-text181 {
   	font-size: 20px
   }
   .home-container7 {
   	justify-content: center
   }
   .home-features12 {
   	width: 100%;
   	display: flex;
   	max-width: auto;
   	align-items: center;
   	margin-bottom: var(--dl-space-space-space_48);
   	flex-direction: column
   }
   .home-image28 {
   	width: 100px;
   	margin-bottom: var(--dl-space-space-space_24)
   }
   .home-text184 {
   	text-align: left;
   	margin-bottom: var(--dl-space-space-space_32)
   }
   .home-link4 {
   	width: 100%;
   	text-decoration: none;
   	text-align: center
   }
   .home-container8 {
   	width: 100%;
   	display: flex;
   	padding: 15px;
   	padding-top: var(--dl-space-space-space_32);
   	padding-bottom: var(--dl-space-space-space_32);
   	justify-content: center;
   	background-color: var(--dl-color-webcolor-color_10)
   }
   .home-features13 {
   	width: 100%;
   	display: flex;
   	max-width: 800px;
   	align-items: center;
   	padding-left: 0;
   	padding-right: 0;
   	flex-direction: column
   }
   .home-text213 {
 
   	text-align: center;
   	font-weight: 300
   }
   .home-footer {
   	padding-top: 10px;
   	
   }
   .transfer {
   	width: 100%;
   	max-width: 350px;
   	margin-top: 15px;
   }
   .modul {
   	margin-bottom: 10px;
   }
   .modul h1 {
   	background-color: #007BFF;
   	color: white;
   	padding: 20px 0;
   	text-align: center;
   	margin: 0;
   }
   .modul span {
   	background-color: var(--dl-color-webcolor-color_90);
   	color: white;
   	padding: 15px 20px;
   	margin: 0;
   	border-radius: 10px;
   	margin-top: 20px;
   	opacity: 0.8;
   }
   .modul ul {
   	list-style-type: none;
   	padding: 0;
   	margin: 0;
   }
   .modul li {
   	background: #ffffff;
   	margin: 10px 0px;
   	padding: 15px;
   	border-radius: 8px;
   	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
   	transition: transform 0.3s ease;
   }
   .modul li:hover {
   	transform: scale(1.02);
   }
   .modul b {
   	background-color: var(--dl-color-webcolor-color_50);
   	border-radius: 4px;
   	padding: 0px 4px;
   }
   .accordion {
   	width: 100%;
   	max-width: 800px;
   	margin: 0 auto;
   }
   .accordion-item {
   	background-color: #fff;
   	border: 1px solid #ddd;
   	border-radius: 4px;
   	margin-bottom: 10px;
   	overflow: hidden;
   	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   }
   .accordion-header {
   	background-color: ffffff;
   	color: #000000;
   	cursor: pointer;
   	padding: 15px;
   	border: none;
   	outline: none;
   	text-align: left;
   	font-size: 17px;
   	transition: background-color 0.3s ease;
   	display: flex;
   	align-items: center;
   	justify-content: space-between;
   	line-height: 22px;
   }
   .accordion-header:hover {
   	background-color: #e6e6e6;
   }
   .accordion-icon {
   	transition: transform 0.3s ease;
   	color: #BDBDBD;
   	margin-left: 15px;
   }
   .accordion-content {
   	display: none;
   	padding: 15px;
   	border-top: 1px solid #ddd;     
   }
   .accordion-content p {
   	margin: 0;            line-height:22px;
   }
   @media (max-width:550px) {
   	.hari21 {
   		width: 95%;
   		margin-bottom: 25px;
   	}
   	.home-text167 {
   		font-size: 24px;
   		padding: 6px;
   	}
   	.button-lg {
   		padding: 10px 30px
   	}
   	.mobile-menu {
   		padding: 16px
   	}
   	.h1 {
   		font-size: 32px
   	}

   	.title_2 {
   		font-size: 34px;
   		font-weight: 700
   	}
   	.mobile_padding {
   		padding-left: 15px;
   		padding-right: 15px
   	}
   	.pertanyaanproblem-feature-card div {
   		font-size: 32px;
   	}
   	.pertanyaanproblem-feature-card {
   		padding: var(--dl-space-space-space_8);
   		padding-top: var(--dl-space-space-space_16);
   		padding-bottom: var(--dl-space-space-space_16)
   	}
   	.listdetail-image, .listdetail2-image, .listdetailprice-image, .pertanyaanproblem-image {
   		margin-right: var(--dl-space-space-space_8)
   	}
   	.pertanyaanproblem-text {
   		font-size: 18px
   	}
   	.listdetail-feature-card, .listdetail2-feature-card {
   		padding-top: 8px;
   		margin-bottom: 10px;
   		padding-bottom: 8px
   	}
   	.listdetailprice-feature-card {
   		padding-top: 8px;
   		margin-bottom: 5px;
   		padding-bottom: 8px
   	}
   	.home-text002 {
   		color: var(--dl-color-basiccolor-black)
   	}
   	.home-text006, .home-text007 {
   		margin-bottom: var(--dl-space-space-space_24)
   	}
   	.home-text011, .home-text016, .home-text022, .home-text155, .home-text167, .home-text209, .home-text217 {
   		text-align: center
   	}
   	.home-image03, .home-image07, .home-image12 {
   		width: 100%
   	}
   	.home-image04, .home-image06, .home-image07, .home-image09, .home-image11, .home-image16, .home-image18, .home-image20, .home-image21, .home-image25, .home-image26, .home-image29 {
   		border-radius: 0
   	}
   	.home-text001 {
   		font-size: 16px;
   		font-style: italic;
  
   		padding-bottom: 0;
   	}
   	.home-text002 {
   		line-height: 1.3;

   		font-size: 36px;
   	}
   	.home-text006 {
   		color: var(--dl-color-text-text1);
   		font-size: 32px;
   		font-weight: 700;
   		padding-left: 0;
   		padding-right: 0
   	}
   	.home-text007 {
   		font-size: 20px
   	}
   	.home-link, .home-link3, .home-link4 {
   		
   		font-size: 24px;
   		
   	}
   	.home-text011 {
   		font-size: 24px
   	}
   	.home-text020 {
   		font-size: 42px
   	}
   	.home-text021 {
   		font-size: 20px
   	}
   	.home-text022 {
   		font-size: 20px;
   		font-style: italic;
   		font-weight: 400
   	}
   	.home-portofolio02 {
   		padding-top: var(--dl-space-space-space_8)
   	}
   	.home-text048, .home-text049 {
   		font-size: 20px
   	}
   	.home-features07 {
   		padding: var(--dl-space-space-space_8);
   		margin-bottom: var(--dl-space-space-space_8)
   	}
   	.home-text123 {
   		margin-top: 0
   	}
   	.home-portofolio10 {
   		padding: 15px
   	}
   	.home-pricing {
   		padding-top: var(--dl-space-space-space_16)
   	}
   	.home-text152 {
   		padding: var(--dl-space-space-space_8);
   		font-size: 2.2rem
   	}
   	.home-text156, .home-text161 {
   		font-size: 1.8rem;
   		padding-left: var(--dl-space-space-space_16);
   		padding-right: var(--dl-space-space-space_16)
   	}
   	.home-text172 {
   		font-size: 1.15rem;
   		font-style: italic;
   		padding-left: 5px;
   		padding-right: 5px
   	}
   	.home-portofolio11 {
   		padding: 15px;
   	}
   	.home-text175 {
   		margin-top: var(--dl-space-space-space_24)
   	}
   	.home-text211 {
   		text-decoration: line-through;
   	}
   	.home-features13 {
   		padding-left: var(--dl-space-space-space_8);
   		padding-right: var(--dl-space-space-space_16);
   	}
   	.home-text213 {
   		width: auto
   	}
   }
   .bg_color90 {
   	background-color: var(--dl-color-webcolor-color_90);
   }
   .bg_color50 {
   	background-color: var(--dl-color-webcolor-color_50);
   }
   .bg_color10 {
   	background-color: var(--dl-color-webcolor-color_10);
   }
   .bg_white {
   	background-color: var(--dl-color-basiccolor-white);
   }
   
   
   
   
  /* ============ TAMBAHAN */
  
  .link_button span {
    	text-shadow: 0px -1px 7px rgba(137, 144, 142, 1);
    }
    .link_button {
    	
    	position: fixed;
    	left: 50%;
    	bottom: 0px;
    	transform: translate(-50%, -50%);
    	padding: 12px 0px;
    	padding-top: 14px;
    	background-color: blue;
    	color: white;
    	text-align: center;
    	text-decoration: none;
    	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    	z-index: 1000;
    	font-size: 19px;
    	width: 100%;
    	max-width:650px;
    	box-shadow: inset 0px 1px 0px 0px #caefab;
    	background: linear-gradient(to bottom, #77d42a 5%, #5cb811 100%);
    	background-color: #77d42a;
    	border: 1px solid #268a16;
    	margin-bottom: -25px;
    	box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.5);
    	/* Adjust shadow properties as needed */
    }
    .blink {
    	animation: blink-animation 1s steps(5, start) infinite;
    	-webkit-animation: blink-animation 1s steps(5, start) infinite;
    }
    @keyframes blink-animation {
    	to {
    		visibility: hidden;
    	}
    }
    @-webkit-keyframes blink-animation {
    	to {
    		visibility: hidden;
    	}
    }
	
	
  /* ============ TAMBAHAN */
  
  
  .popup_user-container {
	display: flex;
	justify-content: right;
	padding-right: 0px;
	padding-left: 0px;
	align-items: flex-start;
	position: fixed;
	top: 10px;
	/* Mengatur jarak dari atas sejauh 10px */
	left: 0;
	width: 100%;
	max-height: calc(100% - 20px);
	/* Mengatur tinggi maksimum sesuai dengan jarak dari atas */
	pointer-events: none;
	overflow-y: auto;
	/* Menambahkan overflow-y untuk mengaktifkan scrollbar jika diperlukan */
	z-index: 9999;
	margin-top: -11px;
}
.popup_user {
	width: 100%;
	color: #3b3b3b;
	max-width: 400px;
	/* Mengganti width menjadi max-width */
	padding: 4px;
	text-align: left;
	padding-bottom: 10px;
	/* Menambahkan padding-bottom untuk menyembunyikan bagian bawah popup */
	transition: transform 0.5s ease-in-out;
	transform: translateY(-100%);
	z-index: 9999;
	background: no-repeat;
	background-size: 40px;
	padding-left: 55px;
	background-position: top 8px left 10px;
	background-color: #f5faf5;
	opacity: 1;
	padding-top: 10px;
	border-radius: 2px;
	border: 1px solid #d0d9d3;
}

@media (max-width:770px) {
	.popup_user {margin-left:auto; margin-right:auto;}
	
	
.popup_user {
	width: 100%;
	
}
}


.popup_user strong {
	font-size: 17px;
}
.popup_user i {
	font-style: normal;
	color: #068394;
	font-size: 11px;
	float: right;
	margin-top: 8px;
	margin-right: 15px;
	margin-bottom: -5px;
}
.popup_user span {
	
	
	/* Gambar diatur sebagai background */
	/*background-size: 17px;
	padding-left: 2px;
	display: inline-block;
	/* Untuk menjaga tinggi elemen */
	color: #000000;
	font-size: 14px;
}
.popup_user.active {
	transform: translateY(0);
}
	
	

  /* ============ TAMBAHAN */
  
  
    #countdown {
            font-size: 30px;
            text-align: center;
            background: #d10003;
            padding: 4px 20px;
            border-radius: 6px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
            transition: all 0.3s ease-in-out; 
			margin-bottom:-42px;   color:#faf4d9; margin-top:7px;
        }

        #countdown:hover {
            background: rgba(0, 0, 0, 0.7);
            transform: scale(1.05);
        }
		
		
  /* ============ TAMBAHAN */
  
  
  
  

		.divtercepat {font-size:24px;}
		.kupon_main {background-color:#11254d; color:#ffffff; margin-left:-20px; margin-right:-20px;}
		.divkhusus {font-size:22px; color:#f7b928; padding-top:55px; }
			.divkhusus2 {font-size:36px; color:#f7b928; font-weight:800; padding-top:55px;}
		.divkhusus3 { color:#ffffff;}
		.boxx { width:200px; margin-bottom:-80px; margin-top:-50px;
			display: flex;
            justify-content: center;
            align-items: center;}



.div_time {
  border: dashed;
  padding: var(--dl-space-space-space_16);
  max-width: 400px;

  margin-top: var(--dl-space-space-space_32);
  text-align: center;
  border-color: #d10003;
  border-width: 2px;
  border-radius: var(--dl-radius-radius-radius8);
  margin-bottom:15px;

}



/*============================================== */

     
   
    
     
        .page {
               width: 96%;
               max-width: 800px;
               padding: 0px 15px;
               background: #ffffee;
               box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
               border-radius: 10px;
               position: relative;
               overflow: hidden;
               padding-top:11px;
               margin-top:15px;
               margin-bottom:15px;
        }

        .page::before {
            content: "";
            position: absolute;
            top: 0;
            left: 2px;
            right: 2px;
            bottom: 0;
            background: repeating-linear-gradient(
                #ffffee,
                #ffffee 34px,
                #9a9a9a 35px
            );
            z-index: 1;
            pointer-events: none;
        }

        .content {
            position: relative;
            z-index: 2;
            margin-top: 0px; /* Half of the line height to center the text */
			padding-top:25px;
			padding-bottom:20px;
        }

        .page h1 {
            font-size: 24px;
            margin-bottom: 20px;
        }

        .page span {
            font-size: 18px;
            line-height: 35px; /* Match the line height in the background */
            margin: 0; 
        }
		.page li {margin-left:-30px;}
		
   
  .div_manfaat {
   	display: flex;
   	align-items: flex-start;
   }
   .div_manfaat img  {width:26px; margin-top:3px;} 




/* Reset browser default table styling */
.table_buku {
    border-collapse: collapse;
    width: 100%;
    font-family: Arial, sans-serif;
}

/* Styling the table data cells */
.table_buku td {
    border: 1px solid #ddd; /* Light gray border */
    padding: 8px; /* Padding */
    text-align: left; /* Left-align text */
}

/* Zebra striping for rows */
.table_buku tr:nth-child(even) {
    background-color: #f9f9f9; /* Slightly lighter gray background */
}

/* Hover effect for table rows */
.table_buku tr:hover {
    background-color: #f1f1f1; /* Even lighter gray background */
}


.bintang {margin-top:-20px;}