* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;

 scrollbar-color: transparent transparent; /* thumb and track color */
  scrollbar-width: 0px;
}

html {
height: 100%;
width: 100%;
cursor: url('./ediaries.cur'), auto;
background-color: aliceblue;
}

body {

height: 98vh;
margin: 5px auto;
width: 99vw;
border: 1px solid #af0000;
box-shadow: 3px 3px #af0000;
background-size: contain;
background-color: pink;
background-image: radial-gradient(oldlace 1%, pink 30%, cornsilk 40%, oldlace 50%, aliceblue 70%);
color: #af0000;
font-family: "Zalando Sans Expanded", sans-serif;
overflow: hidden;
cursor: url('./ediaries.cur'), auto;
}

/*
--------------------------------------------Fonts----------------------------------------------
*/


@font-face {
    font-family: "Homemade Apple", cursive;
    src: url('./Homemade_Apple/HomemadeApple-Regular.ttf') format("truetype");
    font-weight: normal;
    font-style: normal;

}


@font-face {
  font-family: "Zalando Sans Expanded", sans-serif;
  src: url('./Zalando_Sans_Expanded/ZalandoSansExpanded-VariableFont_wght.ttf') format("truetype");
}



/*
--------------------------------------------Fonts----------------------------------------------
*/


a {
z-index: 5;
text-decoration: none;

}

img {

width: 500px;
height: 315px;


}

table {
font-size: 12px;
border-collapse: collapse;


}
td {
border: 1px solid #af0000;

}

.landscape_notice {

display: none;
}


.gamename {
box-shadow: 3.5px 3.5px black;
font-family: "Zalando Sans Expanded", sans-serif;
background-color: pink;
font-size: 33px;
text-align: center;
padding: 1%;
font-weight: bold;
color: #af0000;
width: 80vw;
margin: 29px auto;
border: 3.5px solid #a10606;
font-style: italic;
}

.carousel {

margin: 15vh auto;
max-height: 600px;
width: 500px;
overflow-x: scroll;
overflow-y: hidden;
white-space: nowrap;
scroll-behavior: smooth;
}


.slide {

float: left;

}


.card {

height: 350px;
width: 500px;
display: inline;

}

.links {
width: 48vw;
margin: auto;
text-align: center;

}



.card_button {
color: black;
padding: 2.5%;
background-color: rgb(251, 250, 227);
border: 0.5px solid #af0000;
border-radius: 33%;
outline: 0.5px solid gray;
color: #af0000;
}

.card_button:active {
border: 2px silver;


}

.instructions {
color: #a10606;
position: fixed;
background-color: rgb(251, 250, 227);
width: 300px;
height: 500px;
right: 3%; 
top: 19%;
box-shadow: 3px 3px black;
padding: 1%;
transform: rotate(3deg);
overflow: scroll;
}

.generator {
position: fixed;
bottom: 11%;
left: 2%;
padding: 2%;
width: 300px;
height: 200px;
font-family: "Homemade Apple", cursive;
font-size: 22px;
box-shadow: 2.5px 2.5px black;
color: dimgray;
background-color: rgb(251, 250, 227);
}


#number {
font-family: "Zalando Sans Expanded", sans-serif;
width: 50px;
height: 50px;
color: dimgray;
padding: 1%;
font-size: 33px;
text-align: center;
border: 3px double dimgray;
}

.button {
position: absolute;
bottom: 10%;
background-color: transparent;
color: dimgray;
}

.back {
position: fixed;
top: 40%;
left: 4%;
padding: 1%;
color: dimgray;
background-image: linear-gradient(gainsboro, white, gainsboro);
outline: 0.5px solid dimgray;
border: 3px outset gainsboro;
font-size: 19px;
transform: rotate(0deg);
font-family: courier new;
}

.back:active {
border: 3px inset lavenderblush;

}


/*


wine: 
background-color: rgb(75, 37, 53);


cream paper: 
background-color: rgb(251, 250, 227);

cool pink paper:
rgb(252, 237, 237);

brown ridge: 
rgb(75, 30, 33)


cornsilk leaflet 
#FFFDDE


*/