/*
Theme Name: Loftet Theme
Author: Loftet
Version: 1.1
Description: Sticky left menu + top centered logo, no plugins.
*/

:root{
  --loftet-gold:#F0BF1A;
  --loftet-red:#7c2121;
}

body{
  margin:0;
  color:var(--loftet-gold);
  font-family: Arial, Helvetica, sans-serif;
  background: var(--loftet-red) url('./images/blomst.jpg') repeat;
}

a{ color:var(--loftet-gold); text-decoration:none; }
a:hover{ color:#000; }

h1,h2,h3{ font-family:"Times New Roman", Times, serif; }

.wrap{ display:flex; min-height:100vh; }

#left-nav{
  position:fixed; top:0; left:0;
  width:240px; height:100vh;
  overflow-y:auto;
  padding:14px 12px;
  background: url('./images/akantusranke.gif') repeat;
  z-index:1000;
}

#left-nav ul{ list-style:none; padding:0; margin:0; }
#left-nav li{ margin:10px 0; }

#content{
  margin-left:240px;
  width:100%;
  padding:18px 18px 40px;
}

#site-logo{ text-align:center; padding:18px 0 8px; }
#site-logo img{ max-width:520px; width:90%; height:auto; }

.breadcrumbs{ font-size:13px; margin: 6px 0 18px; opacity:.95; }

.grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:18px;
  max-width:980px;
  margin:0 auto;
}

.card{
  border: 1px solid rgba(240,191,26,.35);
  padding:12px;
  background: rgba(0,0,0,.08);
}

.imgbox{
  width:100%;
  aspect-ratio: 4 / 3;
  border: 2px solid rgba(255,255,255,.35);
  background: rgba(200,200,200,.2);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
}

.single-top{ max-width:980px; margin:0 auto; }

@media (max-width: 900px){
  #left-nav{ position:relative; width:100%; height:auto; }
  #content{ margin-left:0; }
  .wrap{ display:block; }
  .grid{ grid-template-columns: 1fr; }
}
