/* ! Page hide */
.hide{
    display: none;
}


/* header and nav */

*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'Nanum Myeongjo', serif;
    user-select: none;

}
.title{
    color: rgba(255, 255, 255, 0.925);
    text-shadow: 2px 2px rgb(212, 212, 212);
    margin-top: 2.5%;
    text-align: center;
    font-size: 75px;
    letter-spacing: 10px;
    font-weight: bolder;
}

button, li {
    color: rgba(51, 51, 51, 0.925);
    text-decoration: none;
}

button li {
    padding: 10px;
    letter-spacing: 5px;
}

.btn{
    background: transparent;
    border: transparent;
    height: 10px;
    color: rgba(51, 51, 51, 0.925);
    transition: 1s;
}

.btn:hover{
    color: rgb(180, 180, 180);
}

.menu{
    text-align: center;
    color: rgba(51, 51, 51, 0.925);
    font-size: 25px;
    display: block;
    list-style: none;
}


a li:hover{
    transition: 1s;
    background: rgba(255, 255, 255, 0.13);
}

/* main section */

main{
    padding-bottom: 10%;
}

#main-one{
    display: none;
}
.section-title{
    color: rgba(51, 51, 51, 0.767);
    font-size: 50px;
    font-weight: bold;
    text-align: center;
    margin-top: 10vh;
    text-shadow: 12px 12px 12px rgba(36, 36, 36, 0.781);
    text-transform: uppercase;
}

/* Card styles */

.container{
    display: flex;
    justify-content: space-between;
    margin: 25px 250px;
    margin-top: 50px;

}

.container img{
    border-radius: 50%;
    box-shadow: 12px 7px 12px rgb(36, 36, 36);
}

.container .card{
    background: rgba(247, 248, 248, 0.192);
    margin: 0 10px;
    height: 300px;
    width: 450px;
    border-radius: 5px;
    transition: 1s;
}

.container .card:hover{
    background: rgba(243, 243, 243, 0.562);
    border-radius: 5px;
    box-shadow: 12px 12px 12px rgb(51, 51, 51);
}


.container .card .card-text{
    color: rgba(51, 51, 51, 0.925);
    margin: 10px ;
}

.container .card h5{
    letter-spacing: 5px;
}

.container .card img{
    width: 150px;
    height: 150px;
    display: block;
    margin: 15px auto;
}

/* button styles */

.btn-body{
    background: transparent;
    border: none;
    color: rgba(51, 51, 51, 0.925);
}

main section p {
    text-align: center;
}