body { background-color: black; color: white; }

h1 { color: darkgray; text-align: center; }
h3 {color: silver; }
p { color: darkgray; font-size: 16px;}

/* Main Nav Bar Top */
.main-nav {
font-family: serif;
font-size: 2rem;
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #000000;
}

.main-nav li { float: left; }
.main-nav li a {
display: block;
color: #EEEEEE;
text-align: center;
padding: 10px 12px;
text-decoration: none;
}

.main-nav a:hover {
  color: red;
}
/* End Main Nav Bar Top */

/* Side Nav Bar for Photo pages */
/*.sidenav {
  width: 130px;
  position: fixed;
  z-index: 1;
  top: 75%;
  left: 5px;
  background: black;
  overflow-x: hidden;
  padding: 8px 0;
}

.sidenav a {
  padding: 6px 8px 6px 16px;
  text-decoration: none;
  font-size: 25px;
  color: #EEEEEE;
  display: block;
}

.sidenav a:hover {
  color: red;
}*/
/* End Side Nav Bar for Photo Pages */



.catpoop {
color: gray;
margin-left: 20px;
font-size: 18px;
}

/* Main page photo */
.text-img {
float: right;
    text-align: justify;
    width: 350px;
    border: 1px dotted red;
}

.text-img img {
    display: block;
    margin: 0 auto;
}

/*New photo gallery */
.container{
    width: 70%;
    margin: auto;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 50px 3%;
    }

.gallery{
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   /*grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));*/
   grid-gap: 15px;
}

.gallery img{
    width: 100%;
    display: flex;
}

.gallery img:hover {
  opacity: 0.8;
   border: 2px solid red;
  transform: scale(1.1);
}
/* End NEW photo gallery */


/* Set fixed clawmark Background*/

{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
.block-parallax-1 {
    overflow: hidden;
    position: relative;
}
.block-parallax-1 .parallax-bg {
    background-attachment: fixed;
    background-image: url('../images/HCC.jpg');
    background-position: 0px 0px;
    background-repeat: repeat;
    height: 100%;
    position: absolute; /* naughty code */
    width: 100%; /* naughty code*/
    min-width: 470px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
}

.block-parallax-1 .md-box {
    padding: 100px 100 200px;
    background: rgba(0, 0, 0, 0.75);
    position: relative;
    height: 900px;  /*height of entire box */
    text-align: left;
}

.block-parallax-1 .md-box h1 {
    color: #fff;
}

.block-parallax-2 .parallax-bg {
	background-image: url('../images/HCC.jpg');
}

h2 {
    color: #555;
    text-align: center;
    padding: 25px 0;
    margin: 0;
}

/* End Fixed background */

