/* 
    Created on : Sep 20, 2016, 2:19:30 PM
    Author     : Melissa Dahse
*/

/*body*/
#container{
    background-color: #FFFF99;
    background-repeat:no-repeat;
    background-position: center center;
    margin: 10px auto;
    padding: 20px;
    background-size: 100% 100%;
    overflow: hidden;
    
}
#header{
    
    color: white;
    margin-top: -8px;
    background: url("http://mohavewebdesign.com/melissa/cryptobook_bags/school/interactive_authoring/week2/images/snow_lep.jpg");
    background-repeat:no-repeat;
    height: 350px;
    width:100%;
    float:left;
    background-size:100% 110%;
    background-position: center;
    background-color:#000000;
}
#one_div{
    float:left;
    margin: 10px auto;
    display: block;
    background-color: #FFFF99;
    padding:10px;
    width: 41%;
    height: 100%;

}
#two_div{
    float:left;
    margin: 10px auto;
    display: block;
    padding:10px;
    width: 56%;
    background-color: #FFFF99;
}
/*text*/
p{
    margin:10px auto;
    padding:20px;
    position: inherit;
    text-align: left;
    
}
h2{
    margin:10px auto;
    padding:20px;
    position: inherit; 
    text-align: left;
}

figure figcaption p{
    margin: 5px;  
    line-height:1%;
    font-style: italic;
    text-align: center;
    font-size: .7em;
    padding: 6px;
}
/*images rules*/

.images_family{
    float: left;
    margin: 10px auto;
    border: 5px ridge #666;
    position: relative;
    padding: 10px;
    box-shadow: 2px 2px 4px rgba(0,0,0,.5);
    top: -47px;
    left: -27px;
}
 .images_bear{
   float: left;
    margin: 10px auto;
    border: 5px ridge #666;
    padding: 10px;
    box-shadow: 2px 2px 4px rgba(0,0,0,.5);
    position: relative;
    top: -98px;
    left: 415px;
}
 .images_spider{
    float: left;
    margin: 10px auto;
    border: 5px ridge #666;
    padding: 10px;
    box-shadow: 2px 2px 4px rgba(0,0,0,.5);
    position: relative;
    top: -65px;
    left: 52px;
 }
  
 .images_dear{
    float: left;
    margin: 10px auto;
    border: 5px ridge #666;
    padding: 10px;
    box-shadow: 2px 2px 4px rgba(0,0,0,.5);
    position: relative;
    left: -20px;
    top: -22px;
 }
 .images_butterfly{ 
    margin: 10px auto;
    border: 5px ridge #666;
    padding: 10px;
    box-shadow: 2px 2px 4px rgba(0,0,0,.5);
    position: relative;
    float: left;
    
 }
 .images_butterfly img {
     display:inline-block;
 }
 /*footer*/
 #footer{
    background-color:#000000;
    background-repeat: no-repeat;
    color: white;
    border:3px dashed yellow;
    margin-top: -116px;
    width: 100%;
    float:left;
 }
 #footer p {
     
     text-align: center;
 }