
div h1{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 2px 0px;
    color: #084400;
    font-family: "Trebuchet MS", Helvetica, sans-serif; 
}



h2{
     margin: 3px 0px 0px 0px;
    padding: 3px 0px 0px 0px;
    color: #084400;
}
    
h3{
    margin: 3px 0px 0px 0px;
    padding: 3px 0px 0px 0px;
    color: #084400; 
}
    
   
p{
    margin: 3px 0px 0px 0px;
    padding: 3px 0px 0px 0px;
    color: #084400;
    font-family: "Trebuchet MS", Helvetica, sans-serif;
}


body {
    
    background: 
        linear-gradient(
            rgba(35, 45, 35, 0.4), 
            rgba(35, 45, 35, 0.6)
        ),
        url(images/pattern_bg.png);
    
}


.footcon{
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: -moz-box;
    display: flex;         /* NEW, Spec - Firefox, Chrome, Opera */
    
    -webkit-box-flex-direction: row;
    -moz-box-flex-direction:  row;
    -webkit-flex-direction:  row;
    -ms-flex-direction:  row;
    flex-direction: row; 
    
    margin: auto;
    max-width: 1000px;
}

.footcon >.footer{
   
    margin-top: 10px;
    font-size:12px;
    color: white;
    width: 1000px;
}

.footer > p{
    color: white;
    padding-left: 1%;
  
    
}



#dp img{
    max-width: 190px;
    
}



#vector img {
    max-width: 270px
}

    .item {
       
        margin-bottom: 7%;
          
    }
    
        .scale-image{
            display: block;
            width: auto;
            max-width: 100%;
        }



    #resume > ol{
          list-style: circle; 
    }

    #resume > ol li{
        margin: 3px 0px 0px 0px;
    padding: 3px 0px 0px 0px;
    color: #084400;
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    }


  nav  li a:hover {
        color: #aaee77;
    }


/*Small View*/

@media handheld, screen and (max-width: 650px) {
    
    .headcon nav{
        display: ;
        float: left;
        
    }
   
       #menu{
        float: right;
        display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
        display: -ms-flexbox;  /* TWEENER - IE 10 */
        display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
        display: -moz-box;
        display: flex;         /* NEW, Spec - Firefox, Chrome, Opera */
        margin: 5px;
       
        
        }
    
     #wrapper{
        margin: auto;
         max-width: 650px;
     }
    
    .headcon{
      
        -webkit-box-flex-direction: row;
        -moz-box-flex-direction:  row;
        -webkit-flex-direction:  row;
        -ms-flex-direction:  row;
        flex-direction: row;
    
    }    
    
    .headcon >.header {
        
        -webkit-box-flex-direction: column;
        -moz-box-flex-direction:  column;
        -webkit-flex-direction:  column;
        -ms-flex-direction:  column;
        flex-direction: column;
        
        -webkit-box-ordinal-group: 1;  
        -moz-box-ordinal-group: 1;     
        -ms-flex-order: 1;     
        -webkit-order: 1;  
        order: 1;
        min-height: 50px;
        max-width: 650px;
       
        padding-top: 10px;
    }
    
     #logo{
        float: left;
        padding-bottom: 15px;
        padding-left: 10px;
    }
    
      nav li a{
        
        display: block;
		width:80%;
		
		padding:3% 15% 3% 5%;
		margin-left: -40px;
		text-decoration: none;
        color:white;
        font-size: 15px;
        font-family: sans-serif;
        background-color: #253025;
        border-bottom: 1px solid #555;
        border-bottom: 1px solid #777;
        
    }
    
    li:first-child {
		margin-top:50px;
    }
    
  ul {
			width:100%;
		}
    
		li {
			width:100%;
			border-right:none;
		}
    
    
    .container {
    margin: auto;
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: -moz-box;
    display: flex;         /* NEW, Spec - Firefox, Chrome, Opera */
        
    -webkit-box-flex-direction: column;
    -moz-box-flex-direction:  column;
    -webkit-flex-direction:  column;
    -ms-flex-direction:  column;
    flex-direction: column;
        
    border: 2px solid #aaa;
    
    }
    
    .container >.left {
    background: #ffffff;

    -webkit-box-ordinal-group: 2;  
    -moz-box-ordinal-group: 2;     
    -ms-flex-order: 2;     
    -webkit-order: 2;  
    order: 2;
        
    max-width:  width: 700px;
    padding: 3% 3% 3% 3%;
    
    }
    
    .container >.right {
    background: #ffffff; 
    margin: auto;
    
    -webkit-box-ordinal-group: 4;  
    -moz-box-ordinal-group: 4;     
    -ms-flex-order: 4;     
    -webkit-order: 4;  
    order: 4;
        
    max-width: 650px; 
    padding: 3% 3% 3% 3%;
}
   
    .right img{
        max-width: 65%;
        margin: auto;
        width: auto;
    
    }
    
    #form {
        margin: 25px;
}
    
    #nav.js {
			display: none;
}
    
}

