.content > h2 {text-align: center; margin-top: 10px;}
.content .ventas {
    display: flex;
    gap: 20px;
    margin-bottom: 100px;
    margin-top: 10px;
    padding: 10px;
}
.content .ventas .form,
.content .ventas .juego {width: 50%;}
.content .ventas form {display: flex; flex-direction: column; gap: 10px;}
.content .ventas .form .input {display: flex; flex-direction: column; gap: 5px;}
.content .ventas .form .input > input {padding: 8px;}
.content .ventas form > input {
    background-color: var(--primary500);
    color: var(--primary50);
    border: none;
    padding: 10px 12px;
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}
.content .ventas form > input:hover {background-color: var(--primary600);}
.content .ventas form > .img {width: 100%; display: flex; flex-direction: column; align-items: center;}
.content .ventas form > .img > img {width: 70%;}

.content .ventas .juego {
    background-color: var(--primary500);
    border-radius: 5px;
    padding: 10px;
}
.content .ventas .juego #select {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.content .ventas .juego #select > .select-juego {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 10px;
    width: 100%;
    border: 1px solid #000;
    border-radius: 7px;
    cursor: pointer;
    transition: 0.3s;
    color: var(--primary50);
}
.content .ventas .juego #select > .select-juego:hover {background-color: var(--primary600);}
.content .ventas .juego #select > .select-juego > .img {width: 90px; height: 90px;}
.content .ventas .juego #select > .select-juego > .img > img {width: 100%; height: 100%; border-radius: 5px;}

.content .ventas .juego #select > .img {width: 100%;}
.content .ventas .juego #select > .img > img {width: 100%;}