body{
    font-family: "Lato", sans-serif;
}
.box-delete-form{
    border:1px solid #B1B1B1;
    border-radius:5px;
    padding:20px;
    max-width:900px;
}
.box-delete-form h4{
    font-size:18px;
    font-weight:500;
    margin-bottom:20px;
}
.box-delete-form label{
    font-weight:bold;
}

.login-page-wrapper .logo-wrapper img{
    max-width:240px;
}
.login-page-wrapper .login-form{
    text-align:left;
}
.login-page-wrapper .box-login{
    margin-top:40px;
    width:500px;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
    border-radius:5px;
    /* box-shadow:1px 1px 1px rgba(0,0,0,0.2); */
    border:1px solid rgb(255 71 120);
    background:rgba(255,218,228,0.25);
    padding:30px;
}
.login-page-wrapper .box-login h1{
    font-weight:bold;
    letter-spacing: 2px;
    color:#eb4d77;
}
.login-page-wrapper .box-login .form-control:focus{
    box-shadow:none;
    border:1px solid rgb(255 71 120);
}
.login-page-wrapper .box-login label{
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.5px;
}
.btn-primary-rounded{
    width: 100%;
    border-radius:20px;
    background:rgb(255 71 120);
    border:1px solid rgb(255 71 120);
    color:#fff;
    font-weight:500;
    letter-spacing: 1px;
    transform: 0.25s all ease-in;
}
.btn-primary-rounded:hover{
    transform: 0.25s all ease-in;
    color:rgb(255 71 120);
    border:1px solid rgb(255 71 120);
    background:#fff;
}

.userpage-wrapper{
    max-width: 728px;
    border: 1px solid #dcdcdc;
    border-radius: 20px;
    margin-left: auto;
    margin-right: auto;
    min-height: 100vh;
    background:rgba(255,218,228,0.25);
    overflow:auto;
    box-shadow: 2px 2px 2px 0 rgb(88 88 88 / 20%);
}
.userpage-wrapper .navbar-collapse{
    justify-content: flex-end;
}
.userpage-wrapper .navbar-toggler:focus{
    box-shadow: none;
    border:0;
    outline:none;
}
.userpage-wrapper .navbar-toggler .toggler-icon{
    width:25px;
    display: block;
    height:2px;
    background:#eb4d77;
}
.userpage-wrapper .navbar-toggler .toggler-icon:not(:last-child){
    margin-bottom:6px;
}
.userpage-wrapper .navbar-collapse .nav-item:not(:last-child){
    margin-right:5px;
}
.userpage-wrapper .navbar-collapse .nav-link{
    color:#111111;
    font-weight:500;
    font-size:16px;
    letter-spacing: 1px;
}
.userpage-wrapper .navbar-collapse .nav-link.active{
    color:#eb4d77;
}
.userpage-wrapper .navbar-collapse .nav-link:hover{
    color:#eb4d77;
    border-bottom: 1px solid #eb4d77;
    transition:0.25s all ease-in;
}
.homepage-wrapper .homepage-user{
    padding-left:15px;
    padding-right:15px;
    font-size:28px;
    font-weight:700;
    letter-spacing: 1px;
}
.homepage-wrapper .homepage-bg{
    background:#c1c1c1;
    border-top-left-radius: 30px;
    min-height: calc(100vh - 120px);
    width: 100%;
    margin-top: 20px;
}
.homepage-wrapper .homepage-banner{
    padding-top:30px;
    padding-left:15px;
    padding-right:15px;
}
.homepage-wrapper .homepage-banner .owl-carousel .item{
    padding-top:100%;
    overflow: hidden;
}
.homepage-wrapper .homepage-banner .owl-carousel .item img{   
    position: absolute;
    top: 0;
    bottom: 0;
    max-height: 100%;
    object-fit: cover;
}
.homepage-wrapper .stamp-box{
    margin-left: 30px;
    margin-right: 30px;
    padding: 15px;
    border: 1px solid #C1C1C1;
    border-radius: 10px;
    margin-top: 50px;
    background: #ffe8ee;
    box-shadow: 2px 2px 2px 0 rgb(88 88 88 / 20%);
}
.homepage-wrapper .stamp-box .stamp-top,
.stamp-wrapper .stamp-box .stamp-top{
    display: flex;
    margin-bottom: 10px;
    font-weight: bold;
}
.homepage-wrapper .stamp-box .stamp-top .stamp-title{
    font-size: 18px;
}
.homepage-wrapper .stamp-box .stamp-progress,
.stamp-wrapper .stamp-box .stamp-progress{
    margin-top: 5px;
    margin-bottom: 15px;
}
.homepage-wrapper .stamp-box .stamp-progress .progress,
.stamp-wrapper .stamp-box .stamp-progress .progress{
    background:#ffbecf;
}
.homepage-wrapper .stamp-box .stamp-desc{
    font-size:14px;
}
.homepage-wrapper .stamp-box .stamp-progress .progress-bar,
.stamp-wrapper .stamp-box .stamp-progress .progress-bar{
    background:#eb4d77;
}
.stamp-wrapper .stamp-bg{
    background:#c1c1c1;
    border-top-left-radius: 30px;
    min-height: calc(100vh - 80px);
    width: 100%;
    margin-top: 20px;
    padding-top:20px;
}
.page-title{
    font-size:24px;
    font-weight:bold;
    padding-left:20px;
    padding-right:20px;
    letter-spacing: 1px;
}
.stamp-wrapper .stamp-box{
    margin-left:15px;
    margin-right:15px;
    padding: 15px;
    border: 1px solid #C1C1C1;
    border-radius: 10px;
    margin-top: 30px;
    background: #ffe8ee;
    box-shadow: 2px 2px 2px 0 rgb(88 88 88 / 20%);
}

.stamp-wrapper .stamp-box .stamp-top .stamp-title{
    font-size:16px;
}
.stamp-collection .stamp-collect{
    width: 100px;
    height: 100px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 50%;
    background: #ffbecf;
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    object-fit: cover;
}
.stamp-collection .stamp-collect img{
    max-width:100%;
    max-height:100%;    
}
@media(max-width:425px){
    .navbar-collapse{
        position: fixed;
        top: 0;
        background: #fff;
        bottom: 0;
        left: 0;
        z-index: 4;
        width:0;
        transition:width 0.25s;
        overflow: hidden;
    }
    .userpage-wrapper.show-menu:before{
        content:'';
        position:fixed;
        top:0;
        bottom:0;
        left:0;
        right:0;
        background:rgba(0,0,0,0.7);
        z-index:2;
    }
    .navbar-collapse.show{
        width: 80vw;
        transition: width 0.25s;
        background: #ffe8ee;
    }
    .navbar-collapse .btn-close-menu{
        background: transparent;
        font-size: 26px;
        position: absolute;
        top: 10px;
        right: 25px;
    }
    .navbar-collapse .navbar-nav{
        padding: 30px 20px;
        padding-top: 60px;
    }
    .homepage-wrapper,.stamp-wrapper{
        padding-bottom:30px;
    }
    .stamp-collection .stamp-collect{
        width:80px;
        height:80px;
        margin-bottom:15px;
    }

}