.dropdown-menu {
  max-width: 250px !important;
    
}


.h-title {
    max-height: 150px;
    
    overflow: hidden;
    position: relative;
}

.hide-text {
    /* The ellipsis will be shown on a single line */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3; /* Number of lines to be visible before showing ellipsis */
    line-height: 1.5; /* Adjust line height for better visibility */
    max-height: 4.5em; /* Calculate this by multiplying line height by -webkit-line-clamp */
    overflow: hidden;
    text-overflow: ellipsis;
}
.border-radius-img-c {
    border-radius: 10px;
}

.    .grid-box-list-temp {
        display: grid;
        gap: 1px;
        padding: 10px;
        grid-template-areas:
        'a a a a a a a a b b b b'
        'a a a a a a a a b b b b'
        'd d d e e e f f f g g g'
    }

    a.grid-box-list-temp:hover {
        border-radius:12px;
        -webkit-transform: scale(2);
        -ms-transform: scale(1.04);
        transform: scale(1.04);
    }
    a.grid-box-list-temp:hover h6, a.grid-box-list-temp:hover p {
        color:#fff;
    }

   
    .el-list-temp1 { grid-area: a; }
    .el-list-temp2 { grid-area: b; }
    .el-list-temp3 { grid-area: c; }
    .el-list-temp4 { grid-area: d; }
    .el-list-temp5 { grid-area: e; }
    .el-list-temp6 { grid-area: f; }
    .el-list-temp7 { grid-area: g; }

    .all-news-box-temp {
        max-height:600px;
        min-height:300px;
        height:600px;
        overflow: hidden;
        border-radius:12px;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: all 2s ease-out;
        padding:10px;
    }

    .all-news-box-temp:hover {
        padding:15px;
    }


    .new-desc-list {
        align-self: flex-end;
        background-color:transparent;
        width:100%;

    }

    .bg-desc-custom {
        /* background: linear-gradient(90deg, #E3E3E3 0%, #5D6874 100%); */
        background-color: rgba(0, 0,0, 0.7);
    }

    .box-card-app{
        border-radius:12px;
    }
    .box-card-app:hover {
        padding:2px;
    }

    .img-small-icon-app {
        border-radius:12px;
    }

    @media (max-width: 600px) {
        .all-news-box-temp {
            max-height:400px;
            min-height:300px;
            height:400px;
            
        }
    }



.blurred-div {
    /* position: relative; */
    width: 100%; /* Adjust the width and height as needed */
    height: auto;
    background-color: rgba(255, 255, 255, 0.1); /* Semi-transparent background color */
    /* color: white;  */
    /* Text color inside the div */
    /* text-align: center; */
    /* display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px; */
    box-sizing: border-box;
}

/* Create a pseudo-element for the background image with blur effect */
.blurred-div::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background-image: url('<?= base_url('assetsapp/master/do.jpg') ?>'); */
    background-size: cover;
    filter: blur(5px); /* Adjust the blur amount as needed */
    z-index: -1;
    opacity: 0.7; /* Adjust the opacity as needed */
}

.text {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* Add a subtle shadow to make text more readable */
}

.box-ser{
    /* margin:2px; */
    border: 2px solid #fff;
    border-radius:10px;
    padding: 5px 2px 5px 2px;
    /* padding-bottom:5px; */
}

.title-box {
    font-size: 15px;
    color: #717275;
}
.img-border-custom {
    border-radius:12px;
}

.grid-box-list {
    display: grid;
    gap: 1px;
    padding: 10px;
    grid-template-areas:
    'a a b b b b'
    'a a c c c c'
}

