women.css

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=PT+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@500&family=Montserrat:wght@500&family=PT+Sans&family=Ubuntu&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300&family=Inconsolata:wght@500&family=Montserrat:wght@500&family=PT+Sans&family=Ubuntu&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300&family=Inconsolata:wght@500&family=Montserrat:wght@500&family=PT+Sans&family=Raleway:wght@300&family=Ubuntu&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow&family=IBM+Plex+Sans:wght@300&family=Inconsolata:wght@500&family=Montserrat:wght@500&family=PT+Sans&family=Raleway:wght@300&family=Ubuntu&display=swap');


body {
    overflow-x: hidden;
    overflow-y: scroll;
}

#Web-Head{
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
}

.nav-item a{
    font-size: larger;
    font-family: 'IBM Plex Sans', sans-serif;
}

.nav-item a:hover{
    text-decoration:underline;
    font-weight:400;
}


.loader{
    position: relative;
    width: 100vw;
    margin-top: 70px;
    background-color: #2a2929;
    height: 2px;    
    animation-name: loading;
    animation-duration: 5s;
    z-index: -1;
}

@keyframes loading{
    0%{
        background: red;
        top:0px;
    }

    25%{
        background: red;
        right:550px;
    }

    75%{
        background-color: red;
        right: 350px;
    }

    100%{
        background-size: 0px;
        background-color: black;
    }
}

.contents {
    display: flex;
    background-image: url('https://images.unsplash.com/photo-1434754205268-ad3b5f549b11?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1474&q=80');
    image-rendering: pixelated;
    width: 100vw;
    background-repeat: no-repeat;
    position: absolute;
    /* margin: 56px 0px; */
    height: 60rem;
    position: relative;

}

.info {
    /* background: url('https://images.unsplash.com/photo-1610859875107-b8a6d589c029?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=464&q=80'); */
    margin: 10rem 0px 0px 50rem;
    width: 30rem;

}

.info img {
    position: absolute;
    width: 36rem;
    height: 35rem;

}

.info h2 {
    position: relative;
    margin: 3rem 3rem 2rem 0rem;
    color: white;
}

.info p {
    position: relative;
    padding: 0px 60px 0px 0px;
    font-size: 25px;
    color: white;
}

.info h2 {
    font-weight: 500;
}

.info button{
    font-family: 'Exo 2', sans-serif;
}

.products {
    display: flex;
    position: relative;
    margin: 10rem 50px;
}

.card {
    margin: 20px 70px;
    width: 20rem;
}

.image-prop {
    padding: 150px 0px 0px 0px;
}

.container{
    width: 100vw;
    padding: 0;
    margin: 0;
    color: white;
}

footer {
    width: 100vw;
    padding: 0px 35px;
}

.dev{
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: larger;
}

.dev i{
    margin: 25px 10px;
}