*,
html {
    margin: 0%;
    padding: 0%;
    box-sizing: border-box;

}

body {
    overflow-x: hidden;
}

@font-face {
    font-family: italianno;
    src: url(../fonts/Italianno/Italianno-Regular.ttf);
}

@font-face {
    font-family: limelight;
    src: url(../fonts/Limelight/Limelight-Regular.ttf);
}



.nav-link {
    text-decoration: none;
    font-family: limelight;
    font-size: 2rem;
    color: #000;
    margin-left: 2rem;


}

.dropdown-menu li a {
    font-size: 1.5rem;
}

.dropdown-menu li a:hover {
    background-color: #000;
    color: #fff;
}

li a {
    text-decoration: none;
    font-family: limelight;
    font-size: 2rem;
    color: #000;

}

#hero-text {
    position: relative;
    top: -30rem;
    text-decoration: none;
    font-family: limelight;
    font-weight: 700;
    font-size: 8rem;
    color: #fff;
}

#portfolio {
    width: 100vw;
    height: auto;
    position: relative;
    top: -15rem;
}

#portfolio-gallery img {
    width: 100%;
}

.splide__list {}

.splide__slide img {
    background-size: cover;
    padding: 2rem;

}


#about {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position: relative;
    top: -10rem;


}

#about-image img {
    width: 100%;
    height: auto;
}

#about-text h2 {
    font-family: limelight;
    font-size: 2rem;

}

#about-text p {
    /* font-family: italianno; */
    font-size: 2rem;
}

blockquote {
    /* font-family: italianno; */
    font-size: 2rem;
    font-weight: 600;
}

#services {
    display: flex;
    flex-direction: row;
    justify-content: space-between;

}

#services-image img {
    width: 100vw;
    height: auto;
}

#services-text h3 {
    font-family: limelight;
    font-size: 2.5rem;
    position: relative;
    top: 25%;
    padding-top: 1rem;


}

#services-text a {
    color: #000;
    text-decoration: none;
}

#portfolio h2 {
    font-family: limelight;
    font-size: 2.5rem;

}

/* #contact{
    display: flex;
    flex-direction: row;
    margin-top: 4rem;

} */

#about-heading,
#services-heading,
#contact-heading {
    font-family: limelight;
    font-size: 2.5rem;
}

#contact {
    width: 100vw;
    height: 50vh;

}

#contact-text {
    position: relative;
    top: 20vh;

}

#about-button a {
    color: #fff;
    text-decoration: none;
}

#services-button {
    background-color: #000;
    width: 150px;
    height: 30px;
}

#services-button a {
    color: #fff;
    text-decoration: none;
}

footer {
    margin-top: 4rem;

}

#textarea-4 ul {
    display: flex;
    flex-direction: row;
    list-style-type: none;
    position: relative;
    right: 4rem;
}

#textarea-4 ul li a {
    padding: 10px;
    color: #000;
}

#textarea-1 h2 {
    font-family: limelight;
    font-size: 2.5rem;
    position: relative;
    top: -5rem;
}

#textarea-2 h3,
#textarea-3 h3,
#textarea-4 h3 {
    font-family: limelight;
    font-size: 1.5rem;
}

#textarea-2 p,
#textarea-3 p {
    font-family: italianno;
    font-size: 2rem;
    font-weight: 600;
}

#copyright-info h4 {
    font-family: italianno;
    font-size: 2rem;
    margin-top: 2rem;
}

/* Fashion Photography */

#banner-image img {
    width: 100vw;
    height: 30vh;
    object-fit: cover;
    opacity: 0.7;
}

#banner-text h1 {
    position: relative;
    top: -15vh;
    text-align: center;
    font-size: 3rem;
    font-family: limelight;
}

#fashion-photos-text p {
    width: 100%;
    height: auto;
    margin: 2rem;
    padding: 3rem;
    font-size: 3rem;
    font-family: italianno;
}

#fashion-photos-content {

    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1rem;

}

#fashion-photos-content img {
    width: 100%;
    height: auto;
}


