*, ::before, ::after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

/*
! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com
*/

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box;
  /* 1 */
  border-width: 0;
  /* 2 */
  border-style: solid;
  /* 2 */
  border-color: #e5e7eb;
  /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -moz-tab-size: 4;
  /* 3 */
  -o-tab-size: 4;
     tab-size: 4;
  /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  /* 4 */
  font-feature-settings: normal;
  /* 5 */
  font-variation-settings: normal;
  /* 6 */
  -webkit-tap-highlight-color: transparent;
  /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0;
  /* 1 */
  line-height: inherit;
  /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0;
  /* 1 */
  color: inherit;
  /* 2 */
  border-top-width: 1px;
  /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  /* 1 */
  font-feature-settings: normal;
  /* 2 */
  font-variation-settings: normal;
  /* 3 */
  font-size: 1em;
  /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0;
  /* 1 */
  border-color: inherit;
  /* 2 */
  border-collapse: collapse;
  /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-feature-settings: inherit;
  /* 1 */
  font-variation-settings: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  font-weight: inherit;
  /* 1 */
  line-height: inherit;
  /* 1 */
  letter-spacing: inherit;
  /* 1 */
  color: inherit;
  /* 1 */
  margin: 0;
  /* 2 */
  padding: 0;
  /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button;
  /* 1 */
  background-color: transparent;
  /* 2 */
  background-image: none;
  /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  /* 1 */
  vertical-align: middle;
  /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}

* {
  scrollbar-color: initial;
  scrollbar-width: initial;
}

.container {
  width: 100%;
}

@media (min-width: 640px) {
  .container {
    max-width: 640px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 768px;
  }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1024px;
  }
}

@media (min-width: 1280px) {
  .container {
    max-width: 1280px;
  }
}

@media (min-width: 1536px) {
  .container {
    max-width: 1536px;
  }
}

body {
  --font-primary: "Inter", sans-serif;
  font-family: var(--font-primary);
}

.main {
  width: 100%;
  overflow: hidden;
}

@media (min-width: 768px) {
  .main {
    width: 1100px;
  }
}

.container {
  z-index: 1;
  width: 100%;
}

@media (min-width: 768px) {
  .container {
    width: 1100px;
    max-width: 1100px;
  }
}

.header .container {
  z-index: unset;
}

.main section {
  position: relative;
  z-index: 1;
  width: 100%;
}

@media (min-width: 768px) {
  .main section {
    width: 1100px;
    max-width: 1100px;
  }
}

@media only screen and (min-width: 1100px) {
  .main,
		.main section {
    width: 100%;
    max-width: 100%;
  }
}

img {
  width: 100%;
}

.static {
  position: static;
}

.fixed {
  position: fixed;
}

.absolute {
  position: absolute;
}

.relative {
  position: relative;
}

.sticky {
  position: sticky;
}

.-bottom-2 {
  bottom: -0.5rem;
}

.-bottom-\[18\%\] {
  bottom: -18%;
}

.-bottom-\[3\%\] {
  bottom: -3%;
}

.-bottom-\[8\%\] {
  bottom: -8%;
}

.-left-12 {
  left: -3rem;
}

.-left-5 {
  left: -1.25rem;
}

.-left-\[5\%\] {
  left: -5%;
}

.-right-4 {
  right: -1rem;
}

.-right-\[5\%\] {
  right: -5%;
}

.-top-\[19\%\] {
  top: -19%;
}

.bottom-0 {
  bottom: 0px;
}

.bottom-1 {
  bottom: 0.25rem;
}

.bottom-2 {
  bottom: 0.5rem;
}

.bottom-5 {
  bottom: 1.25rem;
}

.bottom-\[12\%\] {
  bottom: 12%;
}

.bottom-\[15\%\] {
  bottom: 15%;
}

.bottom-\[20\%\] {
  bottom: 20%;
}

.bottom-\[2px\] {
  bottom: 2px;
}

.bottom-\[30\%\] {
  bottom: 30%;
}

.bottom-\[8\%\] {
  bottom: 8%;
}

.left-0 {
  left: 0px;
}

.left-10 {
  left: 2.5rem;
}

.left-4 {
  left: 1rem;
}

.left-5 {
  left: 1.25rem;
}

.left-8 {
  left: 2rem;
}

.left-\[110px\] {
  left: 110px;
}

.left-\[130px\] {
  left: 130px;
}

.left-\[150px\] {
  left: 150px;
}

.left-\[185px\] {
  left: 185px;
}

.left-\[190px\] {
  left: 190px;
}

.left-\[200px\] {
  left: 200px;
}

.left-\[225px\] {
  left: 225px;
}

.left-\[22px\] {
  left: 22px;
}

.left-\[245px\] {
  left: 245px;
}

.left-\[25\%\] {
  left: 25%;
}

.left-\[265px\] {
  left: 265px;
}

.left-\[300px\] {
  left: 300px;
}

.left-\[30px\] {
  left: 30px;
}

.left-\[322px\] {
  left: 322px;
}

.left-\[330px\] {
  left: 330px;
}

.left-\[35\%\] {
  left: 35%;
}

.left-\[370px\] {
  left: 370px;
}

.left-\[38\%\] {
  left: 38%;
}

.left-\[40\%\] {
  left: 40%;
}

.left-\[400px\] {
  left: 400px;
}

.left-\[425px\] {
  left: 425px;
}

.left-\[430px\] {
  left: 430px;
}

.left-\[452px\] {
  left: 452px;
}

.left-\[455px\] {
  left: 455px;
}

.left-\[470px\] {
  left: 470px;
}

.left-\[5\%\] {
  left: 5%;
}

.left-\[513px\] {
  left: 513px;
}

.left-\[528px\] {
  left: 528px;
}

.left-\[540px\] {
  left: 540px;
}

.left-\[550px\] {
  left: 550px;
}

.left-\[575px\] {
  left: 575px;
}

.left-\[580px\] {
  left: 580px;
}

.left-\[620px\] {
  left: 620px;
}

.left-\[703px\] {
  left: 703px;
}

.left-\[735px\] {
  left: 735px;
}

.left-\[790px\] {
  left: 790px;
}

.left-\[80px\] {
  left: 80px;
}

.left-\[825px\] {
  left: 825px;
}

.left-\[890px\] {
  left: 890px;
}

.left-\[925px\] {
  left: 925px;
}

.left-\[960px\] {
  left: 960px;
}

.right-0 {
  right: 0px;
}

.right-1\/2 {
  right: 50%;
}

.right-2 {
  right: 0.5rem;
}

.right-28 {
  right: 7rem;
}

.right-4 {
  right: 1rem;
}

.right-40 {
  right: 10rem;
}

.right-48 {
  right: 12rem;
}

.right-5 {
  right: 1.25rem;
}

.right-52 {
  right: 13rem;
}

.right-56 {
  right: 14rem;
}

.right-6 {
  right: 1.5rem;
}

.right-8 {
  right: 2rem;
}

.right-9 {
  right: 2.25rem;
}

.right-\[16\%\] {
  right: 16%;
}

.right-\[200px\] {
  right: 200px;
}

.right-\[265px\] {
  right: 265px;
}

.right-\[3\%\] {
  right: 3%;
}

.right-\[30\%\] {
  right: 30%;
}

.right-\[4\%\] {
  right: 4%;
}

.right-\[40\%\] {
  right: 40%;
}

.right-\[7\%\] {
  right: 7%;
}

.top-0 {
  top: 0px;
}

.top-1\/2 {
  top: 50%;
}

.top-1\/3 {
  top: 33.333333%;
}

.top-10 {
  top: 2.5rem;
}

.top-2 {
  top: 0.5rem;
}

.top-3 {
  top: 0.75rem;
}

.top-4 {
  top: 1rem;
}

.top-5 {
  top: 1.25rem;
}

.top-6 {
  top: 1.5rem;
}

.top-\[10px\] {
  top: 10px;
}

.top-\[110px\] {
  top: 110px;
}

.top-\[120px\] {
  top: 120px;
}

.top-\[127px\] {
  top: 127px;
}

.top-\[130px\] {
  top: 130px;
}

.top-\[140px\] {
  top: 140px;
}

.top-\[15\%\] {
  top: 15%;
}

.top-\[150px\] {
  top: 150px;
}

.top-\[15px\] {
  top: 15px;
}

.top-\[160px\] {
  top: 160px;
}

.top-\[170px\] {
  top: 170px;
}

.top-\[180px\] {
  top: 180px;
}

.top-\[18px\] {
  top: 18px;
}

.top-\[195px\] {
  top: 195px;
}

.top-\[20\%\] {
  top: 20%;
}

.top-\[200px\] {
  top: 200px;
}

.top-\[225px\] {
  top: 225px;
}

.top-\[235px\] {
  top: 235px;
}

.top-\[250px\] {
  top: 250px;
}

.top-\[265px\] {
  top: 265px;
}

.top-\[275px\] {
  top: 275px;
}

.top-\[28\%\] {
  top: 28%;
}

.top-\[280px\] {
  top: 280px;
}

.top-\[30\%\] {
  top: 30%;
}

.top-\[30px\] {
  top: 30px;
}

.top-\[35\%\] {
  top: 35%;
}

.top-\[35px\] {
  top: 35px;
}

.top-\[36\%\] {
  top: 36%;
}

.top-\[38\%\] {
  top: 38%;
}

.top-\[4\%\] {
  top: 4%;
}

.top-\[40\%\] {
  top: 40%;
}

.top-\[40px\] {
  top: 40px;
}

.top-\[5\%\] {
  top: 5%;
}

.top-\[7\%\] {
  top: 7%;
}

.top-\[70px\] {
  top: 70px;
}

.top-\[75px\] {
  top: 75px;
}

.top-\[85px\] {
  top: 85px;
}

.top-\[90px\] {
  top: 90px;
}

.z-\[2\] {
  z-index: 2;
}

.-m-5 {
  margin: -1.25rem;
}

.m-auto {
  margin: auto;
}

.-mx-2 {
  margin-left: -0.5rem;
  margin-right: -0.5rem;
}

.-mx-5 {
  margin-left: -1.25rem;
  margin-right: -1.25rem;
}

