/* CSS for logo and menu bar */
.logo {
    float: right;
}

nav {
    float: left;
}

/* CSS for the cards */
.card {
    /* Add your styles for the cards */
}

/* Media queries for responsiveness */
@media (max-width: 768px) {
    .logo, nav {
        float: none;
        text-align: center;
        width: 100%;
    }

    .card {
        width: 100%;
    }
}
<style>
    /* Styles for the logo and navigation bar */
    header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 20px;
    }

    .logo img {
        height: 40px;
        width: auto;
    }

    nav ul {
        list-style: none;
        display: flex;
    }

    nav ul li {
        margin-right: 10px;
    }

    nav ul li a {
        text-decoration: none;
        color: #000;
        padding: 5px 10px;
        border-radius: 4px;
        transition: background-color 0.3s ease;
    }

    nav ul li a:hover {
        background-color: #f0f0f0;
    }

    /* Styles for the cards */
    .card {
        /* Add your styles for the cards */
    }

    /* Media queries for responsiveness */
    @media (max-width: 768px) {
        header {
            flex-direction: column;
            align-items: flex-start;
        }

        .logo img {
            margin-bottom: 10px;
        }

        nav ul {
            flex-direction: column;
        }

        nav ul li {
            margin-bottom: 10px;
        }
    }





    <div class="space">



                <div class="card">


                </div>




<div</div>