.container{width:100%;min-height:100vh;height:100%;--color: #E1E1E1;background-color:#f3f3f3;background-image:linear-gradient(0deg,transparent 24%,var(--color) 25%,var(--color) 26%,transparent 27%,transparent 74%,var(--color) 75%,var(--color) 76%,transparent 77%,transparent),linear-gradient(90deg,transparent 24%,var(--color) 25%,var(--color) 26%,transparent 27%,transparent 74%,var(--color) 75%,var(--color) 76%,transparent 77%,transparent);background-size:55px 55px;padding-top:100px}.navbar{position:fixed;top:0;left:50%;transform:translate(-50%);width:80%;border:1px solid black;border-radius:30px;padding:10px 0 10px 20px;margin-top:20px;z-index:1000}.title{display:flex;margin-top:100px;text-align:center;justify-content:center;font-size:3em;font-weight:900;margin-left:300px;margin-right:300px;gap:10px;font-family:ui-sans-serif,system-ui}.maintitle{color:#fff;padding:0 10px 10px;border-radius:4px;background-color:#1c64f2}.addWebbox{margin-top:40px;display:flex;align-items:center;justify-content:center}.card-grid{display:grid;grid-template-columns:repeat(4,1fr);column-gap:50px;row-gap:50px;justify-content:center;align-items:center;padding:100px}.card{border:1px solid black;border-radius:30px}@media (max-width: 1265px){.card-grid{grid-template-columns:repeat(2,1fr)}.title{font-size:2em}}@media (max-width: 690px){.card-grid{grid-template-columns:1fr}.title{margin:0;font-size:1.5rem}}.card-container{margin-top:40px}a{text-decoration:none}.input-main{position:relative;border-radius:9999px;overflow:hidden;background-color:#fff;box-shadow:0 10px 20px #0000001a;width:30rem}.input{background-color:transparent;outline:none;border:none;padding:1.25rem 2.5rem 1.25rem 1.5rem;width:100%;font-family:sans-serif;font-size:1.125rem;font-weight:600}.button-container{position:absolute;right:.5rem;top:.2em}.submit-button{width:3.5rem;height:3.5rem;border-radius:9999px;background-color:#7c3aed;box-shadow:0 10px 20px #0000001a;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.submit-icon{position:relative;z-index:10}.rotate-45-bg,.rotate-neg45-bg{width:100%;height:100%;background-color:#000;position:absolute;transition:all .5s ease}.rotate-45-bg{left:32%;top:32%;transform:rotate(45deg)}.rotate-neg45-bg{left:-32%;top:-32%;transform:rotate(-45deg)}.submit-button:hover .rotate-45-bg{left:-100%;top:-100%}.submit-button:hover .rotate-neg45-bg{left:100%;top:100%}.card{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;color:#000;border-radius:2.5em;height:400px;max-width:350px;position:relative;overflow:hidden;transition:transform .4s ease;background-color:#ebd18d;background-position:top left;padding:20px;display:flex;flex-direction:column}.info{display:flex;flex-direction:column;flex-grow:1}.card-title{font-weight:900;font-size:1.2em}.description{padding:10px;margin-top:15px;text-align:center;font-size:1em}.card:hover{cursor:pointer;transform:scale(.97)}.img-preview{margin:40px 10px 10px;overflow:hidden;border-radius:10px;flex-grow:1;display:flex}.img-preview img{width:100%;height:100%;object-fit:fill;object-position:top left;transition:transform .4s ease}.img-preview:hover img{transform:scale(1.1);transform-origin:top left}.webavatar{vertical-align:middle;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center}.webavatar img{width:20px;height:20px}html,body{margin:0;padding:0;box-sizing:border-box}body{height:100%;overflow-x:hidden}