body { 
  font-family: 'Open Sans', sans-serif; 
 
  font-size: 18px;  
}
h1, h2, h3 {
  font-family: 'Source Serif Pro', serif; 
}

#wrapper {
   background-color: rgba(41,99,0,0.4);
}

#head-spacer {
  height: 10px;
}

#foot-spacer {
  height: 20px;
}

#head-ad {
  background: #fff;
  margin: 10px auto;
  padding: 10px;
  max-width: 1100px;
  border-radius: 7px;
  box-shadow: 0 2px 10px rgba(41,99,0,0.1);
  
  min-width: 730px;
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;


}

#container { 
  background: #fff;
  margin: 0 auto; 
  max-width: 1100px;

  border-radius: 7px;
  box-shadow: 0 2px 10px rgba(41,99,0,0.1);
}

#header a, #footer a { 
  color: #1f1f9a; 
}

#header { 
  border-radius: 7px 7px 0 0; 
  padding: 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; 
  -webkit-box-orient: vertical; 
  -webkit-box-direction: normal; 
      -ms-flex-direction: column; 
          flex-direction: column;
}

.sm-nav-el {
  margin: 5px 10px 5px 10px;
}

#menu-icon-wrapper {
  display: none;
  width: 100px;
  height: auto;
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  padding: 5px 10px 5px 5px;
}

#menu-img {
  width: 100%;
  height: auto;
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
}

#logo-container {
  background: #fff;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}



#logo-img {
  width: 100%;
  height: auto;
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
}
#main-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: rgb(31,31,154);
}
.nav-item {
  padding: 2px 10px;
  font-size: 1.3em;
}

#container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

#mid-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

#content { 
  /*border: 2px dotted #999900;*/
  padding: 55px; 
  background: #fff; 
  font-size: 1.1em;
  line-height: 165%;	
  -webkit-box-flex: 2; 
      -ms-flex-positive: 2; 
          flex-grow: 2;
  
  
}
#content h1 { margin-top: 0; font-size: 35px; font-weight: bold; }
#content a { color: #1f1f9a; text-decoration: none; }
#content a:hover { text-decoration: underline; }

#sidebar {
  width: 195px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;

  border: 1px solid rgba(41,99,0,0.3);
  padding: 5px;
  border-radius: 6px;
  margin: 10px ;
  box-shadow: 0 2px 2px rgba(41,99,0,0.1);
}

#search-div {
  min-width: 180px;
  padding: 5px;
}

#side-ad {
  width: 185px;
  height: auto;
  -ms-flex-item-align: center; 
      -ms-grid-row-align: center; 
      align-self: center;
}

.side-element {
  margin: 5px 2px 5px 0;
}

#about-text {
  text-align: center;
  background: rgba(41,99,0,0.1);
  margin: 5px;
}


#footer { 
  border-radius: 0 0 7px 7px; 
  padding: 15px; 

  text-align: center; 
  color: #666;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.footer-el {
  padding: 15px;
}

/* list item formatting */
.entry-list-item {
  padding: 10px;
  border: 1px solid rgba(41,99,0,0.3);
  border-radius: 6px;
  margin: 2px 2px 10px 2px;
  box-shadow: 0 2px 4px rgba(41,99,0,0.3);
}

/* _entry CSS */
.prev-next-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.prev-next-item {
  padding: 1px 1px 1px 5px;
}

.nxt {
  text-align: right; 
}

.sm-txt {
  font-size: 0.8em;
  color: #888;
}

.v-sm-txt {
  font-size: 0.6em;
  color: #296300;
}

@media only screen and (max-width: 775px) {
    body {
        background-color: lightblue;
    }

    #mid-wrapper {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column; 
    }
    #head-ad {
      width: 325px;
      min-width: 325px;
    }

    #sidebar {
      width: 100%;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      
    }

    #ad-side {
      max-height: 285px;
      max-width: 340px;
    }

}

@media only screen and (max-width: 500px) {
    body {
        background-color: LemonChiffon;
    }

    #main-nav {
      display: none;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -ms-flex-pack: distribute;
          justify-content: space-around;
    }

    .nav-item {
      border: 1px solid #0000d6;
      border-radius: 6px;
      margin: 5px;
    }
  
    #sidebar {
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;     
    }

    #menu-icon-wrapper {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }
    
    #ad-side {
      max-height: 285px;
      max-width: 340px;
    }

}

