.grid {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
}

.--main {
    /* background-color: white; */
    /* box-shadow: 0 1px 2px rgba(0,0,0,.1); */
    /* border: 1px solid rgba(240, 239, 239, 0.33); */
    width: 100%;
    /* margin: 6px; */
    padding: 6px;
}


/*row*/

.--row {
    padding: 6px;
    margin: 3px;
    align-self: flex-start;
    background-color: white;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
    border: 1px solid rgba(240, 239, 239, 0.33);
}

.--row-1 {
    width: 10%;
}

.--row-2 {
    width: 20%;
}

.--row-3 {
    width: 30%;
}

.--row-4 {
    width: 40%;
}

.--row-5 {
    width: 50%;
}

.--row-6 {
    width: 60%;
}

.--row-7 {
    width: 70%;
}

.--row-8 {
    width: 80%;
}

.--row-9 {
    width: 90%;
}

.--row-10 {
    width: 100%;
}


/*tabs*/

.--tabs.--menu {
    width: 100%;
    justify-content: flex-start;
    padding: 4px 2px;
    border-bottom: 1px solid rgb(161, 207, 228);
}

.--tabs.--menu-item {
    color: #aaaaaa;
    cursor: pointer;
    font-size: 17px;
    margin: 2px 4px;
}

.--tabs.--menu-item:hover {
    color: #2098d1;
}

.--tabs.--menu-item.--active {
    color: #53a0c2;
    font-weight: 300;
}


/*inner*/

--inner {
    padding: 3px;
}

.--inner-1 {
    width: 10%;
}

.--inner-2 {
    width: 20%;
}

.--inner-3 {
    width: 30%;
}

.--inner-4 {
    width: 40%;
}

.--inner-5 {
    width: 50%;
}

.--inner-7 {
    width: 70%;
}

.--inner-8 {
    width: 80%;
}

.--inner-9 {
    width: 90%;
}

.--inner-10 {
    width: 100%;
}

/*General Rules*/

.--header {
    height: 25px;
    padding: 2px 6px;
    /* border-bottom: 1px solid #B7B7B7; */
    justify-content: center;
    text-align: center;
    /* color: #2098d1; */
    /* background-color: chocolate; */
}

.--h1 {
     /* background-color: #eeeeee; */
}

.--h2 {
     background-color: #eeeeee;
}


/*Elements*/

.grid textarea {
    width: 100%;
}


/*flex*/

.--flex {
    flex: 1;
    /* min-width: 30%; */
}

.--noflex {
    display: initial;
}

.--ver-sep {
    border-bottom: 2px solid #e1e1e1;
    height: 1px;
    width: 100%;
    margin: 7px 0;
}

.--inner {
    padding: 10px;
}