a.grid-box-list:hover {
    border-radius:12px;
    /* border:2px solid rgba(68, 119, 206, 0.8); */
    /* background-color:rgba(68, 119, 206, 0.8) ; */
    background: linear-gradient(90deg, #13f1fc 0%, #0470dc 100%);


    -webkit-transform: scale(2);
    -ms-transform: scale(1.04);
    transform: scale(1.04);
}

a.grid-box-list:hover h6, a.grid-box-list:hover p {
    color:#fff;
}

.el-list1 { grid-area: a; }
.el-list2 { grid-area: b; }
.el-list3 { grid-area: c; }

.title-news-2{
    font-size: 15px;
    line-height:0.9;
    text-align:justify;
}
.line-height-text1 {
    /* line-height:normal; */
    margin-bottom: 0;
}
.text-small-ket {
    font-size: 11px;
}

.img-size-grid {
    max-height:60px;
}

.text-small-tgl {
    font-size:12px;
    word-spacing: 2px;
}

.box-card-ann {
    background: linear-gradient(90deg, #17ead9 0%, #6078ea 100%);
    padding-top:10px;
    padding-bottom:10px;
    border-radius:12px;
}
.box-card-ann:hover {
    transition: all 1s ease-out;
    
    border-radius:12px;

    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%);
    -webkit-transform: scale(2);
    -ms-transform: scale(1.04);
    transform: scale(1.04);
    
}
.box-card-ann:hover>.title-ann {
    color:#fff;
}


.grid-box-span {
    display: grid;
    gap: 1px;
    padding: 10px;
    grid-template-columns:50% 50% ;

}

.owl-nav .owl-prev, .owl-nav .owl-prev {
    font-size: 14px;
    color:#ff0;
}

.box-counter {
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    padding:3px;
    border-radius:10px;
    
}
.halo-diskominfo {
    position: fixed;
    bottom: 80px;
    right: 15px;
    z-index: 9999;
    max-width: 150px;
}

.gradient1 {
    background: linear-gradient(90deg, #CE9FFC 0%, #7367F0 100%);
}
.gradient2 {
    background: linear-gradient(90deg, #13f1fc 0%, #0470dc 100%);
}

.card-gradient {
    padding:20px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    width:100%;
    height:300px;
    max-height:300px;
    border-radius:18px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 2s ease-out;
   
}
.card-gradient-app {
    padding:20px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    width:100%;
    height:300px;
    max-height:300px;
    border-radius:18px;
    transition: all 2s ease-out;
   
}
.gradient1:hover {
    /* transition: all 2s ease-out; */
    background: linear-gradient(90deg, #7367F0  0%, #CE9FFC 100%);

}

.gradient2:hover {
    /* transition: all 2s ease-out; */
    background: linear-gradient(60deg, #0470dc  0%, #13f1fc 100%);
    

}

.card-gradient:hover {
    -webkit-transform: scale(2);
    -ms-transform: scale(1.04);
    transform: scale(1.04);
}

.all-news-box:hover {
    border-radius:18px;
    background: linear-gradient(60deg, #0470dc  0%, #13f1fc 100%);
    padding:14px;
    transition:1s;
}



@media (max-width: 576px) {
    
    .halo-diskominfo {
        bottom: 80px;
        right: 15px;
        max-width: 90px;
    }

    .card-gradient {
        height:150px;
        max-height:150px;
    }

    .navbar-brand .logo {
        width:40px;
    }
}

.btn-29 {
    padding: 10px 20px;
    border-radius:20px;
    letter-spacing:0.9;
    /* color: radial-gradient(100% 100% at 100% 0, #5adaff 0, #5468ff 100%); */
    background: transparent;
    border:2px solid #203d61;
    color: #203d61;
}

.btn-29:hover {
    background: radial-gradient(100% 100% at 100% 0, #5adaff 0, #203d61 100%);
    color:#fff;
}


@media (max-width: 600px) {
    .btn-29 {
        padding: 7px 15px;

        
    }
}

.card-app-c {
    border-radius:12px;
    border:2px solid #203d61;
    color:#203d61;
    
}

.card-app-c:hover {
    background:#203d61;
    color:#fff;
    padding:3px;

}

.detail-app{
    font-size:10px;
    color:#000;
    font-weight:bold;
}

.card-app-c:hover .detail-app {
  
    color:#fff;

}

.limit-height .text-white-all p {
    color: #fff !important ;
}