/* Applies to the entire body of the HTML document (except where overridden by more specific
selectors). */
body {
  margin: 25px;
  background-color: rgb(255,255,255);
  font-family: Arial, sans-serif;
  font-size: 14px;
  background:  rgba(250, 255, 255, 0.3);
  
  counter-reset: defn-counter 0 fact-counter 0 rfact-counter 0 exam-counter 0 problem-counter 0 intuition-counter 0 rule-counter 0 notation-counter;
}

/* Applies to all <h1>...</h1> elements. */
h1 {
  font-size: 35px;
  font-weight: normal;
  margin-top: 5px;
  font-family: Palatino Linotype;
  color:  #743d2f;
}

/* Applies to all <h1>...</h1> elements. */
h2 {
  font-size: 24px;
  font-weight: normal;
  margin-top: 5px;
  font-family: "Palatino Linotype";
  color:  #743d2f;
}

/* Applies to all <h1>...</h1> elements. */
h3 {
  font-size: 16px;
  font-weight: normal;
  margin-top: 5px;
  font-family: "Palatino Linotype";
  color:  #743d2f;
}

/* Applies to all <h1>...</h1> elements. */
h4 {
  font-size: 14px;
  font-weight: normal;
  margin-top: 5px;
  font-family: "Palatino Linotype";
  color:  #743d2f;
}

blockquote {
  background: #f7f2e5;
  border-left: 10px solid #743d2f;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
}

hr{ 
  height: 3px;
  color: #d9c390;
  background-color: #e0cea5;
  border: none;
}

.PackageName {
  color:  #6666FF;
}

.OperatorTok{
  color:  #CF5C00;
}

.KeywordTok{
  color:  #214A87;
}

.OtherTok{
    color:  #8F5A00;
}



.fact{
	padding-top: 5px;
	padding-left: 5px;
	background: rgba(124, 204, 138, 0.4);
	border-top:  solid green;
	border-bottom: solid green;
	margin-bottom: 25px;
}
.fact::before{
        content: "Fact  " counter(fact-counter) " ";
	counter-increment:  fact-counter;
	font-weight: bold;
}

.rfact{
	padding-top: 5px;
	padding-left: 5px;
	background: rgba(235, 162, 157, 0.4);
	border-top:  solid red;
	border-bottom: solid red;
	margin-bottom: 25px;
}
.rfact::before{
        content: "R Fact  " counter(rfact-counter) " ";
	counter-increment:  rfact-counter;
	font-weight: bold;
}

.defn{
	padding-top: 5px;
	padding-left: 5px;
	background: rgba(238, 218, 196, 0.4);
	border-top:  solid coral;
	border-bottom: solid coral;
	margin-bottom: 25px;
}

.defn::before{
        content: "Definition  " counter(defn-counter) " ";
	counter-increment:  defn-counter;
	font-weight: bold;
}

.notn::before{
  content: "Notation  " counter(notation-counter) " ";
  counter-increment:  notation-counter;
  font-weight: bold;
}

.notn{
	padding-top: 5px;
	padding-left: 5px;
	background: rgba(150, 250, 250, 0.2);
	border-top:  solid rgb(150, 250, 250);
	border-bottom: solid rgb(150, 250, 250);
	margin-bottom: 25px;
}

.intuition{
	padding-top: 5px;
	padding-left: 5px;
	background: #e0e5c1;
	border-top:  solid rgb(150, 250, 150);
	border-bottom: solid rgb(150, 250, 150);
	margin-bottom: 25px;
}

.intuition::before{
        content: "Intuition  " counter(intuition-counter) " ";
	counter-increment:  intuition-counter;
	font-weight: bold;
}

.rule{
	padding-top: 5px;
	padding-left: 5px;
	background: rgba(200, 0, 0, 0.4);
	border-top:  solid rgb(200, 50, 50);
	border-bottom: solid rgb(200, 50, 50);
	margin-bottom: 25px;
}

.rule::before{
        content: "Rule  " counter(rule-counter) " ";
	counter-increment:  rule-counter;
	font-weight: bold;
}

.exam{
	padding-top: 5px;
	padding-left: 5px;
	background: rgba(190, 193, 213, 0.4);
	border-top:  solid gray;
 	border-bottom: solid gray;
	margin-bottom: 25px;
}

.exam::before{
        content: "Example  " counter(exam-counter) " ";
	counter-increment:  exam-counter;
	font-weight: bold;
}

.boxed {
    background: #fcf8e3;
    color: black; 
    border-radius: 5px; 
    padding: 3px;
    border: 2px solid green;
}

.centerboxed {
    background: #fcf8e3;
    color: black; 
    border-radius: 5px; 
    padding: 3px;
    border: 2px solid green;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
}

.intuition{
	padding-top: 5px;
	padding-left: 5px;
	background: rgba(255, 255, 48, 0.4);
	border-top:  solid #909030;
	border-bottom: solid #909030;
	margin-bottom: 25px;
}

