/* html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	/* font-size: 100%; */
/* font: inherit; */
/* vertical-align: baseline; */
/*
*/

body {
    background-color: darkgreen;
    padding: 0;
    margin: 0;
    /* background-image:url("images/cpack\ squares.png"); */
    /* background-image: url("./images/agathos_daimon_green.png"); */
    background-image: url("images/backgrounds/stars.gif");
    font-size: large;
    line-height: 1.5;
    /* background-image: url("https://64.media.tumblr.com/a56d0e65f2271c3f7ea219dfe8fef369/3656fd155f67a941-28/s250x400/7d660b4978fc0a0df24efb38b9bd9cb3ae55ab5c.png"); */
    background-repeat: repeat;
    background-position: center;
    /* font-family: "PT Mono"; */

    font-family: "PC98";
    /* font-weight: lighter;  */
    /* color: var(--font-color); */
    --lightblack: #202020 color: var(var(--lightblack));
    /* text-shadow: 0.05rem 0.05rem 0.05rem #111; */
}

.sunlet {
    animation-name: sun_color;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}

@keyframes sun_color {
    0% {
        color: orange;
        rotate: 0deg;
    }

    50% {
        color: yellow;
        rotate: 22.5deg;
    }

    100% {
        color: orange;
        rotate: 45deg;
    }
}

.inv_key {
    margin: 0;
    color: rgb(172, 126, 0);
    font-weight: bold;
}

/* a[href]::before {
	content:"[";
	color:#5555ff;
} */

/* a[href]::after { */
/* content:"]"; */
/* color:#5555ff; */
/* } */

.material {
    background-color: #9f6262;
    position: static;
    top: 20%;
    padding: 10px;
    width: 220px;
    height: 30px;
}

.jiggly {
    transform: translate(5px, 5px);
}

a {
    color: green;
    font-weight: bold;
}

a:visited {
    color: rebeccapurple;
}

h1,
h2 {
    transform: rotate(1.5deg);
    color: #222;
    text-shadow: rgba(66, 164, 164, 0.2) 3px 3px;
}

h1:hover,
h2:hover {
    transform: rotate(-1.5deg);
}

.grabElement {
    cursor: grab;
}

.patch {
    margin: auto;
    width: 600px;
    padding: 40px;
    margin-bottom: 30px;
    border: 4px dashed brown;
    border-radius: 6px;
    background-color: #dfdfc3;
}

.patch_style {
    border: 4px dashed brown;
    border-radius: 6px;
    background-color: #dfdfc3;
    margin: 20px;
    padding: 20px;
}

.quest_board {
    background: darkslategray;
    color: whitesmoke;
}

.flower_border {
    border: 40px solid transparent;
    border-image: url("./assets/flower_border_10x.png") repeat;
    border-image-slice: 30% 30%;
}

/* 
iframe {
    margin: 0px;
    padding: 0px;
} */

.spinny {
    transition: 200ms linear transform;
}

.spinny:hover {
    transform: rotate(45deg);
}

.hp_bar_background {
    height: 10px;
    width: 100px;
    background-color: red;
}

.hp_bar_foreground {
    height: 10px;
    width: 100px;
    background-color: green;
    transition: width 0.5s;
}

.inventory_slot {
    height: 80px;
    width: 80px;
    background-color: rgb(26, 5, 5);
    border-color: white;
    border-width: 30px;
    border-radius: 10px;
    margin: 3px;

    color: white;
}

.inventory_row {
    display: flex;
}