/*colors : muted teal #86BA90 lemon chiffon #F5F3BB light bronze #DFA06E*/

body{background-image:url(background.jpg); color: #DFA06E; font-family: "Times New Roman"}

a.menu {color :#F5F3BB}
a { color: #86BA90}
.welcome{ text-align: center;
}
#welcometext{ letter-spacing: 0.25em}
.menu{ display: flex; align-items: center; justify-content: center}
.spritesbox{border: 2px solid; border-radius: 20px; background-color: #86BA90; color: #F5F3BB; padding: 5px; width: fit-content}
.writingbox{border: 2px solid; border-radius: 20px; background-color: #86BA90; color: #F5F3BB; padding: 5px;width: fit-content}
.cameraroll{border: 2px solid; border-radius: 20px; background-color: #86BA90; color: #F5F3BB; padding: 5px;width: fit-content}
.sketchbookbox{border: 2px solid; border-radius: 20px; background-color: #86BA90; color: #F5F3BB; padding: 5px;width: fit-content}
.intro {display: flex; padding: 20px; margin-left: 150px; margin-right: 150px}
.spacer {flex: 100%}
.main {display: flex; justify-content: center; margin-left: 150px; margin-right: 150px}
.infotitle {display: flex; align-items: center; justify-content: center; width: 100%; border: 1px solid; border-radius: 10px 10px 0px 0px; background-color: #DFA06E; color: #F5F3BB; letter-spacing: 0.50em; }
.infotext {margin: 10px; padding: 10px; box-sizing: border-box; border: solid 1px #F5F3BB; max-height: 80px; overflow-y: auto}

.whoami{flex: 30%; box-sizing: border-box; border-radius: 10px; border: dotted; background-color: #fff; font-size: 20px; padding: 1px; margin-right: 10px}
.updates {flex: 10%; box-sizing: border-box; border-radius: 10px; border: dotted; background-color: #fff; font-size: 18px; padding: 1px}
.mirmobox{flex: 50%; box-sizing: border-box; border-radius: 10px; border: dotted; width: fit-content; height: fit-content; background-color: #fff; font-size: 20px; padding: 1px; margin: 20px}
.playlist{flex: 50%; box-sizing: border-box; border-radius: 10px; border: dotted; width: fit-content; height: fit-content; background-color: #fff; font-size: 20px; padding: 1px; margin: 20px}

.readingbox {display: flex; height: fit-content; width: fit-content; border-radius: 10px; border: dotted; background-color: #fff; font-size: 20px; padding: 1px; margin-left: 170px; margin-right: 170px}
    .nowreading {width: 1173px; text-align: center; border: 1px solid; border-radius: 10px 10px 0px 0px; background-color: #DFA06E; color: #F5F3BB; letter-spacing: 0.50em; position: absolute}
    .bookbox {box-sizing: border-box; border: solid 1px; padding: 5px; height: fit-content; display: flex; flex-direction: column; margin: 10px;}
    .summary{display: flex; align-items: center; box-sizing: border-box; border: solid 1px; margin-top: 20px; margin-right: 20px; margin-bottom: 20px; padding: 10px; flex-direction: column; line-height: 30px}
    .readingcontent {display: flex; margin-top: 15px}
    .bookdetails {line-height: 10px; font-size: 15px}
    .previousreads {font-size: 18px}