/*

All you need to add is specifially css regarding this page

Use unique identifiers.

class="name" , .name{}

id="name" , #name{}
 

*/
html{
    height: 100%;
    width: 99%;
    margin: auto;
    background: url(../img/M%20and%20D.png);
    background: url();
    background-color: #222222;
    background-repeat: no-repeat;
    background-size:cover;
    background-position:center;
/*    background-size: 1900px;*/
/*    background-color: #e5e5e5;*/
}



aboutpage{
    display: flex;
    flex-direction: column;
    justify-content:flex-start;
    background-position: top;
    width:80%;

/*    background: white;*/
/*    margin-top:30em;*/
    margin-top: 10em;
    
}
header{
    background-color:rgba(113, 113, 113, 0.93);

}

    
/*      -----------------        BIOS        ---------------        */
#bios{
    display: flex;
/*   flex-direction: row;*/
/*   justify-content: space-evenly;*/
    
    flex-direction: column;
    
    margin: 1em auto ;
    width:100%;
    max-width: 100em;
    
    
    
}
#morg, #dan{
    
    width:100%;
/*    height: 100%;*/
/*    border:solid 1px black;*/
    display: flex;
    flex-direction: row; 

    
      background:#e0e0e0;
    
    margin-bottom: 1em;
    margin:2em;
/*    box-shadow: 10px 10px 20px black;*/
}


dropbox{
    display: block;
  
    padding: 2em;
    width: 80%;
/*    transition: 1s;*/
/*    font-size: 1.2em;*/
    
}
dropbox h1{
/*    padding: 1em;*/
    margin:  auto 0;
    text-align: left;
/*    width:50%;*/
    font-size: 2.2em;
    padding: .6em 0;
    
    
}

dropbox p{
    display: block;
    text-indent: 0em;
    line-height: 1.4em;
    padding-bottom: 0.8em;
    font-size: 1.2em;
    width:80%;
    
}


/*       -----------    BIOS HEADERS     --------------     */

div.pic{
    width: 20em;
    height: 20em;
    align-content: center;
    
/*    overflow: hidden;*/
    display: flex;
    flex-direction: row;
    justify-content: center;
/*    margin: 3em 1em 1em 1em;*/
    padding-left:2em;
     margin-top:2.6em;
    
}
pic2{
    overflow: hidden;
/*    margin: 1em auto;
    */
    margin: 1em;
   
}
div.pic img{
    width:100%;
    height: auto;
/*    transform: scale(1) translate(30px, 60px);*/
    overflow:hidden;
  margin: auto;
    
}



bios div div h4{
/*    padding: 1em;*/
    margin:  auto 2em;
    text-align: left;;
    width:50%;
    font-size: 1.6em
}

dropbox ul{
    list-style: decimal;
    padding: 1em
}

dropbox ul li{
    list-style:disc;
    font-weight: 600;
}
dropbox ul p:{
    
    padding-bottom: .4em;
}

@media screen and (max-width: 800px) {
    #bios{
      width:99%;
        padding: 0;
/*        margin: auto;*/
/*        justify-content: center;*/
    }
    aboutpage{
        display: flex;
        flex-direction: column;
        justify-content: center;
/*        width:80%;*/
        margin: auto;
        padding: 0;
    }
    
    #dan, #morg{
        width:99%;
        display: flex;
        flex-direction: column;
        margin: 1em 0em;
    }
    .dropdown p{
        width:100%;
    }
    
    
    
    
    
    
    
    
    
}