/*
Author       : Waytoweb
Template Name: Best People Service
Version      : 1.0 te
*/

/*  Font Face Style */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Roboto:wght@100;300;400;500;700;900&display=swap');
@font-face {
	font-family: 'Balgrim Xbold Sans';
	src: url('../../fonts/wtw_fonts/Balgrim.woff2') format('woff2'),
	url('../../fonts/wtw_fonts/Balgrim.woff') format('woff');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

.theme-light {
	--color-secondary: #160025;
	--color-primary: #7931a8;
	--color-accent: #12cdea;
	--font-color: #ffffff;
	--font-blue : #7931a8;
  }
  
  .theme-dark {
	--color-primary: #4CB74A;
	--color-secondary: #7931a8;
	--color-accent: #fd6f53;
	--font-color: #000000;
	--font-blue : #4CB74A;
  }




/*  Global */
:root {   --font-default : 'Inter', sans-serif; --font-balgrim : 'Balgrim Xbold Sans',sans-serif; --bs-primary: #7931a8;--bs-dasar: #FF9C41;--bs-pengurusan: #3B95FF ; --bs-secondary: #4CB74A; --color-default: #6d6d6d; --color-dark: #3d3d3d;--color-black: #000000; --font-roboto: 'Roboto Slab', serif; --font-balgrim: 'Balgrim Xbold Sans', sans-serif; }
img { max-width:100%; height:auto; }
body { color: var(--color-default); font-size: 15px; line-height: 1.5em; background-color: #ffffff; font-family: var(--font-default); }

/* Typography  */
video, audio { max-width:100%; height:auto; }
object { max-width:100%; }
iframe { max-width:100%; }
strong { font-weight:bold; }
a { text-decoration: none; color: var(--bs-primary); }
a:hover { color: var(--bs-secondary); }
h1, h2, h3, h4, h5, h6 { clear: both; font-weight: normal; line-height: 1.5; margin: 0 0 15px; color: var(--color-secondary); font-family: var(--font-balgrim); }
h1 { font-size: 54px; }
h2 { font-size: 30px; }
h3 { font-size: 28px; }
h4 { font-size: 20px; }
h5 { font-size: 24px; }
h6 { font-size: 20px; }
ul { margin:0 0 12px; }
p { line-height:1.5; margin-bottom:12px; }

/* Base  */
.site { position: relative; display: flex; flex-direction: column; min-height: 100vh; }
a.disable-link { cursor: default; pointer-events: none; }

/* Header  */
.site-header { position: relative; }
.site-header-main { background-color: #ffffff; padding: 12px 0; }
.site-header-main .container { display: flex; align-items: center; justify-content: center; }
.site-logo-group { display: flex; align-items: center; margin-right: 14px; }
.site-logo-group a { margin-right: 16px; }
.site-header-main-content { position: relative; }
.site-header-main-content h4, .site-header-main-content h3, .site-header-main-content h5 { color: var(--color-dark); font-size: 13px; margin-bottom: 0; line-height: 1.2; font-family: var(--font-balgrim); }
.site-header-main-content h3 { color: var(--color-secondary);
    font-size: 20px;
    text-transform: uppercase; }
.site-header-main-content h5 { text-transform: uppercase; }

/* Navbar */
.navbar { padding: 0; transition: all 0.4s ease-in-out; }
.navbar.navbar-light { background-color: var(--color-secondary); color: #ffffff; }
.navbar-nav li { padding: 0 10px; display: flex; flex-direction: column; }
.navbar-nav li.nav-icon-item { padding: 0; }
.navbar-nav li.nav-icon-item.center { margin-left: 120px; }
.navbar-light .navbar-nav .menu-link { flex: 1; display: flex; align-items: center; padding: 10px 15px; font-family: var(--font-default); font-weight: 500; font-size: 14px; color: #ffffff; border-bottom: solid 4px transparent; }
.navbar-light .navbar-nav .menu-link:focus, .navbar-light .navbar-nav .menu-link:hover, .navbar-light .navbar-nav .menu-link.is-active, .navbar-light .navbar-nav .show > .menu-link { color: var(--bs-secondary); }
.navbar-light .navbar-nav .menu-link.is-active { border-bottom-color: var(--color-primary); }
.navbar-light .navbar-nav .menu-link img { margin-right: 6px; }
.nav-search { display: flex; align-items: center; justify-content: center; order: 2; position: relative;}
.nav-search a { padding: 10px 15px; display: flex; }
.navbar-light .navbar-nav .nav-link {
    flex: 1;
    display: flex;
    align-items: center;
    padding: 10px 15px;
    font-family: var(--font-default);
    font-weight: 500;
    font-size: 14px;
    color: #ffffff;
    border-bottom: solid 4px transparent;
}
.navbar-expand-lg .offcanvas { order: 1; }
.is-sticky .navbar.navbar-light { position: fixed; top: 0; left: 0; width: 100%; z-index: 999; }

/* FIX: Allow navbar dropdown to escape overflow clipping */
.navbar,
.navbar-light,
.navbar-center,
.navbar-expand-lg,
.menu,
.menu-inner,
.menu-dropdown,
.submenu {
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
}

/* Override: Remove scrolling from menu-inner to allow dropdown to show */
.menu-inner {
    overflow-y: visible !important;
    overflow-x: visible !important;
    height: auto !important;
}

.submenu {
    z-index: 1001 !important;
}

/*site-banner*/
.site-banner { position: relative; }
.site-banner-image { position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; }
.site-banner-image img { width: 100%; height: 100%; object-fit: cover; }
.site-banner-image:before { content: ''; position: absolute; left: 0; top: 0;  width: 100%; height: 100%; z-index: 1; background-color: rgba(224, 175, 255, 0.7); }
.site-banner-wrap { min-height: 394px; position: relative; z-index: 3; padding: 1px 20px 90px 0px; display: flex; flex-direction: column; justify-content: center; text-align: center; }
.site-banner-wrap h1 { margin-bottom: 0; color: #34234D; font-family: var(--font-balgrim); line-height: 1.3; }
.iklan-banner-wrap h1 { margin-bottom: 0; color:0; font-family: var(--font-balgrim); line-height: 1.3; }

/* Labels */
.form-label { margin-bottom: 2px; color: #343434; }

/* Input Groups */
.form-control, input[type="number"], input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="search"], input[type="url"], textarea, select { padding: 10px 4px; border-radius: 0; max-width: 100%; font-size: 14px; font-weight: 500; color: var(--color-default); background-color: transparent; border: 0 none; border-bottom: solid 1px #494949; font-family: var(--font-default); }
.form-select { background-position: right 1.25rem center; border-radius: 0; padding: 10px 4px; background-color: transparent; border: 0 none; border-bottom: solid 1px #494949; color: var(--color-default); font-size: 14px; font-weight: 500; font-family: var(--font-default); }
.form-control:focus, .form-select:focus { box-shadow: none; border-color: var(--bs-primary); }
.input-group > .form-control, .input-group > .form-select { min-width: 100px; }
::-webkit-input-placeholder { color: rgba(161, 177, 177, 1); }
::-moz-placeholder { color: rgba(161, 177, 177, 1); }
:-ms-input-placeholder { color: rgba(161, 177, 177, 1); }
:-moz-placeholder { color: rgba(161, 177, 177, 1); }
/* Chrome, Safari, Edge, Opera */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
/* Firefox */
input[type=number] { -moz-appearance: textfield; }
.form-floating > .form-control, .form-floating > .form-control-plaintext { padding: 10px 4px; height: 42px; min-height: 42px; }
.form-floating > .form-control-plaintext ~ label, .form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label { color: var(--bs-primary); }
.input-group-text { background-color: transparent; border: 0 none; border-radius: 0; position: absolute; right: 0; top: 50%; z-index: 9; transform: translateY(-50%); padding: 5px 4px; }
.form-floating > label { font-size: 13px; padding: 10px 4px; }
.form-check { padding-left: 30px; }
.form-check-input { border: solid 2px #9E9E9E; width: 21px; height: 21px; margin-top: 1px; background: none; }
.form-check .form-check-input { margin-left: -30px; }
.form-check-input:checked { background-color: transparent; border-color: #9E9E9E; }
.form-check-input:checked[type="radio"] { background: #ffffff url("../../images/wtw_images/icon-secondary-circle.svg") no-repeat center; }
.form-check-input:focus { box-shadow: none; }
:focus-visible { outline: none; }

/*uploader*/
.uploader { position: relative; overflow: hidden; color: var(--color-default); width: 100%; margin-top: 30px; }
.uploader label { display: flex; align-items: center; }
.uploader input[type=file] { display: none; }
.file-upload-btn {     cursor: pointer;
    font-family: var(--font-default);
    font-weight: 700;
    font-size: 14px;
    padding: 12px 42px;
    margin-right: 12px;
    border-radius: 50px;
    color: var(--bs-primary);
    background-color: #EED4FF;
    border: solid 2px var(--color-secondary);
    min-width: fit-content;
    flex-shrink: 0;
    white-space: nowrap;
 }
.file-upload-btn img { margin-right: 12px; }
.uploader:hover .file-upload-btn {    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
    color: #ffffff; }
.file-upload-content { position: relative; }
.file-upload-content h6 { margin-bottom: 0; font-weight: 600; font-size: 14px; color: var(--color-default); font-family: var(--font-default); }
.horizontal-tab-main .file-upload-content p { margin-bottom: 0; font-style: italic; font-size: 12px; }

/* Buttons */
.btn, input[type=button], input[type=submit], input[type=reset] { display: inline-block; font-size: 16px; padding: 9.5px 26px; border: solid 1px transparent; border-radius: 28px; box-sizing: border-box; font-weight: bold; text-transform: capitalize; font-family: var(--font-default); }
input[type=button], input[type=submit], input[type=reset], .btn-primary { color: #fff;
    background-color: var(--color-secondary);
    border-color: var(--color-secondary); }
input[type=button]:hover, input[type=button]:focus, input[type=submit]:hover, input[type=submit]:focus, input[type=reset]:hover, input[type=reset]:focus, .btn-primary:hover, .btn-primary:focus, .btn-primary:focus-visible, .btn-primary:first-child:active, :not(.btn-check) + .btn-primary:active {  color: #fff; background-color: #4A007D; border-color: #4A007D; box-shadow: none; }
.btn-group-sm > .btn, .btn-sm { border-radius: 0; font-size: 14px; padding: 8px 20px; }
.btn-group-lg > .btn, .btn-lg { border-radius: 0; font-size: 18px; padding: 15px 30px; }
.btn img { margin-left: 12px; margin-bottom:5px;}
.form-tab-btn-view { position: relative; text-align: center; margin-top: 40px; display: flex; align-items: center; justify-content: center; }
.form-tab-btn-view .btn-395 { max-width: 395px; width: 100%; }
.btn-close:focus { box-shadow: none; }
.btn-outline-primary { background-color: #F4EDF9; border: solid 1px var(--bs-primary); color: var(--bs-primary); }
.btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:focus-visible, .btn-outline-primary:first-child:active, :not(.btn-check) + .btn-outline-primary:active { background-color: #4A007D; border-color: #4A007D; color: #ffffff; box-shadow: none; }
.form-tab-btn-view .btn + .btn { margin-left: 20px; }
.btn-outline-gray-primary {  background-color: #ffffff;
    border: solid 1px var(--color-secondary) !important;
    color: #9E9E9E; }
.btn-outline-gray-primary:hover, .btn-outline-gray-primary:focus, .btn-outline-gray-primary:focus-visible, .btn-outline-gray-primary:first-child:active, :not(.btn-check) + .btn-outline-gray-primary:active { background-color: #fff; border-color: #4A007D; color: #9E9E9E !important; box-shadow: none; }
.btn-outline-gray-primary svg path { fill: #9E9E9E !important; }
.btn-outline-gray-primary:hover svg path, .btn-outline-gray-primary:focus svg path { fill: #9E9E9E !important; }
a.btn.btn-outline-gray-primary:hover {
	color: #9E9E9E !important;
}

/*datepicker*/
.datepicker-cell.selected, .datepicker-cell.selected:hover { background-color: var(--bs-primary); }

/*Timepicker Standard*/
.ui-timepicker-standard { padding: 0; border-radius: 4px; font-size: 14px; z-index: 999 !important; min-width: 85px; }
.ui-timepicker-standard a { border: 0 none; }
.ui-timepicker-standard .ui-state-hover { background-color: var(--bs-primary); border: 0 none; font-weight: 400; color: #ffffff; }
.ui-timepicker { padding: 0; }

/* Main Content */
.site-main { flex: 1; }
.site-section { position: relative; padding: 50px 0 ; }

/**
 * Social Icons
 */
.social-link-list { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; padding-left: 0; margin-bottom: 0; }
.social-link-list li { margin-bottom: 15px; }
.social-link-list li a { color: #3B3B3B; text-transform: uppercase; }
.social-link-list li a:focus, .social-link-list li a:hover { color: #00a84d; }

/*  Footer= */
/*  .site-footer { background-color: #ffffff; color: var(--color-dark); font-size: 12px; font-family: var(--font-roboto); font-weight: 300; border-top: solid 1px var(--bs-primary); padding: 8px 0 30px; }*/
.site-footer .site-footer-container { display: flex; align-items: center; justify-content: space-between; max-width: 970px; margin: 0 auto; }
.site-footer a { color: var(--color-dark); }
.site-footer a:hover, .site-footer a:focus { color: var(--bs-primary); }
.footer-menu { list-style: none;
    margin: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    padding: 0px;}
.footer-menu li { margin-right: 17px; }
.copy-right p { margin-bottom: 0; }
.footer-menu li:last-child {
    margin-right: 0;
}
/*site-btn-action*/
.site-btn-action { position: fixed; right: -117px; top: 42%; z-index: 99; transform: rotate(90deg); }
.modal-open .site-btn-action { right: -97px; }
.site-btn-action-list { list-style: none; padding-left: 0; margin: 0; display: flex; }
.site-btn-action-list li { position: relative; }
/* .site-btn-action-list li:last-child { margin-left: -32px; } */
.site-btn-action-list li a { position: relative; color: var(--bs-primary); font-family: var(--font-balgrim); font-size: 12px; padding: 10px 28px; display: block; }
/* .site-btn-action-list li a:before { content: ''; position: absolute; right: 42px; top: -46px; z-index: -1; transform: rotate(-90deg); width: 43px; height: 133px; background: url("../../images/wtw_images/bahasa-btn-background.png") no-repeat center; } */
.site-btn-action-list li:first-child a { z-index: 3; }
.site-btn-action-list li:last-child a:before { right: 70px; top: -74px; height: 189px; background-image: url("../../images/wtw_images/bahasa-btn-background-lg.png"); }
.site-btn-action-list li a img { margin-right: 5px; }
/* .site-btn-action-list li:last-child a img { transform: rotate(-90deg); } */
.site-btn-action-list li a:hover, .site-btn-action-list li a:focus { color: #ffffff; }
.site-btn-action-list li a:hover img, .site-btn-action-list li a:focus img { filter: brightness(0) invert(1); }
/*nav-horizontal-tabs*/
.nav-horizontal-tabs { position: relative; border: 0 none; margin-bottom: 78px; justify-content: center; }
.nav-horizontal-tabs .nav-item { margin: 1px; }
.nav-horizontal-tabs .nav-link { color: #CECECE; font-family: var(--font-balgrim); font-size: 16px; line-height: 1.2; width: 210px; display: flex; align-items: center; justify-content: center; padding: 10px 20px; border-radius: 50px; }
.tabs-thumb { margin-right: 8px; position: relative; display: block; }
.tabs-thumb img { width: 40px; min-width: 40px; height: 40px; }
.tabs-thumb img.colored { position: absolute; left: 0; top: 0; z-index: 1; opacity: 0; visibility: hidden; }
.nav-horizontal-tabs .nav-link:focus, .nav-horizontal-tabs .nav-link:hover { border-color: transparent; color: #494949; }
.nav-horizontal-tabs .nav-link.active { border-color: #E0AFFF; color: #494949; background-color: #EED4FF; }
.nav-horizontal-tabs .nav-link:focus .tabs-thumb img.colored, .nav-horizontal-tabs .nav-link:hover .tabs-thumb img.colored, .nav-horizontal-tabs .nav-link.active .tabs-thumb img.colored,
.nav-vertical-tabs .nav-link.active .tabs-thumb img.colored { opacity: 1; visibility: visible; }
.nav-horizontal-tabs .nav-link:focus .tabs-thumb img.non-colored, .nav-horizontal-tabs .nav-link:hover .tabs-thumb img.non-colored, .nav-horizontal-tabs .nav-link.active .tabs-thumb img.non-colored,
.nav-vertical-tabs .nav-link.active .tabs-thumb img.non-colored { opacity: 0; visibility: hidden; }
.horizontal-tab-main { position: relative; margin-bottom: 40px; }
.horizontal-tab-main p { margin-bottom: 26px; }
.horizontal-tab-main ol { padding-left: 20px; font-weight: 500; }

/*vertical-hor-tab-content*/
.vertical-hor-tab-content { position: relative; max-width: 1080px; margin: 0 auto; display: flex; flex-wrap: wrap; }
.vertical-hor-tab-content .tab-content { width: calc(100% - 240px); padding-left: 70px; }
.nav-vertical-tabs { position: relative; border: 0 none; flex-direction: column; width: 240px; }
.nav-vertical-tabs .nav-item { margin-bottom: 0; }
.nav-vertical-tabs .nav-item:not(:last-child) { margin-bottom: 50px; }
.nav-vertical-tabs .nav-link { color: #CECECE; font-family: var(--font-balgrim); font-size: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 8px; border-radius: 0; }
.nav-vertical-tabs .nav-link:focus, .nav-vertical-tabs .nav-link:hover { border-color: transparent; color: #494949; }
.nav-vertical-tabs .nav-link.active { border-color: transparent; color: #494949; background-color: transparent; }
.nav-vertical-tabs .nav-link:focus .tabs-text-sm, .nav-vertical-tabs .nav-link:hover .tabs-text-sm, .nav-vertical-tabs .nav-link.active .tabs-text-sm { color: var(--bs-primary); }
.nav-vertical-tabs .tabs-thumb img { width: 80px; min-width: 80px; height: 80px; }
.nav-vertical-tabs .tabs-thumb { margin-right: 0; margin-bottom: 8px; }
.nav-vertical-tabs .nav-link .tabs-text-sm { font-size: 12px; font-family: var(--font-default); display: block; }
.vertical-tab-main { position: relative; margin-top: 30px; }
.form-title { color: var(--color-default); font-size: 20px; margin-bottom: 20px; }
.form-title span { margin-left: 12px; font-size: 12px; font-family: var(--font-default); font-style: italic; }

/*message-main*/
.message-main { position: relative; text-align: center; max-width: 586px; margin: 0 auto; }
.message-thumb { margin-bottom: 20px; }
.message-content { position: relative; font-size: 14px; font-weight: 500; }

/*semakan-section*/
.semakan-section.site-section { background: url("../../images/wtw_images/semakan-bg.png") no-repeat left bottom; min-height: 980px; margin-bottom: -40px; padding-bottom: 0; }
.semakan-horizontal-tab { display: flex; flex-direction: column; align-items: flex-end; }
.semakan-login-card { padding: 50px 32px; background-color: #ffffff; border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); max-width: 378px; margin-top: 40px; }
.semakan-login-card-header { text-align: center; margin-bottom: 40px; }
.semakan-btn-group { margin-top: 20px; position: relative; }
.semakan-btn-group .btn { width:200px; max-width: 100%; margin-bottom: 12px; }
.semakan-carian-content { max-width: 1100px; width: 100%; margin: 0 auto 80px; }
.semakan-carian-content h3, .direktori-carian-content h3  { font-size: 20px; color: var(--color-default); font-family: var(--font-default); font-weight: 800; }
.semakan-form-inline { position: relative; display: flex; align-items: center; }
.semakan-form-inline .form-floating { flex: 1; padding-right: 30px; }
.semakan-form-inline .semakan-btn-group { margin-top: 0; display: flex; align-items: center; min-width: 310px; }
.semakan-form-inline .semakan-btn-group .btn { margin-bottom: 0; }
.semakan-form-inline .semakan-btn-group .btn + .btn {  }
.semakan-carian-card { padding: 32px; background-color: #ffffff; border-radius: 15px; box-shadow: 0 0 8px rgba(0, 0, 0, 0.2); }
/* background-image: linear-gradient(rgb(255 200 243) 10%, white 50%);	 */
.table { margin-bottom: 0; text-overflow: ellipsis; white-space: normal;}
.table tr td, .table tr th { color: #494949; padding: 16px 26px; box-shadow: none; font-size: 14px; font-weight: 500; }
.table tr th:first-child, .table tr td:first-child { border-radius: 6px 0 0 6px; }
.table tr th:last-child, .table tr td:last-child { border-radius: 0 6px 6px 0; }
.table thead tr th { background-color: transparent; border-bottom: solid 5px #ffffff; color: #3D3D3D; font-size: 12px; font-weight: 700; }
.table tbody tr td, .table tbody tr th { background-color: #EDEDED; border-bottom: solid 5px #ffffff; }
.table tbody tr:nth-child(odd) td, .table tbody tr:nth-child(odd) th { background-color: #F4EDF9; text-overflow: ellipsis;white-space:normal;}
.semakan-carian-card .table tbody tr th { color: var(--bs-primary); width: 216px; }

/*direktori-main*/
.direktori-main { position: relative; }
.direktori-main:before { content: ''; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: calc(100% + 62px); background: url("../../images/wtw_images/background.png") no-repeat center top; }
.direktori-main > * { position: relative; z-index: 3; }
.direktori-carian-content { position: relative; }

/*aduan-pills*/
.aduan-pills { justify-content: center; }
.aduan-pills .nav-item { margin-bottom: 6px; padding: 0 3px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.aduan-pills .nav-link { background-color: #EFD6FF; border-color: #EFD6FF; color: #696969; padding: 8px 35px; min-height: 55px; border-radius: 50px; font-family: var(--font-default); font-size: 15px; line-height: 1; font-weight: bold; display: flex; align-items: center; justify-content: center; }
.aduan-pills .nav-unit-item .nav-link { background-color: #F9EFFF; border-color: #EFD6FF; }
.aduan-pills .nav-pejabat-dasar-item .nav-link { background-color: #FFDBC3; border-color: #FFDAC1; }
.aduan-pills .nav-pejabat-pengurusan-item .nav-link { background-color: #D1E4FF; border-color: #D9E0FF; }
.aduan-pills .nav-bahagian-item .nav-link { background-color: #FFEADC; border-color: #FFE3D0; width: 312px; }
.aduan-pills .nav-pejabat-pengurusan-light .nav-link { background-color: #E9EDFF; border-color: #D9E0FF; }
.aduan-pills .nav-link:focus-visible { box-shadow: none; }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { color: #ffffff; border-color: var(--color-secondary);background-color: var(--color-secondary); box-shadow: 0 0 10px #BD88DF; }/*Unit& KP*/
.nav-pills .nav-pengurusan.active, .nav-pills .show > .nav-link { color: #ffffff; border-color: var(--color-secondary);background-color: var(--bs-pengurusan); box-shadow: 0 0 10px #BD88DF; }/*Pengurusan*/
.nav-pills .nav-dasar.active, .nav-pills .show > .nav-link { color: #ffffff; border-color: var(--color-secondary);background-color: var(--bs-dasar); box-shadow: 0 0 10px #BD88DF; }/*Dasar*/
.aduan-pills .nav-pejabat-item { width: 100%; }
.aduan-pills .nav-pejabat-dasar-item {  align-items: flex-end; padding-right: 12px; width: 50%;}
.aduan-pills .nav-pejabat-pengurusan-item { align-items: flex-start; padding-left: 12px;   width: 50%;}
.aduan-pills .nav-bahagian-item.space-end { padding-right: 12px; }
.aduan-pills .nav-bahagian-item.space-start { padding-left: 12px; }
.aduan-pills .nav-pejabat-dasar-item .nav-link, .aduan-pills .nav-pejabat-pengurusan-item .nav-link { width: 433px; }
.aduan-pills .nav-unit-item { margin-bottom: 20px; }

/*direktori-banner*/
.direktori-banner { position: relative; min-height: 500px; display: flex; flex-direction: column; }
.direktori-banner-image { position: absolute; left: 0; top: 0; z-index: 0; width: 100%; height: 100%; border-radius: 15px; overflow: hidden; }
.direktori-banner-image img { width: 100%; height: 100%; object-fit: cover; }
.direktori-banner-image:before { content: ''; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; background-color: #E0AFFF; background: linear-gradient(to right, #E0AFFF 44%, #FF9AA2 100%); opacity: 0.7; }
.negroni-banner .direktori-banner-image:before { background-color: #FFDAC1; background: linear-gradient(to right, #FFDAC1 44%, #FF9AA2 100%); }
.anakiwa-banner .direktori-banner-image:before { background-color: #92BFFF; background: linear-gradient(to right, #92BFFF 44%, #FF9AA2 100%); }
.direktori-banner-wrap { position: relative; padding-top: 40px; flex: 1; display: flex; flex-direction: column; justify-content: flex-end; }
.direktori-banner-wrap .container { position: flex; }
.direktori-banner-content { display: flex; align-items: center; margin-left: 100px; gap:40px;}
.direktori-banner-thumb { position: relative; order: 1; margin-right: -30px; }
.direktori-banner-describe { position: relative; padding: 20px 0; order: 2;}
.direktori-banner-describe h2 { font-family: var(--font-default); font-weight: 700; font-size: 30px; margin-bottom: 0; line-height: 1.2; }
.direktori-banner-describe h6 { font-family: var(--font-default); font-weight: 700; font-size: 20px; margin-bottom: 16px; color: #34234D; }
 .direktori-banner-list { max-width: 396px; font-size: 14px; font-weight: 500; list-style: none; padding-left: 0; margin: 0; display: flex; flex-wrap: wrap; } 
.direktori-banner-list li { width: 50%; margin-bottom: 12px; padding-right: 15px; line-height: 1.2; display: flex; align-items: flex-start; color: #494949; }
.direktori-banner-list li:first-child, .direktori-banner-list li:last-child { width: 100%; padding-right: 0; }
.direktori-banner-list li address { margin-bottom: 0; }
.direktori-banner-list li img { margin-right: 10px; margin-top: 3px; }
.direktori-banner-list li a { display: flex; align-items: center; color: #494949; }
.direktori-banner-list li a:hover, .direktori-banner-list li a:focus { color: var(--bs-primary); }
.direktori-banner-user { position: absolute; right: 35px; bottom: 0; z-index: 1; display: flex; align-items: center; flex-direction: row-reverse; padding-bottom: 48px; max-width: 440px; width: 100%; }
.direktori-banner-user-thumb { position: relative; margin-left: 22px; }
.direktori-banner-user-thumb img { border-radius: 50%; width: 118px; height: 118px; object-fit: cover; }
.direktori-banner-user-info { position: relative; text-align: right; }
.direktori-banner-user-info h4, .direktori-banner-user-info h6 { color: #3D3D3D; font-family: var(--font-default); font-weight: 700; margin-bottom: 0; line-height: 1.2; }
.direktori-banner-user-info h4 { font-size: 16px;display: flex;justify-content: flex-start;}
.direktori-banner-user-info h6 { font-size: 14px; margin-bottom: 16px;display: flex;justify-content: flex-start; }
.direktori-banner-user-info .direktori-banner-list { flex-direction: column; }
.direktori-banner-user-info .direktori-banner-list li { justify-content: flex-start; width: auto; }
.direktori-banner-user-info .direktori-banner-list li:last-child { margin-bottom: 0; justify-content: flex-start;}

/*direktori-content*/
.direktori-content { position: relative; margin-bottom: 40px; }
.direktori-header { text-align: center; margin-bottom: 40px; }
.direktori-header h3 { font-family: var(--font-default); font-size: 20px; font-weight: 800; margin-bottom: 0; color: var(--color-default); }
.direktori-content .table thead tr th { padding: 6px 26px; }
.direktori-content .table tbody tr td, .direktori-content.table tbody tr th { background-color: #EDEDED54; }
.direktori-content .table tbody tr:nth-child(odd) td, .direktori-content .table tbody tr:nth-child(odd) th { background-color: #F4EDF9; }
.direktori-content .table tbody tr td a { color: #494949; }
.direktori-content .table tbody tr td a:hover, .direktori-content .table tbody tr td a:focus { color: var(--bs-primary); }

/*direktori-modal*/
.direktori-modal .modal-content { border: 0 none; border-top: solid 4px var(--bs-primary); border-radius: 10px; }
.direktori-modal .modal-header { background-color: #E0AFFF; padding: 20px 30px 0; border-radius: 8px 8px 10px 10px; position: relative; min-height: 115px; display: flex; flex-direction: column; justify-content: flex-end; }
.direktori-modal .modal-header .btn-close { position: absolute; right: 20px; top: 16px; z-index: 1; background: none; opacity: 1; padding: 0; margin: 0; width: 18px; height: 18px; }
.direktori-modal .modal-header .btn-close svg { display: block; }
.direktori-modal-user { width: 100%; display: flex; align-items: flex-end; }
.direktori-modal-user-thumb { margin-right: 20px; margin-bottom: -40px; }
.direktori-modal-user-thumb img { width: 105px; height: 105px; object-fit: cover; border-radius: 50%; }
.direktori-modal-user-info { flex: 1; position: relative; padding-bottom: 20px; }
.direktori-modal-user-info h4 { font-family: var(--font-default); font-weight: 700; font-size: 20px; margin-bottom: 0; line-height: 1.2; }
.direktori-modal-user-info h6 { font-family: var(--font-default); font-weight: 700; font-size: 16px; margin-bottom: 0; line-height: 1.2; color: #494949; }
.direktori-modal .modal-body { padding: 30px; }
.direktori-modal-list { padding-left: 125px; list-style: none; margin-bottom: 0; }
.direktori-modal-list li { display: flex; align-items: flex-start; margin-bottom: 12px; color: #494949; font-size: 14px; font-weight: 500; }
.direktori-modal-list li:not(:last-child) { margin-bottom: 12px; }
.direktori-modal-list li img { margin-right: 8px; margin-top: 4px; }
.direktori-modal-list li address { margin-bottom: 0; }
.direktori-modal-list li a { display: flex; align-items: flex-start; color: #494949; }
.direktori-modal-list li a:hover, .direktori-modal-list li a:focus { color: var(--bs-primary); }


/*  Media Queries */
@media (min-width: 1800px) {
	.site-footer { max-width: 1642px; margin: 0 auto; width: 100%; }
}

@media (max-width: 1399px) {
	.navbar-nav li.nav-icon-item.center { margin-left: 20px; }
	.nav-horizontal-tabs { margin-bottom: 70px; }
	.nav-horizontal-tabs .nav-link { width: 184px; }
	.navbar-light .navbar-nav .nav-link { padding: 10px 12px; }
	.semakan-horizontal-tab { align-items: flex-start; }
	.aduan-pills .nav-bahagian-item .nav-link { width: 265px; }
}

@media (max-width: 1199px) {
	.navbar-nav li { padding: 0 5px; }
	.navbar-light .navbar-nav .nav-link { padding: 10px; font-size: 12px; }
	.navbar-nav li.nav-icon-item.center { margin-left: 0; }
	h1 { font-size: 48px; }
	.nav-horizontal-tabs .nav-link { width: 150px; font-size: 12px; }
	.tabs-thumb img { width: 30px; min-width: 30px; height: 30px; }
	.nav-horizontal-tabs { margin-bottom: 40px; }
	.vertical-hor-tab-content .tab-content { padding-left: 20px; }
	.form-tab-btn-view .btn-395 { max-width: 295px; }
	.nav-vertical-tabs .nav-link { font-size: 16px; }
	.nav-vertical-tabs .tabs-thumb img { width: 60px; min-width: 60px; height: 60px; }
	.aduan-pills .nav-bahagian-item.space-end { padding-right: 3px; }
	.aduan-pills .nav-bahagian-item.space-start { padding-left: 3px; }
	.direktori-banner-describe h2 { font-size: 26px; }
	.direktori-banner-content{margin-left: 0;}
}


@media screen and (max-width:990px){


	.direktori-banner-content{
		gap:50px;
	}
	.direktori-banner-thumb img{
		border-radius: 50%;
		border: white 1px solid;
		width: 130px;
		height: 130px;
		object-fit: normal;
		margin-top: 20px;
		background-color: white;
	} 
	
	}

	
@media (max-width: 991px) {
	.nav-search { order: 1; }
	.navbar { padding: 10px 0; }
	.navbar-light .navbar-toggler { order: 2; color: #ffffff; border-color: transparent; font-size: 32px; padding: 0; width: auto; height: auto; }
	.navbar-light .navbar-toggler:hover,.navbar-light .navbar-toggler:focus { color: var(--bs-secondary); border-color: transparent; background-color: transparent; box-shadow: none; }
	.offcanvas-menu { background-color: var(--bs-primary); color: #ffffff; border-left: 0 none; }
	.offcanvas-menu .offcanvas-body { padding: 0; }
	.offcanvas-header .btn-close { margin-left: 4px; min-height: 10px; }
	.offcanvas-header .btn-close, .offcanvas-header .btn-close:hover, .offcanvas-header .btn-close:focus { background-color: #ffffff; }
	.navbar-nav { border-top: solid 1px #ffffff30; }
	.navbar-nav li { padding: 0; }
	.navbar-light .navbar-nav .nav-link { color: #fff; border-bottom: solid 1px #ffffff30; padding: 10px 20px; }
	.navbar-light .navbar-nav .nav-link.active { border-bottom-color: #ffffff30; }
	.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show > .nav-link { color: #fff; }
	h1 { font-size: 40px; }
	h2 { font-size: 28px; }
	h3 { font-size: 26px; }
	h4 { font-size: 24px; }
	h5 { font-size: 22px; }
	h6 { font-size: 20px; }
	.site-section { padding: 70px 0; }
	.site-header-main-content h4, .site-header-main-content h5 { font-size: 11px; }
	.site-header-main-content h3 { font-size: 15px; }
	.nav-vertical-tabs { width: 100%; flex-direction: row; justify-content: center; }
	.nav-vertical-tabs .nav-item:not(:last-child) { margin-bottom: 10px; }
	.vertical-hor-tab-content .tab-content { padding-left: 0; width: 100%; }
	.vertical-tab-main { margin-top: 10px; }
	.site-footer { padding: 8px 0 10px; }
	.footer-menu li { margin-left: 10px; }
	.horizontal-tab-main, .direktori-header, .direktori-content { margin-bottom: 20px; }
	.form-tab-btn-view { margin-top: 20px; }
	.horizontal-tab-main p { margin-bottom: 16px; }
	.semakan-carian-content { margin-bottom: 50px; }
	.aduan-pills .nav-pejabat-dasar-item { width: auto; align-items: inherit; padding-right: 3px; }
	.aduan-pills .nav-pejabat-pengurusan-item { width: auto; align-items: inherit; padding-left: 3px; }
	.aduan-pills .nav-pejabat-item, .aduan-pills .nav-bahagian-item .nav-link, .aduan-pills .nav-pejabat-dasar-item .nav-link, .aduan-pills .nav-pejabat-pengurusan-item .nav-link { width: auto; }
	.aduan-pills .nav-unit-item { margin-bottom: 6px; }
	.direktori-banner-content { order: 2; }
	.direktori-banner-user { order: 1; padding-bottom: 10px; margin-left: 0; }
	.direktori-banner-wrap .container {display: flex; flex-direction: column-reverse; }
	.direktori-banner-user {
    position: relative;
    right: 0;
    max-width: 100%;
    flex-wrap: wrap;
    flex-direction: row-reverse;
}

#etua-img{

	border-radius: 50%;
    border: white 1px solid;
    width: 150px;
    height: 150px;
    background-color: white;
}
/* .direktori-banner-thumb img{
	border-radius: 50%;
    border: white 1px solid;
    width: 130px;
    height: 130px;
    object-fit: normal;
    margin-top: 20px;
    background-color: white;

} */


.direktori-banner-user-info {
    text-align: center;
}

	.slick-slider.nav-horizontal-tabs { padding: 0 48px; }
	.nav-horizontal-tabs .slick-prev, .nav-horizontal-tabs .slick-next { background-color: #fff; border: solid 1px #E0AFFF; width: 40px; height: 40px; border-radius: 50%; }
	.nav-horizontal-tabs .slick-prev { left: 0; background-color: #fff url("../../images/wtw_images/icon-arrow-prev.png") no-repeat center; }
	.nav-horizontal-tabs .slick-next { right: 0; background: #fff url("../../images/wtw_images/icon-arrow-next.png") no-repeat center; }
	.nav-horizontal-tabs .slick-prev:before, .nav-horizontal-tabs .slick-next:before { display: none; }
	.nav-horizontal-tabs .nav-link { width: auto; font-size: 12px; flex-direction: column; padding: 0; border: 0 none; text-align: center; }
	.tabs-thumb { margin-right: 0; margin-bottom: 8px; border: solid 1px transparent; border-radius: 50%; width: 60px; height: 60px; display: flex; align-items: center; justify-content: center; }
	.nav-horizontal-tabs .nav-link.active { border-color: transparent; background-color: transparent; }
	.nav-horizontal-tabs .nav-link .tabs-thumb { border-color: #E0AFFF; background-color: #EED4FF; }
	.nav-horizontal-tabs .tabs-thumb img.colored { left: 50%; top: 50%; translate: -50% -50%; }
	.nav-horizontal-tabs .nav-item { display: flex; align-items: center; justify-content: center; }


}

@media screen and (max-width:990px){


.direktori-banner-thumb img{
	border-radius: 50%;
    border: white 1px solid;
    width: 130px;
    height: 130px;
    object-fit: contain;
    margin-top: 20px;
    background-color: white;
} 

}


/* Banner title responsive - prevent cropping on mobile */
@media (max-width: 991px) {
	.site-banner-wrap h1 {
		font-size: 40px !important;
		margin-bottom: 45px !important;
		margin-left: 0 !important;
		padding-left: 0 !important;
	}
}
@media (max-width: 767px) {
	h1 { font-size: 36px; }
	.site-banner-wrap h1 {
		font-size: 30px !important;
		margin-bottom: 32px !important;
		margin-left: 0 !important;
		padding-left: 0 !important;
	}
	h2 { font-size: 26px; }
	h3 { font-size: 24px; }
	h4 { font-size: 22px; }
	h5 { font-size: 20px; }
	h6 { font-size: 18px; }
	.nav-vertical-tabs .nav-link { font-size: 14px; }
	.nav-vertical-tabs .tabs-thumb img { width: 50px; min-width: 50px; height: 50px; }
	.uploader { margin-top: 10px; }
	.uploader label { flex-direction: column; text-align: center; }
	.file-upload-btn { margin-right: 0; margin-bottom: 12px; padding: 12px 30px; min-width: fit-content; flex-shrink: 0; white-space: nowrap; }
	.form-tab-btn-view .btn + .btn { margin-left: 10px; }
	.form-tab-btn-view .btn-395 { max-width: 200px; }
	.site-footer .site-footer-container { flex-direction: column; }
	.copy-right { margin-bottom: 8px; }
	.footer-menu li { margin: 0 8px; }
	.nav-horizontal-tabs { margin-bottom: 20px; }
	.nav-horizontal-tabs .nav-link { margin-bottom: 10px; width: 100%; font-size: 14px; }
	.semakan-section.site-section { margin-bottom: 0; padding-bottom: 30px; }
	.semakan-carian-content { margin-bottom: 30px; }
	.semakan-form-inline { flex-direction: column; align-items: flex-start; }
	.semakan-form-inline .form-floating { flex: 0; padding-right: 0; width: 100%; margin-bottom: 20px; }
	.table tr td, .table tr th { white-space: nowrap; }
	.direktori-banner-thumb { max-width: 170px; }
	.direktori-banner-describe h2 { font-size: 20px; }
	.direktori-banner-describe h6 { font-size: 18px; }
	/* .direktori-banner-content { align-items: flex-end; } */


}

@media (max-width: 575px) {
	.offcanvas-menu.offcanvas.offcanvas-end { width: 300px; }
	a.disable-link { cursor: pointer; pointer-events: inherit; }
	.site-header-main-content h4, .site-header-main-content h5 { font-size: 10px; }
	.site-header-main-content h3 { font-size: 12px; }
	.btn, input[type="button"], input[type="submit"], input[type="reset"] { font-size: 14px; }
	.form-tab-btn-view { flex-wrap: wrap; }
	.form-tab-btn-view .btn { margin: 5px; }
	.form-tab-btn-view .btn + .btn { margin-left: 5px; }
	.semakan-carian-card { padding: 20px; }
	.table tr td, .table tr th { padding: 10px 16px; }
	.direktori-banner-describe h2 { font-size: 20px; }
	.direktori-banner-describe h6 { font-size: 16px; }
	.direktori-banner-list li { padding-right: 6px; }
	.direktori-banner-user-thumb img { width: 96px; height: 96px; }
	.direktori-banner-user-info h6 { margin-bottom: 10px; }
	.direktori-banner-user-info .direktori-banner-list li { margin-bottom: 6px; }
}

/* Article content title - fluid font size; long titles wrap, not draggable */
.article-content-title {
	font-size: clamp(22px, 5.5vw, 54px) !important;
	white-space: normal;
	word-wrap: break-word;
	overflow-wrap: break-word;
}
/* Prevent parent from clipping article title on mobile */
.article-title-row {
	overflow-x: visible;
}

@media (max-width: 479px) {
	.site-banner-wrap h1 {
		font-size: 26px !important;
		margin-bottom: 24px !important;
		margin-left: 0 !important;
		padding-left: 0 !important;
	}
	.site-header-main-content { display: none; }
	.site-logo-group { margin-right: 0; }
	.site-logo-group a { margin: 0 8px; }
	.footer-menu li { margin: 0 5px; }
	.direktori-banner-content { flex-direction: column-reverse; align-items: center;margin-left:0;gap:0; }
	.direktori-banner-user-info .direktori-banner-list li:last-child {display: flex;justify-content: flex-start;}
	.direktori-banner-describe { order: 1; }
	.direktori-banner-thumb { order: 2; }
	.semakan-form-inline .semakan-btn-group .btn + .btn { margin-left: 10px; }
	.direktori-modal-user-thumb { margin-right: 12px; margin-bottom: -24px; }
	.direktori-modal-user-thumb img { width: 80px; height: 80px; }
	.direktori-modal-user-info h4 { font-size: 16px; }
	.direktori-modal-user-info h6 { font-size: 14px; }
	.direktori-modal-list { padding-left: 92px; }
	.direktori-modal .modal-body { padding: 20px; }
	.direktori-modal .modal-header { padding-left: 20px; padding-right: 20px; min-height: 100px; }
	.direktori-banner-wrap .container { align-items: center; }
	.direktori-modal .modal-header .btn-close { right: 10px; top: 10px; }
	.nav-vertical-tabs { flex-wrap: nowrap; }
	.nav-vertical-tabs .nav-link, .nav-vertical-tabs .nav-link .tabs-text-sm { font-size: 10px; }
	.direktori-banner-user{display: flex;
        flex-direction: row;
        justify-content: center;
        position: relative;
        right: 0;
        max-width: 100%;
        flex-wrap: wrap;
		gap:40px;
	
	}
	.semakan-form-inline .semakan-btn-group 
	{
		margin-top: 0;
		display: flex;
		align-items: center;
		/* min-width: 310px; */
		flex-direction: column;
		gap: 10px;
	}

		/* .direktori-banner-thumb img{
			border-radius: 50%;
			border: white 1px solid;
			width: 130px;
			height: 130px;
			object-fit: normal;
			margin-top: 20px;
			background-color: white;
		} */

		.direktori-banner-describe .aos-init .aos-animate ul{
			padding-left: 0;
		}
}




/*new css 07-09-2023*/
.nav-horizontal-tabs {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	flex-wrap: wrap;
}
.nav-horizontal-tabs .nav-link {
	width: calc(100% - 0px);
}


/*devnderpal 05-09-2023*/
.nav-tabs-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	border-bottom: transparent;
}


.nav-tabs-wrapper .nav-item .nav-link {
	color: var(--color-default);
	text-align: center;
	font-family: var(--font-default);
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	border-radius: 20px;
	background: #fff;
	padding: 10px 15px;
	margin: 0 8px;
}

.nav-tabs-wrapper .nav-link:focus, .nav-tabs-wrapper .nav-link:hover {
	isolation: inherit;
	border: 1px solid #D697FF !important;
	background: #E8C5FF !important;
	border-radius: 20px !important;
}
.nav-tabs-wrapper .nav-item .active {
	border-radius: 20px;
	border: 1px solid #D697FF;
	background: #E8C5FF;
	color: #34234D;
}
.tebs-section {
	margin: 0 -10px;
	display: flex;
	flex-wrap: wrap;
}
.tebs-section .tebs-item {
	width: 33.33%;
	padding: 0 10px;
	margin-bottom: 20px;
}

.tebs-item-card {
	border-radius: 20px;
	border: 1px solid #D9D9D9;
	background: #FFF;
	padding: 24px;
}
.tebs-section .tebs-item .description {
	margin-bottom: 30px;
}
.tebs-item .description .sub-title {
	font-size: 13px;
	font-style: normal;
	font-family: var(--font-default);
	font-weight: 600;
	line-height: normal;
	color: var(--bs-secondary);
	position: relative;
	padding-left: 14px;
}
.tebs-item .description .sub-title:before {
	content: "";
	position: absolute;
	width: 7px;
	height: 7px;
	top: 4px;
	left: 0;
	border-radius: 100px;
	z-index: 1;
	background: var(--bs-secondary);
}

.tebs-item .description h3 {
    color: #3D3D3D;
    font-size: 20px;
    font-family: var(--font-default);
    font-style: normal;
    font-weight: 700;
    line-height: 22.1px;
    margin-top: 7px;
    height: 67px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
}


.tebs-section .tebs-item .footer-item {
	display: flex;
	justify-content: space-between;
	width: 100%;
	align-items: center;
}
.tebs-section .tebs-item .footer-item p {
	color: #6D6D6D;
	font-size: 13px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	margin-bottom: 0px;
}
.button-link {
	border-radius: 20px;
	border: 1px solid var(--bs-primary);
	background: #F4EDF9;
	color: var(--bs-primary);
	text-align: center;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
}
.button-link:hover {
	border: 1px solid var(--bs-primary);
	background: var(--bs-primary);
	color: #fff;
}
.features-sms-wrap {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	padding-top: 0px;
	text-align: center;
}
.features-sms-wrap .features-item {
	width: 100%;
}
.features-sms-wrap .features-item .icon {
	width: 100%;
}

.features-sms-wrap .features-item h3 {
	color: var(--bs-primary);
	text-align: center;
	font-family: var(--font-balgrim);
	font-size: 26px;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
	width: 100%;
	margin-top: 24px;
	margin-bottom: 9px;
}

.features-sms-wrap .features-item p {
	width: 100%;
	color: var(--color-default);
	text-align: center;
	font-family: var(--font-default);
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}

.button-wrapper {
	width: 100%;
	margin-top: 98px;
}

.button-icon {
	border-radius: 25px;
	background: var(--bs-primary);
	color: #FFF;
	text-align: center;
	font-family: var(--font-default);
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	padding: 10.5px 50px;
}
.button-icon:hover {
	background: #CECECE;
	color: #000;
}
.form-makluma .form-control {
	border-bottom: solid #7931A8 1px;
}
.nav-horizontal-tab-krpuadan {
	margin-bottom: 37px;
}
.section-maklum .head {
	max-width: 610px;
	margin: 0 auto;
	text-align: center;
}
.section-maklum .head p {
	color: #6D6D6D;
	font-family: var(--font-default);
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
}
.form-grup label {
	color: var(--bs-primary);
	font-family: var(--font-default);
	font-size: 10px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}
.form-grup .form-control {
	padding-top: 0px;
}
.hidden {
	overflow: hidden;
	opacity: 0;
	height: 0px;
}
.calendar-addon {
	margin-top: 7px;
}
.form-star-lable {
	padding: 20px;
	max-width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 5px;
}
.form-star-lable:nth-of-type(odd) {
	border-radius: 5px;
	background: #F4EDF9;
}

.form-star-lable:nth-of-type(even) {
	border-radius: 5px;
	background: rgba(237, 237, 237, 0.46);
}
.form-star-lable .lable-star {
	color: #494949;
	font-family: var(--font-default);
	font-size: 15px;
	font-style: normal;
	font-weight: 600;
	line-height: 18px;
	width: calc(100% - 40%);
}

.form-star-lable .star-box label {
	color: #6D6D6D;
	text-align: center;
	font-family: Inter;
	font-size: 11px;
	font-style: italic;
	font-weight: 500;
	line-height: normal;
	max-width: 60px;
}
.form-star-lable .star-box {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 40%;
	flex-wrap: wrap;
}
.form-star-lable .star-box svg {
	margin: 0 5px;
}
.form-star-lable:nth-of-type(odd) .star-box svg {
	fill: #FFD465;
	stroke-width: 2px;
	stroke: #4A007D;
}

.w-max-100 {
	max-width: 100%;
}
.calendar-input .form-control {
	min-width: 100%;
}

.form-textare textarea {
	border-radius: 0px;
	background: rgba(237, 237, 237, 0.46);
	height: 113px;
}
.form-textare {
	margin-top: 44px;
}

/*.form-tab-btn-view {*/
	/*max-width: 395px;*/
	/*margin: 40px auto 0;*/
/*}*/
/*.form-tab-btn-view .btn-primary {*/
	/*width: 100%;*/
/*}*/
.mt-34 {
	margin-top: 34px;
}


/*  Media Queries */
@media only screen and (max-width: 1365px) {



}

@media only screen and (max-width: 1199px) {
	.nav-horizontal-tabs .nav-link {font-size: 14px;}
	.tabs-thumb img {width: 25px;}
	.tebs-item .description h3 {font-size: 16px;}
}

@media only screen and (max-width: 991px) {
	.button-link {font-size: 14px;padding: 6.5px 18px;}
	.tebs-section .tebs-item {width: 50%;}

}
@media only screen and (max-width: 767px) {
	.tebs-section {display: block;}
	.tebs-section .tebs-item {width: 100%;}
	.vertical-hor-tab-content {display: block;max-width: 100%;}
	.vertical-hor-tab-content .tab-content {width: 100%;padding-left: 0;}
	.nav-vertical-tabs {width: 100%;justify-content: center;display: flex;flex-direction: unset;}
	.nav-vertical-tabs .nav-link {font-size: 14px;}
	.site-footer .site-footer-container {max-width: 100%;margin: 0px;display: block;}
	.copy-right {text-align: center;}
	.nav-horizontal-tabs .nav-item {border-bottom: solid #eee 1px;width: 100%;margin: 5px 0;}
	.nav-horizontal-tabs .nav-link {margin-bottom: 10px;}
	.features-sms-wrap {margin-top: 50px;}
	.button-icon {padding: 10.5px 32px;font-size: 14px;}
	.form-star-lable {
		justify-content: center;
		flex-flow: wrap;
	}

	.form-star-lable .star-box {
		justify-content: center;
	}

	.form-star-lable .lable-star {
		width: 100%;
		text-align: center;
		margin-bottom: 13px;
	}

	ul#stars_two,ul#stars_one, ul#stars_three,ul#stars_five,ul#stars {
		margin-top: 10px;
	}

}

@media only screen and (max-width: 575px) {


}

/* ramnivas kushwah css 06-09-203 */
.breadcrumb-main{
	height: 395px;
	position: relative;
}
.breadcrumb-main::before{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	content: "";
	background: url(../../images/wtw_images/learning-bg-hero-before.png);
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
}

.overlay-bg {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(224, 175, 255, 0.70);
}
.breadcrumb-img-logo {
	position: relative;
	text-align: center;
	transform: translate(0%, 70%);
}
.quick-learning-tabs-main .nav-horizontal-tabs {
	justify-content: space-around;
	padding: 0px 60px;
	margin-bottom: 117px;
}
.quick-learning-tabs-main .semakan-form-inline .semakan-btn-group {
	min-width: 142px;
}
.form-selbox{
	width: 142px;
	margin-left: auto;
}


.form-selbox .select2-container--default .select2-selection--single{
	border-radius: 25px;
	border: 1px solid #7931A8;
	padding: 13px 29px;
	color: #9E9E9E;
	font-family: 'Inter';
	font-size: 16px;
	font-weight: 700;
}

.form-selbox .select2-container .select2-selection--single .select2-selection__rendered {
	padding-left: 0px;
	padding: 0;
	overflow: inherit;
}
.form-selbox .select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 8px;
	right: 14px;
}


.quick-learning-btnbox {
	display: flex;
	align-items: center;
}
.quick-learning-btnbox label{
	color: #9E9E9E;
	font-family: 'Inter';
	font-size: 14px;
	font-weight: 500;
}
.quick-learning-tabs-main .nav-horizontal-tabs .nav-link{
	padding: 12px 50px;
}

.video-box{
	position: relative;
	height: 227px;
	border-radius: 3px;
	background: #D9D9D9;
}
.vi-icon {
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
}
.vi-icon-time-box{
	position: absolute;
	right: 13px;
	bottom: 9px;
	border-radius: 44px;
	background: #34234D;
}
.vi-icon-time-box h2{
	margin: 0;
	color: #FFF;
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	padding: 2px 10px;
	font-family: 'Inter';
}
.box-video-content{
	display: flex;
	justify-content: space-between;
	margin-top: 11px;
	margin-bottom: 34px;
}
.vi-like-content-right ul{
	display: flex;
	padding: 10px 15px;
	border-radius: 35px;
	background: #F3F3F3;
}

.vi-like-content-right ul li{
	list-style: none;
	margin-right: 34px;
}
.vi-like-content-right ul li:last-child{margin-right: 0;}
.vi-bottom-content p{
	color: #6D6D6D;
	font-family: 'Inter';
	font-size: 18px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	margin-bottom: 10px;
}
.vi-bottom-content span{
	color: #6D6D6D;
	font-family: 'Inter';
	font-size: 13px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}
.fastlike-box{
	position: relative;
}
.fastlike-box::before{
	height: 100%;
	border-right: 1px solid;
	position: absolute;
	right: -16px;
	bottom: 0;
	content: "";
}
.vi-like-content-right ul li a i{
	color: #A09CAD;
	font-size: 18px;
}
.vi-like-content-right ul li a img{
	width: 13px;
}
.submenu-link:hover, .submenu-link:focus {
    color: var(--color-secondary);
}

@media only screen and (max-width: 992px) {
	.form-selbox {
		width: 122px;
	}

	.quick-learning-tabs-main .nav-horizontal-tabs {
		margin-bottom: 40px;
	}


}

@media only screen and (max-width: 768px) {
	.quick-learning-tabs-main .semakan-carian-content {
		margin-top: 30px;
	}
	.breadcrumb-img-logo img{
		width: 50%;
	}
	.site-btn-action{
	top : 55%;
	}
	.direktori-banner-list li {
	    width: 100%;
	}
	.main-btn{
     font-size: 13px;
}


}

@media only screen and (max-width: 575px) {
	.breadcrumb-main {
		height: 300px;
	}
	.direktori-banner-list li {
    padding-right: 0;
}
	.infographics-slider .slick-prev, .infographics-slider .slick-next {
    right: 0 !important;
    top: -9% !important;
    transform: initial;
    z-index: 9;
}
.sec-title, .infographics-title {
    font-size: 24px;
}
.infographics-slider .slick-prev {
    left: auto !important;
    right: 43px !important;
}
.infographics-heade .btn-secondary {
    margin-right: 130px;
}
.infographics-heade {
    margin-bottom: 10px;
}
.infographics-slide .glightbox img {
    width: 100%;
    height: auto !important;
}
}
/* ramnivas kushwah Email Template css 08-09-203 */

.email-template-content {
	display: flex;
}
.left-tablecontent{
	background: #d9edf6;
	width: 20%;

}
.left-tablecontent p{
	color: #232d36;
	font-weight: 700;
}
.right-tablecontent{
	background: #fff;
	width: 80%;
}
.right-tablecontent p{
	color: #4d4d4d;
}
.email-template-content p{
	border-top: 1px solid #e0e0e0;
	margin: 0;
	padding: 11px;
}
.email-template-main h4{
	color: #2a2a2a;
	font-size: 16px;
}

.email-template-content{
	border-bottom: 1px solid #e0e0e0;
	border-left: 1px solid #e0e0e0;
	border-right: 1px solid #e0e0e0;
}
.inner-content{
	border-right: 1px solid #e0e0e0;
}
.email-template-conte-bottom{
	margin-top: 20px;
}

.email-template-conte-bottom h5{
	margin-top: 40px;
	color: #2a2a2a;
	font-size: 16px;
}
@media only screen and (max-width: 1200px) {
	.vi-bottom-content p {
		font-size: 16px;
	}
}
@media only screen and (max-width: 992px) {
	.form-selbox {
    width: 100%;
}
.site-btn-action{ z-index: 999;}
	.left-tablecontent {
		width: 40%;
	}
	.right-tablecontent {
		width: 60%;
	}
}


.nofound {
	text-align: center;
	font-size: 14px;
	color: gray;
	font-weight: 500;
	width: 100%;
	margin-bottom: 20px;
}

/*stars css 11-09-2023*/
* {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

*:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.clearfix {
	clear:both;
}

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

a {
	color: tomato;
	text-decoration: none;
}

a:hover {
	color: #2196f3;
}

pre {
	display: block;
	padding: 9.5px;
	margin: 0 0 10px;
	font-size: 13px;
	line-height: 1.42857143;
	color: #333;
	word-break: break-all;
	word-wrap: break-word;
	background-color: #F5F5F5;
	border: 1px solid #CCC;
	border-radius: 4px;
}

.header {
	padding:20px 0;
	position:relative;
	margin-bottom:10px;

}

.header:after {
	content:"";
	display:block;
	height:1px;
	background:#eee;
	position:absolute;
	left:30%; right:30%;
}

.header h2 {
	font-size:3em;
	font-weight:300;
	margin-bottom:0.2em;
}

.header p {
	font-size:14px;
}



#a-footer {
	margin: 20px 0;
}

.new-react-version {
	padding: 20px 20px;
	border: 1px solid #eee;
	border-radius: 20px;
	box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);

	text-align: center;
	font-size: 14px;
	line-height: 1.7;
}

.new-react-version .react-svg-logo {
	text-align: center;
	max-width: 60px;
	margin: 20px auto;
	margin-top: 0;
}





.success-box {
	margin:50px 0;
	padding:10px 10px;
	border:1px solid #eee;
	background:#f9f9f9;
}

.success-box img {
	margin-right:10px;
	display:inline-block;
	vertical-align:top;
}

.success-box > div {
	vertical-align:top;
	display:inline-block;
	color:#888;
}



/* Rating Star Widgets Style */
.rating-stars ul {
	list-style-type:none;
	padding:0;

	-moz-user-select:none;
	-webkit-user-select:none;
}
.rating-stars ul > li.star {
	display:inline-block;

}

/* Idle State of the stars */
.rating-stars ul > li.star > i.fa {
	font-size: 19px;
	color: #ffff;
	-webkit-text-stroke-width: 2px;
	-webkit-text-stroke-color: rgb(74, 0, 125);
}

/* Hover state of the stars */
.rating-stars ul > li.star.hover > i.fa {
	color:#FFCC36;
}

/* Selected state of the stars */
.rating-stars ul > li.star.selected > i.fa {
	color:#FF912C;
}

/*slidercaptcha*/
.slidercaptcha {
	margin: 0 auto;
	width: 314px;
	height: 286px;
	border-radius: 4px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.125);
	margin-top: 40px;
}

.slidercaptcha .card-body {
	padding: 1rem;
}

.slidercaptcha canvas:first-child {
	border-radius: 4px;
	border: 1px solid #e6e8eb;
}

.slidercaptcha.card .card-header {
	background-image: none;
	background-color: rgba(0, 0, 0, 0.03);
}

.refreshIcon {
	top: -54px;
}
/*select2-container*/
.select2.select2-container { width: 100% !important; }
.select2-container .select2-selection--single { height: 42px; display: flex; flex-direction: column; justify-content: flex-end; }
.select2-container--default .select2-selection--single { background-color: transparent; border: 0 none; border-bottom: solid 1px #494949; border-radius: 0; }
.select2-container .select2-selection--single .select2-selection__rendered { padding: 4px 24px 4px 4px; }
.select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--color-default); line-height: 1; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 24px; width: 24px; top: auto; bottom: 0; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { border: 0 none; background: url("../../images/wtw_images/icon-arrow-down.svg") no-repeat center; width: 12px; height: 7px; transition: all 0.2s ease-in-out; }
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { transform: rotate(180deg); }
.select2-dropdown { border-color: #E7C3FF; }
.select2-container--default .select2-results__option--selected,
.select2-container--default .select2-results__option[aria-selected=true] { background-color: #EED4FF; }
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable,
.select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: var(--bs-primary); }
.select2-results__option { padding: 4px 20px; }
.select2-container--default .select2-search--dropdown .select2-search__field:focus, .select2-container--default .select2-search--dropdown .select2-search__field:focus-visible { border-color: #E7C3FF; }
.select2-container--default .select2-search--dropdown .select2-search__field:focus-visible { outline: none; }

/*Image remove*/
#files-area{ display: flex; align-items: center; justify-content: center; }
.file-block{
	border-radius: 10px;
	background-color: rgba(144, 163, 203, 0.2);
	margin: 5px;
	color: initial;
	display: inline-flex;
	max-width: 100%;
	flex-shrink: 1;
}
.file-block > span.name{
	padding-right: 10px;
	display: inline-flex;
	align-items: center;
	max-width: 200px;
	min-width: 0;
}
.file-block > span.name > span.name-text{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	flex-shrink: 1;
	min-width: 0;
}
.file-block > span.name > span.name-ext{
	flex-shrink: 0;
	white-space: nowrap;
}
.file-block > span.name > span.name-size{
	flex-shrink: 0;
	white-space: nowrap;
	margin-left: 2px;
}
.file-delete{
	display: flex;
	width: 24px;
	color: initial;
	background-color: #6eb4ff00;
	font-size: large;
	justify-content: center;
	margin-right: 3px;
	cursor: pointer;
}

.file-delete:hover{ background-color: rgba(144, 163, 203, 0.2); border-radius: 10px; }
.file-delete > span{ transform: rotate(45deg); }
#files-names { display: flex; align-items: center; flex-wrap: wrap; }
.btn:focus, .btn:hover {
	color: #ffff !important;
}
input.error,textarea.error {
	border-bottom: solid 1px red;
}
.site-section.padingviewslider {
  padding: 0px;
}
#myTab {
  /* padding-top: 100px; */
}

.textword {
    padding-top: 24px;
    padding-left: 19px;
	width: 100%;

}
.alert.alert-success {
    margin-top: 50px;
}
p.help-block.help-block-error {
	color: red;
}
.error-class .error {
	display: none !important;
}
.error-class label {
	color: red;
}

.error-class .select2-selection--single{
	border-bottom: 1px solid red;
}
.error-class .form-control,.error-class textarea{
	border-bottom: 1px solid red;
}

/* ramnivas kushwah css 06-09-203 */
.breadcrumb-main{
	height: 395px;
	position: relative;
}
.breadcrumb-main::before{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	content: "";
	background: url(../../images/wtw_images/learning-bg-hero-before.png);
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
}

.overlay-bg {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(224, 175, 255, 0.70);
}
.breadcrumb-img-logo {
	position: relative;
	text-align: center;
	transform: translate(0%, 70%);
}
.quick-learning-tabs-main .nav-horizontal-tabs {
	justify-content: space-around;
	padding: 0px 60px;
	margin-bottom: 117px;
}
.quick-learning-tabs-main .semakan-form-inline .semakan-btn-group {
	min-width: 142px;
}
.form-selbox{
	width: 142px;
	margin-left: auto;
}


.form-selbox .select2-container--default .select2-selection--single{
	border-radius: 25px;
	border: 1px solid #7931A8;
	padding: 13px 29px;
	color: #9E9E9E;
	font-family: 'Inter';
	font-size: 16px;
	font-weight: 700;
}

.form-selbox .select2-container .select2-selection--single .select2-selection__rendered {
	padding-left: 0px;
	padding: 0;
	overflow: inherit;
}
.form-selbox .select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 8px;
	right: 14px;
}


.quick-learning-btnbox {
	display: flex;
	align-items: center;
}
.quick-learning-btnbox label{
	color: #9E9E9E;
	font-family: 'Inter';
	font-size: 14px;
	font-weight: 500;
}
.quick-learning-tabs-main .nav-horizontal-tabs .nav-link{
	padding: 12px 50px;
}

.video-box{
	position: relative;
	height: 227px;
	border-radius: 3px;
	background: #D9D9D9;
}
.vi-icon {
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
}
.vi-icon-time-box{
	position: absolute;
	right: 13px;
	bottom: 9px;
	border-radius: 44px;
	background: #34234D;
}
.vi-icon-time-box h2{
	margin: 0;
	color: #FFF;
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	padding: 2px 10px;
	font-family: 'Inter';
}
.box-video-content{
	display: flex;
	justify-content: space-between;
	margin-top: 11px;
	margin-bottom: 34px;
}
.vi-like-content-right ul{
	display: flex;
	padding: 10px 15px;
	border-radius: 35px;
	background: #F3F3F3;
}

.vi-like-content-right ul li{
	list-style: none;
	margin-right: 34px;
}
.vi-like-content-right ul li:last-child{margin-right: 0;}
.vi-bottom-content p{
	color: #6D6D6D;
	font-family: 'Inter';
	font-size: 18px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	margin-bottom: 10px;
}
.vi-bottom-content span{
	color: #6D6D6D;
	font-family: 'Inter';
	font-size: 13px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}
.fastlike-box{
	position: relative;
}
.fastlike-box::before{
	height: 100%;
	border-right: 1px solid;
	position: absolute;
	right: -16px;
	bottom: 0;
	content: "";
}
.vi-like-content-right ul li a i{
	color: #A09CAD;
	font-size: 18px;
}
.vi-like-content-right ul li a img{
	width: 13px;
}

.gallery .vi-like-content-right ul li a img{
	width: 23px;
}


@media only screen and (max-width: 992px) {
	.form-selbox {
		width: 122px;
	}

	.quick-learning-tabs-main .nav-horizontal-tabs {
		margin-bottom: 40px;
	}


}

@media only screen and (max-width: 768px) {
	.quick-learning-tabs-main .nav-tabs {
    padding-top: 0px !important;
}
.semakan-btn-group .btn img {
    margin-right: 0px;
    margin-left: 7px;
}
	.quick-learning-tabs-main .semakan-carian-content {
		margin-top: 30px;
	}
	.breadcrumb-img-logo img{
		width: 50%;
	}

}

@media only screen and (max-width: 575px) {
	.quick-lea-main .quick-learning-tabs-main .select2-selection--single {
    z-index: 9;

}
.box-video-content {
    margin: 23px 0;
}
	.breadcrumb-main {
		height: 300px;
	}
}
/* ramnivas kushwah Email Template css 08-09-203 */

.email-template-content {
	display: flex;
}
.left-tablecontent{
	background: #d9edf6;
	width: 20%;

}
.left-tablecontent p{
	color: #232d36;
	font-weight: 700;
}
.right-tablecontent{
	background: #fff;
	width: 80%;
}
.right-tablecontent p{
	color: #4d4d4d;
}
.email-template-content p{
	border-top: 1px solid #e0e0e0;
	margin: 0;
	padding: 11px;
}
.email-template-main h4{
	color: #2a2a2a;
	font-size: 16px;
}

.email-template-content{
	border-bottom: 1px solid #e0e0e0;
	border-left: 1px solid #e0e0e0;
	border-right: 1px solid #e0e0e0;
}
.inner-content{
	border-right: 1px solid #e0e0e0;
}
.email-template-conte-bottom{
	margin-top: 20px;
}

.email-template-conte-bottom h5{
	margin-top: 40px;
	color: #2a2a2a;
	font-size: 16px;
}
@media only screen and (max-width: 1200px) {
	.vi-bottom-content p {
		font-size: 16px;
	}
}
@media only screen and (max-width: 992px) {
	.left-tablecontent {
		width: 40%;
	}
	.right-tablecontent {
		width: 60%;
	}
}


.nofound {
	text-align: center;
	font-size: 14px;
	color: gray;
	font-weight: 500;
	width: 100%;
}

/*stars css 11-09-2023*/
* {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

*:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.clearfix {
	clear:both;
}

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

a {
	color: rgb(24, 24, 24);
	text-decoration: none;
}

a:hover {
	color: #2196f3;
}

pre {
	display: block;
	padding: 9.5px;
	margin: 0 0 10px;
	font-size: 13px;
	line-height: 1.42857143;
	color: #333;
	word-break: break-all;
	word-wrap: break-word;
	background-color: #F5F5F5;
	border: 1px solid #CCC;
	border-radius: 4px;
}

.header {
	padding:20px 0;
	position:relative;
	margin-bottom:10px;

}

.header:after {
	content:"";
	display:block;
	height:1px;
	background:#eee;
	position:absolute;
	left:30%; right:30%;
}

.header h2 {
	font-size:3em;
	font-weight:300;
	margin-bottom:0.2em;
}

.header p {
	font-size:14px;
}



#a-footer {
	margin: 20px 0;
}

.new-react-version {
	padding: 20px 20px;
	border: 1px solid #eee;
	border-radius: 20px;
	box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);

	text-align: center;
	font-size: 14px;
	line-height: 1.7;
}

.new-react-version .react-svg-logo {
	text-align: center;
	max-width: 60px;
	margin: 20px auto;
	margin-top: 0;
}





.success-box {
	margin:50px 0;
	padding:10px 10px;
	border:1px solid #eee;
	background:#f9f9f9;
}

.success-box img {
	margin-right:10px;
	display:inline-block;
	vertical-align:top;
}

.success-box > div {
	vertical-align:top;
	display:inline-block;
	color:#888;
}



/* Rating Star Widgets Style */
.rating-stars ul {
	list-style-type:none;
	padding:0;

	-moz-user-select:none;
	-webkit-user-select:none;
}
.rating-stars ul > li.star {
	display:inline-block;

}

/* Idle State of the stars */
.rating-stars ul > li.star > i.fa {
	font-size: 19px;
	color: #ffff;
	-webkit-text-stroke-width: 2px;
	-webkit-text-stroke-color: rgb(74, 0, 125);
}

/* Hover state of the stars */
.rating-stars ul > li.star.hover > i.fa {
	color:#FFCC36;
}

/* Selected state of the stars */
.rating-stars ul > li.star.selected > i.fa {
	color:#FF912C;
}

/*slidercaptcha*/
.slidercaptcha {
	margin: 0 auto;
	width: 314px;
	height: 286px;
	border-radius: 4px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.125);
	margin-top: 40px;
}

.slidercaptcha .card-body {
	padding: 1rem;
}

.slidercaptcha canvas:first-child {
	border-radius: 4px;
	border: 1px solid #e6e8eb;
}

.slidercaptcha.card .card-header {
	background-image: none;
	background-color: rgba(0, 0, 0, 0.03);
}

.refreshIcon {
	top: -54px;
}
/*select2-container*/
.select2.select2-container { width: 100% !important; }
.select2-container .select2-selection--single { height: 42px; display: flex; flex-direction: column; justify-content: flex-end; }
.select2-container--default .select2-selection--single { background-color: transparent; border: 0 none; border-bottom: solid 1px #494949; border-radius: 0; }
.select2-container .select2-selection--single .select2-selection__rendered { padding: 4px 24px 4px 4px; }
.select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--color-default); line-height: 1; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 24px; width: 24px; top: auto; bottom: 0; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { border: 0 none; background: url("../../images/wtw_images/icon-arrow-down.svg") no-repeat center; width: 12px; height: 7px; transition: all 0.2s ease-in-out; }
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b { transform: rotate(180deg); }
.select2-dropdown { border-color: #E7C3FF; }
.select2-container--default .select2-results__option--selected,
.select2-container--default .select2-results__option[aria-selected=true] { background-color: #EED4FF; }
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable,
.select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: var(--bs-primary); }
.select2-results__option { padding: 4px 20px; }
.select2-container--default .select2-search--dropdown .select2-search__field:focus, .select2-container--default .select2-search--dropdown .select2-search__field:focus-visible { border-color: #E7C3FF; }
.select2-container--default .select2-search--dropdown .select2-search__field:focus-visible { outline: none; }

/*Image remove*/
#files-area{ display: flex; align-items: center; justify-content: center; }
.file-block{
	border-radius: 10px;
	background-color: rgba(144, 163, 203, 0.2);
	margin: 5px;
	color: initial;
	display: inline-flex;
	max-width: 100%;
	flex-shrink: 1;
}
.file-block > span.name{
	padding-right: 10px;
	display: inline-flex;
	align-items: center;
	max-width: 200px;
	min-width: 0;
}
.file-block > span.name > span.name-text{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	flex-shrink: 1;
	min-width: 0;
}
.file-block > span.name > span.name-ext{
	flex-shrink: 0;
	white-space: nowrap;
}
.file-block > span.name > span.name-size{
	flex-shrink: 0;
	white-space: nowrap;
	margin-left: 2px;
}
.file-delete{
	display: flex;
	width: 24px;
	color: initial;
	background-color: #6eb4ff00;
	font-size: large;
	justify-content: center;
	margin-right: 3px;
	cursor: pointer;
}

.file-delete:hover{ background-color: rgba(144, 163, 203, 0.2); border-radius: 10px; }
.file-delete > span{ transform: rotate(45deg); }
#files-names { display: flex; align-items: center; flex-wrap: wrap; }
.btn:focus, .btn:hover {
	color: #ffff !important;
}
input.error,textarea.error {
	border-bottom: solid 1px red;
}
.site-section.padingviewslider {
  padding: 0px;
}
#myTab {
  padding-top: 10px;
}

.textword {
    padding-top: 24px;
    padding-left: 19px;
	width: 100%;

}
.alert.alert-success {
    margin-top: 50px;
}
p.help-block.help-block-error {
	color: red;

}
.error-class .error {
	display: none !important;
}
.error-class label {
	color: red;
}

.error-class .select2-selection--single{
	border-bottom: 1px solid red;
}
.error-class .form-control,.error-class textarea{
	border-bottom: 1px solid red;
}




/*Quick learning Css*/

/* ramnivas kushwah css 06-09-203 */
.breadcrumb-main{
	height: 395px;
	position: relative;
}
.breadcrumb-main::before{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	content: "";
	background: url(../../images/wtw_images/learning-bg-hero-before.png);
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
}

.overlay-bg {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(224, 175, 255, 0.70);
}
.breadcrumb-img-logo {
	position: relative;
	text-align: center;
	transform: translate(0%, 70%);
}
.quick-learning-tabs-main .nav-horizontal-tabs {
	justify-content: space-around;
	padding: 0px 60px;
	margin-bottom: 117px;
}
.quick-learning-tabs-main .semakan-form-inline .semakan-btn-group {
	min-width: 142px;
}
.form-selbox{
	width: 142px;
	margin-left: auto;
}


.form-selbox .select2-container--default .select2-selection--single{
	border-radius: 25px;
	border: 1px solid #7931A8;
	padding: 13px 29px;
	color: #9E9E9E;
	font-family: 'Inter';
	font-size: 16px;
	font-weight: 700;
}

.form-selbox .select2-container .select2-selection--single .select2-selection__rendered {
	padding-left: 0px;
	padding: 0;
	overflow: inherit;
}
.form-selbox .select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 8px;
	right: 14px;
}


.quick-learning-btnbox {
	display: flex;
	align-items: center;
}
.quick-learning-btnbox label{
	color: #9E9E9E;
	font-family: 'Inter';
	font-size: 14px;
	font-weight: 500;
}
.quick-learning-tabs-main .nav-horizontal-tabs .nav-link{
	padding: 12px 50px;
}

.video-box{
	position: relative;
	height: 227px;
	border-radius: 3px;
	background: #D9D9D9;
}
.vi-icon {
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
}
.vi-icon-time-box{
	position: absolute;
	right: 13px;
	bottom: 9px;
	border-radius: 44px;
	background: #34234D;
}
.vi-icon-time-box h2{
	margin: 0;
	color: #FFF;
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	padding: 3px 10px;
	font-family: 'Inter';
}
.box-video-content{
	display: flex;
	justify-content: space-between;
	margin-top: 11px;
	margin-bottom: 34px;
}
.vi-like-content-right ul{
	display: flex;
	padding: 10px 15px;
	border-radius: 35px;
	background: #F3F3F3;
	width: 140px;
	justify-content: center;
}



.vi-like-content-right ul li{
	list-style: none;
	margin-right: 34px;
	display: flex;
}
.vi-like-content-right ul li a{
	margin-right: 3px;
}
.vi-like-content-right ul li:last-child{margin-right: 0;}
.vi-bottom-content p{
	color: #6D6D6D;
	font-family: 'Inter';
	font-size: 18px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	margin-bottom: 5px;
}
.vi-bottom-content span{
	color: #6D6D6D;
	font-family: 'Inter';
	font-size: 13px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
}
.fastlike-box{
	position: relative;
}
.fastlike-box::before{
	height: 100%;
	border-right: 1px solid;
	position: absolute;
	right: -16px;
	bottom: 0;
	content: "";
}



.vi-like-content-right ul li a img {
	margin-top: -4px;
}


@media only screen and (max-width: 992px) {
	.form-selbox {
		width: 122px;
	}

	.quick-learning-tabs-main .nav-horizontal-tabs {
		margin-bottom: 40px;
	}


}

@media only screen and (max-width: 768px) {
	.quick-learning-tabs-main .semakan-carian-content {
		margin-top: 30px;
	}
	.breadcrumb-img-logo img{
		width: 50%;
	}

}

@media only screen and (max-width: 575px) {
	.breadcrumb-main {
		height: 300px;
	}

}
/* ramnivas kushwah Email Template css 08-09-203 */

.email-template-content {
	display: flex;
}
.left-tablecontent{
	background: #d9edf6;
	width: 20%;

}
.left-tablecontent p{
	color: #232d36;
	font-weight: 700;
}
.right-tablecontent{
	background: #fff;
	width: 80%;
}
.right-tablecontent p{
	color: #4d4d4d;
}
.email-template-content p{
	border-top: 1px solid #e0e0e0;
	margin: 0;
	padding: 11px;
}
.email-template-main h4{
	color: #2a2a2a;
	font-size: 16px;
}

.email-template-content{
	border-bottom: 1px solid #e0e0e0;
	border-left: 1px solid #e0e0e0;
	border-right: 1px solid #e0e0e0;
}
.inner-content{
	border-right: 1px solid #e0e0e0;
}
.email-template-conte-bottom{
	margin-top: 20px;
}

.email-template-conte-bottom h5{
	margin-top: 40px;
	color: #2a2a2a;
	font-size: 16px;
}
@media only screen and (max-width: 1200px) {
	.vi-bottom-content p {
		font-size: 16px;
	}
}
@media only screen and (max-width: 992px) {
	.left-tablecontent {
		width: 40%;
	}
	.right-tablecontent {
		width: 60%;
	}
}




/* Email Template end */

/* ramnivas kushwah Email Template css 21-09-203 */
.tabs-video-page .active i{
	color: #4CB74A !important;
}

.video-secendteb{
	border-radius: 20px;
	border: 1px solid #D9D9D9;
	background: #FFF;
	padding: 21px 16px 16px 16px;
	margin-bottom: 20px;
}

.video-secendteb .box-video-content {
	display: block;
	margin: 0;
}
.video-secendteb .box-video-content .vi-like-content-right {
	width: 171px;
}

.video-secendteb .fastlike-box::before {
	right: 0;
	left: 0;
	transform: translate(75%, 0px);
}
.video-secendteb .vi-like-content-right ul {
	justify-content: space-between;
	margin-bottom: 0;
}
.video-secendteb .vi-bottom-content p {
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 3px;
}

.btnbuka a{
	border-radius: 20px;
	border: 1px solid #7931A8;
	background: #F4EDF9;
	padding: 9px 25px;
	color: #7931A8;
	font-size: 16px;
	font-weight: 600;
}

.btnbuka a:hover{
	border: 1px solid #7931A8;
	background: #4A007D;
	color: #fff;
}

.secendt-btn {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.video-secendteb .vi-bottom-content {
	margin-bottom: 31px;
}

.video-play-inner{
	height: 627px;
}

/* ramnivas date 22-09-2023 */
.video-right-side-content{
	border-top: 1px solid #A09CAD;
	padding-top: 17px;
}

.video-right-side-content h3{
	color: #494949;
	font-size: 16px;
	font-weight: 700;
	margin-bottom: 19px;
}

.video-right-side-content .video-box{
	height: 126px;
}
.video-right-side-content .vi-like-content-right ul {
	padding: 8px 13px;
	width: 129px;
}

.video-right-side-content .vi-like-content-right ul li {
	display: flex;
}

.video-right-side-content .vi-like-content-right li a{
	margin-right: 3px;
}

.video-right-side-content .vi-bottom-content p {
	font-size: 15px;
	font-weight: 700;
}

.video-right-side-content .vi-bottom-content span {
	font-size: 13px;
	font-weight: 500;
}
.video-right-side-content .vi-like-content-right{
	margin-top: 19px;
}
.inner-play-vton{
	display: flex;
}
.vrt-bottom-content{
	width: 60%;
}
.vrt-bottom-content .video-box {
	height: 167px;
}

.top-conte {
	background: #fff;
	margin-left: 25px;
}




.module-gallery .slider-thumb {
	height: 627px;
	overflow: hidden;
}
.border-top-sider .slick-list{
	border-top: 1px solid #A09CAD;
	padding-top: 40px;
}

.module-gallery .vi-like-content-right ul li {
	display: flex;
	align-items: center;
	margin-bottom: 0;
}
.inner-play-vton .vi-like-content-right ul {
	padding: 9px 13px;
	width: 128px;
	margin-top: 25px;
}
.inner-play-vton .vi-bottom-content p {
	font-size: 15px;
}
.inner-play-vton .vi-bottom-content p {
	font-size: 13px;
}
.module-gallery .slider-thumb .slick-prev,
.module-gallery .slider-thumb .slick-next {
	z-index: 1;
	height: 1em;
	width: 100%;
	background-color: #000;
	opacity: 0.3;
	transition: opacity 300ms ease;
	font-size: 1.5em;
	color: #fff;

}

.headin {
	position: absolute;
	right: 27%;
	color: #494949;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	z-index: 9;
	top: 15px;
	margin-bottom: 30px;
}
.btn-paly {
	border-radius: 25px;
	background: #7931A8;
	color: #FFF;
	text-align: center;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 42px;
	width: 395px;
	height: 45px;
	display: block;
	margin: 0 auto;
	margin-top: 30px;
}
.btn-paly:hover{color: #fff;
	text-decoration: none;
}
.btn-paly img{
	margin-left: 5px;
}
@media (max-width: 1360px) {
	.headin {
		right: 26%;
	}
}
@media (max-width: 1200px) {
	.headin {
		right: 25%;
	}
}
@media (max-width: 991px) {
	.headin {
		display: none;
	}
	.module-gallery .slider-preview {
		width: 100%;
	}
	.module-gallery .slider-thumb {
		width: 100%;
	}

	.module-gallery .slider-wrapper {
		display: block;
	}

	.video-play-inner {
		height: 417px;
	}
}

/* <!-- third slider -->   */
.gallery-page-main-play .headin{
	position: relative;
	right: 0;
}
.gallery {
	display: flex;
	justify-content: space-between;
}

.gallery iframe,
.gallery span {
	width: 100%;
	height: 100%;
}
.gallery a {
	display: block;
	text-decoration: none;
}
.gallery a:hover{
	text-decoration: none;
}
.gallery a:last-child {
	margin-bottom: 5px;
}
.gallery iframe,
.gallery img {
	max-width: 100%;
	vertical-align: middle;
}
.gallery-page-main-play .fast-to{
	display: flex;
	align-items: center;
}

.gallery-page-main-play .vi-like-content-right ul li span {
	font-size: 15px;
	margin-left: 4px;
}


.paly-contenr-youto {
	margin-top: 21px;
}


.quick-play-video-notplay .vi-like-content-right ul li a {
	margin-right: 0;
}


.paly-contenr-youto {
	display: flex;
	width: 100%;
	justify-content: space-between;
}
.vi-iconto {
	height: 126px;
	border-radius: 3px;
	background: #D9D9D9;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative !important;
}



.vi-iconto::before{
	display: none !important;
}
.paly-contenr-youto::before{
	display: none !important;
}
.vi-icon-time-box {
	position: absolute !important;
	right: 10px;
	height: 0px;
	bottom: 34px;
}
.vi-icon-time-box h2 {
	color: #FFF;
	text-align: center;
	font-size: 12px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	margin: 0;
	padding: 5px 11px;
	border-radius: 44px;
	background: #34234D;
}

.vi-icon-time-box::before{
	display: none !important;
}
.video-box-t::before{
	display: none !important;
}

.trebottom-content::before{
	display: none !important;
}
.trebottom-content p{
	color: #6D6D6D;
	font-size: 15px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	text-decoration: none;
	margin-bottom: 0;
}

.trebottom-content span {
	color: #6D6D6D;
	font-size: 13px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	display: block;
	position: relative;
	text-decoration: none;
}



.mai-likebtn {
	display: flex;
	list-style: none;
	padding: 0;
	margin: 0;
}

.mai-likebtn a{
	margin: 0;
}

.left-contentplay-box {
	width: 60%;
	height: 470px;
	border-radius: 3px;
}
.left-contentplay-box iframe{
	height: 620px;
}

.right-contentplay-box {
	width: 40%;
	height: 470px;
	overflow-x: hidden;
	margin-left: 15px;
	border-top: 1px solid#A09CAD;
}

.video-box-t {
	width: 199px;
	margin-right: 13px;
}

.gallery-page-main-play .vi-like-content-right ul {
	display: flex;
	padding: 5px 10px;
	width: 129px;
	justify-content: space-between;
	align-items: center;
	margin-top: 30px;
	margin-bottom: 0;
}


.gallery-page-main-play .trebottom-content {
	width: 54%;
}
.vi-like-content-right ul li span{
	font-size: 12px;
}

.left-contentplay-box .vi-like-content-right ul {
	margin-top: 0px;
}

.left-contentplay-box .vi-like-content-right ul li a img {
	width: auto !important;
}
.gallery .left-contentplay-box .vi-like-content-right ul li a img {
	width: 23px !important;
}

.stlike-eys.vi-like-content-right ul li a img {
    width: 22px;
}
.stlike-eys.vi-like-content-right ul li span {
    font-size: 15px;
}
.stlike-eys.vi-like-content-right ul {
	width: 140px;
}

.video-secendteb .stlike-eys .fastlike-box::before {
    transform: translate(47%, 0px);
}

.left-contentplay-box .vi-like-content-right ul li {
	display: flex;
}

.quick-learning-details-inner{
	border-top: 1px solid #A09CAD;
	margin-bottom: 30px;
}

.top-icon-quick-play{
	padding: 0;
	margin: 15px 0;
}
.top-icon-quick-play li{
	list-style: none;
	display: flex;
	align-items: center;
}
.top-icon-quick-play li span{
	color: #494949;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	margin-left: 9px;
}

.quick-learning-details-inner .video-secendteb .box-video-content .vi-like-content-right {
	width: 154px;
}

.quick-play-video-notplay .nav-link {
	padding: 0;
}

.quick-play-video-notplay .nav-link .trebottom-content{
	text-align: left;
}

.quick-play-video-notplay .nav-pills .nav-link.active{
	color: #ffffff;
	border-color: none;
	background-color: #ffffff;
	box-shadow: none;
	text-align: left;
}
.quick-play-video-notplay .fastlike-box::before {
	border-right: 1px solid #000;
}

@media(max-width: 992px){
	.gallery {
		display: block;
	}
	.left-contentplay-box {
		width: 100%;
		height: 400px;
	}
	.right-contentplay-box {
		width: 100%;
		height: auto;
		margin-left: 0px;
	}
	.paly-contenr-youto {
		justify-content: left;
	}
	.left-contentplay-box iframe {
		height: 380px;
	}
	.left-contentplay-box {
		height: 499px;
	}
}


.swiper {
	width: 100%;
	height: 100%;
}

.swiper-slide {
	text-align: center;
	font-size: 18px;
	background: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
}

.swiper-slide img {
	display: block;
	object-fit: cover;
	width: 100%;
}

.swiper .box-video-content{
	text-align: left;
}

.swiper .vi-like-content-right ul li {
	display: flex;
}
.swiper .gallery-page-main-play .vi-like-content-right ul {
	display: flex;
	margin-top: 0px !important;
}
.swiper .vi-like-content-right ul li a img {
	margin: 0;
}

.swiper .vi-like-content-right ul{
	margin-top: 0px;
}

.quick-play-video-notplay .swiper-pagination {
	position: absolute;
	bottom: 90px;
	width: 66px;
	margin: 0 auto;
	right: 0;
	left: 0;
	border-radius: 44px;
	background: #34234D;
	color: #fff;
	padding: 5px 10px;
}
.quick-play-video-notplay .swiper-button-next:after{
	content: "";
}
.quick-play-video-notplay .swiper-button-prev:after{
	content: "";
}

.quick-play-video-notplay .nav{
	border-top: 1px solid #A09CAD;
}
.quick-play-video-notplay .headin{
	margin-bottom: 11px;
}
.quick-play-video-notplay .swiper-button-next{
	background: #4CB74A;
	border: 1px solid #4CB74A;
	height: 30px;
	width: 30px;
	border-radius: 10px;
	color: #000;
}

.quick-play-video-notplay .swiper-button-prev{
	background: #4CB74A;
	border: 1px solid #4CB74A;
	height: 30px;
	width: 30px;
	border-radius: 10px;
	color: #000;
}

.quick-play-video-main .vi-like-content-right ul li a {
	margin-right: 0px;
}

@media(max-width: 992px){
	.quick-play-video-notplay .headin{
		display: inline-block;
		width: 100%;
	}
}
@media(max-width: 700px){
	.semakan-form-inline {
		align-items: center !important;
		padding: 0 40px;
		
	}
	

	.quick-learning-tabs-main .nav-horizontal-tabs .nav-link {
		padding: 3px 15px;
	}
	.quick-learning-tabs-main .nav-horizontal-tabs {
		margin-bottom: 40px;
		overflow-y: auto;
	}
	.quick-learning-tabs-main .nav-horizontal-tabs {
		flex-wrap: inherit;
		padding: 0;
	}

}

@media(max-width: 575px){
	.btn-paly {
		width: auto;
	}
	.video-box-t {
		width: 137px;
		margin-right: 8px;
	}
	.gallery-page-main-play .vi-like-content-right ul {
		padding: 5px 7px;
		width: 115px;
		margin-top: 15px;
	}
	.box-video-content {
		display: block;
		margin-bottom: 34px;
	}
	.vi-like-content-right ul {
		width: 137px;
		margin-top: 10px;
	}
	.fastlike-box::before {
		right: -20px;
	}
	.swiper .box-video-content {
		display: flex;
	}
	.left-contentplay-box .box-video-content {
		display: flex;
	}
	.video-secendteb .fastlike-box::before {
		transform: translate(55%, 0px);
	}

	.vi-like-content-right ul li {
		margin-right: 28px;
	}
	.left-contentplay-box {
		height: 482px;
	}
	.quick-lea-main{
		z-index: inherit;
	}
	.quick-lea-main .quick-learning-tabs-main .select2-selection--single{
		position: relative;
		z-index: 999;
		background: #fff;
	}
	.quick-lea-main .semakan-carian-content{
		position: relative;
		z-index: 999;
	}
}


@media(max-width: 380px){
	/* .quick-le-sm{
		padding-right: 0;
	} */
	stlike-eys.vi-like-content-right ul {
    margin: 20px auto;
}

}




.infographics-slider .slick-prev,
.infographics-slider .slick-next {
    right: -40px;
    top: 50%;
    transform: initial;
    z-index: 9;
}

.infographics-slider .slick-prev {
    left: -40px;
    right: auto;
}

.infographics-thumb-slide {
    width: 33.33% !important; /* //33.33% */
    padding: 4px;
    margin-bottom: 10px;
    height: auto;
    float: none;
}

.infographics-heade {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.infographics-heade .btn-secondary {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color: var(--bs-btn-color);
}

.infographics-heade .btn img,
.btn img {
    margin-right: 0px;
    margin-left: 0px;
}

.personalization-card-content {
    transition: all 0.4s ease-in-out;
    height: 100%;
    overflow: hidden;
    position: relative;
    width: 100%;
    background-color: #FF9AA2;
    display: flex;
    flex-direction: inherit;
    align-items: flex-start;
}

.personalization-card-content h3 {
    transition: all 0.4s ease-in-out;
    color: #34234D;
    z-index: 1;
    font-size: 40px;
    line-height: 1.2;
    margin-bottom: 0;
    padding-left: 20px;
}


.style-switcher {
    position: fixed;
    top: 35%;
    transition: .4s ease-in-out;
    background-color: #fff;
    left: -220px;
    width: 220px;
    padding: 0;
    z-index: 1010;
    box-shadow: 0 0 25px rgba(0, 0, 0, 0.1)
}

.style-switcher .css-trigger {
    position: absolute;
    top: 37%;
    transform: translateY(-50%);
    right: -50px;
    width: 50px;
    background-color: #2d4767;
    color: #fff;
    border-radius: 0 3px 3px 0;
    text-align: center;
    line-height: 55px;
    height: 50px;
    font-size: 24px;
    cursor: pointer
}

.style-switcher .css-trigger a {
    color: #fff
}

.style-switcher.active {
    left: 0
}

/* 22-11-2023*/
.site-btn-action-list {
    list-style: none;
    padding-left: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    float: right;
    display: flex;
}

.language-btn {
    position: relative;
    color: var(--bs-primary);
    font-family: var(--font-balgrim);
    font-size: 12px;
    padding: 10px 24px;
    display: block;
    cursor: pointer;
    top: 97px;
    right: 28px;
    transform: translate(10px, -57px);
    /* width: 125px; */
	min-width: 150px;
    width: auto; 
	white-space: nowrap;
	text-align: center;
    line-height: normal;
}

.language-box {
    position: absolute;
    right: -26px;
    top: 91px;
}

.language-btn:before {
    content: '';
    position: absolute;
    right: 42px;
    top: -46px;
    z-index: -1;
    transform: rotate(-90deg);
    width: 43px;
    height: 133px;
    background: url("../../images/wtw_images/bahasa-btn-background.png") no-repeat center;
    background-size: 100%;
}
.semakan-form-inline .semakan-btn-group .btn img {
    filter: brightness(0) invert(1) !important;
}

.language-toggle-btn:before {
    content: '';
    position: absolute;
    right: 76px;
    top: -23px;
    z-index: -1;
    transform: rotate(-90deg);
    width: 55.004px;
    height: 181.631px;
    background: url("../../images/wtw_images/bahasa-btn.svg") no-repeat center;
    background-size: 100%;
    z-index: 1;
}

.switch {
    position: relative;
    display: block;
    margin: 0;
    transform: translate(-95px, 40px) rotate(-90deg);
    z-index: 2;
}

.language-toggle-btn a {
    color: #CECECE;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    font-family: var(--font-balgrim);
}


.language-toggle-btn a:last-child span {
    position: relative;
    top: 6px;
}

.language-toggle-btn a.active {
    color: var(--bs-primary);
}

.switch>span {
    position: absolute;
    top: 14px;
    font-family: var(--font-default);
    pointer-events: none;
    font-weight: bold;
    font-size: 14px;
    width: 50%;
    text-align: center;
}

.switch input.check-toggle-round-flat:checked~.off {
    color: #7931A8;
}

.switch input.check-toggle-round-flat:checked~.on {
    color: #CECECE;
}

.switch>span.on {
    left: 0;
    padding-left: 2px;
    color: #7931A8;
    text-align: center;
    font-family: var(--font-default);
    font-size: 14px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    transform: rotate(-90deg);
}

.switch>span.off {
    right: 0;
    padding-right: 4px;
    color: #CECECE;
    text-align: center;
    font-family: var(--font-default);
    font-size: 14px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    transform: rotate(-90deg);
}

.check-toggle {
    position: absolute;
    margin-left: -9999px;
    visibility: hidden;
}

.check-toggle+label {
    display: block;
    position: relative;
    cursor: pointer;
    outline: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.switch input.check-toggle-round-flat+label {
    width: auto;
    height: auto;
    background-color: transparent;
}

.switch input.check-toggle-round-flat+label:before,
input.check-toggle-round-flat+label:after {
    display: block;
    position: absolute;
    content: "";
}

.switch input.check-toggle-round-flat+label:before {
    top: 2px;
    left: 2px;
    bottom: 2px;
    right: 2px;
    background-color: transparent;
}

.switch input.check-toggle-round-flat+label:after {
    top: 0;
    left: 4px;
    bottom: 0;
    -webkit-transition: margin 0.2s;
    -moz-transition: margin 0.2s;
    -o-transition: margin 0.2s;
    transition: margin 0.2s;
}

.switch input.check-toggle-round-flat:checked+label {}

.switch input.check-toggle-round-flat:checked+label:after {
    margin-left: 44px;
}

.colorswitcher {
    position: absolute;
    right: -124px;
    top: 111px;
}

.language-btn img {
    margin-right: 6px;
}

.colors-witcher-btn {
    position: relative;
    color: var(--bs-primary);
    font-family: var(--font-balgrim);
    font-size: 12px;
    padding: 10px 0px;
    display: block;
    cursor: pointer;
    top: 0;
    right: 0;
    transform: translate(11px, 20px);
}

.colors-witcher-btn:before {
    content: '';
    position: absolute;
    right: 60px;
    top: -77px;
    z-index: -1;
    transform: rotate(-90deg);
    width: 43px;
    height: 189px;
    background: url("../../images/wtw_images/bahasa-btn-background-lg.png") no-repeat center;
    background-size: 100%;
    transform: translate(14px, 3px) rotate(-90deg);
}

.colors-toggle:before {
    content: '';
    position: absolute;
    right: -97px;
    top: -29px;
    width: 55.004px;
    height: 247.494px;
    background: url("../../images/wtw_images/bahasa-color.svg") no-repeat center;
    background-size: 100%;
    transform: translate(-99px, -47px) rotate(-90deg);
    z-index: 1;
}

.toggle-body {
    position: relative;
    width: 97px;
    top: 37px;
    left: 165px;
    height: 100%;
    transform: translate(-184px, 60px);
    z-index: 2;
}

.toggle-btn {
    width: 2rem;
    height: 2rem;
    position: absolute;
    top: -68px;
    right: 54px;
    border-radius: 2rem;
    background: url("../../images/wtw_images/color.svg");
    cursor: pointer;
    transform: translateX(0);
}

.text-box {
    width: 2rem;
    height: 2rem;
    position: absolute;
    top: -70px;
    left: 56px;
    transform: rotate(-90deg);
}

.font-size-nav {
	list-style: none;
    margin: 0px;
    padding: 0px;
    clear: both;
    transform: translate(120px, -100px) rotate(-90deg);
    width: 2rem;
}

.site-btn-action-list .font-size-nav a {
	padding: 0px;
    font-size: 0px;
    display: block;
    line-height: 26px;
    margin: 0px;
}

.site-btn-action {
    position: fixed;
    right: 0;
    top: 50%;
    z-index: 99;
    transform: translate(131px, 50%) rotate(90deg);
}

@-webkit-keyframes angle {
    0% {
        transform: rotate(0deg);
    }

    50% {
        transform: rotate(45deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

@keyframes angle {
    0% {
        transform: rotate(0deg);
    }

    50% {
        transform: rotate(45deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

@-webkit-keyframes angle-reverse {
    0% {
        transform: rotate(0deg);
    }

    50% {
        transform: rotate(-45deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

@keyframes angle-reverse {
    0% {
        transform: rotate(0deg);
    }

    50% {
        transform: rotate(-45deg);
    }

    100% {
        transform: rotate(0deg);
    }
}


.language-btn:hover {
    color: #fff;
}
.language-btn:hover img {
    filter: brightness(0) invert(1);
}
.language-btn-btn:hover:before {
    filter: contrast(110%);
}
.colors-witcher-btn:hover {
    color: #fff;
}
.colors-witcher-btn:hover img {
    filter: brightness(0) invert(1);
}
.colors-witcher-btn:hover:before {
    filter: contrast(110%);
}

#cloud-container {
    margin-top: 50px;
    width: 100%;
    display: block;
}
.pl-20 {
    padding-left: 20px;
}
.mb-100 {
    margin-bottom: 100px;
}

.Address_sub_two p {
    margin-bottom: 5px;
}

.switch-colors {
    display: inline-block;
    width: 60px;
    height: 34px;
    position: absolute;
    top: -67px;
    right: 44px;
}
/* Hide default HTML checkbox */
.switch-colors input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.switch-colors .slider {
    position: absolute;
    cursor: pointer;
    top: -3px;
    left: -1px;
    right: 0;
    bottom: 0;
    background-image: url(../../images/wtw_images/green_line.PNG);
    -webkit-transition: 0.4s;
    transition: 0.4s;
    width: 40px;
    height: 40px;
    background-size: cover;
    transform: rotate(-89deg);
	box-shadow: none  !important;
}

.switch-colors .slider:before {
    position: absolute;
    content: "";
    width: 14px;
    left: 7px;
    bottom: 4px;
    top: 9px;
    bottom: 0;
    margin: auto 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    /* box-shadow: 0 0px 15px #2020203d; */
    background-image: url(../../images/wtw_images/purple.svg);
    background-repeat: no-repeat;
    background-size: 100%;
    height: 34px;
	box-shadow: none  !important;
}

/*input:checked + .slider {
  background-color: #2196f3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196f3;
}
*/
.switch-colors input:checked + .slider:before {
    -webkit-transform: translateX(24px);
    -ms-transform: translateX(24px);
    transform: translatey(-3px);
    background-repeat: no-repeat;
    background-position: center;
    right: auto;
    background-image: url(../../images/wtw_images/darkpurple.svg);
    left: 17px;
	top:7px;
}
#increasetext {
	font-size: 1.50em;
}

#resettext {
	font-size: 1.25em;
}

#decreasetext {
	font-size: 1.125em;
}


/* Rounded sliders */

/*
.slider.round:before {
  border-radius: 50%;
}*/

/*08-12-2023*/
.language-btn:hover {
    color: #fff;
}
.language-btn:hover img {
    filter: brightness(0) invert(1);
}
.language-btn-btn:hover:before {
    filter: contrast(110%);
}
.colors-witcher-btn:hover {
    color: #fff;
}
.colors-witcher-btn:hover img {
    filter: brightness(0) invert(1);
}
.colors-witcher-btn:hover:before {
    filter: contrast(110%);
}
.Address_sub_two p {
    margin-bottom: 5px;
}
.direktori-staf-address-list li {
    margin-bottom: 5px;
}
.direktori-staf-address address {
    display: flex;
    align-items: flex-start;
    font-size: 15px;
    font-weight: 500;
    color: #494949;
    margin-bottom: 0;
	width: max-content;
}

.direktori-staf-address-list li a {
    display: flex;
    align-items: center;
    color: #494949;
    font-size: 15px;
    font-weight: 500;
    white-space: nowrap;
}
.switch-font {
    width: 2rem;
    height: 2rem;
    position: absolute;
    top: -67px;
    left: 50px;
    transform: rotate(-90deg);
    cursor: pointer;
    font-size: 0px !important;
    line-height: normal;
}
.switch-colors .slider:hover {
    background-color: transparent;
}
.switch-font input {
    display: none;
}
span.on:hover {
    color: var(--bs-primary);
}
span.off:hover {
    color: var(--bs-primary);
}



@keyframes btRotate {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}


.btn.is-loading {
	cursor: no-drop;
}
.button__content {
	transition: opacity 0.2s ease-in-out;
}
.is-loading .button__content {
	opacity: 0;
}
.btn:disabled{
	background-color: #4A007D !important;
}
.btn-loader {
	position: absolute;
	top: 50%;
	left: 60%;
	margin: -16px 0 0 -16px;
	width: 32px;
	height: 32px;
	border: 2px solid #fff;
	border-left-color: #4CB74A;
	border-radius: 50%;
	transition: all 0.3s;
	animation: btRotate 0.6s infinite linear;
}
.news-years-row{

	gap:20px;
	display:flex;
	justify-content:center;
}

ul.nav.nav-tabs.news-years-row li {
  display: inline-block;
  margin-right: 10px;
	border-radius: 20px;
	border: 1px solid #D697FF;
	background: #E8C5FF;
	width: 106px;
	height: 36px;
	flex-shrink: 0;
	display:flex;
	justify-content: center;
	align-items: center;

    /* Add more styles for the li elements as needed */
}

ul.nav.nav-tabs.news-years-row li:focus a{
	border: 1px solid #D697FF;
	background: #E8C5FF;


}
.description-news-page{
	color: #ac7f7f;
	font-family: Inter;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;


}


.article-title-news-list {
	color: #34234D;

}
.article-title-news-list a{
	color: #34234D;

}
.date-view{

	max-width: 238px;
	min-height: 25px;
	border-radius: 44px;
	background: #34234D;
	color:#FFF;
	margin-bottom:20px;
	margin-left:10px;
	display:flex;
	justify-content:center;
	align-items:center;
}
.date-view.font{

	font-size:20px;
	padding:10px;


}
/* footer-navbar css */
.site-footer-container row {

	color: #3D3D3D;
	outline:1px solid green;

}
/* .nav-link-timbalan-dasar:hover{

	background-color: #12cdea;
	color: #ffffff;
    border-color: var(--bs-primary) !important;
	background-color: #12cdea;
	box-shadow: 0 0 10px #BD88DF !important;
} */


/* berita */
h1.header-articles-title {
    color: #0C090A;
	font-family: var(--font-balgrim);
	font-weight: bold;
	display: flex;
    justify-content: center;
}

.row-berita-img{
    /* padding-right: 200px;
    padding-left: 200px; */

}
#chat-bubble-open {

    width: 100px;
    height: 100px;
    border: none;
}



.dropdown-hover:hover>.dropdown-menu {
display: inline-block;
}

.dropdown-hover>.dropdown-toggle:active {
/*Without this, clicking will make it sticky*/
pointer-events: none;
}

.navbar-light .dropdown-menu {
    border: none;
    padding: 18px;
    max-width: 841px;
}
@media only screen and (min-width: 992px) {
  .dropdown:hover .dropdown-menu {
    display: inline-block;
  }
  .dropdown-menu.show {
    display: inline-block;
  }
  .navbar-expand-lg .navbar-nav .dropdown-menu {
    position: absolute;
    top: 48px;
    left: auto;
}
.dropdown-toggle::after {
    display: none;
    
 }

}
.navbar-expand-lg .navbar-nav .dropdown-menu ul {
    list-style: none;
    padding: 0 25px 0 0;

}
.navbar-expand-lg .navbar-nav .dropdown-menu:last-child ul {
    padding-right: 0px;
}

.navbar-expand-lg .navbar-nav .dropdown-menu ul li {
    padding: 0px;
}
.dropdown-menu li .dropdown-item {
    color: #A09CAD;
    font-family: var(--font-default);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    padding-bottom: 15px;
    padding-left: 0;
    padding-right: 0;
        white-space: inherit;
    
}

.navbar-light .dropdown-menu li .dropdown-item:hover {
    background-color: transparent;
    color: #7931a8;
}
.dropdown-menu .container blockquote{
    text-transform: uppercase;
    color: #34234D;
    font-family: var(--font-balgrim);
    font-size: 14px;
    font-style: normal;
    font-weight: 800;
    line-height: 18px;
    margin-bottom: 15px;
}
.dropdown-menu .container .list-group-item{
    border: transparent;
    padding-left: 0px;
    padding-right: 0px;
    color: #A09CAD;
   font-family: var(--font-default);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}
.dropdown-menu .container .list-group-item-action:focus, .list-group-item-action:hover {
    z-index: 1;
    text-decoration: none;
    background-color: transparent;
    color: var(--color-secondary) !important;
}

.dropdown-menu li:first-child a:hover {
    background: transparent !important;
}

.nav-search .js-search-open .bi-search {
    font-size: 24px;
    color: #fff;
}
.search-form-wrap {
    position: fixed;
	left: auto;
	right: 32px;
	top: 132px;
    z-index: 9;
    transition: 0.3s all ease;
    visibility: hidden;
    opacity: 0;
    width: 90%;
    max-width: 350px;
}
.js-search-form-wrap.js-active {
  display: block;
   visibility: inherit;
    opacity: 1;
}

.search-form-wrap .search-form {
  position: relative;
}

.search-form-wrap .search-form .form-control {
    width: 100%;
    max-width: 100%;
    border: none;
    box-shadow: 0 15px 20px -10px rgba(var(--color-black-rgb), 0.1);
    padding: 15px 15px 20px;
    padding-left: 51px;
    color: #6D6D6D;
    font-family: var(--font-default);
    font-size: 14px;
    font-style: italic;
    font-weight: 500;
    line-height: normal;
    position: relative;
    border-radius: 5px;
    background: #FFF;
    box-sizing: border-box;
}

.search-form-wrap .search-form .form-control:active,
.search-form-wrap .search-form .form-control:focus {
  outline: none;
  box-shadow: none;
      color: #000 !important;
}
.nav-search .js-search-open.js-active .bi-search {
    color: var(--color-primary);
}
.nav-search .js-search-open.js-active {
    border-bottom: solid 4px var(--color-primary);
}

.search-form-wrap .search-form .icon {
    position: absolute;
    top: 16px;
    left: 18px;
    color: #000;
    font-size: 20px;
    z-index: 9;
}

.search-form-wrap .search-form .btn {
  position: absolute;
  top: 2px;
  right: 4px;
  padding: 0;
  margin: 0;
  line-height: 1;
  font-size: 30px;
      color: #000 !important;
}
.search-form-wrap .search-form:after {
    content: "";
    position: absolute;
    width: 90%;
    height: 1px;
    background-color: #7931a8;
    top: 38px;
    left: 16px;
}

.search-form-wrap .search-form .btn:active,
.search-form-wrap .search-form .btn:focus {
  outline: none;
  color: #000 !important;
}

.search-form-wrap.active {
  visibility: visible;
  opacity: 1;
}




.header {position: fixed;top: 0;left: 0;width: 100%;height: auto;z-index: 100; margin: 0 auto;}
.brand {font-family: inherit; font-size: 1.6rem;font-weight: 700;line-height: 1.5;color: var(--pink-500);text-transform: uppercase; order: 1;}
.navbar {display: flex;flex-wrap: wrap;align-content: center;align-items: center;justify-content: space-between; width: 100%;margin: 0 auto;}
.navbar-left {display: flex;align-items: center;flex: 0 0 17%;display: none;}
.navbar-center {display: flex;}
.navbar-right {display: flex; flex: 0 0 17%;align-items: center; justify-content: flex-end;column-gap: 1.5rem;}
.menu-header { display: none;}
.menu-item {display: inline-block;line-height: 1.5; padding-right: 1.25rem;}
.menu-link > i.bx {font-size: 1.35rem;margin-left: 0.25rem;transform: rotate(90deg);}
.menu-icon {display: flex; align-items: center;justify-content: center; margin-top: 6px; font-size: 1.45rem;color: #000;transition: all 0.25s ease;}
.submenu {position: absolute;width: 100%; height: auto; margin-top: 1.75rem;padding:25px 10px; z-index: 100;opacity: 0; visibility: hidden;border-radius: 5px;background-color: #fff;transition: all 0.25s ease-in-out;}
.megamenu-column-4 .submenu-inner { flex: 0 0 25%;padding: 0 1rem;}
.megamenu-column-3 .submenu-inner {flex: 0 0 33%;padding: 0 1rem;}
.submenu-title {margin: 0px;color: #34234D; font-family: var(--font-balgrim);font-size: 14px;font-style: normal;font-weight: 800;line-height: 35px;transition: all 0.3s ease;}
.submenu-list .submenu-item {display: block;line-height: 1;margin: 0 auto;padding: 0px;}
.submenu-link { display: inline-block;padding: 7.5px 0; text-transform: capitalize;color: #514f4f;font-family: var(--font-default);font-size: 14px;white-space: inherit; font-style: normal;font-weight: 500; line-height: normal; /*transition: all 0.25s ease-in-out;*/}
.submenu-link:hover {color: var(--color-secondary);}
.submenu-image {display: block;width: 100%;height: auto;margin-block: 0.5rem; object-fit: cover;}
.megamenu-column-1 {left: auto;max-width: 15rem;width: 100%;height: auto;}
.megamenu-column-4 {display: flex;flex-wrap: wrap;max-width: 62rem;height: auto;margin: 0 auto;}
.megamenu-column-3 {display: flex;flex-wrap: wrap;max-width: 62rem;height: auto;margin: 0 auto;}
.megamenu {left: auto;width: 100%;height: auto;margin: 0 auto; margin-top: 3rem;/*  transform: translateX(-50%);*/}
.submenu-list { margin: 0px; padding: 0px;}
.navbar-center .overlay {position: fixed;display: block;top: 0; left: 0; width: 100%; height: 100%; z-index: 9;opacity: 0; visibility: hidden;background-color: rgba(0, 0, 0, 0.7);transition: all 0.45s ease-in-out;}
.burger {position: relative;display: block;cursor: pointer;width: 1.6rem;height: 1rem; margin-right: 1rem;opacity: 0;visibility: hidden; background: transparent;}
.burger-line {position: absolute; display: block; left: 0;width: 100%;height: 2px; opacity: 1;border-radius: 1rem;background: #fff;}
.burger-line:nth-child(1) {top: 0px;}
.burger-line:nth-child(2) { top: 0.5rem;width: 100%;}
.burger-line:nth-child(3) { top: 1rem;}
.navbar-light .navbar-nav .menu-link i {display: none;} 

@keyframes slideLeft {
  0% {
    opacity: 0;
    transform: translateX(100%);
  }
  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}
@keyframes slideRight {
  0% {
    opacity: 1;
    transform: translateX(0%);
  }
  100% {
    opacity: 0;
    transform: translateX(100%);
  }
}

@media only screen and (min-width: 993px) {
  .menu-dropdown:hover > .submenu {opacity: 1;visibility: visible;}
}


@media only screen and (max-width: 993px) {
  .navbar-light .navbar-nav .menu-link i {display: block;}
  .submenu { position: absolute;display: none;top: 0;left: 0;width: 100%; height: 100%;max-width: none;min-width: auto;margin: 0;padding: 1rem;padding-top: 4rem;opacity: 1; overflow-y: auto;visibility: visible;box-shadow: none;transform: translateX(0%);}
  .submenu.is-active { display: block;}
  .megamenu-column-3 .submenu-inner{ flex: 0 0 100%; padding: 0rem;}
  .megamenu-column-4 .submenu-inner{ flex: 0 0 100%;padding: 0rem;}
  .submenu-list { margin-bottom: 0;}
  .submenu-link {display: block; }
  .submenu-image {margin-top: 0;}
  .submenu{background-color: var(--color-secondary);}
  .submenu-title{color: #fff;}
  .submenu-link{color: #fff;}
  .submenu-link:hover { color: #fff;}
  .menu-header {position: relative; top: 0;display: flex;align-items: center;justify-content: flex-start;padding: 10px 29px; z-index: 110; visibility: hidden;background: transparent;}
  .menu-header.is-active {visibility: visible; background-color: #3b0062;}
  .menu-header.is-active > .menu-arrow {display: block;}
  .darkmode .menu-header.is-active { background-color: #000;}
  .menu-arrow { display: none;cursor: pointer; text-align: center;}
  .menu-arrow > i.bx {font-size: 1.5rem; line-height: 4rem; color: #000; transition: all 0.25s ease;}
  .darkmode .menu-arrow > i.bx {color: #fff;}
  .darkmode .menu-title {color: #000;}
  .menu-inner { height: 100%;margin-top: 0rem;overflow-y: auto;overflow-x: hidden;}
  .menu-item {display: block;line-height: 1; padding-inline: 0;}
  .navbar-light .navbar-nav .menu-link { justify-content: flex-start;line-height: 36px;padding: 0px;border-bottom:transparent;}
  .menu-link > i.bx {margin-left: 0.5rem; transform: rotate(0deg);}
  .megamenu {position: absolute; display: none;top: 0; left: 0;width: 100%; height: 100%;max-width: none;min-width: auto;margin: 0;padding: 1rem;padding-top: 4rem;opacity: 1; overflow-y: auto;visibility: visible;transform: translateX(0%);box-shadow: none;}
  .overlay.is-active { opacity: 1;visibility: visible;}
  .burger { opacity: 1;visibility: visible;}
  
  /* CRITICAL FIX: Remove scrollbar from navbar menus */
  .menu-inner {
    overflow-y: visible !important;
    overflow-x: visible !important;
    height: auto !important;
  }
  .megamenu {
    overflow-y: visible !important;
    overflow-x: visible !important;
    width: auto !important;
    min-width: fit-content !important;
  }
  .submenu {
    width: auto !important;
    min-width: fit-content !important;
  }
  .navbar-left, .navbar-right { flex: 0 0 auto;order: 2; display: flex !important; align-items: center; }
  .navbar-right {align-items: center;}
  .navbar-center {flex: 0 0 100%; order: 3;align-items: center;}
  .menu { position: fixed;top: 0; right: 0;left: auto; width: 95%;height: 100%;z-index: 100;overflow: hidden;transform: translate(135%);background-color: var(--color-secondary); transition: all 0.4s ease-in-out;}
  .menu.is-active { transform: translate(0%);}
  .navbar-nav li {padding: 10px 15px !important; border-bottom: solid 1px #ffffff30 !important;}
  .navbar-light .navbar-nav .menu-link.is-active{border-bottom: transparent;}
  .menu-arrow .btn-close {position: absolute; right: 17px; filter: brightness(0) invert(1); z-index: 999; top: 8px;opacity: 1;}
  .nav-search { display: flex !important; position: absolute; right: 0; top: 0; z-index: 1001; margin-left: 0; order: auto; }
  .nav-search a.js-search-open { display: flex !important; padding: 12px 15px !important; }
  /* Hide search when menu is open */
  .menu.is-active + .nav-search, .navbar.navbar-expand-lg .menu.is-active ~ .nav-search { display: none !important; visibility: hidden; }
  .navbar { min-height: 56px; }
  .container { position: relative; min-height: 56px; }
}




@media (min-width: 1200px){
.container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 1320px;
}
}


@media only screen and (max-width: 991px) {
      .dropdown-menu.show {
        flex-wrap: wrap;
        max-height: 350px;
        overflow-y: scroll;
        overflow-x: hidden;
      }
     .navbar-light .dropdown-menu {
        padding: 25px 7px;
        border-radius: 0px;
        background: transparent;
    }
    .dropdown-menu .container blockquote{color: #fff;}
    .dropdown-menu li .dropdown-item{color: #fff;  padding-left: 15px;}
	.search-form-wrap { left: auto; right: 12px; top: 132px; width: 90%; max-width: 350px; box-sizing: border-box; }
    .search-form-wrap .search-form .form-control { width: 100%; max-width: 100%; }
    .nav-search .js-search-open.active { border-bottom: transparent;}
    .mega_title1 {border-bottom: solid 1px #ffffff30; margin-bottom: 20px;}

}

.menu-left-lppkn{
    padding: 40px 0;
}
.menu-left-lppkn li{
    padding: 10px 0;
    border-bottom: dashed 1px black;
    padding-left:20px;
}
.menu-left-lppkn li a{
    color: #434c55;
    padding: 10px;
    padding-left:0 !important;
}
.menu-left-lppkn li.active{
    background-color: #1E88E5;
}
.menu-left-lppkn li.active a{
    color: white;
    font-weight: bold;
}