/* Media Queries */

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

    
    html {
        margin: 0%;
        padding: 0%;
        box-sizing: border-box;
        overflow-x: hidden;

    }

    #hero-image img {
        width: 100vw;
        height: auto;
    }

    #hero-text {
        font-size: 1.5rem;
        position: relative;
        top: -20%;
    }

    #portfolio {
        width: 100vw;
        height: 80vh;


    }

    #portfolio-gallery {
        position: relative;
        top: 30vh;
    }

    #portfolio-gallery img {
        width: 150%;
    }

    .splide__slide img {
        background-size: cover;
        padding: 2rem;

    }

    #about {
        position: relative;
        top: -60vh;

    }

    #about-text h2 {
        font-size: 2rem;
    }

    #about-text p {
        font-size: 1.2rem;
    }

    #about-text blockquote {
        font-size: 1.2rem;
    }

    #about-inner {
        display: flex;
        flex-direction: column;
    }

    #about-image {
        width: 100vw;
        height: auto;
    }

    #services {
        position: relative;
        top: -40vh;
    }

    #services-inner {
        display: flex;
        flex-direction: column;
    }

    #services-text h3 {
        font-size: 2rem;
    }

    #services-image {
        position: relative;
        top: 30vh;
        left: -30vw;
        width: 100vw;
        height: auto;
    }

    #footer {
        width: 100vw;
        height: auto;
    }

    #footer-inner {
        display: flex;
        flex-direction: column;
    }

    #textarea-1,
    #textarea-2,
    #textarea-3,
    #textarea-4 {
        margin-left: 2rem;
    }

    #textarea-2 p {
        width: 100vw;
    }

    #textarea-4 h4 {
        width: 100vw;
    }

    /* fashion photography */
    #banner-text h1 {
        font-size: 2rem;
    }

    #fashion-photos-text p {
        font-size: 1.5rem;
    }

    #fashion-photos-content img {
        width: 100%;
        height: auto;
    }
}

/*X-small devices*/
@media (min-width:576px) and (max-width:767.98px) {

    
    html {
        margin: 0%;
        padding: 0%;
        box-sizing: border-box;
        overflow-x: hidden;

    }

    #hero-image img {
        width: 100vw;
        height: auto;
    }

    #hero-text {
        font-size: 2rem;
        position: relative;
        top: -10%;
    }

    #portfolio {
        width: 100vw;
        height: 80vh;


    }

    #portfolio-gallery {
        position: relative;
        top: 30vh;
    }

    #portfolio-gallery img {
        width: 130%;
    }

    .splide__slide img {
        background-size: cover;
        padding: 2rem;

    }

    #about {
        position: relative;
        top: -60vh;

    }

    #about-text h2 {
        font-size: 2rem;
    }

    #about-text p {
        font-size: 1.2rem;
    }

    #about-text blockquote {
        font-size: 1.2rem;
    }

    #about-inner {
        display: flex;
        flex-direction: column;
    }

    #about-image {
        width: 100vw;
        height: auto;
        position: relative;
        left: -7rem;
    }

    #services {
        position: relative;
        top: -40vh;
    }

    #services-inner {
        display: flex;
        flex-direction: column;
    }

    #services-text h3 {
        font-size: 2rem;
    }

    #services-image {
        position: relative;
        top: 30vh;
        left: -35vw;
        width: 100vw;
        height: auto;
    }

    #footer {
        width: 100vw;
        height: auto;
    }

    #footer-inner {
        display: flex;
        flex-direction: column;
    }

    #textarea-1,
    #textarea-2,
    #textarea-3,
    #textarea-4 {
        margin-left: 2rem;
    }

    #textarea-2 p {
        width: 100vw;
    }

    #textarea-4 h4 {
        width: 100vw;
    }

    /* fashion photography */
    #banner-text h1 {
        font-size: 2rem;
    }

    #fashion-photos-text p {
        font-size: 1.5rem;
    }

    #fashion-photos-content img {
        width: 100%;
        height: auto;
    }
}

