*{padding:0;margin:0;box-sizing:border-box}
body{background-image:url(https://www.boncabe.com/makaroni-memory/images/makaroni-pattern.png)}
ol li{padding:0;margin-left:5px}
header{margin:16px 0;position:relative;z-index:999}
#layout{position:relative;max-width:1024px;margin:0 auto}
img.boncabelogo{margin-left:36px}
.social{position:absolute;top:5px;right:33px}
.socicons{padding:26px;position:relative;z-index:1}
.logo_macaroni{width:228px;height:auto;margin-top: 150px;left: 39%}
.mobile-menu-kobe{display:none;cursor:pointer;top:0;position:absolute;right:0;bottom:5px}
.overlay{height:100%;width:0;position:fixed;z-index:100;left:0;top:0;background-color:#28469c;background-color:rgba(58,35,12,0.95);overflow-x:hidden;transition:.5s}
div.mobile-nav{height:30%;width:100%;display:inline-block}
.overlay-content{top:25%;width:90%;text-align:center}
.overlay ul{list-style-type:none;list-style-image:none}
.overlay a{padding:8px;text-decoration:none;font-size:3.6rem;color:#fff;display:block;transition:.3s;line-height:1.5em;cursor:pointer}
a.closebtn:hover {color: #fff;text-decoration: none;}
.overlay .closebtn{position:absolute;top:20px;right:45px;font-size:6rem}
div.line{width:26px;height:3px;background-color:#fff;margin:6px 0}
#main-nav{position:absolute;right:0;top:120px}
#main-nav ul{margin:0;padding:0}
#main-nav li{display:block;float:left;margin:0;padding:0;position:relative}
#main-nav li a{display:block;font-weight:700;font-size:1rem;margin:0 1px;padding:4px 7px;background:transparent;margin-bottom:0;text-shadow:4px 3px 5px rgba(76,76,76,.76)}
#main-nav li a:hover{color:#fff}
#main-nav li li a{color:#000;font-size:14px;width:240px;line-height:35px;border-bottom:1px solid #734600;position:relative;background:#f0c684;font-weight:600;margin:0;padding:0 10px;text-shadow:none}
#main-nav .current-menu-item,#main-nav .current_page_item,#main-nav li a:hover{border-bottom:2px solid #fff;border-radius:5px}
#main-nav li li a:hover{background:#d1ba97;color:#000;display:block;opacity:1;border:none;border-radius:0}
#main-nav ul ul li.current-menu-item{border:none;border-radius:0}
li.current-menu-item li,li.current_page_item li{border:none;border-radius:0}
#main-nav .current-menu-item:hover{border-bottom:none}
#main-nav ul ul{display:none;position:absolute;top:28px}
#main-nav ul ul li{float:none;z-index:999;width:100%}
#main-nav ul li:hover > ul{display:block}
#main-nav li.parent-link > a:after{content:' \25be'}
#main-nav li.is-menu a:active{position:static}
.nav{float:right;margin-right:18px;height:20px}
.nav ul{margin:0;padding:0;list-style-type:none;list-style-image:none;line-height:20px;display:table}
.nav li{display:inline;display:table-cell}
.nav a{color:#FFF;font-weight:700;text-decoration:none;font-size:1.3rem;padding:11px 20px;background:transparent;margin-bottom:0;cursor:pointer}
.nav a:hover{color:#fff;outline:0;opacity:.8}
.nav a:not([href]):not([class]){color:#fff}
.container{display:block;padding:1px;margin-top:21px;padding-top:21px}
footer{margin:50px}
.btn{margin-top:18px}
.trpoint {padding: 8px;display: block;}

.notify .social{right:10px;top:16px}
.notify .socicons{padding:8px;position:relative;z-index:1}
.notify .container{width:94%; max-width: 568px;padding:0;background: #000;}
.notify .maintable {width:100%; font-size: 14px; color:black; background:linear-gradient(-225deg, #DAA520 0%, #FFD700 100%)}
.notify .maintable h3 {font-family: 'Goldman'; font-size:18px;margin-top: 10px}
.notify .maintable p {font-size: 12px;font-family: 'Montserrat', sans-serif;}
.notify .maintable .topterbaik {margin-top: 10px}
.notify .myscore {color: #fff; line-height: 26px; background-color: #F3100B; display: inline; padding: 8px;}

.notify .list_score {padding-top: 10px;margin-top: 10px;width:100%; font-size: 14px; color:black; background:linear-gradient(-180deg, #FFD700 0%, #E6C100 100%)}
.notify .list_score h3 {font-family: 'Goldman'; font-size:18px;margin-top: 10px}
.notify .list_score p {font-size: 12px;font-family: 'Montserrat', sans-serif;}
.notify .list_score .topterbaik {margin-top: 10px}

.notify .footer {padding-top: 10px;margin-top: 10px;width:100%; font-size: 14px; color:black; background-color: black}
.notify .footer h3 {font-family: 'Goldman'; font-size:18px;margin-top: 10px}
.notify .footer p {font-size: 12px;font-family: 'Montserrat', sans-serif;}
.notify .footer .topterbaik {margin-top: 10px}

@media screen and (min-width:769px) and (max-width:959px) {
.overlay a{font-size:16px;line-height:30px}
}
@media (max-width:768px) {
.mobile-menu-kobe{position:absolute;display:block;color:#333;cursor:pointer;right:20px;font-size:2rem;height:26px;top:0}
img.boncabelogo{margin-left:18px}
.menu-mobile{top:auto;bottom:1px}
.social {right:26px;bottom:1px;top:75px}
.notify .social{right:10px;bottom:1px; top:auto}
.socicons{padding:26px;position:relative;z-index:1}
.logo_macaroni{width:228px;height:auto;margin-top: 150px;left: 22%}
.overlay{-ms-overflow-style:none}
.overlay ul{padding-left:0}
.overlay ul li{border:none;padding-left:15px}
.overlay ul li ul li{border-style:none}
.overlay ul li ul li:last-child{border-style:none}
.overlay a{text-align:left;padding:2px;text-transform:uppercase;font-size:16px;line-height:30px}
.overlay .closebtn{font-size:4rem;top:1%;right:8px}
.overlay .parent-link,.overlay .single-link{margin-top:36px}
.overlay .astm-search-menu{margin-top:36px}
.mobile-nav li a:hover{opacity:.5;color:#fff; text-decoration: underline;}
#main-nav{display:none}
.highlight-menu a{color:#ffd696}
}
@media screen and (max-width:567px) {
img.boncabelogo{width:221px;height:130px}
}
@media screen and (max-width:430px) {
img.boncabelogo{width:187px;height:110px}
.socicons{width:28px;height:auto}
}
@media screen and (max-width:390px) {
.mobile-menu-kobe{top:0;right:16px;height:26px}
.notify .socicons {padding: 6px}
}
@media screen and (max-width:320px) {
img.boncabelogo{width:170px;height:100px}
}