* {
    padding: 0;
    margin: 0;
}

body {
    background: #F0F8FF !important;

    /* background: #5AA9E6; */
    /* background:blue !important; */
    /* background:linear-gradient(to right,#F0F8FF, #FFE4E1 ); */
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    color: #1C1D21;
    min-height: 100%;
}

a {
    /* color: #C42348 !important; */
    text-decoration: none !important;
}

nav {
    /* background: white; */
    /* background: linear-gradient(to right,white  30%, blue  120%); */
    /* background: linear-gradient(to right, #F0F8FF,#FFE4E1); */
    /* background: linear-gradient(45deg, #87CEEB, #FA8072); */
    background:linear-gradient(to right,#E6E6FA, #FFDAB9 );
    z-index: 99;
    box-shadow: 1px 2px 5px 0px rgba(130, 130, 130, 0.40);
    -webkit-box-shadow: 1px 2px 5px 0px rgba(130, 130, 130, 0.40);
    -moz-box-shadow: 1px 2px 5px 0px rgba(130, 130, 130, 0.40);
    color: white !important;
}

div.pagination_index nav {
    /* background: white; */
    background: #F0F8FF;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
}

.navbar {
    padding-top: 1 !important;
    padding-bottom: 0 !important;;
}

nav ul li {
    font-weight: 600;   
   
}



h1 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}

footer {
    /* position: absolute; */
    bottom: 0;
    width: 100%;
}

.main-logo {
    height: 60px;
}

.nav-item {    
    padding: 0px 5px;
    /* padding-left: 2rem; */
   
}


.nav-item .active {
    color: #C42348 !important;
}

.nav-item :hover {
    color: #C42348 !important;
    ;
}

.cs-container {
    margin-top: 75px;
}

