body {background-color:#dcdcdc ; margin:0 0 0 0; }
html, body {width: auto!important; overflow-x: hidden!important} 
.main-header {background-color: #000000; width: 100%; height: 170px;
text-align: center;position: fixed; z-index: 2;}
#banner {background-color: #000000;padding-top: 160px; width:100vw;}
#logo { overflow: visible;}
a {color: white !important;font-family: Raleway, Arial !important; font-size: 1.2em;}
	p {font-size: 1.2rem; line-height: 1.5;}

figure {background-color: white;}
figcaption {background-color: white; padding: 20px;}
footer {padding:30px; background-color: black; text-align: center;color: white;}
#story, .contact, .intro { margin-left: 5px; margin-right: 5px;}
.left-align {text-align: left;}
/* Layout */


 .responsive {margin:0 auto; width: 100%;}
 .summary, .social-media, .contact {text-align: center;}
#intro {margin:0 auto; }

/* Navigation */
.wide-nav {display: none !important;}
.nav-list {display: flex; justify-content: space-between; flex-direction:row; padding-left:0;}
.navimg {list-style: none;} 
.navli {list-style: none; color: #FFFFFF;
		padding-top:80px;
		padding-left: 40px;
        padding-right: 40px;}
	
.width-cap-wrapper, .about, .summary {max-width: 1338px;margin:0 auto; }	
/* Sections */
.about { padding: 100px, 0; transform-style: preserve-3d; transform: perspective(1400px); }
.about h3 {text-transform: uppercase; font-weight: 400;}
.about h3, .about p, .about img {transition: all 0.8s ease;}
.about.hidden h3 {opacity:0; transform: translate3d(0, 0, 400px) rotateY(-40deg);}
.about.hidden p, .about.hidden img {opacity:0; transform: translate3d(0, 0, 400px) rotateY(40deg);}

#intro{ position:relative; }
section span{ position:absolute; top:-170px;}


/* Media Queries */

@media (min-width: 769px) { .mobile-nav {display:none;}
.wide-nav {display: flex !important;
              flex-direction: row;
justify-content: space-around; flex-wrap: wrap;
max-width: 1447px; margin:0 auto;
}
#banner {padding-top:130px;}

}