/* Global Styling */
body {background-color: #dfdfdf; margin: 0px;}

/* ID element stylings */
#content {background-color: #dfdfdf; color: #000; margin: 0; min-width: 0; overflow: hidden; width: auto;}
#content a:link {color: red;}
#content h1 {border-bottom: 2px dotted #cccdc8; font: 22px arial; padding-bottom: 4px;}
#content p {font-family: arial;}
#content td {font-family: arial;}
#main-menu {left: 12px; position: absolute; top: 5.25em;}
#navigation {background-color: #dfdfdf; position: static; right: 16px; width: 220px;}
#navigation a:link {color: red;}
#navigation h1 {border-bottom: 2px dotted #cccdc8; font: 22px arial; padding-bottom: 4px;}
#navigation li {background-color: #dfdfdf; color: #000; font-family: arial;}
#navigation .list {background-color: #dfdfdf; color: #000; font-family: arial;}

/* Class element stylings */ 
.company-logo {border-left: 1px solid #222; height: 7em; position: absolute; right: 0px; top: 0px; width: 7em;}
.container {display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 22px; padding: 16px;}
.header { background-color: #cccdc8; border-bottom: solid 1px #222; height: 7em; margin: 0;}
.menu-item {background-color: #cccdc8; color: #000; font-family: sans-serif; padding-bottom: 6px; padding-left: 2px; padding-right: 2px;}
.menu-item:hover {color: #0000ff;}
.title {font-size: 4em; left: 12px; margin: 0; padding-top: 10px; position: absolute; top: 1px;

  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
  
}


/* Dynamic elements stylings */
@media (max-width:625px){
    #hide_title {display: none;}
}

/* Custom Fonts*/
@font-face {
  font-family: "Bebas Neue";
  src: url('../fonts/BebasNeue-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}