/*body*/
         body {
             background-color: darkslategrey;
             background-image: url(images/churchmercury.jpg);
             background-repeat: no-repeat;   
             height: 100%;
             background-position: center;
             background-size: cover;
             color: black;
             font-size: 1.1em;
             font-family: Verdana, sans-serif;
             
             
         }           
            #container {
                width: 1000px;
                border: 2px solid black;
                margin: 0 auto;
                
                border-radius: 25px 25px 25px 25px;
                
                
                background-color: skyblue;
                /*border: 1px solid black; */
                /*opacity: 0.8; */
                
                 
                font-weight: bold;
                color: #000000;
          }

            div.transbox p {
            margin: 5%;
            font-weight: bold;
            color: #000000;
            }

            header {
                 
                text-align: center;
                padding: 10px;
                border-radius: 25px 25px 0px 0px;
          }
      
          nav {
                color: wheat;
                 
                padding: 5px;
                border-radius: 25px 25px 25px 25px;
          }
            .column {
                    float:left;
                     
                    padding: 10px;
                    height: 670px;
                    
              }
              .column2 {
                    float: left;
                    padding: 10px;
                    height: 2250;
    
              }
              
              .left
              {
                  width:220px;
              }
              .right{
                  width:220px;
              }
              .middle{
                  width:460px;
                  text-align: center;
              }
  
              .row:after {
                  content: "";
                  display: table;
                  clear: both;
              }
              .photo{
                  border-radius:25px;
                  box-shadow: 0px 0px 25px #000000;
             
              }

              .shade {
                color: white;
                text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px darkblue;
              }
 

.nav-container {
  max-width: auto;
  margin: 0 auto;
}

          
  nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-bottom: 0px;
    
}
nav ul li {
  float: left;
  position: relative;
  margin-bottom: 0;
}
nav ul li a,
nav ul li a:visited {
    
  display: block;
    
  padding: 0 5px;
  padding-bottom: 0;
  line-height: 25px;
  background: blue;
  margin: 0px;
  color: white;
  text-decoration: none;
     box-shadow: 0px 0px 25px #000000;
     border-radius: 25px 25px 25px 25px;
 
}
nav ul li a:hover,
nav ul li a:visited:hover {
  background: #2ab1ce;
  color: green;
}
nav ul li a:not(:only-child):after,
nav ul li a:visited:not(:only-child):after {
  padding-left: 4px;
  content: "";
}
nav ul li ul li {
 
   padding: 5px;
  min-width: 190px;
  
}
nav ul li ul li a {
  padding: 15px;
  line-height: 20px;
}
 
.nav-dropdown {
  position: absolute;
  display: none;
  z-index: 1;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15);
}        
    

.nav-mobile {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  background: #262626;
  height: 70px;
  width: 70px;
}
 
@media only screen and (max-width: 798px) {
  .nav-mobile {
    display: block;
  }
 
  nav {
    width: 100%;
    padding: 70px 0 15px;
  }
  nav ul {
    display: none;
  }
  nav ul li {
    float: none;
  }
  nav ul li a {
    padding: 15px;
    line-height: 20px;
	padding-left: 25%;
	 
  }
  nav ul li ul li a {
    padding-left: 30%;
  }
 
  .nav-dropdown {
    position: static;
  }
	.brand a img {
		max-height: 60px;
		margin-top: 5px;
	}
}
@media screen and (min-width: 799px) {
  .nav-list {
    display: block !important;
  }
}
#nav-toggle {
  position: absolute;
  left: 18px;
  top: 22px;
  cursor: pointer;
  padding: 10px 35px 16px 0px;
}
#nav-toggle span,
#nav-toggle span:before,
#nav-toggle span:after {
  cursor: pointer;
  border-radius: 1px;
  height: 5px;
  width: 35px;
  background: #ffffff;
  position: absolute;
  display: block;
  content: '  ';
  transition: all 300ms ease-in-out;
}
#nav-toggle span:before {
  top: -10px;
}
#nav-toggle span:after {
  bottom: -10px;
}
#nav-toggle.active span {
  background-color: transparent;
}
#nav-toggle.active span:before, #nav-toggle.active span:after {
  top: 0;
}
#nav-toggle.active span:before {
  transform: rotate(45deg);
}
#nav-toggle.active span:after {
  transform: rotate(-45deg);
}
 
article {
  max-width: 1000px;
  margin: 0 auto;
  padding: 10px;
}