@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');

body {
    background-color: white;
    font-family: 'Poppins', sans-serif;
}

.fadeover-wrapper {
    overflow: hidden;
}

.fadeover-wrapper, .fadeover-wrapper img {
    width:100%;
    position: relative;
}

.fadeover {
    position:absolute;
    z-index: 99;
    bottom: 0;
    padding-top:50%;
    top:0;
    width:100%;
    color:white;
    background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1));
    transition: all .5s linear;
}

.fadeover-wrapper:hover .fadeover {
    top:100%;
}

img {
    max-width:100%;
}

.gallery img {
    width: 100%;
    height: 300px;
    object-fit: cover;
}

.carousel-caption {
    text-align: left;
}

.cardswap-wrapper {
    position: relative;
    width:451px;
    height:448px;
    overflow: hidden;
    margin:0 auto;
}

.cardswap {
    position: absolute;
    font-size: 1em;
    text-align: left;
    top:100%;
    bottom:0;
    left:0;
    right:0;
    overflow:hidden;
    background-color:#CFBF85;
    color:#fff;
    padding:30px;
    transition: all .5s linear;
}

.cardswap-wrapper:hover .cardswap {
    top:0;
}

.row py-4 {
    max-width: 800px;
    margin: auto;
}

@media (max-width: 767.98px) {
    .fadeover {
        padding-top:10%;
    }
}

.form-container {
            max-width: 400px;
            margin: 0 auto;
            align-items: center; 
        }

    label {
            display: block;
            margin: 10px 0;
        }

    input,
        textarea {
        width: 300px;
        margin: 5px 0 15px 0;
        padding: 8px;
        resize: vertical; 
        /* hozzáadva - lehetővé teszi a függőleges méret állítását a felhasználó számára */
    }

    input[type="submit"] {
            width: 60%;
            background-color: #CFBF85;
            padding: 2% 4%;
            color: white;
            border: none; /* Hozzáadva - eltávolítja a gomb keretét */
            outline: none; /* Hozzáadva - eltávolítja a gomb kijelölési keretét */
            cursor: pointer;
        }

    input[type="submit"]:hover {
            background-color: #45a049;
        }