.cs-footer {
    height: max-content;
    /* background: #5AA9E6; */
    /* background:linear-gradient(to bottom,blue, #C42348);   */
    background: linear-gradient(to bottom, #B0E0E6,#FFA07A); 
    color: rgb(7, 6, 6);
    font-weight: 600;
    /* margin-top: auto; */
}

.cs-copyright {
    border-top: 1.25px solid #4A96D1;
}

.cs-screen {
    height: calc(100vh - 19.5rem);
}

.footer-link {
    text-decoration: none;
}

.contact:link,
.contact:visited {
    color: rgb(21, 120, 57);
    text-decoration: none;
}

.contact-kontak,
.contact-kontak:link,
.contact-kontak:visited {
    color: black;
    font-weight: 500;
}

.cs-banner {
    background: black;
    width: 100%;
    max-height: 450px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cs-banner-content img {
    height: 160%;
}

.carousel-item {
    max-height: 450px;
}

.carousel-item img {
    opacity: 0.4;
    height: 100%;
    width: auto;
}

.carousel-caption {
    top: 32%;
    bottom: 50%
}

.cs-white {
    background: #F0F8FF;
    /* background: blue; */
    /* background: linear-gradient(to bottom, white 20%, blue 100%); */
    /* background:linear-gradient(to top,blue 40%, white 60% ); */
    /* background: radial-gradient(circle, maroon, blue); */
}

.cs-table thead {
    border-bottom: 2px solid white;
    box-shadow: 2px 6px 5px -1px rgba(199, 199, 199, 0.53);
    -webkit-box-shadow: 2px 6px 5px -1px rgba(199, 199, 199, 0.53);
    -moz-box-shadow: 2px 6px 5px -1px rgba(199, 199, 199, 0.53);
    line-height: 1.5rem;
}

.cs-table tr {
    line-height: 1.5rem;
}

.home-py {
    margin-top: 3rem;
    margin-bottom: 5rem;
}

.home-left h3, h5, h4 {
    font-size: 1.20rem;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 500;
    letter-spacing: 1px;
    color: #C42348;
}

.judul{
    font-size: 1.20rem;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 500;
    letter-spacing: 1px;
    color: #C42348;
}
/* .home-left p {
     font-size: 1.1rem; 
} */

.tekshome {
 font-size: 1.1rem;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 200;
    /* letter-spacing: 1px; */
   
}

.home-right a {
    padding: 5px 2px;
    color: #3b44f0;
    font-family: 'Nunito Sans', sans-serif;
    text-decoration: none;
}

.home-right a:hover {
    background: rgb(240, 239, 239);
    color: #C42348;
}

.image-lainnya {
    float: right;
}

.txt-img {
    width: 14;
    height: 12;
    margin-bottom: 1px;
}

.home-redirect {
    padding: 5px 0px;
    
}

.active-nested {
    background: rgb(240, 239, 239) !important;
    color: #c42348 !important;
    ;
}

.dropdown-item:focus {
    background: rgb(240, 239, 239) !important;
}

.cs-table-container {
    padding: 1rem 6rem;
    min-height: 80vh;
}

.cs-table-breadcrumb p {
    color: #ce4967;
    font-weight: 600;
    margin-bottom: 20px;
}

.cs-table-filter {
    margin-bottom: 20px;
}

.cs-dropdown {
    background: none !important;
    max-width: max-content !important;
    color: black !important;
}

.cs-dropdown select {
    background: white !important;
    margin-left: 5px;
    border: 1px solid black;
    border-radius: 4px;
    padding: 2px 2px;
    color: black !important;
}

.cs-input-text input {
    margin-left: 10px;
    height: max-content;
}

.cs-input-text {
    margin-left: 10px;
    display: flex;
    justify-content: end;
}

.cs-table a {
    cursor: pointer;
    color: #C42348 !important;
    text-decoration: none;
}

.cs-table a:hover {
    cursor: pointer;
    color: #d73258 !important;
}

.card-body a {
    cursor: pointer;
    color: #C42348 !important;
    text-decoration: none;
}

.card-body a:hover {
    cursor: pointer;
    color: #d73258 !important;
}

.cs-filter-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.cs-detail-container {
    padding: 2rem 11rem;
    min-height: 80vh;
}

.cs-detail-left {
    flex: 2.5 0 0%;
    margin-right: 50px;
    /* width: 20px; */
}

.cs-detail-right {
    flex: 1 0 0%;
    border-left: 2px solid #EFEBEB;
}

.cs-detail-right h4 {
    font-size: 1.05rem;
    padding-left: 20px;
    padding-top: 10px;
}

.cs-artikel-container {
    padding-left: 4rem;
    padding-right: 4rem;
    min-height: 80vh;
}

.card-container {
    padding: 1rem 1.5rem;
    min-height: 80vh;
}

.detail-subtel {
    font-weight: 600;
    line-height: 1.5rem;
}

.value {
    margin-bottom: 0.5rem;
}

.detail-image {
    /* max-width: 400px!important; */
    /* height: 400px; */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.detail-artikel-image {
    max-width: 100%;
    height: auto;
    text-align: center;
}

.detail-image-main {
    max-height: 50vh;
    max-width: 100%;
}

.cs-right-link a {
    cursor: pointer;
    font-weight: 500;
    font-size: 1.05rem;
    text-decoration: none;
    color: #1C1D21;
}

.cs-right-link a:hover {
    color: #3c3e45;
}

.detail-info {
    margin-left: 3.5rem;
    display: flex;
    flex-direction: column;
}

.cs-card-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
}

.cs-card-container {
    padding: 5px 10px;
    margin-top: 5px;
    border-radius: 50px;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
}

.cs-card-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
    /* display: block; */
    object-position: center;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
}
.cs-card-image-detail {
    width: 80%;
    height: 250px;
    object-fit: fill;
    /* display: block; */
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
}
.cs-card-col {
    flex: 0 0 auto;
    width: 302px;
    border-radius: 100px;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
    
}

.max-length2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    /* number of lines to show */
    -webkit-box-orient: vertical;
    
}
.card{
    /* box-shadow: 0 -2px 20px rgba(12, 220, 123, 1); */
    box-shadow: 0 -2px 20px rgb(18, 18, 18);
}

.max-lengthjudul {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    /* number of lines to show */
    -webkit-box-orient: vertical;
    text-align: center;
    
}

