Facebook

dsadasd safest cryptocurrency exchange

From asda, 5 Months ago, written in Plain Text.
URL https://pastebin.pl/view/0790f278
Embed
Download Paste or View Raw
Hits: 127
  1. <!DOCTYPE html>
  2. &lt;html lang="en-US"&gt;
  3.  
  4. &lt;head&gt;
  5.  
  6.  &lt;meta charset="UTF-8"&gt;
  7.  &lt;meta name="viewport" c initial-scale=1, minimum-scale=1"&gt;
  8.  &lt;link rel="profile" href="http://gmpg.org/xfn/11"&gt;
  9.   &lt;title&gt;CSWM UI – Building synergy inspiring Indonesia&lt;/title&gt;
  10. &lt;meta name='robots' c /&gt;
  11. &lt;link rel='dns-prefetch' href='//fonts.googleapis.com' /&gt;
  12. >
  13. >
  14. [removed]
  15. /* &lt;![CDATA[ */
  16. window._wpemojiSettings = {"baseUrl":"https://s.w.org/images/core/emoji/14.0.0/72x72/","ext":".png","svgUrl":"https://s.w.org/images/core/emoji/14.0.0/svg/","svgExt":".svg","source":{"concatemoji":"https://pastebin.pl/view/raw/bf135d5"}};
  17. /*! This file is auto-generated */
  18. !function(i,n){var o,s,e;function c(e){try{var t={supportTests:e,timestamp:(new Date).valueOf()};sessionStorage.setItem(o,JSON.stringify(t))}catch(e){}}function p(e,t,n){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);var t=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data),r=(e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(n,0,0),new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data));return t.every(function(e,t){return e===r[t]})}function u(e,t,n){switch(t){case"flag":return n(e,"ud83cudff3ufe0fu200du26a7ufe0f","ud83cudff3ufe0fu200bu26a7ufe0f")?!1:!n(e,"ud83cuddfaud83cuddf3","ud83cuddfau200bud83cuddf3")&&!n(e,"ud83cudff4udb40udc67udb40udc62udb40udc65udb40udc6eudb40udc67udb40udc7f","ud83cudff4u200budb40udc67u200budb40udc62u200budb40udc65u200budb40udc6eu200budb40udc67u200budb40udc7f");case"emoji":return!n(e,"ud83eudef1ud83cudffbu200dud83eudef2ud83cudfff","ud83eudef1ud83cudffbu200bud83eudef2ud83cudfff")}return!1}function f(e,t,n){var r="undefined"!=typeof WorkerGlobalScope&&self; instanceof WorkerGlobalScope?new OffscreenCanvas(300,150):i.createElement("canvas"),a=r.getContext("2d",{willReadFrequently:!0}),o=(a.textBaseline="top",a.font="600 32px Arial",{});return e.forEach(function(e){o[e]=t(a,e,n)}),o}function t(e){var t=i.createElement("script");t.src=e,t.defer=!0,i.head.appendChild(t)}"undefined"!=typeof Promise&&(o="wpEmojiSettingsSupports",s=["flag","emoji"],n.supports={everything:!0,everythingExceptFlag:!0},e=new Promise(function(e){i.addEventListener("DOMContentLoaded",e,{once:!0})}),new Promise(function(t){var n=function(){try{var e=JSON.parse(sessionStorage.getItem(o));if("object"==typeof e&&"number"==typeof e.timestamp&&(new Date).valueOf()> */
  19. [removed]
  20. &lt;style id='wp-emoji-styles-inline-css' type='text/css'&gt;
  21.  
  22.  img.wp-smiley, img.emoji {
  23.   display: inline !important;
  24.   border: none !important;
  25.   box-shadow: none !important;
  26.   height: 1em !important;
  27.   width: 1em !important;
  28.   margin: 0 0.07em !important;
  29.   vertical-align: -0.1em !important;
  30.   background: none !important;
  31.   padding: 0 !important;
  32.  }
  33. &lt;/style&gt;
  34. &lt;link rel='stylesheet' id='wp-block-library-css' href='https://pastebin.com/raw/xCGVg1c9' type='text/css' media='all' /&gt;
  35. &lt;style id='classic-theme-styles-inline-css' type='text/css'&gt;
  36. /*! This file is auto-generated */
  37. .wp-block-button__link{color:#fff;background-color:#32373c;border-radius:9999px;box-shadow:none;text-decoration:none;padding:calc(.667em + 2px) calc(1.333em + 2px);font-size:1.125em}.wp-block-file__button{background:#32373c;color:#fff;text-decoration:none}
  38. &lt;/style&gt;
  39. &lt;style id='global-styles-inline-css' type='text/css'&gt;
  40. body{--wp--preset--color--black: #000000;--wp--preset--color--cyan-bluish-gray: #abb8c3;--wp--preset--color--white: #ffffff;--wp--preset--color--pale-pink: #f78da7;--wp--preset--color--vivid-red: #cf2e2e;--wp--preset--color--luminous-vivid-orange: #ff6900;--wp--preset--color--luminous-vivid-amber: #fcb900;--wp--preset--color--light-green-cyan: #7bdcb5;--wp--preset--color--vivid-green-cyan: #00d084;--wp--preset--color--pale-cyan-blue: #8ed1fc;--wp--preset--color--vivid-cyan-blue: #0693e3;--wp--preset--color--vivid-purple: #9b51e0;--wp--preset--color--neve-link-color: var(--nv-primary-accent);--wp--preset--color--neve-link-hover-color: var(--nv-secondary-accent);--wp--preset--color--nv-site-bg: var(--nv-site-bg);--wp--preset--color--nv-light-bg: var(--nv-light-bg);--wp--preset--color--nv-dark-bg: var(--nv-dark-bg);--wp--preset--color--neve-text-color: var(--nv-text-color);--wp--preset--color--nv-text-dark-bg: var(--nv-text-dark-bg);--wp--preset--color--nv-c-1: var(--nv-c-1);--wp--preset--color--nv-c-2: var(--nv-c-2);--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--font-size--small: 13px;--wp--preset--font-size--medium: 20px;--wp--preset--font-size--large: 36px;--wp--preset--font-size--x-large: 42px;--wp--preset--spacing--20: 0.44rem;--wp--preset--spacing--30: 0.67rem;--wp--preset--spacing--40: 1rem;--wp--preset--spacing--50: 1.5rem;--wp--preset--spacing--60: 2.25rem;--wp--preset--spacing--70: 3.38rem;--wp--preset--spacing--80: 5.06rem;--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);--wp--preset--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);}:where(.is-layout-flex){gap: 0.5em;}:where(.is-layout-grid){gap: 0.5em;}body .is-layout-flow > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}body .is-layout-flow > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}body .is-layout-flow > .aligncenter{margin-left: auto !important;margin-right: auto !important;}body .is-layout-constrained > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}body .is-layout-constrained > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}body .is-layout-constrained > .aligncenter{margin-left: auto !important;margin-right: auto !important;}body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)){max-width: var(--wp--style--global--content-size);margin-left: auto !important;margin-right: auto !important;}body .is-layout-constrained > .alignwide{max-width: var(--wp--style--global--wide-size);}body .is-layout-flex{display: flex;}body .is-layout-flex{flex-wrap: wrap;align-items: center;}body .is-layout-flex > *{margin: 0;}body .is-layout-grid{display: grid;}body .is-layout-grid > *{margin: 0;}:where(.wp-block-columns.is-layout-flex){gap: 2em;}:where(.wp-block-columns.is-layout-grid){gap: 2em;}:where(.wp-block-post-template.is-layout-flex){gap: 1.25em;}:where(.wp-block-post-template.is-layout-grid){gap: 1.25em;}.has-black-color{color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-color{color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-color{color: var(--wp--preset--color--white) !important;}.has-pale-pink-color{color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-color{color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color: var(--wp--preset--color--vivid-purple) !important;}.has-black-background-color{background-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color: var(--wp--preset--color--white) !important;}.has-pale-pink-background-color{background-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color: var(--wp--preset--color--vivid-purple) !important;}.has-black-border-color{border-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color: var(--wp--preset--color--white) !important;}.has-pale-pink-border-color{border-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color: var(--wp--preset--color--vivid-purple) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background: var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background: var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background: var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background: var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background: var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background: var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background: var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background: var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background: var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size: var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size: var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size: var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size: var(--wp--preset--font-size--x-large) !important;}
  41. .wp-block-navigation a:where(:not(.wp-element-button)){color: inherit;}
  42. :where(.wp-block-post-template.is-layout-flex){gap: 1.25em;}:where(.wp-block-post-template.is-layout-grid){gap: 1.25em;}
  43. :where(.wp-block-columns.is-layout-flex){gap: 2em;}:where(.wp-block-columns.is-layout-grid){gap: 2em;}
  44. .wp-block-pullquote{font-size: 1.5em;line-height: 1.6;}
  45. &lt;/style&gt;
  46. &lt;link rel='stylesheet' id='neve-style-css' href='https://pastebin.pl/view/raw/3740f74d' type='text/css' media='all' /&gt;
  47. &lt;style id='neve-style-inline-css' type='text/css'&gt;
  48.  
  49.    .nv-ft-post {
  50.     margin-top:60px
  51.    }
  52.    .nv-ft-post .nv-ft-wrap:not(.layout-covers){
  53.     background:var(--nv-light-bg);
  54.    }
  55.    .nv-ft-post h2{
  56.     font-size:calc( var(--fontsize, var(--h2fontsize)) * 1.3)
  57.    }
  58.    .nv-ft-post .nv-meta-list{
  59.     display:block
  60.    }
  61.    .nv-ft-post .non-grid-content{
  62.     padding:32px
  63.    }
  64.    .nv-ft-post .wp-post-image{
  65.     position:absolute;
  66.     object-fit:cover;
  67.     width:100%;
  68.     height:100%
  69.    }
  70.    .nv-ft-post:not(.layout-covers) .nv-post-thumbnail-wrap{
  71.     margin:0;
  72.     position:relative;
  73.     min-height:320px
  74.    }
  75.    
  76. .nv-meta-list li.meta:not(:last-child):after { content:"/" }.nv-meta-list .no-mobile{
  77.    display:none;
  78.   }.nv-meta-list li.last::after{
  79.    content: ""!important;
  80.   }@media (min-width: 769px) {
  81.    .nv-meta-list .no-mobile {
  82.     display: inline-block;
  83.    }
  84.    .nv-meta-list li.last:not(:last-child)::after {
  85.      content: "/" !important;
  86.    }
  87.   }
  88.  :root{ --container: 748px;--postwidth:100%; --primarybtnbg: var(--nv-primary-accent); --secondarybtnbg: rgba(0, 0, 0, 0); --primarybtnhoverbg: var(--nv-secondary-accent); --secondarybtnhoverbg: var(--nv-dark-bg); --primarybtncolor: #010101; --secondarybtncolor: var(--nv-dark-bg); --primarybtnhovercolor: #ffffff; --secondarybtnhovercolor: var(--nv-text-dark-bg);--primarybtnborderradius:0;--secondarybtnborderradius:0;--secondarybtnborderwidth:2px;--btnpadding:12px 24px;--primarybtnpadding:12px 24px;--secondarybtnpadding:calc(12px - 2px) calc(24px - 2px); --btnfs: 14px; --btnlineheight: 1.6em; --bodyfontfamily: "Plus Jakarta Sans"; --bodyfontsize: 16px; --bodylineheight: 1.6em; --bodyletterspacing: 0px; --bodyfontweight: 400; --bodytexttransform: none; --headingsfontfamily: "Plus Jakarta Sans"; --h1fontsize: 39px; --h1fontweight: 600; --h1lineheight: 1.2em; --h1letterspacing: 0px; --h1texttransform: none; --h2fontsize: 28px; --h2fontweight: 600; --h2lineheight: 1.3em; --h2letterspacing: 0px; --h2texttransform: none; --h3fontsize: 20px; --h3fontweight: 600; --h3lineheight: 1.3em; --h3letterspacing: 0px; --h3texttransform: none; --h4fontsize: 16px; --h4fontweight: 600; --h4lineheight: 1.3em; --h4letterspacing: 0px; --h4texttransform: none; --h5fontsize: 14px; --h5fontweight: 600; --h5lineheight: 1.3em; --h5letterspacing: 0px; --h5texttransform: none; --h6fontsize: 14px; --h6fontweight: 600; --h6lineheight: 1.3em; --h6letterspacing: 0px; --h6texttransform: none;--formfieldborderwidth:2px;--formfieldborderradius:0; --formfieldbgcolor: var(--nv-site-bg); --formfieldbordercolor: var(--nv-light-bg); --formfieldcolor: var(--nv-text-color);--formfieldpadding:10px 12px 10px 12px;; } .single-post-container .alignfull > [class*="__inner-container"], .single-post-container .alignwide > [class*="__inner-container"]{ max-width:718px } .nv-meta-list{ --avatarsize: 20px; } .single .nv-meta-list{ --avatarsize: 20px; } .blog .blog-entry-title, .archive .blog-entry-title{ --fontsize: 28px; } .single h1.entry-title{ --fontsize: 28px; } .neve-main{ --boxshadow:0 3px 6px -5px rgba(0, 0, 0, 0.1), 0 4px 8px rgba(0, 0, 0, 0.1); } .nv-post-cover{ --height: 250px;--padding:40px 15px;--justify: flex-start; --textalign: left; --valign: center; } .nv-post-cover .nv-title-meta-wrap, .nv-page-title-wrap, .entry-header{ --textalign: left; } .nv-is-boxed.nv-title-meta-wrap{ --padding:40px 15px; --bgcolor: var(--nv-dark-bg); } .nv-overlay{ --opacity: 50; --blendmode: normal; } .nv-is-boxed.nv-comments-wrap{ --padding:20px; } .nv-is-boxed.comment-respond{ --padding:20px; } .nv-single-post-wrap{ --spacing: 60px; } .single:not(.single-product), .page{ --c-vspace:0 0 0 0;; } .global-styled{ --bgcolor: var(--nv-site-bg); } .header-top{ --rowbcolor: var(--nv-light-bg); --color: var(--nv-text-color); --bgcolor: #f0f0f0; } .header-main{ --rowbcolor: var(--nv-light-bg); --color: var(--nv-text-color); } .header-bottom{ --rowbcolor: var(--nv-light-bg); --color: var(--nv-text-color); --bgcolor: #ffffff; } .header-menu-sidebar-bg{ --justify: flex-start; --textalign: left;--flexg: 1;--wrapdropdownwidth: auto; --color: var(--nv-text-color); --bgcolor: var(--nv-site-bg); } .header-menu-sidebar{ width: 360px; } .builder-item--logo{ --maxwidth: 32px; --color: #ffffff; --fs: 24px;--padding:10px 0;--margin:0; --textalign: left;--justify: flex-start; } .builder-item--nav-icon,.header-menu-sidebar .close-sidebar-panel .navbar-toggle{ --borderradius:0;--borderwidth:1px; } .builder-item--nav-icon{ --label-margin:0 5px 0 0;;--padding:10px 15px;--margin:0; } .builder-item--primary-menu{ --color: #ffffff; --hovercolor: #a6ecb5; --hovertextcolor: var(--nv-text-color); --activecolor: #f2e71d; --spacing: 20px; --height: 25px;--padding:0;--margin:0; --fontsize: 1em; --lineheight: 1.6em; --letterspacing: 0px; --fontweight: 600; --texttransform: uppercase; --iconsize: 1em; } .hfg-is-group.has-primary-menu .inherit-ff{ --inheritedfw: 600; } .footer-top-inner .row{ grid-template-columns:1fr 1fr 1fr; --valign: flex-start; } .footer-top{ --rowbcolor: var(--nv-light-bg); --color: var(--nv-text-color); --bgcolor: #ffffff; } .footer-main-inner .row{ grid-template-columns:1fr 1fr 1fr; --valign: flex-start; } .footer-main{ --rowbcolor: var(--nv-light-bg); --color: var(--nv-text-color); --bgcolor: var(--nv-site-bg); } .footer-bottom-inner .row{ grid-template-columns:1fr 1fr 1fr; --valign: flex-start; } .footer-bottom{ --rowbcolor: var(--nv-light-bg); --color: var(--nv-text-dark-bg); --bgcolor: #ffffff; } @media(min-width: 576px){ :root{ --container: 992px;--postwidth:50%;--btnpadding:12px 24px;--primarybtnpadding:12px 24px;--secondarybtnpadding:calc(12px - 2px) calc(24px - 2px); --btnfs: 14px; --btnlineheight: 1.6em; --bodyfontsize: 16px; --bodylineheight: 1.6em; --bodyletterspacing: 0px; --h1fontsize: 55px; --h1lineheight: 1.3em; --h1letterspacing: 0px; --h2fontsize: 34px; --h2lineheight: 1.3em; --h2letterspacing: 0px; --h3fontsize: 20px; --h3lineheight: 1.3em; --h3letterspacing: 0px; --h4fontsize: 16px; --h4lineheight: 1.3em; --h4letterspacing: 0px; --h5fontsize: 14px; --h5lineheight: 1.3em; --h5letterspacing: 0px; --h6fontsize: 14px; --h6lineheight: 1.3em; --h6letterspacing: 0px; } .single-post-container .alignfull > [class*="__inner-container"], .single-post-container .alignwide > [class*="__inner-container"]{ max-width:962px } .nv-meta-list{ --avatarsize: 20px; } .single .nv-meta-list{ --avatarsize: 20px; } .blog .blog-entry-title, .archive .blog-entry-title{ --fontsize: 32px; } .single h1.entry-title{ --fontsize: 40px; } .nv-post-cover{ --height: 320px;--padding:60px 30px;--justify: flex-start; --textalign: left; --valign: center; } .nv-post-cover .nv-title-meta-wrap, .nv-page-title-wrap, .entry-header{ --textalign: left; } .nv-is-boxed.nv-title-meta-wrap{ --padding:60px 30px; } .nv-is-boxed.nv-comments-wrap{ --padding:30px; } .nv-is-boxed.comment-respond{ --padding:30px; } .nv-single-post-wrap{ --spacing: 60px; } .single:not(.single-product), .page{ --c-vspace:0 0 0 0;; } .header-menu-sidebar-bg{ --justify: flex-start; --textalign: left;--flexg: 1;--wrapdropdownwidth: auto; } .header-menu-sidebar{ width: 360px; } .builder-item--logo{ --maxwidth: 32px; --fs: 24px;--padding:10px 0;--margin:0; --textalign: left;--justify: flex-start; } .builder-item--nav-icon{ --label-margin:0 5px 0 0;;--padding:10px 15px;--margin:0; } .builder-item--primary-menu{ --spacing: 20px; --height: 25px;--padding:0;--margin:0; --fontsize: 1em; --lineheight: 1.6em; --letterspacing: 0px; --iconsize: 1em; } }@media(min-width: 960px){ :root{ --container: 1380px;--postwidth:33.333333333333%;--btnpadding:12px 24px;--primarybtnpadding:12px 24px;--secondarybtnpadding:calc(12px - 2px) calc(24px - 2px); --btnfs: 16px; --btnlineheight: 1.6em; --bodyfontsize: 17px; --bodylineheight: 1.7em; --bodyletterspacing: 0px; --h1fontsize: 70px; --h1lineheight: 1.3em; --h1letterspacing: 0px; --h2fontsize: 46px; --h2lineheight: 1.3em; --h2letterspacing: 0px; --h3fontsize: 24px; --h3lineheight: 1.3em; --h3letterspacing: 0px; --h4fontsize: 20px; --h4lineheight: 1.3em; --h4letterspacing: 0px; --h5fontsize: 16px; --h5lineheight: 1.3em; --h5letterspacing: 0px; --h6fontsize: 16px; --h6lineheight: 1.3em; --h6letterspacing: 0px; } body:not(.single):not(.archive):not(.blog):not(.search):not(.error404) .neve-main > .container .col, body.post-type-archive-course .neve-main > .container .col, body.post-type-archive-llms_membership .neve-main > .container .col{ max-width: 100%; } body:not(.single):not(.archive):not(.blog):not(.search):not(.error404) .nv-sidebar-wrap, body.post-type-archive-course .nv-sidebar-wrap, body.post-type-archive-llms_membership .nv-sidebar-wrap{ max-width: 0%; } .neve-main > .archive-container .nv-index-posts.col{ max-width: 100%; } .neve-main > .archive-container .nv-sidebar-wrap{ max-width: 0%; } .neve-main > .single-post-container .nv-single-post-wrap.col{ max-width: 70%; } .single-post-container .alignfull > [class*="__inner-container"], .single-post-container .alignwide > [class*="__inner-container"]{ max-width:936px } .container-fluid.single-post-container .alignfull > [class*="__inner-container"], .container-fluid.single-post-container .alignwide > [class*="__inner-container"]{ max-width:calc(70% + 15px) } .neve-main > .single-post-container .nv-sidebar-wrap{ max-width: 30%; } .nv-meta-list{ --avatarsize: 20px; } .single .nv-meta-list{ --avatarsize: 20px; } .blog .blog-entry-title, .archive .blog-entry-title{ --fontsize: 32px; } .single h1.entry-title{ --fontsize: 65px; } .nv-post-cover{ --height: 400px;--padding:60px 40px;--justify: flex-start; --textalign: left; --valign: center; } .nv-post-cover .nv-title-meta-wrap, .nv-page-title-wrap, .entry-header{ --textalign: left; } .nv-is-boxed.nv-title-meta-wrap{ --padding:60px 40px; } .nv-is-boxed.nv-comments-wrap{ --padding:40px; } .nv-is-boxed.comment-respond{ --padding:40px; } .nv-single-post-wrap{ --spacing: 58px; } .single:not(.single-product), .page{ --c-vspace:0 0 0 0;; } .header-menu-sidebar-bg{ --justify: flex-start; --textalign: left;--flexg: 1;--wrapdropdownwidth: auto; } .header-menu-sidebar{ width: 360px; } .builder-item--logo{ --maxwidth: 4rem; --fs: 24px;--padding:10px 0;--margin:0; --textalign: left;--justify: flex-start; } .builder-item--nav-icon{ --label-margin:0 5px 0 0;;--padding:10px 15px;--margin:0; } .builder-item--primary-menu{ --spacing: 20px; --height: 25px;--padding:0;--margin:0; --fontsize: 0.8em; --lineheight: 1.6em; --letterspacing: 0px; --iconsize: 0.8em; } }:root{--nv-primary-accent:#fcaf3b;--nv-secondary-accent:#ab641d;--nv-site-bg:#ffffff;--nv-light-bg:#ededed;--nv-dark-bg:#14171c;--nv-text-color:#2b2b2b;--nv-text-dark-bg:#ffffff;--nv-c-1:#77b978;--nv-c-2:#f37262;--nv-fallback-ff:Arial, Helvetica, sans-serif;}
  89.  @media(min-width: 960px) { #content.neve-main .container-fluid .alignfull > [class*="__inner-container"],#content.neve-main .container-fluid .alignwide > [class*="__inner-container"]{ max-width: calc(100% + 15px); } #content.neve-main > .container-fluid > .row > .col{ max-width: 100%; } body:not(.neve-off-canvas) #content.neve-main > .container-fluid > .row > .nv-sidebar-wrap, body:not(.neve-off-canvas) #content.neve-main > .container-fluid > .row > .nv-sidebar-wrap.shop-sidebar { max-width: 0%; } }
  90. &lt;/style&gt;
  91. >
  92. &lt;link rel="https://api.w.org/" href="https://cswm.ui.ac.id/wp-json/" /&gt;&lt;link rel="alternate" type="application/json" href="https://cswm.ui.ac.id/wp-json/wp/v2/pages/6" />&lt;link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://cswm.ui.ac.id/xmlrpc.php?rsd" /&gt;
  93. &lt;meta name="generator" c 6.4.1" /&gt;
  94. &lt;link rel="canonical" href="https://cswm.ui.ac.id/" /&gt;
  95. &lt;link rel='shortlink' href='https://cswm.ui.ac.id/' /&gt;
  96. &lt;link rel="alternate" type="application/json+oembed" href="https://cswm.ui.ac.id/wp-json/oembed/1.0/embed?url=https://cswm.ui.ac.id/" /&gt;
  97. >
  98. &lt;link rel="icon" href="https://cswm.ui.ac.id/wp-content/uploads/2022/12/cropped-cropped-Logo-cswm-1-32x32.webp" sizes="32x32" /&gt;
  99. &lt;link rel="icon" href="https://cswm.ui.ac.id/wp-content/uploads/2022/12/cropped-cropped-Logo-cswm-1-192x192.webp" sizes="192x192" /&gt;
  100. &lt;link rel="apple-touch-icon" href="https://cswm.ui.ac.id/wp-content/uploads/2022/12/cropped-cropped-Logo-cswm-1-180x180.webp" /&gt;
  101. &lt;meta name="msapplication-TileImage" c /&gt;
  102.   &lt;style type="text/css" id="wp-custom-css"&gt;
  103.    h2.blog-entry-title {
  104.  font-size: 20px;
  105. }
  106.  
  107. p.site-title {
  108.  font-size: 2rem;
  109.  font-weight: lighter;
  110. }
  111. .header-main-inner {
  112.  background-color: rgba(105,105,105,0.8)
  113. }
  114.  
  115. h1.entry-title {
  116.  color: #1aa353;
  117.  font-size: 48px;
  118.  font-weight: 700;
  119. }
  120.  
  121.  
  122. @media screen and (max-width: 700px) {
  123.  .wp-block-column {
  124.   padding: 5%;
  125.  }
  126.  
  127. }
  128. @media screen and (max-width: 400px) {
  129.  p.site-title {
  130.   font-size: 24px;
  131.  }
  132.  
  133. }
  134.  
  135. @media screen and (min-width: 1919px) {
  136.  p.site-title {
  137.   font-size: 40px;
  138.  }
  139.  
  140. }  &lt;/style&gt;
  141.  
  142.  &lt;/head&gt;
  143.  
  144. &lt;body  class="home page-template-default page page-id-6 wp-custom-logo  nv-blog-covers nv-sidebar-full-width nv-without-title nv-without-footer menu_sidebar_slide_left" id="neve_body"  &gt;
  145. <div class="wrapper">
  146.  
  147.  &lt;header class="header"  &gt;
  148.   <a class="neve-skip-link show-on-focus" href="#content">
  149.    Skip to content  </a>
  150.   <div id="header-grid"  class="hfg_header site-header">
  151.  
  152. <nav class="header--row header-main hide-on-mobile hide-on-tablet layout-full-contained nv-navbar header--row"
  153.   data-row-id="main" data-show->
  154.  
  155.  <div
  156.   class="header--row-inner header-main-inner">
  157.   <div class="container">
  158.    <div
  159.     class="row row--wrapper"
  160.      data-secti >
  161.     <div class="hfg-slot left"><div class="builder-item desktop-left"><div class="item--inner builder-item--logo"
  162.    data-secti
  163.   data-item-id="logo">
  164.  
  165. <div class="site-logo">
  166.  <a class="brand" href="https://cswm.ui.ac.id/" title="← CSWM UI"
  167.    aria-label="CSWM UI Building synergy inspiring Indonesia" rel="home"><div class="title-with-logo"><img width="200" height="146" src="https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white.png" class="neve-site-logo skip-lazy" alt="" data-variant="logo" decoding="async" srcset="https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white.png 200w, https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white-16x12.png 16w" sizes="(max-width: 200px) 100vw, 200px" /><div class="nv-title-tagline-wrap"><p class="site-title">CSWM UI</p></div></div></a></div>
  168.  </div>
  169.  
  170. </div></div><div class="hfg-slot right"><div class="builder-item has-nav"><div class="item--inner builder-item--primary-menu has_menu"
  171.    data-secti
  172.   data-item-id="primary-menu">
  173.  <div class="nv-nav-wrap">
  174.  <div role="navigation" class="nav-menu-primary style-border-bottom m-style"
  175.    aria-label="Primary Menu">
  176.  
  177.   <ul id="nv-primary-navigation-main" class="primary-menu-ul nav-ul menu-desktop"><li id="menu-item-19" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-6 current_page_item menu-item-19 nv-active"><div class="wrap"><a href="https://cswm.ui.ac.id/" aria-current="page">Home</a></div></li>
  178. <li id="menu-item-20" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-20"><div class="wrap"><a href="https://cswm.ui.ac.id/about/">About Us</a></div></li>
  179. <li id="menu-item-717" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-717"><div class="wrap"><a href="https://cswm.ui.ac.id/contact/">Contact</a></div></li>
  180. <li id="menu-item-687" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-687"><div class="wrap"><a><span class="menu-item-title-wrap dd-title">Services</span></a><div role="button" aria-pressed="false" aria-label="Open Submenu" tabindex="0" class="caret-wrap caret 4" ><span class="caret"><svg fill="currentColor" aria-label="Dropdown"  viewBox="0 0 448 512"><path d="M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z"/></svg></span></div></div>
  181. <ul class="sub-menu">
  182.  <li id="menu-item-49" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49"><div class="wrap"><a href="https://cswm.ui.ac.id/studies/">Studies</a></div></li>
  183.  <li id="menu-item-51" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-51"><div class="wrap"><a href="https://cswm.ui.ac.id/consultancy-2/">Consultancy</a></div></li>
  184.  <li id="menu-item-50" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-50"><div class="wrap"><a href="https://cswm.ui.ac.id/education-2/">Education</a></div></li>
  185. </ul>
  186. </li>
  187. <li id="menu-item-23" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-23"><div class="wrap"><a href="https://cswm.ui.ac.id/blog/">Reads</a></div></li>
  188. </ul> </div>
  189. </div>
  190.  
  191.  </div>
  192.  
  193. </div></div>       </div>
  194.   </div>
  195.  </div>
  196. </nav>
  197.  
  198.  
  199. <nav class="header--row header-main hide-on-desktop layout-full-contained nv-navbar header--row"
  200.   data-row-id="main" data-show->
  201.  
  202.  <div
  203.   class="header--row-inner header-main-inner">
  204.   <div class="container">
  205.    <div
  206.     class="row row--wrapper"
  207.      data-secti >
  208.     <div class="hfg-slot left"><div class="builder-item tablet-left mobile-left"><div class="item--inner builder-item--logo"
  209.    data-secti
  210.   data-item-id="logo">
  211.  
  212. <div class="site-logo">
  213.  <a class="brand" href="https://cswm.ui.ac.id/" title="← CSWM UI"
  214.    aria-label="CSWM UI Building synergy inspiring Indonesia" rel="home"><div class="title-with-logo"><img width="200" height="146" src="https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white.png" class="neve-site-logo skip-lazy" alt="" data-variant="logo" decoding="async" srcset="https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white.png 200w, https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white-16x12.png 16w" sizes="(max-width: 200px) 100vw, 200px" /><div class="nv-title-tagline-wrap"><p class="site-title">CSWM UI</p></div></div></a></div>
  215.  </div>
  216.  
  217. </div></div><div class="hfg-slot right"><div class="builder-item tablet-left mobile-left"><div class="item--inner builder-item--nav-icon"
  218.    data-secti
  219.   data-item-id="nav-icon">
  220.  <div class="menu-mobile-toggle item-button navbar-toggle-wrapper">
  221.  <button type="button" class=" navbar-toggle"
  222.    value="Navigation Menu"
  223.      aria-label="Navigation Menu "
  224.     aria-expanded="false"  !== typeof toggleAriaClick ) { toggleAriaClick() }">
  225.      <span class="bars">
  226.     <span class="icon-bar"></span>
  227.     <span class="icon-bar"></span>
  228.     <span class="icon-bar"></span>
  229.    </span>
  230.      <span class="screen-reader-text">Navigation Menu</span>
  231.  </button>
  232. </div> &lt;!--.navbar-toggle-wrapper--&gt;
  233.  
  234.  
  235.  </div>
  236.  
  237. </div></div>       </div>
  238.   </div>
  239.  </div>
  240. </nav>
  241.  
  242. <div
  243.   id="header-menu-sidebar" class="header-menu-sidebar tcb menu-sidebar-panel slide_left hfg-pe"
  244.   data-row-id="sidebar">
  245.  <div id="header-menu-sidebar-bg" class="header-menu-sidebar-bg">
  246.     <div class="close-sidebar-panel navbar-toggle-wrapper">
  247.    <button type="button" class="hamburger is-active  navbar-toggle active"      value="Navigation Menu"
  248.      aria-label="Navigation Menu "
  249.       aria-expanded="false"  !== typeof toggleAriaClick ) { toggleAriaClick() }">
  250.         <span class="bars">
  251.       <span class="icon-bar"></span>
  252.       <span class="icon-bar"></span>
  253.       <span class="icon-bar"></span>
  254.      </span>
  255.         <span class="screen-reader-text">
  256.    Navigation Menu     </span>
  257.    </button>
  258.   </div>
  259.      <div id="header-menu-sidebar-inner" class="header-menu-sidebar-inner tcb ">
  260.       <div class="builder-item has-nav"><div class="item--inner builder-item--primary-menu has_menu"
  261.    data-secti
  262.   data-item-id="primary-menu">
  263.  <div class="nv-nav-wrap">
  264.  <div role="navigation" class="nav-menu-primary style-border-bottom m-style"
  265.    aria-label="Primary Menu">
  266.  
  267.   <ul id="nv-primary-navigation-sidebar" class="primary-menu-ul nav-ul menu-mobile"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-6 current_page_item menu-item-19 nv-active"><div class="wrap"><a href="https://cswm.ui.ac.id/" aria-current="page">Home</a></div></li>
  268. <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-20"><div class="wrap"><a href="https://cswm.ui.ac.id/about/">About Us</a></div></li>
  269. <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-717"><div class="wrap"><a href="https://cswm.ui.ac.id/contact/">Contact</a></div></li>
  270. <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-687"><div class="wrap"><a><span class="menu-item-title-wrap dd-title">Services</span></a><button tabindex="0" type="button" class="caret-wrap navbar-toggle 4 "   aria-label="Toggle Services"><span class="caret"><svg fill="currentColor" aria-label="Dropdown"  viewBox="0 0 448 512"><path d="M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z"/></svg></span></button></div>
  271. <ul class="sub-menu">
  272.  <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49"><div class="wrap"><a href="https://cswm.ui.ac.id/studies/">Studies</a></div></li>
  273.  <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-51"><div class="wrap"><a href="https://cswm.ui.ac.id/consultancy-2/">Consultancy</a></div></li>
  274.  <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-50"><div class="wrap"><a href="https://cswm.ui.ac.id/education-2/">Education</a></div></li>
  275. </ul>
  276. </li>
  277. <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-23"><div class="wrap"><a href="https://cswm.ui.ac.id/blog/">Reads</a></div></li>
  278. </ul> </div>
  279. </div>
  280.  
  281.  </div>
  282.  
  283. </div>     </div>
  284.  </div>
  285. </div>
  286. <div class="header-menu-sidebar-overlay hfg-ov hfg-pe"  !== typeof toggleAriaClick ) { toggleAriaClick() }"></div>
  287. </div>
  288.  &lt;/header&gt;
  289.  
  290.  &lt;style&gt;.is-menu-sidebar .header-menu-sidebar { visibility: visible; }.is-menu-sidebar.menu_sidebar_slide_left .header-menu-sidebar { transform: translate3d(0, 0, 0); left: 0; }.is-menu-sidebar.menu_sidebar_slide_right .header-menu-sidebar { transform: translate3d(0, 0, 0); right: 0; }.is-menu-sidebar.menu_sidebar_pull_right .header-menu-sidebar, .is-menu-sidebar.menu_sidebar_pull_left .header-menu-sidebar { transform: translateX(0); }.is-menu-sidebar.menu_sidebar_dropdown .header-menu-sidebar { height: auto; }.is-menu-sidebar.menu_sidebar_dropdown .header-menu-sidebar-inner { max-height: 400px; padding: 20px 0; }.is-menu-sidebar.menu_sidebar_full_canvas .header-menu-sidebar { opacity: 1; }.header-menu-sidebar .menu-item-nav-search { pointer-events: none; }.header-menu-sidebar .menu-item-nav-search .is-menu-sidebar & { pointer-events: unset; }.nav-ul li:focus-within .wrap.active + .sub-menu { opacity: 1; visibility: visible; }.nav-ul li.neve-mega-menu:focus-within .wrap.active + .sub-menu { display: grid; }.nav-ul li > .wrap { display: flex; align-items: center; position: relative; padding: 0 4px; }.nav-ul:not(.menu-mobile):not(.neve-mega-menu) > li > .wrap > a { padding-top: 1px }&lt;/style&gt;&lt;style>.header-menu-sidebar .nav-ul li .wrap { padding: 0 4px; }.header-menu-sidebar .nav-ul li .wrap a { flex-grow: 1; display: flex; }.header-menu-sidebar .nav-ul li .wrap a .dd-title { width: var(--wrapdropdownwidth); }.header-menu-sidebar .nav-ul li .wrap button { border: 0; z-index: 1; background: 0; }.header-menu-sidebar .nav-ul li:not([class*=block]):not(.menu-item-has-children) > .wrap > a { padding-right: calc(1em + (18px*2));}&lt;/style&gt;
  291.  
  292.  
  293.  <main id="content" class="neve-main">
  294.  
  295. <div class=" container-fluid single-page-container">
  296.  <div class="row">
  297.     <div class="nv-single-page-wrap col">
  298.    <div class="nv-content-wrap entry-content">
  299. &lt;style&gt;
  300. /* Slider */
  301. body{
  302. height: 100%;
  303. margin: 0;
  304. padding: 0;
  305. }
  306. .wrapper{
  307.     width: 100%;
  308.     max-width: none;
  309.     padding: 0;
  310.     margin: 0 auto;
  311. }
  312. /* Hero Banner */
  313. #slider{
  314.     position: absolute;
  315.     z-index: -1;
  316.     min-width: 100vw;
  317.     height: 100vh;
  318.     margin: 0 0;
  319.     top: 0%;
  320.     background-color: black;
  321. }
  322. .bgSlides{
  323.     height: 100vh;
  324.     width: 100vw;
  325.     object-fit: cover;
  326.     margin: 0 auto;
  327.     text-align: center;
  328.     padding: 0;
  329. }
  330. .w3-animate-fading{
  331.     animation:fading 10s infinite
  332. }
  333.     @keyframes fading
  334.     {0%{opacity:0}5%{opacity:1}95%{opacity:1}100%{opacity:0}
  335. }
  336. .wrapped-caption{
  337.     position: absolute;
  338.     float: left;
  339.     left: inherit;
  340.     max-width: inherit;
  341.     top: -70%;
  342.     margin-left: 10vw;
  343. }
  344. .hero-caption{
  345.     font-size: 4vmax;
  346.     color: white;
  347.     font-weight: 400;
  348.     line-height: 5vmax;
  349.     float:left;
  350.     margin-top: 20px;
  351. }
  352. .hero-copywriting {
  353.     font-size: 25px;
  354.     color: white;
  355.     font-weight: 400;
  356.     float: left;
  357.     margin-top: 20px;
  358.     line-height: 2.3vmax;
  359.     width: 80%;
  360. }
  361. .hero-highlight{
  362.     font-size: 4vmax;
  363.     line-height: 5vmax;
  364.     color: white;
  365.     font-weight: 700;
  366.     float:left;
  367.     top: 50%;
  368. }
  369. /* Button Contact Now */
  370. .btn-contact a{  
  371.     z-index: 1;
  372.     float: left;
  373.     left: inherit;
  374.     margin-left: 10vw;
  375.     margin-top: 420px;
  376.     padding: 10px 20px;
  377.     border-radius: 30px;
  378.     color: white;
  379.     background-color: #18bd57;
  380.     font-size: 25px;
  381.     font-weight: 700;
  382. }
  383. /* Button for Choosing Slider */
  384. .btn-holder-container {
  385.     width: 100%;
  386.     margin: 0 auto;
  387.     text-align: center;
  388. }
  389. .btn-holder{
  390.     width: 30%;
  391.     margin: 0 auto;
  392.     display: flex;
  393.     flex-flow: row wrap;
  394.     float: left;
  395.     left: 0;
  396.     right: 0;
  397.     position: absolute;
  398.     top: 85vh;
  399.     text-align: center;
  400. }
  401. .w3-badge{
  402.     width: 30px;
  403.     height: 30px;
  404.     border-radius: 50%;
  405.     cursor: pointer;
  406.     background-color: white;
  407.     opacity: 70%;
  408.     text-align: center;
  409.     margin: 0 auto;
  410.     font-size: 15px;
  411.     line-height: 28px;
  412.     color: gray;
  413. }
  414.  
  415. @media only screen and (max-width: 500px) {
  416.     .wrapped-caption{
  417.         top: -82%;
  418. }
  419.     .hero-caption {
  420.         font-size: 30px;
  421.         line-height: 35px;
  422.         font-weight: 400;
  423.         width: 80%;
  424.         margin: 0 auto;
  425. }
  426.     .hero-highlight {
  427.         font-size: 30px;
  428.         line-height: 35px;
  429.         font-weight: 700;
  430.         width: 80%;
  431.         margin: 0 auto;
  432. }
  433.      .hero-copywriting {
  434.         font-size: 18px;
  435.         line-height: 20px;
  436.         width: 80%;
  437.         margin: 20px auto;
  438. }
  439.      .btn-contact a{
  440.         margin-top: 400px;
  441.         font-size: 20px;
  442. }
  443.      .btn-holder{
  444.         width: 50%;
  445. }
  446.      .w3-badge{
  447.         width: 30px;
  448.         height: 30px;
  449. }
  450. }
  451. @media only screen and (max-width: 1025px) and (min-width: 799px) {
  452.     .hero-caption {
  453.         font-size: 35px;
  454.         line-height: 40px;
  455.         font-weight: 400;
  456.         width: 85%;
  457.         margin: 0 auto;
  458. }
  459.     .hero-highlight {
  460.         font-size: 35px;
  461.         line-height: 40px;
  462.         font-weight: 700;
  463.         width: 85%;
  464.         margin: 0 auto;
  465. }
  466.      .hero-copywriting {
  467.         font-size: 18px;
  468.         line-height: 25px;
  469.         width: 85%;
  470.         margin: 20px auto;
  471. }
  472.     .btn-contact a{
  473.         margin-top: 600px;
  474.         font-size: 25px;
  475. }
  476.     .hero-copywriting {
  477.         font-size: 25px;
  478. }
  479. }
  480.  
  481. @media only screen and (min-width: 1919px) {
  482.     .btn-contact a{
  483.         margin-top: 600px;
  484.         font-size: 25px;
  485. }
  486.     .hero-copywriting {
  487.         font-size: 25px;
  488. }
  489. }
  490. @media only screen and (min-width: 3839px) {
  491.     .btn-contact a{
  492.         margin-top: 1200px;
  493.         font-size: 50px;
  494.         padding: 50px;
  495.         border-radius: 80px;
  496. }
  497.     .hero-copywriting {
  498.         font-size: 45px;
  499. }
  500. &lt;/style&gt;
  501.  
  502. &lt;body&gt;
  503. <section id="slider">
  504.       <div class="mySlides w3-animate-fading">
  505.         <img decoding="async" class="bgSlides" src="https://i.ibb.co/Hx8j8VJ/image.png" />
  506.         <div class="wrapper">
  507.           <div class="wrapped-caption">
  508.             <div class="hero-caption">Dare to say your company have</div>
  509.             <div class="hero-highlight">100% sustainable processes?</div>
  510.             <div class="hero-copywriting">
  511.               <strong>Center for Sustainability and Waste Management Universitas Indonesia</strong> is
  512.               working with you to find the best solution for sustainability and
  513.               waste management
  514.             </div>
  515.            
  516.           </div>
  517.         </div>
  518.       </div>
  519.       <div class="mySlides w3-animate-fading">
  520.         <img decoding="async" class="bgSlides" src="https://i.ibb.co/bshTDCf/image.png" />
  521.         <div class="wrapper">
  522.           <div class="wrapped-caption">
  523.             <div class="hero-caption">Dare to say your company is using</div>
  524.             <div class="hero-highlight">100% sustainable materials?</div>
  525.             <div class="hero-copywriting">
  526.               <strong>Center for Sustainability and Waste Management Universitas Indonesia</strong> is
  527.               working with you to find the best solution for sustainability and
  528.               waste management
  529.             </div>
  530.           </div>
  531.         </div>
  532.       </div>
  533.       <div class="mySlides w3-animate-fading">
  534.         <img decoding="async" class="bgSlides" src="https://i.ibb.co/D8n4jjn/image.png" />
  535.         <div class="wrapper">
  536.           <div class="wrapped-caption">
  537.             <div class="hero-caption">
  538.               Dare to say your company is implementing
  539.             </div>
  540.             <div class="hero-highlight">circular economy?</div>
  541.             <div class="hero-copywriting">
  542.               <strong>Center for Sustainability and Waste Management Universitas Indonesia</strong> is
  543.               working with you to find the best solution for sustainability and
  544.               waste management
  545.             </div>
  546.           </div>
  547.         </div>
  548.       </div>
  549. <div class="mySlides w3-animate-fading">
  550.         <img decoding="async" class="bgSlides" src="https://i.ibb.co/QDC6R1Z/image.png" />
  551.         <div class="wrapper">
  552.           <div class="wrapped-caption">
  553.             <div class="hero-caption">
  554.               Dare to say your company is using
  555.             </div>
  556.             <div class="hero-highlight">100% renewable energy?</div>
  557.             <div class="hero-copywriting">
  558.               <strong>Center for Sustainability and Waste Management Universitas Indonesia</strong> is
  559.               working with you to find the best solution for sustainability and
  560.               waste management
  561.             </div>
  562.  
  563.           </div>
  564.         </div>
  565.       </div>
  566. <div class="mySlides w3-animate-fading">
  567.         <img decoding="async" class="bgSlides" src="https://i.ibb.co/19v1nM7/image.png" />
  568.         <div class="wrapper">
  569.           <div class="wrapped-caption">
  570.             <div class="hero-caption">
  571.               Dare to say your company have
  572.             </div>
  573.             <div class="hero-highlight">the suitable CSR?</div>
  574.             <div class="hero-copywriting">
  575.               <strong>Center for Sustainability and Waste Management</strong> is
  576.               working with you to find the best solution for sustainability and
  577.               waste management
  578.             </div>
  579.           </div>
  580.         </div>
  581.       </div>
  582.  
  583. [removed]
  584.         var slideIndex = 0;
  585.         carousel();
  586.  
  587.         function carousel() {
  588.           var i;
  589.           var x = document.getElementsByClassName("mySlides");
  590.           for (i = 0; i < x.length; i++) {
  591.             x[i].style.display = "none";
  592.           }
  593.           slideIndex++;
  594.           if (slideIndex > x.length) {
  595.             slideIndex = 1;
  596.           }
  597.           x[slideIndex - 1].style.display = "block";
  598.           setTimeout(carousel, 10000); // Change image every 5 seconds
  599.         }
  600.       [removed]
  601.       [removed]
  602.         var slideIndex = 1;
  603.         showDivs(slideIndex);
  604.  
  605.         function plusDivs(n) {
  606.           showDivs((slideIndex += n));
  607.         }
  608.  
  609.         function currentDiv(n) {
  610.           showDivs((slideIndex = n));
  611.         }
  612.  
  613.         function showDivs(n) {
  614.           var i;
  615.           var x = document.getElementsByClassName("mySlides");
  616.           var dots = document.getElementsByClassName("demo");
  617.           if (n > x.length) {
  618.             slideIndex = 1;
  619.           }
  620.           if (n < 1) {
  621.             slideIndex = x.length;
  622.           }
  623.           for (i = 0; i < x.length; i++) {
  624.             x[i].style.display = "none";
  625.           }
  626.           for (i = 0; i < dots.length; i++) {
  627.             dots[i].className = dots[i].className.replace(" w3-white", "");
  628.           }
  629.           x[slideIndex - 1].style.display = "block";
  630.           dots[slideIndex - 1].className += " w3-white";
  631.         }
  632.       [removed]
  633.     </div>
  634. <div class="btn-contact"><a href="http://cswmui.com/contact/">Contact now</a></div>
  635. <div class="btn-holder-container">      
  636.       <div class="btn-holder">
  637.         <span class="w3-badge demo" ></span>
  638.         <span class="w3-badge demo" ></span>
  639.         <span class="w3-badge demo" ></span>
  640.         <span class="w3-badge demo" ></span>
  641.         <span class="w3-badge demo" ></span>
  642.       </div>
  643.  
  644. </section>
  645.  
  646. &lt;/body&gt;
  647.  
  648.  
  649.  
  650. &lt;style&gt;
  651. .today {
  652.     position: relative;
  653.     width: 60%;
  654.     font-size: 2.5vmax;
  655.     line-height: 3vmax;
  656.     margin-top: 700px;
  657.     text-align: left;
  658.     margin-left:auto;
  659.     margin-right:auto;
  660.     background-color: white;
  661.     padding: 0;
  662. }
  663. .affiliation {
  664.     margin: 25px auto;
  665.     font-size: 1.5vmax;
  666.     line-height: 2.1vmax;
  667.     width: 60%;
  668.     text-align: left;
  669. }
  670. .synergy {
  671.     margin: 25px auto;
  672.     width: 60%;
  673.     font-size: 1.5vmax;
  674.     font-weight: 700;
  675.     text-align: left;
  676. }
  677. .btn-about-cswm {
  678. width: 60%;
  679. margin: 0 auto;
  680. }
  681. .btn-about-cswm a{
  682.     margin: 40px auto;
  683.     padding: 10px 20px;
  684.     border-radius: 30px;
  685.     color: white;
  686.     background-color: #1364b2;
  687.     font-size: 1.5vmax;
  688.     font-weight: 700;
  689.     float: left;
  690.     text-decoration: none;
  691. }
  692. @media screen and (max-width: 500px) {
  693.     .today {
  694.        margin-top: 210%;
  695.        width: 80%;
  696. }
  697. .affiliation {
  698.     font-size: 16px;
  699.     line-height: 22px;
  700.     width: 80%;
  701. }
  702. .synergy {
  703.     width: 80%;
  704.     font-size: 16px;
  705. }
  706. .btn-about-cswm {
  707. width: 80%;
  708. }
  709. .btn-about-cswm a{
  710. font-size: 16px;
  711. }
  712. }
  713. @media screen and (max-width: 830px) and (min-width: 799px) {
  714.     .today {
  715.        margin-top: 1100px;
  716. }
  717. }
  718. @media screen and (max-width: 1025px) and (min-width: 831px) {
  719.     .today {
  720.        margin-top: 1300px;
  721. }
  722. }
  723. @media screen and (min-width: 1919px) {
  724.     .today {
  725.        margin-top: 1050px;
  726. }
  727. }
  728. @media screen and (min-width: 3839px) {
  729.     .today {
  730.        margin-top: 2150px;
  731. }
  732. }
  733. &lt;/style&gt;
  734. <div class="today"><strong>Today's</strong> landscape has been more complex and interconnected. Imagine <strong>tomorrow's.</strong></div>
  735.  <div class="affiliation">
  736.           Under the affiliation of
  737.           <a
  738.             href="">Universitas Indonesia</a
  739.           >, CSWM UI comprises an expert board from
  740.           <strong>multidisciplinary fields</strong> that enables us to approach
  741.           sustainabilities and waste management issues effectively from various
  742.           perspectives. </div>
  743. <div class="affiliation">
  744. We promote sustainability, waste management, and the circular economy
  745.           via creative research and development, education,and engagement with
  746.           business, government, and community partners.
  747.         </div>
  748. <div class="synergy">
  749.             <strong>Building Synergy, Inspiring Indonesia.</strong>
  750.           </div>
  751. <div class="btn-about-cswm"><a href="https://cswm.ui.ac.id/about/">About CSWM UI</a></div>
  752.  
  753.  
  754.  
  755. &lt;style&gt;
  756. /* Pilar */
  757. @import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;500;700&family=Plus+Jakarta+Sans:wght@300;400;700;800&display=swap');
  758. .outer-container2 {
  759.     display: flex;
  760.     z-index: -999;
  761.     flex-flow: row wrap;
  762.     padding: 0;
  763.     margin-top: 0px;
  764.     background: #1BA253;
  765.     height: auto;
  766.     text-align: center;
  767.     width: 100%;
  768. }
  769.  
  770. .inner-column {
  771.     padding-top: 30px;
  772.     width: 20%;
  773.     height: 350px;
  774.     color: white;
  775.     text-align: center;
  776.     margin: 0 auto;
  777. }
  778.  
  779. .inner-column p {
  780.     width: 75%;
  781.     margin: 30px auto;
  782.     font-size: 15px;
  783.     line-height: 20px;
  784. }
  785.  
  786. .letter {
  787.     font-size: 36pt;
  788.     margin-top: 20px;
  789. }
  790.  
  791. .explanation {
  792.     font-weight: 700;
  793.     font-size: 20pt;
  794.     margin-top: 30px;
  795. }
  796. @media screen and (max-width: 1000px) {
  797. .outer-container2 {
  798. top: 35vh;
  799. flex-flow: column wrap;
  800. }
  801. .inner-column {
  802. width: 100%;
  803. height: auto;
  804. }
  805. }
  806. &lt;/style&gt;
  807.  
  808. <div class="outer-container2"  #18bd57">
  809.         <div class="inner-column">
  810.           <div class="letter">P</div>
  811.           <div class="explanation">Partnership</div>
  812.           <p>
  813.             We believe in fostering collaborative relationships to amplify our
  814.             impact and drive positive change in sustainability and waste
  815.             management.
  816.           </p>
  817.         </div>
  818.         <div class="inner-column"  #33cc99">
  819.           <div class="letter">I</div>
  820.           <div class="explanation">Inspiration</div>
  821.           <p>
  822.             We aim to ignite a sense of purpose and motivation, spurring
  823.             individuals and communities to embrace sustainable practices and
  824.             advocate for a greener future.
  825.           </p>
  826.         </div>
  827.         <div class="inner-column"  #15907c">
  828.           <div class="letter">L</div>
  829.           <div class="explanation">Learning</div>
  830.           <p>
  831.             Continuous education and awareness-building are at the core of our
  832.             approach, empowering people with the knowledge to make informed
  833.             decisions for sustainable living.
  834.           </p>
  835.         </div>
  836.         <div class="inner-column"  #10658c">
  837.           <div class="letter">A</div>
  838.           <div class="explanation">Action</div>
  839.           <p>
  840.             We are committed to translating ideas and intentions into concrete
  841.             actions that make a tangible difference in promoting environmental
  842.             responsibility and waste reduction.
  843.           </p>
  844.         </div>
  845.         <div class="inner-column"  #1364b2">
  846.           <div class="letter">R</div>
  847.           <div class="explanation">Resilience</div>
  848.           <p>
  849.             In the face of challenges and setbacks, we strive to adapt, endure,
  850.             and thrive, ensuring our efforts contribute to lasting and impactful
  851.             sustainability solutions.
  852.           </p>
  853.         </div>
  854.       </div>
  855.  
  856.  
  857.  
  858. &lt;style&gt;
  859. @import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;500;700&family=Plus+Jakarta+Sans:wght@300;400;700;800&display=swap');
  860. .outer-partner-cont {
  861.    width: 100%;
  862.  
  863.  
  864. }
  865. .partner-container {
  866.    width: 80%;
  867.    display: flex;
  868.    flex-flow: row wrap;
  869.    margin: 0 auto;
  870.    height: 220px;
  871.    padding: 0;
  872. }
  873. .partner-left {
  874. width: 50%;
  875. font-size: 45px;
  876. line-height: 50px;
  877. font-weight: 700;
  878. text-align: right;
  879. margin: auto auto;
  880. color: #1364b2;
  881. }
  882. .partner-right {
  883. width: 50%;
  884. font-size: 18px;
  885. text-align: left;
  886. margin: auto auto;
  887. padding-top: 35px;
  888. padding-bottom: 35px;
  889. padding-left: 20px;
  890. padding-right: 100px;
  891. color: #15907c;
  892. }
  893.  
  894. @media screen and (max-width: 700px) {
  895.  
  896. .partner-container {
  897. flex-flow: column;
  898. height: auto;
  899. }
  900. .partner-left {
  901. width: 100%;
  902. font-size: 35px;
  903. text-align: center;
  904. padding-top: 40px;
  905. padding-bottom: 30px;
  906. }
  907. .partner-right {
  908. width: 90%;
  909. text-align: center;
  910. font-size: 15px;
  911. padding-top: 0;
  912. padding-bottom: 30px;
  913. padding-left: 30px;
  914. padding-right: 30px;
  915. margin-bottom: 40px;
  916. }
  917. }
  918. &lt;/style&gt;
  919. <div class="outer-partner-cont">
  920. <div class="partner-container">
  921.  <div class="partner-left">Partner with us.</div>
  922.  <div class="partner-right">We collaborate with government, communities, NGO, change-makers, and leading researchers to move towards sustainable future and waste management.</div>
  923. </div>
  924. </div>
  925.  
  926.  
  927.  
  928. &lt;style&gt;
  929. @import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;500;700&family=Plus+Jakarta+Sans:wght@300;400;700;800&display=swap');
  930. * {
  931.     box-sizing: border-box;
  932.     -webkit-box-sizing: border-box;
  933. }
  934.  
  935. html,
  936. body {
  937.     height: 100%;
  938. }
  939. body {
  940.     margin: 0;
  941.     font: 16px/1.3;
  942.     font-family: 'Plus Jakarta Sans';
  943. }
  944. /*
  945. PURE RESPONSIVE CSS3 SLIDESHOW GALLERY by Roko C. buljan
  946. http://stackoverflow.com/a/34696029/383904
  947. */
  948.  
  949. .CSSgal {
  950.     overflow: hidden;
  951.     height: 630px;
  952.     padding: 0;
  953.     position: relative;
  954.  
  955.     /* Or set a fixed height */
  956. }
  957.  
  958. /* SLIDER */
  959.  
  960. .CSSgal .slider {
  961.     height: 100%;
  962.     white-space: nowrap;
  963.     font-size: 0;
  964.     transition: 0.8s;
  965. }
  966.  
  967. /* SLIDES */
  968.  
  969. .CSSgal .slider>* {
  970.     font-size: 1rem;
  971.     display: inline-block;
  972.     white-space: normal;
  973.     vertical-align: top;
  974.     height: 100%;
  975.     width: 100%;
  976.     background: none 50% no-repeat;
  977.     background-size: cover;
  978. }
  979.  
  980. /* PREV/NEXT, CONTAINERS & ANCHORS */
  981.  
  982. .CSSgal .prevNext {
  983.     position: absolute;
  984.     top: 50%;
  985.     z-index: 1;
  986.     width: 100%;
  987.     height: 0;
  988.     margin: 0 auto;
  989. }
  990.  
  991. .CSSgal .prevNext>div+div {
  992.     visibility: hidden;
  993.     /* Hide all but first P/N container */
  994. }
  995.  
  996. .CSSgal .prevNext a {
  997.     background: #fff;
  998.     position: absolute;
  999.     width: 50px;
  1000.     height: 50px;
  1001.     line-height: 60px;
  1002.     /* If you want to place numbers */
  1003.     text-align: center;
  1004.     opacity: 0.7;
  1005.     -webkit-transition: 0.3s;
  1006.     transition: 0.3s;
  1007.     -webkit-transform: translateY(-50%);
  1008.     transform: translateY(-50%);
  1009.     left: 0;
  1010. }
  1011.  
  1012. .CSSgal .prevNext a:hover {
  1013.     opacity: 1;
  1014. }
  1015.  
  1016. .CSSgal .prevNext a+a {
  1017.     left: auto;
  1018.     right: 0;
  1019. }
  1020.  
  1021. /* NAVIGATION */
  1022.  
  1023. .CSSgal .bullets {
  1024.     position: absolute;
  1025.     z-index: 2;
  1026.     bottom: 50px;
  1027.     padding: 10px 0;
  1028.     width: 100%;
  1029.     text-align: center;
  1030. }
  1031.  
  1032. .CSSgal .bullets>a {
  1033.     display: inline-block;
  1034.     width: 30px;
  1035.     height: 30px;
  1036.     line-height: 30px;
  1037.     text-decoration: none;
  1038.     text-align: center;
  1039.     background: rgba(255, 255, 255, 1);
  1040.     -webkit-transition: 0.3s;
  1041.     transition: 0.3s;
  1042. }
  1043.  
  1044. .CSSgal .bullets>a+a {
  1045.     background: rgba(255, 255, 255, 0.5);
  1046.     /* Dim all but first */
  1047. }
  1048.  
  1049. .CSSgal .bullets>a:hover {
  1050.     background: rgba(255, 255, 255, 0.7) !important;
  1051. }
  1052.  
  1053. /* NAVIGATION BUTTONS */
  1054. /* ALL: */
  1055. .CSSgal>s:target~.bullets>* {
  1056.     background: rgba(255, 255, 255, 0.5);
  1057. }
  1058.  
  1059. /* ACTIVE */
  1060. #s1:target~.bullets>*:nth-child(1) {
  1061.     background: #1aa353;
  1062. }
  1063.  
  1064. #s2:target~.bullets>*:nth-child(2) {
  1065.     background: #1aa353;
  1066. }
  1067.  
  1068. #s3:target~.bullets>*:nth-child(3) {
  1069.     background: #1aa353;
  1070. }
  1071.  
  1072. #s4:target~.bullets>*:nth-child(4) {
  1073.     background: rgba(255, 255, 255, 1);
  1074. }
  1075.  
  1076. /* More slides? Add here more rules */
  1077.  
  1078. /* PREV/NEXT CONTAINERS VISIBILITY */
  1079. /* ALL: */
  1080. .CSSgal>s:target~.prevNext>* {
  1081.     visibility: hidden;
  1082. }
  1083.  
  1084. /* ACTIVE: */
  1085. #s1:target~.prevNext>*:nth-child(1) {
  1086.     visibility: visible;
  1087. }
  1088.  
  1089. #s2:target~.prevNext>*:nth-child(2) {
  1090.     visibility: visible;
  1091. }
  1092.  
  1093. #s3:target~.prevNext>*:nth-child(3) {
  1094.     visibility: visible;
  1095. }
  1096.  
  1097. #s4:target~.prevNext>*:nth-child(4) {
  1098.     visibility: visible;
  1099. }
  1100.  
  1101. /* More slides? Add here more rules */
  1102.  
  1103. /* SLIDER ANIMATION POSITIONS */
  1104.  
  1105. #s1:target~.slider {
  1106.     transform: translateX(0%);
  1107.     -webkit-transform: translateX(0%);
  1108. }
  1109.  
  1110. #s2:target~.slider {
  1111.     transform: translateX(-100%);
  1112.     -webkit-transform: translateX(-100%);
  1113. }
  1114.  
  1115. #s3:target~.slider {
  1116.     transform: translateX(-200%);
  1117.     -webkit-transform: translateX(-200%);
  1118. }
  1119.  
  1120. #s4:target~.slider {
  1121.     transform: translateX(-300%);
  1122.     -webkit-transform: translateX(-300%);
  1123. }
  1124.  
  1125. /* More slides? Add here more rules */
  1126.  
  1127.  
  1128. /* YOU'RE THE DESIGNER!
  1129.    ____________________
  1130.    All above was mainly to get it working :)
  1131.    CSSgal CUSTOM STYLES / OVERRIDES HERE: */
  1132.  
  1133. .CSSgal {
  1134.     color: #fff;
  1135.     text-align: center;
  1136. }
  1137.  
  1138. .CSSgal .slider h2 {
  1139.     margin-top: 40vh;
  1140.     font-weight: 200;
  1141.     letter-spacing: -0.06em;
  1142.     word-spacing: 0.2em;
  1143.     font-size: 3em;
  1144. }
  1145.  
  1146. .CSSgal a {
  1147.     border-radius: 50%;
  1148.     margin: 0 3px;
  1149.     color: rgba(0, 0, 0, 0.8);
  1150.     text-decoration: none;
  1151. }
  1152.  
  1153. .slider-box {
  1154.     background-color: white;
  1155.     opacity: 80%;
  1156.     width: 30%;
  1157.     padding-top: 10px;
  1158.     padding-left: 30px;
  1159.     padding-right: 30px;
  1160.     padding-bottom: 40px;
  1161.     border-radius: 20px;
  1162.     text-align: left;
  1163.     margin-left: 30vh;
  1164.     margin-top: 10vh;
  1165.     height: auto;
  1166. }
  1167.  
  1168. .slider-box h1 {
  1169.     color:#15907c;
  1170.     font-family: 'Plus Jakarta Sans';
  1171.     font-size: 35px;
  1172.     padding-top: 10px;
  1173.     margin-bottom: 10px;
  1174. }
  1175.  
  1176. .slider-box p {
  1177.     color: black;
  1178.     padding: 0;
  1179.     margin-top: 0;
  1180.     margin-bottom: 20px;
  1181. }
  1182.  
  1183. .slider-box a {
  1184.     padding: 5px 15px;
  1185.     background-color: #1aa353;
  1186.     border-radius: 20px;
  1187.     color: white;
  1188.     margin-bottom: 30px;
  1189. }
  1190.  
  1191. @media screen and (max-width: 700px){
  1192. .slider-box {
  1193.         width: 65%;
  1194.         margin-left: 5vh;
  1195.         margin-top: 8vh;
  1196. }
  1197. .slider-box h1 {
  1198.     font-size: 25px;
  1199.     padding-top: 10px;
  1200.     margin-bottom: 10px;
  1201. }
  1202.  
  1203. .slider-box p {
  1204.     color: black;
  1205.     padding: 0;
  1206.     margin-top: 0;
  1207.     margin-bottom: 20px;
  1208. font-size: 15px;
  1209. }
  1210. }
  1211. &lt;/style&gt;
  1212.   <div class="CSSgal">
  1213.     &lt;!-- Don't wrap targets in parent --&gt;
  1214.     <s id="s1"></s>
  1215.     <s id="s2"></s>
  1216.     <s id="s3"></s>
  1217.     <s id="s4"></s>
  1218.  
  1219.     <div class="slider">
  1220.       <div  url('https://i.ibb.co/q1ZZKj8/image.png')">
  1221.         <div class="slider-box">
  1222.           <h1>Studies</h1>
  1223.           <p>
  1224.             CSWM UI provides a range of research and studies focused on
  1225.             sustainable systems, waste management, feasibility, material flow
  1226.             analysis and other aspects of your needs.
  1227.           </p>
  1228.           <a href="">See more</a>
  1229.         </div>
  1230.       </div>
  1231.       <div  url('https://i.ibb.co/5MPxqDL/image.png')">
  1232.         <div class="slider-box">
  1233.           <h1>Consultancies</h1>
  1234.           <p>
  1235.             CSWM UI provides tailored engineering, economic and social guidance
  1236.             to help organization reaching their 3P (Profit, People, Planet)
  1237.             goals.
  1238.           </p>
  1239.           <a href="">See more</a>
  1240.         </div>
  1241.       </div>
  1242.       <div  url('https://i.ibb.co/wdvMNym/image.png')">
  1243.         <div class="slider-box">
  1244.           <h1>Education</h1>
  1245.           <p>
  1246.             CSWM UI experts in designing education services to provide certified
  1247.             training, campaign to increase awareness, and promote behavior
  1248.             changes.
  1249.           </p>
  1250.           <a href="">See more</a>
  1251.         </div>
  1252.       </div>
  1253.     </div>
  1254.  
  1255.     <div class="prevNext">
  1256.       <div><a href="#s3"></a><a href="#s2"></a></div>
  1257.       <div><a href="#s1"></a><a href="#s3"></a></div>
  1258.       <div><a href="#s2"></a><a href="#s1"></a></div>
  1259.     </div>
  1260.  
  1261.     <div class="bullets">
  1262.       <a href="#s1">1</a>
  1263.       <a href="#s2">2</a>
  1264.       <a href="#s3">3</a>
  1265.     </div>
  1266.   </div>
  1267.  
  1268.  
  1269.  
  1270. &lt;style&gt;
  1271. @import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;500;700&family=Plus+Jakarta+Sans:wght@300;400;700;800&display=swap');
  1272. .featured{
  1273.     width: 60%;
  1274.     text-align: justify;
  1275.     margin: 30px auto;
  1276.     font-size: 36pt;
  1277.     line-height: 36pt;
  1278.     font-weight: 700;
  1279. }
  1280. @media screen and (max-width: 700px) {
  1281. .featured{
  1282.     width: 80%;
  1283.     text-align: justify;
  1284.     margin: 20px auto;
  1285.     font-size: 25pt;
  1286.     line-height: 30pt;
  1287.     font-weight: 700;
  1288. }
  1289. }
  1290. &lt;/style&gt;
  1291. <div class="featured">Featured Reads</div>
  1292.  
  1293.  
  1294.  
  1295. &lt;style&gt;
  1296. @import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;500;700&family=Plus+Jakarta+Sans:wght@300;400;700;800&display=swap');
  1297. .news{
  1298.     width: 60%;
  1299.     text-align: justify;
  1300.     margin: 40px auto;
  1301.     font-size: 30pt;
  1302.     font-weight: 500;
  1303. }
  1304. @media screen and (max-width: 1000px) {
  1305. .news{
  1306.     width: 80%;
  1307.     text-align: justify;
  1308.     margin: 10px auto;
  1309.     font-size: 20pt;
  1310.     font-weight: 500;
  1311. }
  1312. }
  1313. &lt;/style&gt;
  1314. <div class="news">News</div>
  1315.  
  1316.  
  1317.  
  1318. &lt;style&gt;
  1319. .news-feat{
  1320.     width: 60%;
  1321.     display: flex;
  1322.     flex-flow: row;
  1323.     margin: 40px auto;
  1324. }
  1325. .news-excerpt {
  1326. width: 50%;
  1327. text-align: left;
  1328. }
  1329. .news-excerpt h1 {
  1330. color: #15907c;
  1331. font-size: 20px;
  1332. width: 80%;
  1333. }
  1334. .news-excerpt p {
  1335. font-size: 16px;
  1336. width: 90%;
  1337. }
  1338. .news-excerpt a {
  1339. color: #15907c;
  1340. }
  1341. .news-feat-image{
  1342. width: 50%;
  1343. text-align: left;
  1344. margin: auto;
  1345. max-height: 240px;
  1346. object-fit: contain;
  1347. overflow: hidden;
  1348. }
  1349. .news-feat-image img{
  1350. border-radius: 0px;
  1351. }
  1352. @media screen and (max-width: 700px) {
  1353. .news-feat{
  1354.     width: 80%;
  1355.     flex-flow: column;
  1356.     margin: 30px auto;
  1357. }
  1358. .news-excerpt {
  1359. width: 100%;
  1360. text-align: left;
  1361. }
  1362. .news-excerpt h1 {
  1363. font-size: 16px;
  1364. width: 100%;
  1365. }
  1366. .news-excerpt p {
  1367. font-size: 14px;
  1368. width: 100%;
  1369. }
  1370. .news-feat-image{
  1371. width: 100%;
  1372. text-align: left;
  1373. margin: auto;
  1374.  
  1375. }
  1376. }
  1377. &lt;/style&gt;
  1378.  
  1379. <div class="news-feat">
  1380. <div class="news-excerpt">
  1381. <a href="https://cswm.ui.ac.id/cswm-ui-joins-the-aliansi-ekonomi-sirkular-indonesia-aesi-to-synchronize-circular-economy-parties-2/"><h1>CSWM UI Joins the ‘Aliansi Ekonomi Sirkular Indonesia’ (AESI) to Synchronize Circular Economy Parties</h1></a>
  1382. <p>The Center for Sustainability and Waste Management at the University of Indonesia (CSWM UI) proudly announces its participation in the Aliansi Ekonomi Sirkular Indonesia (AESI). <a href="https://cswm.ui.ac.id/cswm-ui-joins-the-aliansi-ekonomi-sirkular-indonesia-aesi-to-synchronize-circular-economy-parties-2/">Read more</a></p>
  1383.  
  1384. </div>
  1385. <div class="news-feat-image">
  1386. <img decoding="async" src="https://i.ibb.co/m9dNGsL/image.png"/>
  1387. </div>
  1388. </div>
  1389.  
  1390.  
  1391.  
  1392. &lt;style&gt;
  1393. @import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;500;700&family=Plus+Jakarta+Sans:wght@300;400;700;800&display=swap');
  1394. .reads{
  1395.     width: 60%;
  1396.     text-align: justify;
  1397.     margin: 40px auto;
  1398.     font-size: 30pt;
  1399.     font-weight: 500;
  1400. }
  1401. @media screen and (max-width: 1000px) {
  1402. .reads{
  1403.     width: 80%;
  1404.     text-align: justify;
  1405.     margin: 10px auto;
  1406.     font-size: 20pt;
  1407.     font-weight: 500;
  1408. }
  1409. }
  1410. &lt;/style&gt;
  1411. <div class="reads">Reads</div>
  1412.  
  1413.  
  1414.  
  1415. &lt;style&gt;
  1416. .reads-feat{
  1417.     width: 60%;
  1418.     display: flex;
  1419.     flex-flow: row;
  1420.     margin: 40px auto;
  1421. }
  1422. .reads-excerpt {
  1423. width: 50%;
  1424. text-align: left;
  1425. }
  1426. .reads-excerpt h1 {
  1427. color: #15907c;
  1428. font-size: 20px;
  1429. width: 80%;
  1430. }
  1431. .reads-excerpt p {
  1432. font-size: 16px;
  1433. width: 90%;
  1434. }
  1435. .reads-excerpt a {
  1436. color: #15907c;
  1437. }
  1438. .reads-feat-image{
  1439. width: 50%;
  1440. text-align: left;
  1441. margin: 0 auto;
  1442. max-height: 240px;
  1443. object-fit: contain;
  1444. overflow: hidden;
  1445. }
  1446. .reads-feat-image img{
  1447. border-radius: 0px;
  1448.  
  1449.  
  1450. }
  1451. @media screen and (max-width: 700px) {
  1452. .reads-feat{
  1453.     width: 80%;
  1454.     flex-flow: column;
  1455.     margin: 30px auto;
  1456. }
  1457. .reads-excerpt {
  1458. width: 100%;
  1459. text-align: left;
  1460. }
  1461. .reads-excerpt h1 {
  1462. font-size: 16px;
  1463. width: 100%;
  1464. }
  1465. .reads-excerpt p {
  1466. font-size: 14px;
  1467. width: 100%;
  1468. }
  1469. .reads-feat-image{
  1470. width: 100%;
  1471. text-align: left;
  1472. margin: auto;
  1473.  
  1474. }
  1475. }
  1476. &lt;/style&gt;
  1477.  
  1478. <div class="reads-feat">
  1479. <div class="reads-excerpt">
  1480. <a href="https://cswm.ui.ac.id/design-duplication-delivery-the-fast-fashion-lifecycle-2/"><h1>Design, Duplication, Delivery: The Fast Fashion Lifecycle</h1></a>
  1481. <p>Fast Fashion industries have not only transformed the fashion business but also significantly affecting the way we shop, dress, and perceive clothing. These industries contribute to carbon emissions because once the garments are manufactured, they need to be transported to the brand’s distribution centers and stores around the world. <a href="https://cswm.ui.ac.id/design-duplication-delivery-the-fast-fashion-lifecycle-2/">Read more</a></p>
  1482.  
  1483. </div>
  1484. <div class="reads-feat-image">
  1485. <img decoding="async" src="https://i.ibb.co/cX7hVD4/image.png"/>
  1486. </div>
  1487. </div>
  1488.  
  1489.  
  1490.  
  1491. &lt;style&gt;
  1492. @import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;500;700&family=Plus+Jakarta+Sans:wght@300;400;700;800&display=swap');
  1493. .publication{
  1494.     width: 60%;
  1495.     text-align: justify;
  1496.     margin: 40px auto;
  1497.     font-size: 30pt;
  1498.     font-weight: 500;
  1499. }
  1500. @media screen and (max-width: 1000px) {
  1501. .publication{
  1502.     width: 80%;
  1503.     text-align: justify;
  1504.     margin: 10px auto;
  1505.     font-size: 20pt;
  1506.     font-weight: 500;
  1507. }
  1508. }
  1509. &lt;/style&gt;
  1510.  
  1511. &lt;!--<div class="publication">Publications</div>--&gt;
  1512.  
  1513.  
  1514.  
  1515. &lt;style&gt;
  1516. @import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;500;700&family=Plus+Jakarta+Sans:wght@300;400;700;800&display=swap');
  1517. .collaborate-container {
  1518.    background-image: url('https://i.ibb.co/9ghy146/image.png');
  1519.    background-size: cover;
  1520.    min-height: 340px;
  1521.    z-index: 999;
  1522. }
  1523. .collaborate h1{
  1524.     font-family: 'Plus Jakarta Sans';
  1525.     color: white;
  1526.     width: 100%;
  1527.     text-align: left;
  1528.     padding-top: 100px;
  1529.     margin-left: 20vw;
  1530.     font-size: 50px;
  1531.     line-height: 60px;
  1532.     font-weight: 700;
  1533. }
  1534. .collaborate a{
  1535.     background-color: #1364b2;
  1536.     margin-left: 20vw;
  1537.     padding: 5px 20px;
  1538.     border-radius: 50px;
  1539.     color: white;
  1540.     font-size: 20px;
  1541.     line-height: 30px;
  1542.     font-weight: 700;
  1543.     float: left;
  1544.     text-decoration: none;
  1545. }
  1546. @media screen and (max-width: 700px) {
  1547. .collaborate-container{
  1548.     top: 85vh;
  1549. }
  1550. .collaborate {
  1551. width: 80%;
  1552. margin: auto;
  1553. }
  1554. .collaborate h1{
  1555.     width: 100%;
  1556.     text-align: left;
  1557.     padding-top: 80px;
  1558.     margin-left: auto;
  1559.     font-size: 45px;
  1560.     line-height: 55px;
  1561.     font-weight: 700;
  1562. }
  1563. .collaborate a{
  1564.     font-size: 15px;
  1565.     line-height: 15px;
  1566.     padding: 10px 20px;
  1567.     border-radius: 20px;
  1568.     margin-left: auto;
  1569. }
  1570. }
  1571. &lt;/style&gt;
  1572. <div class="collaborate-container">
  1573. <div class="collaborate">
  1574. <h1>Collaborate with us now.</h1>
  1575. <a href="https://cswm.ui.ac.id/contact/">Let's get started</a>
  1576. </div>
  1577. </div>
  1578.  
  1579.  
  1580.  
  1581. &lt;style&gt;
  1582. .prnts-container {
  1583. width: 100vw;
  1584. position: relative;
  1585. margin: 0;
  1586. }
  1587. .ftr-container-2 {
  1588. min-width:100vw;
  1589. min-height:100px;
  1590. position: relative;
  1591. background: linear-gradient(150deg, rgba(26, 163, 83, 1) 0%, rgba(20, 100, 180, 1) 100%);
  1592. display: flex;
  1593. flex-flow: column;
  1594. text-align: left;
  1595. }
  1596. .first-row-ftr {
  1597. display: flex;
  1598. flex-flow: row;
  1599. margin-left: 20vw;
  1600. min-height: auto;
  1601. }
  1602. .col-one, .col-two {
  1603. width: 25%;
  1604. padding-top: 20px;
  1605. }
  1606. .col-three {
  1607. width: 40%;
  1608. padding: 20px;
  1609. height: auto;
  1610. }
  1611. .col-one h1, .col-two h1, .col-three h1 {
  1612. font-size: 36px;
  1613. font-weight: 700;
  1614. color: white;
  1615. }
  1616. .col-one p, .col-two p {
  1617. font-size: 16px;
  1618. line-height: 25px;
  1619. color: white;
  1620. margin-bottom: 0;
  1621. width: 90%;
  1622. }
  1623. .col-three p {
  1624. font-size: 16px;
  1625. line-height: 25px;
  1626. color: white;
  1627. padding-bottom: 20px;
  1628. width: 80%;
  1629. }
  1630. .col-two a {
  1631. text-decoration: none;
  1632. }
  1633. .col-three a {
  1634. font-size: 30px;
  1635. font-weight: 700;
  1636. color: #1464b4;
  1637. padding: 10px 20px;
  1638. margin-top: 40px;
  1639. border-radius: 30px;
  1640. background-color: white;
  1641. box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  1642. text-decoration: none;
  1643. }
  1644. .second-row-ftr {
  1645. width: 100%;
  1646. margin-left: 20vw;
  1647. }
  1648. .second-row-ftr h1 {
  1649. font-size: 36px;
  1650. font-weight: 700;
  1651. color: white;
  1652. }
  1653. .second-row-ftr img {
  1654. width: 40px;
  1655. padding-bottom: 20px;
  1656. margin-right: 10px;
  1657. }
  1658. .ftr-container-3 {
  1659. min-width:100vw;
  1660. min-height:100px;
  1661. display: flex;
  1662. flex-flow: row;
  1663. background-color: #10658c;
  1664. }
  1665.  
  1666. .tagline {
  1667. width: 50%;
  1668. margin-left: 20vw;
  1669. }
  1670. .tagline h1{
  1671. font-size: 15px;
  1672. font-weight: 700;
  1673. margin-top: auto;
  1674. margin-bottom: auto;
  1675. text-align: left;
  1676. color: white;
  1677. padding-top: 20px;
  1678. padding-bottom: 20px;
  1679. }
  1680. .copyright{
  1681. width: 50%;
  1682. }
  1683. .copyright h1{
  1684. font-size: 15px;
  1685. font-weight: 500;
  1686. margin-top: auto;
  1687. margin-bottom: auto;
  1688. padding: 20px;
  1689. text-align: left;
  1690. color: white;
  1691. }
  1692. @media screen and (max-width: 700px) {
  1693. .ftr-container-1 {
  1694. left:0;
  1695. flex-flow: column wrap;
  1696. }
  1697. .project-thumb {
  1698. width: 80%;
  1699. margin-left: auto;
  1700. margin-right: auto;
  1701. padding-top: 40px;
  1702. padding-bottom: 10px;
  1703. padding-right: 0;
  1704. text-align: center;
  1705. }
  1706. .project-thumb img {
  1707. width: 100%;
  1708. height: auto;
  1709. margin: 0 auto;
  1710. padding: 0;
  1711. }
  1712. .project-brief {
  1713. width: 80%;
  1714. margin-left: auto;
  1715. margin-right: auto;
  1716. padding-top: 20px;
  1717. padding-bottom: 40px;
  1718. }
  1719. .project-brief h1 {
  1720. font-size: 24px;
  1721. font-weight: 700;
  1722. }
  1723. .project-brief p {
  1724. font-size: 14px;
  1725. }
  1726. .project-brief a {
  1727. font-size: 18px;
  1728. font-weight: 700;
  1729. color: black;
  1730. padding: 10px 20px;
  1731. border-radius: 30px;
  1732. background-color: #ffd966;
  1733. box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  1734. text-decoration: none;
  1735. }
  1736. .first-row-ftr {
  1737. flex-flow: column;
  1738. margin: 0 auto;
  1739. }
  1740. .col-one, .col-two {
  1741. width: 85%;
  1742. padding: 20px;
  1743. margin: 0 auto;
  1744. }
  1745. .col-three {
  1746. width: 85%;
  1747. padding: 20px;
  1748. margin: 0 auto;
  1749. }
  1750. .col-one h1, .col-two h1, .col-three h1 {
  1751. font-size: 36px;
  1752. font-weight: 700;
  1753. color: white;
  1754. }
  1755. .col-one p, .col-two p {
  1756. font-size: 16px;
  1757. line-height: 25px;
  1758. color: white;
  1759. margin-bottom: 0;
  1760. }
  1761. .col-three p {
  1762. font-size: 16px;
  1763. line-height: 25px;
  1764. color: white;
  1765. padding-bottom: 20px;
  1766. width: 80%;
  1767. }
  1768. .col-two a {
  1769. text-decoration: none;
  1770. }
  1771. .col-three a {
  1772. font-size: 20px;
  1773. margin-top: 30px;
  1774. }
  1775. .second-row-ftr {
  1776. width: 85%;
  1777. margin: 30px auto;
  1778. padding: 20px;
  1779. }
  1780. .second-row-ftr h1 {
  1781. font-size: 36px;
  1782. font-weight: 700;
  1783. color: white;
  1784. }
  1785. .second-row-ftr img {
  1786. width: 40px;
  1787. padding-bottom: 20px;
  1788. margin-right: 10px;
  1789. }
  1790.  
  1791. .ftr-container-3 {
  1792. flex-flow: column;
  1793. }
  1794.  
  1795. .tagline {
  1796. width: 100%;
  1797. margin-left: auto;
  1798. }
  1799. .copyright {
  1800. width: 100%;
  1801. }
  1802. .copyright h1{
  1803. font-size: 13px;
  1804. padding: 20px;
  1805. text-align: center;
  1806. margin: auto;
  1807. }
  1808. .tagline h1{
  1809. font-size: 13px;
  1810. padding: 20px;
  1811. text-align: center;
  1812. margin: auto;
  1813. }
  1814. }
  1815.  
  1816. &lt;/style&gt;
  1817. <div class="prnts-container">
  1818. <div class ="ftr-container-2">
  1819. <div class="first-row-ftr">
  1820. <div class="col-one">
  1821. <h1>Our Office</h1>
  1822. <p>4th floor of MRC Building, Faculty of Engineering Universitas Indonesia, Kampus UI Depok, 16424</p>
  1823. </div>
  1824.  
  1825. <div class="col-two">
  1826. <h1>Get in Touch</h1>
  1827. <a href="#"><p>Business inquiries</p></a>
  1828. <a href="#"><p>Vacancies</p></a>
  1829. <a href="#"><p>Events</p></a>
  1830. </div>
  1831.  
  1832. <div class="col-three">
  1833. <h1>Newsletter</h1>
  1834. <p>We share our knowledge with educational content and provide tips and relevant news.</p>
  1835. <a href="#">Sign up now</a>
  1836. </div>
  1837. </div>
  1838.  
  1839. <div class="second-row-ftr">
  1840. <h1>Follow us</h1>
  1841. <a href="https://www.linkedin.com/company/cswm-ui/" target="blank" rel="noopener"><img decoding="async" src="http://cswmui.com/wp-content/uploads/2023/09/linkedin.png" /></a>
  1842. <a href="https://instagram.com/cswm.ui?igshid=MzRlODBiNWFlZA==" target="blank" rel="noopener"><img decoding="async" src="http://cswmui.com/wp-content/uploads/2023/09/instagram.png" /></a>
  1843. <a href="https://cswm.ui.ac.id/contact/"><img decoding="async" src="http://cswmui.com/wp-content/uploads/2023/09/facebook.png" /></a>
  1844. </div>
  1845.  
  1846. </div>
  1847. <div class ="ftr-container-3">
  1848. <div class="tagline">
  1849. <h1>Building Synergy, Inspiring Indonesia</h1>
  1850. </div>
  1851. <div class="copyright">
  1852. <h1><span>©</span> 2023 Center for Sustainability and Waste Management UI</h1>
  1853. </div>
  1854. </div>
  1855. </div>
  1856. </div>  </div>
  1857.    </div>
  1858. </div>
  1859.  
  1860. </main>&lt;!--/.neve-main--&gt;
  1861.  
  1862.  
  1863. </div>&lt;!--/.wrapper--&gt;
  1864. [removed]
  1865. /* &lt;![CDATA[ */
  1866. var NeveProperties = {"ajaxurl":"https://cswm.ui.ac.id/wp-admin/admin-ajax.php","nonce":"129cd09670","isRTL":"","isCustomize":""};
  1867. /* ]]> */
  1868. [removed]
  1869. [removed][removed]
  1870. [removed]
  1871. /* &lt;![CDATA[ */
  1872.  var html = document.documentElement;
  1873.  var theme = html.getAttribute('data-neve-theme') || 'light';
  1874.  var variants = {"logo":{"light":{"src":"https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white.png","srcset":"https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white.png 200w, https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white-16x12.png 16w","sizes":"(max-width: 200px) 100vw, 200px"},"dark":{"src":"https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white.png","srcset":"https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white.png 200w, https://cswm.ui.ac.id/wp-content/uploads/2023/09/cropped-cropped-CSWM-UI-main-logo-monochrome-white-16x12.png 16w","sizes":"(max-width: 200px) 100vw, 200px"},"same":true}};
  1875.  
  1876.  function setCurrentTheme( theme ) {
  1877.   var pictures = document.getElementsByClassName( 'neve-site-logo' );
  1878.   for(var i = 0; i> .wrap > .caret");menuCarets.forEach(function(e){e.addEventListener("keydown",e=>{13===e.keyCode&&(e.target.parentElement.classList.toggle("active"),e.target.getAttribute("aria-pressed")&&e.target.setAttribute("aria-pressed","true"===e.target.getAttribute("aria-pressed")?"false":"true"))}),e.parentElement.parentElement.addEventListener("focusout",t=>{!e.parentElement.parentElement.contains(t.relatedTarget)&&(e.parentElement.classList.remove("active"),e.setAttribute("aria-pressed","false"))})});
  1879. /* ]]> */
  1880. [removed]
  1881. &lt;/body&gt;
  1882.  
  1883. &lt;/html&gt;
  1884.  

Reply to "dsadasd"