@media only screen 
 and (max-width :1024px)

 {
     #title{
     width:98%;
     height:100%;
     padding:5px;
     border-radius:5px;
     
     }
 p{
     color:white;
     font-family:sans-serif;
     text-align:center;
     vertical-align:middle;
     font-size:2em;
     font-weight:bold;
 }
 #nav{
     
     width:100px;
     padding:10px;
     font-family:sans-serif;
     font-weight:bold;
     color:white;
     float:left;
     position: relative;
     
 }
 #nav>ul li{
margin-top:1px;
 padding:3px;
 }
 a{
     color:white;
     text-decoration:none;
 }
 
 #nav > ul {
 width: 10em;
 margin: 0;
 padding:3px;
 list-style: none;
 display:none;
 
}
 #nav > ul li a:hover {
 background: #c60;
 text-decoration: underline;
}
 #nav:hover ul {
 display:block;
}
   
    
 
    
    body {
        background-color:#FDF3E7;
    }
     #pvlink{

color:white;
float:right;

  }
  #cover{
      width:100%;
      height:100%;
      
      margin-top:30px;
      
      margin-left:0px;
  }
  #back{
display:block;
margin-top:30px;
margin-left:40px;
color:black;
  }

    .outer {
        width: 100%;
        display: inline-block;
        float: none;
        margin-top: 40px;
        margin-left:auto;
        margin-right:auto;
    }

    .inner {
        width:100%;
        height:1000px;
        float: left;
    }
     .inner img{
          width:100%;
          height:100%;
      }
     .inner video{
          width:100%;
          height:100%;
      }

       
    .shown {
        display: inline-block;
    }

    .hidden {
        display: none;
    }

    .previous {
        float:left;
        margin-right:0px;
        margin-top:10px;
    }

    .next {
        float:right;
        margin-left:00px;
        margin-top:10px;
    }
    #p1{
        display:none;
    }
    #p2{
        display:inline;
    }


iframe{
    width:100%;
    height:100%;
}
}