html,body { height:100% }
body{font-family:var(--content);color:var(--color-body)}

header { position:sticky; top:0; z-index:99; background:var(--color-white); border-bottom:1px solid var(--color-light);}
header .center { display:flex; align-items: center; justify-content: space-between;}
header .center .logo { padding:30px 0 }
header .center .header-right {align-items: center; justify-content: space-between; display: flex;}
header .center .header-right .search-btn { text-align:center; border-right:1px solid var(--color-light); }
header .center .header-right .login-btn { text-align:center; border-right:1px solid var(--color-light); }
header .center .header-right .search-btn, header .center .header-right .lang-btn { position:relative; }
header .center .header-right .search-btn>a, header .center .header-right .lang-btn>a, header .center .header-right .login-btn>a  { display:block; padding:10px 20px; color:var(--color-main); }
header .center .header-right .search-btn>a { text-align: center;}
header .center .header-right .search-btn>a i { width:24px }
header .center .header-right .lang-btn a span { font-size:14px }
header .center .header-right .lang-btn a .fa-angle-down { font-size:12px }

header .header-right .lang-btn ul { top:50px; display: none; position: absolute;z-index: 999;background: var(--color-white); border-radius: 3px; list-style: none; box-shadow: 0 0 20px rgba(0,0,0,.15); padding:10px 0; right: 0; width: 110px;}
header .header-right .lang-btn ul li a { color:#000; font-size: 14px; font-weight: 500; display: block; padding: 5px 15px; }
header .header-right .lang-btn ul li a:hover { color:#037CC0; }
header .header-right .lang-btn { position: relative; }
header .header-right .lang-btn ul:before { position: absolute; top:-11px; content:'\f0d8'; left: 0; right: 0; display: block; font-weight: 600; font-family:'Font Awesome 5 Free'; color: var(--color-white); text-align: center;}

.sub-menu { width:100%; background:var(--color-white); position:absolute; left:0; right:0 }

.home-projects { background:var(--color-darkblue); margin-bottom:1px }
.home-projects .center { display:flex; align-items:center; align-items: center;}
.home-projects .project-box { width:33% }
.home-projects .project-box a { display:block; padding: 20px; display: flex; align-items: center; gap:20px; border-right:1px solid var(--color-blue); }
.home-projects .project-box:last-child a { border-right:none; }
.home-projects .project-box a:hover { background:var(--color-blue); }
.home-projects .project-box .icon { color:var(--color-lightblue); }
.home-projects .project-box h4 { font-size:18px; color:var(--color-white); }
.home-projects .project-box span { font-size:13px; color:var(--color-white); }

.sticky-btn { position:fixed; right:0; top:40%; z-index:99; width:70px; height:240px }


#p_overlay {display:flex;top:0;left:0;height:100%;width:100%;background:rgba(0,0,0,.8);overflow-y:auto;z-index:99999;position:fixed;align-items: center;justify-content: center;}
.p_content {overflow:none;z-index:99999;position:absolute;margin:auto;left:0;right:0;max-width:720px;}
.p_content img {width:100%;}
.p_content a.close {display:block;position:absolute;bottom:0;right:0;background:rgba(0,0,0,.5);color:var(--color-white);text-decoration:none;font-size:1em; padding:10px 15px;font-weight:bold;}

.search-area { border-bottom:1px solid var(--color-light); display:none; }
.search-area form { display:flex; }
.search-area input, .search-area button { margin:0 }
.search-area input { color:var(--color-body); border:none}
.search-area button { background:none; padding:0 20px; font-size:18px; color:var(--color-main); }
.search-area button:hover { color:var(--color-second); }

.search-404 .center { max-width:999px } 
.search-404 { display:flex; align-items:center; width:100%; height:100%;}
.search-404 .logo { max-width:200px; margin:40px auto }
.search-404 h1, .search-404 p { text-align:center; }
.search-404 form { display:flex; gap:20px; margin-bottom: 40px}
.search-404 input, .search-404 button { margin:0; border-radius:60px }
.search-404 button { width:60px; height: 60px; text-align:center; }

.newsletter-details .center { max-width:960px; text-align:center }
.newsletter-details .news-image img { border-radius:4px }
.newsletter-details i { font-size:24px; display:block; margin-bottom: 10px}

.memberships {margin-top:40px; }
.memberships p { font-size:14px !important}
.memberships .logos { display:flex; align-items:center; gap:20px}
.memberships .logo {}

.sasad-slider { position:relative; }
.slide-bottom { display:flex; justify-content: space-between; position:absolute;bottom:0; z-index: 9; left: 0; right: 0}
.slide-thumbs { bottom:0; right:0; width: 50%}
.slide { position:relative; }
.slide .overlay { position:absolute; z-index:9; width:100%; height:100%; top:0; left:0; right:0; bottom:0; display: flex; align-items: center;}
.slide .overlay .slide-content { max-width:720px }
.slide .overlay .slide-content span { font-size:48px; font-weight:900; font-family:var(--title); color: var(--color-white);display:block;}
.slide .overlay .slide-content p { font-size:20px; font-weight:400; font-family:var(--content); color: var(--color-white);}
.slide img { width:100% }
.slide.slick-active span{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;animation-name:fadeInDown;animation-delay:.3s}
.slide.slick-active p{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;animation-name:fadeInUp;animation-delay:.7s}
.slide.slick-active .btn{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;animation-name:fadeInUp;animation-delay:.9s}
.slide-nav {width: 50%; display:flex; justify-content: flex-end; align-items: center;}
.slide-nav .nav-btns { max-width:720px; width: 100%; padding:0 30px; display: flex; gap:1px}
.slide-nav .nav-btns span { display:block; width:42px; height:42px; line-height:42px; text-align:center; font-size:18px; color:var(--color-white); background: var(--color-second); cursor: pointer;}
.slide-nav .nav-btns span:hover { background:var(--color-main); }
.slide-thumbs .thumb { position:relative; cursor:pointer;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;animation-name:fadeInUp;animation-delay:.4s }
.slide-thumbs .thumb .overlay { position:absolute; z-index:9; width:100%; height:100%; top:0; left:0; right:0; bottom:0; display: flex; align-items: center; background: var(--dark-transparent);}
.slide-thumbs .thumb .overlay .thumbs-content { padding:40px }
.slide-thumbs .thumb .overlay .thumbs-content span { font-size:16px; font-weight:700; font-family:var(--title); color: var(--color-white);}
.slide-thumbs .thumb .overlay .thumbs-content p { display:none; }
.slide-thumbs .thumb img { width:100% }
.thumbs-content:after { content:attr(data-text); position:absolute; right:20px; bottom:0; font-size:40px;  color:var(--transparent); font-weight: 900; font-family: var(--title);}

.nb-image img { width:100%; height:20rem; object-fit:cover; object-position: top}

.flex svg { display:none; }
.share small { display:block; font-size:12px; margin-bottom:10px }

.annouc .center { display:flex; align-items: center; justify-content: space-between; padding:30px; gap:30px}
.annouc .annouc-content { overflow:hidden; } 
.annouc .annouc-content p { margin:0; font-size: 14px}
.annouc .annouc-content span { font-size:12px; color: #aaa}
.annouc .annouc-content .item a { color:var(--color-main); }
.annouc .annouc-title { font-size:20px; font-weight:800; font-family:var(--title); color:var(--color-main); border-right:4px solid var(--color-light); padding:10px 30px 10px 0}
.annouc .annouc-nav span { display:block; width:42px; height:42px; line-height:42px; text-align:center; font-size:18px; color:var(--color-main); background: var(--color-light); cursor: pointer; margin:1px 0 } 
.annouc .annouc-nav span:hover {background:var(--color-main); color: var(--color-white);}


#the-canvas { width:100%; margin:20px auto; border: none;}

.cat { border:1px solid var(--color-light); border-radius:3px }

.report-nav { margin-top:20px; position: sticky; top: 110px; padding: 10px 0; background: var(--color-white);}
.report-nav button#prev, .report-nav button#next { background:none !important; letter-spacing: 0px}

span.report-pages { display:inline-block; font-size:13px; color:var(--color-second); padding:2px 10px; margin: 0 10px; border-right:1px solid #ebebeb; border-left:1px solid #ebebeb }

.login .center { max-width:960px; text-align: center;}
.login .center .fa-hand { font-size:52px; color:var(--color-red); margin-bottom:20px }
.login .center .fa-circle-check { font-size:52px; color:var(--color-green); margin-bottom:20px }
.login-form { max-width:480px; margin:0 auto; text-align:left; padding:40px; background:var(--color-light); margin-top:80px }
.login-form button { width:100%; text-align:center; margin-bottom:20px }
.login-form p a { color:var(--color-second); text-decoration:underline; }
.login-form h3 { margin-bottom:20px }

.form input { border:none; border-bottom:1px solid var(--color-grey); border-radius:0; padding:20px 0 }
.form textarea { border:none; border-bottom:1px solid var(--color-grey); border-radius:0;  padding:20px 0  }
.form button { width:100%; text-align:center; }

.contact-page h4 { margin-bottom:40px }
.contact-page .center { max-width:1280px }
.address ul li { padding:15px 0; font-size: 14px;line-height: 24px}
.address ul li strong { display:block; font-size:14px; color:var(--color-second); font-weight:600; margin-bottom:10px }
.address ol { list-style:none; }
.address ol li { display:inline-block; }
.address ol li a { display:block; width:42px; height:42px; text-align:center; line-height:42px; color:var(--color-main);  border-radius: 3px; font-size: 24px}
.address ol li a:hover { color:var(--color-light-b); }

.home-news { background:var(--color-light); }
.tab-nav ul { display:flex; width:100%; gap:30px;align-items: center; justify-content: center; margin-bottom: 20px}
.tab-nav ul li a { font-size:28px; color:var(--color-grey);font-weight: 900; font-family: var(--title); }
.tab-nav ul li.ui-state-active a { color:var(--color-main); }
.tab-content { min-width:100% }

.news-list .news-box { margin:0 }

.staff-list{display:flex;flex-wrap:wrap;gap:20px}
.staff{text-align:center;width:23%}
.staff a{border:1px solid #ebebeb;padding:10px;display:block;height: 100%}
.staff h4 { font-size:14px }
.staff p { font-size:13px; margin-bottom:0; font-weight:500 }
.staff span { font-size:12px; display:block; }
.staff img{width:100%;margin-bottom:20px; object-fit: cover; object-position: top; max-height: 240px; aspect-ratio: 1 / 1}
.staff-list .staff:nth-child(1){display:block;width:100%}
.staff-list .staff:nth-child(1) a{display:inline-block}

.news-box { margin:0 15px; position: relative;}
.news-box .nb-ex { padding:30px; background:var(--color-white); position: relative;}
.news-box:before { content:''; left:20px; right:20px; bottom:0; position:absolute; background:var(--color-second); height:4px; z-index: 1}
.news-box .nb-ex h5 { margin:10px 0; color: var(--color-second);}
.news-box .nb-ex p { margin-bottom:0 }
.news-box .nb-info span.date { font-size:12px; color:var(--color-grey); display:block }

.home-news .slick-arrow { display:block; width:42px; height:42px; line-height:42px; text-align:center; font-size:18px; color:var(--color-white); background: var(--color-second); cursor: pointer;}
.home-news .slick-arrow:hover { background:var(--color-main); }
.home-news .prev.slick-arrow, .home-news .next.slick-arrow { position:absolute; top:50%; z-index:9 }
.home-news .prev { left:-50px }
.home-news .next { right:-50px }
.all { padding:40px 0 0 0; text-align:center; }

.related { background:var(--color-light); }
.related .slick-arrow { display:block; width:42px; height:42px; line-height:42px; text-align:center; font-size:18px; color:var(--color-white); background: var(--color-second); cursor: pointer;}
.related .slick-arrow:hover { background:var(--color-main); }
.related .prev.slick-arrow, .related .next.slick-arrow { position:absolute; top:50% }
.related .prev { left:-50px }
.related .next { right:-50px }

.reports-widget .center { display:flex; gap:40px; max-width: 1280px}
.reports-widget .center .reports-list { width:33%; border-right:1px solid var(--color-silver); }
.reports-widget .center .twitter-widget { width:33%;  border-right:1px solid var(--color-silver);}
.reports-widget .center .newsletter-list { width:33% }

.twitter-widget { height:100%; overflow:hidden; overflow-y:scroll;max-height:36em }
.reports-list .report-box { padding:30px 0; opacity:.6; border-bottom:1px solid var(--color-light);}
.reports-list .report-box:last-child {border-bottom:none}
.reports-list .report-box:hover { opacity:1 }

.newsletter-list .newsletter-box { padding:30px 0; opacity:.6; border-bottom:1px solid var(--color-light);}
.newsletter-list .newsletter-box:last-child {border-bottom:none}
.newsletter-list .newsletter-box:hover { opacity:1 }

.home-about:before { content:''; position:absolute; left:0; top:0; bottom:0; width:60%; background: var(--color-light);}
.home-about .center { display:flex; gap:120px;align-items: center; }
.home-about .center .about-text { width:60% }
.home-about .center .about-text h1 { margin-bottom:20px }
.home-about .center .about-text p { font-size:16px }
.home-about .center .about-stats { width:40% }

h2 { display:flex; align-items:center; justify-content:space-between }
h2 a { display:inline-block;} 

h4 { display:flex; align-items:center; justify-content:space-between }
h4 a { display:inline-block;} 

.report-ex h4 { margin-bottom:15px} 
.report-ex .all-report { margin-top:15px }
.report-ex .report-box { margin:5px 0 } 
.report-ex .report-box a { display:flex; align-items:center; gap:20px; padding: 30px; background: var(--color-light); border-radius: 3px}
.report-ex .report-box .type-icon { font-size:24px; color:var(--color-red); }
.report-ex .report-box p { margin-bottom:0 }
.report-ex .report-box .report-info { width:100% }
.report-ex .report-box .detail span { background:var(--color-main); color:var(--color-white); display: block; width: 42px; height: 42px; line-height: 42px; text-align: center; border-radius: 3px}
.report-ex .report-box:hover .detail span { background:var(--color-second); }
.report-ex .report-box h5 { color:var(--color-second); }

.report-details {text-align: center;}
.report-detail .report-box { margin:40px 0 0 0;} 
.report-detail .report-box a { display:flex; align-items:center; gap:20px; padding: 30px; background: var(--color-light); border-radius: 3px}
.report-detail .report-box .type-icon { font-size:24px; color:var(--color-red); }
.report-detail .report-box p { margin-bottom:0 }
.report-detail .report-box .report-info { width:100% }
.report-detail .report-box .detail span { background:var(--color-main); color:var(--color-white); display: block; width: 42px; height: 42px; line-height: 42px; text-align: center; border-radius: 3px}
.report-detail .report-box:hover .detail span { background:var(--color-second); }
.report-detail .report-box h5 { color:var(--color-second); }

.report-detail .report-list .report-box { margin:5px 0 }

.about-stats { display:flex; align-items:center; gap:30px }
.stat-box { background:var(--color-white); padding:40px 30px; width: 150px; margin: 30px 0; border-radius: 3px; box-shadow:10px 10px 30px var(--shadow);}
.stat-box span { display:block; text-align:center; }
.stat-box span.count { font-size:44px;font-family:var(--title); font-weight:700; color:var(--color-second); }
.stat-box span.text { font-size:14px; font-weight:600; color:var(--color-main); }

.new-members .nm-box {margin:20px}
.new-members .nm-box a { display:flex; height: 100%; align-items:center; justify-content:center;}

.new-members .slick-track { display:flex; align-items:center; }

strong { font-weight:600 }

footer { background:var(--color-main); border-top:6px solid var(--color-second); }
footer .center { display:flex; justify-content: space-between;}
footer .center .left { width:60% }
footer .center .right { width:30%; text-align:right; }

footer ul li a, footer p { color:var(--color-light-b); font-size: 14px; margin:0; padding: 6px 0; display: block;}
footer ul li a:hover { color:var(--color-light); }
footer strong { font-weight:600 }
footer h5 { color:var(--color-light); margin-bottom:20px }

.bottom, .copyright { background:var(--color-main);}
.bottom .sm {  text-align:right; position:relative; }
.bottom:before { content:''; position:absolute; left:0; bottom:0; width:100%; height: 1px; top:50%; background: var(--color-dark);}
.bottom .sm ul { list-style:none; }
.bottom .sm ul li { display:inline-block; }
.bottom .sm ul li a { display:block; width:42px; height:42px; text-align:center; line-height:42px; color:var(--color-white); background:var(--color-second); border-radius: 3px; font-size: 18px}
.bottom .sm ul li a:hover { background:var(--color-light-b); }

.copyright small { font-size:12px; color:var(--color-light-b); }

.page-banner img { width:100%; object-fit: cover; max-height: 600px; object-position: center;}
.page-content { position:relative; z-index:9;}
.page-content .center { background:var(--color-white); padding:40px 30px }

.page-content ul { list-style:disc; }  
.page-content ul, .page-content ol { margin:20px; font-size:14px; line-height:22px }

.sidebar-content { display: flex; }
.sidebar-content .content { width: 100%; }
.sidebar-content .content blockquote { display:block; margin:40px }
.sidebar-content .content p a { font-weight:500; color:var(--color-second); position:relative; display: inline-block;}
.sidebar-content .content p a:after { content:'\f08e'; font-family:var(--faw); right:0; top:0; font-size:10px; margin-left:3px; font-weight:600 }
.sidebar-content .content ul, .sidebar-content .content ol { list-style:disc; margin:20px; font-size:14px; line-height:24px }
.sidebar-content .sidebar { width: 100%; max-width: 300px; margin-left: 40px;}
.side-menu { background:var(--color-light); padding: 30px; border-radius: 6px; margin-bottom: 20px;position: sticky; top: 200px;}
.side-menu ul { list-style: none; }
.side-menu ul li { border-bottom:1px solid var(--color-white); }
.side-menu ul li:last-child { border-bottom:none }
.side-menu ul li a { display: block; padding: 15px 0; font-size: 13px; font-weight: 600; color:var(--color-main);}
.side-menu ul li a:hover, .side-menu ul li.active a { color:var(--color-second) ; }

.filter { display:flex; gap:10px; margin-top: 40px}
.filter .filter-btn { width:15%}
.filter .filter-btn a { display:block; background:var(--color-light); color:var(--color-main); font-weight:600; font-size: 14px; text-align: center; padding:20px 20px; border-radius: 3px; }
.filter .filter-btn a.active, .filter .filter-btn a:hover { background:var(--color-main); color:var(--color-white); }
.filter .filter-btn select { border:none; margin:0; background-color:var(--color-light); color:var(--color-main); font-size: 14px}
.filter .filter-search { display:flex; background:var(--color-light); width: 40%;border-radius: 3px}
.filter .filter-search input {  border:none; margin:0; width:100%; background: none;}
.filter .filter-search button { background:none; padding: 20px}

.members-list .nm-box { border:1px solid var(--color-light);}
.members-list .nm-box a { display:flex; height: 100%; align-items:center; justify-content:center; padding: 20px}
.members-list .nm-box img {filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\' filterRes=\'800\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); filter: gray;-webkit-filter: grayscale(100%);-webkit-backface-visibility: hidden; }
.members-list .nm-box:hover img {filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\' filterRes=\'800\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale"); -webkit-filter: grayscale(0%);}

.member-info { display:flex; align-items:center; margin-bottom: 40px}
.member-logo{ padding:0 20px 0 0; border-right: 1px solid var(--color-light);max-width:240px}
.member-category{ padding:0 0 0 20px}
.member-category a { color:var(--color-main); font-size:14px; font-weight:600 }
.member-category a:hover { color:var(--color-second); }

#cssmenu{position:relative; z-index:99; font-family: var(--nav);}
#cssmenu>ul>li { margin: 0 0 0 -4px; }
#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a,#cssmenu #menu-button{list-style:none;display:block;position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
#cssmenu>ul>li>a {display: block; font-size: 13px; font-weight:600; color:var(--color-nav);padding:0 15px; line-height: 90px;}
#cssmenu>ul>li.active>a, #cssmenu ul li:hover>a { color:var(--color-nav-hover); position: relative;}
#cssmenu #menu-button{display:none;}
#cssmenu > ul > li{ display: inline-block;}
#cssmenu ul ul{position:absolute;left:-9999px; box-shadow: 0 0 40px rgba(0,0,0,.2);text-align: left;background:var(--color-main); padding:12px 0px;}
#cssmenu.align-right ul ul{text-align:right}
#cssmenu li:hover > ul{left:auto}
#cssmenu.align-right li:hover > ul{left:auto;right:0}
#cssmenu ul ul ul{margin-left:100%;top:0;}
#cssmenu.align-right ul ul ul{margin-left:0;margin-right:100%;}
#cssmenu ul ul li a{padding:12px 20px;font-size: 13px; display:block;width:240px;text-decoration:none;color:var(--color-white);font-weight:600;position:relative;}
#cssmenu ul ul li a:hover { background:color:var(--color-main); color:var(--color-white); opacity: .6;}
#cssmenu ul ul li:last-child > a,#cssmenu ul ul li.last-item > a{border-bottom:0}
#cssmenu .has-sub { position: relative; }
#cssmenu .has-sub>a { padding-right: 40px; }
#cssmenu .has-sub:before { content: '\f107'; font-family:var(--faw); font-size: 12px; font-weight: 600; position: absolute; right: 20px; line-height:90px; color:var(--color-nav); }
#cssmenu .has-sub:hover:before {color:var(--color-second);content: '\f106'; font-family:var(--faw); font-weight: 600;}
#cssmenu .active.has-sub:before {color:var(--color-second); }

@media only screen and (max-width:1249px) {
    #cssmenu>ul>li.active>a, #cssmenu ul li:hover>a { opacity:1;position: relative;}
    #cssmenu {position: absolute;left: 0;right: 0;width: auto;text-align: left;margin:0;}
    #cssmenu>ul>li>a:hover { background:var(--color-dark);color:var(--color-white)}
    #cssmenu > ul { margin: 0 0 0 0; position: relative;}
    #cssmenu>ul{display:none; z-index:9; position: absolute; top:47px;left:10px; right:10px}
    #cssmenu ul{display:none; z-index:9; position: absolute;}
    #cssmenu:after,#cssmenu > ul:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
    #cssmenu.align-center > ul,#cssmenu.align-right ul ul{text-align:left;}
    #cssmenu ul li,#cssmenu ul ul li,#cssmenu ul li:hover > ul > li{width:100%;height:auto;}
    #cssmenu > ul > li,#cssmenu.align-center > ul > li,#cssmenu.align-right > ul > li{float:none;display:block;}
    #cssmenu>ul>ul>li>a{font-size:12px;color:var(--color-white);background:none;padding:15px 20px 20px 30px;}
    #cssmenu>ul>li>a { padding:20px !important; color:var(--color-white) !important; display: block; background:color:var(--color-main); font-size: 14px; line-height: normal !important;border-bottom:1px solid var(--color-dark);}
    #cssmenu>ul>li:last-child>a{border-bottom:none}
    #cssmenu>ul>li { background:var(--color-main); margin:0 }
    #cssmenu ul ul li a { padding:15px 20px; }
    #cssmenu ul ul { padding: 0 !important }
    #cssmenu ul ul li:hover > a,#cssmenu ul ul li a:hover{color:var(--color-white); background:var(--color-main)}
    #cssmenu ul ul li > a,#cssmenu ul ul li a {background:var(--color-white)}
    #cssmenu ul ul ul li a{padding-left:40px;}
    #cssmenu ul ul ul ul li a{padding-left:40px;}
    #cssmenu>ul>li { border-right:none; }
    #cssmenu ul ul,#cssmenu ul ul ul{position:relative;left:0;right:auto;width:100%;margin:0;}
    #cssmenu #menu-button{display:block;color:var(--color-main);cursor:pointer;font-size:12px;height:48px; background:var(--color-dark); width: 48px; position: absolute; top:-25px; right:20px; border-radius: 2px;}
    #cssmenu .submenu-button{position:absolute;z-index:10;right:0;top:0;display:block;border-left:1px solid var(--color-dark);height:55px;width:55px;cursor:pointer;}
    #cssmenu .submenu-button::after{content:'';position:absolute;top:21px;left:26px;display:block;width:1px;height:11px;background:var(--color-white);z-index:99;}
    #cssmenu .submenu-button::before{content:'';position:absolute;left:21px;top:26px;display:block;width:11px;height:1px;background:var(--color-white);z-index:99;}
    #cssmenu ul li a,#cssmenu ul ul li a{width:100%;}
    #cssmenu > ul > li.has-sub > a::after,#cssmenu ul ul li.has-sub > a::after,#menu-line,#cssmenu .submenu-button.submenu-opened:after{display:none;}
    #cssmenu ul ul li a { color: var(--color-white); background:var(--color-second); }
    #cssmenu ul ul{ border-bottom: none; }
    #cssmenu ul ul li a{border-bottom:1px solid var(--color-dark);}
    #menu-button{width:55px;height:46px;position:absolute;right:0;top:0;cursor:pointer;z-index: 12399994;}
    #menu-button:after{-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; margin:auto;position:absolute;top:24px;right:0;left:0;display:block;height:4px;width:20px;border-top:2px solid #dddddd;border-bottom:2px solid #dddddd;content:''}
    #menu-button:before{-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; margin:auto;-webkit-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease;position:absolute;top:17px;right:0;left:0;display:block;height:2px;width:20px;background:#ddd;content:''}
    #menu-button.menu-opened:after{-webkit-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease;top:22px;border:0;height:2px;width:19px;background:var(--color-white);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}
    #menu-button.menu-opened:before{top:22px;background:var(--color-white);width:19px;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}
    #cssmenu .has-sub:before{display: none;}

    header .center .logo { max-width:130px }
    .sasad-slider .slide img { height:50vh; }
    .slide .overlay .slide-content span { font-size:28px }
    .slide .overlay .slide-content p { font-size:16px }
    .slide.slick-active .btn { padding:15px 30px }
    .slide-thumbs { display:none !important; }
    .annouc .center { flex-direction: column; gap:10px}
    .annouc-title, .annouc-content, .annouc-nav { width:100% }
    .annouc .annouc-nav span { display:inline-block; }
    .reports-widget .center {flex-direction: column;}
    .reports-widget .center .reports-list, .reports-widget .center .twitter-widget { width:100% }
    .home-about .center {flex-direction: column; gap:20px}
    .home-about .center .about-text, .home-about .center .about-stats { width:100%;}
    .home-about:before { width:100% }
    footer .center {flex-direction: column;}
    footer .center .left, footer .center .right { width:100% } 
    footer .center .right, .bottom .sm { text-align:left; }
    header .center .header-right .search-btn>a, header .center .header-right .lang-btn>a { padding:10px } 
    header .center .header-right .lang-btn>a span, header .center .header-right .lang-btn .fa-angle-down { display:none; }
    header .center .header-right { margin-right:45px }

    .page-content { top:0 }
    .page-content .center { padding:30px }
    .sidebar-content { flex-direction: column; }
    .sidebar-content .sidebar {  max-width: 100%; margin-left:0px; margin-top: 30px}

    .content .about-stats { gap:10px }
    .content .about-stats .stat-box { width:30%; padding: 10px}
    .content .about-stats .stat-box span.count { font-size:32px }
    .content .about-stats .stat-box span.text { font-size:12px }

    .home-news .prev { left:-20px }
    .home-news .next { right:-20px }
    .tab-nav ul li a { font-size:18px }

    header { position:relative; }
    .filter {flex-direction: column;}
    .filter .filter-btn a { text-align:left }
    .filter .filter-btn, .filter .filter-search { width:100% }

    .report-ex .report-box a { padding:15px; gap:10px }
    .report-info h6 { font-size:14px }
    .report-info p { display: none;}

    .annouc .annouc-title { border-right:none; }

    .staff{text-align:center;width:46%}
    .staff-list{gap:5px}

    .newsletter-details i { font-size:16px; display:inline-block; margin-bottom: 0}
    .newsletter-details .btn { padding:10px 30px; margin-bottom: 10px}



}