/* default bookdown css */
.caption {
  color: #777;
  margin-top: 10px;
}
p code {
  white-space: inherit;
}
pre {
  word-break: normal;
  word-wrap: normal;
}
pre code {
  white-space: inherit;
}

/* default css for fenced-blocks mod */
.divhead-plain {
  font-weight: bold;
  font-style: normal;
}

.divhead-definition {
  font-weight: bold;
  font-style: normal;
}

.divhead-remark {
  font-weight: bold;
  font-style: normal;
}


/*
 * Removed this with the latest version of bookdown, which includes
 * a QED box after div.proof.  But their version isn't great, as it bleeds into
 * the following div sometimes.
 *
 * div.proof::after {
 *  position: relative;
 *  bottom: 1.5em;
 *  font-size: 150%;
 *  content: "\2610"; // square box QED
 * }
*/

/*
 * custom css for our book
 */

/* Chapter banner header */
#webbanner {
  background-color:  rgba(64, 128, 255, 0.1);
  border: 2px solid gray;
  border-radius: 5px;
  padding-left: 1em;
  padding-right: 1em;
  margin-bottom: 0.5em;
  font-size: 150%;
  font-style: bold;
  font-family: Georgia, serif;
}

/* Photo credits */
.photocredit {
  font-size: small;
  font-style: italic;
  text-align: right;
  position: relative;
}

/* The photocredit popup (appears on top) */
.photocredit .photocreditpopup {
  visibility: hidden;

  text-align: left;
  position: absolute;
  z-index: 1;
  width: 50%;
  right: 0;
  bottom: 0;

  border: thin solid black;
  background-color: #EEE;
  border-radius: 6px;
  padding: 8px 8px;
}

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.photocredit .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

/* Theorem and other structures */
.theorem, .proposition, .definition {
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  margin-bottom: 0.5em;
}

 .proof {
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  margin-bottom: 0.5em;
}


.theorem, .proposition, .proof {
  background-color: rgba(128, 255, 96, 0.3)
}

.proof {
  background-color: rgba(128, 255, 96, 0.2)
}

.definition {
  background-color: rgba(96, 255, 192, 0.3)
}


.example {
  background-color: rgba(128, 192, 255, 0.3);
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  padding-top: 0.5em;
  padding-bottom: 0.25em;
  margin-bottom: 0.5em;
}

.remark {
  background-color: rgba(255, 153, 51, 0.5);
  padding-left: 1em;
  padding-top: 0.5em;
  padding-bottom: 0.5em;
  border-radius: 1em;
  margin-top: 0.5em;
  font-weight : bold;
}




.tryit {
  background-color: rgba(255, 192, 64, 0.3);
  border: 1px solid gray;
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.tryit-before {
  /* hide the default text */
  display : none;
}
.tryit::before {
  /* replace default text */
  font-weight : bold;
  content: "Now it's your turn!";
}


.exploration {
  background-color: rgba(44, 208, 208, 0.3);
  border: 1px solid gray;
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.exploration-before {
  /* hide the default text */
  display : none;
}
.exploration::before {
  /* replace default text */
  font-weight : bold;
  content: "Let's Explore!";
}




.codechunk {
  background-color: rgba(144, 170, 123, 0.3);
  border: 1px solid gray;
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  margin-bottom: 0.5em;
  margin-top: 0.5em;
}
.codechunk-before {
  /* hide the default text */
  display : none;
}
.codechunk::before {
  /* replace default text */
  font-weight : bold;
  content: "Code Template";
}


.datadownload {
  background-color: rgba(246, 127, 210, 0.3);
  border: 1px solid pink;
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  margin-bottom: 0.5em;
  margin-top: 0.5em;
}
.datadownload-before {
  /* hide the default text */
  display : none;
}
.datadownload::before {
  /* replace default text */
  font-weight : bold;
  content: "Data Download";
}

.NewFunctions {
  background-color: rgba(235, 202, 251, 0.3);
  border: 1px solid blue;
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.NewFunctions-before {
  /* hide the default text */
  display : none;
}
.NewFunctions::before {
  /* replace default text */
  font-weight : bold;
  content: "New Functions";
}

.NewFunction {
  background-color: rgba(235, 202, 251, 0.3);
  border: 1px solid blue;
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.NewFunction-before {
  /* hide the default text */
  display : none;
}
.NewFunction::before {
  /* replace default text */
  font-weight : bold;
  content: "New Function";
}

.alert {
  background-color: rgba(255, 92, 64, 0.3);
  border-left: 1px solid gray;
  padding-left: 1em;
  padding-right: 1em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}
.alert-before {
  /* hide the default text */
  display : none;
}
.alert::before {
  /* replace default text with ! icon */
  font-size: 300%;
  content: "\26A0";
}

/*"\26A0"*/

.platypusoddity {
  background-color: rgba(192, 178, 178, 0.3);
  border: 1px solid black;
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  margin-bottom: 0.5em;
  margin-top: 0.5em;
}
.platypusoddity-before {
  /* hide the default text */
  display : none;
}
.platypusoddity::before {
  /* replace default text */
  font-weight : bold;
  content: "Platypus Oddity";
}

.bigidea {
  background-color: rgba(128, 255, 96, 0.3);
  border: 1px solid black;
  border-radius: 1em;
  padding-left: 1em;
  padding-right: 1em;
  margin-bottom: 0.5em;
  margin-top: 0.5em;
}
.bigidea-before {
  /* hide the default text */
  display : none;
}
.bigidea::before {
  /* replace default text */
  font-weight : bold;
  content: "Big Idea";
}