/*******************
GENERAL 
********************/

body {
  font-family: 'Open Sans', sans-serif;
}


body {
 float: left; margin: 0; padding: 0; width: 100%;
}

#wrapper {
  max-width: 940px;
  margin: 0 auto;
  padding: 0 5%;
}

a {
  text-decoration: none;
}



h3 {
 margin: 0 0 1em 0;
 font-size: 1em;
 color: #191970;
}


img {
  width: 100%;
  margin: 0;
  border: 0;	
}


/*******************
HEADING 
********************/



header {
  float: left;
  margin: 0 0 30px 0;
  padding: 5px 0 0 0;
  width: 100%;
}

header h1 {
  color: blue;
  font-style: italic;
  font-size: 1.75em;
}


#logo {
  text-align: center;
  margin: 0;
}




/*******************
NAVIGATION 
********************/

nav {
  text-align: center;
  padding: 10px 0;
  margin: 20px 0 0;
}

nav ul {
  list-style: none;
  margin: 0 10px;
  padding: 0;
}

nav li {
  display: inline-block;
}

nav a {
  font-weight: 800;
  padding: 15px 10px;
}

/*******************
PAGE: PORTFOLIO
********************/

#statement{
  margin: 2.5%;
}

#gallery {
  margin: 0;
  padding: 0;
  list-style: none;
}

#gallery li {
  float: left;
  width: 100%;
  height: auto;
  margin: 2.5%;
  background-color: #f5f5f5;
  color: #191970;
}

#gallery li a p {
  margin: 0;
  padding: 5%;
  font-size: 0.75em;
  color: #191970;
}

#cover {
  align: left;
  float: left;
  width: 20%;
  min-width: 100px;
  padding: 10px 30px 10px 10px;
}

#frustrated {
  align: left;
  width: 50%;
  padding: 10px 30px 10px 10px;
}

#achievment {
  align: center;
  width: 100%;
  padding: 10px 30px 10px 10px;
}


#tony {
  align: left;
  float: left;
  width: 25%;
  padding: 10px 30px 10px 10px;
}

#bill {
  align: left;
  float: left;
  width: 25%;
  padding: 10px 30px 10px 10px;
}



/*******************
PAGE: ABOUT
********************/

.profile-photo {
  max-width: 150px;
  margin: 0 10px 10px 10px;
  border-radius: 20%;
}


/*******************
FOOTER
********************/

footer {
  font-size:: 0.75em;
  text-align: center;
  clear: both;
  padding-top: 50px;
  color: #ccc;
}

.social-icon {
  width: 20px;
  height: 20px;
  margin: 0 5px;
}



/*******************
COLORS
********************/

/* site body - color is the default text color 999 = light grey */
body {
  background-color: #fff;
  color: #191970;
}

/* Header */
header {
  background-color: #e2f2fd;
  border-color: #2196f3;  
}




/* nav background on mobile devices */
nav {
  background: #2196f3; 
}

/* logo text */
/* h1, h2 {
  color: #fff;
}
*/


/* links color */
a {
  color: #1e90ff;
}

/* nav link - makes link a single color all the time, even when visited */
nav a, nav a:visited {
  color: #90caf9;
}

/* selected nav link - any anchor element inside nav that is of class selected */
nav a.selected, nav a:hover {
  color: #0000ff;
}