@font-face{
    font-family:gant;
    src:url("fonts/Gantari-Regular.otf")
}
@font-face{
    font-family:gant-bold;
    src:url("fonts/Gantari-Bold.otf")
}
@font-face{
    font-family:gant-italic;
    src:url("fonts/Gantari-Italic.otf")
}
@keyframes pandown{
    from {background-position: top;}
    to {background-position: bottom;}
}
@keyframes panup{
    from {background-position: bottom;}
    to {background-position: top;}
}
body{
	background-image: url("images/topobg.png");
	background-size: cover;
	animation-name: panup;
	animation-duration: 30s;
    margin: 0;
    padding: 0;
}
.nav-bar{
    text-align: center;
    margin: 0;
    padding: 0;
}
.center{
    text-align: center;
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
}
.menu-bar{
    background-color: #455b08;
    overflow: hidden;
    padding: 10px 0;
}
.testimonials{
    background-color: #455b08;
    justify-content: center;
    overflow: hidden;
    padding: 10px 0;
}
.menu-bar a{
    text-align: center;
    padding: 5px;
    text-transform: uppercase;
    text-decoration: none;
    font-size: large;
    color: white;
    font-family: gant-bold;
}
.menu-bar a:hover{
    color: #bcbab8;
}
.menu-bar a.active{
    color: #bcbab8;
}
.logo{
    text-align: center;
    padding: 20px;
}
.content-bar{
    margin:10px 20% 10px 20%;
    padding:0;
}
h1{
    font-family: gant-bold;
    text-align: center;
    color: #455b08;
    font-size: xx-large;
}
h2{
    font-family: gant-bold;
    text-align: center;
    color: #455b08;
    font-size: x-large;
}
h3{
    font-family: gant-bold;
    text-align: center;
    color: #455b08;
    font-size: large;
}
h3 a {
    color: #455b08;
}
p{
    font-family: gant;
    text-align: left;
}
p a{
    color: inherit;
}
p.center{
    text-align: center;
}
li {
    font-family: gant;
    text-align: left;
    margin-left: 15px;
}
.tile{
    margin: 20px;
    padding: 15px;
    float: left;
    background-color: rgba(188,186,184,0.45);
    width: 25%;
    ming-height: 600px;
    border-radius: 10px;
}
.tile:hover{
    opacity: 0.75;
}
.respond{
    width: 85%;
    max-width: 360px;
}
.gallery{
    margin: 3%;
    float: left;
    width: 27%;
}
.footer{
    display: table;
    clear: both;
    padding-top: 32px;
    padding-bottom: 32px;
    display: block;
    width: auto;
    text-align: center;
    color: white;
    background-color: #bcbab8;
}
.socials{
    font-size: 24px;
    padding-top: 32px;
    padding-bottom: 32px;
}
div.gallery {
  margin: 5px;
  float: left;
  width: 180px;
}
div.gallery:hover {
  opacity:0.5
}
div.gallery img {
  width: 100%;
  height: auto;
}
div.desc {
  padding: 15px;
  text-align: center;
}