/* css style for slide */
/* xaringen, remark.js                */
/* 2021 Roy Francis                   */

/* define font */
@import url('https://fonts.googleapis.com/css?family=Roboto|Source+Sans+Pro:300,400,600|Ubuntu+Mono&subset=latin-ext');

:root {
  --color-primary: #95b540;
  --color-border: #e8e8e8;
  --color-text: #424949;
  --color-code-bg: #f9f9f9;
  --color-code-inline: #ff665d;
  --font-base: 'Source Sans Pro';
  --font-highlight: 'Source Sans Pro';
  --font-code: 'Ubuntu Mono';
}

/* FONTS -------------------------------------------------------------------- */

/* body font family */
body, p, h1, h2, h3, h4, h5, h6,
.remark-slide-content, .remark-slide-content body,
.remark-slide-content p, .remark-slide-content h1,
.remark-slide-content h2, .remark-slide-content h3,
.remark-slide-content h4, .remark-slide-content h5,
.remark-slide-content h6 {
  font-family: var(--font-base, 'Roboto', 'DIN', 'Helvetica', sans-serif);
  color: var(--color-text);
  font-weight: 400;
  font-size: 20px;
}

/* title font family, weight and size */
h1, h2, .remark-slide-content h1, .remark-slide-content h2 {
  font-family: var(--font-highlight, 'Roboto', 'DIN', 'Helvetica', sans-serif);
  color: var(--color-text);
  font-weight: 600;
  letter-spacing: 0.02rem;
}

h1, .remark-slide-content h1 {
  font-size: 1.802rem;
  color: var(--color-text);
  margin-top: 0.9rem;
  margin-bottom: 0.8rem;
}

h2, .remark-slide-content h2 {
  font-size: 1.602rem;
  color: var(--color-text);
  margin-top: 0.2rem;
  margin-bottom: 0.6rem;
  /* border-left: var(--color-primary) 6px solid; */
  /* padding-left: 0.5em; */
}

h3, .remark-slide-content h3 {
  font-size: 1.424rem;
  margin-top: 0.6rem;
  margin-bottom: 0.4rem;
}

h4, .remark-slide-content h4 {
  font-size: 1.266rem;
  margin-top: 0.5rem;
  margin-bottom: 0.3rem;
}

h5, .remark-slide-content h5 {
  font-size: 1.266rem;
  margin-top: 0.5rem;
  margin-bottom: 0.3rem;
}

h6, .remark-slide-content h6 {
  font-size: 1.125rem;
  margin-top: 0.5rem;
  margin-bottom: 0.3rem;
}

/* code font family */
.remark-code, .remark-inline-code {
  font-family: var(--font-code);
}

/* code font size */
.remark-code {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  line-height: 110%;
}

/* code inline */
.remark-inline-code {
  background: var(--color-code-bg);
  border: 1px solid var(--color-border);
  border-radius: 3px;
  margin-right: 2px;
  padding: 2px 3px 1px;
  color: var(--color-code-inline);
  font-size: 90%;
}

/* new font size classes */
.largest { font-size: 2.488rem !important; }
.larger { font-size: 2.074rem !important; }
.large { font-size: 1.44rem; !important}
.small { font-size: 0.833rem !important; }
.smaller { font-size: 0.694rem !important; }
.smallest{ font-size: 0.579rem !important; }

.highlight {color: var(--color-primary);}