.max-lengthtempat {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* number of lines to show */
    -webkit-box-orient: vertical;
}
.max-lengthwaktu {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    /* number of lines to show */
    -webkit-box-orient: vertical;
    color: #440b69;
    
}
.warnahurufbiru{
    color: #440b69;
}
.posisi-selengkapnya{
    text-align: right;
    
}
hr{
    border: 0;
    height: 1px;
    background: #ccc;
    margin: 0; /* Atur margin atas dan bawah */
}

.cs-right-list {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    line-height: 1.8rem;
    padding-top: 10px;
    padding-left: 5px;
}

.cs-materi-list {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    line-height: 1.25rem;
    padding-top: 10px;
    padding-left: 20px;
}

.cs-rl-items {
    /* display: flex; */
    /* flex-direction: row; */
    padding-bottom: 20px;
}

.cs-rl-title {
    width: auto;
}

.cs-accordion {
    width: 100% !important;
}

.button-no-style {
    border: none;
    background-color: transparent;
    outline: none;
    cursor: pointer;
    color: #737373;
    font-weight: 500;
}

.accordion-button:not(.collapsed) {
    color: #C42348 !important;
    background: rgb(240, 239, 239) !important;
}

.accordion-button:focus {
    z-index: 3;
    border-color: none !important;
    outline: 0;
    box-shadow: none !important;
}

.accordion-button::after {
    background-image: none !important;
}

.materi-title {
    /* max-width: 26rem; */
    /* width: 90%; */
    line-height: 2.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* number of lines to show */
    line-clamp: 2;
    -webkit-box-orient: vertical;
}

.video-title {
    /* max-width: 26rem; */
    /* width: 90%; */
    line-height: 2.5rem;
    overflow: hidden;
}

.materi-action {
    line-height: 2.5rem;
}

.cs-prehead {
    display: flex;
    justify-content: flex-end;
    color: #737373;
    /* border-bottom:1px solid black; */
}

.prehead-line {
    padding: 0;
    margin: 0;
}

.normal-link a {
    cursor: pointer;
    color: #737373;
    font-weight: 500;
    text-decoration: none;
}

.normal-link :hover {
    color: #C42348;
}

.kontak-line {
    width: 40%;
}

.cs-txt-active {
    color: #C42348 !important;
}

.float-whatsapp {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 40px;
    background-color: #25d366;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
}
.float-instagram {
    position: fixed;
    width: 100%;
    height: 60px;
    bottom: 0px;
    left: 0px;
    background-color: #f33c3c;
    color: #FFF;
    border-radius: 0px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
}
.my-float {
    margin-top: 16px;
}

.my-float-instagram {
    margin-top: 16px;
}

.cs-button {
    background-color: #c42348;
    color: white;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    font-size: 16px;
    height: 40px;
    border: none;
    border-radius: 6px;
    padding: 8px 16px;
    margin-top: 8px;
}

.cs-button:hover {
    background-color: #e94067;
    color: white;
}

.main_embed_video {
    width: 700px;
    height: 400px
}


/* Mobile */