.mx-1 {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.my-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.my-24 {
  margin-top: 6rem;
  margin-bottom: 6rem;
}

.my-3 {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.my-5 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.my-8 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.my-auto {
  margin-top: auto;
  margin-bottom: auto;
}

.-mr-2 {
  margin-right: -0.5rem;
}

.mb-1 {
  margin-bottom: 0.25rem;
}

.mb-14 {
  margin-bottom: 3.5rem;
}

.mb-2 {
  margin-bottom: 0.5rem;
}

.mb-3 {
  margin-bottom: 0.75rem;
}

.mb-32 {
  margin-bottom: 8rem;
}

.mb-4 {
  margin-bottom: 1rem;
}

.mb-5 {
  margin-bottom: 1.25rem;
}

.mb-8 {
  margin-bottom: 2rem;
}

.mb-auto {
  margin-bottom: auto;
}

.ml-12 {
  margin-left: 3rem;
}

.ml-2 {
  margin-left: 0.5rem;
}

.ml-4 {
  margin-left: 1rem;
}

.ml-5 {
  margin-left: 1.25rem;
}

.ml-8 {
  margin-left: 2rem;
}

.ml-\[10px\] {
  margin-left: 10px;
}

.mr-1 {
  margin-right: 0.25rem;
}

.mr-2 {
  margin-right: 0.5rem;
}

.mr-5 {
  margin-right: 1.25rem;
}

.mt-0 {
  margin-top: 0px;
}

.mt-1 {
  margin-top: 0.25rem;
}

.mt-10 {
  margin-top: 2.5rem;
}

.mt-16 {
  margin-top: 4rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mt-24 {
  margin-top: 6rem;
}

.mt-3 {
  margin-top: 0.75rem;
}

.mt-4 {
  margin-top: 1rem;
}

.mt-5 {
  margin-top: 1.25rem;
}

.mt-8 {
  margin-top: 2rem;
}

.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.line-clamp-6 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
}

.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.inline {
  display: inline;
}

.flex {
  display: flex;
}

.table {
  display: table;
}

.grid {
  display: grid;
}

.list-item {
  display: list-item;
}

.hidden {
  display: none;
}

.aspect-video {
  aspect-ratio: 16 / 9;
}

.h-10 {
  height: 2.5rem;
}

.h-12 {
  height: 3rem;
}

.h-20 {
  height: 5rem;
}

.h-24 {
  height: 6rem;
}

.h-3\/5 {
  height: 60%;
}

.h-32 {
  height: 8rem;
}

.h-36 {
  height: 9rem;
}

.h-4 {
  height: 1rem;
}

.h-5 {
  height: 1.25rem;
}

.h-56 {
  height: 14rem;
}

.h-7 {
  height: 1.75rem;
}

.h-80 {
  height: 20rem;
}

.h-\[100px\] {
  height: 100px;
}

.h-\[126px\] {
  height: 126px;
}

.h-\[250px\] {
  height: 250px;
}

.h-\[606px\] {
  height: 606px;
}

.h-\[80\%\] {
  height: 80%;
}

.h-auto {
  height: auto;
}

.h-full {
  height: 100%;
}

.max-h-0 {
  max-height: 0px;
}

.max-h-\[100px\] {
  max-height: 100px;
}

.w-1\/4 {
  width: 25%;
}

.w-1\/5 {
  width: 20%;
}

.w-1\/6 {
  width: 16.666667%;
}

.w-10 {
  width: 2.5rem;
}

.w-11\/12 {
  width: 91.666667%;
}

.w-12 {
  width: 3rem;
}

.w-2\/3 {
  width: 66.666667%;
}

.w-2\/5 {
  width: 40%;
}

.w-20 {
  width: 5rem;
}

.w-28 {
  width: 7rem;
}

.w-3\/5 {
  width: 60%;
}

.w-32 {
  width: 8rem;
}

.w-4 {
  width: 1rem;
}

.w-4\/5 {
  width: 80%;
}

.w-40 {
  width: 10rem;
}

.w-44 {
  width: 11rem;
}

.w-48 {
  width: 12rem;
}

.w-5 {
  width: 1.25rem;
}

.w-52 {
  width: 13rem;
}

.w-60 {
  width: 15rem;
}

.w-7 {
  width: 1.75rem;
}

.w-\[10\%\] {
  width: 10%;
}

.w-\[1000px\] {
  width: 1000px;
}

.w-\[100px\] {
  width: 100px;
}

.w-\[105px\] {
  width: 105px;
}

.w-\[117px\] {
  width: 117px;
}

.w-\[120px\] {
  width: 120px;
}

.w-\[128px\] {
  width: 128px;
}

.w-\[135px\] {
  width: 135px;
}

.w-\[145px\] {
  width: 145px;
}

.w-\[170px\] {
  width: 170px;
}

.w-\[180px\] {
  width: 180px;
}

.w-\[185px\] {
  width: 185px;
}

.w-\[200px\] {
  width: 200px;
}

.w-\[235px\] {
  width: 235px;
}

.w-\[236px\] {
  width: 236px;
}

.w-\[245px\] {
  width: 245px;
}

.w-\[250px\] {
  width: 250px;
}

.w-\[30\%\] {
  width: 30%;
}

.w-\[300px\] {
  width: 300px;
}

.w-\[350px\] {
  width: 350px;
}

.w-\[360px\] {
  width: 360px;
}

.w-\[4\%\] {
  width: 4%;
}

.w-\[400px\] {
  width: 400px;
}

.w-\[45\%\] {
  width: 45%;
}

.w-\[5\%\] {
  width: 5%;
}

.w-\[50px\] {
  width: 50px;
}

.w-\[55\%\] {
  width: 55%;
}

.w-\[63px\] {
  width: 63px;
}

.w-\[70\%\] {
  width: 70%;
}

.w-\[70px\] {
  width: 70px;
}

.w-\[72\%\] {
  width: 72%;
}

.w-\[72px\] {
  width: 72px;
}

.w-\[81px\] {
  width: 81px;
}

.w-\[85px\] {
  width: 85px;
}

.w-\[90px\] {
  width: 90px;
}

.w-auto {
  width: auto;
}

.w-fit {
  width: -moz-fit-content;
  width: fit-content;
}

.w-full {
  width: 100%;
}

.w-screen {
  width: 100vw;
}

.max-w-36 {
  max-width: 9rem;
}

.max-w-44 {
  max-width: 11rem;
}

.max-w-5xl {
  max-width: 64rem;
}

.max-w-\[78px\] {
  max-width: 78px;
}

.max-w-none {
  max-width: none;
}

.max-w-xs {
  max-width: 20rem;
}

.flex-none {
  flex: none;
}

.shrink-0 {
  flex-shrink: 0;
}

.flex-grow {
  flex-grow: 1;
}

.grow {
  flex-grow: 1;
}

.border-separate {
  border-collapse: separate;
}

.-rotate-2 {
  --tw-rotate: -2deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.rotate-180 {
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.rotate-90 {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.rotate-\[115deg\] {
  --tw-rotate: 115deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.rotate-\[260deg\] {
  --tw-rotate: 260deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.-scale-x-\[1\] {
  --tw-scale-x: -1;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.transform {
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.cursor-pointer {
  cursor: pointer;
}

.list-disc {
  list-style-type: disc;
}

.appearance-none {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.flex-col {
  flex-direction: column;
}

.items-end {
  align-items: flex-end;
}

.items-center {
  align-items: center;
}

.justify-start {
  justify-content: flex-start;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.gap-1\.5 {
  gap: 0.375rem;
}

.gap-12 {
  gap: 3rem;
}

.gap-2 {
  gap: 0.5rem;
}

.gap-20 {
  gap: 5rem;
}

.gap-3 {
  gap: 0.75rem;
}

.gap-4 {
  gap: 1rem;
}

.gap-5 {
  gap: 1.25rem;
}

.gap-6 {
  gap: 1.5rem;
}

.gap-8 {
  gap: 2rem;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-x-auto {
  overflow-x: auto;
}

.overflow-y-auto {
  overflow-y: auto;
}

.overflow-x-scroll {
  overflow-x: scroll;
}

.break-words {
  overflow-wrap: break-word;
}

.rounded-full {
  border-radius: 9999px;
}

.rounded-lg {
  border-radius: 0.5rem;
}

.rounded-md {
  border-radius: 0.375rem;
}

.rounded-xl {
  border-radius: 0.75rem;
}

.rounded-l-xl {
  border-top-left-radius: 0.75rem;
  border-bottom-left-radius: 0.75rem;
}

.rounded-t-2xl {
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}

.rounded-bl-lg {
  border-bottom-left-radius: 0.5rem;
}

.rounded-br-lg {
  border-bottom-right-radius: 0.5rem;
}

.rounded-tl-xl {
  border-top-left-radius: 0.75rem;
}

.rounded-tr-xl {
  border-top-right-radius: 0.75rem;
}

.border {
  border-width: 1px;
}

.border-2 {
  border-width: 2px;
}

.border-x {
  border-left-width: 1px;
  border-right-width: 1px;
}

.border-y-2 {
  border-top-width: 2px;
  border-bottom-width: 2px;
}

.border-b {
  border-bottom-width: 1px;
}

.border-b-2 {
  border-bottom-width: 2px;
}

.border-solid {
  border-style: solid;
}

.border-bsi-green {
  --tw-border-opacity: 1;
  border-color: rgb(0 163 157 / var(--tw-border-opacity, 1));
}

.border-gray-300 {
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
}

.border-jb-navy {
  --tw-border-opacity: 1;
  border-color: rgb(27 50 102 / var(--tw-border-opacity, 1));
}

.border-jb-red {
  --tw-border-opacity: 1;
  border-color: rgb(255 97 94 / var(--tw-border-opacity, 1));
}

.border-x-jb-navy {
  --tw-border-opacity: 1;
  border-left-color: rgb(27 50 102 / var(--tw-border-opacity, 1));
  border-right-color: rgb(27 50 102 / var(--tw-border-opacity, 1));
}

.border-y-jb-lightblue {
  --tw-border-opacity: 1;
  border-top-color: rgb(172 228 245 / var(--tw-border-opacity, 1));
  border-bottom-color: rgb(172 228 245 / var(--tw-border-opacity, 1));
}

.border-b-black\/60 {
  border-bottom-color: rgb(0 0 0 / 0.6);
}

.border-b-jb-gray {
  --tw-border-opacity: 1;
  border-bottom-color: rgb(248 248 248 / var(--tw-border-opacity, 1));
}

.border-b-jb-navy {
  --tw-border-opacity: 1;
  border-bottom-color: rgb(27 50 102 / var(--tw-border-opacity, 1));
}

.bg-\[\#39B54A\] {
  --tw-bg-opacity: 1;
  background-color: rgb(57 181 74 / var(--tw-bg-opacity, 1));
}

.bg-\[\#C1272D\] {
  --tw-bg-opacity: 1;
  background-color: rgb(193 39 45 / var(--tw-bg-opacity, 1));
}

.bg-black\/30 {
  background-color: rgb(0 0 0 / 0.3);
}

.bg-blue-500 {
  --tw-bg-opacity: 1;
  background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1));
}

.bg-bsi-green {
  --tw-bg-opacity: 1;
  background-color: rgb(0 163 157 / var(--tw-bg-opacity, 1));
}

.bg-gray-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}

.bg-gray-200 {
  --tw-bg-opacity: 1;
  background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
}

.bg-jb-babyblue {
  --tw-bg-opacity: 1;
  background-color: rgb(238 243 251 / var(--tw-bg-opacity, 1));
}

.bg-jb-bg-green {
  --tw-bg-opacity: 1;
  background-color: rgb(96 160 0 / var(--tw-bg-opacity, 1));
}

.bg-jb-blue {
  --tw-bg-opacity: 1;
  background-color: rgb(13 85 134 / var(--tw-bg-opacity, 1));
}

.bg-jb-brown {
  --tw-bg-opacity: 1;
  background-color: rgb(102 78 57 / var(--tw-bg-opacity, 1));
}

.bg-jb-darkgreen {
  --tw-bg-opacity: 1;
  background-color: rgb(49 77 40 / var(--tw-bg-opacity, 1));
}

.bg-jb-gray {
  --tw-bg-opacity: 1;
  background-color: rgb(248 248 248 / var(--tw-bg-opacity, 1));
}

.bg-jb-lightgreen {
  --tw-bg-opacity: 1;
  background-color: rgb(231 242 238 / var(--tw-bg-opacity, 1));
}

.bg-jb-lime {
  --tw-bg-opacity: 1;
  background-color: rgb(243 214 0 / var(--tw-bg-opacity, 1));
}

.bg-jb-navy {
  --tw-bg-opacity: 1;
  background-color: rgb(27 50 102 / var(--tw-bg-opacity, 1));
}

.bg-jb-orange {
  --tw-bg-opacity: 1;
  background-color: rgb(226 87 40 / var(--tw-bg-opacity, 1));
}

.bg-jb-red {
  --tw-bg-opacity: 1;
  background-color: rgb(255 97 94 / var(--tw-bg-opacity, 1));
}

.bg-jb-seablue {
  --tw-bg-opacity: 1;
  background-color: rgb(49 151 217 / var(--tw-bg-opacity, 1));
}

.bg-jb-yellow {
  --tw-bg-opacity: 1;
  background-color: rgb(250 178 14 / var(--tw-bg-opacity, 1));
}

.bg-neutral-300 {
  --tw-bg-opacity: 1;
  background-color: rgb(212 212 212 / var(--tw-bg-opacity, 1));
}

.bg-transparent {
  background-color: transparent;
}

.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.bg-\[url\(\.\.\/images\/icon-down\.png\)\] {
  background-image: url(../images/icon-down.png);
}

.bg-\[length\:14px_10px\] {
  background-size: 14px 10px;
}

.bg-cover {
  background-size: cover;
}

.bg-\[right_10px_top_50\%\] {
  background-position: right 10px top 50%;
}

.bg-center {
  background-position: center;
}

.bg-no-repeat {
  background-repeat: no-repeat;
}

.object-contain {
  -o-object-fit: contain;
     object-fit: contain;
}

.object-cover {
  -o-object-fit: cover;
     object-fit: cover;
}

.object-right {
  -o-object-position: right;
     object-position: right;
}

.object-top {
  -o-object-position: top;
     object-position: top;
}

.p-1 {
  padding: 0.25rem;
}

.p-2 {
  padding: 0.5rem;
}

.p-2\.5 {
  padding: 0.625rem;
}

.p-3 {
  padding: 0.75rem;
}

.p-4 {
  padding: 1rem;
}

.p-5 {
  padding: 1.25rem;
}

.p-6 {
  padding: 1.5rem;
}

.p-8 {
  padding: 2rem;
}

.p-\[2px\] {
  padding: 2px;
}

.px-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.px-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.py-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.py-2\.5 {
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}

.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.py-30 {
  padding-top: 30px;
  padding-bottom: 30px;
}

.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.py-\[2px\] {
  padding-top: 2px;
  padding-bottom: 2px;
}

.pb-5 {
  padding-bottom: 1.25rem;
}

.pl-16 {
  padding-left: 4rem;
}

.pl-3 {
  padding-left: 0.75rem;
}

.pl-9 {
  padding-left: 2.25rem;
}

.pr-4 {
  padding-right: 1rem;
}

.pr-5 {
  padding-right: 1.25rem;
}

.pt-1 {
  padding-top: 0.25rem;
}

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
}

.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}

.text-4xl {
  font-size: 2.25rem;
  line-height: 2.5rem;
}

.text-5xl {
  font-size: 3rem;
  line-height: 1;
}

.text-\[10px\] {
  font-size: 10px;
}

.text-\[11px\] {
  font-size: 11px;
}

.text-\[7px\] {
  font-size: 7px;
}

.text-\[9px\] {
  font-size: 9px;
}

.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}

.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}

.font-bold {
  font-weight: 700;
}

.font-medium {
  font-weight: 500;
}

.font-normal {
  font-weight: 400;
}

.font-semibold {
  font-weight: 600;
}

.uppercase {
  text-transform: uppercase;
}

.not-italic {
  font-style: normal;
}

.leading-4 {
  line-height: 1rem;
}

.leading-6 {
  line-height: 1.5rem;
}

.leading-\[120\%\] {
  line-height: 120%;
}

.leading-loose {
  line-height: 2;
}

.leading-tight {
  line-height: 1.25;
}

.text-bsi-green {
  --tw-text-opacity: 1;
  color: rgb(0 163 157 / var(--tw-text-opacity, 1));
}

.text-cah-blue-dark {
  --tw-text-opacity: 1;
  color: rgb(28 50 100 / var(--tw-text-opacity, 1));
}

.text-gray-400 {
  --tw-text-opacity: 1;
  color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}

.text-green-950 {
  --tw-text-opacity: 1;
  color: rgb(5 46 22 / var(--tw-text-opacity, 1));
}

.text-jb-blue {
  --tw-text-opacity: 1;
  color: rgb(13 85 134 / var(--tw-text-opacity, 1));
}

.text-jb-brown {
  --tw-text-opacity: 1;
  color: rgb(102 78 57 / var(--tw-text-opacity, 1));
}

.text-jb-navy {
  --tw-text-opacity: 1;
  color: rgb(27 50 102 / var(--tw-text-opacity, 1));
}

.text-jb-red {
  --tw-text-opacity: 1;
  color: rgb(255 97 94 / var(--tw-text-opacity, 1));
}

.text-jb-yellow {
  --tw-text-opacity: 1;
  color: rgb(250 178 14 / var(--tw-text-opacity, 1));
}

.text-kompas-blue {
  --tw-text-opacity: 1;
  color: rgb(57 163 240 / var(--tw-text-opacity, 1));
}

.text-kompas-gray {
  --tw-text-opacity: 1;
  color: rgb(102 102 102 / var(--tw-text-opacity, 1));
}

.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.outline-none {
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.blur {
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.brightness-\[10\] {
  --tw-brightness: brightness(10);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.scrollbar::-webkit-scrollbar-track {
  background-color: var(--scrollbar-track);
  border-radius: var(--scrollbar-track-radius);
}

.scrollbar::-webkit-scrollbar-track:hover {
  background-color: var(--scrollbar-track-hover, var(--scrollbar-track));
}

.scrollbar::-webkit-scrollbar-track:active {
  background-color: var(--scrollbar-track-active, var(--scrollbar-track-hover, var(--scrollbar-track)));
}

.scrollbar::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-thumb);
  border-radius: var(--scrollbar-thumb-radius);
}

.scrollbar::-webkit-scrollbar-thumb:hover {
  background-color: var(--scrollbar-thumb-hover, var(--scrollbar-thumb));
}

.scrollbar::-webkit-scrollbar-thumb:active {
  background-color: var(--scrollbar-thumb-active, var(--scrollbar-thumb-hover, var(--scrollbar-thumb)));
}

.scrollbar::-webkit-scrollbar-corner {
  background-color: var(--scrollbar-corner);
  border-radius: var(--scrollbar-corner-radius);
}

.scrollbar::-webkit-scrollbar-corner:hover {
  background-color: var(--scrollbar-corner-hover, var(--scrollbar-corner));
}

.scrollbar::-webkit-scrollbar-corner:active {
  background-color: var(--scrollbar-corner-active, var(--scrollbar-corner-hover, var(--scrollbar-corner)));
}

.scrollbar {
  scrollbar-width: auto;
  scrollbar-color: var(--scrollbar-thumb, initial) var(--scrollbar-track, initial);
}

.scrollbar::-webkit-scrollbar {
  display: block;
  width: var(--scrollbar-width, 16px);
  height: var(--scrollbar-height, 16px);
}

.scrollbar-thin::-webkit-scrollbar-track {
  background-color: var(--scrollbar-track);
  border-radius: var(--scrollbar-track-radius);
}

.scrollbar-thin::-webkit-scrollbar-track:hover {
  background-color: var(--scrollbar-track-hover, var(--scrollbar-track));
}

.scrollbar-thin::-webkit-scrollbar-track:active {
  background-color: var(--scrollbar-track-active, var(--scrollbar-track-hover, var(--scrollbar-track)));
}

.scrollbar-thin::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-thumb);
  border-radius: var(--scrollbar-thumb-radius);
}

.scrollbar-thin::-webkit-scrollbar-thumb:hover {
  background-color: var(--scrollbar-thumb-hover, var(--scrollbar-thumb));
}

.scrollbar-thin::-webkit-scrollbar-thumb:active {
  background-color: var(--scrollbar-thumb-active, var(--scrollbar-thumb-hover, var(--scrollbar-thumb)));
}

.scrollbar-thin::-webkit-scrollbar-corner {
  background-color: var(--scrollbar-corner);
  border-radius: var(--scrollbar-corner-radius);
}

.scrollbar-thin::-webkit-scrollbar-corner:hover {
  background-color: var(--scrollbar-corner-hover, var(--scrollbar-corner));
}

.scrollbar-thin::-webkit-scrollbar-corner:active {
  background-color: var(--scrollbar-corner-active, var(--scrollbar-corner-hover, var(--scrollbar-corner)));
}

.scrollbar-thin {
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-thumb, initial) var(--scrollbar-track, initial);
}

.scrollbar-thin::-webkit-scrollbar {
  display: block;
  width: 8px;
  height: 8px;
}

.scrollbar-none {
  scrollbar-width: none;
}

.scrollbar-none::-webkit-scrollbar {
  display: none;
}

.scrollbar-track-jb-navy {
  --scrollbar-track: #1B3266 !important;
}

.scrollbar-thumb-jb-yellow {
  --scrollbar-thumb: #FAB20E !important;
}

.\[border-spacing\:0\] {
  border-spacing: 0;
}

section#jurnal {
  padding-bottom: 6rem;
}

section#jurnal:has(+ section#ucapan) {
  padding-bottom: 4rem;
}

[data-kanal="ramadhan"].kanalHeader {
  background-color: #DCF2FC;
  position: relative;
  z-index: 2;
}

[data-kanal="ramadhan"] .kanalMenu ul li a {
  color: #1f3d7d;
  font-weight: 500;
  font-size: 13px;
}

[data-kanal="ramadhan"] .kanalMenu ul li a.active:before {
  background: #3296A9;
}

[data-kanal="ramadhan"] .kanalMenu ul li a:hover {
  color: #e65225;
}

[data-kanal="ramadhan"] .kanalBacklink a {
  background-color: #1ab26b;
  border: none;
  color: #fff;
  border-radius: 0.5rem;
  padding: 8px;
}

[data-kanal="ramadhan"] .kanalLogo {
  width: 140px;
}

[data-kanal="ramadhan"] .kanalLogo img {
  height: auto;
}

.kanalHeader-wrap {
  gap: 16px;
}

.kanalMenu ul {
  gap: 12px;
}

.ramadhan,
.ramadhan .sectionTitle,
.ramadhan input:not(.header-search-input):not(.header-search-button):not(.btn-primary):not(.form__input__header):not(.form__button__header),
.ramadhan #lokasi {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.ramadhan .sectionTitle {
  color: #2a2a2a;
}

