/*@media screen and (min-width: 660px)*/
@media only screen and (min-width: 480px) and (max-width: 640px) {
  /******************
  HEADER
  ******************/
  nav {
    background: none;
    float: right;
    font-size: 1.125em;
    /*margin-right: 5%;*/
	/*margin-left: 2px;*/
	margin: 0;
    text-align: center;
    widows:45%
  }
  #logo {
    float: left;
    margin-left: 5%;
    text-align:left;
    width: 45%;
  }
  
  h1 {
    font-size:2.5em;
  }
  h2 {
    font-size:1em;
    margin-bottom:2%;
  }
  
  h3 {
	font-size:.75em;
	margin: 1em 2em;
  }
  
  header {
    /*border-bottom: 5px solid #0000FF;*/
    margin-bottom: 40px;
  }
}

/*@media screen and (min-width: 380px)*/
@media only screen and (max-width: 479px) {
 
  /*******************************
  TWO COLUMN LAYOUT
  ********************************/
  #primary {
    width: 50%;
    float: left;
  }
  
  #secondary {
	width: 40%;
    float: right;
  }
  .profile-photo: {
  display: none;
  }
/********************************
ONE COLUMN LAYOUT
********************************/  
   nav {
    background: none;
    float: right;
    font-size: .825em;
	/*testing margin-top*/
	/*margin-top: 0em;*/
    /*margin-right: 2%;*/
	margin: 0;
    text-align: center;
    widows:45%
	}
	
	header h1 {
		font-size: 1.5em;
		color: #ffffff;
	}
	
	header h2 {
		font-size: 1em;
		color: #ffffcc;
	}
	
	 h3 {
	font-size:.5em;
	margin: 1em 2em;
  }
  /********************
  PAGE: PORTFOLIO
  **********************/
  #gallery li {
    width: 28.3333%
  }
  
  #gallery li:nth-child(4n) {
    clear: left;
  }
  
  /*************************
  PAGE: ABOUT
  *************************/
  .profile-photo {
    float: left;
    margin: 10px 5% 80px 0;
  }
}