/* Simple-website-template: local copy
   Modified so background uses background.svg placed in same folder */

/* Typography & Text styles */
html { font-size: 62.5%; }
body {
  font-size: 1.5em;
  line-height: 1.6;
  font-weight: 400;
  font-family: "Roboto", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #FFFFFF;
}

a { font-weight: normal; text-decoration: none; color:#EF6D3D; }

h1 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; }
h2 { font-size: 3.0rem; line-height: 1.3;  letter-spacing: -.1rem; }

html, #container, .inner { background-color:transparent; }
html {
  background: url('background.jpg') center center no-repeat fixed;
  background-size: cover;
}
body { max-width:800px; margin:25px auto; }
header, #content, footer { background: rgba(0,0,0,.8); padding:25px; color:#FFFFFF; }

ul.main-menu { margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: left; list-style: none; }
ul.main-menu li a { margin-right:20px; font-size:2.0rem; border-bottom: solid transparent 3px; color:#cfd2da; }
ul.main-menu li a:hover { color:#FFFFFF; }
ul.main-menu li a.active { color:#FFFFFF; border-bottom-color:#EF6D3D; }

.hide { display:none; }
.show { display:block; }

/* Small adjustments for embedded original content */
.projects { list-style:none; padding:0; margin-top:1rem; color:#111; }
.projects li { background: white; padding:1rem; margin-bottom:0.75rem; border-radius:8px; box-shadow:0 1px 2px rgba(0,0,0,0.04); color:#111; }
.proj-meta { color:#555; font-size:0.9rem }
.profile { width:120px; height:120px; border-radius:999px; object-fit:cover; border:2px solid #ddd }