*, ::after, ::before {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        h1, h2, h3 {
            color: #344554;
            margin: 20px 0 5px 0;
            text-align: center;
        }
        #location h1, #location h2, #location  h3 {
            text-align: left;
        }
        .offer-promo h2{ line-height: 1; margin: 0 0 10px; }

        img {
            max-width: 100%;
            width: 100%;
        }

        a {
            text-decoration: none;
        }

        body {
            background-color: #fff;
            font-family: sans-serif;
            line-height: 2rem;
            color: #181818;
        }

        .container {
            padding: 15px;
            margin: 0 auto;
            max-width: 100%;
            width: 1200px;
        }

        header {
            background: linear-gradient(89.7deg, rgb(72 82 90) 2.8%, rgb(5 16 27) 97.8%);
            border-bottom: 5px solid #60d7fb;
        }

        .left {
            text-align: left;
        }

        .hl {
            font-weight: bold;
            color: 344554;
        }

        footer {
            background: linear-gradient(89.7deg, rgb(72 82 90) 2.8%, rgb(5 16 27) 97.8%);
            border-top: 5px solid #60d7fb;
            padding: 20px 0;
            color: #fff;
            text-align: center;
            font-size: 12px;
        }

        header .container {
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
        }

        .logo img{
            width: 230px;
        }

        .menu a {
            position: relative;
            text-transform: uppercase;
            padding: 10px 15px;
            overflow: hidden;
            background-origin: border-box;
            background-clip: padding-box, border-box;
            width: 20%;
            background-image: linear-gradient(#06f6ff, #02358d);
            color: #fff;
            font-size: 0.8em;
            border-radius: 10px;
            font-weight: bold;
            transition: 0.5s all;
        }
        .menu a:hover{ background-image: linear-gradient(#02358d, #06f6ff); }

        .menu {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            text-align: center;
            padding: 10px 0;
            gap: 15px;
        }

        .informasi {
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        article {
            margin: 50px 0;
        }
        #location{ min-height: 100vh; }
        #location article{ 
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            margin: 50px 0; 
        }

        li {
            margin-left: 25px;
            margin-bottom: 15px;
        }

        article p {
            text-align: justify;
        }

        .gallery {
            display: flex;
            flex-direction: row;
            justify-items: center;
            margin: 30px 0;
        }

        .menu.mobile {
            display: none;
        }

        .offer-promo {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
            margin: 40px auto;
        }

        .offer-promo .article-thumb, .offer-promo .list {
            width: 50%;
            padding: 0 30px;
        }

        
        .cite {
                    display: flex;
                    flex-direction: row;
                    justify-content: space-evenly;
                    margin-bottom: 30px;
                }

                .cite cite {
                    width: 50%;
                    margin: 0 30px;
                }

        @media (max-width: 765px) {

            header .container {
                display: flex;
                flex-direction: column;
            }
            .menu {
                display: flex;
                flex-direction: column;
                justify-content: flex-end;
                align-items: center;
                width: 100%;
                text-align: center;
            }
            article{ margin: 10px 0; }

            .offer-promo .article-thumb, .offer-promo .list {
            width: 100%;
            padding: 0;
        }
         #location article{ flex-direction:column; }
            
            .menu.desktop {
                display: none;
            }

            
            .menu-mobile {
                position: relative;
                position: absolute;
                display: flex;
                width: 100%;
                top: 85px;
                right: 18px;
                flex-direction: row-reverse;
            }

            .menu.mobile {
                display: flex;
                flex-direction: row;
                background-color: #ffffff;
                position: fixed;
                z-index: 1000;
                bottom: 0;
                right: 0;
                left: 0;
                width: 100%;
            }

            .menu.mobile a {
                text-transform: uppercase;
                width: 100%;
                border-radius: 0;
                margin: 0;
                padding: 10px;
                line-height: 1.5;
                background-image: linear-gradient(#48525a, #05101b);
                color: #fff;
                font-size: 0.8em;
                font-weight: bold;
                transition: 0.5s all;
                min-height: 60px;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            footer {
                margin-bottom: 50px;
                padding-bottom: 45px;
            }

            .offer-promo {
                display: flex;
                flex-direction: column ;
                width: 100%;
            }

            .cite {
                    display: flex;
                    flex-direction: column;
                }

                .cite cite {
                    width: 100%;
                    margin-bottom: 30px;
                }
        }
        .banner {
            margin-right: 46px;
        }
        .banner img {
            width: 500px;
        }
        #location footer{ position: absolute; bottom: 0; width: 100%; }