.h1 {font-family: "Amatic SC", Arial, Helvetica, sans-serif;
    font-size: 40px;    }
.h2 {font-family: "Amatic SC", Arial, Helvetica, sans-serif;
    font-size: 34px;}
.h3 {font-family: "Amatic SC", Arial, Helvetica, sans-serif;
    font-size: 28px;}
.h4 {font-family: "Amatic SC", Arial, Helvetica, sans-serif;
    font-size: 24px;}

.p {font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;}

.container-header {
   background-color: #e7dfd7;
  --cassiopeia-color-primary: #e7dfd7;
  --cassiopeia-color-link: #e7dfd7;
  --cassiopeia-color-hover: #e7dfd7;
  color:#e7dfd7;
  box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-webkit-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
}


.container-sidebar-left {
 background-color: #e7dfd7;
  --cassiopeia-color-primary: #e7dfd7;
  --cassiopeia-color-link: #e7dfd7;
  --cassiopeia-color-hover: #e7dfd7;
  color:#e7dfd7;
  box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-webkit-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35); 
}

.container-header .mod-menu {
  color: #778870;
   justify-content: center;
   padding: 200;
   position: center;

}

.container-header .mod-menu {
  color: #778870;
   justify-content: center;
   padding: 200;
   position: center;

}

.metismenu.mod-menu .parent > ul {
  color: #778870;}
  
.metismenu.mod-menu .mm-toggler {
    color: #778870;}
  
.metismenu.mod-menu .mm-collapsing {
    color: #778870;
}


.metismenu.mod-menu .mm-collapse {
  background: #778870;
}
.metismenu.mod-menu .mm-collapse .metismenu-item a {
  color: #e7dfd7;
}

.bottom-a.card  {
  background-color: #4b6158;
     color:#e7dfd7;
	box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-webkit-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
}
.bottom-b.card  {
 background: #4b6158;
     color:#e7dfd7;
     justify-content: center;
   padding: 50;
   position: center;
  box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-webkit-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
}
.main-top.card {
   background-color: #e7dfd7;
  	box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-webkit-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
  
}

.breadcrumbs.card
{
   background-color: #778870;
   color:#ffffff;
	box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-webkit-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
}
  
.debug.card {
    background-color: #778870;
     color:#8f9e7a;  
  justify-content: center;
   padding: 50;
   position: center;
  box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-webkit-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
  }

.footer {
    background: #4b6158;
     color:#e7dfd7;
     justify-content: center;
   padding: 50;
  position: center;
  box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-webkit-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
	-moz-box-shadow: 12px 4px 18px 0px rgba(0,0,0,0.35);
  }
.banner {
background-image: url("background.png");
}