/*Small devices*/
@media (min-width:768px) and (max-width:991.98px) {

    
    html {
        margin: 0%;
        padding: 0%;
        box-sizing: border-box;
        overflow-x: hidden;

    }

    #hero-image img {
        width: 100vw;
        height: auto;
    }

    #hero-text {
        font-size: 2rem;
        position: relative;
        top: -10%;
    }

    #portfolio {
        width: 100vw;
        height: 80vh;


    }

    #portfolio-gallery {
        position: relative;
        top: 30vh;
    }

    #portfolio-gallery img {
        width: 130%;
    }

    .splide__slide img {
        background-size: cover;
        padding: 2rem;

    }

    #about {
        position: relative;
        top: -60vh;

    }

    #about-text h2 {
        font-size: 2rem;
    }

    #about-text p {
        font-size: 1.2rem;
    }

    #about-text blockquote {
        font-size: 1.2rem;
    }

    #about-inner {
        display: flex;
        flex-direction: column;
    }

    #about-image {
        width: 100vw;
        height: auto;
        margin-left: -4rem;
    }

    #services {
        position: relative;
        top: -40vh;
    }

    #services-inner {
        display: flex;
        flex-direction: column;
    }

    #services-text h3 {
        font-size: 2rem;
    }

    #services-image {
        position: relative;
        top: 30vh;
        left: -30vw;
        width: 100vw;
        height: auto;
    }

    #footer {
        width: 100vw;
        height: auto;
    }

    #footer-inner {
        display: flex;
        flex-direction: column;
    }

    #textarea-1,
    #textarea-2,
    #textarea-3,
    #textarea-4 {
        margin-left: 2rem;
    }

    #textarea-2 p {
        width: 100vw;
    }

    #textarea-4 h4 {
        width: 100vw;
    }

    /* fashion photography */
    #banner-text h1 {
        font-size: 2rem;
    }

    #fashion-photos-text p {
        font-size: 1.5rem;
    }

    #fashion-photos-content img {
        width: 100%;
        height: auto;
    }
}

/*Medium devices*/
@media (min-width:992px) and (max-width:1199.98px) {

    
    html {
        margin: 0%;
        padding: 0%;
        box-sizing: border-box;
        overflow-x: hidden;

    }



    #hero-image img {
        width: 100vw;
        height: auto;
    }

    #hero-text {
        font-size: 3rem;
        position: relative;
        top: -10%;
    }

    #portfolio {
        width: 100vw;
        height: 80vh;


    }

    #portfolio-gallery {
        position: relative;
        top: 30vh;
    }

    #portfolio-gallery img {
        width: 120%;
    }

    .splide__slide img {
        background-size: cover;
        padding: 2rem;

    }

    #about {
        position: relative;
        top: -60vh;

    }

    #about-text h2 {
        font-size: 2rem;
    }

    #about-text p {
        font-size: 1.2rem;
    }

    #about-text blockquote {
        font-size: 1.2rem;
    }

    #about-inner {
        display: flex;
        flex-direction: column;
    }

    #about-image {
        width: 100vw;
        height: auto;
        margin-left: -4rem;
    }

    #services {
        position: relative;
        top: -40vh;
    }

    #services-inner {
        display: flex;
        flex-direction: column;
    }

    #services-text h3 {
        font-size: 2rem;
    }

    #services-image {
        position: relative;
        top: 30vh;
        left: -20vw;
        width: 100vw;
        height: auto;
    }

    #footer {
        width: 100vw;
        height: auto;
    }

    #footer-inner {
        display: flex;
        flex-direction: column;
    }

    #textarea-1,
    #textarea-2,
    #textarea-3,
    #textarea-4 {
        margin-left: 2rem;
    }

    #textarea-2 p {
        width: 100vw;
    }

    #textarea-4 h3 {
        width: 100vw;
    }

    /* fashion photography */
    #banner-text h1 {
        font-size: 2rem;
    }

    #fashion-photos-text p {
        font-size: 1.5rem;
    }

    #fashion-photos-content img {
        width: 100%;
        height: auto;
    }
}

/*Large devices*/
@media (min-width:1200px) and (max-width: 1399.98px) {}

/*X-large devices*/