style.css

@import url('./array-font.css');

@font-face {
  font-family: 'Array-Regular';
  font-family: 'Array-SemiboldWide';
  font-family: 'Array-BoldWide';
}

body {
    background-color: darkseagreen;
}

h1 {
    font-family: Array-BoldWide;
}

h2 {
    font-family: Array-Regular;
}

#cellmate-canvas-wrapper {
    background-color: #fff;
    padding: 15px;
    border-radius: 10px;
    min-width: 300px;
    min-height: 300px;
    max-width: 700px;
    max-height: 700px;
    height: 54vh;
}

#cellmate-canvas {
    width: 100%;
    height: 50vh;
    min-width: 300px;
    min-height: 300px;
    max-width: 700px;
    max-height: 700px;
    border: dashed 3px #333;
    background-color: #fff;
}

#generator-added-colors {
    border: solid 1px #333;
    border-radius: 10px;
    padding: 10px;
    min-height: 25px;
    max-height: 175px;
    overflow-y: scroll;
}

.colors-list-span {
    background-color: #fff;
    margin: 5px;
    padding: 5px;
    border: #333;
    border-radius: 10px;
    display: inline-block;
}

#logo {
    padding: 5px;
    border-radius: 10px;
    text-shadow: 1px 1px 2px #4ff802, 0 0 1em #151515, 0 0 0.2em #080708;
}

.generator-control-btn {
    margin-left: 10px;
    margin-bottom: 12px;
}

.color-control-section label {
    display: block;
}

.color-control-section button {
    margin-left: 10px;
    margin-bottom: 12px;
}

.btn-outline-secondary:hover {
    color: #fff;
    background-color: #072b4b;
    border-color: #fff; /*set the color you want here*/
}


/*
text-shadow: 1px 1px 2px #4ff802, 0 0 1em blue, 0 0 0.2em #5252a1;

text-shadow: 1px 1px 2px #4ff802, 0 0 1em #151515, 0 0 0.2em #080708;
*/