PocztaUO - Logowanie do Poczty Uniwersytetu Opolskiego

<!DOCTYPE html> <html><head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"><meta charset="UTF-8"> <title>PocztaUO - Logowanie do Poczty Uniwersytetu Opolskiego</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> .wrapper { height: 100vh; display: flex; } .wrapper .section { flex: 1; display: flex; flex-direction:column; } a:link { text-decoration: none; } a:visited { text-decoration: none; } a:hover { text-decoration: none; } a:active { text-decoration: none; } @media (hover: hover) { .wrapper .section span { margin: auto auto 0; font-size: 20px; padding: 10px 15px; font-family: -apple-system, BlinkMacSystemFont, "Oswald", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 4vw; text-shadow: 7px 2px 20px rgb(0, 0, 0), 9px 2px 10px rgb(0, 0, 0), 7px 2px 5px rgb(0, 0, 0); text-decoration: none; overflow-wrap: break-word; color: #fff; cursor: pointer; } .wrapper .section:first-child { transition: background-color 0.4s ease; background: rgba(0, 0, 0, .65) url('ox_screen.png') center/cover; background-blend-mode: darken; } .wrapper .section:first-child:hover { transition: background-color 0.4s ease; background: url('ox_screen.png') center/cover; background-blend-mode: darken; cursor: pointer; } .wrapper .section:last-child { margin-left: -10vw; clip-path: polygon(10vw 0, 100% 0, 100% 100%, 0 100%); transition: background-color 0.4s ease; background: rgba(0, 0, 0, .65) url('365_screen.png') center/cover; background-blend-mode: darken; } .wrapper .section:last-child:hover { transition: background-color 0.4s ease; background: url('365_screen.png') center/cover; background-blend-mode: darken; cursor: pointer; } } @media (hover: none) { .wrapper .section span { margin: auto auto 0; font-size: 10px; padding: 10px 15px; font-family: -apple-system, BlinkMacSystemFont, "Oswald", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 8vw; text-shadow: 7px 2px 20px rgb(0, 0, 0), 9px 2px 10px rgb(0, 0, 0), 7px 2px 5px rgb(0, 0, 0); text-decoration: none; overflow-wrap: break-word; text-align: center; color: #fff; cursor: pointer; } .wrapper section:first-child { background: url('ox_screen.png') center/cover; } .wrapper section:last-child { margin-left: -10vw; clip-path: polygon(10vw 0, 100% 0, 100% 100%, 0 100%); background: url('365_screen.png') 10% 90%/cover; } } body { margin: 0; overflow: hidden; } /* Modal */ .modal { font-family: -apple-system, BlinkMacSystemFont, "Oswald", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-size: 15px; font-weight: 600; display: none; position: fixed; z-index: 1; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(1.15); background-color: #fff; box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.2); border-radius: 8px; max-width: 500px; } @media (min-width: 769px) { /* Wersja desktopowa */ .modal { top: 21%; } } .modal-content { padding: 20px; text-align: center; } .close { position: absolute; top: 1px; right: 10px; font-size: 24px; cursor: pointer; } .ox { background-color:#052c4b; } .o365 { background-color:#2f6ab6; } .close:hover { color: #333; } </style> <link href="https://fonts.googleapis.com/css2?family=Oswald:wght@300;600&display=swap" rel="stylesheet"> </head> <body> <main class="wrapper"> <a class="section ox" href="/appsuite"> <span>Logowanie Pracownicy </span> <span style="font-size: 1.8vw; margin: 0 auto auto auto;">@uni.opole.pl</span></a> <a class="section o365" href="https://outlook.office365.com"> <span>Logowanie Studenci </span> <span style="font-size: 1.8vw; margin: 0 auto auto auto;">@student.uni.opole.pl</span></a> </main>   <script> window.addEventListener("load", function () { var modal = document.getElementById("myModal"); var span = document.getElementsByClassName("close")[0]; modal.style.display = "block"; span.onclick = function () { modal.style.display = "none"; }; window.onclick = function (event) { if (event.target == modal) { modal.style.display = "none"; } }; }); </script> </body></html>

CINXE.COM

PocztaUO - Logowanie do Poczty Uniwersytetu Opolskiego