@font-face {
    font-family: "Glamourgirl";
    src: url();
}
    
:root {  /* THIS HERE BE THE VARIABLES */
            --word-color: rgb(54, 30, 49);
            --border-color: rgb(102,69,86);
            --header-color: rgb(230, 196, 205); 
            --border-bottom: #F4ACB7;
            --link-visited: rgb(24, 13, 22);
            --link-hover: #e4b1b9;
            --link-active: #ffffff;
            --link-unvisited: rgb(54, 30, 49);
            --text-back:#0000003f;
            --wordbox-back: rgba(104, 59, 95, 0.267);
            --border-shadow: rgba(71, 30, 63, 0.265);
            --highlight-backround: rgb(230, 196, 205);
            --indent-color: rgba(230, 196, 205, 0.656);
            --indent-color2: rgb(70, 46, 58);
            --button-color: rgb(196, 161, 170);
            --button-color-light: rgb(189, 150, 160);
}

h1, h2, h3, h4 { /* box thing */
            font-size: 1em;
	        background: var(--border-color); /* VARIABLE HERE */
	        color: var(--header-color); /* VARIABLE HERE */
	        border-bottom: 3px solid var(--word-color); /* VARIABLE HERE */
	        padding: 0.1%;
	        margin:  0;
            text-align: left;
            background: linear-gradient(180deg, rgb(117, 79, 98) 0%, rgb(102,69,86) 50%, rgb(94, 64, 78) 100%);
            text-shadow: 2px 2px 5px rgba(252, 170, 211, 0.202);
            font-size: 1.3em;
}

body {
            background-color: black;
            font-size: 1.5em;
            background-attachment: fixed;
            color: var(--word-color); /* VARIABLE HERE */
            background-color: var(--text-back); /* VARIABLE HERE */
            font-family: "Glamourgirl";
            background-image: url("https://malorie.neocities.org/dithered%20background.png");
            background-attachment:scroll;
            overflow:hidden
}

.wordbox {
            text-shadow: none;
            text-indent: 35px;
            padding-top: 15px;
            font-weight: 500;
}

.div14, .div15, .div3, .div4, .div5, .div6, .div7, .div8 {
            background-image: url("https://malorie.neocities.org/background%20pic.png");
            border-radius: 5px;
	        margin: 1%;
            border-bottom: 3px solid var(--border-color); /* VARIABLE HERE */;
            border-right: 3px solid var(--border-color); /* VARIABLE HERE */;
            border-left: 4px solid var(--border-color); /* VARIABLE HERE */;
            margin-top: 1%;
            margin-left: 1%;
            margin-right: 1%;
            margin-bottom: 1%;
}

.parent {
            display: grid;
            grid-template-columns: repeat(9, 1fr);
            grid-template-rows: repeat(5, 1fr);
            gap: 0px;
}
    
.div15 {
            grid-column: span 7 / span 7;
            grid-row: span 2 / span 2;
            grid-column-start: 2;
            grid-row-start: 1;
}

.movieposter {
            width: 200px;
            height: 320px;
            border-radius: 5px;
            border-bottom: 8px solid var(--word-color); /* VARIABLE HERE */;
            border-right: 8px solid var(--word-color); /* VARIABLE HERE */;
            border-left: 6px solid var(--header-color); /* VARIABLE HERE */;
            border-top: 6px solid var(--header-color); /* VARIABLE HERE */;
}

figcaption {
            border-radius: 5px;
            border-bottom: 5px solid var(--word-color); /* VARIABLE HERE */;
            border-right: 5px solid var(--word-color); /* VARIABLE HERE */;
            border-left: 3px solid var(--header-color); /* VARIABLE HERE */;
            border-top: 3px solid var(--header-color); /* VARIABLE HERE */;
            background: linear-gradient(180deg, rgb(196, 161, 170) 15%, rgb(167, 137, 144) 50%, rgb(180, 147, 155) 100%);;
            width: 280px;
            position: relative;
            right: 15px;
            bottom: 25px;
            text-align: center;
            
}

figure {
            display: inline-block;vertical-align: middle;
            width: 250px;
            height: 370px;
            text-align: center;
}

.windowbuttons {
            position: relative;
            right: 15px; /* this how u move it */
            top: 13px; /* this how u move it */
}

a:link { /* link stuff */
            color: var(--word-color); /* VARIABLE HERE */
            text-decoration: underline;
}

a:hover { /* link stuff */
            color: var(--link-hover); /* VARIABLE HERE */
}
a:active { /* link stuff */
            color: var(--link-active); /* VARIABLE HERE */
}