styles.scss

@import url("https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap");
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro&display=swap");

/*-- scss:defaults --*/
$white:    #fff !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
$gray-300: #ddd !default;
$gray-400: #ced4da !default;
$gray-500: #adb5bd !default;
$gray-600: #868e96 !default;
$gray-700: #495057 !default;
$gray-800: #343a40 !default;
$gray-900: #212529 !default;
$black:    #000 !default;


$font-family-sans-serif:  Roboto Slab, sans-serif !default;
$font-family-serif:  Source Sans Pro, serif !default;

/*-- scss:rules --*/

ul, ol {
  font-family: $font-family-serif;
}

/* Hacer que los numeros en las listas ordenadas esten en negrita */
ol > li::marker {
  font-weight: bold;
}

/*Pero si es una lista dentro de otra lista, usar texto normal*/
ol ol > li::marker {
  font-weight: normal;
}

/* Cambiar tamaño de la fuente en la leyenda */
.panel-caption, caption, .figure-caption {
    font-size: 0.9rem; /*1rem por defecto*/
}

.table-practica {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

figure {
    display: inline-block;
}
figure img {
    vertical-align: top;
}
figure figcaption {
    margin-top: 0; //Eliminar margin arriba de la leyenda
    text-align: center;  //Centrar la leyenda
}

.course-details {
    margin: 0 0 1em;
    border-bottom: 3px solid $gray-200;
    padding-bottom: 1em;
}
  
.course-details h3 {
  margin-top: 0;
}


h1, .h1, h2, .h2, h3, .h3 {
  font-weight: 400;
}


@media (min-width: 1200px) {
  h2, .h2 {
    font-size: 1.75rem;
  }
}

@media (min-width: 1200px) {
  h3, .h3 {
    font-size: 1.5rem;
  }
}


.course-title {
  font-size: 3.5rem;
  margin-top: 0;
}

.course-subtitle {
  font-family: $font-family-serif;
  font-size: 1.7rem;
}

.course-meta {
  font-family: $font-family-serif;
  font-size: 1.2rem;
  color: $gray-600;
}

.course-meta i {
  width: 1.4rem;
  text-align: center;
}

.course-details i {
  width: 1rem;
  text-align: center;
}

.course-details ul {
  list-style: none;
  text-indent: -0.7rem;
  padding-left: 1.4rem;
}

.course-details-smaller li {
  font-size: 1rem;
}

.course-details-smaller h3 {
  font-size: 1.4rem;
}

.navbar-nav .show>.nav-link, 
.navbar-nav .active>.nav-link, 
.navbar-nav .nav-link.active,
.navbar-brand:hover, 
.navbar-brand:focus {
  color: #ffd186;
}

.navbar-nav .nav-link:hover, 
.navbar-nav .nav-link:focus {
  color: #ffdfba;
}


.navbar #quarto-search.type-overlay .aa-Autocomplete svg.aa-SubmitIcon:hover,
.navbar #quarto-search.type-overlay .aa-Autocomplete svg.aa-SubmitIcon:focus {
  color: #ffdfba;
}

.navbar-title {
  font-family: $font-family-sans-serif;
  font-size: 1.5rem;
  font-weight: 500;
}

.nav-item {
  font-family: $font-family-sans-serif;
  font-size: 1.2rem;
  font-weight: 200;
}

nav .nav-link i {
  font-size: 1.3rem;
}

.five-columns {
  --bs-columns: 5;
}

.inactive {
  color: $gray-400;
}

div.sidebar-item-container code {
  color: #adcff4
}

.navbar {
  background-color: #f07039;
  color: #fffefd;
}

.nav-footer {
  background-color: #343a40;
  color: #cacccd;
}

.nav-footer a {
  color: #cacccd;
}

#quarto-sidebar {
  background-color: #343a40;
  color: #cacccd;
}

div.sidebar-item-container {
  color: #cacccd;
}

div.sidebar-item-container .active, div.sidebar-item-container .show>.nav-link, div.sidebar-item-container .sidebar-link>code {
  color: #b8cbf6;
}

div.sidebar-item-container:hover, div.sidebar-item-container:focus {
  color: rgba(184,203,246,.8);
}

.quarto-sidebar-header {
  color: #cacccd;
}

/* Agrandar el texto en el sidebar de la derecha con otros formatos */
.sidebar .quarto-alternate-formats>h2, .sidebar .quarto-alternate-formats>ul, .quarto-alternate-formats i.bi {
  font-size: 1rem;
}