Header and Nav's background color disappear when screen's width is larger than 660px

/**************************************
          GENERAL
**************************************/
/* WRAPPER = body - header */

#wrapper {
  max-width: 900px;           /* max width allowed for mobile, desktop*/
  margin: 0 auto;             /* set margin on top and bottom, auto center the content */         
  padding: 0 5%;              /* 0 on top and bottom, 5% left and right */
/*  background-color: #FBEEE6; */
}

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


/* remove underline for hyperlinks */
a {
  text-decoration: none;
}


img {
  max-width: 100%;   /* tells image to fill the width of whatever platform viewer is using */
}
/**************************************
          HEADING
**************************************/
#header{
  float: left;
  margin: 0 0 30px 0;
  padding: 0 0 0 0;
  width: 100%;     /* float, element would stretch the entire page */
}

#logo {
  color: black ;
  text-decoration: none;
  text-align: center;
  margin: 0 auto;      /* 0pixel margin for all 4 sides of id="logo", change number to see difference */

}


#logo h1 {
  font-family: 'Dancing Script', cursive;
  /* Font must be in single quote. In case google failed to load Changa One, it will load font sans-serif *//*override body's font type*/
  margin: 20px 0;       /* 15px on top and bottom, 0 on left and right */
  padding: 30px 0 0;
  font-size: 4em;    /* 1em = 16px in most browser, auto-scale */
  font-weight: normal;  /* unbold the headline because headline element are bold by default */
  line-height: 0.8em;   /*determine the amount of space between each line of text, like in paragraph */ 
} 

#logo h2 {
  font-size: 1.25em;  
  margin: -5px 0 0px;       /* top left/right bottom */ /*top 5px closer to h1 */
  font-weight: normal;  
  font-family: 'Satisfy', cursive;

}

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

nav {
  text-align: center;
  padding: 10px 0;      /* between content and border */ /* 10px top and bottom, 0 left and right */
  margin: 20px 0 0;     /* 20px top, 0 left & right, 0 bottom */
}

nav ul {
  list-style: none;
  margin: 0 10px;       /* 10px both left and right */
  padding: 0;
}

nav li {
  display: inline-block;    /* align all list items to a line */  /* block has width and height */
}

nav a {
  font-weight: 800;
  padding: 0px 30px;
}

/**************************************
          FOOTER 
**************************************/
footer{ 
  font-size: 0.75em;
  text-align: center;
  clear: both;         /*footer was affected by "float", clear will negate this influence, "both" means both left and right side */
  padding-top: 50px;  

}

.social-icon {
  width: 35px;    /*resize */ 
  height: 35px;
  margin: 0 5px;
}

/**************************************
        PAGE: PORTFOLIO 
**************************************/
#gallery{
  margin: 0;
  padding: 0;
  list-style: none;       /* remove bullet points */
}

#gallery li {       /* select <li> inside gallery */
  float: right;     /* setting items side by side */
  width: 45%;       /* 45% on both left and right of each item, will auto-scale to parent's window */ /*45 * 2 + 10 = 100% */
  margin: 2.5%;     /* 2.5% on both left and right of each item, 2.5 * 2 * 2 = 10 */
  background-color: #AED6F1;
}

#gallery li a p {
 color: #A569BD;
 margin: 0%;     /* paragraph has margin by default */
 padding: 5%;
 font-size: 0.95em;

}

/**************************************
        PAGE: ABOUT 
**************************************/
.profile-photo{
  display: block;       
  width: 450px;
  height: 250px;

  max-width: 250px;
  margin: 0 auto 30px;     
  border-radius: 100%; 
}  

h5 {
  color: purple;
  text-align: center;

}

h2 {
  margin: 0 0 2em 0;    /*right 0, top 0, 1em left, 0 bottom */
  text-align: center;
} 

/**************************************
        PAGE: CONTACT
**************************************/
.contact-info {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.9em;
}




.contact-info li.phone-number a {  
  background-image: url('../Image/phone.png');   
}
  .contact-info li.email a {     
  background-image: url('../Image/mail.png');    
}

.contact-info li.twitter a {    
  background-image: url('../Image/twitter.png');    
}


.contact-info li  {
  display: block; 
}

.contact-info a {
  min-height: 20px;    
  background-repeat: no-repeat; 
  background-size: 20px 20px; 
  padding: 0 0 0 30px;
  margin: 0 30px 10px 0px;    
}

/**************************************
          COLOR
**************************************/
p {
  color: black;
}


body {
  background-color: #FFE4E1;
  color: grey;                 /* footer */
}

header{
  background-color: #FF1493 ;
  border-color: #2C3E50;
}

nav, nav a{
  color: black;
  text-decoration: none;
}


nav a, nav a:visited{       
  color: green;
}


nav a.selected, nav a:hover{  
  color: brown;
}