main.css

@import url('https://rsms.me/inter/inter.css');
html { font-family: 'Inter', sans-serif; }
@supports (font-variation-settings: normal) {
  html { font-family: 'Inter var', sans-serif; }
}

body {
  background: #212121;
  font-family: "Inter", sans-serif;
  color: #dfdbdb;
}

#editor {
    display: flex;
    width: 100%;
    padding-top: 10px;
}

#tools, #side-bar {
    display: flex;
    flex-direction: column;
}

#side-bar {
    width: 100%;
    background: #363232;
    border-radius: 25px;
}

#details, #styling {
    padding: 20px;
    margin: 0 5px 0px 5px;
}

.details-header {
    font-weight: bold;
    padding-bottom: 20px;
}

td {
    padding-top: 10px;
}

#customization {
    background: coral;
}

#canvas {
    position: relative;
    top: 0px;
    left: 0px;
}

#canvas-container {
    outline: solid;
    height: 600px;
    width: 1100px;
    background-color: white;
    margin: 0px 20px 0px 20px;
}

.table-header {
    font-family: monospace;
    font-weight: bold;
}

.tools {
    background: #363232;
    padding: 2px;
    border-radius: 25px;
}

.tools button {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    margin-top: 10px;
    border: 2px black solid;
    display: flex;
    justify-content: center;
    cursor: pointer;
}

button {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    border: 2px black solid;
    cursor: pointer;
}

button > i {
    font-size: 15px;
}

.header {
    font-size: 2rem;
    color: #a5cce9;
    font-weight: bold;
    text-align: center;
    padding: 10px;
}

.border {
    height: 3px;
    background: linear-gradient(90deg, rgba(15,146,227,1) 35%, rgba(0,212,255,1) 100%);
}

.view-info {
    padding: 10px;
    background: #242424;
    border-radius: 2px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.view-extra {
    padding-top: 5px;
    display: flex;
    justify-content: center;
}

#view-details {
    text-align: center;
}

input {
    background: #242424;
    color: white;
}

.footer {
    margin: 100px 0px 0px 0px;
    background: linear-gradient(90deg, rgba(15,146,227,1) 35%, rgba(0,212,255,1) 100%);
    font-size: 1rem;
    text-align: center;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.footer a {
    text-decoration: none;
}