/* MEGA MENU */

.mega-menu{

    position: fixed;
    top: -100%;
    left: 0;

    width: 100%;

    background: #ffffff;

    border-top: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;

    box-shadow: 0 8px 30px rgba(0,0,0,.12);

    padding: 35px 0 60px;

    max-height: 100vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;

    opacity: 0;

    transition:
        top .35s ease,
        opacity .25s ease;

    z-index: 4999;

}


.mega-menu::before{

    display: none;

}

.mega-menu.show{

    top: 64px;

    opacity: 1;

}

/* CONTENT */

.mega-menu-content{

    position: relative;

    z-index: 2;

    color: #4a4a4a;

}

/* HEAD TITLE */

.mega-head-title{

    margin-bottom: 8px;

    font-size: 20px;

    font-weight: 600;

    color: #333333;

    text-align: center;

    line-height: 1.5;

}

/* CARD TITLE */

.mega-title{

    margin-bottom: 10px;

    font-size: 17px;

    font-weight: 700;

    color: #153ab6;

}

/* DESCRIPTION */

.mega-desc{

    font-size: 14px;

    line-height: 1.8;

    color: #4a4a4a;

}

/* BUTTON */

.mega-link{

    display: inline-block;

    margin-top: 12px;

    padding: 9px 18px;

    background: #ffd857;

    color: #14214C;

    font-size: 14px;

    font-weight: 700;

    text-decoration: none;

    border-radius: 8px;

    border: none;

    transition:
        background .25s ease,
        color .25s ease,
        transform .25s ease;

}

.mega-link:hover{

    background: #ffe488;

    color: #14214C;

    transform: translateY(-2px);

}

/* NAVBAR */

.nav-item.dropdown:hover .dropdown-menu{

    display: none !important;

}

/*  TEXT */

.narasi-layanan{

    text-align: justify;

}
@media (max-width:480px){

    .mega-menu{
        position:fixed;
        top:-100%;
        left:0;

        width:100%;
        height:80vh;
        max-height:80vh;

        padding:25px 0 90px;

        border-radius:0 0 18px 18px;

        overflow-y:auto;
        -webkit-overflow-scrolling:touch;

        opacity:0;

        transition:
            top .45s ease,
            opacity .35s ease;

        z-index:6001 !important;
    }

    .mega-menu::before{
        display:none;
    }

    .mega-menu.show{
        top:155px;
        opacity:1;
    }

    .mega-menu-content,
    .mega-menu .col-md-4{
        text-align:center;
    }

    .mega-head-title{
        font-size:14px;
        margin-bottom:18px;
    }

    .mega-title{
        font-size:13px;
        margin-bottom:8px;
    }

    .mega-desc{
        font-size:12px;
        line-height:1.7;
    }

    .mega-link{
        padding:7px 14px;
        font-size:12px;
        border-radius:6px;
    }

}