@charset "utf-8";
/* CSS Document */

/* ======================================================= 
 GRID CSS
 *    
 * ======================================================= */

* {
  box-sizing: border-box;
}


blockquote {
  font: 1.1em/2 'Playfair Display', serif;
  font-style: italic;
  margin: 0 0 2em 0;
}

/*.img1 {  
  background: url('../gallery-p-small/_DSC5252.jpg');
  background-size: contain;
	background-repeat: no-repeat;
	max-height: 175px;
}

.img2 {  
   could use `object-fit: cover;` on an img, but tricky
  background: url('../images/Franzi taking picture1.jpg');
  background-size: contain;
	background-repeat: no-repeat;
	max-height: 250px;
}


.img3 {  
   https://elements.envato.com/gradient-network-wave-backgrounds-L5PGKP 
  background:  url('../images/Reuben.jpg');
  background-size: contain;
	background-repeat: no-repeat;
	max-height: 300px;
	background-position: center center;
}
.img4 {  
  https://elements.envato.com/gradient-network-wave-backgrounds-L5PGKP 
  background: url('../images/Franzi with Ducks.jpg');
  background-size: contain;
	background-repeat: no-repeat;
	max-height: 400px;
	background-position: center center;
}
.img5 {  
  https://elements.envato.com/gradient-network-wave-backgrounds-L5PGKP 
  background: url('../images/reub cookin.jpg') ;
  background-size: contain;
	z-index: 1;
	background-repeat: no-repeat;
}
.img6 {  
   https://elements.envato.com/gradient-network-wave-backgrounds-L5PGKP
  background: url('../images/franzi coffee.jpg');
  background-size: contain;
	background-repeat: no-repeat;
	max-height: 400px;
	z-index: 1;
	background-position: center center;
}
.img7 {  
  https://elements.envato.com/gradient-network-wave-backgrounds-L5PGKP
  background: url('../images/reuben brushing.jpg');
  background-size: contain;
	background-repeat: no-repeat;
	
	background-position: center center;
}
.img8 {  
   https://elements.envato.com/gradient-network-wave-backgrounds-L5PGKP 
  background: url('../images/camping.jpg');
  background-size: contain;
	background-repeat: no-repeat;
	
	background-position: center center;
}
.img9 {  
   https://elements.envato.com/gradient-network-wave-backgrounds-L5PGKP 
  background: url('../images/us on canon beach.jpg');
  background-size: contain;
	background-repeat: no-repeat;
	
	background-position: center center;
}*/

.grid1 {
	  display: grid;
    grid-template-columns: 1fr 2em 1fr;
    grid-template-rows: auto;
    padding-top: 10px;
  }
.image{
	max-width: 50%;
	float: right;
	margin: 15px;
	
}

  .img1 {  
    grid-column: 1 / 4;
    grid-row: 1 / 2;
	  z-index: 1;
	  padding: 0;
	  height: auto;
	  width: auto;
	  margin: 0 auto;
	  
  }
.imgrw8{
		width: 50%;
	}
	.cta3{
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
}

	.cta-wrapper {
    grid-column: 1 / 4;
    grid-row: 3 / 4;
		text-align: center;
		padding: 7% 0 3% 0;
  }
.cta-wrapper1a {
    grid-column: 1 / 4;
    grid-row: 4 / 5;
	text-align: left;
	  padding: 5% 3%;
  }
	.cta-wrapper1b {
    grid-column: 1 / 4;
    grid-row: 4 / 5;
	text-align: left;
		position: relative;
	  padding: 5% 3%;
		height: inherit;
		display: none;
  }
	.cta-wrapper2a {
    grid-column: 1 / 4;
    grid-row: 5 / 6;
		text-align: left;
		padding: 3%;
  }
.cta-wrapper2b {
    grid-column: 1 / 4;
    grid-row: 5 / 6;
		text-align: left;
	position: relative;
		padding: 3%;
	display: none;
  }
  .cta-wrapper3 {
    grid-column: 1 / 4;
    grid-row: 6 / 7;
		text-align: left;
		padding: 15% 3%;
  }
  
.cta-wrapper4 {
    grid-column: 1 / 4;
    grid-row: 7 / 8;
	padding: 3%;
  }
	
	
	.cta-wrapper5 {
    grid-column: 1 / 4;
    grid-row: 8 / 9;
		text-align: left;
		padding: 3%;
  }
	.cta-wrapper6a {
    grid-column: 1 / 2;
    grid-row: 9 / 10;
		text-align: left;
		
		padding: 3%;
  }
	.cta-wrapper6b {
    grid-column: 3 / 4;
    grid-row: 9 / 10;
		text-align: center;
		position: relative;
		padding: 3%;
  }
	.cta-wrapper7a {
    grid-column: 1 / 2;
    grid-row: 10 / 11;
		text-align: left;
		padding: 3%;
  }
	.cta-wrapper7b {
    grid-column: 3 / 4;
    grid-row: 10 / 11;
		text-align: left;
		text-align: center;
		padding: 3%;
  }
