
body {
  background-image: url("/writing/ex/adorablehomes/home.jpg") ;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center; 
  background-color: #fff;
  /**text**/
  color: #020300;
  font-family: 'Inconsolata', monospace;
  font-size: 14px;
  text-transform: lowercase;
  /**page center **/
  position: absolute;
  top:25%;
  left: 10%;
  margin: auto;

}

blockquote {
  border-left: solid #000;
  padding-left: 1em;
}


img { 
  max-width: 400px;
  top:25%;
  left: 50%;
  right: 0;
  border: solid black ;
}

a img { display:none; }
a:hover img { 
  display:block; 
  position: absolute;
  }


.body {
  max-width: 44%;
  max-height: 250px;
  overflow: scroll;
  border: solid #000;
  background-color: white;
  padding: 10px;

}

header {
  max-width: 44%;
  border: solid #000;
  background-color: white;
  margin-bottom: 10px;
  padding: 10px;
}

footer {
  max-width: 44%;
  border: solid #000;
  background-color: white;
  margin-top: 10px;
  padding: 10px;
}

header:hover  {
  animation: shake 0.5s; 
  animation-iteration-count: infinite; 
}


@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

a { color: #36311F; }
a:active { color: #36311F; }
a:hover { color: #36311F; }
      
.nav {
        margin-left: 0;
        text-align: center;
        margin-top: 0;
        margin-bottom: 10px;
        padding-top: 1em;
        padding-bottom: 1em;
        background-color: transparent;
      }

.nav li {
        display: inline-block;
        padding-right: 5px;
      }

 @media only screen and (max-width: 800px) {
        .flex {
          flex-wrap: wrap;
        }
      }
        
#navbar-contained {
        margin-bottom: 5px;
      }
      


mark a {
  color: #000 !important;
}