@import url("https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600;700&family=Oswald:wght@100;300;400;500;600&family=Fredoka+One&display=swap");

body {margin: 0; padding:0; background-color: #ececec; color: #333; font-family: "Oswald", sans-serif; font-size:15px; font-weight:lighter; scrollbar-width: thin; scrollbar-color:black transparent;}

*::-webkit-scrollbar {width: 4px;}
*::-webkit-scrollbar-track {background: transparent;}
*::-webkit-scrollbar-thumb {background-color: rgba(0,0,0,.2);}

a {text-decoration:none; color:#b5c355; transition:all .6s; text-transform:uppercase; font-size: 10px; font-weight:bold; text-shadow: 1px 1px 0 rgba(255,255,255,.5); letter-spacing:1px;}
a:hover {text-decoration:none; color:#b5f0fe; text-shadow: 1px 1px 0 white;}
b {color: #58b8f5; text-transform:uppercase; text-shadow: 1px 1px 0 rgba(255,255,255,.5); font-size:10px}

#container{margin-top: 50px; margin-left:auto; margin-right:auto; width: 550px;}

.blurb{border-radius: 15px; padding: 20px; border: 1px solid rgba(255,255,255,.1); box-shadow:0px 0px 0px rgba(0,0,0,0.1); padding: 15px; text-align: justify; background: #fafafa; margin-bottom:20px; text-transform: lowercase;}

h1 {font-family:'happylucky',arial,helvetica,sans-serif; font-size:34px; letter-spacing:2px; color: #b5c355; -webkit-text-stroke: 1px #9ab243; text-transform:uppercase; margin:0;}

.header{transform:rotate(-3.5deg);}
.script{font-family:buryland; font-size:40px; color:white; text-shadow: 2px 2px 1px rgb(88, 184, 245); line-height: .5; margin-left:-20px;}
.title{font-family:Fredoka One,sans-serif; font-size:65px; text-transform:uppercase; background: url("/i/main.jpg") center; background-size: contain; background-clip: text; color: transparent; -webkit-background-clip: text; -webkit-text-stroke: 2px white; filter:drop-shadow(3px 3px 0 black) drop-shadow(6px 6px 0 black); transform: skew(-12deg, 0deg)}

#nav{position: fixed; top: 70px; right: 50%; padding: 0 5px; margin-right: 290px; justify-items: center; text-align:center; line-height:1;}

.link a{font-size:7px; text-transform:uppercase; letter-spacing:1px; text-decoration:none; color:rgba(0,0,0,.4); transition: all .5s;}
.link a:hover{color:black;}  
.link a img.icon:hover
  
header-links {position: fixed; top: 70px; right: 50%;	padding: 0 5px;	margin-right: 290px; flex-direction: column; align-items: center; justify-content: space-evenly; padding: 10px; position: absolute; bottom: 0; left: 1108px; z-index: 3;}

header-links a {width: 100px; height: 50px; background: var(--gradient1); border-radius: 15px; display: flex; align-items: center; justify-content: center; font-size: 22px; color: var(--body); margin: 5px 0;}

.info-alt:before {content: "\eb28"; font-family: "cappuccicons"; font-size: 20px;}
.home:before {content: "\eb0d"; font-family: "cappuccicons"; font-size: 20px;}
.taken:before {content: "\eaf9"; font-family: "cappuccicons"; font-size: 20px;}
.rules:before {content: "\e97b"; font-family: "cappuccicons"; font-size: 20px;}
.locked:before {content: "\eb69"; font-family: "cappuccicons"; font-size: 20px;}
.faq:before {content: "\e971";font-family: "cappuccicons"; font-size: 20px;}
.extras:before {content: "\ea24"; font-family: "cappuccicons"; font-size: 20px;}

.cal td {height:25px; width:25px; font-size:10px; text-align:center;}
.period1 {background-color:#c9f3ff;}
.period2 {background-color:#bad383;}
.period3 {background-color:#eef7fe;}