.intuition::before{
    content: "Intuition  " counter(intuition-counter) " ";
    counter-increment:  intuition-counter;
    font-weight: bold;
}

.widthquarter {
    width: 25%;
}

.widthhalf {
    width: 50%;
}

.problem {
    display: inline-block;
    margin-left: 45px;
    padding-top: 5px;
    padding-left: 5px;
    padding-right: 5px;
    background: rgba(255, 255, 255, 0.2);
    /*	border-top:  solid #909030;
	borde	     r-bottom: solid #909030;*/
    margin-bottom: 25px;
    width: 750px;
}

.problem::before{
    margin-left: 0px;
    content:  "Problem " counter(problem-counter);
    counter-increment: problem-counter;
    font-size:  14pt;
    font-family:  Palatino Linotype;
    font-weight: bold;
    color: #743d2f;
    display: inline;
}

.ribbon {
  background-color: #5BC8F7;
}

.ribbon::before {
  content: "Look at this orange box.\0000a0";
  background-color: #FFBA10;
  border-color: black;
  border-style: dotted;
  display: inline;
}

.skip-problem {
    counter-increment:  problem-counter;
}

.solution {
    display: none;
    /* display: block; */
    margin-left: 45px;
}
.solution::before{
    margin-left: 0px;
    padding: 0em;
    content:  "Solution ";
    color: rgba(255, 0, 0, 0.6);
    font-weight: bold;
    font-size: 14pt;
    padding-bottom: 1em;
}

.prob_soln {
    display: none;
    /* display: block; */
    margin-left: 45px;
}
.prob_soln::before{
    margin-left: 0px;
    padding: 0em;
    content:  "Solution ";
    color: rgba(255, 0, 0, 0.6);
    font-weight: bold;
    font-size: 14pt;
    padding-bottom: 1em;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
}

tr.odd {
  background-color:  #d2d5b9;
}

.blackbox {
  padding: 1em;
  background: black;
  color: white;
  border: 2px solid orange;
  border-radius: 10px;
}
.center {
  text-align: center;
}

.problem-style {
    width = 300px;
}

.problem-style ol {
  list-style: none !important;
  counter-reset: my-awesome-counter;
  width = 50%;
}

.problem-style li {
  counter-increment: my-awesome-counter;
  margin: 0.25rem;
  border-bottom: 1px none #743d2f;
}

.problem-style li::before {
  content: counter(my-awesome-counter, lower-alpha) ".";
  font-weight:700;
  padding-right:3px;
  display: inline-block;
  width: 2rem;
  height: 2rem;
  font-size: large;
  color: #743d2f;
  text-align: center;
  margin-right: 0.5rem;
}

.problem-style ol ol {
    counter-reset: problem-part;
}

.problem-style ol ol li {
    counter-increment: problem-part;
}

.problem-style ol ol li::before {
  content: counter(problem-part, lower-alpha) ".";
  font-weight:700;
  padding-right:3px;
  display: inline-block;
  width: 2rem;
  height: 2rem;
  font-size: large;
  color: #743d2f;
  text-align: center;
  margin-right: 0.5rem;
}



















@use postcss-preset-env {
  stage: 0;
  autoprefixer: {
    grid: true;
  }
  browsers: last 2 versions
}

.problemnosoln {
    display: inline-block;
    margin-left: 45px;
    padding-top: 5px;
    padding-left: 5px;
    padding-right: 5px;
    background: rgba(255, 255, 255, 0.2);
    /*	border-top:  solid #909030;
	borde	     r-bottom: solid #909030;*/
    margin-bottom: 25px;
    width: 750px;
}

.problemnosoln::before{
    margin-left: 0px;
    content:  "Problem " counter(problem-counter);
    counter-increment: problem-counter;
    font-size:  14pt;
    font-family:  Palatino Linotype;
    font-weight: bold;
    color: #743d2f;
    display: inline;
}

.thm{
	padding-top: 5px;
	padding-left: 5px;
	background: #dcb4ff;
	border-top:  solid purple;
	border-bottom: solid purple;
	margin-bottom: 25px;
}

.thm::before{
        content: "Theorem  " counter(thm-counter) " ";
	counter-increment:  thm-counter;
	font-weight: bold;
}

.solutionexam {
    /*    display: none;*/
    display: block;
    margin-left: 45px;
}
.solutionexam::before{
    margin-left: 0px;
    padding: 0em;
    content:  "Solution ";
    color: rgba(255, 0, 0, 0.6);
    font-weight: bold;
    font-size: 14pt;
    padding-bottom: 1em;
}

.proof {
    display: block;
    margin: 12px 0;
    font-style: normal;
    padding-bottom: 2em;
}
.proof:before {
    content: "Proof.";
    font-style: italic;
}
.proof:after {
    content: "\25FB";
    float:right;
}

.term {
    color: #2020AA;
    font-weight: bold;
}