:root {
    --disabled-color: #999;
}

/* POSITIONING */

.display-flex {
    display: flex;
}

.display-flex-column {
    display: flex;
    flex-direction: column;
}

.center-childs {
    align-items: center;
    justify-content: center;
}

.space-between {
    justify-content: space-between;
}

.space-around {
    justify-content: space-around;
}

.space-evenly {
    justify-content: space-evenly;
}

.flex-1 {
    flex: 1;
}

/* SIZES */

.width-100 {
    width: 100%;
}

.width-75 {
    width: 75%;
}

.width-70 {
    width: 70%;
}

.width-65 {
    width: 65%;
}

.width-55 {
    width: 55%;
}

.width-50 {
    width: 50%;
}

.width-35 {
    width: 35%;
}

.width-30 {
    width: 30%;
}

.width-25 {
    width: 25%;
}

.width-10 {
    width: 10%;
}

.width-8 {
    width: 8%;
}

.width-5 {
    width: 5%;
}

.height-100 {
    height: 100%;
}

.height-90 {
    height: 90%;
}

.height-80 {
    height: 80%;
}

.height-50 {
    height: 50%;
}

.height-20 {
    height: 20%;
}

.height-15 {
    height: 15%;
}

.height-12 {
    height: 12%;
}

.height-10 {
    height: 10%;
}

/* MARGIN + PADDING */

.padding-0 {
    padding: 0;
}

.margin-0 {
    margin: 0;
}

.padding-100px {
    padding: 100px;
}

.padding-10 {
    padding: 10%;
}

.padding-10-horizontal {
    padding: 0 10%;
}

.padding-10-vertical {
    padding: 10% 0;
}

.padding-100px-horizontal {
    padding: 0 100px;
}

.padding-100px-vertical {
    padding: 100px 0;
}

.padding-90px {
    padding: 90px;
}

.padding-90px-horizontal {
    padding: 0 90px;
}

.padding-90px-vertical {
    padding: 90px 0;
}

/* VISIBILITY */
.hidden {
    display: none !important;
}

/* COLORS */
.color-white {
    color: white;
}

.color-black {
    color: black;
}

.bg-color-white {
    background-color: white;
}

.bg-color-black {
    background-color: black;
}