body {
  min-height: 100vh;
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
}
:root {
  --hue: 214;
  --template-bg-light: #f0f4fb;
  --template-text-dark: #495057;
  --template-text-light: #ffffff;
  --template-link-color: var(--link-color);
  --template-special-color: #001B4C;
  background: #f8f8f8;
}
/***** Global Slide *****/
.slide-right, .slide-left {
  width: 100%;
}

/***** Slide Right *****/
.slide-right {
  animation: 3s slide-right;
}
@keyframes slide-right {
  from {
    margin-left: -100%;
  }
  to {
    margin-left: 0%;
  }
}

/***** Slide Left *****/
.slide-left {
  animation: 3s slide-left;
}
@keyframes slide-left {
  from {
    margin-left: 100%;
  }
  to {
    margin-left: 0%;
  }
}
/***** FadeIn Underline *****/
.line {
  border-bottom: 3px solid red;
  width: 200px;
  margin: auto;
}
.fade-in {
  animation: fadeIn ease 3s;
}
@keyframes fadeIn{
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}
.container-banner {
  grid-area: banner;
    grid-column-start: banner;
    grid-column-end: banner;
  box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.18), 0px 4px 15px 0px rgba(0, 0, 0, 0.15);
}
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
.container-header .mod-menu > li > a, .container-header .mod-menu > li > span {
  color: #58585a;
  text-decoration: none;
  position: relative;
  font-family: 'Lora', sans-serif;
  text-transform: uppercase;
}
.container-header {
  z-index: 10;
  background-color: #fff;
  background-image: none;
  position: relative;
  box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.18), 0px 4px 15px 0px rgba(0, 0, 0, 0.15);
}

.metismenu.mod-menu .metismenu-item {
  font-size: 16px;
  line-height: 1.5;
}
.metismenu.mod-menu .mm-toggler {
  color: #444;
  user-select: none;
  box-shadow: none;
  background: 0 0;
  border: none;
  align-items: center;
  height: 100%;
  padding: 0;
  display: flex;
  position: relative;
}
h1 {
  font-size: 20pt;
  color: #993366;
}
@import url('https://fonts.googleapis.com/css2?family=Slabo+13px&display=swap');

h1,h2,h3,h4,h5 {font-family: 'Slabo', sans-serif;font-weight: 400;}
a:not([class]) {
  text-decoration: none;
}
a {
  color: #9c27b0;
}
.container-header .navbar-toggler {
  color: #444;
  cursor: pointer;
  border: 1px solid #fff;
}