@import url(https://fonts.googleapis.com/css?family=Lobster);
@import url(https://fonts.googleapis.com/css?family=Nanum+Myeongjo);
@import url(https://fonts.googleapis.com/css?family=Noto+Sans+KR);
@import url(https://fonts.googleapis.com/css?family=Do+Hyeon);
@import url(https://fonts.googleapis.com/css?family=Yeon+Sung&subset=korean);
@import url(https://fonts.googleapis.com/css2?family=Gowun+Dodum&family=Nanum+Gothic+Coding&family=Nanum+Pen+Script&family=Noto+Serif+KR&family=Song+Myung&display=swap);
@import url(https://fonts.googleapis.com/css?family=Black+Han+Sans:400);
@font-face {
  font-family: "SF Pro";
  font-weight: 100;
  src: url(/static/media/SF-Pro-Display-Ultralight.a534d575.otf);
}
@font-face {
  font-family: "SF Pro";
  font-weight: 200;
  src: url(/static/media/SF-Pro-Display-Light.5c4d20e5.otf);
}
@font-face {
  font-family: "SF Pro";
  font-weight: 300;
  src: url(/static/media/SF-Pro-Display-Medium.0541e229.otf);
}
body,
html {
  width: 100%;
  height: 100%;
  margin: 0;
}
.App {
  min-height: 100vh;
  font-family: SF Pro;
  font-weight: 100;
  text-align: center;
  background-color: #282c34;
}
.App,
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.content {
  flex-grow: 1;
  position: relative;
  padding: 20px;
}
input::-webkit-input-placeholder {
  font-family: SF Pro;
  font-weight: 100;
}
input:focus::-webkit-input-placeholder {
  color: transparent;
}
.textInput {
  margin: 20px;
  background: transparent;
  border: 0;
  outline: 0;
  border-bottom: 1px solid #fff;
  color: #fff;
  font-size: 1.5em;
  text-align: center;
}
.hexLabel {
  margin: 12px;
  font-size: 1em;
  color: #fff;
}
.downbutton {
  width: 200px;
  height: 50px;
  color: #fff;
  background-color: salmon;
  margin: 5px;
  font-size: 1.3em;
  font-weight: 200;
  text-decoration: none;
  line-height: 50px;
  border-radius: 10px;
  transition: 0.3s;
}
.downbutton:active,
.downbutton:hover,
.downbutton:visited {
  background-color: #af5a50;
  color: #ccc;
  text-decoration: none;
}
.toolWrapper {
  flex-direction: column;
  width: 800px;
}
.paletteWrapper,
.toolWrapper {
  position: relative;
  display: flex;
  align-items: center;
}
.paletteWrapper {
  flex-direction: row;
  padding-top: 5px;
  padding-bottom: 10px;
}
.huePicker {
  padding: 20px;
}
.editorWrapper {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.editoritem {
  margin: 0 5px;
}
.fontSelect {
  font-weight: 200;
}
@font-face {
  font-family: "CookieRun-Regular";
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/CookieRun-Regular.woff)
    format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "CookieRunOTF-Black";
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.0/CookieRunOTF-Black00.woff)
    format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "CookieRunOTF-Bold";
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.0/CookieRunOTF-Bold00.woff)
    format("woff");
  font-weight: 400;
  font-style: normal;
}
.colorRect {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid #fff;
  border-radius: 3px;
  cursor: pointer;
  margin: 5px;
  font-size: 1.4em;
  color: #fff;
  transition: background-color 0.2s ease-in-out;
}
.colorRect:hover {
  background-color: #bbb;
}
p {
  margin: 0;
}
.editor {
  display: flex;
  outline: none;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin-bottom: 50px;
}
@font-face {
  font-family: "SANJUGotgam";
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2112@1.0/SANJUGotgam.woff)
    format("woff");
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: "CWDangamAsac-Bold";
  src: url(https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/CWDangamAsac-Bold.woff)
    format("woff");
  font-weight: 400;
  font-style: normal;
}
/*# sourceMappingURL=main.7eac525e.chunk.css.map */
