.block {
    display: flex;
    width: 100%;
}

.block .vtmn-card {
    max-width: 600px;
}

.recommended-size {
    font-size: 20px;
    background-color: #0082C3; /* Change the background color to highlight */
    padding: 2px 6px; /* Add padding for a visually appealing highlight */
    border-radius: 4px; /* Add rounded corners for the highlight */
    font-weight: bold; /* Make the text bold for emphasis */
    color: white; /* Change the text color to black for better contrast */
}
  

.card-container {
    max-height: 100% ; /* Set the maximum height for the container */
    overflow-y: auto; /* Enable vertical scrolling when content overflows */
}

/* Style for individual cards */
.vtmn-card {
    /* Card styles */
    margin-bottom: 8px; /* Add margin between cards if desired */
}

/* For mobile phones with a maximum width of 767px */
.productImg {
    width: 100%;
    max-width: 320px;
    height : auto;
    max-height : 28%;
    display: block;
    margin: 0 auto;
}

.card-container {
    max-height: 100%; /* Adjust the container's max height based on your design */
    overflow-y: auto; /* Enable vertical scrolling when content overflows */
}

/* For tablets with a maximum width of 1023px */
@media only screen and (min-width: 768px) and (max-width:1023px) {
    .productImg{
        width: 100%;
        max-width: 400px;
        height : auto;
        max-height : 35%;
        display: block;
        margin: 0 auto;
    }

    .card-container {
        max-height: 115%; /* Adjust the container's max height based on your design */
        overflow-y: auto; /* Enable vertical scrolling when content overflows */
    }

    .SignOutButton {
        position: fixed;
        margin-right: 1%; 
        right: 0%; margin-top: 3.2em;
      }

      .button-container-upload {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-left: 25%;
        margin-top: 2em;
      }

      .button-container-upload button {
        flex: 1;
        text-align: center;
        margin: 0;
      }
}

/* For desktops with a minimum width of 1024px */
@media only screen and (min-width: 1024px) {
    .productImg{
        width: 100%;
        max-width: 1200px;
        height : auto;
        /* max-height : 100% */
        display: block;
        margin: 0 auto;
    }

    .SignOutButton {
        position: fixed;
        margin-right: 1%; 
        right: 0%;
        margin-top: 2.7%;
      }

      .button-container-upload {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-left: 25%;
        margin-top: 2em;
      }

      .button-container-upload button {
        flex: 1;
        text-align: center;
        margin: 0;
      }
}

@media only screen and (min-width: 400px) and (max-height : 900px) {
    .SignOutButton {
        position: fixed;
        margin-right: 1%; 
        right: 0%; margin-top: 3.5em;
      }
}