/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */


/* fonts */



@font-face {
    font-family: 'courier-new-bold';
    src: url("fonts/courbd-webfont.woff2") format('woff2'),
         url("fonts/courbd-webfont.woff") format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'typostuck';
    src: url('fonts/typostuck_slightly_better_classic_homestuck_font-webfont.woff2') format('woff2'),
         url('fonts/typostuck_slightly_better_classic_homestuck_font-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ectobiologist';
    src: url('fonts/ectobiologist_john-webfont.woff2') format('woff2'),
         url('fonts/ectobiologist_john-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}



body {
  background-color: blue;
  background-image: url('images/cloudswrap.png');
  color: black;
  font-family: Verdana;
  cursor: url('images/sburbcursor.png') 20 8, auto;
}


a {
  cursor: url('images/sburbcursorselect.png') 13 23, auto;
  color: #00aaff;
}

a:hover {
  color: #ffe100;
}
h1 {
  font-family: 'ectobiologist', Arial, sans-serif;
  color: #0c8bf4;
  font-size: 50px;
  font-weight: normal;

}

p {
  font-family: 'courier-new-bold', Arial, sans-serif;
  color: #0715cd;
}


.big-box {
  background-color: white;
  width: 90%;
  margin: auto;
  padding: 2%;
  display:flex;
  border-radius:5px;
}
.main {
  width: 100%;
}
.sidebar {
  text-align: center;
  flex-basis: 150px;
  flex-grow: 0;
  flex-shrink: 0;
  background-color:#0c8bf4;
  margin-right: 2%;
  font-size: 15px;
  border-radius:5px;
}

.sidebar a {
  color: white;
  text-decoration:none;
}

.sidebar a:hover {
  color: #f6ff7d;
}
.guestbook {
  width: 50%;
  height: 400px;
  margin:auto;
}
.guestbook iframe {
  width: 100%;
  height: 100%;
  border-radius:10px;
}

.letter {
  margin-top:0px;
}
.letter p {
  font-family: 'ectobiologist', Arial, sans-serif;
  color: #0c8bf4;
  font-size: 30px;
  margin-top:3px;
  width:80%;
}
.gg {
  color: #4ac925;
}
.tt {
  color: #b536da;
}
.tg {
  color: #e00707;
}