body{
	max-width: 40em;
	margin: 0 auto;
	text-align: justify;
	hyphens: auto;
	background: white;
	background-image: linear-gradient(to right, rgb(255,255,255) 0%, rgb(230,225,230) 50%, rgb(255,255,255) 100%);	
}

#mainwrap{
	background-color: rgba(255, 255, 255, 0.5);
	border: 2px white solid;
	border-top-color: rgba(255, 255, 255, 0.5);
	padding: 0 2em 3em 2em;
}

/* ----------------------------------------------------------- */

.accessibilitylink{
	display:none;
}

.eccc1200-, .small-caps, .sc{
	font-variant: small-caps;
}

a{
	color: #316896;
}


a:hover{
	background: #FFFFFF;
}

a.wikilink{
	text-decoration: none;
}

h1{
	text-align: center;
	font-size: 3em;
	text-shadow: 0 2px 0 rgba(255,255,255,0.75);
}

h2, h3{
	text-align: left;
}

h2{
	font-size: 1.5em;
	margin-top: 2em;
}

p{
	line-height: 1.2em;
}

p#start{
	margin-top: 3em;
}

.up{
	font-variant-position: super;
}

.ecsl-1200{
	font-style: oblique;
}

.ecbx-1200{
	font-weight: bold;
}

.vocab{
	font-style: oblique;
	color: #7C040B;
}

.textit, .ecrm-0800, .fxlri-t-1x-x-120{
	font-style: italic;
}

img{
	max-width: 100%;
}


/* ----------------------------------------------------------- */

dt{
	margin-top: 1em;
}

pre{
}

.pseudocode{
	text-align: left;
	border: 1px silver solid;
	display: block;
	padding: 2em;
}

code{
	border: 1px silver solid;
	display: block;
	padding: 1em 2em 2em 2em;
	font-size: 1em;
	white-space: pre-wrap;
	hyphens: none;
	text-align: left;
	overflow: scroll;
  resize: horizontal;
}

.ittitle{
	font-style: italic;
}


/* ----------------------------------------------------------- */

.toplink{
	text-align: center;
}

.toplink a img{
	border: 1px gray solid;
	margin: 1em;
	filter: drop-shadow(0 0 0.3rem gray);
}

.toplink a:hover{
	background: none;
}

.toplink a:hover img{
	background-color: rgba(255,255,255,0.6);
	box-shadow: white 0 0 30px;
	filter: drop-shadow(0 0 0.9rem gray);
	
}

a.bottomlink{
	display: block;
	margin: 2em 0 2.5em 0;
}

	
.blurb{
	border: 1px silver solid;
	min-height: 130px;
	padding: 10px;
	border-radius: 5px;
	margin: 0 0 2em 0;
	text-align: left;
}

.blurbtxt{
	display: block;
	margin-top: 40px;
	margin-bottom: 40px;
}

.blurb .imglink{
	float: right;
	margin-left: 10px;
}

.homelink{
	font-style: italic;
}

.chaptercontents{
	text-align: left;
	float: right;
	font-size: 0.8em;
	width: 20%;
	min-width: 15em;
	border: 1px gray solid;
	margin: 1.5em 0 1.5em 1.5em;
	padding: 1em;
	background: #E8E8E8;
	border-radius: 3px;
	box-shadow: 0 0 3px #E8E8E8;
}

.currentsection{
	background: #F7F7F7;
	border: 1px white solid;
	padding: 0.2em;
	border-radius: 3px;
}

.chaptercontents li{
	line-height: 1.2em;
	padding: 0em;
	margin: 0 0;
}

.chaptercontents li a{
		border: 1px #E8E8E8 solid;
	display: block;
	padding: 0.5em;
}

.chaptercontents li a:hover{
		background: #F7F7F7;
	border: 1px white solid;
}

.chaptercontents ol{
	margin: 1em 0 0 0;
	padding: 0 0 0 1.5em;
}

.currentchapter{
	display: block;
	text-align: center;
	font-size: 1.2em;
	text-decoration: none;
}

