/* COPYRIGHT 2025-2026 RIHAM S. ALL RIGHTS RESERVED. */

  @font-face { font-family: 'Ubuntu Sans'; font-style: normal; font-weight: 435; font-stretch: 100%; font-display: swap; src: url('../dist/asset/Blogs.WOFF2') format('woff2'); }  @font-face { font-family: 'Ubuntu Sans'; font-style: italic; font-weight: 600; font-stretch: 100%; font-display: swap; src: url('../dist/asset/Riham.WOFF2') format('woff2'); }  @font-face { font-family: 'PT Serif'; font-style: normal; font-weight: 700; font-display: swap; src: url('../dist/asset/PTSerif.WOFF2') format('woff2'); }    @font-face { font-family: 'Google Sans Flex'; font-style: normal; font-weight: 400 600; font-stretch: 100%; font-display: swap; src: url('../dist/asset/GoogleSans.WOFF2') format('woff2'); }   @media (max-width: 736px) { #dialog { display: block; transition: transform 0.3s ease; transform: translateX(-100%); } #dialog[open] { transform: translateX(0) } } @media (min-width: 736px) { [data-tag="footer"] > div { flex-direction: row !important; justify-content: space-between; } } @media (max-width: 380px) { html { font-size: 14px } } @media (min-width: 1024px) { html { font-size: 18px } }  *, *::after, *::before { box-sizing: border-box; margin: 0; padding: 0; } html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; tap-highlight-color: transparent; touch-action: manipulation; }  :root { --font-size-sm: clamp(.15rem, 6.45vw, .85rem); --font-size-by: clamp(.3rem, 6.6vw, 1rem); --font-size-rg: clamp(.4rem, 6.7vw, 1.1rem); --font-size-hr: clamp(.7rem, 7vw, 1.4rem); --font-size-jb: clamp(.9rem, 7.2vw, 1.6rem); --font-size-dp: clamp(1.1rem, 7.4vw, 1.8rem); --lh-body: 1.6; --lh-heading: 1.4; --lh-hero: 1.175; --fw-bold: 600; --fw-semibold: 550; --fw-regular: 485; --fw-normal: 435; --fw-thin: 400; } [data-scheme="default"] { --base-100: #FAFAFA; --base-200: var(--base-100); --base-300: #E2E2E2; --text-100: #202020; --text-200: var(--text-100); --border-100: #CCCCCC; --border-200: black; --border-style: dashed; --olive: black; } [data-scheme="dark"] { --base-100: #242424; --base-200: #282828; --base-300: #363636; --text-100: #E4E4E4; --text-200: #C0C0C0; --border-100: #404040; --border-200: #404040; --border-style: solid; --olive: #82A675; } [data-scheme="black"] { --base-100: #202020; --base-200: #282828; --text-100: #E4E4E4; --text-200: var(--text-100); --border-100: #323232; --border-200: #404040; --border-style: solid; --olive: #82A675; }  [hidden] { display: none !important } [data-style="sr-only"] { width: 1px; overflow: hidden; height: 1px; position: absolute; white-space: nowrap; clip: rect(0, 0, 0, 0); clip-path: inset(50%); margin: -1px; padding: 0; border: 0; }  [data-scroll="none"] { scrollbar-width: none; -ms-overflow-style: none; } [data-scroll="none"]::-webkit-scrollbar {	display: none }  button.unstyled { border: none; background: none; color: inherit; cursor: pointer; } a.unstyled { font: inherit; color: inherit; cursor: pointer; text-decoration: none; } ul.unstyled { list-style: none } input.unstyled { font: inherit; border: 0; background: none; color: inherit; line-height: normal; appearance: none; -webkit-appearance: none; -moz-appearance: none; outline: none; }  [data-strip="green"] { border-left: 0.175rem solid #658C58 }[data-visual="olive"] [data-tag="header-element"] { border-top-width: 0.5rem; border-top-style: solid; border-top-color: transparent; border-image-source: linear-gradient(to right, rgb(49, 105, 78) 0%, rgb(49, 105, 78) 14.28%, rgb(101, 140, 88) 14.28%, rgb(101, 140, 88) 28.56%, rgb(187, 200, 99) 28.56%, rgb(187, 200, 99) 42.84%, rgb(240, 228, 145) 42.84%, rgb(240, 228, 145) 57.12%, rgb(187, 200, 99) 57.12%, rgb(187, 200, 99) 71.4%, rgb(101, 140, 88) 71.4%, rgb(101, 140, 88) 85.68%, rgb(49, 105, 78) 85.68%, rgb(49, 105, 78) 100%); border-image-slice: 1; } [data-visual="olive"] { --brand-color: var(--olive); } [data-style="google"]:focus-within { border-color: var(--brand-color) } [data-style="google"]:focus-within label { color: var(--brand-color) } [data-style="google"] { caret-color: var(--brand-color); border-width: 0.15rem !important; } [data-style="spinner"] { width: 2.5rem; height: 2.5rem; border: .35rem solid var(--base-300); border-top: .35rem solid var(--brand-color); border-radius: 50%; animation: spin 1s linear infinite; } @keyframes spin {
	0% { transform: rotate(0deg) }
	100% { transform: rotate(360deg) }
}.sm {	font-size: var(--font-size-sm) } .by {	font-size: var(--font-size-by) } .rg {	font-size: var(--font-size-rg) } .hr { font-size: var(--font-size-hr) } .jb {	font-size: var(--font-size-jb) } .dp {	font-size: var(--font-size-dp) } .lh-body { line-height: var(--lh-body) } .lh-heading {	line-height: var(--lh-heading) } .lh-hero { line-height: var(--lh-hero) } .fw-bold { font-weight: var(--fw-bold) } .fw-semibold { font-weight: var(--fw-semibold) } .fw-regular {	font-weight: var(--fw-regular) } .fw-normal { font-weight: var(--fw-normal) } .fw-thin { font-weight: var(--fw-thin) } .sans-serif { font-family: 'Google Sans Flex', sans-serif } .serif { font-family: 'PT Serif', serif } .avatar {	font-family: 'Ubuntu Sans', sans-serif } .z-5 { z-index: 125 } .z-6 { z-index: 150 } .top-0 { top: 0 } .left-0 { left: 0 } .p-4 { padding: 1rem } .p-2y { padding-top: 0.5rem; padding-bottom: 0.5rem; } .p-3y { padding-top: 0.75rem; padding-bottom: 0.75rem; } .p-4y { padding-top: 1rem; padding-bottom: 1rem; } .p-5y { padding-top: 1.25rem; padding-bottom: 1.25rem; } .p-6y { padding-top: 1.5rem; padding-bottom: 1.5rem; } .p-8y { padding-top: 2rem; padding-bottom: 2rem; } .p-1x { padding-left: 0.25rem; padding-right: 0.25rem; } .p-2x { padding-left: 0.5rem; padding-right: 0.5rem; } .p-3x { padding-left: 0.75rem; padding-right: 0.75rem; } .p-4x { padding-left: 1rem; padding-right: 1rem; } .p-5x { padding-left: 1.25rem; padding-right: 1.25rem; } .p-8x { padding-left: 2rem; padding-right: 2rem; } .flex { display: flex } .flex-center { align-items: center; justify-content: center; } .justify-start { justify-content: flex-start } .justify-seperate { justify-content: space-between } .flex-wrap { flex-wrap: wrap } .flex-column { flex-direction: column } .g-1 { gap: .25rem } .g-2 { gap: .5rem } .g-3 { gap: .75rem } .g-4 { gap: 1rem } .g-5 { gap: 1.25rem } .g-6 { gap: 1.5rem } .i { font-style: italic } .u { border-bottom: 0.065rem solid currentColor } .text-center { text-align: center } .relative { position: relative } .fixed { position: fixed } .sticky { position: sticky } .slash { list-style: none } .slash li:not(:last-child)::after { padding-left: 0.27rem; content: "/"; } .s-d { overflow: hidden } .s-x { overflow-x: auto } .s-y { overflow-y: auto } .w-0 { width: 100% } .h-0 { height: 100% } .m-2b { margin-bottom: .5rem } .m-3b { margin-bottom: .75rem } .m-6b { margin-bottom: 1.5rem } .m-2t { margin-top: .5rem } .m-3t { margin-top: .75rem } .m-8t { margin-top: 2rem } .b-t { border-top: var(--r) } .b-b { border-bottom: var(--r) } .b-all { border: var(--r) } .solid { --r: 0.09rem solid currentColor } .varied { --r: 0.09rem var(--border-style) currentColor } .circle { border-radius: 50% } .base-100 { background-color: var(--base-100) } .text-100 { color: var(--text-100) } .border-100 { border-color: var(--border-100) } .base-200 { background-color: var(--base-200) } .text-200 { color: var(--text-200) } .border-200 { border-color: var(--border-200) } .border-transparent { border: none } .pointer { cursor: pointer } .o-3 { opacity: .7 } .o-4 { opacity: .8 } .o-5 { opacity: .9 } .viewport-only { min-height: 100vh; max-height: 100vh; min-height: 100dvh; max-height: 100dvh; } .avatar-by { width: 2.75rem; height: 2.75rem; } .image-rg { width: 12rem; height: 12rem; } .r-2 { border-radius: 0.25rem } .text-minify { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 90%; } .x-center { margin: 0 auto }