.opa {
            opacity: 0.7;
            background: #052c52;
        }

        .tulisan_jalan {
            text-decoration: none;
            color: white;
        }

        .marquee {
            height: 60px;
            width: 100%;
            overflow: hidden;
            position: relative;
            transition: 0.5s;
            background-size: 200% auto;
            background-image: linear-gradient(to right,
                    #36d1dc 0%,
                    #5b86e5 51%,
                    #36d1dc 100%);
            padding: 8px 0 4px 0;
            text-decoration: none;
        }

        .marquee:hover {
            background-position: right center;
            /* change the direction of the change here */
            color: #fff;
            box-shadow: 0 0 10px yellow;
            text-decoration: none;
        }

        .card-titleangga {
            white-space: nowrap;
            width: 200px;
            height: 300px;
            overflow: hidden;
            color: black;
            text-overflow: ellipsis;
        }

        .marquee div {
            display: inline-block;
            width: 300%;
            height: 80px;

            position: absolute;
            overflow: hidden;

            animation: marquee 20s linear infinite;
        }

        .marquee span {
            float: left;
            width: 25%;
        }

        @keyframes marquee {
            0% {
                left: 0;
            }

            100% {
                left: -150%;
            }
        }

        .btn-grad {
            background-image: linear-gradient(to right,
                    #000046 0%,
                    #1cb5e0 51%,
                    #000046 100%);
        }

        .btn-grad {
            text-align: center;
            text-transform: uppercase;
            transition: 0.5s;
            background-size: 200% auto;
            color: white;
            box-shadow: 0 0 20px white;
        }

        .btn-grad:hover {
            background-position: right center;
            /* change the direction of the change here */
            color: #fff;
            box-shadow: 0 0 20px yellow;
            text-decoration: none;
        }

        .btn-grad11 {
            background-image: linear-gradient(to right, #ED4264 0%, #FFEDBC 51%, #ED4264 100%)
        }

        .btn-grad11 {
            text-transform: uppercase;
            transition: 0.5s;
            background-size: 200% auto;
            color: white;
            box-shadow: 0 0 20px #eee;
        }

        .btn-grad11:hover {
            background-position: right center;
            /* change the direction of the change here */
            color: #fff;
            text-decoration: none;
            box-shadow: 0 0 40px #ED4264;
        }


        .btn-grad12 {
            background-image: linear-gradient(to right, #fc00ff 0%, #00dbde 51%, #fc00ff 100%)
        }

        .btn-grad12 {
            text-transform: uppercase;
            transition: 0.5s;
            background-size: 200% auto;
            color: white;
            box-shadow: 0 0 20px #eee;
        }

        .btn-grad12:hover {
            background-position: right center;
            /* change the direction of the change here */
            color: #fff;
            text-decoration: none;
            box-shadow: 0 0 40px #ED4264;
        }

        .btn-grad13 {
            background-image: linear-gradient(to right, #191970 0%, #000428 51%, #191970 100%)
        }

        .btn-grad13 {
            text-transform: uppercase;
            transition: 0.5s;
            background-size: 200% auto;
            color: white;
            box-shadow: 0 0 20px #eee;
        }

        .btn-grad13:hover {
            background-position: right center;
            /* change the direction of the change here */
            color: #fff;
            text-decoration: none;
            box-shadow: 0 0 40px #000428;
        }

        .btn-grad14 {
            background-image: linear-gradient(to right, #800000 0%, #000000 59%, #800000 100%)
        }

        .btn-grad14 {
            text-transform: uppercase;
            transition: 0.5s;
            background-size: 200% auto;
            color: white;
            box-shadow: 0 0 20px #eee;
        }

        .btn-grad14:hover {
            background-position: right center;
            /* change the direction of the change here */
            color: #fff;
            text-decoration: none;
            box-shadow: 0 0 40px #EB5757;
        }


        .btn-grad15 {
            background-image: linear-gradient(to right, #fc00ff 0%, #00dbde 51%, #fc00ff 100%)
        }

        .btn-grad15 {
            text-transform: uppercase;
            transition: 0.5s;
            background-size: 200% auto;
            color: white;
            box-shadow: 0 0 20px #eee;

        }

        .btn-grad15:hover {
            background-position: right center;
            /* change the direction of the change here */
            color: #fff;
            text-decoration: none;
            box-shadow: 0 0 40px #fc00ff;
        }

        .btn-grad70 {
            width: 100%;
            background-image: linear-gradient(to right, #000046 0%, #1CB5E0 51%, #000046 100%);
            transition: 0.5s;
            background-size: 200% auto;
            color: white;
            box-shadow: 0 0 40px #eee;
            border-radius: 10px;
        }

        .btn-grad70:hover {
            background-position: right center;
            /* change the direction of the change here */
            color: #fff;
            box-shadow: 0 0 40px #1CB5E0;
            text-decoration: none;
        }

         .anggarun3:hover {
            transition: all 0.5s;
            transform: scale(1.1);
            transform-origin: top;
        }

          .card {
                    flex: 1;

                    /*Style for presentation purpose*/
                    font-family: 'calibri';
                    border: 1px solid #ccc;
                    background: #fff;
                    margin: 12px;
                    padding: 12px
                }

                @media screen and (min-width:747px) {

                    .card-container {
                        display: flex;
                        flex-wrap: wrap;
                        border-color: black;
                        border-width: 1;
                    }

                    .card {
                        flex: 1;
                    }

                }

                /* 
                
                */
.logo1 {
    width: 50%
}

#video1 {
    display: block;
}

#video2 {
    display: none;
}

.font-size24{
    font-size: 20px;
}

.to-bottom-icon{
    margin-top: -220px
}

.foto_bg_bawah {
    background-image: url('/assets/teamplate_transpo/img/04.jpg') !important;
}

#card1 {
    box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);
    -webkit-box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);-moz-box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);
}

#table10 {
    font-size: 11px;
}

#table10 th:first-child,
#table10 td:first-child {
    width: 10px;
}

