
html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

.topnav {
  overflow: hidden;
//    background-color: rgb(182, 215, 235);
//background-color: rgb(255, 255, 255);
  position: relative;
}

.topnav #myLinks {
  display: none;
  width: 10em;
  background-color: rgb(244, 244, 244);
//  background-color: rgb(238,253,255);
}

.topnav a {
  color: white;
  padding: 1px 16px;
  text-decoration: none;
  font-size: 17px;
  display: inline-block;  // used to be block to create vertical drop down, but this filled in the top home button left to right
}

.topnav a.icon {
//  background-color: rgb(182, 215, 235);
  background-color: rgb(244, 244, 244);
  display: inline-block;
  position: absolute;
//  right: 0;
  left: 5em;
  top: 0;
}

.topnav a:hover {
  background-color: rgb(244, 244, 244);
  color: black;
}

.active {
  background-color: rgb(244, 244, 244);
//  background-color: rgb(238,253,255);
  color: rgb(244, 244, 244);
//  color: rgb(238, 253, 255);
}















@font-face {
  font-family: 'MyWebFont';
  src: url('HhyXU5sn9vOmLzGbKOCFMItgT7kJ.woff2') format('woff2');
}

@font-face {
  font-family: 'Quicksand';
  src: url('6xKtdSZaM9iE8KbpRA_hJFQNYuDyP7bh.woff2') format('woff2');
}

@font-face {
  font-family: 'Oxygen';
  src: url('2sDfZG1Wl4LcnbuKjk0mRUe0Aw.woff2') format('woff2');
}

.borderRounded
{
border-style:solid;
border-width: 1px;
border-color:rgb(205, 217, 228);
border-radius: 1em;
padding: 1em;
overflow: auto;
background: rgb(227, 240, 248);
//background: rgb(238, 250, 255);
}

.borderRounded3
{
border-style:solid;
border-width: 1px;
border-color:#287EC7;
border-radius: 2em;
padding: 5px;
overflow: auto;
}

.borderRounded4
{
border-style:solid;
border-width: 0px;
border-color:#287EC7;
border-radius: 0.2em;
padding: 1px;
padding-left:5px;
padding-right: 5px;
//border-radius: 0.7em;
//padding: 5px;
overflow: auto;
}

.borderRounded6
{
border-style:solid;
border-width: 2px;
border-color:#287EC7;
border-radius: 0.5em;
padding: 5px;
//padding-left:5px;
//padding-right: 5px;
//border-radius: 0.7em;
//padding: 5px;
overflow: auto;
}

.borderRounded5
{
border-style:solid;
border-width: 1px;
border-radius: 0.7em;
padding: 5px;
overflow: auto;
}

p.padding {
  padding-left: 1em;
  padding-right: 1em;
}

p.padding2 {
  padding-left: 20%;
  padding-right: 20%;
}

p.top-padding {
  padding-left: 1em;
  padding-right: 1em;
  padding-top: 4em;
}

body, html {
  height: 100%;
  margin-top: 0px;
  font-family: Oxygen;//Arial, Helvetica, sans-serif;
}