.bottomnav{
	margin: 4em -2em 4em -2em;
	padding: 2.8em 0;
	border-top: 1px silver solid;
	border-bottom: 1px silver solid;
}

.linkup{
	display: block;
	clear: both;
	text-align: center;
	font-variant: small-caps;
	text-decoration:none;
	font-size: 1.2em;
	padding: 1em 0;
	margin: 0;
}

.sectionribbon, .chapterribbon{
	text-align: center;
	padding: 1em 1em;
	display: flex;
	align-items: center;
	
}

.chapterlink, .sectionlink{
	flex: 1;
	border: 1px silver solid;
	padding: 1em 0.2em;
	margin: 0.5em;
	border-radius: 5px;
	text-decoration: none;
	hyphens: none;
}

a.sectionlink:hover{
	background-color: #FFFFFF;
}

.chap, .sec{
	display: block;
	font-variant: small-caps;
	border-bottom: 1px silver solid;
	padding-bottom: 0.2em;
	margin-bottom: 0.4em;
}

.footerlink{
	font-size: 0.9em;
	padding-bottom: 3em;
}

.sanspub{
  text-align: center;
	margin-bottom: 2em;
}

.sanspub a{
	opacity: 0.5;
}

.sanspub a:hover{
	opacity: 1;
	background: none;
}


/* ----------------------------------------------------------- */

li.enumerate{
	margin: 0.6em 0;
}

.MathJax_MathML{
	text-indent: 0;
}

.figure{
	font-size: 0.9em;
	max-width: 80%;
	margin: 3em auto;
}

.figure .MathJax, .table .Mathjax{
	font-size: 0.9em;
	padding-right: 0.6em;
}

.figure img{
	 max-width: 80%;
	margin: 3px 0;
}

.figure .center{
	text-align: center;
	margin: 0 0 2em 0;
}

.figure .credits{
	width: 35em;
	max-width: 100%;
	margin: 1em 0 0 auto;
	text-align: right;
	font-size: 0.8em;
	opacity: 0.8;
}

.credits a{
	text-decoration: none;
}

table{
	margin: 4em 0 2em 0;
	border-spacing: 0px;
}

td{
	min-height: 3em;
	border-top: 1px silver solid;
	padding: 0.5em 0;
}

.leftcolumn{
	min-width: 8em;
}

.centercolumn{
	min-width: 9.5em;
}

.principe{
	border: 2px gray solid;
	padding: 1em;
	margin: 2em;
	text-align: center;
	background-color: rgba(255, 255, 255, 0.3);
}

.specialquote{
	font-size: 0.8em;
	max-width: 45%;/*legacy*/
	max-width: calc(50% - 3em);
	min-width: 18em;
	padding: 1.5em;
	margin: 0 0 1.5em 1.5em;
	float: right;
	background: #D9D9D9;
	opacity: 0.9;
	border-radius: 3em;
}

.quotetext::before{
	content: "« ";
	font-size: 3em;
	float: left;
	line-height: 0.5em;
	padding: 0 0.2em 0.2em 0;
}

.quotetext::after{
	content: " »";
	font-size: 3em;
	float: right;
	line-height: 0.5em;
	padding: 0 0 0 0.2em;
}

.specialauthor{
	clear: both;
	text-align: right;
	margin-top: 1.5em;
}

.specialsource{
	font-style: italic;
	text-align: right;
}

.anexample{
	margin: 2em auto 2em auto;
	background: silver;
	text-align: left;
	padding: 1em;
	border-radius: 5px;
}

.exampletitle{
	text-align: center;
	padding: 1em;
	margin: 0 0 1.5em 0;
	border-bottom: 1px white solid;
}

.remark{
	padding-left: 40px;
	margin: 1em 0;
}

.remark::before{
	content: url(../webfiles/hand.svg);
	display: inline-block;
	position: relative;
	left: -32px;
	top: 7px;
	margin-right: -27px;
	opacity: 0.7;
}

.answertitle{
	text-align: center;
	font-style: italic;
	padding: 1em 0 1em 0;
	margin: 1.5em auto 0 auto;
	border-top: 1px white solid;
}


