body  {
 background-color: #63823F; /*hedge1*/
 color: #685206;
 /* font-size: 1.7vh; */
 /* -webkit-text-size-adjust: 100%; */
 /* -webkit-text-size-adjust: none; */
}


#wrapper {
 background-color: #FFF;
 border-left:3px double #000;
 border-right:3px double #000;
 border-top:3px double #000;
 border-bottom:3px double #000;
 /* height:250vh;*/
 height: 100%;
 width: 95%;
 margin: 0px auto;
 overflow: hidden;
 font-family: 'Helvetica Neue', sans-serif;
 font-size: 16px;
 }


#headtxt {
 background-image: url("pics/banner2.png");
 /*opacity: 0.5;*/
 background-size: 1600px 200px;
 background-repeat: no-repeat;
 background-color: #FFF;
 color: #000;
 padding: 40px;
 text-shadow:
    -1px -1px 0 #e6f505,
     1px -1px 0 #e6f505,
    -1px  1px 0 #e6f505,
     1px  1px 0 #e6f505;
}

.coming_soon {
   color: #d9ad0d;
   font-style: italic ;
}

h1, h2, h3 {
/* color: #AF7C5F;*/
 color: #b70303;
 text-shadow: 0.1em 0.1em 0.3em #A06B20;
 font-family: Bradley Hand, cursive ;  
}

h2 {
  font-size: 2.5vh;
 text-shadow: 0.1em 0.1em 0.2em #A06B20;
}

h3 {
  font-size: 3vh;
}

h4 {
 font-size: 2vh;
 color: #b70303;
 text-shadow: 0.1em 0.1em 0.3em #A06B20;
 font-family: Bradley Hand, cursive ;  
 padding-left: 1px;
}    

 p { color: #685206; font-family: 'Helvetica Neue', sans-serif; font-size: 14px; line-height: 24px; margin: 0 0 24px; text-align: justify; text-justify: inter-word; } 
/* p {color: #685206;font-family: 'Helvetica Neue', sans-serif;text-align: justify; font-size: 16px; }
*/

#photo_area {
 background-color: #FFF;
 border:5px double #D5B890;
 padding: 10px;
}

#about {
 background-color: #FFF;
 padding-left: 10px;
 padding-right: 10px;
 padding: 10px;
 margin-left: 3em;
 margin-right: 3em;
}

.distance {
  font-weight:bold;
  color: #b70303;
}

.twocols {
  background-color: #FFF;
  margin-left: 5em;
  height:480px;
 border: 5px solid #F00;
}

.rcol {
  padding-right: 1em;
  float: left ;
  width: 35% ;
}

.lcol {
  text-align: justify;
  padding-left: 4vh;
  padding-right: 0em;
  float: left ;
  width: 55% ;
}


.pics {
  width: 800px;
  display: block;
  margin: 0 auto;  
}


.center {
  margin: auto;
  /*position: absolute;*/
  left: 0;
  top: 50%;
  width: 100%;
  text-align: center;
  font-size: 18px;
  }



.sand1 {
	background-color: #F2AB8B;
}
.sand2 {
	background-color: #EA9E7C;
}
.brick {
	background-color: #D5B890;
}
.door {
	background-color: #FF3105;
}
.hedge1 {
	background-color: #63823F;
}
.hedge2 {
	background-color: #CBDA74;
}
.sky {
	background-color: #DBE5FF;
}
.cloud {
	background-color: #EFF1FF;
}
.spare {
	background-color: #FFF;
}


/*change the layout of the navigation bar for all the screens 
that have a width less or equal than 500px*/

@media only screen and (max-width: 500px) {
  /*shows elements in a column*/
  ul{
    flex-direction: column;
  }
  
  /* deletes margin on top or bottom of the a tag*/
li{
    margin: 0;
  }
 /* makes sure that the a tag will take the entire screen*/
a{
    display: block;
}

 }
/*end change the layout 500px*/