/* reset */
  body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{font-size:100%;}

/* general */
  .laila {
    font-family: 'Laila', serif;
  }
  .ptsans {
    font-family: 'PT Sans', sans-serif;
  }
  .source {
    font-family: 'Source Sans Pro', sans-serif;
  }
  .f7 {font-size: .75rem;}
  .material-icons {vertical-align: middle;}
  a, a:link {text-decoration: none; color: inherit;}
  .inline-link, .inline-link:link {color: navy; text-decoration: underline;}
  .inline-link:hover {background: red; color: white; text-decoration: none; padding: .125rem; margin: -.125rem;}
  .inline-link:active {background: black;}

/* structure */
  #wrap {margin: 0 auto;
    width: 100%; max-width: 800px; margin-bottom: 2rem;}
  .contact, .about {font-size: .75rem; line-height: 1rem;}
  nav {font-size: 0; width: 100%;}
  nav .service-link {
    width: 50%;
    display: inline-block;
  }
  nav .service-link a {
    /* margin: 1rem;  */
    padding: .5rem .5rem .75rem .5rem;
    display: block;
    background: yellow url(dark-paths.png);
    color: white;
    text-decoration: none;
    transition: border-radius .1s;
    border-radius: .5rem;
  }
  nav .service-link h3 {
    font-size: 1rem;
    line-height: 2rem;
    height: 2rem;
    text-align: center;
    margin-bottom: .25rem;
  }
  nav .service-link aside {font-size: .75rem; margin: 0 .5rem;}

  nav .service-link a:hover {
    border-radius: 0rem;
    /* color: #bbf7ff; */
    background: red;
  }
  nav .service-link a:active {background: black;}
  /* nav ul { padding-left: 20px; list-style: disc; list-style-type: disc;} */
  /* nav li {display: inline-block;} */
  nav li::before {content: "\2022    "}

  #banner {
    width: 100%;
    height: 25vh;
    background: url(banner-3.jpg) top/100% no-repeat;
    /* color: white; */
    position: relative;
  }
  #banner h1 {
    /* text-shadow: 0 0 2px white, 0 0 2px white; */
    position: absolute; bottom: 0; left: 0; right: 0;
    font-size: 1.75rem;
    background: linear-gradient(90deg, #ee1111, #ee2222 40%, rgba(255,255,255,0));
    padding: .5rem .75rem;
    color: white;
    /* color: #bbf7ff; */
    /* color: navy; */
  }

  .secondary-nav a {
    display: inline-block;
    padding: .25rem 1rem; margin: .5rem 1rem;
    background: yellow url(dark-paths.png);
    color: white;
    text-decoration: none;
    border-radius: .5rem;
    transition: border-radius .1s;
  }
  .secondary-nav a:hover {
    background: red;
    border-radius: 0;
  }
  .secondary-nav a:active {background: black;}

.home-button {
background: yellow url(dark-paths.png);
color: white;
border-radius: 0 0 .5rem 0;
transition: border-radius .1s;

}
.home-button:hover {
  background: red;
  border-radius: 0 0 0 0;
}
.home-button:active {
  background: black;
}

.caption {
  color: #666;
  margin: .25rem;
  font-style: italic;
  font-size: .75rem;
}
.caption.credit {font-size: .5rem;}
.nomobile {display: none;}

/* responsiveness */
  @media screen and (min-width: 900px) {
    .nomobile {display: block;}
    .caption {
      font-size: .875rem;
    }
    .caption.credit {font-size: .625rem;}
    #banner {
      height: 35vh;
    }
    #banner h1 {font-size: 2.5rem;}
    .contact, .about {font-size: 1rem; line-height: 150%; margin: 1rem 2rem;}
    h2 {font-size: 1.5rem !important;}
    nav .service-link h3 {font-size: 1.25rem;}
    nav .service-link aside {font-size: 1rem; line-height: 1.25rem; margin: .5rem 1rem;}
    nav .service-link {padding: .25rem .5rem;}
  }