@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap');

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}


.tutup{
    /*background-color:#627636;*/
    /*width:98vw;*/
    /*height:80vh;*/
    /*background-color:white;*/
    /*border:1px solid black;*/
    /*margin:0;*/
    font-family: 'Roboto', sans-serif;
    /*margin:auto;*/
    
    display:flex;
    min-height:100vh;
    justify-content:center;
    align-items:center;
    /*background:white;*/
    padding:30px 10px;
                
}

/*.tutup::before {*/
/*    content: "";*/
/*    position: absolute;*/
/*    top: 0; left: 0;*/
/*    width: 100%; height: 100%;*/
/*    background-image: url("img/b-kantor8webp.webp");*/
/*    background-size: cover;*/
/*    background-position:center;*/
/*    background-attachment: fixed;*/
/*    filter: blur(10px);*/
/*}*/

.belakang{
    background-image: url("../img/b-kantor8webp.webp");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index:-12;
    height:100vh;
    width:100%;
    position:fixed;
    top:0;
    left:0;
    filter: blur(8px);
}



.tutup_dalam {
    /*position: relative;*/
    /*padding:40px 0px;*/
    /*background-attachment: fixed;*/
    /*min-height:100vh;*/
    
    /*border:1px solid black;*/
}

.tutup_judul{
    margin:30px 0px 50px 0px;
}

.judul1{
    color:white;
    font-size:30px;
}

.judul2{
    color:white;
    font-size:22px;
}

.tutup_ikon{
    display: flex;
    justify-content:center;
    flex-wrap:wrap;
    width:80vw;
    /*border:1px solid #97D56B;*/
    margin:auto;
}

.kotak_ikon{
    width:200px;
    /*height:200px;*/
    /*border:1px solid #97D56B;*/
    text-align:center;
    /*justify-content:center;*/
    margin-bottom:20px;
}

.kotak_ikon:hover .judul{
    /*color:green;*/
    -webkit-text-stroke: 0.5px green;
}

.ikon{
    background-color:white;
    width:120px;
    height:120px;
    border-radius:50%;
    
    border:5px solid #97D56B;
    
    display: flex;
    justify-content: center;
    align-items: center;
    margin:auto;
    margin-bottom:10px;
    
    transition: all .1s ease-in-out;
}

.ikon:hover{
    box-shadow: 0px 4px 6px 6px rgba(0, 0, 0, 0.25);
    
    -ms-transform: scale(1.05); 
    -webkit-transform: scale(1.05);
    transform: scale(1.05); 
    /*animation: boing 200ms ease-in-out;*/
}



.ikon img{
    /*line-height:150px;*/
    width:70px;
}

.kotak_ikon a{
    text-decoration:none;
    color:white;
}

.kotak_ikon .judul{
    /*margin-top:10px;*/
    font-size:18px;
}

@keyframes boing {
              /*15%, 40%, 75%, 100% {*/
                15%, 100% {
                    transform-origin: center center;
                }
                /*15% {*/
                /*      transform: scale(0.95, 0.95);*/
                /*}*/
                15% {
                      transform: scale(1.05, 1.05);
                }
                100% {
                      transform: scale(1.03, 1.03);
                }
            }
            
@media only screen and (max-width: 980px) {
    .kotak_ikon{
        width:40vw;
    }

    .judul1{
        font-size:18px;
    }
    
    .judul2{
        font-size:16px;
    }
}