:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif}body{text-align:center;background:linear-gradient(94deg,rgba(1,64,137,.872) 13%,rgba(3,61,148,.853) 95%)}@media only screen and (min-device-width: 768px) and (max-device-width: 1024px){.heading{display:flex;align-items:center;justify-content:center;margin:0;padding:0}.heading h1{font-size:2rem;margin:10px;border:1px solid black;width:fit-content;border-radius:4px;padding:5px 20px;background-color:#fafafa;color:#020202e1}.heading h1 span{color:#1b78fa}.container{display:flex;justify-content:center;align-items:center}.container .copy-button{display:flex;flex-direction:column;justify-content:center;align-items:center;margin:20px}.container .copy-button .demo{display:flex;justify-content:center;align-items:center;margin:20px;border:1px solid black;width:300px;height:200px;border-radius:5px;background-color:#fff;box-shadow:8px 8px #171717}.container .copy-button .copy{margin:10px;padding:10px;border:none;border-radius:5px;font-size:1.2rem;cursor:pointer}.container .copy-button .copy:nth-child(1){background-color:#fff;color:#000}.container .copy-button .copy:nth-child(2){background-color:#000;color:#fff}.container .details{background-color:#fff;display:flex;flex-direction:row;flex-wrap:wrap;margin:20px;width:50vw;padding:20px 10px;border:1px solid black;border-radius:10px}.container .details .merge-shadow{display:flex;flex-wrap:wrap}.container .details .merge-shadow input{width:25px!important;height:25px;color:#000}.container .details div{width:fit-content;display:flex;align-items:center;border:1px solid #939090;border-radius:10px;margin:5px;transition:all .3s ease}.container .details div h1{margin:10px;font-size:1rem;transition:all .3s ease}.container .details div:hover{transition:all .3s ease;border:1px solid rgb(14,94,254);background-color:#99f6ff}.container .details div:hover h1{transition:all .3s ease;color:#000}.container .details div input{width:100px;margin:10px;font-size:1rem;border:2px solid rgba(14,94,254,.9529411765);background-color:#eee;border-radius:5px;color:#000}}@media screen and (min-width: 1025px) and (max-height: 1310px){.heading{display:flex;align-items:center;justify-content:center;margin:0;padding:0}.heading h1{font-size:2.5rem;border:1px solid black;border-radius:4px;padding:5px 20px;background-color:#fafafa;color:#020202e1;box-shadow:7px 7px #0e0e0e;margin:10px 0}.heading h1 span{color:#1b78fa}.container{display:flex;justify-content:center;align-items:center;margin:20px}.container .copy-button{display:flex;flex-direction:column;justify-content:center;align-items:center;margin:20px}.container .copy-button .demo{display:flex;justify-content:center;align-items:center;margin:20px;border:1px solid black;width:400px;height:300px;border-radius:20px;background-color:#fff;box-shadow:#0000002b 0 -23px 25px inset,#00000026 0 -36px 30px inset,#0000001a 0 -79px 40px inset,#0000000f 0 2px 1px,#00000017 0 4px 2px,#00000017 0 8px 4px,#00000017 0 16px 8px,#00000017 0 32px 16px}.container .copy-button .copy{margin:10px;padding:10px;border:none;border-radius:5px;font-size:1.2rem;cursor:pointer}.container .copy-button .copy:nth-child(1){background-color:#fff;color:#000}.container .copy-button .copy:nth-child(2){background-color:#000;color:#fff}.container .details{background-color:#fff;display:flex;flex-direction:row;flex-wrap:wrap;margin:20px;width:50vw;padding:25px 40px;border:1px solid black;border-radius:20px;box-shadow:#00000059 0 5px 15px;box-shadow:#26394d 0 20px 30px -10px;box-shadow:#0000004d 0 19px 38px,#00000038 0 15px 12px}.container .details .merge-shadow{display:flex;flex-wrap:wrap}.container .details .merge-shadow input{width:25px!important;height:25px;color:#000}.container .details div{width:fit-content;display:flex;align-items:center;border:1px solid #939090;border-radius:10px;padding:10px 3px;margin:5px;transition:all .3s ease;cursor:pointer}.container .details div h1{margin:5px;font-size:1.2rem;transition:all .3s ease}.container .details div:hover{transition:all .3s ease;border:1px solid rgb(14,94,254);background-color:#99f6ff}.container .details div:hover h1{transition:all .3s ease;color:#000}.container .details div input{width:100px;margin:10px;font-size:1.2rem;border:2px solid rgba(14,94,254,.9529411765);background-color:#eee;border-radius:5px;color:#000}}