.ramadhan .kcm__top:before,
.ramadhan .kcm__track,
.ramadhan .kcm__sticky:before,
.ramadhan .kcm__big,
.ramadhan .kcm__big:before,
.ramadhan .kcm__stick--left:before,
.ramadhan .kcm__stick--right:before {
  background: #f2f2f2;
}

#div-gpt-ad-top,
#div-gpt-ad-Top_1-1 {
  display: inline-block;
  text-align: center;
}

.kcm__sticky__top iframe,
.kcm__sticky__top img {
  display: inline-block;
}

.kcm__horizontal {
  background: hsla(0, 0%, 100%, 0.8);
}

.ramadhan .gate-kgplus {
  background: #f2f2f2;
  color: #666;
}

.ucapan-satu input[type="text"] {
  background-color: transparent !important;
}

.ramadhan .kcm__stick {
  top: 188px;
}

.ramadhan .kcm__stick--sticky {
  top: 215px;
}

.nav_other .nav_floating {
  position: absolute;
  top: 32px;
  left: 0;
  z-index: 2;
  padding: 10px 10px 20px;
  opacity: 0;
  visibility: hidden;
  height: 0;
}

.nav_other:hover .nav_floating {
  opacity: 1;
  visibility: visible;
  height: auto;
  background-color: #DCF2FC;
  width: 230px;
  flex-direction: column;
}

.nav_other .nav_floating li {
  display: block;
  width: 100%;
  vertical-align: top;
  padding: 5px 0;
  height: auto;
}

[data-kanal="ramadhan"] .kanalMenu .nav_other ul li a {
  color: #1f3d7d;
}

