/* LAST UPDATE: 07/02/24 */

a:link, a:visited {
  color: currentcolor;
  text-decoration: none;
  }
a:hover {
  color: #b3b3b3;
}


*{
    padding:0px;
    margin:0px;
    border:solid black 0px;
    box-sizing:border-box;
    position: relative;
    height:auto;
    font-family: scandia-web, Questrial, sans-serif;
}

body, h2, h4, h5, h6 {
  line-height: 1.3em;
  margin: 0px;
  padding: 0px;
  margin-block-start: 0em;
  margin-block-end: 0em;

}


body, h3, h4 {
}



body, h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
}

body {
  font-size: 14px; /* was 12 */
}


h1 {
  line-height: 19px;
  letter-spacing: 3px;
}

h2 {
text-decoration: none !important;
}

h1, h2, h4 {
  font-size: 18px;  /* was 16px */

}


h3 {
  font-size: 31px;
  letter-spacing: 0px;
  line-height: 90%;
}

h5 {
  font-size: 12px;  /* was 8px */
}

h6 {
  font-size: 18px;  /* was 32 */
}

.home{
  padding-top: 40vh;}

.site-header {z-index:10;}

.project-header {z-index:9;}

.main{z-index: 5;}

.behind {z-index:3}

.footer{
  padding-top: 90px;
  z-index: 4}

.footer, .home {
  padding-bottom: 90px;
  padding-left:20px;
  padding-right: 20px;
  font-size: 10px;  /* was 8 */
  line-height: 12px;  /* was 10 */
  width:100%;
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
  align-items:center;
  gap:10px 40px;}

.container /*.caption-title .caption-contents*/ {
  width:100%;
  height: auto;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  gap:10px;
  }

photo img, .container img {
  width:100%;
  height:auto;
  min-width:100%;
  object-fit: contain;

}

.background-white{background-color: #eeedec;}

.background-black{background-color: #121212;}

.background-orange{background-color: #9b7a64;}

.background-red{background-color: #963e47}

.background-grey{background-color: #989898}

.background-green{background-color: #60876d}

.background-blue{background-color: #3e5b93}

.text-white{color: #eeedec;}

.text-black{color: #121212;}

.width-full{width: 100vw;}

.height-full {min-height: 100vh !important;}

.padding-offset {padding:-20px;}

.side-margin {margin-left: 20px;
              margin-right: 20px;}

.container-width, .narrow, .wide, .half-photo, .photo-left, .photo-right, {width: 100%;}


.default-padding{padding: 10px;}

.auto-height{height:auto}

.spacer-sm, .spacer-md, .spacer-lg {display: flex; height:30px;}


.photo{z-index: 10; margin-top: 10px; margin-bottom: 10px;}

.right, .left {padding-top:20px; /* was 5 */
                padding-bottom: 20px; /* was 5 */
                padding-right:0px;
                padding-left: 0px;}


.project-title{order:1;
                flex-basis: 100%;}



.project-intro{order:2;
                padding-bottom: 120px;}

.project-intro, .project-title{
              padding-top: 15px; /*this is new*/}

.padding-offset{margin-left: -10px;}

.previous {text-align: left;}

.next {text-align: right;}

.half{width:calc(50% - 10px);}

.top-border, .bottom-border{border-color: #121212;
              border-style: solid;}

.top-border {border-top-width: 1px;}

.bottom-border {border-bottom-width: 1px;}


.photo-left{order:1}

.photo-middle{order:2}

.photo-right{order:3}

.name{
  order:1 !important;
  flex-basis: 100%;
}

.about{
  order:2 !important;
  flex-basis:auto;
}

.contact{
  order:3 !important;
  flex-basis:auto;
}

.copyright{
  font-size: 8px;  /* 6px */
  padding-top: 1px;
  padding-bottom: 20px;
  padding-left:20px;
  padding-right: 20px;
  line-height: 12px;
  z-index: 4;
  width:100%;
  color: #b3b3b3;
}

.project-nav{padding-top:20px;padding-bottom: 10px;}

.caption-title, .caption-contents {
  flex-basis: calc(50% - 10px);
    text-align: left;
    align-content: flex-start;
    }



.caption-contents {
    font-style: italic;
    opacity: 0.6;
    margin-bottom: 10px;
    }

/*.llll {flex-basis: 100% !important;}*/

.project-arrow{
  font-size: 10px;
  text-align: center;
  line-height: 0.9em;
  display: block;
  height: auto;
  position: fixed; /*was absolute*/
  bottom: 0;
  left: 0;
}

.tab {
  font-size: 12px;
}

.error {
  width: 100vw;
  height:100vh;
  min-width: 100vw;
  min-height: 100vh;
  max-width: 100vw;
  max-height: 100vh;
  align-items: flex-start !important;
}

.underline {
  text-decoration: underline !important;
  text-underline-position: under;
}

a img.hover {
    display: none;
}
a img.default {
    display: inherit;
}
a:hover img.hover {
    display: inherit;
    opacity: 0.9;
}
a:hover img.default {
    display: none;
}

@media screen and (min-width: 600px){

      .default-padding{padding: 20px;}

      .photo{ margin-top: 20px; margin-bottom: 20px;}

      .footer, .home {padding-left: 20px; padding-right: 20px;}

      .container {gap:20px;}

      .caption-contents {
          margin-bottom: 20px;
      }

      .caption-title {padding-left: 20px;}

      .padding-offset{margin-left: -20px;}

      .project-nav{padding-bottom: 5px;}

      .left, .right {padding-right:15%;}


      body{font-size: 22px;}

      h1 {line-height: 31px;}

      h1, h2, h4 {font-size: 28px;}

      .footer, .home, .project-arrow {
        font-size: 16px;}

      .arrow {font-size: 20px;
        padding-left: 40px;}

      .project-arrow {text-align: left;}


      .footer, .home {line-height: 20px;}

      .copyright{font-size: 10px;}

      h3 {font-size: 51px;}

      h5 {font-size: 18px;}

      h6 {font-size: 32px;}

    }



@media screen and (min-width: 768px){



      .half, .photo-left, .photo-right, .caption-title, .caption-contents {width:calc(50% - 10px);}

      .narrow {flex-basis: calc(31% - 13px);}

      .wide {flex-basis: calc(69% - 18px);}


      .project-header {min-height:100vh !important;}

      .project-title, .project-intro, .right, .left {padding-top:90px;}

      .left, .right {padding-bottom: 90px;
      margin:0px;}

      .right, .left {padding-top:50px;}

      .left {padding-left:40px;}

       .right {padding-right:40px;}

      .footer, .home {flex-flow: row;}

      .name {flex-basis: calc(50% - 20px)}

      .copyright, .project-arrow {padding-left: calc(50% + 20px);}

      .spacer-sm {display: flex; height:30px;}

      .spacer-md {display:flex;height:90px;}

      .spacer-lg {height:120px;}



    }


  @media screen and (min-width: 992px){


      .default-padding {padding: 30px;}

      .photo {margin-top: 30px; margin-bottom: 30px;}

      .padding-offset{margin-left: -30px;}

      .footer, .home {padding-left: 30px; padding-right: 30px;}

   .half, .photo-left, .photo-right, .caption-title, .caption-contents {width:calc(50% - 16px);}

      .narrow {width:calc(31% - 25px);}

      .wide {width:calc(69% - 26px);}

      .caption-contents {margin-bottom: 30px;}

      .caption-title {padding-left: 30px;}

      .left, .right {padding-left: 120px; padding-right: 120px;}

      .project-nav{padding-top:30px;}

            .copyright, .project-arrow {padding-left: calc(50% + 20px);}

    }