@charset "utf-8";
/* CSS Document */
body {margin: 0; font-size: 100%; background-color: #686868; font-family: Alexandria; color: #FFFFFF;  padding: 0;}

.container {width: 615px;
  margin: 0 auto;
  padding: 20px;
  background-color: #444;
  border-radius: 8px;}

#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;}

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

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


.hamburger {display: none;}

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

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

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

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

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

#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;}

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

header {padding: 60px;}

.hamburger {display: none;}

.container {
    width: 615px;
    margin: 0 auto;
    padding: 20px;
    background-color: #444;
    border-radius: 8px;
}


.contact-button {
    background-color: #FFEA00;
    color: #000;
}

.contact-form h1 {
    color: #FFEA00;
    text-align: center;
    margin-bottom: 20px;
}

.contact-form form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.contact-form label {
    font-size: 16px;
}

.contact-form input,
.contact-form textarea {
    padding: 10px;
    border: none;
    border-radius: 4px;
    background-color: #fff;
    color: black;
}

.contact-form textarea {
    height: 150px;
    resize: none;
}

.submit-button {
    padding: 10px;
    border: none;
    border-radius: 4px;
    background-color: #FFEA00;
    color: black;
    cursor: pointer;
    align-self: flex-end;}


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

@media screen and (max-width: 1238px) {#navbar {display: none;} 
	#navbar1 {display: inline-block; margin-left: 0px}
	#navbar1 a {margin: 70px;
  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 {display: block; font-family: Alexandria; margin-left: 34%; padding-bottom: 50px;}	
	#bottom-nav li a {color: #FFEA00; font-size: 20px}
	.image-gallery img {max-width: 100%;
    border-radius: 8px;}}
@media screen and (max-width: 1118px) {#navbar {display: none;} 
	#navbar1 {display: inline-block; margin-left: -29px}
	#navbar1 a {margin: 70px;
  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 {display: block; font-family: Alexandria; margin-left: 34%; padding-bottom: 50px;}	
	#bottom-nav li a {color: #FFEA00; font-size: 20px}
	.image-gallery img {max-width: 100%;
    border-radius: 8px;}}

@media screen and (max-width: 1108px) {#navbar {display: none;} 
	#navbar1 {display: inline-block; margin-right: -12px}
	#navbar1 a {margin: 70px;
  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 {display: block; font-family: Alexandria; margin-left: 30%; padding-bottom: 50px;}	
	#bottom-nav li a {color: #FFEA00; font-size: 20px}
	.image-gallery img {max-width: 100%;
    border-radius: 8px;}}

@media screen and (max-width: 1092px) {#navbar {display: none;} 
	#navbar1 {display: inline-block; margin-right: 280px}
	#navbar1 a {margin: 70px;
  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 {display: block; font-family: Alexandria; margin-left: 30%; padding-bottom: 50px;}	
	#bottom-nav li a {color: #FFEA00; font-size: 20px}
	.image-gallery img {max-width: 100%;
    border-radius: 8px;}}

@media screen and (max-width: 824px) {#navbar {display: none;} 
	#navbar1 {display: inline-block; margin-right: 139px}
	#navbar1 a {margin: 70px;
  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 {display: block; font-family: Alexandria; margin-left: 20%; padding-bottom: 50px;}	
	#bottom-nav li a {color: #FFEA00; font-size: 20px}
	.image-gallery img {max-width: 100%;
    border-radius: 8px;}}

@media screen and (max-width: 690px) {#navbar {display: none;} 
	#navbar1 {display: inline-block; margin-right: 60px}
	#navbar1 a {margin: 70px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 15px;}
	
	.container {margin-left: -44px;}
	
	.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 {display: block; font-family: Alexandria; margin-left: 18%; padding-bottom: 50px;}	
	#bottom-nav li a {color: #FFEA00; font-size: 20px}
	.image-gallery img {max-width: 100%;
    border-radius: 8px;}}

@media screen and (max-width: 598px) {#navbar {display: none;} 
	#navbar1 {display: inline-block; margin-right: 20px}
	#navbar1 a {margin: 70px;
  float: right;
  display: inline-block;
  color: #FFEA00;
  text-align: center;
  padding: 16px 16px;
  text-decoration: none;
  font-size: 15px;}
	
	.container {margin-left: -44px;}
	
	.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 {display: block; font-family: Alexandria; margin-left: 20%; padding-bottom: 50px;}	
	#bottom-nav li a {color: #FFEA00; font-size: 20px}
	.image-gallery img {max-width: 100%;
    border-radius: 8px;}}


