img {
    margin-top: 10px;
    margin-left: 20px;
}

.topleft {
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    min-width: 530px;
    width: 25%;
    border-radius: 20px;
}

.gxcontainer {
    padding: 2px 16px 10px;
}

    .gxcontainer ul li {
        font-family: gotham-narrow;
        font-size: 15px;
        font-weight: 500;
        text-align: left;
    }

.topright {
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 25%;
    border-radius: 20px;
    min-width: 530px;
}

.gxbcontainer {
    padding: 2px 16px;
}

.middleleft {
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 25%;
    min-width: 530px;
    border-radius: 20px;
}

.gxfcontainer {
    padding: 2px 16px;
}

.middleright {
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 25%;
    border-radius: 20px;
    min-width: 530px;
}

.gxgcontainer {
    padding: 2px 16px;
}

.bottomleft {
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 25%;
    min-width: 530px;
    border-radius: 20px;
}

.gxhcontainer {
    padding: 2px 16px;
}

.bottomright {
    background-color: white;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 25%;
    border-radius: 20px;
    min-width: 530px;
}

.gxjcontainer {
    padding: 2px 16px;
}

.gxheader {
    color: #154734;
    margin-right: 25%;
    margin-left: 25%;
    margin-top: 2%;
    font-family: gotham;
    font-size: 32px;
    font-weight: 700;
    text-align: center;
}


.gxheader2 {
    margin-right: 25%;
    margin-left: 25%;
    margin-bottom: 2%;
    font-family: gotham;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
}

.bgclr {
    background-color: #f5f7fa;
}

.topHybrids {
    font-family: gotham-narrow;
    font-size: 14px;
    font-weight: 700;
    text-align: left;
}

.gendiv {
    text-align: center;
    margin-right: 5%;
    margin-left: 5%;
    margin-top: 5%;
}

.gendivH1 {
    font-family: gotham-narrow;
    font-size: 32px;
    font-weight: 700;
    text-align: center;
}

.gendivP {
    font-family: gotham;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
}

.spacing {
    display: flex;
    gap: 10px 20px;
    row-gap: 10px;
    column-gap: 20px;
    max-width: 1150px;
    align-content: center;
    justify-content: center;
    align-items: stretch;
    flex-wrap: wrap;
    flex-direction: column;
    margin: 15px auto;
    max-height: 1200px
}

.hybrid-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}


.hybrid-link {
    font-size: 16px;
    font-weight: 600;
    font-family: gotham;
    color: rgb(83, 86, 90);
}
.win-hybrid {
    text-align: center;
    border: 1px solid #C8C9C7;
    font-size: 16px;
    font-weight: 600;
    font-family: gotham;
    padding: 5px 15px;
    background-color: #154734;
    color: white;
}
@media only screen and (max-width: 768px) {
    .border-make {
        width: 100%;
    }

    img {
        margin-top: 10px;
        margin-left: 10px;
    }

    .spacing {
        display: flex;
        flex-direction: row;
        max-height:none;
    }

    .topleft {
        background-color: white;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
        transition: 0.3s;
        width: 90%;
        margin-left: 5%;
        margin-right: 5%;
        border-radius: 20px;
        min-width: 350px;
        order: 1;
    }

    .gxcontainer {
        padding: 2px 16px 10px;
    }

    .topright {
        background-color: white;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
        transition: 0.3s;
        width: 90%;
        border-radius: 20px;
        float: center;
        margin-left: 5%;
        margin-right: 5%;
        min-width: 350px;
        order: 2;
    }

    .gxbcontainer {
        padding: 2px 16px;
    }

    .middleleft {
        background-color: white;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
        transition: 0.3s;
        width: 90%;
        border-radius: 20px;
        float: center;
        margin-left: 5%;
        margin-right: 5%;
        min-width: 350px;
        order: 3;
    }

    .gxfcontainer {
        padding: 2px 16px;
    }

    .middleright {
        background-color: white;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
        transition: 0.3s;
        width: 90%;
        border-radius: 20px;
        float: center;
        margin-left: 5%;
        margin-right: 5%;
        min-width: 350px;
        order: 4;
    }

    .gxgcontainer {
        padding: 2px 16px;
    }

    .bottomleft {
        background-color: white;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
        transition: 0.3s;
        width: 90%;
        border-radius: 20px;
        float: center;
        order: 5;
        margin-left: 5%;
        margin-right: 5%;
        min-width: 350px;
    }

    .gxhcontainer {
        padding: 2px 16px;
    }

    .bottomright {
        background-color: white;
        box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
        transition: 0.3s;
        width: 90%;
        border-radius: 20px;
        float: center;
        margin-left: 5%;
        margin-right: 5%;
        min-width: 350px;
        order: 6;
    }

    .gxjcontainer {
        padding: 2px 16px;
    }

    .gxheader {
        color: #154734;
        margin-right: 5%;
        margin-left: 5%;
    }

    .gxheader2 {
        margin-right: 5%;
        margin-left: 5%;
    }

    .bgclr {
        background-color: #f5f7fa;
    }

    .gendiv {
        text-align: center;
        margin-right: 5%;
        margin-left: 5%;
        margin-top: 15%;
    }
}