@media only screen and (max-width: 1270px) {
  nav#nav-main ul {
      margin-top: 12px;
    }
  }

@media only screen and (max-width: 694px) {
 /*********************************
 NAVIGATION BAR FOR MOBILE
 *********************************/ 
  .wrapper {
    padding: 7% 2.5%;
  }

  #nav-trigger {
    display: block; }

  nav#nav-main {
    display: none; }

  nav#nav-mobile {
    display: block; 
    width: 90%;
    margin-right: auto;
    margin-left: auto;
  }

  .nav-back {
    height: 55px; 
  }
  .nav-back a img{
    width: 140px;
    height: 48px;
  }

 /*********************************
 Home Page 
 *********************************/
 .welcome li {
    width: 98%;
    padding-bottom: 5px;
  }
  .bx-wrapper {
    margin: 5%;
  }

  .bxslider .wrapper .halfbox{
    width: 100%;
  }

  .text_box h1{
    font-size: 1.5em;
  }

  .google-maps {
    width: 100%;
  }

  .tot {
    margin-top: 5%;
  }
  .tot p {
    font-size: .89em;
  }

  .tot ul {
    font-size: .92em;
  }
/*********************************
 News Headlines Page
 *********************************/
  .news_box li {
    width: 98%;
  }
  .news_box li:nth-child(1n+2) {
    clear: left; 
  }
 /*********************************
 Video Page
 *********************************/
  .video_box li {
    width: 95%;
  }
  .video_box li:nth-child(1n+2) {
    clear: left; 
  }
 /*********************************
 Pictures Page 
 *********************************/
  .wrapper .main-image {
    width: 100%;
    float: none;
    position: relative;
    padding-bottom: 1%;
    right: 0;
  }

  .wrapper .thumbnails {
    float: none;
    width: 100%;
  } 

  .main-image {
    width: 100%;
  }

  .main-image img {
    position: relative;
    max-height: 100%;
  }

  .thumbnails li{
    width: 18%;
    padding: 1%;
  }

  /***************************
  HillcrestSelfie
  ***************************/
  .selfietext {
    margin-top: 0; 
    width: 98%;
  }

  .dcsns-toolbar .filter {
    margin: 2px 0 15px 110px;
  }

  .dcsns-content {
    width: 100%;
  }

  .stream li {
    width: 148px;
  }

  .stream li .section-intro {
    font-size: 8px;
  }
  /***************************
  PAGE: ABOUT
  ***************************/
  .profile-photo {
    float: left;
    margin: 0 5% 80px 0;
  }

}

@media print {
  .nav-back, 
  #nav-main, 
  footer,
  nav#nav-main {
    display: none;
  }

  .text_box p, p, h1, h2, .tot p {
    color: #000 !important;
    background: transparent;
  }

  .news_box li {
    width: 45%;
  }

  a[href^="http"]::after {
    content: " [" attr(href)"]"
    color: blue;
  }

  @page {
    margin: .5cm;
  }

  @page :first {
    margin-top: 2cm;
  }

  h2, ul {
    page-break-after: avoid;
  }

  p, ul {
    orphans: 3;
    widows: 3;
    font-size: 11pt;
  }
}