body {
  background-color: #980100;
  color: rgb(27, 28, 33);
  font-family: 'Montserrat',sans-serif;
  background-image:url(https://xixxii.neocities.org/images/bgs/c.png); 
background-size:200px;
  background-attachment: fixed;
  margin:0px;
}

@font-face {
font-family: Montserrat;
src: url("/fonts/Montserrat-Regular.woff");
}

@font-face {
font-family: 'Montserrat Bold';
src: url("/fonts/Montserrat-Bold.woff");
}

* { scrollbar-color: #980100 #fed262;
box-sizing:border-box;}

b {color:#980100;
font-family: 'Montserrat Bold', 'Montserrat';
font-weight:bold;}

h1 {
  color: #980100;
border:1px solid;
  text-align: center;
  font-size:30px;
font-family: 'Montserrat Bold', 'Montserrat';
font-weight:bold;
  background-color: #fed262;
   border-radius: 100%;
 padding:55px;
height:150px;
width:max-content;
margin:50px auto 50px;
box-shadow: 5px 5px #980100;
}

.sidebar {
  position:fixed;
  height:70px;
width:70px;
  top:5%;
left:5%;
background-color:#7db560;
  padding:15px;
padding-top:24px;
  border-radius: 100px;
text-align:center;
border:1px solid #980100;
transition:1s;
box-shadow: 5px 5px #0967a3;
}

.sidebar img {transition:1s;}

.sidebar img:hover {rotate:-180deg;
scale:1.5;}

.card {outline: 5px solid #fed262;
background-color:#fffcf0;
  padding:10px;
border: 7px #980100 solid;
width:300px;
height:360px;
overflow:auto;
scrollbar-width: thin;
font-size:11pt;
border-radius:10px;
transition:0.5s;
transform:rotate(-3deg)}

.card:nth-of-type(odd) {transform: rotate(3deg);}

.card:hover {
transform:translateY(-10px);

}

.cardimage {margin:auto;
text-align: center;}
.cardimage img {object-fit: contain;
height:150px;
width:100%;}


img {max-width:100%;}

h2 {text-align: center;
font-size:14pt;}

.main {
  display:flex;
flex-direction: row;
justify-content: center;
align-items:flex-start;
gap:55px;
flex-wrap:wrap;
margin:auto;
}


a {
  text-decoration:wavy underline 1px;
    color:#7db560;
font-family: 'Montserrat Bold', 'Montserrat';
font-weight:bold;

}

a:visited {
  text-decoration: none;
font-family: 'Montserrat Bold', 'Montserrat';
font-weight:bold;
  color:#0967a3;

}

a:hover {
  text-decoration: none;
font-family: 'Montserrat Bold', 'Montserrat';
font-weight:bold;

}

@media only screen and (max-width: 768px) {
.sidebar {top:10px;
left:10px;
z-index:100;
position:absolute;}
  
.main {
border-radius:50px;
width:90%;

  
}

}