*{box-sizing:border-box}html,body{margin:0}html{scroll-behavior:smooth}body{font-family:Helvetica,Arial,sans-serif;background:linear-gradient(#011430, #3e5ae2, #00ffff) fixed;font-size:18px}a{color:red;text-decoration:none;transition:.5s}a:hover{color:#f90;text-decoration:underline}h1,h2,h3{margin:0;padding:5px 0}header{background:url(../img/sky.jpg) no-repeat fixed;background-size:cover;background-position:50%;height:200px;color:#fff;text-align:center}header h1{padding-top:54px;font-size:54px}main{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr;max-width:1024px;margin:0 auto;box-shadow:0px 10px 10px rgba(0,0,0,.5);padding:10px;background-color:rgba(51,51,51,.8)}section{padding:10px;color:#fff}section.twocol{grid-column:span 2}section.threecol{grid-column:span 3}section a h2{position:absolute;top:50%;width:100%;transform:translate(0, -50%);z-index:1;text-align:center;color:#fff;text-shadow:2px 2px 2px #333}section a:hover h2{font-size:40px;transition:.8s}section a:hover img{filter:blur(2px);transition:.8s}section img{width:100%}.link-container{position:relative}.full{grid-column:1/-1}nav{position:sticky;top:0;z-index:1;background-color:rgba(1,20,48,.88)}nav div{max-width:1024px;margin:0 auto;padding:10px 0}nav a{display:inline-block;min-width:100px;font-weight:bold;text-align:center;text-transform:uppercase;margin:0 10px 0 0;border:solid #f40 2px;line-height:40px;background-color:#08133d}nav a:hover{text-decoration:none;border:solid #ff0 2px;background-color:#2a4d71}footer{max-width:1024px;margin:0 auto;padding:10px 0}@media(max-width: 520px){section{grid-column:1/-1}}