@charset "UTF-8";

/* dark grey: #262626
light red #F59a8c
med red #F0654F
dark red b02215


menu not centered????*/


html {
    background-image: url(assets/images/linedpaper.png);
    background-attachment: scroll;
    background-repeat: repeat;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
        }

a {
-o-transition:.35s;
  -ms-transition:.35s;
  -moz-transition:.35s;
  -webkit-transition:.35s;

}

body {
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 1.2em;
}

h1 {
    font-family: 'Grenze', serif;
    font-size: 3rem;
    margin-bottom: 0px;
    margin-top: 0px;
}

h2 {
    font-size: 1.5rem
}

#headercontainer {
    width: 100%;
    height: 100vh;
}


header {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    height: auto;
    padding-bottom: 0px;
    margin-bottom: 0px;
    top: 22vh;
    right: auto;
    left: auto;
    position: relative;
    }


header #top {
    font-family: 'Grenze', serif;
    font-size: 11em;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 0px;
    padding-bottom: 0px;
}
nav ul  {
    list-style-type: none;
    text-align: center;
    padding-left: 0px;
    margin-left: 0px;
}
nav ul li {
    display: inline-block;
    padding-left: 25px;
    padding-right: 25px;
    text-align: center;
    margin-top: 5px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 18px;
    font-size: 1.4rem;
}
header a:link ,header a:visited{
    color: #F59a8c;
    text-decoration: none;
    font-size: 1.5rem;
    margin-top: 0px;
    padding-top: 0px;
    font-weight: 500;
}
header a:hover, header a:active {
    color: #b02215;
    text-decoration: none;
    border-bottom: thin solid #B02215;
}


header h2 {
    text-align: center;
}
header p {
    text-align: center;
}

main a:link, main a:visited {
    color: #F59a8c;
    text-decoration: none;
}

main a:hover, main a:active {
    color: #b02215;
    border-bottom: thin solid #b02215;
    text-decoration: none;
}

main {
    /* [disabled]width: 960px; */
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
    padding-bottom: 0px;
}

#setupcontainer {
    background-color: #262626;
    padding-top: 70px;
    padding-bottom: 70px;
    width: 100%;
}

#setup {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-wrap: wrap;
    padding-right: 0px;
}
#setup img {
    margin-left: -9px;
    margin-right: 38px;
    margin-top: 46px;
}

#setup p, #setup h1, #setup h2, #more p, #more h1, #more h2 {
  color: white;
}

#setupItems2 {
    width: 480px;
    padding-left: 20px;
    margin-left: 0px;
}



#gamecontainer {
    width: 100%;
    background-color: white;
    padding-top: 70px;
    padding-bottom: 70px;
}

#gameplay {
  width: 960px;
  margin-left: auto;
  margin-right: auto;
    display: flex;
    flex-wrap: wrap;

}

#gameItems1 {
    width: 480px;
    margin-top: 0px;
}

#gameplay img {
    padding-left: 68px;
    margin-top: 121px;
}

#morecontainer {
    width: 100%;
    background-color: #F0654F;
    padding-top: 70px;
    padding-bottom: 70px;
    margin-bottom: 0px;
}

#more {
  width: 960px;
  margin-left: auto;
  margin-right: auto;
    


}
#example {
    width: 700px;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
    border: medium dashed #262626;
    padding-left: 20px;
    padding-top: 7px;
    padding-right: 20px;
    padding-bottom: 7px;
}
.bold {
    font-weight: bolder;
    color: #262626;
}

#more a:link, #more a:visited {
 color: #262626
}

#more a:hover, #more a:active {
    color: #b02215;
    border-bottom: thin solid #b02215;
}
    
footer {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
    padding-top: 0px;
    padding-bottom: 40px;
    text-align: center;
    margin-bottom: 30px;
}



footer h1 {
    font-family: grenze;
    font-size: 3em;
    text-align: center;
    margin-bottom: 0px;
}

footer p {
    font-size:0.8rem;
    color: lightgray;

}

footer a:link, footer a:visited {
    color: #F59a8c;
    text-decoration: none;
    margin-top: 0px;
    padding-top: 0px;
}

footer a:hover, footer a:active {
    color: #b02215;
    text-decoration: none;
    border-bottom: thin solid #B02215;
}