@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
html { font-family: Roboto, Arial, sans-serif; text-size-adjust: 100%; font-size: 16px; line-height: 1.15; -webkit-font-smoothing: antialiased; color: var(--black); margin: 0px auto; }
div, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0px; padding: 0px; outline: none; }
article, aside, details, time, caption, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }
audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }
audio:not([controls]) { display: none; height: 0px; }
[hidden], template { display: none; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: 700; }
dfn { font-style: italic; }
mark { background: rgb(255, 255, 0); color: rgb(17, 17, 17); }
small { font-size: 80%; line-height: 80%; }
sub, sup { font-size: 60%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; left: 1px; }
sub { bottom: -0.25em; }
img { border: 0px; display: block; }
i { font-style: normal; }
figure { margin: 0px; }
hr { box-sizing: content-box; height: 0px; }
pre { overflow: auto; }
code, kbd, pre, samp { font-size: 1em; }
button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0px; }
button { overflow: visible; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
input { line-height: normal; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0px; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }
input[type="search"] { appearance: textfield; box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { appearance: none; }
fieldset { border: 1px solid rgb(192, 192, 192); margin: 0px 2px; padding: 0.35em 0.625em 0.75em; }
legend { border: 0px; padding: 0px; }
textarea { overflow: auto; }
optgroup { font-weight: bold; }
table { border-collapse: collapse; border-spacing: 0px; }
td, th { padding: 0px; }
html { line-height: 1.15; text-size-adjust: 100%; }
body { margin: 0px; }
main { display: block; }
h1 { font-size: 2em; margin: 0.67em 0px; }
hr { box-sizing: content-box; height: 0px; overflow: visible; }
pre { font-family: monospace, monospace; font-size: 1em; }
a { background-color: transparent; }
abbr[title] { border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; text-decoration: underline dotted; }
b, strong { font-weight: bolder; }
code, kbd, samp { font-family: monospace, monospace; font-size: 1em; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sub { bottom: -0.25em; }
sup { top: -0.5em; }
img { border-style: none; }
button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0px; outline: none; }
button, input { overflow: visible; }
button, select { text-transform: none; }
button, [type="button"], [type="reset"], [type="submit"] { appearance: button; outline: none; }
fieldset { padding: 0.35em 0.75em 0.625em; }
legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0px; white-space: normal; }
progress { vertical-align: baseline; }
textarea { overflow: auto; }
[type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0px; }
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }
[type="search"] { appearance: textfield; outline-offset: -2px; }
[type="search"]::-webkit-search-decoration { appearance: none; }
::-webkit-file-upload-button { appearance: button; font: inherit; }
details { display: block; }
summary { display: list-item; }
template { display: none; }
[hidden] { display: none; }
::placeholder { color: var(--dark_gray); }
.videoframe { position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0px; margin: 0px; }
.videoframe iframe { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.chatframe { position: relative; padding-bottom: 140%; padding-top: 25px; height: 0px; margin: 0px; }
.chatframe iframe { position: absolute; top: 0px; left: 0px; width: 100%; height: 395px; }
@keyframes fade-in-up { 
  0% { opacity: 0; }
  100% { transform: translateY(0px); opacity: 1; }
}
.videoframe.stuck { position: fixed; bottom: 20px; right: 20px; width: 320px; height: 240px; transform: translateY(100%); animation: 0.75s ease 0s 1 normal forwards running fade-in-up; z-index: 5; padding: 0px; }
.fade { transition: 0.2s ease-in-out; }
body { margin: 0px auto; padding: 0px; min-height: 100vh; background-color: rgb(255, 255, 255); }
:root { --solid: #000000; --black: #101010; --white: #ffffff; --dark_gray: #929292; --gray: #aab9b9; --soft: #e2e4fc; --soft_blue: #f2f3ff; --ntrl50: #f6f6f6; --ntrl100: #e7e7e7; --ntrl200: #d9d9d9; --ntrl300: #b0b0b0; --ntrl400: #888888; --ntrl500: #6d6d6d; --ntrl600: #545454; --ntrl700: #4f4f4f; --ntrl800: #424242; --ntrl900: #3d3d3d; --ntrl950: #262626; --blue: #133a62; --blue0: #11365b; --blue1: #12375c; --blue2: #194b80; --blue3: #3660a7; --blue4: #3877aa; --red: #ff0c0c; --red2: #c50505; --red3: #af1e23; --cokelat: #551316; --green: #29AB87; --roboto: 'Roboto'; --playfair: 'Playfair Display'; --text: #545454; --black_green: #1e2d32; --pink: #fdd2d7; --tosca: #0097b2; --yellow: #ffbd59; }
.cl-solid { color: var(--solid) !important; }
.cl-black { color: var(--black) !important; }
.cl-white { color: var(--white) !important; }
.cl-soft { color: var(--soft) !important; }
.cl-black_green { color: var(--black_green) !important; }
.cl-blue { color: var(--blue) !important; }
.cl-blue0 { color: var(--blue0) !important; }
.cl-blue1 { color: var(--blue1) !important; }
.cl-blue2 { color: var(--blue2) !important; }
.cl-blue3 { color: var(--blue3) !important; }
.cl-blue4 { color: var(--blue4) !important; }
.cl-gray { color: var(--gray) !important; }
.cl-dark-gray { color: var(--dark_gray) !important; }
.cl-red { color: var(--red) !important; }
.cl-red2 { color: var(--red2) !important; }
.cl-red3 { color: var(--red3) !important; }
.cl-cokelat { color: var(--cokelat) !important; }
.cl-text { color: var(--text) !important; }
.cl-tosca { color: var(--tosca) !important; }
.cl-yellow { color: var(--yellow) !important; }
.bg-solid { background: var(--solid) !important; }
.bg-black { background: var(--black) !important; }
.bg-white { background: var(--white) !important; }
.bg-soft { background: var(--soft) !important; }
.bg-gray { background: var(--gray) !important; }
.bg-dark-gray { background: var(--dark_gray) !important; }
.bg-red { background: var(--red) !important; }
.bg-red2 { background: var(--red2) !important; }
.bg-red3 { background: var(--red3) !important; }
.bg-soft-white { background: var(--ntrl50) !important; }
.bg-blue { background: var(--blue) !important; }
.bg-blue0 { background: var(--blue0) !important; }
.bg-blue1 { background: var(--blue1) !important; }
.bg-blue2 { background: var(--blue2) !important; }
.bg-blue3 { background: var(--blue3) !important; }
.bg-blue4 { background: var(--blue4) !important; }
.bg-pink { background: var(--pink) !important; }
.dblock { display: block; }
.centering { display: flex !important; align-items: center !important; justify-content: center !important; }
.centering.column { flex-direction: column; }
.centering.row { flex-direction: row; }
.fx-inline { display: inline-flex !important; }
.fx-between { display: flex; justify-content: space-between; flex-direction: row; }
.fx-between.column { flex-direction: column; }
.fx-start { display: flex; align-items: center; justify-content: flex-start; }
.fx-start.column { flex-direction: column; justify-content: center; align-items: flex-start !important; }
.clear { clear: both; }
.overflow { overflow: hidden; }
.hide_desktop { display: none !important; visibility: hidden; }
.hide_mobile { display: block; visibility: visible; }
.radius0 { border-radius: 0px !important; }
.radius2 { border-radius: 2px !important; }
.radius4 { border-radius: 4px !important; }
.radius6 { border-radius: 6px !important; }
.radius8 { border-radius: 8px !important; }
.radius10 { border-radius: 10px !important; }
.radius12 { border-radius: 12px !important; }
.radius18 { border-radius: 18px !important; }
.radius20 { border-radius: 20px !important; }
.radius50 { border-radius: 50% !important; }
.border-bottom { border-bottom: 1px solid var(--ntrl200) !important; }
.border-top { border-top: 1px solid var(--ntrl200) !important; }
h1 { font-size: 32px; line-height: 130%; margin: 0px 0px 16px; font-weight: 700; }
h2 { font-size: 24px; line-height: 130%; margin: 0px 0px 16px; font-weight: 700; }
h3 { font-size: 18px; line-height: 130%; margin: 0px 0px 16px; font-weight: 700; }
h4 { font-size: 16px; line-height: 130%; margin: 0px 0px 16px; font-weight: 700; }
h5 { font-size: 14px; line-height: 130%; margin: 0px 0px 16px; font-weight: 700; }
h6 { font-size: 12px; line-height: 130%; margin: 0px 0px 16px; font-weight: 700; }
p { font-size: 16px; line-height: 130%; margin: 16px 0px; }
a { color: var(--solid); text-decoration: none; transition: 0.2s ease-in-out; }
a:hover, a:focus { color: var(--dark_gray); transition: 0.2s ease-in-out; }
a:focus { outline: -webkit-focus-ring-color auto 5px; outline-offset: -2px; }
.padding-no { padding: 0px !important; }
.padding-ss { padding: 4px !important; }
.padding-xs { padding: 8px !important; }
.padding-sm { padding: 16px !important; }
.padding-lg { padding: 24px !important; }
.padding-xl { padding: 32px !important; }
.padding-top-no { padding-top: 0px !important; }
.padding-top-ss { padding-top: 5px !important; }
.padding-top-xs { padding-top: 8px !important; }
.padding-top-sm { padding-top: 16px !important; }
.padding-top-lg { padding-top: 24px !important; }
.padding-top-xl { padding-top: 32px !important; }
.padding-bottom-no { padding-bottom: 0px !important; }
.padding-bottom-ss { padding-bottom: 4px !important; }
.padding-bottom-xs { padding-bottom: 8px !important; }
.padding-bottom-sm { padding-bottom: 16px !important; }
.padding-bottom-lg { padding-bottom: 24px !important; }
.padding-bottom-xl { padding-bottom: 32px !important; }
.padding-left-no { padding-left: 0px !important; }
.padding-left-ss { padding-left: 4px !important; }
.padding-left-xs { padding-left: 8px !important; }
.padding-left-sm { padding-left: 16px !important; }
.padding-left-lg { padding-left: 24px !important; }
.padding-left-xl { padding-left: 32px !important; }
.padding-right-no { padding-right: 0px !important; }
.padding-right-ss { padding-right: 4px !important; }
.padding-right-xs { padding-right: 8px !important; }
.padding-right-sm { padding-right: 16px !important; }
.padding-right-lg { padding-right: 24px !important; }
.padding-right-xl { padding-right: 32px !important; }
.padding-top-xxl { padding-top: 80px !important; }
.padding-bottom-xxl { padding-bottom: 80px !important; }
.padding-left-xxl { padding-left: 80px !important; }
.padding-right-xxl { padding-right: 80px !important; }
.margin-no { margin: 0px !important; }
.margin-xs { margin: 8px !important; }
.margin-ss { margin: 4px !important; }
.margin-sm { margin: 16px !important; }
.margin-lg { margin: 24px !important; }
.margin-xl { margin: 32px !important; }
.margin-top-no { margin-top: 0px !important; }
.margin-top-ss { margin-top: 4px !important; }
.margin-top-xs { margin-top: 8px !important; }
.margin-top-sm { margin-top: 16px !important; }
.margin-top-lg { margin-top: 24px !important; }
.margin-top-xl { margin-top: 32px !important; }
.margin-bottom-no { margin-bottom: 0px !important; }
.margin-bottom-ss { margin-bottom: 4px !important; }
.margin-bottom-xs { margin-bottom: 8px !important; }
.margin-bottom-sm { margin-bottom: 16px !important; }
.margin-bottom-lg { margin-bottom: 24px !important; }
.margin-bottom-xl { margin-bottom: 32px !important; }
.margin-left-no { margin-left: 0px !important; }
.margin-left-ss { margin-left: 4px !important; }
.margin-left-xs { margin-left: 8px !important; }
.margin-left-sm { margin-left: 16px !important; }
.margin-left-lg { margin-left: 24px !important; }
.margin-left-xl { margin-left: 32px !important; }
.margin-right-no { margin-right: 0px !important; }
.margin-right-ss { margin-right: 4px !important; }
.margin-right-xs { margin-right: 8px !important; }
.margin-right-sm { margin-right: 16px !important; }
.margin-right-lg { margin-right: 24px !important; }
.margin-right-xl { margin-right: 32px !important; }
.margin-top-xxl { margin-top: 80px !important; }
.margin-bottom-xxl { margin-bottom: 80px !important; }
.margin-left-xxl { margin-left: 80px !important; }
.margin-right-xxl { margin-right: 80px !important; }
.fw4 { font-weight: 400 !important; }
.fw5 { font-weight: 500 !important; }
.fw6 { font-weight: 600 !important; }
.fw7 { font-weight: 700 !important; }
.bg-twitter { background: rgb(119, 203, 239) !important; }
.bg-facebook { background: rgb(83, 122, 189) !important; }
.bg-google { background: rgb(234, 93, 75) !important; }
.bg-linkedin { background: rgb(19, 132, 200) !important; }
.bg-daily { background: rgb(0, 100, 220) !important; }
.bg-youtube { background: rgb(200, 48, 42) !important; }
.bg-instagram { background: rgb(227, 0, 139) !important; }
.bg-whatsapp { background: rgb(42, 178, 0) !important; }
.bg-line { background: rgb(78, 205, 0) !important; }
.bg-tumblr { background: rgb(57, 89, 118) !important; }
.cl-twitter { color: rgb(119, 203, 239) !important; }
.cl-facebook { color: rgb(83, 122, 189) !important; }
.cl-google { color: rgb(234, 93, 75) !important; }
.cl-linkedin { color: rgb(19, 132, 200) !important; }
.cl-daily { color: rgb(0, 100, 220) !important; }
.cl-youtube { color: rgb(200, 48, 42) !important; }
.cl-instagram { color: rgb(227, 0, 139) !important; }
.cl-whatsapp { color: rgb(42, 178, 0) !important; }
.cl-line { color: rgb(78, 205, 0) !important; }
.cl-tumblr { color: rgb(57, 89, 118) !important; }
.ff_pri { font-family: "Playfair Display", "Courier New", Courier, monospace !important; }
.ff_sec { font-family: Roboto, Arial, Helvetica, sans-serif !important; }
*, ::after, ::before { box-sizing: border-box; }
.t-center { text-align: center !important; }
.t-right { text-align: right !important; }
.t-left { text-align: left !important; }
.left { float: left !important; }
.right { float: right !important; }
.hidden { opacity: 0; }
.visible { opacity: 1; }
.left { float: left !important; }
.right { float: right !important; }
.square { position: relative; width: 100%; display: flex; align-items: center; justify-content: center; }
.square::after { content: ""; display: block; padding-bottom: 100%; }
.square-in { position: absolute; width: 100%; height: 100%; overflow: hidden; border-radius: 4px; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 0px; }
.square-in a { display: flex; align-items: center; justify-content: center; height: 100%; width: 100%; }
.square-in img { width: auto; height: 100%; margin: 0px auto; }
.square-in.flat { border-radius: 0px; }
.square.lines { border: 1px solid var(--purple100); border-radius: 6px; }
.fo12 { font-size: 12px !important; }
.fo14 { font-size: 14px !important; }
.fo16 { font-size: 16px !important; }
.fo18 { font-size: 18px !important; }
.element-box button { background: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }
label.small { font-size: 12px; display: inline-flex; min-height: 14px; line-height: 14px; }
label.medium { font-size: 14px; display: inline-flex; font-weight: 600; min-height: 30px; }
.element-box { margin: 0px; position: relative; height: auto; }
.element-box .icons { width: 40px; height: 40px; position: absolute; left: 0px; top: 0px; z-index: 2; border-right: 1px solid var(--ntrl200); display: flex; align-items: center; justify-content: center; }
.element-box .icons.small { width: 32px; height: 32px; }
.element-box .icons.right { right: 0px; left: inherit; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; width: 48px; }
.element-box input.element-input { width: 100%; height: 40px; padding: 4px 12px; background: var(--white); border: 1px solid var(--ntrl200); font-size: 14px; color: var(--black); border-radius: 20px; }
.element-box input.element-input.small { height: 32px; font-size: 12px; padding: 8px; }
.element-box input.element-input.medium { height: 36px; font-size: 14px; padding: 8px; }
.element-box input.element-input.minimalis { min-width: 146px; width: auto; }
.element-box.pass input.element-input { padding-right: 48px; }
.element-box.right-btn input.element-input { padding-right: 48px; }
.element-box.right-btn button.sign-btn { position: absolute; top: 0px; right: 0px; width: 40px; height: 40px; background: transparent; padding: 0px; color: var(--black); }
.element-box.big_search { display: flex; gap: 8px; }
.element-box.big_search input.element-input { height: 56px; text-align: center; border: 2px solid var(--soft); font-size: 1rem; padding: 8px 24px; border-radius: 28px; }
.element-box.big_search button.sign-btn { height: 56px; width: 56px; color: var(--white); background: var(--blue); place-content: center; border-radius: 50%; }
.element-box .input-field { margin: 0px; }
.element-box .file-field { position: relative; }
.element-box .file-field .btn.upload { background: rgb(201, 201, 201); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; height: 36px; width: 36px; float: none; padding: 0px; position: absolute; top: 0px; left: 0px; z-index: 2; border-radius: 2px 0px 0px 2px !important; }
.element-box .file-field .btn.upload i { font-size: 16px; color: var(--black); line-height: normal; }
.element-box .file-field input[type="file"] { position: absolute; inset: 0px; width: 100%; margin: 0px; padding: 0px; font-size: 20px; cursor: pointer; opacity: 0; z-index: 3; }
.element-box .file-field .file-path-wrapper { text-align: left; background: var(--white); padding: 0px; width: 100%; position: relative; border: 1px solid var(--ntrl200); height: 36px; overflow: hidden; border-radius: 2px; }
.element-box .file-field .file-path-wrapper label { width: 100%; height: 36px; display: flex; padding-left: 46px; align-items: center; justify-content: flex-start; font-size: 14px; }
.element-box .file-field input.file-path { width: 100%; height: 36px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; padding-left: 50px; font-size: 16px; }
.element-box textarea.element-area { width: 100%; min-height: 120px; padding: 12px 20px; background: var(--white); border: 1px solid var(--ntrl200); font-size: 14px; color: var(--black); border-radius: 20px; }
.element-box textarea.element-area.small { font-size: 12px; padding-left: 32px; }
.element-box .element-select { box-sizing: border-box; appearance: none; }
.element-box select.element-select { color: var(--black); width: 100%; height: 40px; padding: 5px 5px 5px 50px; background-attachment: ; background-origin: ; background-clip: ; background-color: ; border: 1px solid var(--purple100); font-size: 14px; box-sizing: border-box; appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--black) 50%),
    linear-gradient(135deg, var(--black) 50%, transparent 50%),
    linear-gradient(to right, var(--black), var(--black)); background-position: calc(100% - 19px) calc(50% + 1px), calc(100% - 14px) calc(50% + 1px), calc(100% - 36px) 0px; background-size: 5px 5px, 5px 5px, 0px 36px; background-repeat: no-repeat; }
