site/src/styles/main.css

main { margin-top: 75px; }

/* ---- projects navbar ---------------------- */
ul.nav.nav-tabs { margin-top: 75px; }

a.nav-link#project:hover { 
  padding-bottom: 7px;
  color: rgb(0, 0, 0); 
  text-decoration: none; 
  background-color: rgb(228, 228, 228); }
ul.nav-tabs a.nav-link.active { color: black; background-color: rgb(190, 190, 190); }
ul.nav-tabs a.nav-link, ul.nav-tabs a.nav-link.active { 
  border-radius: 0; 
  padding: 7px 22px 7px 22px;
  margin-top: 5px; }
/* ------------------------------------------- */

/* ------- news & main content ----------------------------- */
div.container main a { color: rgb(0, 86, 179); }
div.container main a:hover { color: rgb(1, 66, 136); text-decoration: underline;}

.jumbotron { 
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  padding: 60px 40px 30px 40px; 
  margin-bottom: 35px; 
  background-color: rgb(247,247,247);
  border: 1.5px solid rgb(219, 219, 219); }

button#jt:hover { background-color: rgb(9, 110, 88); }
button#jt a { color: white; }
button#jt a:hover { text-decoration: none; }
button#jt { 
  font-size: 25px; 
  background-color: rgb(14, 156, 125);
  border: rgb(0,99,99); }

button#more a { font-size: 20px; color: white; }
button#more a:hover { text-decoration: none; }
button#more:hover { background-color: rgb(34, 76, 104); }
button#more { 
  color: white;
  background-color: rgb(51, 113, 155);
  border: rgb(36,88,122); }

h2.title { 
  background-color: rgb(247, 247, 247);
  padding: 15px;
  border: 2px solid #E8E4E4; }

span#date {
  color: white;
  font-size: 20px;
  opacity: 0,7;
  background-color: rgb(209, 121, 121);
  padding: 5px;
  border: 1px solid #8f4f4f;
  position: absolute;
  top: 25px;
  right: 26px; }

p { 
  font-size: 20px; 
  margin-top: 15px; 
  margin-bottom: 20px; 
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
  
hr { 
  border-top: 1px solid rgb(220, 222, 224); 
  margin: 10px 0px 20px 0px; }

img.center-block { margin-bottom: 0; }
li { margin-bottom: 0; font-size: 20px; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
ul { margin: 0 0 20px 0; padding-left: 40px; }
p#button { margin-bottom: 0px; }
p.lead { margin-bottom: 20px; font-size: 25px; }
.card-body{ padding: 25px; }
.card-header { padding: 15px 25px 15px 25px; }
.card-title { margin-bottom: 15px; }

span.badge.badge-info { 
  margin-right: 15px; 
  background-color: rgb(20,142,161); }

span.katex-html{color: rgb(0, 0, 0); font-weight: 500;}  
/* -------------------------------------------------------- */

/* --- media --------------------------------------------- */
@media (max-width: 769px) { 
  span#date { 
    top: 0;
    right: 0; }
  button#togglerButton.navbar-toggler.collapsed {
    margin-top: 10px;
    margin-left: 10px; }
  a.nav-link#project {
    margin-bottom: 10px;
    margin-right: 0;
    border: 1px solid rgb(202, 202, 202); }
  a.nav-link#project.active { color: black; }
 }
/* ------------------------------------------------------- */