*,*::before,*::after{box-sizing:border-box}html,body{font-family:'Gill Sans','Gill Sans MT',Calibri,'Trebuchet MS',sans-serif;font-size:1rem;background-color:#f1f1f1;color:#222;margin:0;padding:0}body{min-height:100vh;display:flex;flex-direction:column}img{max-width:100%}.container{max-width:75rem;margin-left:auto;margin-right:auto;padding:1rem}nav.top{background-color:slateblue;color:#fff;font-size:0.8rem}nav.top .container{display:flex;flex-direction:row;padding:0;overflow-x:auto}nav.top a{text-transform:uppercase;text-decoration:none;padding:0.7rem 1rem;color:#fff;white-space:nowrap}nav.top a:hover{background-color:darkslateblue}header{background-color:#fff}header .container{padding:0}header a{color:black;text-decoration:none;display:inline-block;padding:0.7rem 1rem}header a:hover{background-color:#eee}header h1,header p{margin:0;padding:0;text-transform:uppercase}header h1{margin-top:1rem}header p{margin-bottom:1rem;font-size:1.1rem;font-style:italic}nav.main{border-top:1px solid #ccc;border-bottom:4px solid slateblue;background-color:#fff}nav.main .container{padding:0;display:flex;flex-direction:row;overflow-x:auto;white-space:nowrap}nav.main a{padding:0.7rem 1rem;text-decoration:none;text-transform:uppercase;color:#000;font-weight:600;font-size:1.2rem}nav.main a:hover{background-color:#eee}nav.main a.current{font-weight:800}main{flex-grow:1}main .container{background-color:#fff;border-top:8px solid slateblue;border-bottom:4px solid slateblue;margin-top:2rem;margin-bottom:2rem;padding:1rem 4rem}.classes{display:flex;flex-direction:column;gap:1rem}.classes .class{box-shadow:0 0 1rem #888;padding:1rem;border-radius:1rem;display:flex;flex-direction:column;gap:1rem}.classes .class .title{font-size:2rem;font-weight:bold}.classes .class .description{font-style:italic}.classes .class .controls{display:flex;flex-direction:row;gap:1rem}.classes .class .controls a{padding:0.8rem 1rem;font-weight:bold;background-color:black;color:white;text-decoration:none;border-radius:0.6rem}.staff-members,.students{display:flex;flex-direction:column}.staff-members .staff-member,.students .student{display:flex;flex-direction:row;gap:4rem;border-bottom:1px solid #ccc;padding-top:2rem;padding-bottom:2rem}.staff-members .staff-member:last-of-type,.students .student:last-of-type{border-bottom-width:0}.staff-members .staff-member .picture{width:15rem;height:20rem;background-position:center;background-size:cover;border-radius:1rem}.staff-members .staff-member .info,.students .student .info{display:flex;flex-direction:column;gap:1rem}.staff-members .staff-member .title,.students .student .title{font-size:2rem;font-weight:bold}.staff-members .staff-member .description,.students .student .description{font-style:italic;font-size:1.5rem}.staff-members .staff-member .email-address,.students .student .email-address{font-size:1.2rem}.staff-members .staff-member .email-address a,.students .student .email-address a{color:slateblue}.staff-members .staff-member .controls{display:flex;flex-direction:row;gap:1rem}.staff-members .staff-member .controls a{padding:0.8rem 1rem;border-radius:1rem;background-color:black;color:white;text-decoration:none;font-size:1.2rem;font-weight:bold}footer{background-color:#fff;border-top:4px solid slateblue;font-size:0.8rem}@media( prefers-color-scheme:dark ){html,body{background-color:#000;color:#fff}header,nav.main,main .container,footer{background-color:#222;color:#fff}header a,nav.main a{color:#fff}header a:hover,nav.main a:hover{background-color:#444}.staff-members .staff-member .email-address a,.students .student .email-address a{color:mediumpurple}.staff-members .staff-member .email-address a:hover,.students .student .email-address a:hover{color:mediumslateblue}}