:root {
    --primary-color-100: #f5faf4;
    --primary-color-300: #d1e4ce;
    --primary-color-400: #8BBE83;
    --primary-color-500: #688f62;
    --primary-color-600: #455f41;
    --primary-color-700: #454337;
    --primary-color-900: #33301c;

    --success-color-500: #1ab46e;
    --success-color-700: #148753;

    --danger-color-500: #db3b21;
    --danger-color-700: #a42c19;

    --medium-grey-500: #5c5949;
    --medium-grey-700: #454337;

    --light-grey-500: #fafafa;
    --light-grey-700:#c8c8c8 ;

}

.ui.primary.button{background-color: var(--primary-color-500)}
.ui.primary.button:hover,.ui.primary.button:active,.ui.primary.button:focus{background-color: var(--primary-color-700)}
.ui.basic.primary.button{box-shadow: 0px 0px 0px 1.5px var(--primary-color-500) inset !important; color: var(--primary-color-500) !important;}
.ui.basic.primary.button:hover,.ui.basic.primary.button:active{box-shadow: 0px 0px 0px 1.5px var(--primary-color-500) inset !important; color: var(--primary-color-600) !important}
.ui.primary.text{color: var(--primary-color-500)}