html, body {
  background-color: #fff8ee;
  font-family: var(--main-font);
  font-size: var(--content-size);
  margin:0;
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--main-font);
}
:root {
  --main-font: 'Libre Franklin', sans-serif;
  --nav-font: 'Raleway', sans-serif;
  --main-hyper-color: #e67f53;
  --title-color: #c34b00;
  --nav-font-size: 18px;
  --heading-size: 43px;
  --heading-footer-size: 18px;
  --sub-heading-size: 36px;
  --content-size: 16px;
  --content-footer-size: 12px;
}
#logo_container {
  padding: 3vh 0;
  text-align: center;
}
.the_logo {
  display:flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;
}
.the_logo img {
  padding-left: 10px;
  padding-right: 10px;
}
.logo-side-content {
  font-family: 'Prata', serif;
  color: var(--title-color);
  font-size: var(--content-size);
}
.logo-dots {
  font-size: var(--content-size);
}
.logo-services {
  font-family: 'Prata', serif;
  font-size: var(--content-footer-size);
  color: var(--title-color);
  letter-spacing: 1px;
}
.title {
  font-family: 'Prata', serif;
  color: var(--title-color);
  margin: 0;
  padding: 0;
}
.slogan {
  font-family: 'Dancing Script', cursive;
  color: var(--title-color);
  font-size: 25px;
  margin: 0;
  padding: 0;
}

.uk-navbar-container:not(.uk-navbar-transparent) {
    background-color: #fff8ee !important;
}
.uk-navbar-nav li a {
  font-family: var(--nav-font);
  font-size: var(--nav-font-size);
}
.uk-navbar-nav li a:hover {
  color: var(--main-hyper-color);
}
.uk-navbar-nav > li.uk-active > a {
  color:var(--main-hyper-color);
}
#divider_aboutme {
  margin-top: 30px;
}
#about_me {
  padding-top: 3vh;
  background-color: #ffeed6;
}
#about_me h2,#about_me h3, #about_me p {
  color: black;
}
#about_me h2 {
  font-weight: 700;
  font-size: 43px;
  text-transform: uppercase;
  margin: 0;
}
#about_me h3 {
  font-weight: 700;
  font-size: 18px;
  text-transform: uppercase;
  margin: 0;
}
a.get_in_touch {
  font-size: var(--content-size);
  font-weight: 700;
  color: black !important;
  background-color: #ffdcab !important;
  border: white 1px solid !important;
}
a.get_in_touch:hover {
  color: black !important;
    background-color: #ffe4c2 !important;
}
#contact {
  padding-top: 10vh;
  background-color: white;
}
#contact h2 {
  font-weight: 700;
  font-size: 29px;
  color: black;
  text-transform: uppercase;
  margin: 0;
  padding-top: 20px;
}
#contact p {
  color: black;
}
.center_me {
  text-align: center;
}
footer {
  padding: 0;
}
#divider_aboutme {
  background-image: url(https://www.theshotshelf.com/img/about-top.svg);
  height: 169px;
  background-position:center;
  background-size: cover;
  background-repeat: no-repeat;
}
#divider_contact {
  background-color: white;
  background-image: url(https://www.theshotshelf.com/img/wave2.svg);
  height: 169px;
  background-position:center;
  background-size: cover;
  background-repeat: no-repeat;
}
#divider_footer {
  background-color: white;
  background-image: url(https://www.theshotshelf.com/img/footer.svg);
  height: 169px;
  background-position:center;
  background-size: cover;
  background-repeat: no-repeat;
}
.copyright {
  text-align: center;
  border-right: dotted 2px #e67f53;
  padding: 30px 0;
}
.copyright h3 {
  color: #c05702;
  font-size: var(--content-footer-size);
  text-transform: uppercase;
  margin: 0.8rem 0;
  padding: 0;
}
.copyright p {
  color: #c05702;
  font-size: var(--content-footer-size);
  text-transform: uppercase;
  margin: 0;
  padding: 0;
}
.footer_nav_position {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0 !important;
}

.footer_nav_position nav {
  width: 100%;
  border-top: dotted 2px #e67f53;
}
.footer_nav_position nav ul {
  display: flex;
  flex-direction: row;
  list-style-type: none;
  margin: 0;
  padding: 30px;
}
.footer_nav_position nav a {
  font-size: var(--content-footer-size);
  color: #c05702;
  text-transform: uppercase;
  padding: 0 15px;
}
.footer_nav_position nav a:hover {
  color: #fc684e;
}
.social_media {
  display: flex;
  text-align: left;
  justify-content: center;
  flex-direction: column;
  height: 100%;
}
.social_media h3, .social_media p {
  padding-left: 20%;
  margin: 0;
}
.social_media h3 {
  color: #c05702;
  font-size: 17px;
  font-weight: 700;
  text-transform: uppercase;
}
.social_media a {
  color: #c05702;
  font-size: 39px;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0;
}
.social_media a:hover {
  color: #fc684e;
}
#footer-logo {
  padding: 3vh 30px;
}
/* Responsive Media Queries*/
@media screen and  (max-width: 450px) {
  #logo_container {
    padding-left: 30px;
    padding-right: 30px;
  }
  .logo-side-content {
    display: none;
  }
  .uk-navbar-nav li a {
    font-size: 16px;
  }
  #about_me h2 {
    font-size: 35px;
    margin-bottom: 20px;
  }
  #about_mea h3 {
    font-size: 16px;
  }
}
@media screen and  (max-width: 960px) {

    .social_media { 
      text-align: center;
    }
    .social_media h3, .social_media p {
      padding: 0;
    }
    #divider_aboutme {
      margin: 0;
      padding: 0;
    }
    #about_me {
      padding: 0;
    }
    #bottom_nav {
      margin: 30px 0;
    }
    .copyright {
      padding: 0;
      border: none;
    }
    .footer_nav_position nav { 
      border: 0;
    }
    .footer_nav_position nav ul {
      flex-direction: column;
      text-align: center;
      padding: 0;
    }
    .footer_nav_position {
      display: none
    }
    .bottom_logo {
      padding-left: 10px;
    }
}

@media screen and  (max-width: 1380px) {

}