@charset "utf-8";
/* CSS Document */
header {padding: 60px;}

#socialmedia {width: 62%; float: right;padding-bottom: 10%}

ul img {height: 40px; margin-left: 20%}


#socialmedia li {display: inline-block; width: 20%;}

#bottom-nav {display: none;}
#navbar1 {display: none}

nav li {display: inline-block; margin: 40px}

li a {color: #FFEA00; text-decoration: none; font-size: 40px; margin-right: 10px;}

.picture, .quote {width:46%; display: inline-block; vertical-align: middle;}

#mc_embed_shell {padding:300px; border-radius: 8px;
    width: 300px;}

#mc_embed_signup {width: 600px}

h2 {vertical-align: middle;width:100%; display: inline-block; margin-bottom: 40px; text-align: center; color:black; background-color: #FFEA00;}


.grid {
  display: flex;
  gap: 20px;
  justify-items: center;}

.button:hover {background-color: green; color:#ddd;}

.item img {
  width: 100%;
  height: 200px;
  object-fit: cover;
	border-radius: 10px;}

.button {display: inline-block;
  background: #FFEA00;
  color: black;
  padding: 10px 25px;
  border: none;
  text-decoration: none;
  font-weight: bold;
border-radius: 10px;}

.picture1 img {width:100%;} 


.picture img {width:100%;} 

body {margin: 0; font-size: 100%; background-color: #686868; font-family: Alexandria;}

#container {padding:60px}


.hamburger {display: none;}


h1 {font-family: Impact; color:#FFEA00; display: inline-block; font-size: 81px; padding-left: 60px; bottom: 90px;}


#navbar {float: right; margin-top: 25px;}



#navbar a {margin: 10px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 17px;}

#navbar a:hover {background-color: #ddd;color: black;}

#navbar a.active {background-color: #FFEA00; color: black;}

#navbar a.active:hover {background-color: green; color:#ddd;}


#navbar1 a:hover {background-color: #ddd;color: black;}


.content {padding: 16px;}

@media screen and (max-width: 1278px) {nav {display: none;}}

@media screen and (max-width: 1238px) {#navbar {display: none;} #navbar1 {display: inline-block; margin-left: 200px}
	#mc_embed_shell {padding:120px; margin-left: 170px;}
#container {padding:174px}
	.grid {flex-wrap: wrap;}
	
	.item img {height:auto; width: 100%; display:block;}
	
	.button {text-align: center;
    padding: 10px;
    font-size: 1em;}


#navbar1 a {margin: 25px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 15px;}
	
	.hamburger {display: block; float: right; width: 100px; height: auto; margin-top: 40px;} 
	.hamburger img {width: 100%; height: auto;} 
	#bottom-nav {display: block; font-family: Alexandria; margin-left: 34%; padding-bottom: 50px;}		
	#socialmedia {padding-top: 10%}
	#bottom-nav li a {color: #FFEA00; font-size: 20px}

	.quote {width:100%} 
	
	.picture {width: 100%;}}

@media screen and (max-width: 976px) {#navbar {display: none;} #navbar1 {display: inline-block; margin-left: 100px}
	#mc_embed_shell {padding:120px; margin-left: 50px;}
#container {padding:174px}
	.grid {flex-wrap: wrap;}
	
	.item img {height:auto; width: 100%; display:block;}
	
	.button {text-align: center;
    padding: 10px;
    font-size: 1em;}

#navbar1 a {margin: 25px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 15px;}
	
	.hamburger {display: block; float: right; width: 100px; height: auto; margin-top: 40px;} 
	.hamburger img {width: 100%; height: auto;} 
	#bottom-nav {display: block; font-family: Alexandria; margin-left: 28%; padding-bottom: 50px;}		
	#socialmedia {padding-top: 10%}
	#bottom-nav li a {color: #FFEA00; font-size: 20px}

	.quote {width:100%} 
	
	.picture {width: 100%;}}

@media screen and (max-width: 878px) {#navbar {display: none;} #navbar1 {display: inline-block; margin-left: 60px}
	#mc_embed_shell {padding:120px; margin-left: 0;}
#container {padding:174px}
	.grid {flex-wrap: wrap;}
	
	.item img {height:auto; width: 100%; display:block;}
	
	.button {text-align: center;
    padding: 10px;
    font-size: 1em;}

#navbar1 a {margin: 25px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 15px;}
	
	.hamburger {display: block; float: right; width: 100px; height: auto; margin-top: 40px;} 
	.hamburger img {width: 100%; height: auto;} 
	#bottom-nav {display: block; font-family: Alexandria; margin-left: 26%; padding-bottom: 50px;}		
	#socialmedia {padding-top: 10%}
	#bottom-nav li a {color: #FFEA00; font-size: 20px}

	.quote {width:100%} 
	
	.picture {width: 100%;}}

@media screen and (max-width: 842px) {#navbar {display: none;} #navbar1 {display: inline-block; margin-left: 5px}
	#mc_embed_shell {padding:92px; margin-left: 0;}
#container {padding:174px}
	.grid {flex-wrap: wrap;}
	
	.item img {height:auto; width: 100%; display:block;}
	
	.button {text-align: center;
    padding: 10px;
    font-size: 1em;}

#navbar1 a {margin: 25px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 15px;}
	
	.hamburger {display: block; float: right; width: 100px; height: auto; margin-top: 40px;} 
	.hamburger img {width: 100%; height: auto;} 
	#bottom-nav {display: block; font-family: Alexandria; margin-left: 26%; padding-bottom: 50px;}		
	#socialmedia {padding-top: 10%}
	#bottom-nav li a {color: #FFEA00; font-size: 20px}

	.quote {width:100%} 
	
	.picture {width: 100%;}}

@media screen and (max-width: 780px) {#navbar {display: none;} #navbar1 {display: inline-block; margin-right: 200px}
	#mc_embed_shell {padding:72px; margin-left: 0;}
#container {padding:174px}
	.grid {flex-wrap: wrap;}
	
	.item img {height:auto; width: 100%; display:block;}
	
	.button {text-align: center;
    padding: 10px;
    font-size: 1em;}

#navbar1 a {margin: 25px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 15px;}
	
	.hamburger {display: block; float: right; width: 100px; height: auto; margin-top: 40px;} 
	.hamburger img {width: 100%; height: auto;} 
	#bottom-nav {display: block; font-family: Alexandria; margin-left: 26%; padding-bottom: 50px;}		
	#socialmedia {padding-top: 10%}
	#bottom-nav li a {color: #FFEA00; font-size: 20px}

	.quote {width:100%} 
	
	.picture {width: 100%;}}

@media screen and (max-width: 742px) {#navbar {display: none;} #navbar1 {display: inline-block; margin-right: 200px}
	#mc_embed_shell {padding:46px; margin-left: 0;}
#container {padding:174px}
	.grid {flex-wrap: wrap;}
	
	.item img {height:auto; width: 100%; display:block;}
	
	.button {text-align: center;
    padding: 10px;
    font-size: 1em;}

#navbar1 a {margin: 25px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 15px;}
	
	.hamburger {display: block; float: right; width: 100px; height: auto; margin-top: 40px;} 
	.hamburger img {width: 100%; height: auto;} 
	#bottom-nav {display: block; font-family: Alexandria; margin-left: 26%; padding-bottom: 50px;}		
	#socialmedia {padding-top: 10%}
	#bottom-nav li a {color: #FFEA00; font-size: 20px}

	.quote {width:100%} 
	
	.picture {width: 100%;}}

@media screen and (max-width: 686px) {#navbar {display: none;} #navbar1 {display: inline-block; margin-right: 155px}
	#mc_embed_shell {padding:13px; margin-left: 0;}
#container {padding:174px}
	.grid {flex-wrap: wrap;}
	
	.item img {height:auto; width: 100%; display:block;}
	
	.button {text-align: center;
    padding: 10px;
    font-size: 1em;}

#navbar1 a {margin: 25px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 15px;}
	
	.hamburger {display: block; float: right; width: 100px; height: auto; margin-top: 40px;} 
	.hamburger img {width: 100%; height: auto;} 
	#bottom-nav {display: block; font-family: Alexandria; margin-left: 20%; padding-bottom: 50px;}		
	#socialmedia {padding-top: 10%}
	#bottom-nav li a {color: #FFEA00; font-size: 20px}

	.quote {width:100%} 
	
	.picture {width: 100%;}}

@media screen and (max-width: 580px) {#navbar {display: none;} #navbar1 {display: inline-block; margin-right: 100px}
	#mc_embed_shell {padding:13px; margin-left: -40px;}
#container {padding:174px}
	.grid {flex-wrap: wrap;}
	
	.item img {height:auto; width: 100%; display:block;}
	
	.button {text-align: center;
    padding: 10px;
    font-size: 1em;}

#navbar1 a {margin: 25px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 15px;}
	
	.hamburger {display: block; float: right; width: 100px; height: auto; margin-top: 40px;} 
	.hamburger img {width: 100%; height: auto;} 
	#bottom-nav {display: block; font-family: Alexandria; margin-left: 18%; padding-bottom: 50px;}		
	#socialmedia {padding-top: 10%}
	#bottom-nav li a {color: #FFEA00; font-size: 20px}

	.quote {width:100%} 
	
	.picture {width: 100%;}}