.element-box select.element-select:disabled { border-color: var(--ntrl300); color: var(--ntrl300); background-image: linear-gradient(45deg, transparent 50%, var(--ntrl300) 50%),
    linear-gradient(135deg, var(--ntrl300) 50%, transparent 50%),
    linear-gradient(to right, var(--ntrl300), var(--ntrl300)); }
.element-box select.element-select:focus { background-image: linear-gradient(135deg, transparent 50%, var(--black) 50%),
    linear-gradient(45deg, var(--black) 50%, transparent 50%),
    linear-gradient(to right, var(--black), var(--black)); background-position: calc(100% - 19px) calc(50% + 1px), calc(100% - 14px) calc(50% + 1px), calc(100% - 36px) 0px; background-size: 5px 5px, 5px 5px, 0px 36px; background-repeat: no-repeat; }
.element-box select.element-select.medium { width: 100%; height: 36px; padding: 5px 5px 5px 50px; font-size: 14px; box-sizing: border-box; appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--black) 50%),
    linear-gradient(135deg, var(--black) 50%, transparent 50%),
    linear-gradient(to right, var(--black), var(--black)); background-position: calc(100% - 19px) calc(50% + 1px), calc(100% - 14px) calc(50% + 1px), calc(100% - 36px) 0px; background-size: 5px 5px, 5px 5px, 0px 36px; background-repeat: no-repeat; }
