@import url(https://fonts.googleapis.com/css?family=Bad+Script);
@font-face {font-family: "Alegreya Regular";src: url(fonts/alegreya/Alegreya-Regular.otf);}
@font-face {font-family: "Alegreya Italic";src: url(fonts/alegreya/Alegreya-Italic.otf);}
@font-face {font-family: "Alegreya Sans Sc";src: url(fonts/alegreya/Alegreya-SansSC.otf);}
@font-face {font-family: "Mathlete Bulky Slant";src: url(fonts/mathlete/Mathlete-BulkySlant.otf);}
@font-face {font-family: "Sawasdee";src: url(fonts/Sawasdee.ttf);}




*{margin:0px;padding:0px;color:#808080;width:100;}


#logo{position:fixed; top:15px; left:15px; height:100px;}

nav{position:fixed;top:10vh;right:0px;display:flex;flex-direction:column;align-items:center; justify-content:space-between;height:80vh;width:7.5%;}
a.svg-button{width:80%;}
img.svg-button{width:100%;}

#content-wrapper{display:flex;display: -webkit-flex;flex-direction:column;align-items:center;justify-content:center;margin:50px 10px 10px 10px;}
#share-wrapper{width:320px;}
#menue{padding: 10px;position:absolute;right:0; top:0;margin-right:50px;margin-top: 50px;background-color:#c0c0c0;width:100px; height: 60px;border-radius: 8px;}
#menue p{text-align: center;font-family:"Alegreya Sans SC",sans-serif;font-size:20px;}
a:link, a:visited, a:link:active {
	text-decoration:none;
    /*border-bottom: 1px dotted black;*/
	border-bottom: none;
}
#names{margin:10px 0px 0px 0px;}
span{font-size:23px;font-family:"Alegreya Sans SC", sans-serif;}
#tellnshare{display:flex;display: -webkit-flex;flex-direction:column;align-items:flex-end;border-style:solid;border-width:1px;border-color:#ccc;padding:5px;margin-top:4px;}
#names input{width:139px;font-size:22px;font-family:"Alegreya Sans SC", sans-serif; border-style:solid;border-width:1px;border-color:#ccc;padding:3px;}
#sharefield{border:none;width:100%;height:80px;font-size:22px;font-family:"Alegreya Italic"}
#sharebutton{width:55px;height:22px;background:#c0c0c0;color:#fff;border:none; border-radius:8px;font-family:"Alegreya Sans SC", sans-serif; }
#story-wrapper{display:flex; flex-direction:column-reverse;align-items:center;justify-content:center;max-width:320px;}
header{display:flex; justify-content:space-between; font-size:23px;font-family:"Alegreya Sans SC", sans-serif; margin:15px 0px 5px 0px;}
article {font-size:18px;font-family:"Alegreya Italic", sans-serif;}
#story-wrapper svg{width:320px;height:280px;margin:50px 0px 0px 0px;}

.badscript{font-size:30px;font-family:"Bad Script", cursive; font-style: italic; color:#9DCB91;}
.flux{font-family:"Bad Script", cursive; font-style: italic; color:#fff;}
.tory{font-size:20px;font-family:"Sawasdee"; color:#fff;}
.alegreyaitalic{font-size:20px;font-family:"Alegreya Italic"; color:#fff;}
#white{color:#fff;}