body{font-family:Arial,sans-serif;background-color:#212121;margin:0;padding:0;color:#fff}.dialog-content{background-color:#2c2c2c;border-radius:8px;padding:20px;max-width:500px;box-shadow:0 2px 4px #0003;text-align:center}.dialog a{display:inline-block;margin-bottom:10px;color:#fff}.dialog button{display:inline-block;padding:10px 20px;background-color:#333;color:#fff;font-size:16px;border:none;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.container{background-color:#212121;color:#fff}li,.dialog-content{background-color:#2c2c2c}.dialog a{color:#fff}.dialog button{background-color:#333;color:#fff}body{font-family:Arial,sans-serif;background-color:#212121;color:#fff;margin:0;padding:0}.container{max-width:800px;margin:0 auto;padding:20px}h2{text-align:center;font-size:32px;margin-bottom:20px;color:#fff}ul{list-style-type:none;padding:0;margin:0}li{background-color:#2c2c2c;border-radius:8px;padding:20px;margin-bottom:20px;box-shadow:0 2px 4px #0000001a;transition:transform .3s ease}li:hover{transform:translateY(-5px);box-shadow:0 4px 6px #0000001a}h3{font-size:24px;margin-bottom:10px;color:#fff}p{margin:0;color:#ddd}.button{display:inline-block;padding:10px 20px;background-color:#333;color:#fff;font-size:16px;border:none;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.button:hover{background-color:#555}.container{background-color:#2c2c2c;box-shadow:0 4px 8px #0000001a}li{position:relative;overflow:hidden}li:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0000001a;opacity:0;transition:opacity .3s ease}li:hover:before{opacity:1}h3{position:relative}h3:after{position:absolute;bottom:-5px;left:0;width:50px;height:2px;background-color:#fff}.dialog{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:9999;opacity:0;visibility:hidden;transition:opacity 1s ease-in-out,visibility 1s ease-in-out}.dialog-content{background-color:#2c2c2c;border-radius:8px;padding:20px;max-width:500px;box-shadow:0 2px 4px #0003;text-align:center;opacity:0;transform:translateY(50%);transition:opacity 1s ease-in-out,transform 1s ease-in-out}.dialog.open{opacity:1;visibility:visible}.dialog.open .dialog-content{opacity:1;transform:translateY(0)}.dialog h3{font-size:24px;margin-bottom:10px;color:#fff}.dialog p{margin-bottom:20px;color:#ddd}.dialog a{text-decoration:none;display:inline-block;margin:10px;padding:10px 20px;background-color:#333;color:#fff;font-size:16px;border:none;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.dialog a:hover{background-color:#555}.dialog button{display:block;margin:0 auto;padding:10px 20px;background-color:#333;color:#fff;font-size:16px;border:none;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.dialog button:hover{background-color:#555}
