.controls {
    left: 32px;
    bottom: 32px;
}

.content_list {
    height: auto !important;
}

.content_list:not(:first-child) {
    margin-top: 12px;
}

.content_list_slide {
    display: flex;
    flex-flow: row nowrap;
    align-items: flex-start;
    justify-content: flex-start;
    position: relative;
}

.conf-dt {
    width: 100px;
    min-width: 100px;
}

p.conf-dt {
    margin: 0;
    padding-top: 8px;
}

.conf-dd {
    flex-grow: 2;
    display: grid;
    grid-template-columns: repeat(7, minmax(min-content, 1fr));
    gap: 8px;
    width: auto;
}

.conf-dd_cols_7 {
    grid-template-columns: repeat(7, 32px);
    /* width: 100%; */
}

#shapes-color-toplair-list-slide {
    height: auto !important;
}

.conf-dd .content_list_swatch {
    margin: 0;
}

.conf-dd_buttons {
    width: auto;
    grid-template-columns: repeat(5, 40px);
}

.controls {
    opacity: 0;
    transition: opacity 0.5s;
}

@media screen and (max-width: 1023px) and (orientation: portrait) {
    .content_list_slide {
        display: block;
    }

    .conf-dd {
        padding-top: 8px;
        /* height: 0px; */
        height: auto!important;
        overflow: hidden;
        width: 100%;
    }

    .content_list:not(:first-child) {
        margin-top: 4px;
    }

    p.conf-dt {
        padding-top: 0;
    }

    .content_list_swatch {
        box-shadow: unset;
    }

    .sm-hidden {
        display: none;
    }

    .content_list.conf-visible .conf-dd {
        height: auto;
        /* padding-bottom: 16px; */
    }
}