.element-box select.element-select.minimalis { min-width: 120px; width: auto; padding-right: 46px; }
.element-box select.element-select.small { height: 32px; font-size: 12px; background-position: calc(100% - 15px) calc(1em - 1px), calc(100% - 10px) calc(1em - 1px), calc(100% - 2.5em) 0.3em; background-size: 5px 5px, 5px 5px, 0px 1.5em; padding-left: 40px; background-repeat: no-repeat; }
.element-box select.element-select.fw400 { font-weight: 400; }
.element-radio { cursor: pointer; display: inline-flex; flex-direction: row; justify-content: center; gap: 6px; }
.element-radio input[type="radio"] { opacity: 1; border: 2px solid var(--black); background: var(--white); height: 24px; width: 24px; position: relative; cursor: pointer; appearance: none; border-radius: 12px; display: inline-flex; flex: 0 0 24px; }
.element-radio input:checked { opacity: 1; background: var(--white); appearance: none; border: 2px solid var(--black); }
.element-radio .radiotext { display: inline-flex; align-items: center; }
.element-radio input:checked::before { position: absolute; width: 12px; height: 12px; top: 4px; left: 4px; background: var(--black); border-radius: 6px; content: ""; z-index: 2; }
.element-radio input:disabled { opacity: 1; background: var(--white); appearance: none; border: 2px solid var(--black); cursor: not-allowed; }
.element-radio input:disabled::before { font-family: FontAwesome; position: absolute; width: 16px; height: 16px; top: 0px; left: 0px; content: ""; color: var(--black); font-size: 12px; font-weight: normal; display: flex; align-items: center; justify-content: center; z-index: 2; margin: 0px auto; }
.element-radio > label { margin-left: 30px; cursor: pointer; display: inline-flex !important; }
.element-check { cursor: pointer; display: inline-flex; flex-direction: row; justify-content: center; gap: 6px; }
.element-check .checktext { display: inline-flex; align-items: center; }
.element-check input[type="checkbox"] { opacity: 1; border: 2px solid var(--black); background: var(--white); height: 24px; width: 24px; position: relative; top: 0px; cursor: pointer; appearance: none; border-radius: 4px; display: inline-flex; flex: 0 0 24px; }
.element-check input[type="checkbox"].abs { position: absolute; }
.element-check input:checked { opacity: 1; background: var(--white); border: 2px solid var(--black); appearance: none; }
.element-check input:checked::before { font-family: FontAwesome; position: absolute; width: 20px; height: 20px; top: 0px; left: 0px; content: ""; color: var(--black); font-size: 16px; font-weight: normal; display: flex; align-items: center; justify-content: center; z-index: 2; }
.element-check input:disabled { opacity: 1; background: var(--white); border: 2px solid var(--black); appearance: none; cursor: not-allowed; }
.element-check input:disabled::before { font-family: FontAwesome; content: ""; position: absolute; width: 16px; height: 16px; top: 0px; left: 0px; color: var(--solid); font-size: 12px; display: flex; align-items: center; justify-content: center; z-index: 2; }
.element-check > label { margin-left: 30px; cursor: pointer; display: inline-flex !important; }
button.sign-btn { width: 100%; height: 39px; background: var(--blue2); color: var(--white); transition: 0.3s ease-in-out; opacity: 1; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 500; padding: 0px 24px; }
button.sign-btn.medium { height: 36px; font-size: 14px; }
button.sign-btn.minimalis { width: auto; padding: 0px 24px; }
button.sign-btn.small { height: 32px; font-size: 14px; }
button.sign-btn:hover { transition: 0.3s ease-in-out; opacity: 0.7; }
button.sign-btn.line { background: transparent; border: 1px solid var(--blue2); color: var(--blue2); }
button.sign-btn.line.white { border-color: var(--white); color: var(--white); }
a.sign-btn { width: 100%; height: 40px; background: var(--blue2); color: var(--white); transition: 0.3s ease-in-out; opacity: 1; display: flex; align-items: center; justify-content: center; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; text-align: center; font-weight: 500; font-size: 16px; padding: 0px 24px; }
a.sign-btn.minimalis { width: auto; padding: 0px 30px; display: inline-flex; margin: 0px; text-align: center; }
a.sign-btn.medium { height: 36px; font-size: 14px; }
a.sign-btn.small { height: 32px; font-size: 14px; padding: 0px 16px; }
a.sign-btn.big { height: 56px; font-size: 18px; }
a.sign-btn.line { background: transparent; border: 1px solid var(--blue2); color: var(--blue2); }
a.sign-btn.line.white { border-color: var(--white); color: var(--white); }
a.sign-btn.line.soft { border-color: var(--soft); color: var(--soft); }
a.sign-btn.line.gray { border-color: var(--gray); color: var(--gray); }
a.sign-btn.line.dark { border-color: var(--black); color: var(--black); }
a.sign-btn.line.blue { border-color: var(--blue2); color: var(--blue2); }
a.sign-btn.line.clean { border-color: transparent; color: var(--black); }
a.sign-btn:hover { transition: 0.3s ease-in-out; opacity: 0.8; }
a.sign-btn.disable { cursor: not-allowed; background: var(--ntrl100); }
.element-box select.element-select.noicons, .element-box input.element-input.noicons, .element-box textarea.element-area.noicons { padding-left: 10px !important; min-width: 10px; }
ul.row-list { list-style: inside none; margin: 0px -8px; padding: 0px; display: flex; align-items: flex-start; justify-content: flex-start; flex-flow: wrap; }
ul.row-list li { width: 100%; padding: 0px 8px; }
ul.row-list.row2 li { width: 50%; padding: 0px 8px; }
ul.row-list.row3 li { width: 33.333%; padding: 0px 8px; }
ul.row-list.row4 li { width: 25%; padding: 0px 8px; }
ul.row-list.row5 li { width: 20%; padding: 0px 8px; }
ul.row-list.row6 li { width: 16.666%; padding: 0px 8px; }
ul.row-list.row7 li { width: 14.2857%; padding: 0px 8px; }
ul.row-list.row8 li { width: 12.5%; padding: 0px 8px; }
ul.row-list.row4.pad4, ul.row-list.row3.pad4, ul.row-list.row2.pad4, ul.row-list.row5.pad4, ul.row-list.row6.pad4, ul.row-list.row7.pad4, ul.row-list.row8.pad4 { margin: 0px -4px; }
ul.row-list.row4.pad4 li, ul.row-list.row3.pad4 li, ul.row-list.row2.pad4 li, ul.row-list.row5.pad4 li, ul.row-list.row6.pad4 li, ul.row-list.row7.pad4 li, ul.row-list.row8.pad4 li { padding: 0px 4px; }
ul.row-list.row4.pad16, ul.row-list.row3.pad16, ul.row-list.row2.pad16, ul.row-list.row5.pad16, ul.row-list.row6.pad16, ul.row-list.row7.pad16, ul.row-list.row8.pad16 { margin: 0px -16px; }
ul.row-list.row4.pad16 li, ul.row-list.row3.pad16 li, ul.row-list.row2.pad16 li, ul.row-list.row5.pad16 li, ul.row-list.row6.pad16 li, ul.row-list.row7.pad16 li, ul.row-list.row8.pad16 li { padding: 0px 16px; }
.card-box { height: auto; overflow: hidden; width: 100%; position: relative; margin: 0px; opacity: 1; transition: 0.3s ease-in-out; }
.card-box.shadow { border-radius: 10px; box-shadow: rgba(0, 0, 0, 0.1) 1px 1px 20px; background: var(--white); }
.card-box.shadow .text-card { padding: 16px; }
.card-box .img-card { position: relative; width: 100%; overflow: hidden; height: auto; margin: 0px auto; padding: 0px; opacity: 1; }
.card-box .img-card .play-icons { display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; position: absolute; inset: 0px; color: rgba(255, 255, 255, 0.5); margin: auto; z-index: 3; text-shadow: rgba(0, 0, 0, 0.1) 1px 1px 1px; font-size: 30px; }
.card-box .img-card .right-icons { display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; position: absolute; right: 4px; bottom: 4px; background: rgba(255, 255, 255, 0.9); border-radius: 2px; color: var(--black); font-size: 12px; z-index: 2; }
.card-box .img-card .right-icons.foto { width: auto; padding: 0px 8px; border-radius: 4px; top: 4px; bottom: inherit; right: 4px; font-size: 12px; }
.card-box .img-card .play-icons.big i { font-size: 90px; }
.card-box .img-card .play-icons.medium i { font-size: 60px; }
.card-box .img-card .play-icons.small i { font-size: 30px; }
.card-box .img-card img { width: 100%; height: auto; display: block; transition: 0.3s ease-in-out; opacity: 1; }
.card-box .text-card { height: auto; width: auto; overflow: hidden; padding: 0px; position: relative; }
.card-box .text-card h1.title { transition: 0.2s ease-in-out; font-size: 32px; line-height: 130%; margin: 0px; font-weight: 700; }
.card-box .text-card h2.title { transition: 0.2s ease-in-out; font-size: 24px; line-height: 130%; margin: 0px; font-weight: 700; min-height: 75px; }
.card-box .text-card h3.title { transition: 0.2s ease-in-out; font-size: 18px; line-height: 130%; margin: 0px; font-weight: 700; min-height: 75px; }
.card-box .text-card h4.title { transition: 0.2s ease-in-out; font-size: 16px; line-height: 130%; margin: 0px; font-weight: 700; }
.card-box .text-card h5.title { transition: 0.2s ease-in-out; font-size: 14px; line-height: 130%; margin: 0px; font-weight: 700; }
.card-box .text-card h6.title { transition: 0.2s ease-in-out; font-size: 12px; line-height: 130%; margin: 0px; font-weight: 700; }
.card-box .text-card p { font-weight: 400; margin: 0px; letter-spacing: normal; font-size: 16px; line-height: 140%; }
.card-box .text-card p a { color: var(--blue); }
.card-box .text-card p a:hover { color: var(--red); }
.line1 { word-break: break-word; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.line2 { word-break: break-word; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.line3 { word-break: break-word; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.line4 { word-break: break-word; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }
.line5 { word-break: break-word; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; }
.line6 { word-break: break-word; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; }
.card-box.fullwidth { border-radius: 0px; }
.card-box.fullwidth .img-card { margin: 0px auto; }
.card-box.fullwidth .text-card { position: absolute; inset: 0px; z-index: 2; padding: 60px 16px; display: flex; justify-content: flex-end; flex-direction: column; align-items: center; background: rgba(0, 0, 0, 0.2); }
.card-box.fullwidth .text-card h2.title { font-size: 40px; line-height: 50px; margin: 0px 0px 24px; font-weight: 700; font-family: var(--playfair); }
.card-box.fullwidth .text-card p { font-size: 20px; }
.card-box.fullwidth .text-card h2.titlebox { position: absolute; top: 60px; left: 60px; }
.card-box.fullwidth.top-title .text-card { justify-content: flex-start; align-items: flex-start; padding: 60px 6.5vw; background: rgba(0, 0, 0, 0.2); }
.card-box.fullwidth.top-title .text-card p { font-size: 16px; font-weight: 500; }
.card-box.big-img { overflow: hidden; margin-bottom: 24px; display: flex; flex-wrap: nowrap; }
.card-box.big-img .img-card { width: 50%; float: left; height: 250px; display: flex; justify-content: center; align-items: center; margin: 0px; }
.card-box.big-img .img-card img { height: auto; width: 100%; }
.card-box.big-img .text-card { width: calc(50% + 16px); padding: 16px 24px; display: flex; align-items: flex-start; flex-direction: column; justify-content: center; }
.card-box.big-img.right { flex-direction: row-reverse; }
.card-box.big-img.editor_col { background: var(--solid); }
.card-box.big-img.editor_col .img-card { width: 350px; height: auto; opacity: 0.5; }
.card-box.big-img.editor_col .img-card img { width: 100%; height: auto; }
.card-box.big-img.editor_col .text-card { width: calc(100% - 350px); }
.card-box.big-img.editor_col .text-card h3.title { font-size: 20px; }
#big_news .card-box .text-card { padding: 0px 0px 0px 32px; }
#big_news .card-box.right .text-card { padding: 0px 32px 0px 0px; }
#big_news .card-box .text-card p { margin: 12px 0px; font-size: 14px; color: var(--text); }
#big_news .card-box.big-img .img-card { height: 330px; display: flex; justify-content: center; align-items: center; width: calc(50% - 16px); }
.card-box.big_dua_col { display: flex; flex-flow: row-reverse; background: var(--solid); }
.card-box.big_dua_col .img-card { height: 55vh; width: 50%; display: flex; justify-content: center; align-items: center; flex: 1 1 0%; }
.card-box.big_dua_col .img-card img { width: 100%; height: auto; }
.card-box.big_dua_col .text-card { height: 55vh; width: 50%; background: var(--blue1); padding: 48px; display: flex; flex-direction: column; justify-content: center; flex: 1 1 0%; }
.card-box.big_dua_col.vertical .img-card { height: auto; }
.card-box.big_dua_col.vertical .text-card { min-height: 100vh; background: var(--solid); justify-content: space-between; padding: 48px 100px 48px 48px; }
.card-box.big_dua_col.vertical .img-card img { height: auto; width: 100%; }
.card-box.square-right .img-card { width: 100px; height: 100px; float: right; margin-left: 16px; }
.card-box.big-img.details .img-card { width: auto; float: none; height: auto; margin-left: -16px; margin-right: -16px; }
.card-box.big-img.details .img-card img { width: 100%; height: auto; }
.card-box.big-img.details .text-card { width: 100%; height: auto; padding-bottom: 66px; }
.card-box.big-img.details .text-card .box-avatar { margin-bottom: 0px; }
.card-box.big-img.details .text-card p { margin: 16px 0px; }
.scroll-h { height: 100px; overflow-y: auto; padding: 0px 16px 12px 0px; }
.scroll-h::-webkit-scrollbar { width: 6px; background: var(--ntrl300); border-radius: 0px; }
.scroll-h::-webkit-scrollbar-track { border-radius: 0px; }
.scroll-h::-webkit-scrollbar-thumb { background-color: var(--ntrl600); border-radius: 0px; }
.scroll-h::-webkit-scrollbar:horizontal { height: 6px; }
.scroll-h::-webkit-scrollbar:vertical { width: 6px; }
.card-box.mentor .text-card { padding: 16px; }
.card-box.mentor .text-card .box-avatar { border-bottom: 1px solid var(--ntrl200); display: flex; margin-bottom: 12px; padding-bottom: 12px; }
.card-box.mentor .text-card .box-respon { margin-top: 12px; padding-top: 12px; display: flex; justify-content: flex-start; align-items: center; border-top: 1px solid var(--ntrl200); }
.card-box.mentor .text-card .box-respon span { font-size: 12px; }
.card-box.mentor .text-card .box-respon a { color: var(--red); }
.card-box.mentor .text-card .box-respon a:hover { color: var(--dark_gray); }
.card-box.mentor .text-card p { margin: 16px 0px; }
.card-box.ft110 { overflow: hidden; height: auto; width: 100%; position: relative; margin: 0px; opacity: 1; transition: 0.3s ease-in-out; }
.card-box.ft110 .img-card { float: left; position: relative; width: 90px; height: 90px; overflow: hidden; margin: 0px; padding: 0px; display: flex; justify-content: center; align-items: center; border-radius: 10px; }
.card-box.ft110 .img-card img { width: auto; height: 90px; display: block; }
.card-box.ft110 .text-card { padding: 0px 0px 0px 12px; min-height: 90px; display: flex; flex-direction: column; justify-content: center; }
.cd-main-content { min-height: 100%; position: relative; z-index: 2; padding: 0px; transition-duration: 0.4s; margin: 0px auto; }
.container { margin: 0px auto; width: 100%; max-width: 1200px; padding: 0px 16px; position: relative; }
.container.big { padding: 0px 46px; }
.container.full { max-width: 1440px; margin: 0px auto; }
.main-wrapper { max-width: 1440px; margin: 0px auto; }
.container.medium { max-width: 1100px; }
.container.small { max-width: 800px; }
.container.login { width: 100%; max-width: none; padding: 32px; height: 100%; min-height: 100vh; display: flex; flex-direction: row; align-items: center; }
.container.login.center { padding: 40px 16px; align-items: flex-start; }
.container.login .boxreg { width: 100%; margin: 0px auto; border-radius: 10px; box-shadow: rgba(119, 119, 119, 0.1) 0px 8px 20px; background: var(--white); padding: 32px; max-width: 400px; min-height: 70vh; border: 1px solid var(--ntrl50); }
.container.login .boxreg.syarat { width: 600px; }
.container.login .boxreg h2.title { font-size: 24px; line-height: 130%; margin: 0px auto; }
.container.login .boxreg .logo { width: auto; display: flex; justify-content: center; align-items: center; height: auto; }
.container.login .boxreg .logo img { width: auto; height: 70px; }
.container.login .boxreg .or { height: 41px; display: flex; justify-content: center; align-items: center; position: relative; margin: 16px auto; }
.container.login .boxreg .or::before { content: ""; height: 1px; background: var(--gray); top: 20px; left: 0px; right: 0px; position: absolute; }
.container.login .boxreg .or span { text-align: center; background: var(--white); padding: 0px 16px; margin: 0px auto; position: relative; inset: 0px; z-index: 1; color: var(--gray); }
.select2-container { display: unset; }
.select2-container--default .select2-selection--single { border-radius: 8px; border-color: var(--ntrl200); height: 40px; }
.select2-container--default .select2-selection--single .select2-selection__rendered { height: 40px; padding: 0px 6px; font-size: 14px; line-height: 38px; }
.select2-container--default .select2-selection--single .select2-selection__arrow { width: 32px; height: 40px; }
.container-col { margin-left: -16px; margin-right: -16px; }
.container-col.medium-col { margin-left: -8px; margin-right: -8px; }
.col-1 { width: 8.33%; }
.col-2 { width: 16.66%; }
.col-3 { width: 25%; }
.col-4 { width: 33.33%; }
.col-5 { width: 41.66%; }
.col-6 { width: 50%; }
.col-7 { width: 58.33%; }
.col-8 { width: 66.66%; }
.col-9 { width: 75%; }
.col-10 { width: 83.33%; }
.col-11 { width: 91.66%; }
.col-12 { width: 100%; }
[class*="col-"] { float: left; padding: 0px 16px; }
[class*="medium8"] { float: left; padding: 0px 8px !important; }
.block-all { position: fixed; background: rgba(0, 0, 0, 0.7); inset: 0px; z-index: 21; }
.menu { margin: 24px 0px auto; padding: 0px; height: auto; width: auto; font-size: 15px; font-weight: 700; font-family: var(--roboto); }
.menu ul li > a::after { content: " "; font-family: FontAwesome; font-size: 14px; margin-left: 10px; top: 0px; position: relative; }
.menu ul li > a:only-child::after { content: ""; margin: 0px; }
.menu ul ul { display: none; }
.menu ul li:hover > ul { display: block; }
.menu ul { list-style: inside none; margin: 0px auto; padding: 0px; height: auto; max-width: 1300px; position: relative; display: flex; align-items: center; justify-content: center; width: 100%; }
.menu ul::after { content: ""; clear: both; display: block; }
.menu ul li { float: left; }
.menu ul li:hover { background: transparent; }
.menu ul li:hover a, .menu.bott ul li:hover a { color: var(--ntrl400); }
.menu ul li a { color: var(--solid); position: relative; padding: 0px 12px; height: auto; display: flex; align-items: center; justify-content: center; text-align: center; }
.menu.bott ul li:last-child a { background: var(--red); padding: 8px; border-radius: 6px; color: var(--white); }
.menu ul li a.selected { color: var(--white); position: relative; }
.menu ul li a.selected::before { content: ""; position: absolute; left: 0px; right: 0px; border-radius: 6px; height: 40px; background: var(--blue2); z-index: -1; }
.menu ul li:hover a.selected { background: transparent; }
.menu ul ul, .menu ul ul.submenus { background: var(--white); border-radius: 0px; padding: 0px; position: absolute; top: 100%; left: 0px; right: 0px; z-index: 4; width: 100%; overflow: hidden; height: auto; box-shadow: rgba(0, 0, 0, 0.1) 1px 1px 3px; }
.menu ul ul li { float: none; width: 184px; color: rgb(16, 16, 16); }
.menu ul ul li a { padding: 10px 15px; color: var(--white); justify-content: flex-start; flex-direction: row; height: auto; text-transform: none; font-weight: 500; font-size: 14px; background: var(--white) !important; }
.menu ul ul li a:hover { color: var(--soft) !important; }
.menu ul ul.submenus li { width: 25%; float: left; background: var(--white); display: block; padding: 15px; }
.menu ul ul.submenus li .box-sub h4.title { font-size: 14px; line-height: 16px; margin: 0px 0px 10px; text-transform: uppercase; }
.menu ul ul.submenus li .box-sub p.title { margin: 0px; position: relative; }
.menu ul ul.submenus li .box-sub p.title a { color: var(--solid); padding: 5px 0px; margin: 0px; font-size: 14px; font-weight: 400; position: relative; background: none !important; }
.menu ul ul.submenus li .box-sub p.title a:hover { color: var(--soft) !important; }
.menu ul ul.submenus li .box-sub h4.title a, .menu ul ul.submenus li .box-sub h4.title a:hover { text-transform: uppercase; padding: 0px; margin: 0px 0px 10px; font-weight: 500; font-size: 14px; line-height: 16px; background: none !important; color: var(--solid) !important; }
.menu ul li:hover a.login, .menu ul li a.login:hover { background: var(--white) !important; }
.menu ul li.login2 { position: relative; }
.menu ul ul.submenus.single { width: 160px; padding: 12px 0px; border-radius: 0px 0px 6px 6px; right: inherit !important; left: inherit !important; }
.menu ul ul.submenus.single li { width: 100%; float: none; background: var(--white); padding: 0px; }
.menu ul ul.submenus.single li a { color: var(--blue); padding: 4px 16px; line-height: 140%; }
.menu ul ul.submenus li .box-sub p.title a:hover .warning2 { display: block; position: absolute; bottom: 100%; width: 150px; left: auto; right: auto; padding: 5px; color: var(--white); text-align: center; margin: auto; z-index: 5; font-size: 12px; background: var(--ntrl950) !important; }
.menu ul ul.submenus li .box-sub p.title a:hover .warning2::before { content: ""; width: 20px; position: absolute; left: 10px; margin: 0px auto; bottom: -10px; height: 0px; border-style: solid; border-width: 10px 10px 0px; border-color: var(--ntrl950) transparent transparent transparent; }
.menu.right { float: right; background: rgb(231, 76, 76); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; height: 25px; border-radius: 0px; }
.menu.right ul, .menu.right ul li a { height: 25px; }
.menu.right ul li { margin: 0px 3px; }
.menu.right ul li:last-child { margin-right: 0px; }
.menu.right ul li a { color: var(--white); font-size: 12px; }
.menu.right ul li a.selected, .menu.right ul ul li a.selected { background: transparent; height: 25px; border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; }
.menu.right ul li:hover { background: rgba(0, 0, 0, 0.5); }
.menu.right ul li:hover a { color: rgb(231, 182, 82); background: rgba(0, 0, 0, 0.5); border-color: rgb(231, 182, 82); }
.menu.right ul ul.submenus.single li { width: 100%; float: none; background: rgb(206, 206, 206); }
.button-area { height: 68px; width: auto; padding-left: 16px; display: inline-flex; justify-content: center; align-items: center; }
.menu ul li.userlog > a::after { right: 6px; color: var(--red); }
.menu ul li.userlog { height: 68px; display: flex; justify-content: center; align-items: center; }
.menu ul li.userlog a.user { border-radius: 20px; border: 1px solid var(--red); color: rgb(119, 119, 119); font-weight: 400; width: auto; font-size: 12px; justify-content: flex-start; flex-flow: wrap; height: 40px !important; padding: 4px !important; }
.menu ul li.userlog a.user .avatar { width: 30px; height: 30px; overflow: hidden; border-radius: 15px; display: flex; justify-content: center; align-items: center; float: left; margin-right: 8px; }
.menu ul li.userlog a.user .avatar img { width: auto; height: 30px; margin: 0px auto; }
.menu ul li.userlog a.user span { overflow-wrap: break-word; width: 93px; white-space: inherit; font-weight: 500; overflow: hidden; color: var(--red); }
.header { height: auto; margin: 0px auto; left: 0px; right: 0px; top: 0px; position: relative; z-index: 5; background: var(--white); padding: 16px 0px 24px; border-bottom: 1px solid var(--ntrl200); }
.header .header-in { width: 100%; padding: 0px 16px; margin: 0px auto; display: flex; justify-content: space-between; }
h1.logo { height: 100px; margin: 0px; }
h1.logo img { width: auto; height: 125px; float: left; }
h1.logo span { font-size: 16px; line-height: 18px; }
.top-menu { display: inline-flex; height: 46px; justify-content: flex-start; align-items: center; padding: 0px 8px; }
.top-menu a { padding: 0px 8px; font-size: 14px; font-weight: 600; }
.top-menu a:first-child { color: var(--red); }
.top-right { display: inline-flex; padding: 0px 24px; background: var(--blue); position: relative; top: -16px; border-radius: 0px 0px 50px 50px; }
.top-right a { color: var(--white); padding: 16px 16px 24px; display: flex; align-items: flex-end; font-size: 14px; font-weight: 600; }
.top-right a:nth-child(3) { background: var(--red); }
.lapor_btn { position: fixed; right: 16px; bottom: 0px; width: 100px; height: 100px; z-index: 10; transition: bottom 0.2s ease-in-out; filter: drop-shadow(rgba(0, 0, 0, 0.2) 5px 5px 5px); }
.lapor_btn-down { bottom: 0px; transition: bottom 0.4s ease-in-out; }
.lapor_btn-up { bottom: -100px; transition: bottom 0.4s ease-in-out; }
.search_box { position: fixed; background: rgba(0, 0, 0, 0.9); inset: 0px; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 60px 24px; z-index: 51; }
.box-search-in { position: relative; height: auto; width: 100%; max-width: 800px; padding: 0px; margin: 0px auto; }
.search_box button.cls-search { width: 60px; height: 60px; display: flex; justify-content: center; align-items: center; position: absolute; top: 0px; right: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; font-size: 20px; color: var(--white); background: var(--red); border-radius: 0px 0px 0px 100%; padding: 0px 0px 13px 20px; }
.box-search-in input.search { width: 100%; height: 70px; padding: 5px 66px 5px 16px; background: var(--white); border: 1px solid var(--ntrl200); border-radius: 10px; font-size: 20px; font-weight: 300; }
.box-search-in button.search-btn { width: 60px; height: 60px; border: 1px solid transparent; position: absolute; right: 5px; top: 5px; color: var(--blue2); background: transparent; font-size: 24px; }
.box-search-in input.search:focus { color: rgb(16, 16, 16); }
.box-search button.filter-btn { width: 50px; height: 50px; border: 1px solid var(--blue0); color: var(--white); background: var(--blue0); border-radius: 25px; position: absolute; top: 0px; left: 0px; z-index: 2; }
a.sign-btn.show-search { width: 36px; height: 36px; display: inline-flex; justify-content: center; align-items: center; padding: 0px; border: 1px solid var(--blue0); color: var(--blue0); border-radius: 18px; background: transparent; }
.bg-search { height: 90vh; width: 100%; background:  0% 0% / cover rgb(0, 0, 0); position: relative; overflow: hidden; }
.bg-search img { width: 100%; height: auto; }
.bg-search .bg-search-in { position: absolute; inset: 0px; background: rgba(1, 30, 61, 0.7); z-index: 2; display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 32px; }
.bg-search .bg-search-in h3.title { font-size: 24px; line-height: 28px; margin: 0px; color: var(--white); font-weight: 400; }
.bg-search .bg-search-in h2.title { font-size: 50px; line-height: 55px; margin: 0px; color: var(--white); font-weight: 900; }
.box-cover { width: 100%; height: auto; min-height: calc(-68px + 100vh); overflow: hidden; display: flex; flex-direction: row; align-items: center; position: relative; z-index: 1; }
.box-cover .cover-in { margin: 0px auto; width: 100%; max-width: 1440px; display: flex; flex-direction: row; align-items: center; }
.box-cover .bottom-bg { position: absolute; bottom: -14px; left: 0px; right: 0px; z-index: -1; }
.box-cover .cover-left { width: 50%; flex-grow: 1; display: flex; align-items: center; justify-content: center; padding: 48px 32px; }
.box-cover .cover-right { width: 50%; height: 100%; display: flex; align-items: center; justify-content: center; }
.box-cover .card-box .text-card h1.title { font-size: 3rem; font-weight: 600; }
.box-pengantar { padding: 0px 0px 40px; display: flex; justify-content: center; align-items: center; background: var(--purple900); color: var(--white); flex-direction: column; }
.box-filter { height: auto; width: 100%; max-width: 800px; padding: 16px; margin: 16px auto 0px; border-radius: 10px; position: relative; background: rgba(255, 255, 255, 0.2); min-height: 72px; }
.box-panduan { padding: 60px 16px; display: flex; justify-content: center; align-items: center; background: var(--purple950); color: var(--white); flex-direction: row; }
.box-panduan a.sign-btn { flex: 0 0 200px; }
.box-panduan h2 { min-height: 40px; margin-bottom: 0px; margin-top: 6px; }
.box-analisis { padding: 0px; background: var(--purple100); border-radius: 20px; border: 1px solid var(--purple200); }
.blockbox { width: 100%; position: relative; margin: 0px; padding: 32px 16px; }
.blockbox.clear_lr { padding-left: 0px; padding-right: 0px; }
.blockbox h2.kanal { padding: 12px 16px; background: var(--blue); color: var(--white); margin: 0px auto 32px; text-align: center; border-radius: 0px 0px 10px 10px; font-size: 30px; line-height: 140%; font-weight: 400; }
.blockbox h2.titlebox { min-height: 24px; font-size: 32px; line-height: 140%; font-weight: 700; display: flex; align-items: center; margin-bottom: 24px; position: relative; font-family: var(--playfair); }
.blockbox h2.titlebox.center { display: flex; justify-content: center; align-items: center; text-align: center; }
.blockbox h2.titlebox a { color: var(--purple900); }
.blockbox h2.titlebox a:hover { color: var(--dark_gray); }
.blockbox h3.titlebox { min-height: 24px; font-size: 18px; line-height: 140%; font-weight: 600; display: flex; align-items: center; margin-bottom: 24px; position: relative; }
.blockbox p.capt { font-size: 22px; line-height: 32px; max-width: 750px; font-weight: 500; }
.blockbox.inline { border: 1px solid var(--soft); border-radius: 10px; padding: 16px; }
.col-3.detail-sticky { height: 100vh; }
.detail-artikel { width: 100%; margin: 0px; min-height: 10px; padding: 40px 0px; }
.detail-artikel .col-9 { padding-right: 50px; width: calc(100% - 332px); }
.detail-artikel .col-3 { width: 332px; }
.detail-artikel .detail-in { padding: 0px; }
.detail-artikel .detail-in p { font-size: 16px; line-height: 150%; margin: 16px 0px; font-weight: 400; color: var(--text); }
.detail-artikel .detail-in.pbmb { padding-bottom: 32px; margin-bottom: 24px; border-bottom: 1px solid var(--ntrl200); }
.detail-artikel .detail-in.lock p:last-child, .detail-artikel .detail-in.lock h1:last-child, .detail-artikel .detail-in.lock h2:last-child, .detail-artikel .detail-in.lock h3:last-child, .detail-artikel .detail-in.lock h4:last-child, .detail-artikel .detail-in.lock h5:last-child, .detail-artikel .detail-in.lock h6:last-child, .detail-artikel .detail-in.lock ul:last-child, .detail-artikel .detail-in.lock ol:last-child { background-image: ; background-position-x: ; background-position-y: ; background-size: ; background-repeat: ; background-attachment: ; background-origin: ; background-color: ; background-clip: text; -webkit-text-fill-color: transparent; }
.detail-artikel p:last-child { margin-bottom: 0px; }
.detail-artikel .detail-in p a { font-weight: 600; color: var(--blue); }
.detail-artikel .detail-in p a:hover { color: var(--dark_gray); }
.detail-artikel .detail-in h1 { margin: 24px 0px; font-size: 32px; line-height: 130%; font-family: var(--playfair); }
.detail-artikel .detail-in h2 { margin: 24px 0px; font-size: 24px; line-height: 130%; font-family: var(--playfair); }
.detail-artikel .detail-in h2.tahun { padding: 8px 16px; border-radius: 8px; font-size: 32px; color: var(--blue2); background: var(--soft_blue); display: inline-flex; margin-bottom: 0px; }
.detail-artikel .detail-in h3 { margin: 24px 0px; font-size: 20px; line-height: 130%; font-family: var(--playfair); }
.detail-artikel .detail-in h4 { margin: 24px 0px; font-size: 18px; line-height: 130%; font-family: var(--playfair); }
.detail-artikel .detail-in h5 { margin: 24px 0px; font-size: 16px; line-height: 130%; font-family: var(--playfair); }
.detail-artikel .detail-in figure { margin: 16px 0px; padding: 0px 0px 16px; }
.detail-artikel .detail-in figure img { width: 100%; height: auto; }
.detail-artikel .detail-in figcaption { font-size: 14px; line-height: 120%; color: var(--dark_gray); margin: 4px 0px 0px; }
.detail-artikel .detail-in h6 { margin: 24px 0px; font-size: 14px; line-height: 130%; font-family: var(--playfair); }
.detail-artikel .detail-in ul, .detail-artikel .detail-in ol { margin: 0px 0px 30px; padding-left: 20px; }
.detail-artikel .detail-in ul li, .detail-artikel .detail-in ol li { font-size: 16px; line-height: 26px; margin: 15px 0px; padding-left: 5px; color: var(--text); }
.detail-artikel.front { padding: 0px; margin: 0px; }
.detail-artikel.front h2.title { font-size: 32px; }
.box-title-detail { padding: 15px 0px; overflow: hidden; }
ul.share { padding: 8px 0px; margin: 0px auto; list-style: inside none; text-align: center; overflow: hidden; display: inline-flex; align-items: center; justify-content: flex-start; flex-direction: column; width: auto; border: 1px solid var(--gray); border-radius: 4px; }
ul.share li { margin: 0px auto; width: 50px; padding: 0px; }
ul.share li a { width: 50px; height: 40px; color: var(--white); border-radius: 6px; text-align: center; font-size: 16px; display: flex; align-items: center; justify-content: center; }
ul.share li.title { width: auto; font-size: 14px; font-weight: 600; padding-right: 12px; }
ul.share li a:hover { opacity: 0.8; }
ul.share li.cp-link { width: auto; }
ul.share li.cp-link a { width: auto; padding: 0px 12px; font-size: 12px; }
ul.share li:first-child { margin-left: 0px; }
ul.share li:last-child { margin-right: 0px; }
.detail-artikel .detail-in .baca-juga { padding-left: 16px; margin: 0px 0px 24px; }
.detail-artikel .detail-in .baca-juga h5.title { font-size: 16px; line-height: 20px; font-weight: 700; margin: 0px 0px 8px; }
.detail-artikel .detail-in .baca-juga h4.title { border-left: 4px solid rgb(170, 185, 185); font-size: 18px; line-height: 22px; font-weight: 600; padding: 4px 8px; margin-bottom: 8px; background: rgb(249, 249, 249); }
.detail-artikel .detail-in .baca-juga a { color: rgb(50, 60, 159); font-size: 18px; line-height: 29px; margin: 16px 0px; font-weight: 600; }
.detail-artikel .detail-in .baca-juga a:hover { opacity: 0.7; }
.box-foto-artikel { margin: 0px 0px 15px; overflow: hidden; position: relative; }
.box-foto-artikel .foto-artikel { width: 100%; height: auto; overflow: hidden; margin: 0px; }
.box-foto-artikel .foto-artikel img { width: 100%; height: auto; }
.box-foto-artikel .caption { font-size: 12px; line-height: 20px; color: var(--white); padding: 16px; position: absolute; left: 0px; right: 0px; bottom: 0px; }
.judul-artikel { padding: 0px; overflow: hidden; margin: 0px 0px 30px; }
.judul-artikel h1 { margin: 0px 0px 16px; font-size: 48px; line-height: 130%; font-weight: 700; font-family: var(--playfair); position: relative; padding-bottom: 24px; }
.detail-artikel h1::before { content: ""; width: 40%; height: 4px; background: var(--red); position: absolute; left: 0px; bottom: 0px; z-index: 1; }
.judul-artikel h3.date { font-size: 16px; line-height: 130%; margin: 0px; font-weight: 700; color: var(--blue2); }
.judul-artikel p { font-size: 16px; line-height: 130%; margin: 16px 0px; color: var(--text); }
.judul-artikel h4.date { font-size: 12px; line-height: 18px; margin: 0px; font-weight: 400; color: var(--dark_gray); }
.box-tag { display: flex; flex-wrap: wrap; gap: 8px; }
.box-tag a { display: inline-flex; align-items: center; justify-content: center; border-radius: 4px; padding: 4px 12px; margin: 0px; color: var(--blue); font-size: 16px; line-height: 22px; font-weight: 500; border: 1px solid var(--blue); }
.box-tag a:hover { color: var(--dark_gray); border-color: var(--dark_gray); background: var(--soft_blue); }
.breakpage { height: 32px; width: 100%; display: flex; justify-content: center; align-items: center; position: relative; }
.breakpage::before { content: ""; position: absolute; height: 2px; left: 0px; right: 0px; top: 15px; background: rgb(204, 204, 204); }
.breakpage h6.title { position: absolute; height: 32px; background: var(--white); text-align: center; display: inline-flex; justify-content: center; align-items: center; font-size: 12px; padding: 0px 16px; z-index: 2; margin: 0px; color: var(--dark_gray); font-weight: 500; }
.top-istilah { display: block; }
.top-istilah a { display: inline-flex; align-items: center; justify-content: center; background: rgb(249, 249, 249); border-radius: 4px; padding: 3px 12px; margin: 0px 5px 5px 0px; border: 1px solid rgb(41, 41, 41); color: rgb(41, 41, 41); font-size: 14px; font-weight: 400; }
.top-istilah a:hover { border-color: var(--blue2); color: var(--blue2); background: var(--white); }
.breadcrumbs { margin: 0px auto; display: block; padding: 0px 0px 10px; overflow: hidden; }
ul.sitemap { list-style: inside none; margin: 0px; padding: 0px; display: flex; align-items: center; }
ul.sitemap li { float: left; padding: 0px 32px 0px 0px; position: relative; font-size: 14px; font-weight: 400; color: var(--blue); margin: 0px; }
ul.sitemap li::before { position: absolute; font-family: FontAwesome; content: ""; top: 1px; right: 10px; font-size: 9px; color: var(--blue); }
ul.sitemap li a { color: var(--blue); }
ul.sitemap li a:hover { color: var(--red); }
ul.sitemap li:last-child { padding-right: 0px; }
ul.sitemap li:last-child::before { display: none; }
.box-sumber { background: var(--white); padding: 10px 0px; overflow: hidden; position: relative; display: flex; align-items: flex-start; justify-content: flex-start; flex-flow: wrap; z-index: 2; }
.box-sumber .avatar-sumber { width: 40px; height: 40px; overflow: hidden; float: left; margin-right: 10px; border-radius: 25px; border: 1px solid var(--ntrl200); }
.box-sumber .avatar-sumber img { width: auto; height: 40px; }
.box-sumber .text-sumber { min-height: 40px; display: flex; align-items: flex-start; justify-content: center; flex-direction: column; }
.box-sumber .text-sumber h5.title { font-size: 14px; line-height: 18px; margin: 0px; }
.footer { background: var(--white); padding: 40px 0px; overflow: hidden; font-size: 14px; line-height: 140%; position: relative; height: auto; width: 100%; }
.footer .footer-in { padding: 40px 16px 24px; max-width: 1100px; width: 100%; margin: 0px auto; overflow: hidden; bottom: 0px; left: 0px; right: 0px; height: auto; border-top: 3px solid rgb(187, 222, 250); }
.footer a.link { font-size: 12px; line-height: 16px; color: var(--black); display: flex; font-weight: 400; padding-right: 8px; margin: 8px 0px; }
.footer a.link.icon i { display: flex; justify-content: center; align-items: center; }
.footer a.link:hover { color: var(--dark_gray); }
.footer .logo-footer { width: auto; height: auto; display: flex; margin-bottom: 16px; }
.footer p.by { font-size: 12px; line-height: 16px; margin: 16px 0px; }
.footer .logo-footer img { width: auto; height: 40px; }
.footer .bottom-footer { border-top: 1px solid var(--soft); overflow: hidden; padding: 16px 0px 0px; }
.footer .footer-bot .footer-apps { display: flex; align-items: center; justify-content: flex-start; }
.footer .footer-bot .footer-apps a { width: 50%; }
.footer .footer-bot .footer-apps a img { width: 100%; height: auto; margin: 0px; }
ul.sosmed { padding: 0px; margin: 0px; list-style: inside none; display: flex; justify-content: flex-end; align-items: center; overflow: hidden; }
ul.sosmed li { display: inline-flex; margin: 0px 3px; width: 36px; height: 36px; }
ul.sosmed li a { width: 36px; height: 36px; color: rgb(16, 16, 16); border-radius: 18px; font-size: 14px; display: flex; justify-content: center; align-items: center; border: 1px solid var(--white); }
ul.sosmed li a:hover { opacity: 0.7; }
ul.sosmed li:first-child { margin-left: 0px; }
.footer p.copy { padding: 0px; margin: 0px; font-size: 12px; color: rgb(153, 153, 153); }
ul.pagging { list-style: inside none; margin: 15px 0px 30px; padding: 0px; display: flex; align-items: center; justify-content: flex-start; min-height: 40px; }
ul.pagging li { min-width: 40px; height: 40px; text-align: center; line-height: 30px; margin: 2px; padding-left: 0px; }
ul.pagging li a { min-width: 40px; height: 40px; display: block; padding: 5px; color: var(--blue4); background: var(--white); border-radius: 4px; font-size: 14px; font-weight: 600; }
ul.pagging li a:hover { background: var(--white); color: var(--dark_gray); }
ul.pagging li.selected a { background: var(--blue4); color: var(--white); }
ul.pagging.centerpos { justify-content: center; }
ul.pagging li.prev, ul.pagging li.next, ul.pagging li.prev a, ul.pagging li.next a { width: auto; min-width: max-content; }
.block-avatar { overflow: hidden; display: flex; justify-content: flex-start; align-items: center; }
.box-avatar { display: block; }
.box-avatar .avatar { width: 36px; height: 36px; overflow: hidden; background: var(--ntrl50); display: inline-flex; justify-content: center; align-items: center; border-radius: 18px; float: left; border: 1px solid var(--soft); }
.box-avatar .avatar img { height: 36px; width: auto; }
.box-avatar.s54 .avatar { width: 54px; height: 54px; overflow: hidden; background: var(--ntrl50); display: inline-flex; justify-content: center; align-items: center; border-radius: 27px; }
.box-avatar.s54 .avatar img { height: 54px; width: auto; }
.box-avatar .text-avatar { min-height: 36px; padding-left: 12px; justify-content: center; display: flex; flex-direction: column; }
.box-avatar .text-avatar h3.title { margin: 0px; font-size: 16px; line-height: 21px; color: var(--white); font-weight: 600; }
.box-avatar .text-avatar h4.title { margin: 0px; font-size: 12px; line-height: 16px; color: var(--dark_gray); font-weight: 400; }
.box-avatar .text-avatar h4.title.bold { font-weight: 600; }
.box-avatar.s54 .text-avatar { min-height: 54px; justify-content: center; display: flex; flex-direction: column; }
.box-avatar.s40 .avatar { width: 40px; height: 40px; overflow: hidden; background: var(--ntrl50); display: inline-flex; justify-content: center; align-items: center; border-radius: 20px; }
.box-avatar.s40 .avatar img { height: 40px; width: auto; }
.box-avatar.column { display: flex; flex-direction: column; justify-content: center; align-items: center; }
.box-avatar.s150 .avatar { width: 150px; height: 150px; overflow: hidden; background: var(--ntrl50); display: inline-flex; justify-content: center; align-items: center; border-radius: 75px; }
.box-avatar.s150 .avatar img { height: 150px; width: auto; }
.box-avatar.rounded { border: 1px solid var(--soft); border-radius: 10px; padding: 12px; }
.box-avatar.s70 .avatar { width: 70px; height: 70px; overflow: hidden; background: var(--ntrl50); display: inline-flex; justify-content: center; align-items: center; border-radius: 35px; }
.box-avatar .avatar.s32 { width: 32px; height: 32px; overflow: hidden; background: var(--ntrl50); display: inline-flex; justify-content: center; align-items: center; border-radius: 20px; }
.box-avatar.avatar.s32 img { height: 32px; width: auto; }
.box-avatar.s70 .avatar img { height: 70px; width: auto; }
.box-avatar.s70 .text-avatar { min-height: 70px; }
.box-avatar.s30 .avatar { width: 30px; height: 30px; overflow: hidden; background: var(--ntrl50); display: inline-flex; justify-content: center; align-items: center; border-radius: 10px; }
.box-avatar.s30 .avatar img { height: 30px; width: auto; }
.box-avatar.s30 .avatar i { font-size: 14px; }
.box-avatar.s30 .text-avatar { min-height: 30px; }
.box-avatar.s30 .text-avatar h4.title { font-size: 14px; line-height: 18px; }
.follow-btn { border: 1px solid var(--blue); font-size: 10px; color: var(--blue); border-radius: 4px; padding: 0px 8px; display: inline-flex; justify-content: center; align-items: center; background: var(--white); font-weight: 400; }
.follow-btn.unfol { border-color: var(--dark_gray); color: var(--dark_gray); }
.follow-btn:hover { border-color: var(--dark_gray); color: var(--dark_gray); }
.box-avatar.s120 { display: block; }
.box-avatar.s120 .avatar { width: 120px; height: 120px; overflow: hidden; background: var(--ntrl50); display: inline-flex; justify-content: center; align-items: center; border-radius: 60px; float: left; }
.box-avatar.s120 .avatar img { height: 120px; width: auto; }
.box-avatar.s120 .text-avatar { min-height: 120px; justify-content: center; display: flex; flex-direction: column; padding-left: 16px; }
.box-komentar { display: block; position: relative; margin-bottom: 16px; padding-top: 16px; overflow: hidden; border-top: 1px dotted rgba(0, 0, 0, 0.2); }
.box-komentar.border-no { border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }
.box-komentar.balas { border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; padding-bottom: 0px; }
.box-komentar .isi-komentar { padding-left: 52px; }
.box-komentar .isi-komentar p { font-size: 14px; line-height: 24px; margin: 0px 0px 16px; font-weight: 400; color: var(--black); }
.box-komentar .isi-komentar .box-balas { display: flex; justify-content: flex-end; align-items: center; }
.box-komentar .isi-komentar .box-balas button.balas { display: inline-flex; justify-content: flex-start; align-items: center; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; background: transparent; padding: 0px; }
.box-komentar .isi-komentar .box-balas button.balas:hover { opacity: 0.7; }
.box-komentar .isi-komentar .box-balas .icon-balas { width: 16px; height: 16px; display: inline-flex; justify-content: center; align-items: center; }
.box-komentar .isi-komentar .box-balas p { font-size: 12px; line-height: 20px; margin: 0px 0px 0px 8px; font-weight: 600; }
.box-komentar .isi-komentar .box-balas p.balasan { position: relative; font-size: 12px; line-height: 20px; font-weight: 600; margin: 0px; padding: 0px; }
.all-balasan-komentar { overflow: hidden; }
.all-balasan-komentar.active { display: block; }
.box-komentar a.click-balasan { cursor: pointer; }
.box-komentar .box-balasan { display: none; width: 100%; min-height: auto; overflow: hidden; }
.box-komentar .box-balasan.active { display: block; }
.box-komentar a.click-input-balasan { cursor: pointer; display: flex; align-items: center; justify-content: center; }
.box-komentar .box-input-balasan { display: none; width: 100%; min-height: auto; overflow: hidden; }
.box-komentar .box-input-balasan.active { display: block; }
ul.row-list.list_big3 li .card-box .img-card { border-radius: 18px 18px 0px 0px; }
ul.row-list.list_big3 li:first-child .card-box .img-card { border-radius: 18px 18px 0px; }
ul.row-list.list_big3 li:last-child .card-box .img-card { border-radius: 18px 18px 18px 0px; }
ul.row-list.list_big3 li .card-box .text-card p { font-size: 14px; margin: 0px; color: var(--text); }
ul.row-list.list_delapan { row-gap: 32px; }
ul.row-list.list_lima li .card-box .img-card { border-radius: 10px 10px 0px 0px; }
ul.row-list.list_dua { row-gap: 48px; }
ul.row-list.list_dua_black { row-gap: 32px; }
ul.row-list.list_dua_black li .card-box .text-card a { color: var(--ntrl100); }
ul.row-list.list_dua_black li .card-box .text-card a:hover { color: var(--gray); }
ul.row-list.list_dua_black li .card-box .text-card p { color: var(--ntrl100); }
ul.row-list.list_also { row-gap: 32px; }
ul.row-list.list_also li a { color: var(--cokelat); }
ul.row-list.list_also li a:hover { color: var(--dark_gray); }
button.lock { display: inline-flex; justify-content: center; align-items: center; padding: 0px 4px; background: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; height: auto; color: var(--cokelat); }
.card-rubrik { display: flex; flex-wrap: nowrap; margin-bottom: 16px; }
.card-rubrik h4.title { padding-right: 8px; position: relative; font-size: 16px; margin: 0px; }
.card-rubrik h4.title::before { content: ""; position: absolute; top: 0px; right: 0px; height: 20px; width: 2px; background: var(--blue); }
.card-rubrik h3.title { padding-left: 8px; font-size: 16px; margin: 0px; font-weight: 500; }
.top_menu_mobile { display: none; }
.card-box.subs { border: 4px solid var(--white); }
.card-box.subs .text-card { padding: 16px; color: var(--white); min-height: 250px; display: flex; flex-direction: column; justify-content: space-between; }
.card-box.subs .text-card h3.title { font-size: 24px; display: inline; background: var(--blue); color: var(--white); border-radius: 6px; padding: 4px 8px; }
.card-box.subs .text-card h5.title { font-size: 12px; display: inline; background: var(--blue); color: var(--white); border-radius: 6px; padding: 4px 8px; position: relative; top: -4px; }
.card-box.subs .text-card .element-box input.element-input { background: transparent; border: 2px solid var(--white); color: var(--white); padding-left: 50px; }
.card-box.subs .text-card .element-box input.element-input::placeholder { color: var(--white); }
.box-consult { display: flex; flex-direction: column; margin-bottom: 32px; }
.box-consult h2 { font-size: 48px; line-height: 130%; margin-bottom: 0px; font-family: var(--playfair); }
.box-consult h2 sup { font-size: 14px; line-height: 16px; font-family: var(--roboto); top: -20px; }
.box-setup { background: var(--ntrl50); padding: 16px; overflow: hidden; }
.box-setup ul { padding: 0px; margin: 0px; }
.box-setup ul li { list-style-type: none; padding: 0px; margin: 0px; }
.box-setup ul li .element-check input[type="checkbox"] { opacity: 1; border: 2px solid var(--gray); background: var(--white); height: 24px; width: 24px; position: relative; top: 0px; cursor: pointer; appearance: none; border-radius: 12px; display: inline-flex; flex: 0 0 24px; }
.box-setup ul li .element-check input:checked { opacity: 1; background: var(--white); border: 2px solid var(--green); appearance: none; }
.box-setup ul li .element-check input::before { font-family: FontAwesome; position: absolute; width: 20px; height: 20px; top: 0px; left: 0px; content: ""; color: var(--gray); font-size: 14px; font-weight: normal; display: flex; align-items: center; justify-content: center; z-index: 2; }
.box-setup ul li .element-check input:checked::before { color: var(--green); }
.box-setup ul li { margin: 12px 0px; position: relative; line-height: 140%; }
.box-banner { display: flex; justify-content: center; align-items: center; margin: 0px auto; }
.box-banner img { max-width: fit-content; }
.box-banner.w100 img { max-width: fit-content; width: 100%; }
.out-box-title { max-width: 94%; }
.top_right_home { position: relative; padding: 120px 0px 0px; }
.top_right_home .redbox { position: absolute; width: 110%; top: 0px; height: 96px; padding: 16px; background: var(--red); }
.top_right_home .redbox .redbox-in { width: auto; max-width: 380px; }
.element-box.top_subs input::placeholder { color: var(--white); }
.element-box.top_subs input:focus::placeholder { color: var(--blue); }
.top_border { border-top: 1px solid var(--ntrl200); }
.grid-container { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); grid-template-rows: repeat(4, minmax(0px, auto)); gap: 16px; width: 100%; margin-bottom: 32px; padding-top: 32px; }
.banner-right { grid-row: span 2 / span 2; }
.banner-full { grid-column: span 4 / span 3; }
.grid-container.pages .card-box { padding: 16px; border: 1px solid var(--ntrl200); }
.grid-container.pages .card-box .text-card { height: 165px; }
.grid-container.pages .card-box .text-card p { font-size: 14px; }
.grid-container.pages .card-box .text-card h3.title { }
.grid-event { display: grid; grid-template-columns: repeat(12, 1fr); grid-template-rows: repeat(1, 1fr); gap: 32px; }
.grid-event .event-left { grid-column: span 8; }
.grid-event .event-right { grid-column: span 4; display: flex; align-items: flex-end; }
.grid-galleries { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
#bg_video { position: fixed; right: 0px; bottom: 0px; min-width: 100%; min-height: 100%; overflow: hidden; }
.video_text { overflow: hidden; min-height: 100vh; display: flex; flex-direction: column; justify-content: space-between; padding: 60px 0px; color: var(--white); }
.video_text h2.title { font-size: 110px; margin: 0px; line-height: 100%; position: relative; top: -32px; left: 100px; }
.video_text h3.title { font-size: 60px; margin: 0px; line-height: 100%; }
.video_text p { font-size: 1.2em; }
.video_text .leftpos { width: 100%; padding-right: 60%; margin-top: 60dvh; }
.video_text .rightpos { width: 100%; padding-left: 60%; margin-top: 60dvh; }
.element-box.dark-input input { background: rgba(48, 48, 48, 0.8); border-color: rgb(48, 48, 48); color: var(--white); width: 55%; }
.element-box.dark-area textarea { background: rgba(48, 48, 48, 0.8); border-color: rgb(48, 48, 48); color: var(--white); width: 75%; }
.element-box.dark-input input:focus, .element-box.dark-area textarea:focus { border-color: var(--dark_gray); }