@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;800&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');

/* General styling */
body {
    font-family: 'Montserrat', sans-serif;
}

.remark-slide-content h1,
.remark-slide-content h2,
.remark-slide-content h3,
.remark-slide-content h4
{
  font-family: 'Nunito Sans', sans-serif;
  font-weight: normal;
  margin-bottom: 0.5em;
  margin-top: 0px;
}

.remark-slide-content p {
  margin-top: 0px;
}

.remark-code {
  font-family: 'Ubuntu Mono';
  font-weight: 400;
  line-height: 1.4em;
  font-size: 0.8em;
}
.remark-inline-code {
  font-family: 'Ubuntu Mono';
  font-weight: 600;
  line-height: 1.4em;
  font-size: 1.0em;
}

.remark-slide-content {
  background-color: #FDFDFC;
  font-size: 1.3em;
  line-height: 1.5em;
}

.remark-slide-content.title h1 {
  font-size: 3em;
}

/* Other layout stuff*/
.remark-slide-content.footnote {
  position: absolute;
  bottom: 3em;
}

.remark-slide-content.title {
  background-color: #fffadd;
  color: #272323;
  line-height: 3em;
}

/* Colors */
.red { color: #fa0000; }

/* Two-column layout */
.left-column {
  color: #777;
  width: 25%;
  height: 92%;
  float: left;
}

.left-column h2 {
  font-size: 1.2em;
}
.left-column h3 {
  font-size: 0.8em;
  margin-top: 0.0em;
  margin-bottom: 0.0em;
}
.left-column h2:last-of-type,
.left-column h3:last-child {
  color: #000;
}

.right-column {
  width: 70%;
  float: right;
}

img {
  max-width: 110%;
}

.highlightText {
  color: rgb(218, 26, 26);
}

.content {
  padding-top: 3em;
}

.mermaid {
  text-align: center;
}

pre {
  margin-top: 0px;
}

@page {
  size: 1210px 681px;
  margin: 0;
}
  
@media print {
  .remark-slide-scaler {
    width: 100% !important;
    height: 100% !important;
    transform: scale(1) !important;
    top: 0 !important;
    left: 0 !important;
  }
}

.fixed-with {
  float: left;
  width: 130px;
  font-family: 'Lucida Console', Courier, monospace
}

table, td, th {
  border: 2px solid rgb(122, 122, 122);
}

td, th {
  padding: 4px;
}

table {
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 1em;
}

.smaller-text {
  font-size: 0.7em;
}


.row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
}
.column {
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  flex: 1;
}