.altcol {color: #a8b0bb;}

.cite {
  display: inline;
  font-size: 0.7rem;
  font-weight: 600;
  padding: 1px 4px;
  background-color: #b3cde3;
  color: white;
  border-radius: 4px;
  text-align: center;
  vertical-align: middle;
  transition-duration: 0.3s;
}

.cite a, .cite a:hover {
  color: white;
}

.cite:before {
  content: '\f02e';
  font-family: "Font Awesome 5 Free";
  margin-right: 4px;
  font-size: 0.5rem;
  font-weight: 900;
}

.cite:hover {
  opacity: 0.8;
  text-align: center;
  vertical-align: middle;
  transition-duration: 0.3s;
}

.tool {
  display: inline;
  font-size: 0.7rem;
  font-weight: 600;
  padding: 1px 4px;
  background-color: #decbe4;
  color: white;
  border-radius: 4px;
  text-align: center;
  vertical-align: middle;
  transition-duration: 0.3s;
}

.tool a, .tool a:hover {
  color: white;
}

.tool:before {
  content: '\f1b2';
  font-family: "Font Awesome 5 Free";
  margin-right: 4px;
  font-size: 0.5rem;
  font-weight: 900;
}

.tool:hover {
  opacity: 0.8;
  text-align: center;
  vertical-align: middle;
  transition-duration: 0.3s;
}

.references li, .references p {
  font-size: 60%;
}

/* spaced para style */
.spaced {
    line-height: 150%;
}

/* text on end slide */
.end-text {
  opacity: 0.6;
  position: fixed;
  bottom: 2rem;
  line-height: 1rem;
}

/* blockquote */
blockquote {
  border-left: 5px solid var(--color-primary);
  display: inline-block;
  background: var(--color-code-bg);
  padding: 0.01rem;
  padding-left: 0.6rem;
  padding-right: 0.7rem;
  border-radius: 4px 4px 4px 4px;
  margin: 0;
}

/* links */
a {
  color: var(--color-primary);
  text-decoration: none;
}

a:hover {
  color: var(--color-primary);
  opacity: 0.6;
  text-decoration: underline;
}

.hljs-github .hljs-string, .hljs-github .hljs-doctag {
    color: var(--color-code-inline);
}

/* keyboard keys display */
.kbd {
  background-color: var(--color-text);
  color: white;
  padding: 2px 5px;
  border-radius: 4px;
  font-size: 75%;
  font-weight: 600;
  letter-spacing: 0.04rem;
  margin: 0em 0.05rem;
  font-family: var(--font-code);
  text-align: center;
}

/* MARGINS ------------------------------------------------------------------ */

/* slide margin */
.remark-slide-content {
  padding-top: 1.8rem;
  padding-left: 2.5rem;
  padding-right: 2.5rem;
  padding-bottom: 2rem;
}

/* list margin */
ul {
  margin-top: 0.8rem;
  margin-bottom: 0.8rem;
}

/* pre margin */
pre {
  margin-top: 0.8rem;
  margin-bottom: 0.8rem;
}

/* p margin */
p {
  margin-top: 0.8rem;
  margin-bottom: 0.8rem;
}

/* COVER SLIDES ------------------------------------------------------------- */

/* title slide image */
.remark-slide .title-slide {
  background-image: url(cover.png);
  background-size: cover;
  text-align: left;
  vertical-align: bottom;
}

.title-slide a {
  color: #808080;
}

/* end slide image */
.remark-slide .end-slide {
  background-image: url(end.png);
  background-size: cover;
  text-align: left;
  padding-bottom: 2rem;
  line-height: 12px;
  vertical-align: middle;
}

.end-slide a {
  color: #808080;
}

/* logo */
.title-slide.remark-slide-content:before{
  position: absolute;
  content:url(logo.svg);
  width:80px;
  margin-top: 2.5rem;
  left: 2.5rem;
  top: 0;
}

.end-slide.remark-slide-content:before{
  content: "";
}

/* title slide image */
.title-slide h1 {
  text-align: left;
  font-weight: 600;
  padding-bottom: 0;
  margin-bottom: 0;
  color: var(--color-primary);
  font-size: 2rem;
}

.title-slide h2 {
  text-align: left;
  font-weight: 600;
  color: #808080;
  margin-bottom: 0.1rem;
  margin-top: 0.1rem;
  letter-spacing: 2px;
}

.title-slide h3 {
  text-align: left;
  font-weight: 500;
  color: #808080;
  margin-bottom: 0;
  margin-top: 0.1rem;
}

/* hide slide number on cover slide */
.title-slide .remark-slide-number {
  display: none;
}

/* hide slide number on end slide */
.end-slide .remark-slide-number {
  display: none;
}

/* reduce size of slide number */
.remark-slide-number {
  font-size: 50%;
}

/* IMAGES ------------------------------------------------------------------- */

/* set images to 100% width */
img, video, iframe {
  max-width: 99%;
  max-height: 99%;
  /* margin: 8px; */
}

/* image styling */
.round-border {
  border-radius: 3px;
}

.drop-shadow {
  -webkit-box-shadow: 1px 1px 5px grey;
  -moz-box-shadow: 1px 1px 5px grey;
  box-shadow: 1px 1px 5px grey;
}

/* logo every slide top right */
.remark-slide-content:before {
  content: url(logo.svg);
  float: right;
  margin-top: 10px;
  transform: scale(0.6);
}

/* image size classes */
.size-95 {display:block; max-width: 95%;}
.size-90 {display:block; max-width: 90%;}
.size-85 {display:block; max-width: 85%;}
.size-80 {display:block; max-width: 80%;}
.size-75 {display:block; max-width: 75%;}
.size-70 {display:block; max-width: 70%;}
.size-65 {display:block; max-width: 65%;}
.size-60 {display:block; max-width: 60%;}
.size-55 {display:block; max-width: 55%;}
.size-50 {display:block; max-width: 50%;}
.size-45 {display:block; max-width: 45%;}
.size-40 {display:block; max-width: 40%;}
.size-35 {display:block; max-width: 35%;}
.size-30 {display:block; max-width: 30%;}
.size-25 {display:block; max-width: 25%;}
.size-20 {display:block; max-width: 20%;}
.size-15 {display:block; max-width: 15%;}
.size-10 {display:block; max-width: 10%;}

/* COLUMNS ------------------------------------------------------------------- */

.pull-center{
  width: 100%;
}

/* float 50%-50% width */
.pull-right-50 {
  width: 49%;
  float: right;
  margin-right: 0.5%;
  margin-left: 0.5%;
}
.pull-left-50 {
  width: 49%;
  float: left;
  margin-right: 0.5%;
  margin-left: 0.5%;
}

/* float 30% 70% width */
.pull-right-30 {
  width: 29%;
  float: right;
  margin-right: 0.5%;
  margin-left: 0.5%;
}
.pull-right-70 {
  width: 69%;
  float: right;
  margin-right: 0.5%;
  margin-left: 0.5%;
}
.pull-left-30 {
  width: 29%;
  float: left;
  margin-right: 0.5%;
  margin-left: 0.5%;
}
.pull-left-70 {
  width: 69%;
  float: left;
  margin-right: 0.5%;
  margin-left: 0.5%;
}

/* float 40% 60% width */
.pull-right-40 {
  width: 39%;
  float: right;
  margin-right: 0.5%;
  margin-left: 0.5%;
}
.pull-right-60 {
  width: 59%;
  float: right;
  margin-right: 0.5%;
  margin-left: 0.5%;
}
.pull-left-40 {
  width: 39%;
  float: left;
  margin-right: 0.5%;
  margin-left: 0.5%;
}
.pull-left-60 {
  width: 59%;
  float: left;
  margin-right: 0.5%;
  margin-left: 0.5%;
}

/* float 45% 55% width */
.pull-right-45 {
  width: 44%;
  float: right;
  margin-right: 0.5%;
  margin-left: 0.5%;
}
.pull-right-55 {
  width: 54%;
  float: right;
  margin-right: 0.5%;
  margin-left: 0.5%;
}
.pull-left-45 {
  width: 44%;
  float: left;
  margin-right: 0.5%;
  margin-left: 0.5%;
}
.pull-left-55 {
  width: 54%;
  float: left;
  margin-right: 0.5%;
  margin-left: 0.5%;
}

/* SLIDE PROGRESS BAR -------------------------------------------------------- */

/*.remark-slide-number {
  position: inherit;
}

.remark-slide-number .progress-bar-container {
  position: absolute;
  bottom: 0;
  height: 3px;
  display: block;
  left: 0;
  right: 0;
}

.remark-slide-number .progress-bar {
  height: 100%;
  background-color: var(--color-primary);
}
*/

/* TABLES ------------------------------------------------------------------- */

/* table even shading */
.pagedtable .even {
    background-color: #F2F2F2;
}

/* DT table font size */
.dataTables_wrapper{
  font-size: 0.7em;
}

/* kableExtra font size */
.table{
  font-size: 0.8em;
}

/* MARKDOWN TABLE STYLE ------------------------------------------------------ */

tr:nth-child(even) {background-color: #f2f2f2;}
th,td {padding: 8px; text-align: left;}

/* SPECIAL ------------------------------------------------------------------ */

/* limit vertical size of a code chunk */

.limity-100 {
  max-height: 100px;
  overflow-y: auto;
}

.limity-150 {
  max-height: 150px;
  overflow-y: auto;
}

.limity-200 {
  max-height: 200px;
  overflow-y: auto;
}

.limity-250 {
  max-height: 250px;
  overflow-y: auto;
}

.limity-300 {
  max-height: 300px;
  overflow-y: auto;
}

.limity-350 {
  max-height: 350px;
  overflow-y: auto;
}

.limity-400 {
  max-height: 400px;
  overflow-y: auto;
}

.limity-450 {
  max-height: 450px;
  overflow-y: auto;
}

.limity-500 {
  max-height: 500px;
  overflow-y: auto;
}

/* horizontal line style */

hr {
  border: 2px solid var(--color-code-bg);
}