@font-face {
    font-family: Audrey;
    src: url(Audrey/Audrey-MediumOblique.otf);
  }

  @font-face {
    font-family: Canva Sans;
    font-style: normal;
    font-display: swap;
    font-weight: 400 700;
    src: url(https://static-cse.canva.com/_next/static/media/canva-sans-scientific.f236f8e5.woff2) format("woff2"),url(https://static-cse.canva.com/_next/static/media/canva-sans-scientific.d1f2441e.woff) format("woff");
    unicode-range: U+00b1-00b3,U+00b9,U+00bc-00be,U+0394,U+03a9,U+03bc,U+03c0,U+2044,U+2070,U+2074-2089,U+2126,U+212e,U+2153-2154,U+215b-215e,U+2202,U+2206,U+220f,U+2211-2212,U+2215,U+2219,U+221a,U+221e,U+222b,U+2248,U+2260,U+2264-2265,U+25ca
}


body {
    font-family: 'Nunito Sans', sans-serif;
    background-color: #fafafa;
    color: #2C374B;
    margin: 0;
    padding: 0;
}

nav ul {
    float: right;
    list-style: none;
    margin: 0;
    padding: 20px;
  }

  nav li {
    margin-right: 20px;
    float: right;
  }

  nav a {
    color: #fafafa;
    text-decoration: none;
    text-shadow: 0 0 5px rgb(9, 9, 9);
  }

  nav a:hover {
    text-decoration: underline;
    text-underline-offset: 5px;
    text-decoration-color: #D1a080;
  }


header {
    background-color: #2C374B;
    color: #fafafa;
    padding: 10px;
    padding-top: 80px;
    text-align: center;
}

section {
    max-width: 45%;
    margin: 20px auto;
    padding: 20px;
    background-color: #fafafa;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin-top: 20px;
    margin-bottom: 20px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 20px 0px;
    
}

h2 {
    color: #D1a080;
}

a {
    color: #D1a080;
    text-decoration: underline;
}

h3 {
    color: #8F9AB0;
}

ul {
    list-style-type: none;
    padding: 0;
}

li {
    margin-bottom: 10px;
}

.aftercare, .faq, .pricing {
    margin-top: 40px;
}

.pricing table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
}

.pricing th, .pricing td {
    border: 1px solid #2C374B;
    padding: 10px;
    text-align: center;
}


@media (max-width: 500px) {

 nav ul {
    padding: 10px 5px;
    }
  
 nav a {
        font-size: 12px;
    }


 h1 {
    font-size: 28px;
 }
 
 section {
    max-width: 90%;
 }

 header {
    padding-top: 50px;
}


}