:root {
    --bg-clr: rgba(255,255,255,1);
    --nav-bg-clr: #fff;
    --nav-txt-clr: #444;
    --txt-clr: #111;
    --txt-shd: #333;
    --default-blender-bg: #000;
    --slider-height: 0;
    --swiper-theme-color: whitesmoke;
    --stc-gold: #d0af53;
    --stc-gold-rgba:  rgba(208, 175, 83, .8);
    --stc-gold-h2: #CB9904;
    --form-gap:  10px;
}

.cbcolor[type="checkbox"] {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
}

.cbcolor[type="checkbox"]+label {
  color: var(--stc-gold-h2);
  background: #fff;
  font-weight: 100;
  text-align: center;
  padding: 10px;
  height: auto;
  font-size: 1em;
  border: solid 1px var(--stc-gold-h2);
  border-radius: 4px;
  display: inline-block;
  letter-spacing: inherit;
  vertical-align: middle;
  cursor: pointer;
}

.cbcolor[type="checkbox"]:checked+label {
  background: var(--stc-gold-rgba);
  color: #fff;
}

#configurator {
    display: flex;
    padding: 25px;
    flex-direction: column;
    align-items: center;
}

#colors {
    display: flex;
    flex-direction: row;
/*    justify-content: center;*/
}

label.btn.btn-default {
    width: 100px;
    margin-right: 10px;
}

div#color-picker {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column-reverse;
}

div#save {
    position: absolute;
    z-index: 20;
    margin-right: 10px;
    margin-bottom: 10px;
}
button#btn_reset {
    background: var(--stc-gold-rgba);
    color: whitesmoke;
    border: 1px solid var(--stc-gold-h2);
    padding: 10px;
    border-radius: 4px;
}

button#btn_save {
    background: var(--stc-gold-rgba);
    color: whitesmoke;
    border: 1px solid var(--stc-gold-h2);
    padding: 10px;
    border-radius: 4px;
}

.services-div, services-text {
    z-index: 0;
    position: relative;
    display: flex;
    flex-direction: column;
     align-items: inherit; 
    justify-content: center;
}

.svg-container {
    display: flex;
    flex-direction: inherit;
    -webkit-align-items: none;
    justify-content: flex-end;
    align-items: flex-end;
}

#wide {
    display: inline-block;
}

#small {
    display: none;
}

@media only screen and (max-width: 840px) {
    #wide {
        display: none;
    }

    #small {
        display: inline-block;
    }
}

@media only screen and (max-width: 521px) {
    label.btn.btn-default {
        width: 100px;
    }

    #configurator {
        flex-basis: min-content;
    }

    .btn_row {
        width: min-content;
    }
}

@media only screen and (max-width: 1032px) {
    label.btn.btn-default {
        width: 100px;
    }

    #configurator {
        flex-basis: min-content;
    }
}

@media only screen and (max-width: 840px) {
    #colors {
        display: unset;
    }

    .btn_row {
        display: flex;
    }
}

@media only screen and (max-width: 752px) {
    #services-first {
        border-top: 1px solid var(--stc-gold-h2);
        border-bottom: none;
    }

    #colors {
        display: flex;
    }

    .btn_row {
        width: min-content;
        display: unset;
    }

    #wide {
        display: inline-block;
    }

    #small {
        display: none;
    }
}

@media only screen and (max-width: 420px) {
    #colors {
        display: unset;
    }

    .btn_row {
        display: flex;
    }

    #wide {
        display: none;
    }

    #small {
        display: inline-block;
    }
}

@media only screen and (max-width: 350px) {
    .btn_row {
        display: unset;
    }    
}