ul.desclist{
	list-style: none;
	margin: 0;
	padding: 0 0 0 2em;
}

.desclist li{
	content: "\200B";
	margin: 1em 0;
}

.desclist .descitem{
	margin: 0 0 0 -2em;
	font-weight: bold;
	font-style: oblique;
	color: #7C040B;	
}

ul.itemize1{
	list-style: none;
	margin: 0 0 1em 0;
	padding: 0 0 0 3em;
}

.itemize1 li{
	content: "\200B";
	margin: 0.25em 0;
}

blockquote {
	min-width: 18em;
	line-height: 1.5em;
	padding: 1.5em;
	margin: 0 0 1.5em 1.5em;
	background: #D9D9D9;
	opacity: 0.9;
	border-radius: 0.5em;
}

blockquote:before {
	content: "« ";
	padding: 0 0.2em 0 0;
}

blockquote:after {
	content: " »";
	padding: 0 0 0 0.1em;
}

blockquote:before,
blockquote:after {
	font-size: 3em;
	display: inline-block;
	line-height: 0.333em;
	vertical-align: top;
  color: gray;
}


/* if screen becomes narrow */

@media all and (max-width: 41em){
  .blurbtxt{
    margin-top: 10px;
		margin-bottom: 10px;
	}
	
	.chaptercontents{
		float: none;
		width: 30em;
		max-width: 90%; /*legacy*/
		max-width: calc(100% - 2.6em);
		margin: 3em auto;
	}
	
	.figure{
		max-width: 100%;
	}

	.figure img{
		width: 100%;
		max-width: 300px;
	}
	
	.sectionribbon, .chapterribbon{
		padding: 1em;
		display: block;
	}

	.chapterlink, .sectionlink{
		display: block;
		width: 90%; /*legacy*/
		width: calc(90%-1em);
		margin: 0.5em auto;;
	}
	
	.specialquote{
	max-width: 80%;
	margin: 2em auto;
	float: none;
  }

}



/* Dark Mode Styling */
@media (prefers-color-scheme: dark) {
    body {
        color: #ddd;
        background: #333333;
        background-image: none;
    }
	
	  img{
		  filter: brightness(0.8)
	  }

    .sanspub img{
      filter: none;
    }
	
		h1{
			text-shadow: none;
		}
	
		#head_box #lead_picture{
			opacity: 0.8;
			}

    a {
        color: #79b8ff;
    }

    a:hover {
        color: #ff6b6b;
    }

    h2 {
        color: #fff;
    }

    .credit_box {
        border: 2px #444 solid;
        background-color: #494949;
        box-shadow: #222 0 0 7px;
    }

    .biigbutton a {
        border: 1px #888 solid;
        color: #fff;
    }

    .biigbutton a:hover, .biigbutton a:active {
        background: #007a5e;
        border-color: #007a5e;
    }

    blockquote {
        background: #333;
        color: #bbb;
    }

    .cours_content {
        color: #aaa;
        border-right: 1px #555 solid;
    }

    .promptbox a:hover img {
        background-color: rgba(255, 255, 255, 0.1);
			  border-color: rgba(255, 255, 255, 0);
        box-shadow: 0 0 15px rgba(255, 255, 255, 0.2);
       
    }

    input, textarea {
        background: #222;
        color: #ddd;
        border: 1px solid #555;
    }

    input::placeholder, textarea::placeholder {
        color: #888;
    }

	
	    #mainwrap {
        background-color: rgba(50, 50, 50, 0.5);
        border: 2px #444 solid;
        border-top-color: rgba(100, 100, 100, 0.5);
        padding: 0 2em 3em 2em;
    }
	
	  .chaptercontents{
	    border: 1px gray solid;
	    background: #4b4b4b;
    }
	
	  .chaptercontents li a{
		  border-color: #4b4b4bff;
	  }
	  
	  .anexample{
		  background: #4b4b4bff;
	  }
	 
	 .vocab,.desclist .descitem {
      color: #ff8c42;
    }
	
	 .specialquote{
	  	background: #3e3e3e;
	  }
	
}