#table10 th {
    text-align: center;
}

#table10 td:nth-child(2),
#table10 td:nth-child(3) {
    text-align: center;
}

#table10 td:first-child center {
    color: #007bff; /* text-blue */
}

#table10 .text-success {
    color: #28a745;
}

#card2 {
    box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);-webkit-box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);-moz-box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);
}


#table1 {
    font-size: 11px;
}

/* Kolom No */
#table1 th:first-child,
#table1 td:first-child {
    width: 10px;
}

/* Header rata tengah */
#table1 th {
    text-align: center;
}

/* Kolom HPS & Akhir Pendaftaran */
#table1 th:nth-child(3),
#table1 th:nth-child(4),
#table1 td:nth-child(3),
#table1 td:nth-child(4) {
    width: 170px;
}

/* Warna nomor */
#table1 td:first-child center {
    color: #17a2b8; /* text-info */
}

/* Text paket */
#table1 .text-info {
    color: #17a2b8;
}


#card3 {
    box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);-webkit-box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);-moz-box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);
}


#table3 {
    font-size: 11px;
}

/* Kolom No */
#table3 th:first-child,
#table3 td:first-child {
    width: 10px;
}

/* Header rata tengah */
#table3 th {
    text-align: center;
}

/* Kolom HPS & Akhir Pendaftaran */
#table3 th:nth-child(3),
#table3 th:nth-child(4),
#table3 td:nth-child(3),
#table3 td:nth-child(4) {
    width: 170px;
}

/* Warna nomor */
#table3 td:first-child center {
    color: #007bff; /* text-blue */
}

/* Nama paket */
#table3 .text-danger {
    color: #dc3545;
}


.ovrflow {
    overflow-x: auto; 
    margin-top: -10px;
}

#card4 {
    box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);-webkit-box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);-moz-box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);
}


#table2 {
    font-size: 11px;
}

/* Kolom No */
#table2 th:first-child,
#table2 td:first-child {
    width: 10px;
}

/* Header rata tengah */
#table2 th {
    text-align: center;
}

/* Kolom HPS & Akhir Pendaftaran */
#table2 th:nth-child(3),
#table2 th:nth-child(4),
#table2 td:nth-child(3),
#table2 td:nth-child(4) {
    width: 170px;
}

/* Warna nomor */
#table2 td:first-child center {
    color: #007bff; /* text-blue */
}

/* Nama paket */
#table2 .text-success {
    color: #28a745;
}


#card5 {
    box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);-webkit-box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);-moz-box-shadow: -3px 2px 27px -6px rgba(13,158,158,0.94);
}


#table4 {
    font-size: 11px;
}

/* Kolom No */
#table4 th:first-child,
#table4 td:first-child {
    width: 10px;
}

/* Header rata tengah */
#table4 th {
    text-align: center;
}

/* Kolom HPS & Akhir Pendaftaran */
#table4 th:nth-child(3),
#table4 th:nth-child(4),
#table4 td:nth-child(3),
#table4 td:nth-child(4) {
    width: 170px;
}

/* Warna nomor */
#table4 td:first-child center {
    color: #007bff; /* text-blue */
}

/* Nama paket */
#table4 .text-warning {
    color: #ffc107;
}

#map {
   border:0; 
   height: 600px;
}