.hero-image {
//  background-image: linear-gradient(rgba(121, 121, 121, 0.5), rgba(0, 0, 0, 0.5)), url("banner.jpg");
//  background-image: linear-gradient(rgba(61, 61, 61, 0.5), rgba(0, 0, 0, 0.5)), url("/imgs/banner.jpg");
//  background-image: linear-gradient(rgba(100, 240, 255, 0.5), rgba(210, 210, 210, 0.5)), url("/imgs/fish_montage.jpg");


//  background-image: linear-gradient(rgba(100, 230, 255, 0.5), rgba(255, 255, 255, 0.5)), url("/imgs/fish_montage.jpg");
//  background-image: linear-gradient(rgba(182, 220, 245, 0.5), rgba(255, 255, 255, 0.5)), url("/imgs/fish_montage.jpg");
  background-image: linear-gradient(rgba(254, 251, 251, 0.1), rgba(254, 251, 251, 1)), url("/imgs/banner.jpg");
  background-color: rgb(38,53,55);
  height: 19em; //26em;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}


.whole-background-image {
//  background-image: linear-gradient(rgba(121, 121, 121, 0.5), rgba(0, 0, 0, 0.5)), url("banner.jpg");
//  background-image: linear-gradient(rgba(61, 61, 61, 0.5), rgba(0, 0, 0, 0.5)), url("/imgs/banner.jpg");
//  background-image: linear-gradient(rgba(100, 240, 255, 0.5), rgba(210, 210, 210, 0.5)), url("/imgs/fish_montage.jpg");


//  background-image: linear-gradient(rgba(100, 230, 255, 0.5), rgba(255, 255, 255, 0.5)), url("/imgs/fish_montage.jpg");
//  background-image: linear-gradient(rgba(182, 220, 245, 0.5), rgba(255, 255, 255, 0.5)), url("/imgs/fish_montage.jpg");
  background-image: linear-gradient(rgba(255, 255, 255, 0.64), rgba(182, 220, 245, 0.64)), url("/imgs/banner.jpg");
  background-color: rgb(38,53,55);
  background-position: center;
  background-repeat: repeat;
  background-size: cover;
  position: relative;
}




.hero-text {
  text-align: center;
//  position: absolute;
  top: 50%;
//  left: 50%;
//  transform: translate(-50%, -50%);
  color: white;
}

.hero-text button {
  border: none;
  outline: 0;
  display: inline-block;
  padding: 10px 25px;
  color: black;
  background-color: #ddd;
  text-align: center;
  cursor: pointer;
}

.hero-text button:hover {
  background-color: #555;
  color: white;
}






a:link, a:visited {
  color: rgb(0, 0, 0);
 // text-align: center;
  text-decoration: none;
//  display: inline-block;
}


//a:hover, a:active {
//  background-color: rgb(155, 155, 155);
//}

/*a:hover, a:active {
  background-color: red;
}*/





        img_unused {
			width: 400px;
			height: 400px;
			object-fit: cover;
		}





//		/* Style the tab */
//		.tab {
//			position: fixed;
//			/* Set the navbar to fixed position */
//			top: 0;
//			/* Position the navbar at the top of the page */
//			width: 100%;
//			/* Full width */
//			overflow: hidden;
//			border: 1px solid #ccc;
//			background-color: #f1f1f1;
//		}
//
//		/* Style the buttons inside the tab */
//		.tab button {
  //          background-color: rgb(215, 228, 253)
////			background-color: inherit;
//			float: left;
//			border: none;
//			outline: none;
//			cursor: pointer;
//			padding: 1px 7px;
//			transition: 0.3s;
//			font-size: 1.15em;
//		}
//
//		/* Change background color of buttons on hover */
////		.tab button:hover {
////			background-color: rgb(163, 192, 248);
////		}
//
//		/* Create an active/current tablink class */
////		.tab button.active {
////			background-color: #ccc;
////		}
//
//		/* Style the tab content */
//		.tabcontent {
//			display: none;
//			padding: 36px 12px;
//			border: 1px solid rgb(31, 29, 29);
//			border-top: none;
//		}






		ctrd {
			text-align: center;
		}

		h1 {
//			font-size: 2em;
			font-size: 2.6em;
			font-family: MyWebFont;//Oxygen;//MyWebFont;//Arial;
			//font-variant: small-caps;
			font-weight: lighter;
            text-shadow: 2px 2px #ffffff;
			color: rgb(255, 255, 255)
		}

		h2 {
//			font-size: 1.6em;
			font-size: 1.9em;
			font-family: Oxygen;//MyWebFont;//Arial;
			//font-variant: small-caps;
			font-weight: lighter;
            text-shadow: 2px 2px #ffffff;
			color: rgb(255, 255, 255)
		}

		h3 {
			font-size: 1.4em;
			font-family: Oxygen;//Arial;
		//	font-variant: small-caps;
			font-weight: lighter;
//			color: rgb(50, 100, 200)
			color: rgb(20, 20, 20)
		}

		h4 {
			font-size: 1.2em;
			font-family: Oxygen;//Arial;
			font-weight: lighter;
		}

		p {
			font-size: 14px;
            font-weight: lighter;
		}


		* {
			box-sizing: border-box;
		}

		body {
			margin: 0;
			font-family: Oxygen;//Arial, Helvetica, sans-serif;
            line-height: 1.5;
            background-color: rgb(255 255 255);
            background-image: url(https://ahrensart.com/imgs/background_test.jpg);
            background-repeat: repeat;
            background-image-opacity: 1;
         
		}



		img {
			display: block;
			margin-left: auto;
			margin-right: auto;
			//width: 100%;
			//height: auto;
            //border:2px solid #fff;            
            //box-shadow: 5px 5px 15px #ccc;
            border:2px solid #fff;            
            box-shadow: 5px 5px 25px rgb(0,0,0);            
    padding: 0;
    margin: 0 auto;
    max-height: 100%;
    max-width: 100%;
		}

		img.no-shadow {
			display: block;
			margin-left: auto;
			margin-right: auto;
			width: 100%;
			height: auto;
            border:1px solid rgb(40,40,40);            
            box-shadow: 0px 0px 0px rgb(0,0,0);
		}


img:hover{
    filter: alpha(opacity=100);
}
        img.emailTxt
        {width:14em;
        }
        
        img.sixtyPercentRound
        {width:80%;
        height:auto;
        border-radius:50%;
        display:block;
        margin-left:auto;
        margin-right:auto;
        }

		img.rounded-corners {
//			border-radius: 2em;
			border-radius: 0.5em;
			/*20px;*/
            border:2px solid #fff;            
            box-shadow: 5px 5px 25px rgb(0,0,0);
		}

		img.rounded-corners2 {
			border-radius: 7em;
			/*20px;*/
		}

		img.square_shadow {
			border:2px solid #fff;            
            box-shadow: 10px 10px 5px #ccc;
		}

        img.opac8 {
            filter: alpha(opacity=89);
            opacity: 0.999;
            transition: 0.2s;

        }


		img.rounded-corners3 {
			border-radius: 50%;
			/*20px;*/
		}

		div.gallery {
			border: 0px solid #ccc;
		}

		/*div.gallery:hover {
  border: 1px solid #777;
}*/

		div.gallery img {
			width: 85%;
			height: 20em;
			object-fit: cover;
			margin-left: auto;
			margin-right: auto;
			margin-top: 5px;
			margin-bottom: 5px;
			border: 1px solid rgb(145, 145, 145);
		}


        div.gallery img:hover{
            filter: alpha(opacity=100);
            opacity: 1;
        }

		div.gallery imgWide {
			width: 20;
			height: auto;
			object-fit: cover;
			margin-left: auto;
			margin-right: auto;
			margin-top: 0px;
			margin-bottom: 0px;
			border: 0px solid rgb(145, 145, 145);
		}

        div.gallery img2 {
			width: 10em;
			height: 10em;
			object-fit: cover;
			margin-left: auto;
			margin-right: auto;
			margin-top: 5px;
			margin-bottom: 5px;
			border: 1px solid black;
            border-radius: 2em;
		}

		div.desc {
			padding: 5px;
            padding-right: 2em;
			text-align: right;
			//height: 4em;
			height: 6.5em;
            //font-weight: lighter;
            font-size: 0.9em;
		}

		div.descBig {
			padding: 5px;
			text-align: center;
			height: 8em;
            font-weight: lighter;
		}

		* {
			box-sizing: border-box;
		}



		.responsive {
			padding: 0 6px;
			float: left;
			width: 24.99999%;
		}



		@media only screen and (max-width: 8888em) {
			.responsive {
				width: 24.99999%;
				margin: 2px 0;
			}
         div.standardtext {
 //   font-size: 1em;
    padding-left:4%;
    padding-right:4%;
    text-align: justify;
  }
		}


		@media only screen and (max-width: 105em) {
			.responsive {
				width: 33%;//24.99999%;
				margin: 2px 0;
			}
         div.standardtext {
 //   font-size: 1em;
    padding-left:4%;
    padding-right:4%;
    text-align: justify;
  }
		}

		@media only screen and (max-width: 80em) {
			.responsive {
				width: 33%;//24.99999%;
				margin: 2px 0;
			}
              div.standardtext {
//    font-size: 1em;
    padding-left:4%;
    padding-right:4%;
    text-align: justify;
  		}
        }
        
        /*
		@media only screen and (max-width: 60em) {
			.responsive {
				width: 33.3333%; //32.99999%;
				margin: 2px 0;
			}
              div.standardtext {
    padding-left:5%;
    padding-right:5%;
    text-align: justify;
  }
    div.hero-image {
      height: 20em;
  }


		}
*/
		@media only screen and (max-width: 58em) {
			.responsive {
				width: 49.99999%;
				margin: 2px 0;
			}
            div.standardtext {
    padding-left:4%;
    padding-right:4%;
    text-align: justify;
  }

  div.hero-image {
      height: 25em;
  }

  div.whole-background-image {
      height: 25em;
  }

  }
		

		@media only screen and (max-width: 34em) {
			.responsive {
				width: 99.99%;
				margin: 2px 0;
			}
            div.standardtext {
 //   font-size: 1.05em;
    padding-left:1%;
    padding-right:1%;
    text-align: left;
  }
    div.hero-image {
      height: 25em;
  }
    div.whole-background-image {
      height: 25em;
  }
		}
 


		.clearfix:after {
			content: "";
			display: table;
			clear: both;
		}


        
