@media only screen 
  and (max-width: 650px) {
 #main {
  width:100%;
  padding:0;
  margin:0;
 }
 
 #body {
  margin-left:0;
 } 
 
 #photo {
   margin-left:auto;
   margin-right:auto;
 }
 
}

#photo {
 width:250px; height:328px;
 background-image:url('bruce.JPG');
}

body {
 font-family:Verdana, Geneva, sans-serif;
 color: #161b1b;
}

a {
 color: #809999;
 transition: all 0.1s ease 0s;
}

a:hover {
 color: #716d6a;
}

h1 {
 text-align:center;
 font-family: 'Montserrat', sans-serif;
}

h2 {
 font-family: 'Montserrat', sans-serif;
}

hr {
 border: 0;
 height: 0;
 border-top: 1px solid rgba(0, 0, 0, 0.1);
 border-bottom: 1px solid rgba(255, 255, 255, 0.3); 
}
@media only screen 
  and (min-width: 650px) {
#main {
 margin: auto;
 width: 75%;
 min-width:500px;
 overflow: auto;
 padding: 1em;
 box-shadow: 0px 0px 10px #BFBFBF;
 margin-bottom:2em;
}

#info {
 float: left;
 width: 270px;
}

#body {
 margin-left: 270px;
}
}

#credits {
 font-variant:small-caps;
 text-align:center;
 color:#cccccc;
}