@import url('https://fonts.googleapis.com/css2?family=Literata:opsz,wght@7..72,200..900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fraunces:wght@100;500;900&display=swap');

/* Removed invalid @viewport rule */

html {  background-color:#2b2b2b; 
        background-image:url('bodybkg.png'); 
        background-repeat:repeat-x; }

body {  font-family: "Literata", serif;
        font-optical-sizing: auto;
        background-color:#fffefb;
        width:100% !important;
        max-width: 100%;
        font-weight: 400;
        margin:0;padding:0;
        font-weight:300;
        font-size:16px;
        color: #111 ;}

#logo {
    white-space: normal !important;
    overflow: visible !important;
    max-width: 100% !important;
    line-height: 1.2em; } /* restore proper spacing */ 
#header  { display:block;padding:0px;margin:0px;
            height:250px;
         background-image:url('/assets/images/header.jpg'); }
#logo { display:block;padding:10px;margin:10px;font-family: "Fraunces", serif;
        font-weight:500; color:#ccc ;}
#logo h1 {font-size:2.0em ; }           
#logo h2 {font-size:1.5em ; color:#536153; }
#logo a:link, #logo a:visited {text-decoration:none ; color:#000 ;}
#logo a:hover, h1 #logo:active {text-decoration:none ; color:#000 ;}

#closebut {margin-right:-155px;text-align:right;}


#noveltitle 	 {  font-family: "Literata", serif; font-weight:500;
                   /* margin:0px ; padding:0px; */
                   line-height:1.5em;
                    display:block;
                    margin-bottom:2Opx;
                    padding-bottom:100px;
                    color:#111; font-size:2em ;
                    text-align:left; }
h3 	 { font-size:1.2em; }

ul   { margin: 0; padding: 0; display:inline-block ;list-style-type: none; text-align:left; }
li   { margin: 0; padding: 0; display:inline-block ;list-style-type: none; text-align:left; }

#content        { width:530px; 
                  line-height:30px; 
                  margin:20px auto; 
                  padding-bottom:60px;
                  border:1px solid #0000 }

#content.home h1 {  font-family: "Fraunces", serif; color:#eee; 
                    font-weight:900;font-size:1.8em ; height:1em;
                    padding: 8px 0 8px 5px;
                    background-color:#333;
                    background-image:url('fond.png'); }
#content.home h2 {  font-family: "Fraunces", serif; color:#000;
                    font-weight:100;font-size:1.0em ;}

#content.home   { width:800px; text-align:justify;}
#content.home a {  font-weight:500;font-size:1.1em; color:#555; text-decoration:none;
                    text-align:justify; border:1px dotted #999;
                    padding:4px 8px; margin:0 10px 0px 0px; line-height:3.0em; }
#content.home a:hover       { background-color:#eee; }
#content.home a:visited     { background-color:#eee; }
#hasimage       { text-align:center;margin-left:-40px;padding-top:40px;padding-bottom:10px;}

#pageturner     { text-align:center;font-size:0.8em;display:block; margin-top:10em; border-top: 1px dotted #888; }
#pageturner a:link,#pageturner a:visited    { color: #00f; text-decoration:none }
#pageturner a:hover,#pageturner a:active    { color: #00f; text-decoration:underline }


#footer     {   background-color:#536153; 
                height:250px;clear:both; color:#eee;
                font-size:0.8em; margin-top:80px; 
                padding-bottom:20px;}
#footer a {color:#eee;}                


/* Reset some unnecessary spacing on mobile */
@media (max-width: 768px) {
 
html, body {
    overflow-x:hidden;
    margin: 0;
    padding: 0;
    width:100% !important;
    max-width: 100%;
    font-size: 20px;   /* Readable default */
    line-height: 1.5;
    background-image:none !important;
    background-color:#fff; }

h1 { font-size: 0.8em; }
h2 { font-size: 0.6em; }
h3 { font-size: 0.5em; }

 /* Give space below headings */
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 0.5em; }

p { margin: 0 0 1rem;}

/* Container/content adjustments */
#header { display:block;padding:0px;margin:0px; }
#logo   { display:block;padding:0px;margin:0px;font-family: "Fraunces", serif;
          font-weight:500; color:#eee ;}

#closebut { margin:Opx;padding:0px;text-align:left;}
/* #closebut img { width:5% !important };
*/
#content, #content.home  {
    background-color:#fff;
    width: 95% !important;
    max-width: 95% !important;
    padding: 8px;
    margin:Opx;
  }

#hasimage {margin-left:0 !important;}  
#noveltitle {  font-family: "Literata", serif; font-weight:500;
            line-height:initial;
            width:100% !important;
            margin:0px !important;
            margin-bottom:2em !important;
            padding:0px !important;
            color:#111;
            text-align:left; }
  /* Strip out floats or side-by-side layouts */
.sidebar, .extra-column {
    display: none;  /* or stack them below if you prefer */
}

img, video {
    max-width: 100%;
    height: auto;
  }

table {
    width: 100%;
    border-collapse: collapse;
    display: block;    /* avoid overflow */
    overflow-x: auto;
  }
}