/*Smallest View*/

@media handheld, screen and (max-width: 400px) {
  
    .right img{
        max-width: 90%;
        margin: auto;
        width: auto;
    
    }
    
    
}

/*Large View*/

@media handheld, screen and (min-width: 651px) {
  
    #wrapper{
    margin: 0 auto;
    max-width: 1000px;
}

.headcon{
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: -moz-box;
    display: flex;         /* NEW, Spec - Firefox, Chrome, Opera */
    
    -webkit-box-flex-direction: row;
    -moz-box-flex-direction:  row;
    -webkit-flex-direction:  row;
    -ms-flex-direction:  row;
    flex-direction: row;
    
    margin: auto;
    
}

.headcon >.header {
    
    -webkit-box-flex-direction: column;
    -moz-box-flex-direction:  column;
    -webkit-flex-direction:  column;
    -ms-flex-direction:  column;
    flex-direction: column;
    
    -webkit-box-ordinal-group: 1;  
    -moz-box-ordinal-group: 1;     
    -ms-flex-order: 1;     
    -webkit-order: 1;  
    order: 1;
    
    min-height: 40px;
    width: 1000px;
    padding-left: 10px;
    padding-top: 10px;
    margin: auto;
}

    #logo{
       
        float: left;
    }
    
    nav a{
        color:white;
        text-decoration: none;
        float: right;
        margin: -5px 10px 10px 10px;
        font-size: 15px;
        font-family: sans-serif;
        
    }
    

.container {
    display: -webkit-box;  /* OLD - iOS 6-, Safari 3.1-6, BB7 */
    display: -ms-flexbox;  /* TWEENER - IE 10 */
    display: -webkit-flex; /* NEW - Safari 6.1+. iOS 7.1+, BB10 */
    display: -moz-box;
    display: flex;         /* NEW, Spec - Firefox, Chrome, Opera */
    
    -webkit-box-flex-direction: row;
    -moz-box-flex-direction:  row;
    -webkit-flex-direction:  row;
    -ms-flex-direction:  row;
    flex-direction: row;    
    
    border: 2px solid #aaa;
    margin: auto;
    max-width: 1000px;
    
}

.container >.left {
    background: #ffffff;

    -webkit-box-ordinal-group: 2;  
    -moz-box-ordinal-group: 2;     
    -ms-flex-order: 2;     
    -webkit-order: 2;  
    order: 2;
    
    width: 700px;
    padding: 3% 3% 3% 3%;
    
}

.container >.right {
    background: #ffffff; 

    -webkit-box-ordinal-group: 4;  
    -moz-box-ordinal-group: 4;     
    -ms-flex-order: 4;     
    -webkit-order: 4;  
    order: 4;
    
    width: 300px; 
    padding: 3% 3% 3% 0%;
}

 #menu{
          
          display: none;
 }








}