@media only screen and (max-width: 576px) {
    .card-selamatdatang {
        margin-right:20px;    
      }

    .fontmedium{
        font-size: medium;
    }
    .burger-list {
        display: block;
    }

    .navbar-logo {
        margin: auto;
    }

    .main-logo {
        height: 40px;
    }

    .cs-container {
        margin-top: 60px;
    }

    .cs-detail-left {
        margin-bottom: 30px;
    }

    .navbar-collapse ul {
        font-size: 1.25rem;
        /* padding-top: 1rem; */
    }

    .basic-padding {
        padding: 0rem 3rem;
    }
    .basic-padding-nav {
        padding: 0rem 2rem;
    }
    .basic-paddingberanda {
        padding: 0rem 1.5rem;
    }

    .cs-copyright {
        justify-content: center;
        align-items: center;
    }

    .fs-top {
        flex-direction: column;
    }

    .fs-bot {
        flex-direction: column;
    }

    .footer-address {
        padding-bottom: 1rem;
        text-align: center;
    }

    .footer-map {
        min-width: 100%;
    }

    .footer-credit {
        margin-bottom: 0.25rem;
    }

    .fs-icon {
        max-width: max-content;
    }

    .fs-icon .col {
        cursor: pointer;
    }

    .home-row {
        flex-direction: column; 
        
    }

    .cs-dropdown {
        margin-bottom: 10px;
        /* background: blue!important; */
    }

    .cs-filter-row {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        
    }

    .cs-input-text {
        margin-left: 10px !important;
        display: flex;
        /* flex-direction: column; */
        justify-content: start;
    }

    
    .cs-input-text .text-cari {
        margin-left: 10px !important;
        width: 100%;
    }

    .cs-table-container {
        padding: 1rem 2rem;
    }

    .cs-input-text input {
        margin-left: 10px;
        width: 45%;
    }

    /* .cs-dropdown {
         display: none; 
    } */

    .judul-nav{
        display: none; 
    }

    /* .detail-info{
        background: red;
    } */
    .cs-detail {
        display: block !important;
    }

    .card-container .cs-table-breadcrumb {
        text-align: center;
    }

    .card-container {
        padding: 0rem 1.2rem;
    }

    .detail-image {
        max-width: 100% !important;
        margin: auto;
        margin-bottom: 20px;
    }

    .detail-info {
        margin-left: 0;
        width: max-content;
    }

    /* .detail-image{
        width: 100px;
        height: 200px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    } */
    .cs-card-col {
        flex: 0 0 auto;
        width: 100%;
    }

    .cs-card-row {
        flex-direction: column;
    }

    .cs-artikel-container {
        padding-left: 2.5rem;
        padding-right: 2.5rem;
        min-height: 80vh;
    }

    .cs-detail-left {
        margin-right: 0;
        /* width: 20px; */
    }

    .cs-accordion {
        width: 100% !important;
    }

    .materi-title {
        max-width: 100%;
    }

    .cs-prehead .normal-link {
        display: none;
    }

    .prehead-line {
        display: none;
    }

    .prehead-mobile {
        display: block !important;
    }

    .kontak-line {
        width: 90%;
    }

    .detail-image-main {
        max-height: 45vh;
        max-width: 100%;
    }

    .cs-container {
        margin-top: 50px;
    }

    .carousel-item {
        max-height: 400px;
    }

    .carousel-caption {
        top: 15%;
    }

    .carousel-caption h1 {
        font-size: 18px;
    }

    .carousel-caption p {
        /* width: 350px; */
        margin: auto;
        margin-bottom: 8px;
        overflow: hidden;
        display: -webkit-box;
        font-size: 14px;
        -webkit-line-clamp: 2;
        /* number of lines to show */
        line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .cs-button {
        font-size: 14px;
        height: 30px;
        padding: 4px 8px;
    }

    .main_embed_video {
        width: 100%;
        height: 240px;
    }
    
    nav ul li {
       font-weight: 600;
       font-size: medium;
       color: black;
    }    
}

@media only screen and (min-width:320px) and (max-width: 992px) {
    .card-selamatdatang {
        margin-right:20px;    
      }
    .navbar {
        padding-top: 1 !important;
        padding-bottom: 0 !important;;
    }
    .judul-nav{
        display:block; 
    }
    nav ul li {
       font-weight: 600;
       font-size: medium;
       color: black;
    }
    .fontmedium{
        font-size: medium;
    }
    .basic-padding {
        padding: 0rem 4rem;
    }
    .basic-padding-nav {
        padding: 0rem 2rem;
    }

    .basic-paddingberanda {
        padding: 0rem 1rem;
    }

    .cs-table-container {
        margin-left: 0;
        padding: 1rem 4rem;
    }

    .cs-detail-container {
        padding: 2rem 1rem;
    }

    .cs-card-col {
        flex: 0 0 auto;
         width: 100%; 
         border-radius: 60px;
    }

    .cs-table-filter {
        margin-bottom: 5px;
        margin-top: 22px;
    }

    .card-container {
        padding: 2rem;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .cs-detail-right {
        flex: 0 0 auto;
        width: 100%;
        /* clear: right; */
        /* display: none; */
    }

    .cs-artikel-container {
        padding-top: 1rem;
        padding-left: 1rem;
        padding-right: 1rem;
        min-height: 80vh;
    }

    .cs-detail-left {
        margin-right: 0;
        /* width: 20px; */
    }

    .cs-accordion {
        width: 100% !important;
    }

    .cs-prehead .normal-link {
        display: none;
    }

    .prehead-line {
        display: none;
    }

    .prehead-mobile {
        display: block !important;
    }

    .kontak-line {
        width: 90%;
    }

    .cs-container {
        margin-top: 40px;
        
    }
    .carousel-item {
        max-height: 300px;
    }

    .carousel-caption {
        top: 27%;
    }

    .carousel-caption p {
        /* width: 350px; */
        margin: auto;
        margin-bottom: 8px;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        /* number of lines to show */
        line-clamp: 3;
        -webkit-box-orient: vertical;
    }

}
/* Tablet */
@media only screen and (min-width: 720px) {
    .card-selamatdatang {
        margin-right:20px;    
    }
    /* .main_embed_video {
        width: 100%;
        height: 480px
    } */
    .burger-list {
        display: block;
    }

    .navbar-logo {
        margin: auto;
    }

    .navbar-collapse ul {
        font-size: 1rem;
        /* padding-top: 1rem; */
    }

    .basic-padding {
        padding: 0rem 4rem;
    }

    .basic-padding-nav {
        padding: 0rem 2rem;
    }

    .basic-paddingberanda {
        padding: 0rem 3rem;
        
    }

    .footer-map {
        width: 195px;
    }
}
/* Hide prehead-mobile for inbetween screen size */
@media only screen and (min-width: 992px) {
    .prehead-mobile {
        display: none !important;
    }
    .card-selamatdatang {
        margin-right:40px;    
      }
}
/* Reg Screen */
@media only screen and (min-width: 992px) {
    .card-selamatdatang {
        margin-right:40px;    
      }
    .burger-list {
        display: none;
    }

    .navbar-logo {
        margin: 0;
    }

    .navbar-collapse ul {
        font-size: 1rem;
        /* padding-top: 1rem; */
    }

    /* .basic-padding{
        padding: 0rem 8rem;
    } */
    .basic-paddingberanda {
        padding: 0rem 3rem;
    }

    .home-left {
        margin-left: 0rem;
    }

    .prehead-mobile {
        display: none !important;
    }

    .judul-nav{
        display: none; 
    }
}
/* Big Screen */
@media only screen and (min-width: 1920px) {
    .card-selamatdatang {
        margin-right:40px;    
      }
    .burger-list {
        display: none;
    }

    .navbar-logo {
        margin: 0;
    }

    .navbar-collapse ul {
        font-size: 1rem;
        padding-top: 1rem;
    }

    .basic-padding {
        padding: 0rem 10rem;
    }

    .basic-paddingberanda {
        padding: 0rem 10rem;
    }

    .home-left {
        margin-left: 0rem;
    }
}

.card-selamatdatang {
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    /* margin-right: 40px; */
    max-width: 900px;  
  }


 .tekscenter{
    text-align: center;    
 }
 .teks{
    font-size: 18px;
    font-weight: 500;
    font-family: 'Nunito Sans', sans-serif;
    text-align: justify;
 }
 
 .marquee {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
}

.marquee span {
    display: inline-block;
    padding-left: 100%;
    
    animation: marquee 40s linear infinite;
    animation-play-state: running; /* Menambahkan properti ini */
    /* text-align: center; */
}

.marquee span:hover {
    animation-play-state: paused; /* Marquee berhenti ketika di-hover */
}

@keyframes marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-100%); }
}


 .card-judul {
    background-color: #c42348;
    cursor:pointer;
    /* background: linear-gradient(to right, #c42348, blue); */
    /* background: conic-gradient(from 0deg, maroon, blue); */
    /* background: linear-gradient(to right, #c42348, blue); */
    /* background: radial-gradient(circle, #c42348, blue); */
    /* border-top-right-radius: 20px;
    border-top-left-radius: 20px; */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 5px;   
    margin-top: 0; 
    font-family: 'Nunito Sans', sans-serif;
    /*max-width: 400px;*/
    height:fit-content; 
    font-size:1.2rem;
    color: #fff;
    font-weight: 400;
    width:100%;
    text-align: center;
 }
 .cardjudul {
    /* background-color: #c42348; */
    cursor:pointer;
    /* background: linear-gradient(to right, blue 30%, #c42348 120%); */
    /* background: conic-gradient(from 0deg, maroon, blue); */
    /* background: linear-gradient(to right, #6495ED,#F08080); */
    background: linear-gradient(to right, #B0E0E6,#FFA07A);
    /* background: linear-gradient(to right, #40E0D0,#F4A460); */

    /* background: linear-gradient(to right, #F0F8FF,#FFE4E1); */
    /* background:linear-gradient(45deg, #F0F8FF, #FFE4E1); */
    /* background: radial-gradient(circle, #c42348, blue); */
    border-top-right-radius: 30px;
    border-top-left-radius: 0px;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
    padding: 10px;       
    font-family: 'Nunito Sans', sans-serif;
    /*max-width: 400px;*/
    height:fit-content; 
    font-size:1.2rem;
    color: #0f0c0c;
    font-weight: 600;
    width:100%;
    /* text-align: center; */
    display: flex;
     justify-content: space-between; 
    align-items: center;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
        

 }
 .gerak{
    margin-top: 10px;
    background: black;
    border-top-right-radius: 50px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 0px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
 }
 .gerak:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2), 0 10px 10px rgba(0, 0, 0, 0.2);
}
 .card-judulawal {
    background-color: #c42348;
    /* background: linear-gradient(to right, #c42348, blue); */
    /* background: conic-gradient(from 0deg, maroon, blue); */
    /* background: linear-gradient(to right, #c42348, blue); */
    /* background: radial-gradient(circle, #c42348, blue); */
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 5px;   
    margin-top: 0; 
    font-family: 'Nunito Sans', sans-serif;
    /*max-width: 400px;*/
    height:fit-content; 
    font-size:1.2rem;
    color: #fff;
    font-weight: 400;
    width:100%;
    text-align: center;
 }
  .card-maribergabung {
    background-color: #B0E0E6;
    /* background: linear-gradient(to right, #B0E0E6,#FFA07A); */
    /* background: linear-gradient(to right, #F0F8FF,#FFE4E1); */
    /*border-radius: 10px;*/
    box-shadow: 0 0 5px rgba(202, 189, 189, 0.5); 
    /* // rgba(0, 0, 0, 0.1);  */
    padding: 15px;
    
    /* margin-right: 40px; */
    max-width: 100%; 
    height:fit-content; 
    /* border-bottom-right-radius: 20px; */
    border-bottom-left-radius: 20px;
 }
 .card-maribergabungawal {
    background-color: #ffffff;
    /*border-radius: 10px;*/
    box-shadow: 0 0 5px rgba(202, 189, 189, 0.5); 
    /* // rgba(0, 0, 0, 0.1);  */
    padding: 15px;
    /* margin-right: 40px; */
    max-width: 900px; 
    height:fit-content; 
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
 }
   .card-selamatdatang-top {
    background-color: #ffffff;
    /*border-radius: 10px;*/
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 5px;
    /* margin-right: 40px; */
    /*max-width: 900px; */
    height:fit-content; 
    /*border-top-right-radius: 20px;*/
    /*border-top-left-radius: 20px;*/
    width:100%;
 }
   .card-selamatdatang-bottom {
    /* background-color: white; */
    background: linear-gradient(to right, #B0E0E6,#FFA07A);
    /* background: linear-gradient(to right, #c42348, blue); */
    /*border-radius: 10px;*/
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
    padding: 5px;
    /* margin-right: 40px; */
    /*max-width: 900px; */
    height:fit-content; 
    /* border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px; */
    width:100%;
 }
 .cardbottom{
    width:100%;
 }

 .contentisi {
     padding: 10px;
     display: none;
 }
 .arrow {
     transition: transform 0.2s;
 }
 .arrow.down {
     transform: rotate(0deg);
 }
 .arrow.up {
     transform: rotate(180deg);
 }

 
 .sekolah-row {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
    gap: 10px;
}

.cs-donasi {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    justify-content: center; /* Jika Anda juga ingin menempatkan teks di tengah secara horizontal */
    height: auto; /* Pastikan elemen induk memiliki tinggi yang diinginkan */
    background-color: #117554;
    color: #FFFFFF;
    font-weight: 750;
    font-size: large;
    padding-top: 10px;
    padding-bottom: 10px;
}

