/* CSS MARKWHITINGDAVIS.COM/CONTACT */
			
body 
	{
	width: 100%;
	margin: 0 auto;
    background-color: #cdc1c3; 
    background-image:url('../images/autumn_leaves_bg.jpg');
    background-size: cover;
	color: #665544;
	}

	#header 
		{
	    width: 95%;
	    height: 94px;
	    margin: 0 auto 10px;
		border-bottom: 5px solid rgba(50,100,50,.5);	
		}
	
		#header img
			{
	    	width:190px;
			float: left;
			margin: 12px 0 0 1%;
			}
            
	
            
/* START NAVIGATION */    
 nav {
    margin:10px 1% 0 0;
	float:right;              
    font-family: MyriadPro-Regular, 'Myriad Pro Regular', MyriadPro, 'Myriad Pro', Helvetica, Arial, sans-serif;
    font-weight:lighter;
    }


	#menu-icon {
		display: hidden;
		margin-right: 10px;
		margin-top: 12px;
		width: 40px;
		height: 40px;
		background: black url(images/menu-icon.png) center;
		}
		

    nav ul ul {
        display: none;
        z-index: 2;        
    	}

        nav ul li:hover > ul {                       
            display: block;
            }


    nav ul {
        margin: 0 auto;                       
        background: none;        
        list-style: none;
        position: relative;
        display: table;                
        width: 100%;                            
            }
    
/*
        nav ul:after 
            {
            content: ""; clear: both; display: block; 
            }
*/
    

        nav ul li 
            {
            display:inline-block;
			padding: 8px 2px; 
            line-height: 15px;
            }
            
                        
      nav li.current 
            {
            background-color: rgb(150,150,150);
            }

            nav ul li:hover {
                background-color: rgb(50,50,50);
            }
    
            nav ul li:hover a {
                color: #fff;               
            }            
                        
            nav ul li a {               
				padding: 5px; 
                color: black;
                text-decoration: none;                
            }

                nav ul ul {
                    background: none;
                    position: absolute; width:80px;
                    border-radius: 0px;
					margin-top: 8px;
					margin-left: -65px;
					}
                              
                    nav ul ul li {                       
                        background: rgb(100,100,100);;
                        border: none;
                        text-align: center;
                        width:100px;
                        padding: 8px;                       
                    	}
                    
                    ul.words {                       
                        margin-left: -100px;                       
                    }
                    
                    li.words {                       
                        width:170px;                        
                    }
                                        
                        nav ul ul li a {
                            color: #fff;
                        }
                        	
                        nav ul ul li a:hover {                                
                            }

                nav ul ul ul {
                    position: absolute; left: 100%; top:0;
        			}                 							
/* END NAVIGATION */ 	
            
                    

            
            .center {
				display: block;
				margin-left: auto;
				margin-right: auto;
				width: 90%;
				}
				
				.center img{
					width:100%; 

                        
            		}

      /* START CONNECT */


        #connect { 

            margin:0 auto;
            min-width: 380px; width:80%; border: 0px solid black;
            height:420px;             
            padding:8px;
            vertical-align:middle; 
            }
            
            .offset:before { 
/*                 display: block;  */
                content: " "; 
                height: 20px; /* Give height of your fixed element */
                margin: 0 0 0 -20px; /* Give negative margin of fixed element */ visibility: hidden; 
            }

             #connect h1{
	             text-align: center;
	             }
            

        	.container {
            	width: 365px;
              	height: 300px;
              	margin:0 auto;
              	background-image: repeating-linear-gradient(135deg, #F29B91 0px, #F09290 20px, transparent 30px, transparent 50px, #83B3DB 50px, #84ADCB 80px, transparent 60px, transparent 100px);
              	padding: 12px;
                }

            .container .inner {
                margin: -15px 0 0 0;
                background: white;
                width: 100%;
                height: 100%;
                }

            /* END CONNECT */

  
            
			 #footer {
                margin: 15px auto;
                background-color: rgba(50,100,50,.5);
                border-radius: 2px;                
                width:95%;
				min-width: 350px; 
				text-align: center;                                                      
            }
            
             #footer p {
	             color:black;
	             font-size: .8em;
	             line-height: 1.2em;
	             padding:5px 0;
             }
			

/*MEDIA QUERY*/
@media only screen and (max-width : 640px) {

	header {
		position: absolute;
	}

	#menu-icon {
		display:inline-block;
		}

		nav ul, nav:active ul { 
			display: none;
			position: absolute;
			padding: 15px 0;
			background: rgb(200,200,200);
/* 			border: 1px solid yellow; */
			right: 20px;
			top: 60px;
			width: 148px;
			border-radius: 4px 0 4px 4px;
			}
			
		nav:hover ul {
			display: block;
			}
			
		nav:hover ul ul {
			display: none;
			width:200px;
			margin-left: -30px;
			}
			

		nav ul li {
			text-align: center;
			width: 100%;
			padding: 18px 0;
			margin: -9px 0;
			}
			
			nav ul ul li {
				text-align: center;
				width: 150px;
				padding: 18px 0;
				margin: 0;
				}

	
		nav ul:hover ul { 
			position: absolute;
			background: none;
			border: none;
			left: -120px;
			top: 0px;
			width: 25%;
			border-radius: 4px 0 4px 4px;
			}