/* text */


table {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

html{
background-color: rgb(142 200 183);
}


body {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}


.indexcolumncenter {
text-align: center;
margin: auto;
align-items: center;
  height: 100%;
  overflow: scroll;
  scroll-behavior: smooth;
  scrollbar-width: none;
}


.image {
  position: absolute;
  padding-left: 20vw;
  padding-top: -15vw;
  width: 60vw;
  height: auto;
}

.indexcolumncenter{
    font-family: arial;
background-color: rgb(142 200 183);

    }

.title {
    font-family: arial;
    font-size: 5vh;
position: fixed;
display: block;
text-align: center;
margin:auto;
background-color: rgb(142 200 183);
width: 100%;
left: 0;
top: 0;
padding-top: 5px;
width: 100%;


    }

.window {
  text-align: center;
  background-color: black;
  width:  45px;
  height: 35px;
  clear: both;
  font-size: 16px;
  color: rgb(142 200 183);
   border: 10px solid;
    border-color: rgb(142 200 183);
padding: 40px;
display: inline-grid;
}


.window1 {
  text-align: center;
  background-color: black;
  width:  45px;
  height: 35px;
  clear: both;
  font-size: 16px;
  color: black;
   border: 10px solid;
    border-color: rgb(142 200 183);
padding: 40px;

display: inline-grid;
}

.window:hover {
  color: black;
   background-color: rgb(142 200 183);
  font-style: bold;
}

.window1:hover {
  background-color: rgb(142 200 183);
   color:  rgb(142 200 183);
  font-style: bold;
}

img {
  width: 100%;
  position: block;

}



name, .name,
::proper-noun
  {hyphens: none;}




a:link {
        text-decoration: none;
        color: black;
      }
a:visited {
  color: black;
}
a:active {
  color: black;
}

.footer {
  font-family: arial;
  font-size: 16px;
width: 100%;
margin:auto;
text-align: center;
padding-top: 10px;
padding-bottom: 20px;
background-color: rgb(142 200 183);
position: fixed;
left: 0;
bottom: 0;
width: 100%;
}


    .smallparagraph{
      display: flex;
    font-family: arial;
    font-size: 15px;
    text-align: left;
  padding: 20px;
    }





@media only screen and (min-width: 501px)

{

.vertical {
  width: auto;
 height: auto;
height: 70%;

  }

  .house {
    width: auto;
   height: auto;
  height: 50%;

    }

    .postcard {
      width: auto;
     height: auto;
    width: 45%;

      }

  .window {
    background-color: black;
    width:  80px;
    height: 60px;
    clear: both;
    font-size: 16px;
    color: rgb(142 200 183);
     border: 8px solid;
      border-color: rgb(142 200 183);
  padding: 50px;
  display: inline-grid;
      margin-left: -4px;
  }


  .window1 {
    background-color: black;
    margin-left: -4px;
    width:  80px;
    height: 60px;
    clear: both;
    font-size: 16px;
    color: black;
     border: 8px solid;
      border-color: rgb(142 200 183);
  padding: 50px;

  display: inline-grid;
  }


  .indexcolumncenter {
text-align: center;
margin: auto;
align-items: center;
    height: 100%;
    overflow: scroll;
    scroll-behavior: smooth;
    scrollbar-width: none;
  }

  .footer {
    font-family: arial;
    font-size: 20px;
  width: 100%;
  margin:auto;
  text-align: center;
  padding-top: 10px;
  padding-bottom: 20px;
background-color: rgb(142 200 183);
position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  }

  .subtitle{
  font-family: arial;
  font-size: 20px;
  text-align: center;
padding: 20px;
  }

  .paragraph{
      line-height: 1.3;
    width: 45%;
  font-family: arial;
  font-size: 20px;
  text-align: left;
  margin-left: 32%;
  display: flex;
  }

  .paragraphmiddle{
    width: 34%;
    line-height: 1.3;
  font-family: arial;
  font-size: 20px;
  text-align: left;
  margin-left: 32%;
  display: flex;
  }


    .smallparagraph{
      line-height: 1.2;
      margin-left: 32%;
      display: flex;
      width: 34%;
    font-family: arial;
    font-size: 15px;
    text-align: left;
  padding: 20px;

    }

  .caption{
    line-height: 1.5;
  font-family: arial;
  font-size: 13px;
padding: 20px;
display: block;
font-style: italic;

  }

  .title {
      font-family: arial;
      font-size: 60px;
      text-align: center;
  position: fixed;
  display: block;
  text-align: center;
  margin:auto;
  background-color: rgb(142 200 183);
  width: 100%;
  left: 0;
    top: 0;
      }

      img {
        width: 50%;
        position: block;

      }
