@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap";html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font-size:100%;font:inherit;vertical-align:baseline;border:0;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}@media (width<=768px){html,body,#root{margin:calc(var(--header-size) / 2) 0px 0px 0px;padding:0;font-family:Inter,sans-serif;font-size:14px}}@media (width>=769px){html,body,#root{margin:calc(var(--header-size) / 2) 0px 0px 0px;padding:0;font-family:Inter,sans-serif;font-size:16px}}header{z-index:1;box-sizing:border-box;width:100%;height:var(--header-size);background-color:#fff;padding:.4em;position:fixed;top:0;left:0;box-shadow:0 10px 20px #00000080}header nav{justify-content:space-between;width:100%;height:100%;display:flex}header nav .home-wrapper{justify-content:space-between;align-items:center;display:flex}header nav .home-wrapper img{width:calc(var(--header-size) - 2*var(--header-padding));height:calc(var(--header-size) - 2*var(--header-padding));transition:transform .5s}header nav .home-wrapper img:hover{transform:translate(10px)}header nav .links-wrapper{flex-direction:row;justify-content:space-evenly;gap:20px;width:100%;height:100%;display:flex}header nav .links-wrapper .link{color:#000;justify-content:center;align-items:center;font-size:1.2em;font-weight:700;text-decoration:none;transition:transform .5s,color .5s;display:flex}header nav .links-wrapper .link:hover{color:#0000c8;transform:scale(1.25)}header nav .auth-wrapper{flex-direction:row;align-items:center;display:flex}header nav .auth-icon{width:calc(var(--header-size) - 2*var(--header-padding));height:calc(var(--header-size) - 2*var(--header-padding));justify-content:center;align-items:center;display:flex}header nav .auth-icon img{width:40%;height:40%;transition:transform .5s,color .5s}header nav .auth-icon img:hover{transform:scale(1.25)}:root{--header-size:4rem;--header-padding:10px}.content-wrapper{box-sizing:border-box;top:var(--header-size);width:100%;height:calc(100vh - var(--header-size));color:#fff;align-items:center;padding:20px;position:fixed;overflow:hidden}.content-wrapper .welcome-message{flex-direction:column;justify-content:center;align-items:center;transition:transform .5s;display:flex}.welcome-message:hover{transform:translateY(-10vh)}.content-wrapper .welcome-message .top-text{text-align:right;flex-direction:row;justify-content:center;align-items:center;font-size:2.5em;font-weight:700;display:flex}.content-wrapper .welcome-message .bottom-text{text-align:center;font-size:1.5em}.content-wrapper .welcome-message .top-text .image-wrapper img{width:10rem;height:10rem}@media (width<=768px){.content-wrapper{background:linear-gradient(#020024 0%,#090979,80%,#00d4ff 100%)}.content-wrapper .welcome-message{width:100%;height:50%;position:absolute;top:0;left:0}.content-wrapper .background-image{z-index:1;width:auto;height:50%;position:absolute;top:50%;left:0}.content-wrapper .background-image img{object-position:center bottom;object-fit:cover;width:100%;height:100%}}@media (width>=769px){.content-wrapper{background:linear-gradient(45deg,#020024 0%,#090979 70%,#00d4ff 100%)}.content-wrapper .welcome-message{width:35%;height:100%;position:absolute;top:0;left:0}.content-wrapper .background-image{width:70%;height:100%;position:absolute;top:0;left:40%}.content-wrapper .background-image img{object-position:left bottom;object-fit:cover;width:100%;height:100%}}.hidden{opacity:0;transition:opacity 2s,transform 1s cubic-bezier(.34,1.56,.64,1);transform:translate(-100%)}.show{opacity:1;transform:translate(0)}.hidden,.show{width:100%;height:100%;position:relative}.timeline-wrapper{box-sizing:border-box;top:var(--header-size);width:100%;height:calc(100vh - var(--header-size));background:linear-gradient(#020024 0%,#090979,95%,#00d4ff 100%);grid-template-rows:3em repeat(7,auto);grid-template-columns:repeat(6,60vw);grid-auto-flow:column;gap:10px 20px;padding:20px;display:grid;position:fixed;overflow:scroll}.timeline-wrapper .weekday-name{color:#fff;justify-content:center;align-items:center;padding:10px;font-size:1.5em;font-weight:700;display:flex}.timeline-wrapper .weekday-element{background-color:#fff;border-radius:6px;flex-direction:column;height:auto;display:flex}.timeline-wrapper .weekday-element .duration{justify-content:center;align-items:center;padding:5px;font-weight:700;display:flex}.timeline-wrapper .weekday-element .classes{flex-direction:column;justify-content:space-between;gap:5px;height:auto;display:flex;overflow:scroll}.timeline-wrapper .weekday-element .no-classes{color:gray;justify-content:center;align-items:center;padding:5px;display:flex}.timeline-wrapper .weekday-element .classes .professor{border-radius:5px;justify-content:space-between;padding:5px;display:flex}.timeline-wrapper .weekday-element .classes .professor .name{font-weight:700}@media (width<=768px){.timeline-wrapper{grid-template-columns:repeat(6,60vw)}}@media (width>=769px){.timeline-wrapper{grid-template-columns:repeat(6,1fr)}}.authenticate-wrapper{width:100%;height:calc(100vh - var(--header-size));justify-content:space-around;align-items:center;display:flex}.authenticate-wrapper form{flex-direction:column;justify-content:space-evenly;align-items:center;gap:10px;display:flex}.add-new-class-form{box-sizing:border-box;justify-content:space-evenly;gap:10px;align-items:left;flex-direction:column;width:100%;padding:20px 100px;display:flex}.class-item{text-align:center;border:1px solid #000;flex-direction:row;justify-content:space-between;align-items:center;gap:20px;width:100%;margin:10px 0;display:flex}.class-item .name{flex:2}.class-item .hour{flex:1}.class-item .button img{width:1.5em;height:1.5em}
