* { margin: 0; padding: 0; box-sizing: border-box; } @font-face{ font-family: titleFont; src: url('unispace\ rg.otf'); } @font-face{ font-family: bodyFont; src: url('F25_Bank_Printer.otf'); } @font-face{ font-family: futurw; src: url('FUTRFW.TTF'); } @keyframes transitionIn { from { opacity: 0; } to { opacity: 1; } } .logo { font-family: futurw; } html, body { perspective: 100px; margin: 0; width: 100%; height: 100%; background-color: rgb(49, 49, 49); background-repeat: no-repeat; background-attachment: fixed; background-size: cover; } video { object-fit: cover; width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; } .cursor { position: fixed; width: 50px; height: 50px; border: 1px solid #c6c6c6; border-radius: 50%; left: 0; top: 0; pointer-events: none; transform: translate(-50%, -50%); transition: .1s; } .cursor2 { position: fixed; width:8px; height: 8px; border: 1px solid #c6c6c6; border-radius: 50%; left: 0; top: 0; pointer-events: none; transform: translate(-50%, -50%); transition: .15s; } .content { animation: transitionIn 1s; } .container { font-family: arial; font-size: 24px; margin: 25px auto; width: 90%; height: 20%; position: relative; top: 40%; left: 0; transform: translateY(-50%); text-align: left; color: #f0f0f0; } .containerOverview { font-family: arial; font-size: 24px; margin: 25px auto; width: 90%; height: 20%; position: relative; top: 15%; left: 0; transform: translateY(-50%); text-align: left; color: #f0f0f0; } .containerTable { font-family: arial; font-size: 24px; margin: 25px auto; width: 100%; height: 20%; position: relative; top: 30%; left: 0; transform: translateY(-50%); text-align: left; color: #f0f0f0; } h1 { font-family: titleFont; color: rgb(193, 193, 193); font-size: 80px; } h3{ font-family: bodyFont; color: rgb(193, 193, 193); font-size: 30px; } p { font-family: bodyFont; font-size: medium; color: rgb(193, 193, 193); } .buttons { margin-top: 30px; } .button { background-color: #515151; border: none; border-radius: 50px; color: rgb(229, 229, 229); padding: 10px 20px; text-align: center; text-decoration: none; display: inline-block; margin: 4px 2px; transition-duration: 0.4s; cursor: pointer; font-size: medium; font-family: bodyFont; } .button:hover { background-color: #731636; color: white; text-decoration: none; } .buttonBack { background-color: #515151; border: none; border-radius: 50px; color: rgb(229, 229, 229); padding: 10px 20px; text-align: center; text-decoration: none; display: inline-block; margin: 4px 2px; transition-duration: 0.4s; cursor: pointer; font-size: medium; font-family: bodyFont; } .buttonBack:hover { background-color: #731636; color: white; text-decoration: none; } .buttonLeft { background-color: #515151; border: none; border-radius: 50px; color: rgb(229, 229, 229); padding: 10px 20px; text-align: center; text-decoration: none; display: inline-block; margin: 4px 2px; transition-duration: 0.4s; cursor: pointer; font-size: medium; font-family: bodyFont; order: 1; margin-left: 30px; } .buttonLeft:hover { background-color: #731636; color: white; text-decoration: none; } .buttonRight { background-color: #515151; border: none; border-radius: 50px; color: rgb(229, 229, 229); padding: 10px 20px; text-align: center; text-decoration: none; display: inline-block; margin: 4px 2px; transition-duration: 0.4s; cursor: pointer; font-size: medium; font-family: bodyFont; order: 2; margin-right: 30px; } .buttonRight:hover { background-color: #731636; color: white; text-decoration: none; } .buttonContent { display: flex; justify-content: space-between; } table { font-family: bodyFont; font-size: small; border-collapse: collapse; width: 100%; table-layout: fixed; } td, th { border: 1px solid #dddddd; text-align: left; padding: 8px; }