body{
  font-family:Arial, sans-serif;
}
#logo-college {
   padding:5px;
   margin: 0 auto;
   max-width:1200px;
   text-align:left;
}
#department-id {
   text-align:left;
   margin:0;
   padding: 5px 10px 5px 5px;
   width: 97%;
   max-width: 500px;
   font-size: 1.3em;
}
#department-id a:link {
   color:#0E253E;
}
#logo-college-img {
   margin: 0px 5px;
   width: 90%; 
   max-width: 300px;
   text-align:left;
}
#group-wrap {
   margin: 15px auto 10px auto;
}
#socialmedia-wrap {
   width: 33.3%
}
.socialmedia-icon {
   padding-right: 10%;
   width: 40%;
}
.socialmedia-icon img {
   width: 100%;
}
#contactus-wrap {
   width: 60%;
}
#contactus-title {
   margin-bottom: 0;
}
#hp-content-text p {
   font-size: 1.25em;
   padding: 10px 20px;
   letter-spacing: .03em;
   word-spacing: .15em;
   line-height: 1.5em;
}
#soundcloud-wrap h2 {
   margin: 0 auto 0.3em auto;
   width: 95%;
}
#feature-vid-wrap {
   margin: 15px 0;
}
#feature-vid-wrap iframe {
   margin: 0 auto;
   width: 100%;
   max-width: 560px;
}
#spotlight {
   margin: 0;
}
.spotlight-item {
   float: left;
   list-style: none;
   width: 100%;
}
.spotlight-phototext {
   margin: 5px auto;
   text-transform: uppercase;
   width: 90%;
}

#quick-na {margin:60px 0;}
#quick-nav ul {
   	  list-style:none;
      margin:0;
      padding:0;
   }
#quick-nav ul li {
    margin: 20px;
    padding: 15px;
    background: #f17d22;
    color: #fff;
    font-size: 18px;
    line-height:20px;
    border: none;
    border-radius: 10px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
   }
   
#welcome-title {
	line-height: normal;
    padding-top: 30px;

}   
/* @ 431px and up */
@media only screen and (min-width: 431px){
   #socialmedia-wrap {
      width: 135px;
   }
   .socialmedia-icon {
      padding-right: 0;
      width: 60px;
   }
   #contactus-wrap {
      float: left;
      font-size: 12px;
      width: 235px;
   }
   #contactus-wrap p {
      margin: 0;
   }
}



/* @ 620px and up */
@media only screen and (min-width: 620px){
   #group-pnav-wrap {
      margin: 0;
   }
   #group-wrap {
      float: none;
      width: 95%;
   }
   #socialmedia-wrap {
      float: left;
      margin-bottom: 0;
      width: 135px;
   }
   .socialmedia-icon {
      padding-right: 0;
      width: 60px;
   }
   #contactus-wrap {
      float: left;
      font-size: 12px;
      width: 235px;
   }
   .spotlight-item {
      float: left;
      list-style: none;
      width: 50%;
   }
   .spotlight-phototext {
      margin: 5px auto;
      text-transform: uppercase;
      width: 90%;
   }
}


/* @ 800px and up */
@media only screen and (min-width: 800px){
   #logo-college {
      text-align: left;
      margin:0 auto;
      padding:10px 0;
   }
   #department-id {
      text-align:left;
      margin:0;
      padding:5px;
      font-size: 2em;
      max-width: 500px;
      float:left;
   }
   #logo-college img {
      margin: 0px 5px;
	  max-width: 400px;
      text-align: left;
   }
   #socialmedia-wrap {
      width: 135px;
   }
   .socialmedia-icon {
      margin-right: 0;
      width: 60px;
   }
   #contactus-wrap {
      width: 235px;
   }
   #contactus-wrap p {
      margin-bottom: 0;
   }
   #contactus-phone {
      display: block;
   }
   #spotlight {
      width: 783px;
   }
      #quick-na {margin:60px 0;}
   #quick-nav ul {
   	  list-style:none;
      margin:0;
      padding:0;
      text-align:center;
   }
   #quick-nav ul li {
    display: inline;
    text-align: center;
    margin: 20px;
    padding: 15px;
    background: #f17d22;
    line-height: 80px;
    color: #fff;
    font-size: 20px;
    white-space: nowrap;
    border: none;
    border-radius: 10px;
    box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
    }
}


/* @ 960px on up */
@media screen and (min-width: 960px){
    #logo-college {
      text-align: right;
      margin:0 auto;
      padding:10px 0;
   }
   #logo-college-img {
   	  padding-top:13px;
   }
   #colfaID-wrap {
      margin: 0 auto;
      padding: 20px;
      width:100%;
      max-width:1000px;
   }
   #hp-content-text {
      width: 100%;
   }
   #soundcloud-wrap {
      text-align: center;
      width: 50%;
   }
   #soundcloud-wrap h2 {
      text-align: left;
      width: 95%;
   }
   #soundcloud-wrap iframe {
      margin: 0 auto;
      width: 95%;
   }
   #feature-vid-wrap {
      text-align: center;
      width: 50%;
   }
   #feature-vid-wrap iframe {
      margin: 0 auto;
      width: 95%;
      max-width: 95%;
   }

}