.wrapper{
    text-align: center;
}

.container{
    background-image: linear-gradient(to bottom left, #FFEECA 40%, #932565);
    max-width: 50%;
    margin: auto;
    border: 2px solid black;
    border-radius: 20px;
    padding: 20px;
    box-shadow: 5px 5px 5px black;
}

.configurations{
    margin: auto;
}

.config-item {
    margin-bottom: 20px;
}

.button-controls button{
    margin-bottom: 8px;
}

.code-contain{
    text-align: left !important;
    background-color: white;
    padding: 10px;
    border-radius: 20px;
}

.req{
    color: red;
    font-size: 22px;
}

@media (min-width: 768px) {
    .configurations{
        display: flex;
        justify-content: center;
        margin-bottom: 20px;
        align-items: center;
        max-width: 60%;
    }

    .config-item {
        margin-right: 10px;
        margin-left: 10px;
    }
}