body,
html {
    background: #FFDE0A;
    background: -webkit-linear-gradient(90deg, rgba(255, 222, 10, 1) 0%, rgba(255, 179, 0, 1) 100%);
    background: -moz-linear-gradient(90deg, rgba(255, 222, 10, 1) 0%, rgba(255, 179, 0, 1) 100%);
    background: linear-gradient(90deg, rgba(255, 222, 10, 1) 0%, rgba(255, 179, 0, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFDE0A", endColorstr="#FFB300", GradientType=1);
}

html {
    scroll-behavior: smooth;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
.nav-link,
.navbar-brand,
.btn {
    font-family: 'Nunito', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
}

.nav-link {
    font-weight: bold;
}

.nav-link:hover {
    transition: all .3s ease;
    transform: scale(1.2);
    color: #f8a304;
}

h2 {
    font-size: 2.5em;
    font-weight: bold;
}

.offcanvas-end {
    width: 250px;
}

.navbar-brand img {
    max-height: 50px;
}

img#verifimg {
    cursor: pointer;
}

nav {
    background-color: rgba(255, 255, 255, 0.911);
}

.home-jumbotron {
    /*background-color: #000000;*/
    background-image: url(/assets/img/jumbotron-image-2.webp);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 5em 0;
}

.text-shadow {
    text-shadow: 4px 3px 4px rgba(0, 0, 0, 0.623);
}

shadow {
    box-shadow: 4px 3px 4px rgba(0, 0, 0, 0.623);
}

.welcome-section {
    /* background-color: #2F9EC0;
    color: white;*/
    background-color: #8edcf5;
    color: #002836;
    padding: 4em 0;
}

.customer-section {
    /* background-color: #FF9C26;*/
    color: white;
    /*padding: 4em 0;*/
    background-image: url(/assets/img/customer-section-1.webp);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

img .paws {
    display: inline-block;
    vertical-align: middle;
}

.reviews-row .review-item {
    background-color: rgba(255, 255, 255, 0.548);
    color: black;
    padding: 1em;
    border-radius: 1em;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.contact-section {
    background-color: #c2df99;
}

#scrollTopBtn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 999;
    display: none;
    width: 40px;
    height: 40px;
    font-size: 1.5rem;
    line-height: 1;
}

.aboutus-section {
    background-image: url(/assets/img/aboutus-paws-track-bg.webp);
    background-size: contain;
    padding: 2em;
}

.about-us-text {
    background-color: rgba(255, 255, 255, 0.678);
}

section.services-section {
    color: #000000;
    background-color: #d9e7ff;
    background: #d9e7ff;
    background: -webkit-linear-gradient(90deg, rgba(227, 255, 231, 1) 0%, rgba(217, 231, 255, 1) 100%);
    background: -moz-linear-gradient(90deg, rgba(227, 255, 231, 1) 0%, rgba(217, 231, 255, 1) 100%);
    background: linear-gradient(90deg, rgba(227, 255, 231, 1) 0%, rgba(217, 231, 255, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#E3FFE7", endColorstr="#D9E7FF", GradientType=1);
}

.services-section h3 i {
    background-color: white;
    border-radius: 100%;
    padding: 0.4em;
}

.service-card {
    background-color: #fdfab3;
    box-shadow: 3px 3px 7px 4px #0000000f;
}

.service-card:hover,
.service-card:focus {
    background-color: #eaf9f5;
}

.gallery-section {
    background-color: #ad78df;
    color: white;
}

.carousel-item img {
    border: solid 5pt white;
}

.team-section {
    /* background-color: coral;*/
}

.team-member {
    background-color: #f1f16d;
    box-shadow: 3px 3px 7px 4px #0000000f;
}

.team-member:hover,
.team-member:focus {
    background-color: #f2f2c0
}

.team-member img {
    border: solid 3pt #f08e3d;
    border-radius: 50%;
}

.review-item img.profile {
    border: 2pt solid #ffffff;
    background-color: white;
    margin-right: 1em;
}

.review-item p::first-letter {
    font-size: 1.5em;
}

.review-item .blockquote-footer {
    color: black;
}

.carousel-indicators [data-bs-target] {
    width: 3pt;
    border-radius: 50%;
    height: 3pt;
}

@media screen and (max-width: 768px) {
    .home-jumbotron {
        background-image: url(/assets/img/jumbotron-image-mobile-2.webp);
    }

    .customer-section {
        background-image: url(/assets/img/customer-section-mobile-1.webp);
    }
}