@font-face {
  font-family: 'Skrawk-Serif';
  src: url('/fonts/Skrawk-Serif.ttf') format("truetype");
} 

body {
margin: 0px;
padding: 0px;
-color: black;
background-color: #eef2f9;
background-image: url('texture3.png');
}

 /* unvisited link */
a:link {
  color: black;
}

/* visited link */
a:visited {
  color: black;
}

/* mouse over link */
a:hover {
  color: green;
}

/* selected link */
a:active {
  color: green;
} 

.header {

  text-align: center;
	margin: 0px;
overflow: hidden;
color: black;
background-image: url('backgroundtest.png');
  background-repeat: repeat-x;
  background-position: center top;
  background-size: 1000px 270px;

}
.headernight {

  text-align: center;
	margin: 0px;
overflow: hidden;
color: black;
background-image: url('backgroundtestnight.png');
  background-repeat: repeat-x;
  background-position: center top;
  background-size: 1000px 270px;

}
.header2 {

  text-align: center;
	margin: 10px;
		margin-left: auto;
	margin-right: auto;
-overflow: hidden;
padding: 0px;
padding-bottom: 0px;
color: black;
-background-color: white;
 -border: 10px solid transparent;
-background-image: url('images/border.png');
 -border-image: url(images/border.png) 20 round;
  -background-repeat: no-repeat;
  background-position: center top;
  background-size: 100% 100%;
  
  width: 750px;
   font-family: 'Skrawk-Serif';
  font-size: 18px;

}
.menu{
	margin: 10px;
  text-align: center;
color: black;
padding-left: 20px;
padding-right: 20px;
padding-bottom: 0px;
padding-top: 0px;
  background-repeat: no-repeat;
   font-family: 'Skrawk-Serif';
  font-size: 18px;
  background-color: white;
 border: 5px solid transparent;
 border-image: url(images/border.png) 10 round;
   line-height: 0%;

}

.flesh {
   width: 920px;
   margin-left: auto;
   margin-right: auto;
   background-color:white;
   text-align: center;
    -webkit-box-sizing: border-box; 
 -moz-box-sizing: border-box;    
 box-sizing: border-box; 
  border: 5px solid transparent;
 border-image: url(images/border.png) 10 round;
}


.ribs, .bones {
      display: block;
}

.ribs {
   margin: auto;
   text-align: center;
   padding: 30px;
   background-color:white;
   font-family: 'Georgia';
  font-size: 18px;
}
.chapter { 
  background-color:white;
  padding: 10px; 
  font-family: 'Skrawk-Serif';
  border-bottom: 3px solid black;
    border-top:  3px solid black;
    border-left: none;
    border-right: none;

 border-image: url(images/border.png) 10 round;
  }
    details > summary {
    font-size: 21px;
    content: '❧ ';
  }
details>summary {
  list-style-type: none;
  outline: none;
  cursor: pointer;

  padding: 5px;
  border-radius: 5px;
}

details>summary::-webkit-details-marker {
  display: none;
}

details>summary::before {
  content: '❧ ';
}

details[open]>summary::before {
  content: '❦ ';
}

details[open]>summary {
  margin-bottom: 0.5rem;
}

.button {
  background-color: white;/* Green */
  color: black;
margin: 10px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
     font-family: 'Skrawk-Serif';
  font-size: 27px;
  font-weight: bold;
    border-bottom: 7px solid transparent;
  line-height: 60%;
}
a:link {
  color: black;

  text-decoration: none;
}
a:visited {
  color:black;
 
  text-decoration: none;
}

a:hover {
 color:#3D5C8F;
  text-decoration: underline;

}

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


.button1 {
    border-bottom: 2px solid transparent;
    border-top: none;
    border-left: none;
    border-right: none;
  color: white;
  padding: 15px 20px;
  text-align: center;
  text-decoration: none;
  font-family: 'Skrawk-Serif';
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  background-color: white;
   transition-duration: 0.4s;
   
}

.button1:hover {
  background-color: #eef2f9; /* Green */
  color: #3D5C8F;
  border-bottom: 2px solid #3D5C8F;
    border-top: none;
    border-left: none;
    border-right: none;
 
}

@media screen and (max-width: 900px) {
   .ribs, .head, .flesh {
   
    text-align: center;

   width: 100%;
   height: auto;
 -webkit-box-sizing: border-box; 
 -moz-box-sizing: border-box;    
 box-sizing: border-box;    
  }
  h1 {
 font-family: "Kolker Brush", sans-serif; 
 font-size: 100px;
 font-weight: normal;
 margin: 0px;
}

}
.header img {
  padding: 0;
    display: block;
    margin: 0 auto;
   width: 95%;
  height: auto;
  max-width: 635px;

  }
  .ribs img {
  padding: 0;
    display: block;
    margin: 0 auto;
   width: 95%;
  height: auto;
  max-width: 70px;

  }

@media screen and (max-width: 1688px) {
  .flesh img {
   width: 95%;
}

}
@media screen and (max-width: 920px) {
  .page img {
  padding: 0;
    display: block;
    margin: 0 auto;
   width: 100%;
  height: auto;
  -max-width: 635px;

  }
  .flesh {
  width: 95%;
  }
  .header {
   background-image: url(''); 
  }
  .header2, .text, .contain {
   width:95%; 
  }
  .menu {
      line-height: 120%; 
      padding-left: 20px;
padding-right: 20px;
  }
  .topnav img{
  padding: 0;

    margin: 0 auto;
  width: 18%;
  height: auto;
  }
  .nav img{
  padding: 0;

    margin: 0 auto;
  width: 18%;
  height: auto;
  }
  }