@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300&display=swap');

body {
	font-family: 'Inter', serif;
}
.content-wrapper{
	height: calc(100% - 4rem) !important;
}
a {
  cursor: pointer;
}
.editor
{
	position:relative;
}
.editorAria {
  height:100%;
  min-height:400px;
  border:1px solid #ddd;
  overflow-y: auto;
  padding: 1em;
  margin-top: -2px;
  outline: none;
}

.toolbar {
	position:sticky;
	top:0;
	left:0;
	right:0;
	background-color:#fff;
	border:1px solid #ddd;
	padding:10px;
}

.toolbar a,
.fore-wrapper,
.back-wrapper {
  border: 1px solid #ddd;
  background: #FFF;
	font-family: 'Roboto', serif;
  color: #000;
  padding: 5px;
	margin: 2px 0px;
  width:35px;
	height:35px;
  display: inline-block;
	text-align:center;
  text-decoration: none;
}

.toolbar a:hover,
.fore-wrapper:hover,
.back-wrapper:hover {
  background: #0eacc6;
	color:#fff;
	border-color:#0eacc6;
}

a.palette-item {
	display:inline-block;
  height: 1.3em;
  width: 1.3em;
  margin: 0px 1px 1px;
	cursor:pointer;
}
a.palette-item[data-value="#FFFFFF"]{
	border:1px solid #ddd!important;
}
a.palette-item:hover {
  transform:scale(1.1);
}
.fore-wrapper,
.back-wrapper
{
	position:relative;
	cursor:auto;
}
.fore-palette,
.back-palette {
  display: none;
	cursor:auto;
}

.fore-wrapper:hover .fore-palette,
.back-wrapper:hover .back-palette {
	display:block;
}

.fore-wrapper .fore-palette,
.back-wrapper .back-palette {
	position:relative;
  display: inline-block;
  cursor: auto;
  display: block;
	left:0;
	top:calc(100% + 5px);
  position: absolute;
  padding: 10px 5px;
  width: 160px;
  background: #FFF;
  box-shadow: 0 0 5px #CCC;
	display:none;
	text-align:left;
}
.fore-wrapper .fore-palette:after,
.back-wrapper .back-palette:before
{
	content:'';
	display:inline-block;
	position:absolute;
	top:-10px;
	left:10px;
	width:0;
	height:0;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid #fff;
}
.fore-palette a,
.back-palette a {
  background: #FFF;
  margin-bottom: 2px;
	border:none;
}
.editor img
{
	max-width:100%;
	-o-object-fit:cover;
	   object-fit:cover;
}
