.main-header{display:flex;position:fixed;top:0;width:100%;z-index:100;height:70px;align-items:flex-end;background-color:#fff;transition:.5s linear}
.main-header.sticky{box-shadow:0 3px 3px 0 rgba(0,0,0,0.15)}
.main-header ul,.menu-membership ul,.sidebar ul,.icon-membership ul,.all-menu-ship ul{padding:0;margin-bottom:0;list-style:none}
.main-header span.lane{position:relative;padding:0 5px;top:-2px;font-size:7.5pt;font-weight:600}
.main-header li{display:inline-block}
.main-header a:hover,.main-header .drop-arr:hover,.main-header .notif-icon:hover,.main-header .search-d:hover{color:#524a4e!important}
.main-header ul.child{position:absolute;height:0;text-align:left;z-index:-2;transition:.5s all;overflow:hidden;visibility:hidden;background:rgba(209,209,209,0.9)}
.main-header ul.child li{padding:4px 48px 0 9px;display:block}
.main-header ul.child li a{font-size:10pt;color:#5f5f5f}
.main-header li.parent.active ul.child{height:65px;visibility:visible;z-index:8;border-top:3px solid #009bdf}
.main-header .arrowh-2 i::before,.menu-membership .arrowh-3 i::before{transform:rotate(90deg);transition:.5s all}
.main-header .logo{width:24%;transition:.5s linear;padding-left:40px;position:relative;top:-4px}
.main-header .logo img{width:240px}
.main-header .menu-md{width:51%;text-align:center;transition:.5s linear}
.main-header .menu-md li{padding:0 8px;color:#6d6e71}
.main-header .menu-md li a{font-size:11pt}
.main-header .menu-md .arrowh-1{top:1.4px;position:relative;cursor:pointer}
.main-header .menu-md li.parent i{transition:.5s all;font-size:8.5pt}
.main-header .menu-md li.parent.active .arrowh-1{top:.2px}
.main-header .menu-md li.parent.active i::before{transform:rotate(180deg)}
.main-header .menu-md li.about.active ul.child{height:123px}
.main-header .language{width:7%;text-align:right;padding-right:10px;color:#a9a9a9;transition:.5s linear}
.main-header .language a{font-size:9.3pt;color:#a9a9a9;font-weight:600}
.background-header{height:300px;background-repeat:no-repeat;width:100%;position:relative;background-size:cover;background-position:center;margin-top:95px}
.background-header .head-title{position:absolute;top:50%;transform:translateY(-50%);color:#fff;right:70px;text-align:right;width:40%}
.background-header .lane-white{width:53px;height:5px;margin-bottom:8px;margin-left:auto;box-shadow:2px 2px rgba(0,0,0,0.5)}
.background-header .head-title h1{letter-spacing:.1em;font-weight:400;text-transform:uppercase;text-shadow:2px 2px rgba(0,0,0,0.5);font-size:2.7rem}
.ojk-header{position:absolute;right:19%;margin-top:15px}
.ojk-header img{width:90px}
.menu-membership{width:83%;margin:20px auto}
.menu-membership .warp{width:20%;margin:0 8px;position:relative}
.menu-membership ul.list{text-align:center;background:#EBEBEB;overflow:hidden;visibility:hidden;padding:10px 0;position:absolute;z-index:-1;opacity:0;left:0;width:100%;transition:.5s all;margin-top:5px}
.menu-membership li{border-bottom:1px solid #454545;padding:10px;margin:0 20px}
.menu-membership li a{color:#454545;font-size:.9rem}
.menu-membership li a:hover{color:#6d6e71}
.menu-membership .menu-ship{display:flex;align-items:center;justify-content:space-evenly;background:#EBEBEB;border-radius:5px;cursor:pointer;height:50px;padding:15px}
.menu-membership .arrowh-3{font-size:11pt;position:relative}
.menu-membership .menu-ship img{width:22px}
.menu-membership .menu-ship h6{font-size:.95rem;margin-bottom:0;font-weight:700}
.menu-membership .warp.active ul.list{opacity:1;z-index:11;visibility:visible}
.menu-membership .warp.active .menu-ship i::before{transform:rotate(-90deg)}
@media only screen and (min-width: 1025px) {
.main-header .login-search{display:flex;position:relative;flex:1;background-color:#009bdf;height:100%;align-items:flex-end;padding-left:10px;color:#fff;width:18%;transition:.5s linear}
.main-header .login-d-1 a{color:#fff;font-size:9.3pt;font-weight:600}
.main-header .login-d-2 li.parent{margin-left:8px}
.main-header .login-d-2 .menu-name img{object-fit:cover;object-position:center;width:33px;height:33px;border-radius:50%;margin-right:8px}
.main-header .login-d-2 li.avatar.active ul.child{height:125px;margin-top:5px}
.main-header .login-d-2 li.parent.active i::before{transform:rotate(-90deg)}
.main-header .login-d-2 .menu-name{position:relative;top:2px}
.main-header .login-d-2 sup#count-notif{color:#fff;font-size:6pt;font-weight:700}
.main-header .login-d-2 .notif-icon{font-size:15pt;position:relative;top:8px;cursor:pointer}
.main-header .login-d-2 .arrowh-2{font-size:12pt;position:relative;top:3px}
.main-header .search-warp{position:absolute;width:100%;visibility:hidden;left:0;top:80px;opacity:0;z-index:-1;padding:10px;transition:.5s all;background:rgba(0,0,0,.75);height:0}
.main-header .search-warp.active{height:100vh;visibility:visible;z-index:3;opacity:1}
.main-header .search-warp #myResult{color:#009bdf;margin-top:10px;overflow:hidden}
.main-header .searchly{cursor:pointer}
.main-header.sticky .search-warp.active{top:70px}
.main-header .search-d{position:absolute;right:40px}
.main-header .notification{position:absolute;width:100%;top:80px;background:#fff;visibility:hidden;left:0;opacity:0;z-index:-1;transition:.5s all}
.main-header .notification.active{opacity:1;visibility:visible;z-index:1}
.main-header .notification .c-notif{color:#5f5f5f;border:1px solid #ded8d8;padding:8px;font-size:.85rem}
.main-header.sticky .notification{top:70px}
.icon-membership{margin-top:-70px;z-index:5;position:absolute;right:70px}
.icon-membership p{color:#fff;font-size:9pt;font-weight:600;margin-bottom:.5rem}
.icon-membership .icon-warp a{margin-right:10px;width:23px;height:23px;font-size:8pt}
.icon-membership .icon-warp a:last-child{margin-right:0}
.main-header.sticky .login-search,.main-header.sticky .language,.main-header.sticky .logo,.main-header.sticky .menu-md{padding-top:8px;padding-bottom:8px}
.sidebar,.sidebar-2{width:18%;background:#009bdf;position:absolute;right:0;top:0;height:100vh}
.sidebar-2{height:200px;top:-35px}
.sidebar .icon-warp{flex-direction:column;align-items:flex-end;margin-right:28px;justify-content:flex-end;height:100%;padding-bottom:30px}
.sidebar .icon-warp a{width:23px;height:23px;font-size:8pt}
.sidebar .icon-warp p{transform:rotate(90deg);margin-right:-26px;margin-bottom:80px;color:#fff;font-weight:600;font-size:8pt;letter-spacing:.285em}
.sidebar .icon-warp li{margin-top:45px}
.sidebar .icon-warp li:nth-child(1){margin-top:0}
.other-page.sidebar{height:410px;top:-35px}
.other-page.sidebar .icon-warp{justify-content:flex-start;flex-direction:initial;margin-right:10px;padding-bottom:25px}
.other-page.sidebar .icon-warp p{transform:initial;margin-right:0;padding-left:15px;margin-bottom:5px;letter-spacing:initial;text-align:center}
.other-page.sidebar .icon-warp ul{display:flex}
.other-page.sidebar .icon-warp li{margin-top:0;margin-left:8px}
.main-header .login-mobile,.main-header .search-mobile,.main-header .icon-warp-mobile{display:none}
.menu-humberger{display:none}
}
@media only screen and (min-width: 1700px) {
.main-header .logo{padding-left:70px}
.main-header .search-d{right:70px}
.sidebar .icon-warp p{margin-bottom:95px}
.sidebar .icon-warp li{margin-top:60px}
.sidebar .icon-warp{padding-bottom:45px;margin-right:59px}
}
@media only screen and (max-width: 1258px) {
.menu-membership{width:88%}
.menu-membership .menu-ship{padding:8px;height:45px}
.main-header .menu-md li a{font-size:10pt}
.main-header .logo img{width:195px}
.main-header .language a,.main-header .login-d-1 a{font-size:8.3pt}
.main-header .menu-md li.parent i{font-size:8pt}
.main-header .search-d{font-size:9pt}
.main-header span.lane{font-size:6pt}
.main-header .login-d-2 .notif-icon{font-size:12pt;top:7px}
.main-header .login-d-2 .menu-name img{width:30px;height:30px}
.main-header .login-d-2 .arrowh-2{font-size:9pt;top:3px}
.menu-membership .arrowh-3{font-size:9pt}
.menu-membership .menu-ship h6{font-size:.85rem}
.menu-membership li a{font-size:.8rem}
.menu-membership .menu-ship img{width:17px}
.sidebar .icon-warp p{font-size:7pt;margin-right:-23px;margin-bottom:78px}
.sidebar .icon-warp{margin-right:30px}
.other-page.sidebar .icon-warp p{padding-left:10px;margin-bottom:3px}
.sidebar .icon-warp a{width:20px;height:20px;font-size:7pt}
}
@media only screen and (max-width: 1024px) {
.main-header{height:60px;overflow:hidden;display:initial}
.main-header.sticky{height:60px}
.main-header li{display:block}
.main-header.active,.main-header.sticky.active{height:100vh}
.main-header span.lane{font-size:7.5pt;padding:0 10px}
.main-header ul.child li{padding:4px 9px 0}
.main-header ul.child li a{font-size:11pt}
.main-header .menu-humberger{position:absolute;width:55px;height:60px;display:flex;align-items:center;flex-direction:column;justify-content:flex-end;background:#009bdf;top:0;right:0;padding-bottom:11px;cursor:pointer}
.main-header .menu-humberger>span{width:20px;margin-bottom:5px;height:2px;background-color:#fff;display:block;transition:.5s all}
.main-header.active .menu-humberger > span.x-1{transform:translate(1px,7px) rotate(135deg)}
.main-header.active .menu-humberger > span.x-2{transform:rotate(45deg) translate(1px,-1px)}
.main-header.active .menu-humberger > span.no-x{visibility:hidden;transition:none}
.main-header .menu-md li{padding:4px 8px}
.main-header .menu-md li a{font-size:12pt}
.main-header .menu-md ul.child{position:initial;text-align:center}
.main-header .menu-md{width:100%;position:absolute;margin-top:0;top:20vh}
.main-header .menu-md .arrowh-1{position:initial}
.main-header .logo img{width:160px}
.main-header .logo{width:initial;padding-left:15px;padding-top:14px;position:initial}
.main-header .language{width:initial;position:absolute;margin-top:0;right:55px;top:25px}
.main-header .language a{font-size:9.3pt}
.main-header .login-mobile{position:absolute;top:85vh;left:50%;transform:translateX(-50%);color:#5f5f5f}
.main-header .icon-warp-mobile{position:absolute;top:93vh;width:100%;display:flex;justify-content:space-between;padding:0 15px;color:#009bdf}
.main-header .login-mobile span.lane{font-size:10pt}
.main-header .icon-warp-mobile ul{display:flex}
.main-header .icon-warp-mobile li{padding:0 10px}
.background-header .head-title{right:40px;width:50%}
.background-header{height:250px;margin-top:60px;z-index:-1}
.ojk-header{position:initial;display:flex;justify-content:flex-end;margin-top:15px;margin-right:20px}
.ojk-header img{width:75px}
.sidebar,.sidebar-2{display:none}
.main-header .login-search{display:none}
.icon-membership{display:none}
}
@media only screen and (max-width: 991px) {
.background-header .lane-white{width:45px}
.background-header .head-title h1{font-size:1.8rem}
.menu-membership{width:90%}
.menu-membership .menu-ship img{width:14px}
.menu-membership .menu-ship h6{font-size:.7rem}
.menu-membership .arrowh-3{font-size:8pt}
.menu-membership{width:95%}
.menu-membership li a{font-size:.65rem}
.menu-membership li{padding:8px;margin:0 10px}
}
@media only screen and (max-width: 767px) {
.menu-m-membership{margin-top:68px;margin-bottom:-50px;padding:0 5px;position:relative;width:100%}
.menu-membership li a,.menu-membership .menu-ship h6{font-size:.8rem}
.menu-m-membership .warp{width:50%;margin:0 5px}
.menu-m-membership .menu-ship{height:40px}
.menu-m-membership .warp-button{position:absolute;right:0;z-index:12;background:linear-gradient(268.84deg,#FFF 47.74%,rgba(255,255,255,0) 105.33%);width:23%;height:100%;display:flex;padding-right:10px;align-items:center;justify-content:flex-end}
.menu-m-membership .warp-button .icon{background:#EBEBEB;box-shadow:1px 1px 4px rgba(0,0,0,0.25);border-radius:5px;width:26px;height:24px}
.menu-m-membership .warp-button .icon b{position:relative;top:-6px;font-size:17pt;line-height:0}
.all-menu-ship{position:absolute;width:100%;z-index:-1;background:#fff;padding:10px 5px;visibility:hidden;opacity:0;transition:.5s all}
.all-menu-ship.active{z-index:20;visibility:visible;opacity:1}
.all-menu-ship ul.list-2{text-align:center;background:initial}
.all-menu-ship .warp{background:#EBEBEB;border-radius:5px;padding:0 15px;margin:0 5px 10px}
.all-menu-ship .menu-ship{display:flex;align-items:center;justify-content:space-evenly;padding:10px 0}
.all-menu-ship .close-menu{background:linear-gradient(270.69deg,#009BDF 0.23%,rgba(0,155,223,0) 99.93%);border-radius:5px;display:flex;justify-content:flex-end;color:#fff;padding:10px 0;margin-right:5px;padding-right:10px;font-size:13pt;font-weight:300}
.all-menu-ship li{border-bottom:1px solid #454545;padding:5px 0}
.all-menu-ship li:first-child{border-top:1px solid #454545}
.all-menu-ship li:last-child{border-bottom:none}
.all-menu-ship li a{color:#454545;font-size:.8rem}
.all-menu-ship li a:hover{color:#6d6e71}
.all-menu-ship .menu-ship img{width:15px}
.all-menu-ship .menu-ship h6{font-size:.8rem;margin-bottom:0}
.all-menu-ship .side-r,.all-menu-ship .side-l{width:50%}
}
@media only screen and (max-width: 576px) {
.background-header .head-title h1{font-size:1.5rem}
.background-header .head-title{width:80%;right:30px}
.background-header .lane-white{width:40px}
}