/*
File: style02.css
background-color:COLOR
border:WIDTH TYPE COLOR; where TYPE=(none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|inherit)
COLOR: see http://www.quackit.com/html/html_color_codes.cfm
text-decoration: (none|underline|line-through|overline|blink)
color:COLOR
font-family:font1,'font with spaces',serif,sans
font-size:12pt;
font-style:(normal|italic|oblique)
font-weight:(normal|bold|bolder|lighter|100|200|300|400|500|600|700|800|900)

margin:TOP BOTTOM; or
margin:ALL; or
margin:TOP RIGHT BOTTOM LEFT;

Some named colors: maroon, red, orange, yellow, olive, green purple, fuchsia,
See: http://www.quackit.com/css/properties/css_border-style.cfm
Test CSS: http://www.cssdesk.com/

*/

/* HTML tags */
body {
	text-align: left !important;
	margin: 1em 2em !important;
	// margin-right: 10em !important;
	//padding: 0 7em !important;
}
div, li, p, span {
	text-align: left !important;
}

h1 {text-align:left;
   font-size:140%;
   border-top: 2px solid;
	background-color:lightgray;
}
h2 {text-decoration:underline;
text-align:left;
font-size:125%;
font-style:italic !important;
}
h3 {text-align:left;
font-size:115%;
font-weight:bold;}

h4 {
text-align:left;
font-weight:normal;
font-style:italic;
font-size:100%;
}

blockquote > p {border-left:2px solid black;
background-color:#e0e0e0 !important; /* Grayish color */
margin:3pt 5pt 5pt 6pt; /* TOP RIGHT BOTTOM LEFT */
padding-left:8pt;
padding-top:none;
padding-bottom:none;
}

.caption {text-align:left;
}

code {background-color:#e0e0e0; /* Grayish color */
/*border:1px black solid;*/
text-decoration:none;
}

figcaption {
	font-style:italic !important;
}

img {
   /*max-width:80% !important;*/
   align-content:left;
   max-width:80vw !important;
   height:auto !important;
   /*max-height:200 !important;*/
   object-fit:contain !important;
}

pre {background-color:#e0e0e0; /* Grayish color */
border:1px black solid;
text-decoration:none;
}

/* .Classes, usage: <p class="myclass"> 
*/
/* .warning {
	margin:1em !important;
	border: 2px solid red !important;
	font-weight:bold !important;
	background-color:#c0c0c0 !important;
	padding:5px;
} */

.censor {
font-weight:bold !important;
color:red !important;
}

.testclass {
font-weight:bold !important;
color:red !important;
}

.hint::before {
  content: "\1F44D"; /* Thumbs up Unicode.*/
  color: green;
  font-size: 24px;
  margin-right: 5px;
}

.hint { /* <p class="hint"> */
  border-left: 5px solid green;
  padding: 5px;
  background-color: lightgreen;
}

.warning::before {
  content: "\26A0"; /* Unicode escape sequence triangle warning sign. */
  color: orange;
  margin-right: 8px;
  font-size:30px;
}

.warning { /* <p class="warning"> */
  border-left: 5px solid red;
  padding: 5px;
  background-color: #FDEAE6;
}
