.buttons-container{width:400px;margin:auto;display:flex;justify-content:space-around}button{background-color:#db194f;border:2px solid #db194f;border-radius:50%;width:60px;height:60px;color:#fff;font-size:30px;cursor:pointer}button:active{transform:translateY(4px)}.button-box{position:relative}.button-shadow{border-radius:50%;width:60px;height:60px;background-color:#178fc0;position:absolute;top:5px;z-index:-1}.card{background-color:#178fc0;width:200px;height:250px;border-radius:16px;overflow:hidden;box-shadow:3px 3px 10px;position:relative}.card-name{width:140px;background-color:#db194f;color:#fff;font-size:20px;text-align:center;position:absolute;right:0;top:0;padding:6px 12px}.circle{background-color:#f2cb05;height:150px;width:150px;border-radius:50%;position:absolute;top:56px;left:24px}.card-img{position:absolute;top:56px;left:24px;z-index:1;width:100%}.card-container{height:250px;width:500px;margin:50px auto;display:flex;position:relative}.card-container .card:nth-child(1){position:absolute;left:0;z-index:3;transition:.3s;transform:rotate(-5deg) translateY(10px)}.card-container .card:nth-child(2){position:absolute;left:150px;z-index:2;transition:.3s}.card-container .card:nth-child(3){position:absolute;left:300px;transition:.3s;z-index:1;transform:rotate(5deg) translateY(10px)}.card-container .card:nth-child(1):hover{transform:rotate(-5deg) translateY(0)}.card-container .card:nth-child(2):hover{transform:translateY(-10px)}.card-container .card:nth-child(3):hover{transform:rotate(5deg) translateY(0)}.container2{transform:translate(80px) rotate(3deg)}.container1{transform:translate(140px) rotate(5deg)}*{margin:0%;padding:0%;box-sizing:border-box;font-family:Verdana,Geneva,Tahoma,sans-serif}.app{border:1px solid #b7d937;height:100vh;position:relative;z-index:1;background:#b7d937}.logo-container{position:absolute;left:40%;bottom:5%}
