/* 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." */

body {
  background-color: white;
  color: black;
  font-family: Verdana;
}

p {
    font-family: 'bodyFont';
    font-size: 20px;
  }
  
li {
  font-family: 'bodyFont';
  font-size: 25px;
  }

.header a {
  display: inline-block;
}

.footer a {
  display: inline-block;
  }

.header {
  position: fixed;
  top: 0;
  width: 100%;
  height: 30px;
  padding: 10px;
  background-color: #F5DEFA;
  }

#MainBlock a {
  display: inline-block;
  color: #800080;
}

#MainBlock {
    padding: 20px;
    padding-left:80px;
    padding-right: 80px;
    margin:0 auto;
    margin-top: 150px;
    margin-bottom: 60px;
    max-width:800px;
    text-align:center;
    background:#F5DEFA;
    border-width: 9px;
    border-style: solid;
    border-image: url("borders/border01.png") 10 fill round;
    float: left;
  }
  
  #CreditBlock {
    padding: 20px;
    padding-left:80px;
    padding-right: 80px;
    margin:0 auto;
    margin-top: 60px;
    max-width:600px;
    text-align:center;
    background:#F5DEFA;
    border-width: 9px;
    border-style: solid;
    border-image: url("borders/border01.png") 10 fill round;
  }
  
  #CatBlock {
    display: inline-block;
    padding-left:80px;
    padding-right: 80px;
    padding-top: 10px;
    margin:0 auto;
    margin-top: 20px;
    margin-bottom: 10px;
    margin-left: 20px;
    width:37%;
    text-align:center;
    font-family: 'bodyFont';
    font-size: 70px;
    background:#F5DEFA;
    border-width: 9px;
    border-style: solid;
    border-image: url("borders/border04.png") 10 fill round;
  }
  
  .catTitle {
    font-family: 'catFont';
    font-size: 150px;
    padding: 20px;
    padding-left:80px;
    padding-right: 80px;
    margin:0 auto;
    margin-top: 60px;
    max-width:100%;
    text-align:center;
    background:#F5DEFA;
    border-width: 9px;
    border-style: solid;
    border-image: url("borders/border04.png") 10 fill round;
    }
    
    .catFooter {
    display: inline-block;
    padding-left:80px;
    padding-right: 80px;
    margin:0 auto;
    margin-top: 20px;
    margin-bottom: 60px;
    margin-left: 20px;
    width:37%;
    text-align:center;
    font-family: 'bodyFont';
    font-size: 70px;
    background:#F5DEFA;
    border-width: 9px;
    border-style: solid;
    border-image: url("borders/border04.png") 10 fill round;
    }
  
  #shelf {
    display: inline-block;
    padding: 20px;
    margin: 0 auto;
    margin-top: 60px;
    margin-bottom: 60px;
    margin-left: 10px;
    margin-right: 10px;
    width: 16%;
    text-align: center;
    border-image: url("bg/bglined.gif") 10 fill round;
  }  
  
  .PicBorder1 {
    padding: 60px;
    margin: 0 auto;
    margin-top: 120px;
    margin-bottom: 60px;
    margin-left: 10%;
    width: 12%;
    border-image: url("bg/bgsol.gif") 10 fill round;
    transform: rotate(-15deg);
    float: left;
  }
  
  .PicBorder2 {
    padding: 60px;
    margin: 0 auto;
    margin-top: 120px;
    margin-bottom: 60px;
    margin-left: 10%;
    width: 12%;
    border-image: url("bg/bgsol.gif") 10 fill round;
    transform: rotate(15deg);
  }

.box {
  display: inline-block;
  width: 23%;
  height: 100%;
  padding: 2px;
  margin: 10px;
  margin-top: 50px;
  margin-bottom: 50px;
  background-color: #D471EA;
  box-shadow: 7px 7px #AA2BC5;
}


.footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 30px;
  padding: 10px;
  background-color: #F5DEFA;
  text-align: center;
  }
  
a:link {
  text-decoration: none;
  cursor: pointer;
}

a:visited {
  text-decoration: none;
  color: #800080;
}

a:hover {
  text-decoration: underline;
}

a:active {
  text-decoration: underline;
  color: pink;
}

.fixed {
    position: fixed;
    bottom: 15px;
    right: 1%;
    width: 33%;
  }

.center {
  text-align: center;
}

.cultureBox {
  display: inline-block;
  padding-top: 60px;
  padding-left: 10%;
  width: 20%;
  margin: 0 auto;
  }
  
  .cultureBox:hover {
  transform: scaleX(-1);
}

  a {
    display: block;
  }
  
  h1 {
   font-family: 'fanzineFont';
   font-size: 50px;
}

.musicTitle {
    font-family: 'musicFont';
    font-size: 70px;
  }
  
.title {
    font-family: 'titleFont';
    font-size: 40px;
  }
  
.emojiTitle {
    font-family: 'emojiFont';
    font-size: 40px;
  }

* {
cursor: url('images/cursor_cookie4.gif') 0 0, default;
}