.nav-ram-others:hover .nav__sub {
  top: 46px;
  visibility: visible;
  opacity: 1;
  height: auto;
  left: auto;
  right: 0;
}

.header--sticky .nav .container,
.jb-nav.nav--sticky .container {
  max-width: 100%;
}

.jb-nav-list {
  font-size: 0.75rem;
  line-height: 1rem;
}

.jb-nav.nav--sticky {
  animation: bounceInDown 1.5s;
}

.jb-nav.nav--sticky .logo-jernih-berbagi {
  margin-left: 25px;
}

.jb-nav.nav--sticky .jb-nav-list {
  padding-right: 0px;
}

.jb-nav.nav--sticky .jb-nav-list ul {
  justify-content: space-between;
}

.btn-icon {
  background-image: url(../images/icon-right.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.bg-playlist {
  position: relative;
  background-image:
		linear-gradient(0deg, rgba(41, 138, 180, 0.86) 58%, rgba(13, 85, 134, 1) 100%);
  background-repeat: no-repeat;
}

/* @media only screen and (min-width: 1280px) {
	.bg-playlist {
		background-position: left -50px bottom -70px, right 30px center;
	}
} */

.py-wave {
  padding-top: 1.5rem;
  padding-bottom: 3rem;
}

@media (min-width: 1024px) {
  .py-wave {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
}

.bg-section-3 {
  background-image: url(../images/bg-3-1.png), url(../images/bg-3-2.png);
  background-size: contain, contain;
  background-position: left bottom, right bottom;
}

.bg-section-5 {
  background-image: url(../images/bg-5-1.png), url(../images/bg-5-2.png);
  background-size: 150px;
  background-position: left bottom, right bottom;
}

.bg-section-6 {
  background-image: url(../images/bg-6-1.png), url(../images/bg-6-2.png);
  background-size: 300px, 125px;
  background-position: left -60px bottom, right top;
}

.bg-section-7 {
  background-image: url(../images/bg-7-1.png), url(../images/bg-7-2.png);
  background-size: 130px;
  background-position: left center, right center;
}

.bg-section-8 {
  background-image: url(../images/bg-8-1.png);
  background-size: 150px;
  background-position: left bottom;
}

.bg-section-9 {
  background-image: url(../images/bg-9-1.png);
  background-size: 350px;
  background-position: right bottom;
}

.bg-ucapan {
  background: transparent;
}

.bg-kalori {
  background: #FFFFB0;
  background: linear-gradient(0deg, rgba(255, 255, 176, 1) 11%, rgba(50, 157, 200, 0.86) 47%, rgba(32, 140, 213, 1) 90%);
}

.bg-kalori-idx {
  background-image: url(../images/kalorimeter/bg.jpg);
  background-size: cover;
  background-position: center;
}

.bg-kalori-idx .km__article--title {
  --tw-text-opacity: 1;
  color: rgb(13 85 134 / var(--tw-text-opacity, 1));
}

.bg-kalkulator {
  background-color: #E6F4FF;
  /* background: #F6FCEF; */
  /* background: linear-gradient(180deg, rgba(40, 129, 141, 1) 0%, rgba(99, 222, 201, 1) 31%, rgba(246, 252, 239, 1) 100%); */
}

.bg-buku-saku {
  background-color: #F4EFCA;
}

.bg-umi-aya {
  background-color: #C4E2CA;
}

.bg-lapar {
  background-color: #1A60B5;
}

.bg-lebih-dekat {
  background: #127CAC;
}

/* .bg-ucapan {
	background-color: #B0EBBF;
} */

.bg-donasi {
  background: #127CAC;
}

.bg-gamification {
  background-color: #CFECFE;
}

.bg-petamudik {
  background-color: #056897;
}

.wave-cover {
  position: absolute;
  height: 100%;
  min-height: 550px;
  width: 100%;
}

@media (min-width: 1280px) {
  .wave-cover {
    min-height: 600px;
  }
}

.bg-ucapan .wave-cover {
  top: 0px;
  left: 0px;
}

.bg-lebih-dekat .wave-cover {
  top: -18%;
  left: 0px;
  min-height: 600px;
}

@media (min-width: 1280px) {
  .bg-lebih-dekat .wave-cover {
    min-height: 650px;
  }
}

.bg-buku-saku .wave-cover {
  top: -13%;
  left: 0px;
}

.bg-umi-aya .wave-cover {
  top: -19%;
  left: 0px;
}

.bg-lapar .wave-cover {
  top: -20%;
  left: 0px;
  min-height: 580px;
}

.bg-donasi .wave-cover {
  top: -20%;
  left: 0px;
}

.bg-hikayat .wave-cover {
  top: -12%;
  left: 0px;
}

.bg-donasi+.bg-ucapan .wave-cover {
  top: -12%;
}

.bg-gamification .wave-cover {
  top: -12%;
  left: 0px;
  max-height: 600px;
}

.bg-gamification .py-wave {
  padding-bottom: 6rem;
}

.bg-petamudik .wave-cover {
  top: -13%;
}

.wave-cover img {
  -o-object-position: 100%;
     object-position: 100%;
  max-height: 100%;
  height: 100%;
}

.bg-kalkulator-idx {
  /* background:
		url("../images/kalk-left-t.png") top left no-repeat,
		url("../images/kalk-right-t.png") top right no-repeat,
		url("../images/kalk-left-b.png") bottom left no-repeat,
		url("../images/kalk-right-b.png") bottom right no-repeat,
		linear-gradient(0deg, rgba(234, 250, 236, 1) 4%, rgba(97, 219, 199, 0.86) 31%, rgba(44, 135, 145, 1) 100%);

	background-size:
		120px,
		120px,
		150px,
		90px,
		cover; */
  /* url("../images/kalk-ill-bottom.png") bottom left -20px no-repeat,
		url("../images/kalk-gedung.png") bottom right no-repeat, */
  /* linear-gradient(180deg, rgba(0, 163, 157, 1) 17%, rgba(97, 219, 199, 0.29) 67%, rgba(230, 243, 252, 1) 100%); */
  background: #FFFFFF;
  background: linear-gradient(180deg, rgba(255, 255, 255, 1) -36%, rgba(0, 163, 157, 1) 30%, rgba(99, 222, 201, 0.5) 75%, rgba(246, 252, 239, 1) 100%);
  background-size:

		/* 250px,
		250px, */
		cover;
}

.bg-dashboard-profile {
  background: #C8F7D2;
  background: url("../images/decor-lamp.png") top left 240px no-repeat,
		radial-gradient(circle, rgba(200, 247, 210, 1) 0%, rgba(53, 215, 196, 1) 100%);
  background-size:
		100px,
		cover;
}

.bg-dashboard-how {
  background:
		url("../images/decor-poin.png") bottom left no-repeat,
		linear-gradient(270deg, rgba(254, 241, 150, 1) 0%, rgba(48, 177, 236, 1) 64%, rgba(28, 136, 172, 1) 100%);
  background-size:

		220px,
		cover;
}

.bg-sedekah-poin {
  background:
		url("../images/decor-sedekah-poin.png") bottom right 20px no-repeat,
		linear-gradient(0deg, rgba(246, 255, 211, 1) 0%, rgba(80, 204, 195, 1) 64%, rgba(17, 94, 118, 1) 100%);
  background-size:
		220px,
		cover;
}

.bg-tukar-poin {
  background: #D3FAF0;
  background:
		url("../images/decor-lantern1.png") top right no-repeat,
		url("../images/decor-tukar-left.png") bottom left no-repeat,
		url("../images/decor-tukar-right.png") bottom right no-repeat,
		linear-gradient(180deg, rgba(211, 250, 240, 1) 6%, rgba(82, 229, 210, 1) 44%, rgba(21, 116, 188, 1) 100%);
  background-size:
		200px,
		200px,
		250px,
		cover;
}

.jb-nav.nav--sticky {
  position: fixed;
  top: 49px;
  z-index: 50;
}

.slider-ramadhan .slick-slide {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}

.slider-ramadhan .slick-dots {
  bottom: -24px;
}

.slider-ramadhan .slick-dots li button {
  padding: 4px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3);
}

.slider-ramadhan .slick-dots li button:before {
  display: none;
}

.slider-ramadhan .slick-dots li.slick-active button {
  background-color: #fff;
}

.page-active {
  --tw-border-opacity: 1;
  border-color: rgb(57 163 240 / var(--tw-border-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(57 163 240 / var(--tw-text-opacity, 1));
}

.socmedList {
  width: 266px;
  padding: 0px;
}

.socmedButton {
  min-width: 2.25rem;
  flex-basis: 2.25rem;
}

.socmedBlock {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.icoSocmed {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}

.thumb-umiaya {
  position: relative;
  aspect-ratio: 9 / 16;
  width: 100%;
  overflow: hidden;
  border-radius: 0.75rem;
}

.thumb-dakwah {
  position: relative;
  aspect-ratio: 9 / 16;
  width: 100%;
  overflow: hidden;
  border-radius: 0.75rem;
}

.lebih-dekatWrap {
  display: flex;
  gap: 1rem;
}

.lebih-dekatWrap .articleTitle,
.lebih-dekatWrap .articlePost-date,
.lebih-dekatWrap .articlePost-subtitle {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.lebih-dekatWrap .articleTitle:hover,
.lebih-dekatWrap .articlePost-date:hover,
.lebih-dekatWrap .articlePost-subtitle:hover {
  --tw-text-opacity: 1;
  color: rgb(30 64 175 / var(--tw-text-opacity, 1));
}

.lebih-dekatWrap>.articleItem {
  width: 50%;
}

#dakwah .articlePost ul li:not(:last-child):after {
  color: #c9c9c9;
  background-color: transparent;
}

/* micromodal */

/**************************\
    Basic Modal Styles
\**************************/

.modal__overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 999999;
}

.modal__container {
  background-color: #fff;
  max-height: 95vh;
  border-radius: 10px;
  box-sizing: border-box;
  width: 90%;
  max-width: 600px;
  overflow: hidden;
  padding: 20px;
  overflow-y: auto;
}

.modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal__title {
  margin-top: 0;
  margin-bottom: 0;
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.25;
  color: #00449e;
  box-sizing: border-box;
}

.modal__close {
  width: 24px;
  height: 24px;
  position: absolute;
  top: 10px;
  right: 10px;
  border: solid 1px rgba(0, 0, 0, 0.8);
  border-radius: 50%;
}

.modal__header .modal__close:before {
  content: "\2715";
}

.modal__content {
  line-height: 1.5;
  color: rgba(0, 0, 0, 0.8);
}

.modal__btn {
  font-size: 0.875rem;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  background-color: #e6e6e6;
  color: rgba(0, 0, 0, 0.8);
  border-radius: 0.25rem;
  border-style: none;
  border-width: 0;
  cursor: pointer;
  -webkit-appearance: button;
  text-transform: none;
  overflow: visible;
  line-height: 1.15;
  margin: 0;
  will-change: transform;
  -moz-osx-font-smoothing: grayscale;
  backface-visibility: hidden;
  transform: translateZ(0);
  transition: transform 0.25s ease-out;
}

.modal__container__ecard {
  --tw-bg-opacity: 1;
  background-color: rgb(231 242 238 / var(--tw-bg-opacity, 1));
}

.ecard-img {
  width: 100% !important;
  height: 42% !important;
  position: absolute !important;
  top: 42%;
  left: 0;
  right: 0;
  margin: auto;
  background-color: #949494;
}

.ecard-img img {
  max-width: none;
  width: auto;
}

.tablink.active {
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(27 50 102 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.tablink2.active {
  --tw-bg-opacity: 1;
  background-color: rgb(27 50 102 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.tabs input {
  position: absolute;
  opacity: 0;
  z-index: -1;
}

.tabs input:checked+.tab-label::after {
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.tabs input:checked~.tab-content {
  max-height: 20rem;
  padding: 0 1em 1em;
}

/**************************\
    Demo Animation Style
\**************************/

@keyframes mmfadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes mmfadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes mmslideIn {
  from {
    transform: translateY(15%);
  }

  to {
    transform: translateY(0);
  }
}

@keyframes mmslideOut {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-10%);
  }
}

.micromodal-slide {
  display: none;
}

.micromodal-slide.is-open {
  display: block;
}

.micromodal-slide[aria-hidden="false"] .modal__overlay {
  animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="false"] .modal__container {
  animation: mmslideIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__overlay {
  animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__container {
  animation: mmslideOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide .modal__container,
.micromodal-slide .modal__overlay {
  will-change: transform;
}

/* micromodal end */

#modal-snk-kebaikan .modal__header .modal__close,
#modal-snk-spesial .modal__header .modal__close {
  border-color: #fff;
}

#modal-snk-kebaikan .modal__header .modal__close:before,
#modal-snk-spesial .modal__header .modal__close:before {
  color: #fff;
}

.embed-instagram iframe {
  min-width: 0 !important;
  width: 100% !important;
}

.slidestory-main-wrap {
  margin-bottom: 2rem;
}

.slidestory-main-wrap .socmedList {
  width: 100%;
}

.slidestory-main-title {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  text-align: center;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
}

.slidestory-main-desc {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  text-align: center;
  font-size: 1rem;
  line-height: 1.5rem;
}

.slidestory-rect {
  height: 400px;
}

/* .big-slidestory .gradient-left {
	background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.8) 50%, rgba(0, 0, 0, 0) 100%)
} */

.slidestory-others-wrap {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.slidestory-items {
  aspect-ratio: 9 / 16;
  overflow: hidden;
  border-radius: 0.5rem;
}

.header-jadwal-imsak {
  position: relative;
  background: #F6FCEF;
  margin-bottom: 10px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  overflow: hidden;
  height: 190px;
}

.header-jadwal-imsak .ornament {
  display: flex;
  justify-content: space-between;
  align-items: end;
  padding-top: 20px;
  position: relative;
  height: 100%;
}

.header-gradient {
  background: #F6FCEF;
  background: linear-gradient(90deg, rgba(246, 252, 239, 1) 61%, rgba(246, 252, 239, 0) 100%);
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  width: 66.666667%
}

.header-gradient.--kalk {
  background: #F6FCEF;
  background: linear-gradient(90deg, rgba(246, 252, 239, 1) 61%, rgba(246, 252, 239, 0) 100%);
  width: 50%
}

.header-jadwal-imsak .ornament :nth-child(3) img {
  border-bottom-right-radius: 10px;
}

.imsakiyah-contentTxt .read__content {
  color: #000;
}

.imsakiyah-contentTxt p {
  margin: 16px 0;
}

.wPrayertime-hr {
  height: 1px;
  background: #b8b8b8;
}

.wPrayerdua {
  display: flex;
  flex-wrap: wrap;
  gap: 30px
}

.wPrayerdua-box {
  background-color: #ecf2f2;
  border-radius: 8px;
  padding: 24px;
  text-align: center;
  width: calc((100% - 30px) / 2)
}

.wPrayerdua-box.--large {
  flex-basis: 100%
}

.wPrayerdua-title {
  font-size: 14px;
  font-weight: 400;
  line-height: 18.2px;
  color: #446060;
  padding-bottom: 16px;
  margin-bottom: 16px;
  border-bottom: 1px solid #ecf2f2
}

.wPrayerdua-heading {
  font-size: 20px;
  font-weight: 700;
  line-height: 26px;
  color: #000;
  margin: 0 0 16px
}

.wPrayerdua-subheading {
  font-size: 14px;
  font-weight: 600;
  line-height: 18.2px;
  color: #000;
  margin: 16px 0 0
}

.wPrayerdua-content {
  font-size: 20px;
  font-weight: 400;
  line-height: 28px;
  color: #000;
  margin: 0 0 16px;
  padding-bottom: 16px;
  position: relative
}

.wPrayerdua-content:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 30px;
  height: 1px;
  background-color: #b2c7c7;
  transform: translateX(-50%)
}

.wPrayerdua-desc {
  font-size: 16px;
  line-height: 20.8px;
  margin: 16px 0 0;
  font-style: italic
}

.wPrayerdua-creator,
.wPrayerdua-desc {
  font-weight: 400;
  color: #000
}

.wPrayerdua-creator {
  font-size: 14px;
  line-height: 19.6px
}

.wPrayerdua-arabic {
  display: block;
  font-size: 20px;
  font-weight: 400;
  line-height: 36px;
  color: #000
}

.wPrayerdua-title {
  font-size: 14px;
  font-weight: 400;
  line-height: 18.2px;
  color: #446060;
  padding-bottom: 16px;
  margin-bottom: 16px;
  border-bottom: 1px solid #b2c7c7;
}

.tag__article__teaser,
.tag__article__link {
  color: #666;
}

.tag__article__link {
  background-color: #fff;
  border-color: #e2e2e2;
}

.bg-th {
  --tw-bg-opacity: 1;
  background-color: rgb(0 163 157 / var(--tw-bg-opacity, 1));
}

.page-print .header-jadwal-imsak {
  height: 150px;
  margin-bottom: 3px;
}

.page-print {
  width: 200mm;
  min-height: 210mm;
  padding: 2mm;
  margin: 0 auto;
  border: 1px solid #d3d3d3;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 0 5px rgb(0 0 0 / 10%);
}

.page-print table {
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.icon-blue {
  filter: brightness(0) saturate(100%) invert(50%) sepia(100%) saturate(350%) hue-rotate(162deg) brightness(96%) contrast(97%);
}

.disc-txt {
  font-size: 5px;
  color: #00A39D;
  width: 155px;
  margin: 3px auto 0;
  text-wrap-style: auto;
  text-shadow:
		1px 1px 0 #fff,
		-1px 1px 0 #fff,
		1px -1px 0 #fff,
		-1px -1px 0 #fff;
}

@media only screen and (min-width: 768px) {
  .disc-txt {
    font-size: 7px;
  }
}

.page-print .disc-txt {
  width: 155px;
}

.tema-ucapan input[type="radio"]+label {
  border-radius: 9999px;
  --tw-bg-opacity: 1;
  background-color: rgb(27 50 102 / var(--tw-bg-opacity, 1));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  --tw-text-opacity: 1;
  color: rgb(238 243 251 / var(--tw-text-opacity, 1));
}

.tema-ucapan input[type="radio"]:checked+label {
  --tw-bg-opacity: 1;
  background-color: rgb(250 178 14 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(27 50 102 / var(--tw-text-opacity, 1));
}

.bingkisan-poin {
  background-image: url(../images/bg-bingkisan.png);
}

#salin-button:after {
  --tw-bg-opacity: 1;
  background-color: rgb(27 50 102 / var(--tw-bg-opacity, 1));
  content: "Teks Berhasil disalin";
  position: absolute;
  top: -25px;
  left: 0;
  right: 0;
  color: #fff;
  font-size: 10px;
  font-weight: 400;
  width: 110px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  border-radius: 3px;
  text-transform: none;
  margin: auto;
  display: none;
}

#salin-button.active:after {
  display: block;
}

.canal:after {
  position: absolute;
  content: "";
  width: 4px;
  height: 4px;
  background-color: #d9d9d9;
  border-radius: 100%;
  right: 5px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.canal {
  text-transform: uppercase;
}

.item-title {
  margin-top: 0.5rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.15rem;
}

.item-title-canal {
  margin: 0 0 12px;
  font-size: 20px;
  line-height: 26px;
  font-weight: 500;
  -webkit-line-clamp: 3;
  height: auto;
  letter-spacing: -0.2px;
}

.nama-kanal-wrap {
  position: relative;
  height: 1.5rem;
  padding-right: 1rem;
}

.btn-back {
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  align-items: center;
  gap: 0.5rem;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.btn-back:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.btn-primary {
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  text-align: center;
  font-weight: 600;
}

.jadwalimsak-download.btn-primary:hover {
  --tw-text-opacity: 1;
  color: rgb(248 173 60 / var(--tw-text-opacity, 1));
}

.btn-primary-clr {
  --tw-bg-opacity: 1;
  background-color: rgb(15 121 198 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.btn-primary-clr:hover {
  --tw-text-opacity: 1;
  color: rgb(28 50 100 / var(--tw-text-opacity, 1));
}

.btn-secondary {
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  cursor: pointer;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  text-align: center;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgb(15 121 198 / var(--tw-text-opacity, 1));
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.btn-secondary:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(15 121 198 / var(--tw-text-opacity, 1));
}

.btn-secondary-dashboard {
  width: 100%;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(15 121 198 / var(--tw-border-opacity, 1));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.btn-all-yellow {
  margin-bottom: 1rem;
  margin-top: 1.25rem;
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  align-items: center;
  gap: 0.5rem;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(243 214 0 / var(--tw-bg-opacity, 1));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(13 85 134 / var(--tw-text-opacity, 1));
}

.btn-all-yellow:hover {
  --tw-text-opacity: 1;
  color: rgb(13 85 134 / var(--tw-text-opacity, 1));
}

.btn-primary-arr {
  position: relative;
  cursor: pointer;
  background-color: transparent;
  padding-right: 0.5rem;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 600;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.btn-primary-arr::after {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: -0.75rem;
  margin-top: auto;
  margin-bottom: auto;
  height: 0.75rem;
  width: 0.75rem;
  background-image: url(../images/arrow-white.svg);;
  background-size: contain;
  background-repeat: no-repeat;
  --tw-content: "";
  content: var(--tw-content);
}

.btn-primary-arr:hover {
  --tw-text-opacity: 1;
  color: rgb(13 85 134 / var(--tw-text-opacity, 1));
}

.btn-arrow {
  position: relative;
  padding-right: 0.5rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.btn-arrow::after {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: -0.75rem;
  margin-top: auto;
  margin-bottom: auto;
  height: 0.75rem;
  width: 0.75rem;
  background-image: url(../images/arrow-white.svg);;
  background-size: contain;
  background-repeat: no-repeat;
  --tw-content: "";
  content: var(--tw-content);
}

/* .jadwal-imsak-bsi {
	@apply font-lato;
}

.jadwal-imsak-bsi .header-jadwal-imsak {
	background-image: none;
}

.jadwal-imsak-bsi .landing-qr {
	@apply absolute top-0 left-0 w-1/2 h-full;
} */

.video-example-idx {
  position: absolute;
  top: 10%;
  left: 29%;
  height: 253px;
  width: 124px;
  --tw-rotate: 12.5deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  overflow: hidden;
  border-radius: 0.75rem;
}

@media (min-width: 1024px) {
  .video-example-idx {
    height: 321px;
    width: 155px;
  }
}

.video-box-wrap.inline {
  display: block;
}

.videoKG-item {
  width: 100%;
  padding: 10px;
}

.videoKG-title {
  margin-top: 8px;
  margin-bottom: 4px;
  height: auto;
  font-weight: 600;
  line-height: 120%;
  color: #fff;
  font-family: "Inter", sans-serif;
}

.videoKG-image {
  border-radius: 8px;
}

.videoKG-info {
  display: flex;
  align-items: center;
  flex-direction: row;
  font-family: "Inter", sans-serif;
}

.videoKG-subtitle {
  position: relative;
  padding-right: 12px;
}

.videoKG-subtitle:after {
  position: absolute;
  content: "";
  width: 4px;
  height: 4px;
  background-color: #fff;
  border-radius: 100%;
  right: 3px;
  top: 0;
  bottom: 0;
  margin: auto;
}

.videoKG-date {
  font-size: 12px;
  font-weight: 400;
  color: #fff;
  font-family: "Inter", sans-serif;
}

.videoKG-duration {
  bottom: 0;
  right: 0;
  border-radius: 4px 0 4px 0;
  font-weight: 500;
  padding: 6px 6px 6px 22px;
  font-family: "Inter", sans-serif;
}

.videoKGSlider-detail .videoKG-title,
.videoKGSlider-detail .videoKG-date {
  color: #2a2a2a;
}

.videoKGSlider-detail .videoKG-subtitle:after {
  background-color: #2a2a2a;
}

.videoKGSlider-detail {
  margin-left: -10px;
  margin-right: -10px;
  gap: 0px;
}

.breadcrumb,
.breadcrumb__wrap {
  position: relative;
}

.breadcrumb {
  margin-bottom: 0.625rem;
}

.breadcrumb__item {
  display: inline;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(229 82 37 / var(--tw-text-opacity, 1));
}

.video-box-wrap.breadcrumb__item {
  display: block;
}

.breadcrumb__link {
  position: relative;
  display: inline-block;
}

.breadcrumb__item:after {
  content: " / ";
}

.breadcrumb__item:last-child:after {
  content: "";
}

.grid-wrap {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: flex-start;
  gap: 4rem;
}

@media (min-width: 768px) {
  .grid-wrap {
    height: 435px;
  }
}

@media (min-width: 1024px) {
  .grid-wrap {
    height: 450px;
  }
}

@media (min-width: 768px) {
  .bg-donasi .grid-wrap,
.bg-hikayat .grid-wrap {
    height: 400px;
  }
}

.grid-thumb {
  display: grid;
  grid-template-columns: repeat(3, minmax(165px, 1fr));
  gap: 1rem;
}

.section-titleWrap {
  margin-top: 2rem;
  display: flex;
  max-width: 400px;
  flex-direction: column;
  align-items: flex-start;
}

.section-title {
  margin-bottom: 1rem;
  font-size: 2.25rem;
  line-height: 2.5rem;
  font-weight: 700;
}

.section-desc {
  margin-bottom: 1rem;
  font-size: 1rem;
  line-height: 1.5rem;
}

.section-titleWrap a,
.section-titleWrap .btn-primary {
  margin-top: 2rem;
}

#berkah-harian {
  position: relative;
  overflow: hidden;
  border-radius: 0.75rem;
}

.cover-berkah-harian-content {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  overflow: hidden;
  padding-top: 1.25rem;
  text-align: center;
}

.cover-berkah-harian-content.--sp {
  gap: 1rem;
}

.berkah-harian-logo-client {
  margin-left: auto;
  margin-right: auto;
  width: 5rem;
}

.cover-berkah-harian-content>img {
  width: 12rem;
}

.berkah-harian-wording {
  text-align: center;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.btn-mainkan-berkah-harian {
  width: 10rem;
}

.logo-berkah-harian-sponsor {
  display: none;
}

.kucing-ketupat {
  position: absolute;
  left: 0px;
  bottom: -4rem;
  width: 24rem;
  --tw-rotate: 10deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.kucing-lompat {
  position: absolute;
  right: 0px;
  bottom: -4rem;
  width: 24rem;
  --tw-rotate: -10deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.icoThumb {
  width: 60px;
  height: 60px;
}

.icoVideo {
  background-size: auto 100%;
  filter: invert(100%) sepia(93%) saturate(28%) hue-rotate(107deg) brightness(106%) contrast(109%);
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 .5A6.5 6.5 0 1 0 13.5 7 6.512 6.512 0 0 0 7 .5Zm2.275 6.919-3 2A.544.544 0 0 1 6 9.5a.531.531 0 0 1-.237-.056A.5.5 0 0 1 5.5 9V5a.5.5 0 0 1 .263-.444.519.519 0 0 1 .512.025l3 2a.5.5 0 0 1 0 .838Z' fill='%23000'/%3E%3C/svg%3E");
}

.vertical-video-itembox {
  position: absolute;
  left: 0px;
  bottom: 0px;
  display: flex;
  height: 8rem;
  width: 100%;
  align-items: flex-end;
  padding: 0.75rem;
  background: rgb(0, 0, 0);
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0) 100%);
}

.vertical-video-title {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  font-size: 16px;
  font-weight: 700;
  -webkit-line-clamp: 5;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 20px;
}

.playlist-timestamp {
  position: absolute;
  bottom: 0.25rem;
  right: 0.25rem;
  border-radius: 0.5rem;
  background-color: rgb(0 0 0 / 0.7);
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  font-size: 0.75rem;
  line-height: 1rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.playlist-slider {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.playlist-slider .videoKG-image {
  height: 8rem;
}

.icoSocmed {
  background-color: transparent;
}

.icoSocmed:after {
  filter: none;
}

.icoFacebook:after {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M24%2012.073C24%2018.062%2019.606%2023.027%2013.87%2023.928V15.565H16.659L17.19%2012.105H13.87V9.86C13.87%208.913%2014.334%207.991%2015.82%207.991H17.329V5.045C17.329%205.045%2015.959%204.811%2014.65%204.811C11.916%204.811%2010.13%206.468%2010.13%209.467V12.104H7.091V15.564H10.13V23.927C4.395%2023.025%200%2018.061%200%2012.073C0%205.446%205.373%200.072998%2012%200.072998C18.627%200.072998%2024%205.445%2024%2012.073Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E");
}

.icoLine:after {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_371_3720)%22%3E%3Cpath%20d%3D%22M18.59%200H5.41C2.422%200%200%202.422%200%205.41V18.59C0%2021.578%202.422%2024%205.41%2024H18.59C21.578%2024%2024%2021.578%2024%2018.59V5.41C24%202.422%2021.577%200%2018.59%200ZM18.284%2014.865C16.605%2016.797%2012.852%2019.151%2011.998%2019.511C11.144%2019.871%2011.27%2019.282%2011.305%2019.079C11.326%2018.959%2011.419%2018.394%2011.419%2018.394C11.446%2018.19%2011.474%2017.873%2011.393%2017.671C11.303%2017.448%2010.949%2017.333%2010.688%2017.276C6.843%2016.768%203.996%2014.08%203.996%2010.87C3.996%207.29%207.586%204.376%2011.998%204.376C16.41%204.376%2020%207.289%2020%2010.87C19.999%2012.302%2019.444%2013.593%2018.284%2014.865Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M15.81%2010.0119V10.6009H17.338C17.422%2010.6009%2017.491%2010.6699%2017.491%2010.7539V11.3219C17.491%2011.4059%2017.423%2011.4749%2017.338%2011.4749H15.81V12.0639H17.338C17.422%2012.0639%2017.491%2012.1329%2017.491%2012.2169V12.7849C17.491%2012.8689%2017.423%2012.9369%2017.338%2012.9369H15.09C15.006%2012.9369%2014.937%2012.8689%2014.937%2012.7849V9.29192C14.937%209.20792%2015.005%209.13892%2015.09%209.13892H17.338C17.422%209.13892%2017.491%209.20692%2017.491%209.29192V9.85892C17.491%209.94292%2017.423%2010.0119%2017.338%2010.0119H15.81Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M9.17409%2012.2169V12.7849C9.17409%2012.8689%209.10609%2012.9369%209.02109%2012.9369H6.77309C6.68909%2012.9369%206.62109%2012.8689%206.62109%2012.7849V9.29192C6.62109%209.20792%206.68909%209.13892%206.77309%209.13892H7.34109C7.42509%209.13892%207.49409%209.20692%207.49409%209.29192V12.0639H9.02209C9.10609%2012.0639%209.17409%2012.1329%209.17409%2012.2169Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M10.5283%209.29192V12.7839C10.5283%2012.8679%2010.4603%2012.9359%2010.3753%2012.9359H9.80827C9.72427%2012.9359%209.65527%2012.8679%209.65527%2012.7839V9.29192C9.65527%209.20792%209.72327%209.13892%209.80827%209.13892H10.3753C10.4593%209.13892%2010.5283%209.20792%2010.5283%209.29192Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M14.3913%209.29192V12.7839C14.3913%2012.8679%2014.3233%2012.9359%2014.2383%2012.9359H13.6743C13.6243%2012.9359%2013.5753%2012.9109%2013.5463%2012.8699L11.9463%2010.7099V12.7839C11.9463%2012.8679%2011.8783%2012.9359%2011.7933%2012.9359H11.2253C11.1413%2012.9359%2011.0723%2012.8679%2011.0723%2012.7839V9.29192C11.0723%209.20792%2011.1403%209.13892%2011.2253%209.13892H11.7893C11.8423%209.13892%2011.8883%209.16692%2011.9193%209.20792L13.5173%2011.3659V9.29192C13.5173%209.20792%2013.5853%209.13892%2013.6703%209.13892H14.2383C14.3233%209.13892%2014.3913%209.20792%2014.3913%209.29192Z%22%20fill%3D%22black%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_371_3720%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

.icoTelegram:after {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_371_3722)%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M12%200C5.373%200%200%205.373%200%2012C0%2018.627%205.373%2024%2012%2024C18.627%2024%2024%2018.627%2024%2012C24%205.373%2018.627%200%2012%200ZM17.562%208.161C17.382%2010.058%2016.6%2014.663%2016.203%2016.788C16.035%2017.688%2015.703%2017.989%2015.383%2018.018C14.686%2018.082%2014.157%2017.557%2013.482%2017.115C12.426%2016.423%2011.829%2015.992%2010.804%2015.316C9.619%2014.535%2010.387%2014.106%2011.062%2013.405C11.239%2013.221%2014.309%2010.428%2014.369%2010.175C14.376%2010.143%2014.384%2010.025%2014.313%209.963C14.242%209.901%2014.139%209.922%2014.065%209.939C13.959%209.963%2012.272%2011.078%209.003%2013.284C8.524%2013.613%208.09%2013.773%207.701%2013.765C7.273%2013.756%206.449%2013.523%205.836%2013.323C5.085%2013.079%204.487%2012.949%204.539%2012.535C4.566%2012.319%204.863%2012.098%205.431%2011.872C8.929%2010.348%2011.262%209.343%2012.429%208.857C15.762%207.471%2016.454%207.23%2016.906%207.222C17.472%207.214%2017.608%207.681%2017.562%208.161Z%22%20fill%3D%22black%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_371_3722%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

.icoCopyLink:after {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_371_3721)%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2212%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M12%200C5.37281%200%200%205.37281%200%2012C0%2018.6272%205.37281%2024%2012%2024C18.6272%2024%2024%2018.6272%2024%2012C24%205.37281%2018.6272%200%2012%200ZM13.6627%2017.1L12.8972%2017.8655C12.4513%2018.3103%2011.9222%2018.663%2011.34%2018.9032C10.7578%2019.1435%2010.134%2019.2667%209.50421%2019.2658C8.8744%2019.2649%208.25093%2019.1399%207.66945%2018.8979C7.08797%2018.6559%206.55986%2018.3018%206.11531%2017.8556C4.24875%2015.9806%204.28719%2012.9338%206.1575%2011.0588L6.89062%2010.3275C7.04939%2010.1687%207.2647%2010.0796%207.48922%2010.0796C7.71373%2010.0796%207.92905%2010.1687%208.08781%2010.3275C8.24656%2010.4863%208.33575%2010.7016%208.33575%2010.9261C8.33575%2011.1506%208.24656%2011.3659%208.08781%2011.5247L7.32187%2012.2902C7.033%2012.5797%206.80428%2012.9235%206.6489%2013.3018C6.49353%2013.6802%206.41456%2014.0855%206.41657%2014.4945C6.41857%2014.9035%206.5015%2015.308%206.66058%2015.6848C6.81966%2016.0616%207.05174%2016.4032%207.34344%2016.6898C8.56219%2017.8833%2010.523%2017.8453%2011.7281%2016.6402L12.4655%2015.9028C12.5439%2015.8232%2012.6372%2015.76%2012.7402%2015.7167C12.8431%2015.6734%2012.9537%2015.6508%2013.0654%2015.6504C13.1771%2015.65%2013.2877%2015.6717%2013.391%2015.7143C13.4943%2015.7568%2013.5881%2015.8194%2013.6671%2015.8984C13.7461%2015.9774%2013.8086%2016.0712%2013.8512%2016.1745C13.8938%2016.2777%2013.9155%2016.3884%2013.915%2016.5001C13.9146%2016.6118%2013.8921%2016.7223%2013.8488%2016.8253C13.8055%2016.9282%2013.7422%2017.0216%2013.6627%2017.1ZM15.007%2010.1803L10.1789%2015.0084C10.0191%2015.1617%209.80559%2015.2462%209.58418%2015.244C9.36276%2015.2417%209.15106%2015.1527%208.99446%2014.9962C8.83786%2014.8396%208.74882%2014.628%208.74644%2014.4065C8.74406%2014.1851%208.82852%2013.9716%208.98172%2013.8117L13.8098%208.98359C13.969%208.82677%2014.1837%208.73923%2014.4071%208.74005C14.6306%208.74088%2014.8446%208.83%2015.0026%208.988C15.1606%209.14599%2015.2497%209.36005%2015.2506%209.58348C15.2514%209.80692%2015.1639%2010.0216%2015.007%2010.1808V10.1803ZM17.8664%2012.8991L17.1%2013.6627C17.0216%2013.7422%2016.9282%2013.8055%2016.8253%2013.8488C16.7223%2013.8921%2016.6118%2013.9146%2016.5001%2013.915C16.3884%2013.9155%2016.2777%2013.8938%2016.1745%2013.8512C16.0712%2013.8086%2015.9774%2013.7461%2015.8984%2013.6671C15.8194%2013.5881%2015.7568%2013.4943%2015.7143%2013.391C15.6717%2013.2877%2015.65%2013.1771%2015.6504%2013.0654C15.6508%2012.9537%2015.6734%2012.8431%2015.7167%2012.7402C15.76%2012.6372%2015.8232%2012.5439%2015.9028%2012.4655L16.6683%2011.7C16.9571%2011.4104%2017.1858%2011.0666%2017.3411%2010.6882C17.4965%2010.3099%2017.5754%209.90455%2017.5734%209.49557C17.5713%209.08658%2017.4883%208.68205%2017.3292%208.30528C17.1701%207.92851%2016.938%207.58696%2016.6462%207.30031C15.4298%206.10688%2013.4672%206.14438%2012.262%207.35L11.5247%208.08734C11.3659%208.24609%2011.1506%208.33528%2010.9261%208.33528C10.7016%208.33528%2010.4863%208.24609%2010.3275%208.08734C10.1687%207.92858%2010.0796%207.71326%2010.0796%207.48875C10.0796%207.26424%2010.1687%207.04892%2010.3275%206.89016L11.0625%206.1575C12.9342%204.28578%2015.9811%204.24875%2017.8594%206.11531C18.3053%206.56011%2018.6591%207.08841%2018.9008%207.67003C19.1424%208.25164%2019.2671%208.87517%2019.2677%209.50499C19.2682%2010.1348%2019.1447%2010.7586%2018.9041%2011.3406C18.6635%2011.9227%2018.3106%2012.4516%2017.8655%2012.8972L17.8664%2012.8991Z%22%20fill%3D%22black%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_371_3721%22%3E%3Crect%20width%3D%2224%22%20height%3D%2224%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E");
}

.read__title {
  margin: 5px 0 16px;
  font-size: 36px;
  font-weight: 500;
  color: #1a1a1a;
}

.read__time {
  color: #888;
}

#donasi-poin .btn-secondary {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(226 226 226 / var(--tw-border-opacity, 1));
}

.modal__container .btn-secondary {
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(15 121 198 / var(--tw-border-opacity, 1));
}

.section-title-nonbold {
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 600;
}

.green-donation-location {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 18px;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(44 80 67 / var(--tw-text-opacity, 1));
}

.green-donation-location::before {
  display: block;
  height: 1.25rem;
  width: 1.25rem;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  --tw-content: "";
  content: var(--tw-content);
  background-image: url("../images/icon-recycle.png");
}

.green-donation-location-detail {
  margin-left: 2rem;
  margin-top: 0.25rem;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(125 142 94 / var(--tw-text-opacity, 1));
}

.green-donation-select {
  width: 100%;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(64 109 93 / var(--tw-bg-opacity, 1));
  background-repeat: no-repeat;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 1rem;
  line-height: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  outline: 2px solid transparent;
  outline-offset: 2px;
  background-image: url("../images/icon-down.png");
  background-size: 16px;
  background-position: right 12px center;
}

.bg-green-donation {
  background-repeat: no-repeat;
  background-image: url("../images/bg-gd-1.png"), url("../images/bg-gd-2.png");
  background-position: left bottom, right bottom;
}

.green-donation-option {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.btn-kumpul-poin {
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.5rem;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 9999px;
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  text-align: center;
  font-weight: 500;
}

.btn-kumpul-poin:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.btn-kumpul-poin {
  background-color: #fab20e !important;
  color: #785800 !important;
}

.btn-verifikasi {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  text-decoration-line: underline;
}

.btn-verifikasi:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
  text-decoration-line: underline;
}

.btn-verifikasi {
  padding: 0 !important;
}

.hidden {
  display: none !important;
}

.btn-buat-ucapan {
  margin-left: auto;
  margin-right: auto;
  margin-top: 1rem;
}

.btn-ucapan-salin {
  margin-top: 1rem;
  border-width: 1px;
  --tw-border-opacity: 1;
  border-color: rgb(15 121 198 / var(--tw-border-opacity, 1));
}

.btn-buat-ucapan-lagi {
  margin-top: 1rem;
}

.kanalMenu ul {
  gap: 0;
}

.kanalMenu ul li {
  padding: 0 6px;
}

.donasi-card {
  position: relative;
  height: 15rem;
  width: 50%;
  overflow: hidden;
  border-radius: 0.75rem;
}

.donasi-card>div>img {
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: right;
     object-position: right;
}

.donasi-card:first-child {
  background: radial-gradient(circle, rgba(254, 242, 151, 1) 0%, rgba(187, 237, 203, 1) 40%, rgba(54, 176, 200, 1) 100%);
}

.donasi-card:nth-child(2) {
  background: #B1FEF3;
  background: linear-gradient(180deg, rgba(177, 254, 243, 1) 20%, rgba(32, 152, 243, 1) 100%);
}

.donasi-card:nth-child(3) {
  background: #FFFFEB;
  background: linear-gradient(180deg, rgba(255, 255, 235, 1) 13%, rgba(123, 226, 225, 1) 50%, rgba(78, 131, 211, 1) 100%);
}

.text-donasi-card {
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: rgb(28 50 100 / var(--tw-text-opacity, 1));
}

.ucapan-client-title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.25rem;
}

.ucapan-client-title-logo {
  margin-bottom: 1rem;
  width: 5rem;
  display: none;
}

.ucapan-client-title-img {
  width: 480px;
}

.bg-playlist .videoKG-subtitle span {
  /* background: #ef0d70;
	background: -webkit-gradient(linear, left top, left bottom, from(#ef0d70), to(#fb571a));
	background: linear-gradient(180deg, #ef0d70 0, #fb571a);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent; */
  color: #5a5a5a;
  font-weight: 600;
}

#playlist .aspect-video iframe {
  position: relative;
  left: -2px;
}

.btn-white {
  background: #ffff;
  color: #0F79C6;
}

.jadwalimsak-wrap .header {
  /* background-image: url("../images/bg-1.png");
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;*/
  height: 300px;
  display: block;
  width: 100%;
  margin: 0 auto;
  background: rgb(14, 157, 213);
  background: linear-gradient(138deg, rgba(14, 157, 213, 1) 0%, rgba(17, 74, 171, 1) 100%);
}

.jadwalimsak-wrap .header h3 {
  position: absolute;
  bottom: -50px;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}

.select2-container .select2-selection--single {
  height: 3rem !important;
  border-color: #007c76 !important;
  border-radius: 8px !important;
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: #00a39d !important;
  color: #fff !important;
}

.ramadhan .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 3rem !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 0px;
  bottom: 0px;
  margin-top: auto;
  margin-bottom: auto;
}

.ornament-wrap {
  max-width: 500px;
  margin: 0 auto;
  width: 100%;
  height: 300px;
  position: relative;
}

.ornament-mob {
  display: flex;
  justify-content: space-between;
  position: absolute;
  width: 100%;
}

.ornament-mob-top {
  top: 20px;
}

.ornament-mob-center {
  position: relative;
  top: 67px;
}

.ornament-mob-center img {
  width: 250px;
  height: 110px;
  margin: 0 auto;
}

.ornament-mob-bottom {
  bottom: -20px;
  display: flex;
  align-items: end;
}

.ornament-mob-bottom .left-img {
  width: 150px;
  height: 133px;
}

.footer-jadwal-imsak {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 10px;
}

.footer-jadwal-imsak img {
  width: 80px;
  height: 19px;
}

/* detal lebih dekat; */

.ramadhan .sideArticleList .articleItem .articleTitle {
  --tw-text-opacity: 1;
  color: rgb(26 26 26 / var(--tw-text-opacity, 1));
}

.ramadhan .videoKG-channel,
.ramadhan .videoKG-date,
.ramadhan .credit-title-name .credit-title-nameEditor {
  --tw-text-opacity: 1;
  color: rgb(90 90 90 / var(--tw-text-opacity, 1));
}

.ramadhan .credit-title p {
  --tw-text-opacity: 1;
  color: rgb(102 102 102 / var(--tw-text-opacity, 1));
}

.ramadhan .videoKG-content .read__content,
.commentWrap.--comment_v2 .commentHead-title,
.ramadhan .articleTitle,
.ramadhan .sectionHead-title {
  --tw-text-opacity: 1;
  color: rgb(26 26 26 / var(--tw-text-opacity, 1));
}

.ramadhan .--read-more .toggle-btn {
  --tw-text-opacity: 1;
  color: rgb(26 26 26 / var(--tw-text-opacity, 1));
}

.ramadhan .videoKG-content:after {
  background-color: #fff;
}

.ramadhan .commentWrap.--comment_v2 .comment {
  background-color: #f7f7f7;
}

.ramadhan .commentWrap.--comment_v2 .commentForm form {
  border: 1px solid #e5e7eb;
}

.ramadhan .commentWrap.--comment_v2 .commentForm textarea {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.ramadhan .credit-picture-img {
  --tw-border-opacity: 1;
  border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}

.ramadhan .tagsCloud-tag ul li a {
  --tw-border-opacity: 1;
  border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(54 56 58 / var(--tw-text-opacity, 1));
}

.ramadhan .tagsCloud-tag.--wmore:after {
  background: linear-gradient(180deg, hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, .9) 35%);
}

.ramadhan .tagsCloud-tag .toggle-btn {
  --tw-text-opacity: 1;
  color: rgb(51 51 51 / var(--tw-text-opacity, 1));
}

.ramadhan .tagsCloud-tag .toggle-btn:after {
  filter: none;
}

.ramadhan .reaction.--new .button .icoBase {
  filter: invert(44%) sepia(0%) saturate(0%) hue-rotate(159deg) brightness(86%) contrast(82%)
}

.ramadhan .articlePost-subtitle,
.ramadhan .articlePost-date {
  text-transform: none;
  --tw-text-opacity: 1;
  color: rgb(90 90 90 / var(--tw-text-opacity, 1));
}

.ramadhan .reaction.--new .button .reactionTxt {
  color: #666
}

.ramadhan .reaction.--new .button {
  background-color: #f3f3f3;
}

.ramadhan.--lebihdekatPlayer .footerMain {
  z-index: 0;
}

.lebih-dekatWrap .articleTitle,
.lebih-dekatWrap .articlePost-date,
.lebih-dekatWrap .articlePost-subtitle,
.lebih-dekatWrap .article-link {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.lebih-dekatWrap .articleTitle:hover,
.lebih-dekatWrap .articlePost-date:hover,
.lebih-dekatWrap .articlePost-subtitle:hover,
.lebih-dekatWrap .article-link:hover {
  --tw-text-opacity: 1;
  color: rgb(13 85 134 / var(--tw-text-opacity, 1));
}

.lebih-dekatWrap .article-link:hover .articleTitle {
  color: #0D5586;
}

.video-lapar {
  aspect-ratio: 9 / 16;
  width: 55%;
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}

.video-lapar iframe {
  aspect-ratio: 9 / 16;
  width: 100%;
}

.ramadhan-home .footerMain {
  margin-top: 0px;
}

/* 
@media screen and (min-height: 690px) {
	.video-lapar {
		height: calc(100vh - 82px - 130px);
		width: calc(9/16 * (100vh - 82px - 130px))
	}
} */

.ramadhan .modalContent {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.ramadhan .modal_body {
  background-color: #f3f3f3;
}

.ramadhan .modalContent .socmedList {
  width: 100%;
  padding: 20px 10px;
}

.ramadhan .modalContent .socmedButton {
  min-width: 65px;
  flex-basis: 65px;
}

.ramadhan .modalTitle {
  color: #2a2a2a;
}

.ramadhan .modalContent .modalBody {
  background: #f3f3f3;
}

.ramadhan .modalContent .socmedTitle,
.ramadhan .modalContent .socmedTxt {
  color: #666;
}

.ramadhan .modalContent .icoDismiss {
  width: 32px;
  height: 32px;
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m1 1 16 16M17 1 1 17' stroke='%23000' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  filter: none;
}

.ramadhan .modalContent .icoSocmed:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-position: 50%;
  background-size: auto;
  background-repeat: no-repeat;
  filter: invert(99%) sepia(100%) saturate(2%) hue-rotate(318deg) brightness(110%) contrast(101%)
}

.ramadhan .modalContent .icoFacebook {
  background-color: #3b5998;
}

.ramadhan .modalContent .icoFacebook:after {
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.857 3.49H9.5V.626A21.22 21.22 0 0 0 7.107.5C4.738.5 3.113 1.99 3.113 4.73v2.52H.5v3.2h2.613v8.05h3.206v-8.05h2.509l.4-3.2H6.319v-2.2c0-.925.25-1.558 1.538-1.558V3.49Z' fill='%23000'/%3E%3C/svg%3E");
}

.ramadhan .modalContent .icoTwitter,
.ramadhan .modalContent .icoX {
  background-color: #000;
}

.ramadhan .modalContent .icoTwitter:after,
.ramadhan .modalContent .icoX:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='17' fill='none'%3E%3Cpath fill='%23000' d='M9.522 6.904 15.48 0h-1.412L8.895 5.995 4.765 0H0l6.247 9.065L0 16.305h1.412l5.461-6.33 4.363 6.33H16l-6.478-9.4ZM7.59 9.145l-.633-.903L1.92 1.06h2.168l4.064 5.796.633.903 5.283 7.535H11.9L7.589 9.145Z'/%3E%3C/svg%3E");
}

.ramadhan .modalContent .icoWhatsapp {
  background-color: #25d366;
}

.ramadhan .modalContent .icoWhatsapp:after {
  background-image: url("data:image/svg+xml,%3Csvg width='19' height='19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.573 11.297c-.223-.112-1.32-.65-1.524-.726-.204-.075-.353-.112-.5.112-.147.224-.576.726-.706.875-.13.15-.26.168-.483.056a6.09 6.09 0 0 1-1.797-1.108 6.724 6.724 0 0 1-1.241-1.545c-.13-.223-.014-.344.1-.455.114-.11.223-.26.335-.39a1.52 1.52 0 0 0 .223-.373.41.41 0 0 0-.019-.39c-.056-.113-.5-1.21-.688-1.657-.188-.446-.365-.376-.5-.383a8.41 8.41 0 0 0-.428-.008.82.82 0 0 0-.595.28 2.5 2.5 0 0 0-.781 1.86c.073.842.39 1.644.911 2.308a9.945 9.945 0 0 0 3.808 3.367c.415.18.84.336 1.272.47.455.138.936.168 1.405.088a2.302 2.302 0 0 0 1.506-1.06c.146-.334.191-.703.13-1.062-.056-.093-.2-.149-.428-.26v.001ZM9.5 16.854a7.41 7.41 0 0 1-3.777-1.034l-.271-.16-2.808.736.75-2.738-.176-.28A7.42 7.42 0 1 1 9.5 16.853Zm6.318-13.736A8.93 8.93 0 0 0 1.767 13.891L.5 18.517l4.733-1.24a8.921 8.921 0 0 0 9.228-.42 8.932 8.932 0 0 0 1.357-13.739Z' fill='%23000'/%3E%3C/svg%3E");
}

.ramadhan .modalContent .icoLine {
  background-color: #00c300;
}

.ramadhan .modalContent .icoLine:after {
  background-image: url("data:image/svg+xml,%3Csvg width='23' height='22' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.955 8.875a.568.568 0 1 1 0 1.137h-1.582v1.016h1.582a.568.568 0 0 1 0 1.135H15.8a.57.57 0 0 1-.565-.567v-4.3a.57.57 0 0 1 .568-.568h2.151a.568.568 0 0 1 0 1.136h-1.581v1.01h1.582Zm-3.475 2.718a.567.567 0 0 1-.568.565.556.556 0 0 1-.46-.225l-2.2-2.99v2.65a.568.568 0 1 1-1.133 0v-4.3a.565.565 0 0 1 .556-.567.583.583 0 0 1 .446.229l2.219 3V7.293a.569.569 0 0 1 1.136 0l.004 4.3Zm-5.175 0a.567.567 0 0 1-1.134 0v-4.3a.567.567 0 0 1 1.134 0v4.3Zm-2.223.567h-2.15a.571.571 0 0 1-.568-.567v-4.3a.568.568 0 1 1 1.136 0v3.735h1.583a.568.568 0 0 1 0 1.135l-.001-.003Zm15.051-2.876c0-4.841-4.854-8.781-10.817-8.781S.5 4.44.5 9.28c0 4.337 3.849 7.97 9.045 8.66.352.074.832.233.954.532.084.318.095.65.034.973l-.148.919c-.041.27-.216 1.069.946.58a34.866 34.866 0 0 0 8.505-6.286 7.771 7.771 0 0 0 2.3-5.38' fill='%23000'/%3E%3C/svg%3E");
}

.ramadhan .modalContent .icoTelegram {
  background-color: #2aabee;
}

.ramadhan .modalContent .icoTelegram:after {
  background-image: url("data:image/svg+xml,%3Csvg width='23' height='19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m9.375 12.263-.357 5.026a1.248 1.248 0 0 0 1-.483l2.4-2.29 4.966 3.637c.911.508 1.553.24 1.8-.838l3.26-15.275C22.733.694 21.957.167 21.07.497L1.9 7.83C.595 8.339.615 9.068 1.68 9.4l4.9 1.524L17.958 3.8c.535-.355 1.022-.158.622.2l-9.205 8.263Z' fill='%23000'/%3E%3C/svg%3E");
}

.ramadhan .modalContent .icoCopyLink {
  background-color: #999;
}

.ramadhan .modalContent .icoCopyLink:after {
  background-image: url("data:image/svg+xml,%3Csvg width='19' height='19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m6.5 12.5 6-6M11.5 13.658l-2.567 2.567a4.353 4.353 0 0 1-7.433-3.08c0-1.154.459-2.262 1.275-3.078L5.342 7.5M13.658 11.5l2.567-2.567a4.354 4.354 0 1 0-6.158-6.158L7.5 5.342' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.placeholder\:italic::-moz-placeholder {
  font-style: italic;
}

.placeholder\:italic::placeholder {
  font-style: italic;
}

.after\:h-4::after {
  content: var(--tw-content);
  height: 1rem;
}

.after\:w-4::after {
  content: var(--tw-content);
  width: 1rem;
}

.after\:bg-\[url\(\.\.\/images\/icon-right\.png\)\]::after {
  content: var(--tw-content);
  background-image: url(../images/icon-right.png);
}

.after\:bg-contain::after {
  content: var(--tw-content);
  background-size: contain;
}

.after\:bg-no-repeat::after {
  content: var(--tw-content);
  background-repeat: no-repeat;
}

.after\:brightness-1000::after {
  content: var(--tw-content);
  --tw-brightness: brightness(10);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.odd\:bg-cah-light-green:nth-child(odd) {
  --tw-bg-opacity: 1;
  background-color: rgb(243 254 252 / var(--tw-bg-opacity, 1));
}

.odd\:bg-jb-babyblue:nth-child(odd) {
  --tw-bg-opacity: 1;
  background-color: rgb(238 243 251 / var(--tw-bg-opacity, 1));
}

.even\:bg-white:nth-child(even) {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.hover\:text-bsi-green2:hover {
  --tw-text-opacity: 1;
  color: rgb(0 124 118 / var(--tw-text-opacity, 1));
}

.hover\:text-white:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

@media (min-width: 768px) {
  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .md\:flex-row {
    flex-direction: row;
  }

  .md\:items-center {
    align-items: center;
  }

  .md\:gap-20 {
    gap: 5rem;
  }

  .md\:py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .md\:py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .md\:text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
  }

  .md\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .md\:text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}

@media (min-width: 1024px) {
  .lg\:left-0 {
    left: 0px;
  }

  .lg\:mx-auto {
    margin-left: auto;
    margin-right: auto;
  }

  .lg\:w-80 {
    width: 20rem;
  }

  .lg\:w-\[500px\] {
    width: 500px;
  }

  .lg\:w-full {
    width: 100%;
  }

  .lg\:p-0 {
    padding: 0px;
  }

  .lg\:text-left {
    text-align: left;
  }

  .lg\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

@media (min-width: 1280px) {
  .xl\:-top-\[18\%\] {
    top: -18%;
  }

  .xl\:bottom-0 {
    bottom: 0px;
  }

  .xl\:bottom-4 {
    bottom: 1rem;
  }

  .xl\:bottom-\[5\%\] {
    bottom: 5%;
  }

  .xl\:right-\[25\%\] {
    right: 25%;
  }

  .xl\:right-\[35\%\] {
    right: 35%;
  }

  .xl\:right-\[40\%\] {
    right: 40%;
  }

  .xl\:w-60 {
    width: 15rem;
  }

  .xl\:w-\[240px\] {
    width: 240px;
  }

  .xl\:w-\[250px\] {
    width: 250px;
  }

  .xl\:w-\[300px\] {
    width: 300px;
  }

  .xl\:w-\[400px\] {
    width: 400px;
  }
}

@media (min-width: 1536px) {
  .\32xl\:-top-\[17\%\] {
    top: -17%;
  }

  .\32xl\:right-\[10\%\] {
    right: 10%;
  }
}