:root {
    --primary: #354776;
    --secondary : #e9b117;
}

.header-fasilitas{
    background-image: url("../assets/bg-2.png");
    height: 150px;
    width: 100%;
}


.content-header-fasilitas{
    padding: 10px;
}
.cover-color{
    background-color: #35477639;
    height: 100%;
    width: 100%;
    padding-top: 50px;
}

.header-content{
    background-color: var(--primary);
    width: 100%;
    height: 50px;
}

.header-title-fasilitas{
    color : white;
    font-size: 32px;
    position: relative;
    bottom : 5px;
}

.title-fasilitas {
    font-family: 'PoppinsNormal';
    font-style: normal;
    font-weight: 700;
    font-size: 49px;
    line-height: 74px;
    color: #364878;
    text-align: center;
    text-shadow: 0px 4px 4px #FFFFFF;
}
.divider-title-fasilitas{
    width: 80px;
    height: 10px;
    margin-top: 10px;
    border-radius: 10px;
    background: #FFC928;
}

.title-card-fasilitas{
    font-family: 'PoppinsNormal';
    font-style: normal;    
    font-size: 15px;
    font-weight: normal;
    color: #000;    
    margin-bottom: 12px;
}

.card-fasilitas {
    transition: transform .2s;    
    margin-block: 20px;
    width: 370px;
    height: 277px;
}

.card-fasilitas:hover .hover-content--animated {
    /* transform: scale(1.1);    
    transition-timing-function: linear;      */
    display: block;   
}

.img-list-fasilitas {
    width: 50vh;
    height: 20vh;
    
}

.container-card-hover{
    position: absolute;
    width: 351px;
    height: 260px;
    background: #37487465;
    z-index: 100;
}

.title-container-card{
    font-family: 'PoppinsNormal';
font-style: normal;
font-weight: 500;
font-size: 23px;
line-height: 34px;
text-align: justify;
color: #FFFFFF;
}

.button-container-card{
    
font-family: 'PoppinsNormal';
font-style: normal;
font-weight: 500;
font-size: 18px;
line-height: 27px;

/* identical to box height */
text-align: center;
width: 182px;
height: 41px;
color: #FFFFFF;


background: rgba(217, 217, 217, 0.11);
border: 2px solid #FFFFFF;
border-radius: 20px;
}


.button-container-card:hover{
    background-color: white;
    color: black;
}

.hover-content{
    margin-top: 101px;
}


/* .card-body:hover .hover-content--animated{
    display: inline;
} */

.hover-content--animated{
    display: none;
}

a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover { text-decoration: none; }
a:active { text-decoration: none; }