:root {
  --bg-color: #FFF;
}

html {
	scroll-behavior: smooth;
}

body {
   background-image: url('gradient.jpg');
   background-attachment: fixed;
   background-size: contain; 
   font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
   margin: 15px;
}

.logo {
   background-image: url('logo.jpg');
   background-size: 280px 280px;
   background-position-y: -65px;
   width: 260px;
   height: 155px;
}

header {
   background: var(--bg-color);
   opacity:0.95;
   border-radius: 10px;
   padding: 5px;
   border-bottom: 1px solid #888;
   z-index: 1000;
   width: calc(100% - 204px);
   position: relative;
}

header .menu {
   background: var(--bg-color);
   border-radius: 10px;
   position: fixed;
   padding: 14px;
   right: 20px;
   z-index: 100;
   border-bottom: 1px solid #DDD;
   max-width: 150px;
   margin-top: -5px;
}

header .menu a {
   text-decoration: none;
   display: inline-block;
   padding: 4px;
   width: 100%;
   border-bottom: 1px solid #f0f0f0;
   border-radius: 4px;
}

header .menu a:hover {
   background: #EEE;
}

a {
   color: #000;
}

.content {
   background: var(--bg-color);
   padding: 10px;
   padding-left: 20px;
   opacity: 0.95;
   border-radius: 10px;
   margin-top: 6px;
   border-bottom: 1px solid #888;
   width: calc(100% - 224px);
}

a.anchor {
   display: block;
   position: relative;
   top: -16px;
   visibility: hidden;
}

header:hover, .content:hover {
   opacity: 1.0;
}