@charset "utf-8";
/* CSS Document */

body {font-family:Arial;
	color:black;
	line-height:1.5em;}

/*header*/
nav#headernav li {list-style:none;}

#icon{display:none}

nav#headernav li a{float:right;
text-decoration: none;
color:black;
font-family:"Myriad Pro","Gill Sans", Helvetica, Arial, "sans-serif";
margin-right: 20px;
font-size: 15px;
margin-top:42px;}

#logo{float:left;
	width:200px;}

#icon{
margin-top:30px;
padding-right:20px;}

.clearfix{clear:both;}
/*end header*/

/*valueprop*/
#valueprop h1{text-align: center;
margin-bottom:180px;
margin-top:150px;}

h1{font-family:Cooper Black, Arial black,Lucida sans;
line-height: 1.4em;
font-size:50px;}
/*end of valueprop*/

/*main*/
#main{text-align: center;
     margin-top:150px;
     margin-left: auto;
     margin-right:auto;} /*150px*/

.cookieset{display:inline-block;
width:28%;
vertical-align: top;
margin-right:2%;
margin-left:2%} /*80px*/

#main p{
text-align: left;}

#main p{color:#7b5f50;}

#main span{color:#b48758;}

#main img{border-radius: 50%;
border-style:double;
border-width:thick;
border-color:#654321;
width:96%;
height:auto;}

#main h2{font-family:Arial Bold, Arial, Arial Black;
text-align: left;}
/*end main*/

/*order*/
#order{margin-top:150px;
margin-bottom:350px;
text-align: center;}

#order h1{font-family:Lucidia Sans;
font-size:50px;
color:#795e4f;}

h2{color:#2c2c2b;}

.curbside{background-color:#2c2c2b;
padding:10px;
margin-right:10px;
color:white;}

.pickup{background-color:#2c2c2b;
padding:10px;
margin-right:10px;
color:white;}

.delivery{background-color:#2c2c2b;
padding:10px;
margin-right:10px;
color:white;}

.shipping{background-color:#2c2c2b;
padding:10px;
color:white;}

#order a{text-decoration:none;
font-family:Arial;
}

#movement{display:inline-block}
/*end order*/

/*form*/
#form{width:100%;
background-color:#b3875a;
font-family:Arial;
padding:20px;
padding-top:30px;
padding-bottom:40px;
margin-bottom:200px;
margin-left:-10px;}

#form img{float:left;
margin-right:50px;
margin-top:-240px;
margin-left:-10px}

#form h2{font-family: Lucida Sans;
margin-bottom:50px;}

#form a {color:black;}

input[type="submit"]{display:block;
border-radius: 20px;
margin-top:20px;
margin-left:40px;
margin-bottom:40px;
padding-top:5px;
padding-left:40px;
padding-right:80px;
padding-bottom:20px;
width:75px;
height:20px;
background-color:#2c2c2b;
color: white;}

#button {
padding-top:10px;
padding-bottom:10px;}
/*end form*/

/*footer*/
footer p{text-align: center;
font-family: "Myriad Pro", Arial;
line-height: 1.45em}

nav#footernav{margin-top:240px;}

nav#footernav li {list-style:none;
margin-top:10px;}

nav#footernav li a{
text-decoration: none;
color:black;
font-family:"Myriad Pro",Arial, "sans-serif";}

#footernav{margin-top:100px;
margin-bottom:100px;}

#footernav{text-align: center;}

#socials{text-align: center;}

#socials li{display:inline-block;
vertical-align: top;
list-style:none;
margin-bottom:20px;
margin-right:20px;}
/*end footer*/

/*media queries*/
@media screen and (max-width:930px){
	#headernav{display: none;}
	
	#icon {display:block;
		float:right;}
	
	#form{width:100%;
	margin-left:-10px;}
	
	#form img{width:40%;}
	
	#button{align-content: left;}
	
	#form h2{align-content: left;}
	
	#movement{display:inline-block}
}
		
@media screen and (max-width:650px){
	
	.cookieset {display:block;
	            width:60%;
	            margin-left:auto;
	            margin-right:auto;
	            margin-bottom:80px;}
	
	#form{margin-left:-10px;}
	
	#form img{margin-top:-240px;
	           width:30%}
	
	#order {margin-bottom:220px;}
	
	#movement{display:inline-block}
	
}
	
	@media screen and (max-width:515px){
		#valueprop h1{font-size:45px;}
		
		#logo img{width:235px;}
		
		#icon{margin-top:20px;}
		
		.cookieset{width:90%;}
		
		nav#footernav{margin-top:110px;
		margin-left:auto;
		margin-right:auto;}
		
		#footernav{margin-top:20px;}
		
		#form{margin-bottom:0px;
		text-align:center;
		margin-left:-10px;}
		
		#form h2{margin-top:-100px;
		text-align: center;}
		
		#form img{float:none;
		margin-left:auto;
		margin-right:auto;
		width:50%;
		margin-top:-200px;}
		
		#button{margin-left:80px;}
		
		.phone-image{text-align: center;}
		
		#movement{display:inline-block;}
		
}
    @media screen and (max-width:387px){
	    #movement{margin-top:40px;}
		
		#form{margin-left:-10px;}
	
}
		
	@media screen and (max-width:375px){
		
		#form h2{margin-top:-160px;
		margin-left:-25px;}
		
		#form img{margin-left:-25px;}
		
		#form{margin-left:-10px;}
		
		#form p{margin-left:-25px;}
		
		#button{margin-left:0px}
		
		#movement{margin-top:40px;}
		
	}