@media only screen and (max-width:800px) {
.hide_desktop{display:block !important; visibility:visible;}
.hide_mobile{display:none !important; visibility:hidden;}
#cd-lateral-nav::-webkit-scrollbar {width:6px; background:rgba(255,255,255,0.1);}
#cd-lateral-nav::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);}
#cd-lateral-nav::-webkit-scrollbar-thumb {background-color:var(--dark_gray);}
#cd-lateral-nav::-webkit-scrollbar:horizontal {height:6px;}
#cd-lateral-nav::-webkit-scrollbar:vertical {width:6px;}
#cd-menu-trigger {width:46px; height:56px; display:block; position:relative; float:left;}
#cd-menu-trigger .cd-menu-text {height: 100%;color:var(--black);font-weight: 600;display: none}	
#cd-menu-trigger .cd-menu-icon {
display: inline-block;
position: absolute;
left: 50%;
top: 50%;
bottom: auto;
right: auto;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-o-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
width: 18px;
height: 2px;
background-color: var(--black);
}
#cd-menu-trigger .teksmenu{ position: absolute;
font-size: 12px;
left: 25px;
top: -7px;}
#cd-menu-trigger .cd-menu-icon::before,
#cd-menu-trigger .cd-menu-icon:after {
content: '';
width: 100%;
height: 100%;
position: absolute;
background-color: inherit;
left: 0
}
#cd-menu-trigger .cd-menu-icon::before {
bottom: 6px;
}
#cd-menu-trigger .cd-menu-icon::after {
top: 6px;
}
#cd-menu-trigger.is-clicked .cd-menu-icon {
background-color: transparent
}
#cd-menu-trigger.is-clicked .cd-menu-icon::before,
#cd-menu-trigger.is-clicked .cd-menu-icon::after {
background-color: var(--black); 
}
#cd-menu-trigger.is-clicked .cd-menu-icon::before {
bottom: 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg)
}
#cd-menu-trigger.is-clicked .cd-menu-icon::after {
top: 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg)
}
#cd-lateral-nav {
position: fixed;
height: 100%;
left: 0;
top:0;
padding-top:56px;
padding-bottom:56px;
visibility: hidden;
/* the secondary navigation is covered by the main element */
z-index:5;
width:100%;
background-color:var(--white);
overflow-y: auto;
/* Force Hardware Acceleration in WebKit */
-webkit-transform: translateZ(0);
-webkit-backface-visibility: hidden;
-webkit-transition: -webkit-transform .4s 0s, visibility 0s .4s;
-moz-transition: -moz-transform .4s 0s, visibility 0s .4s;
transition: transform .4s 0s, visibility 0s .4s;
/* this creates the subtle slide in animation of the navigation */
-webkit-transform: translateY(-100%);
-moz-transform: translateY(-100%);
-ms-transform: translateY(-100%);
-o-transform: translateY(-100%);
transform: translateY(-100%);
}
#cd-lateral-nav .cd-navigation {margin:0;list-style:none; list-style-position:inside; padding:0;width:100%;}
#cd-lateral-nav .sub-menu {padding: 0;display: none;list-style:none; list-style-position:inside;border:none !important;}
#cd-lateral-nav ul li a {overflow:hidden;padding:12px 16px;color:var(--black);position:relative; font-size:16px; font-weight:600; display:flex;}
#cd-lateral-nav a:hover{color:var(--blue);}
#cd-lateral-nav a.current {color: var(--blue);}
.no-touch #cd-lateral-nav a:hover {color:var(--gray); background:var(--blue);}
#cd-lateral-nav .sub-menu a, .sub-menu li:first-child{border:none !important;}
#cd-lateral-nav .sub-menu a, .sub-menu li{padding:10px 46px;}
#cd-lateral-nav .sub-menu li{padding:0;}
#cd-lateral-nav.lateral-menu-is-open {
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
visibility: visible;
-webkit-transition: -webkit-transform .4s 0s, visibility 0s 0s;
-moz-transition: -moz-transform .4s 0s, visibility 0s 0s;
transition: transform .4s 0s, visibility 0s 0s;
-webkit-overflow-scrolling: touch;
box-shadow: 1px 1px 12px rgba(0,0,0,0.1);
}
#cd-lateral-nav .item-has-children > a {position: relative;/* this is the right arrow to show that the item has a submenu*/}
#cd-lateral-nav .item-has-children > a::after {
content: '';
height: 11px;
width: 11px;
position: absolute;
top:40%;
bottom: auto;
right:20px;
content:'\f107'; 
font-family: 'FontAwesome';
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
transition-property: transform;
-webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
transition-duration: 0.2s;
	display: flex; align-items:center; justify-content: center;
}
#cd-lateral-nav .item-has-children > a.submenu-open{color:var(--black);}
#cd-lateral-nav .item-has-children > a.submenu-open::after {transform: rotate(-180deg);}

