/* <!-- font-family:'Brawler', serif;-->
<!-- font-family:'Trocchi', serif;-->
<!-- font-family:'Sansita', sans-serif;--> */
*
{margin: 0;
padding: 0;
box-sizing: border-box;}

header {
background-color: black;
padding: 200px 100px;
background-image: url(Images/Header.jpg);
background-size: cover;}
h1 {
font-family: 'Sansita', sans-serif;
color: white;
font-size: 100px;
text-shadow: rgba(0, 0, 0, 0.548) 4px 5px 3px;}
header h4 {
font-family: 'Sansita', sans-serif;
color: #ffffff;
font-size: 50px;
margin-bottom: 40px;
text-shadow: rgba(0, 0, 0, 0.445) 6px 6px 6px;}
header a {
background-color: #AF2106;
padding: 15px;
border-radius: 30px;
color: white;
font-weight: 400;
font-size: 20px;
text-transform: uppercase;
text-decoration: none;}

body { background-color: #F7F3E1;}
h1 {font-family: "Sansita", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 45px;}
h4 {font-family: "Sansita", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 45px;}
h2 {font-family: "Sansita", sans-serif;
  font-weight: 900;
  font-style: normal;
  font-size: 40px;}
p {font-family: "Brawler", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 20px;
  margin-bottom: 20px;}
h3 {font-family: "Trocchi", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 30px;}
ul {font-family: "Brawler", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 20px;}
  
  nav {
background-color: #73BF64;
position: fixed;
padding: 10px 100px;
width: 100%;
border-bottom: 2px solid white;
z-index:10;}

nav a {
font-family: "Trocchi";
color: white;
font-size: 24px;
text-decoration: none;
font-weight: bold;
margin: 5px;}

nav a:hover {
color: #FBD658;}

#twentyweeks {
background-image: url(Images/TwentyWeeks.jpg);
background-size: cover;
text-align: center;
padding: 120px 50px 100px 50px;}

h5{
font-family: "Trocchi", serif;
color: white;
font-size: 50px;
text-shadow: rgba(0, 0, 0, 0.62) 6px 6px 10px;
margin-bottom: 50px;}

#twentyweeks a {
background-color: #AF2106;
padding: 15px;
border-radius: 30px;
color: white;
font-weight: 400;
font-size: 20px;
text-transform: uppercase;
text-decoration: none;}

#twentyweeks a :hover{
background-color:#AF2106;
color:white;}

#meetyourfarmer {
background-image: url(Images/FarmerBackground.jpg);
background-size: cover;
text-align: center;
padding: 100px 50px 100px 50px;
justify-content: center;
border-top: 3px snow;
border-bottom: 3px snow;
display: flex;}

#meetyourfarmer p {
line-height: 24px;
color:white;
width:600px;}

footer {
background-color: #73BF64;
padding: 15px 50px 5px 50px;
color: white;}
footer a:hover {
color: #FBD658;}
footer div a {
color: #87663B;
font-size: 30px;
padding-right: 5px;
padding-top: 10px;}
footer div a:hover {
 color: white;}

 #produce{
  padding-left: 100px 0;
  text-align: center;}
  #produce img{
  margin: 10px;}
nav a {
color: white;
text-decoration: none;
font-size: 24px;
font-weight: bold;}

nav .logo{
font-family: "Trocchi", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 20px;}
nav .logo a{
color: white;}

footer a{color:white}

footer{
background-color: #73BF64;
padding: 15px 50px 5px 50px;
color: white;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap-reverse;}
footer div{
color: #CCD683;
font-size: 30px;
padding-right: 5px;
padding-top: 10px;
display: flex;
flex-direction: row;}

#produce { padding: 50px;}
#produce img
{
width:300px;
margin: 10px;
border: 1px solid #fff;
max-width: 300px;}
#produce div{
display:flex;
flex-wrap:wrap;
justify-content:center;}

#boxes {padding: 50px 100px;}
#boxes h2 {margin-bottom: 40px;}
#boxes div{
display: flex;
justify-content: space-evenly;
flex-wrap: wrap;}

.juan
{margin-right: 20px;}

nav{
background-color: #73BF64;
position: fixed;
padding: 10px 100px;
width: 100%;
border-bottom:2px solid white;
z-index:10;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center;}