.cta-wrapper8a {
    grid-column: 1 / 2;
    grid-row: 11 / 12;
		text-align: left;
		text-align: center;
		padding: 3%;
  }
	.cta-wrapper8b {
    grid-column: 3 / 4;
    grid-row: 11 / 12;
		text-align: left;
		padding: 10%;
  }
.cta-wrapper9{
	grid-column: 1 / 4;
    grid-row: 12 / 13;
	padding-top: 20%;
	text-align: center;
}

@media only screen and (min-width: 650px) {
	.image{
	max-width: 50%;
	}
		.cta3{
  position: static;
		transform: translate(0, 0);
		top:0;
}
	
.cta-wrapper1b {
	display: grid;
	}
	
.cta-wrapper2b {
	display: grid;
	}
}
@media only screen and (min-width: 1050px) {
	.img-d-non{
		display:none;
	}
	.max50{
	max-height: 100%;
}
	
  .grid1 {
    grid-template-columns: 2fr 3fr 2em 3fr 2fr;
    grid-auto-rows: min-content;
    padding-top: 100px;
	
  }
	.cta2{
		position: static;
		transform: translate(0, 0);
		top:0;
	}
	
	.cta3{
  position: static;
		transform: translate(0, 0);
		top:0;
}

  .img1 {  
    grid-column: 2 / 5;
    grid-row: 1 / 2;
	  z-index: 1;
	  padding: 0;
	  height: auto;
	  width: 100%;
	  
  }

	.cta-wrapper {
    grid-column: 2 / 5;
    grid-row: 3 / 4;
		text-align: center;
		padding: 1% 0;
  }
.cta-wrapper1a {
    grid-column: 2 / 3;
    grid-row: 4 / 5;
	text-align: left;
	position: static;
	  padding: 3%;
  }
	.cta-wrapper1b {
    grid-column: 4 / 5;
    grid-row: 4 / 5;
	text-align: left;
		position: relative;
	  padding: 2% 0;
  }
	.cta-wrapper2a {
    grid-column: 2 / 3;
    grid-row: 5 / 6;
		text-align: left;
		padding: 3%;
  }
	.cta-wrapper2b {
    grid-column: 4 / 5;
    grid-row: 5 / 6;
		text-align: left;
		padding: 3%;
  }
  .cta-wrapper3 {
    grid-column: 2 / 5;
    grid-row: 6 / 7;
		text-align: left;
		padding: 1% 0;
  }
.cta-wrapper4 {
    grid-column: 2 / 5;
    grid-row: 7 / 8;
	padding: 1% 0;
  }
	.imgrw8{
		width: 12.5%;
	}
	.imgrw2{
		max-width: 80%;
	}
	
	
	.cta-wrapper3b {
    grid-column: 4 / 5;
    grid-row: 6 / 7;
		text-align: center;
		position: static;
		padding: 15% 0;
  }
	.cta-wrapper5 {
    grid-column: 2 / 5;
    grid-row: 8 / 9;
		text-align: left;
		padding: 3% 0;
  }
	.cta-wrapper6a {
    grid-column: 2 / 3;
    grid-row: 9 / 10;
		text-align: left;
		
		padding: 3% 0;
  }
	.cta-wrapper6b {
    grid-column: 4 / 5;
    grid-row: 9 / 10;
		text-align: center;
		padding: 3% 0;
		position: static;
  }
	.cta-wrapper7a {
    grid-column: 2 / 3;
    grid-row: 10 / 11;
		text-align: left;
		padding: 3% 0;
  }
	.cta-wrapper7b {
    grid-column: 4 / 5;
    grid-row: 10 / 11;
		text-align: left;
		text-align: center;
		position: static;
		padding: 3% 0;
  }
	.cta-wrapper8a {
    grid-column: 2 / 3;
    grid-row: 11 / 12;
		text-align: left;
		text-align: center;
		position: static;
		padding: 3% 0;
  }
	.cta-wrapper8b {
    grid-column: 2/ 5;
    grid-row: 11 / 12;
		text-align: center;
		padding: 3% 0;
  }
	.cta-wrapper9{
	grid-column: 2 / 5;
    grid-row: 12 / 13;
	padding: 5%;
	text-align: center;
		font-size: 14pt;
		color: #444444;
}
}
