/* Fonts here */
@font-face {
    font-family: 'Wild_Words_Bold_Italics';
    src: url(wild_words_bold_italics.ttf);
}

@font-face {
    font-family: 'Wild_Words_Regular';
    src: url(wild_words_regular.ttf);
}

@font-face {
    font-family: 'Wild_Words_Italics';
    src: url(wild_words_italics.ttf);
}


#hero-home-slider {
    max-width: 100%;
    overflow: hidden;
    position: relative;

    .mySlides {
        display: none;
        background-color: rgba(0, 0, 0, 0.55);
        background-blend-mode: darken;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;

        .text_content {
            padding-left: 40px;
            flex-direction: column;
            display: flex;
            flex-wrap: wrap;
            position: absolute;
            transform: translate(-50%, -50%);

            .hero-home-slider-preheading {
                font-weight: bold;
                font-family: "Wild_Words_Bold_Italics";
                color: var(--white);
                padding-bottom: 14px;
                text-shadow: 0 2px 6px var(--black);
            };

            .hero-home-slider-heading {
                font-weight: bold;
                font-family: "Wild_Words_Italics";
                padding-bottom: 22px;
                text-shadow: 0 2px 6px var(--black);
            };

            .hero-home-slider-paragraph {
                font-family: "Wild_Words_Regular";
                padding-bottom: 18px;
                text-shadow: 0 2px 6px var(--black);
            };

            .light_button {
                background-image: linear-gradient(0deg, #242424, #3c3c3c);
            };

            .yuuko-kanoe-button:hover {
                color: var(--yuuko-kanoe);
            };

            .ashley-graves-button:hover {
                color: var(--ashley-graves);
            };

            .victorique-de-blois-button:hover {
                color: var(--victorique-de-blois);
            };

        };
    };

    #yuuko-kanoe-hero-slider-item{
        .hero-home-slider-heading {
            color: var(--yuuko-kanoe);
        };
    };

    #ashley-graves-hero-slider-item {
        .hero-home-slider-heading {
            color: var(--ashley-graves);
        };
    };

    #victorique-de-blois-hero-slider-item {
        .hero-home-slider-heading {
            color: var(--victorique-de-blois);
        };
    };

    @media screen and (min-width: 320px) {
        height: 450px;

        .mySlides {
            height: 450px;

            .text_content {
                top: 70%;
                left: 30%;
            };

            .hero-home-slider-preheading {
                font-size: 14px;
            };

            .hero-home-slider-heading {
                font-size: 20px;
            };

            .hero-home-slider-paragraph {
                font-size: 12px;
            };  

            button {
                font-size: 10px;
            };
        };
    };

    @media screen and (min-width: 425px) {
        height: 550px;

        .mySlides {
            height: 550px;

            .text_content {
                top: 75%;
            };

            .hero-home-slider-preheading {
                font-size: 16px;
            };

            .hero-home-slider-heading {
                font-size: 22px;
            };

            .hero-home-slider-paragraph {
                font-size: 14px;
            };  

            button {
                font-size: 12px;
            };
        };
    };

    @media screen and (min-width: 767px) {
        height: 650px;

        .mySlides {
            height: 650px;

            .text_content {
                top: 75%;
                left: 25%;
            };

            .hero-home-slider-preheading {
                font-size: 18px;
            };

            .hero-home-slider-heading {
                font-size: 24px;
            };

            .hero-home-slider-paragraph {
                font-size: 16px;
            };  

            button {
                font-size: 14px;
            };
        };
    };

    @media screen and (min-width: 1024px) {
        height: 750px;

        .mySlides {
            height: 750px;

            .text_content {
                top: 65%;
            };

            .hero-home-slider-preheading {
                font-size: 20px;
            };

            .hero-home-slider-heading {
                font-size: 26px;
            };

            .hero-home-slider-paragraph {
                font-size: 18px;
            };  

            button {
                font-size: 16px;
            };
        };
    };

    @media screen and (min-width: 1200px) {

        .mySlides {

            .text_content {
                top: 65%;
            };

            .hero-home-slider-preheading {
                font-size: 22px;
            };

            .hero-home-slider-heading {
                font-size: 32px;
            };

            .hero-home-slider-paragraph {
                font-size: 20px;
            };  
        };
    };

    @media screen and (min-width: 1600px) {
        height: 1000px;

        .mySlides {
            height: 1000px;

            .text_content {
                top: 70%;
            };

            .hero-home-slider-preheading {
                font-size: 24px;
            };

            .hero-home-slider-heading {
                font-size: 34px;
            };

            .hero-home-slider-paragraph {
                font-size: 22px;
            };  

            button {
                font-size: 18px;
            };

        };
    };
    
};