#cd-lateral-nav .icon-menu{width:24px; height:24px; border-radius:12px;float:left; margin-right:5px; display:flex; align-items:center; justify-content:center; overflow:hidden;}
#cd-lateral-nav .icon-menu img{width:24px; height:24px;}
#cd-search{position:absolute; top:0; right:46px;width:32px; height:56px;display:inline-flex; justify-content:center; align-items:center; cursor:pointer;border-radius:16px; color:var(--black);}
#cd-search{font-size:18px !important;}
#cd-logo{margin:0 auto; height:56px; width:auto; font-size:30px; display:inline-flex; justify-content:flex-start; align-items:center; color:var(--white); font-weight:normal;padding:12px 0 12px 16px;}
#cd-logo img{height:32px;}
.box-search {top:56px; margin:0; height:auto;}
.box-search-in input.search{height:56px; padding-right:66px; font-size:16px;}
.box-search-in button.search-btn{height:56px; width:56px; font-size:16px;}
nav.menu{display:none;}
.header{height:56px; width:100%; margin:0 auto; position:fixed; top:0; left:0; right:0; z-index:20; background:var(--white); display:flex!important; justify-content:space-between; align-items:center;}
.header .header-in{max-width:1200px; margin:0 auto; position:relative; width:100%; height:56px;}
.cd-main-content{padding-top:56px;}
.cd-main-content.w-bot-menu{padding-bottom:56px;}
.mobile_scroll{overflow-y:scroll; padding-bottom:12px;}
.out-slider{padding: 16px 0 40px 0;}
.card-box.single_big{flex-direction:column;}
.card-box.single_big .img-card{width:100%; order:1; margin-bottom:16px;}
.card-box.single_big .text-card{width:100%;order:2;}
.card-box.single_big .text-card h2.title{ font-size:24px;}
ul.row-list.list_program_front li{width:50%; margin:8px 0;}
ul.tabs-menu{border-bottom:none; background:#f2f2f2;}
.tabs-menu li{border:none;}
.tabs-menu li a{font-size:16px; text-align:center; line-height:20px; background:#f2f2f2;}
.tabs-menu .current a{background:#fff;}
ul.row-list.list_kabar_front li{width:50%; margin:8px 0;}
.box-dokumen::before{display:none;}
.box-dokumen .col-6{width:100%;}
.box-dokumen .col-6.pertama{margin-bottom:32px;}
.out-slider{padding-bottom:32px;}
.blockbox{margin-bottom:16px;}
.box_kabar .card-box.single_big .text-card h2.title{font-size:24px;}
.blockbox h2.titlebox{font-size:24px;}
.blockbox h2.titlebox a.next{width:32px; height:32px;}
.box-angka .col-3{width:50%; height:90px; padding:8px 16px;}
.box-angka .card-box .text-card h2.title{font-size:40px;}
.box-angka .card-box .text-card h4.title{font-size:14px;}
.box-angka .col-3 .card-box .text-card{padding:4px 0;}
.footer .col-6{width:100%; display:flex; align-items:center; flex-direction:column;}
.bot_menu{margin:0 auto; text-align:center; margin-bottom:32px;}
.footer p.by{text-align:center !important; line-height:20px;}
ul.row-list.list_kabar_kanal {width:900px;}
.container_2col .col-8{width:100%; float:none;}
.container_2col .col-4{width:100%; float:none;}
.list_kabar_terbaru .card-box .img-card{width:90px; height:90px;}
.list_kabar_terbaru .card-box .img-card img{width:auto; height:90px;}
.list_kabar_terbaru .card-box .text-card h3.title{font-size:16px;}
.list_kabar_terbaru .card-box .text-card{padding:0 0 0 16px; min-height:90px;}
.box-title-detail h1.title{font-size:24px;}
ul.row-list.list_agenda_kanal li{width:100%;}
/*table*/
.rg-container {max-width: 600px;margin: 0 auto;}
table.rg-table {width: 100%;}
table.rg-table tr.hide-mobile,table.rg-table th.hide-mobile,table.rg-table td.hide-mobile {display: none;}
table.rg-table thead {display: none;}
table.rg-table tbody {width: 100%;}
table.rg-table tr,table.rg-table th,table.rg-table td {display: block;padding: 0;}
table.rg-table tr {border-bottom: none;margin: 0 0 1em 0;padding: 0.5em;}
table.rg-table tr.highlight {background-color: inherit !important;}
table.rg-table.zebra tr:nth-child(even) {background-color: transparent;}
table.rg-table.zebra td:nth-child(even) {background-color: #f6f6f6;}
table.rg-table tr:nth-child(even) {background-color: transparent;}
table.rg-table td {padding: 0.5em 0 0.25em 0;border-bottom: 1px dotted #ccc;text-align: right;}
table.rg-table td[data-title]:before {content: attr(data-title);font-weight: bold;display: inline-block;float: left;margin-right: 0.5em;font-size: 0.95em; color:var(--blue);}
table.rg-table td:last-child {padding-right: 0;border-bottom: 2px solid #ccc;}
table.rg-table td:empty {display: none;}
table.rg-table .highlight td {background-color: inherit;font-weight: normal;}
table.rg-table tr td{text-align:right;}
table.rg-table tr td:first-child{text-align:right;}

.detail_agenda table.rg-table td[data-title]:before{display:none;}
.detail_agenda table.rg-table td:last-child {border-bottom:inherit;}
.detail_agenda table.rg-table td{border-bottom:inherit;text-align:left;}
.detail_agenda table.rg-table tr {-moz-box-sizing: border-box;  box-sizing: border-box;  margin: 0;  padding: 0;  border: 0;  font-size: 100%;  font: inherit;  vertical-align: baseline;  text-align: left;  color:var(--black);}
.detail_agenda table.rg-table td {padding:12px 8px;  font-size:14px; line-height:20px;  font-weight:600;display:table-cell}
.detail_agenda table.rg-table tr td{text-align:left; padding:8px;}
ul.row-list.list_pengurus li{width:33.33%;}
}
@media only screen and (max-width:580px) {
.slider-kolom .slick-list{padding:0 20% 0 0;}
.box-dokumen .card-box .text-card h5.title{font-size:16px; height:auto;}
.box-subkanal{width:100%; white-space:nowrap; justify-content:center;}
.box-subkanal.leftmenu ul{justify-content:flex-start;}
.list_dokumen_terbaru .card-box{width:100%; margin-bottom:32px;}
.list_dokumen_terbaru .card-box .img-card{width:auto; height:120px; float:left; border-radius:10px; margin:0;}
.list_dokumen_terbaru .card-box .img-card img{width:auto; height:120px;object-fit:contain;}
.list_dokumen_terbaru .card-box .text-card{padding:0 0 0 16px; min-height:90px; display:flex; flex-direction:column; justify-content:center;}
.list_dokumen_terbaru .card-box .text-card h3.title{font-size:16px;}
.list_dokumen_terbaru .card-box .text-card p{display:none;}
.list_dokumen_terbaru .area_btn{display:none;}
ul.row-list.list_pengurus{justify-content:flex-start;}
ul.row-list.list_pengurus li{width:50%;}
ul.row-list.list_pengurus li .box-avatar .avatar{height:60px; width:60px; border-radius:50%; background:var(--soft); color:var(--gray);}
ul.row-list.list_pengurus li .box-avatar .avatar i{font-size:30px;}
ul.row-list.list_pengurus li .box-avatar .avatar img{width:auto; height:60px;}
.col100{width:100%; float:none;}
}

