.fs-grid {
  text-align: center;
  vertical-align: center;
  position: relative;
}

.fs-row {
  clear: both;
  width: 100%;
}

.fs-cell {
  height: 100%;
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: -moz-none;
  -ms-user-select: none;
  user-select: none;
}

.fs-grid.submittable .fs-cell:hover {
  cursor: pointer;
  cursor: hand;
}

.fs-grid.submittable .fs-cell.fs-selected,
.submittable .fs-cell.fs-selected:hover {
  cursor: default;
}

.fs-missing label,
.fs-missing input,
.fs-missing select,
.fs-missing span {
  color: red;
}

.fs-iframe {
  display: none;
}

.fs-tooltip,
.fs-form {
  z-index: 990;
  position: absolute;
  background-color: #333;
  font-size: 13px;
  color: #fff;
  text-align: left;
  padding: 10px;
  display: none;
}

.fs-form.loading #fs-form-submit {
  display: none;
}

#fs-form-submit-loading {
  display: none;
}

.fs-form.loading #fs-form-submit-loading {
  display: block;
}

.fs-form.loading #fs-form-submit-loading:hover {
  cursor: default;
}

.fs-form.loading #fs-form-submit-loading img {
  position: relative;
  top: 3px;
}

.fs-tooltip {
  pointer-events: none;
}

.fs-tooltip.open {
  display: block;
}

.fs-grid.open .fs-tooltip,
.fs-grid.open .fs-tooltip.open {
  display: none;
}

.fs-grid.open .fs-form {
  display: block;
}

.fs-form {
  z-index: 999;
  max-width: 300px;
}

.fs-form .fs-close {
  float: right;
  cursor: pointer;
}

.fs-close {
  opacity: .5;
}

.fs-close:hover {
  cursor: pointer;
  cursor: hand;
  opacity: 1;
}

.fs-form input[type='text'],
input[type='number'],
select,
textarea {
  margin: 0;
  border: 1px solid #333;
  background-color: #fff;
  color: #333;
}

.fs-form option {
  background-color: #fff;
}

.fs-form label {
  font-weight: bold;
  display: block;
  margin-bottom: 4px;
}

.fs-form form > div {
  margin: 10px 0px;
}

.fs-form form div div span {
  margin: 0px 18px 0px 6px;
}

.fs-grid-label {
  position: absolute;
  pointer-events: none;
}

.fs-grid-label[data-location="left"] {
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.fs-grid-label[data-location="right"] {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.fs-comment-container {
  position: relative;
  width: 100%;
  margin-right: 10px;
  margin-bottom: 10px;
  padding: 10px;
  overflow: auto;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.fs-mini-map {
  position: relative;
  width: 50px;
  height: 50px;
  margin-right: 10px;
  float: left;
}

.fs-mm-quadrant {
  width: 50%;
  height: 50%;
  float: left;
  border-left: 1px solid #ae9a48;
  border-top: 1px solid #ae9a48;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.fs-mm-quadrant:nth-child(even) {
  border-right: 1px solid #ae9a48;
}

.fs-mm-quadrant:nth-child(3),
.fs-mm-quadrant:nth-child(4) {
  border-bottom: 1px solid #ae9a48;
  border-left: 1px solid #ae9a48;
}

.fs-name {
  font-size: 14px;
  margin-bottom: 5px;
  color: #9a883f;
}

.fs-comment {
  font-size: 14px;
}

.fs-paragraph {
  margin-top: 10px;
  font-size: 12px;
}

.fs-mm-dot {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  margin-right: 10px;
}
/* COMMENT FILTER STYLES, REMOVE IF YOU WANT TO CUSTOMIZE */
#fs-comment-filters {
  list-style: none;
  overflow: auto;
  padding: 0;
  display: none;
}

#fs-comment-filters li {
  display: inline-block;
  padding: 5px;
  margin-right: 18px;
}

#fs-comment-filters li:not(.fs-comment-filter) {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-right: 0;
  color: #9a883f;
  display: block;
  padding: 0 0 10px 0;
}

#fs-comment-filters .fs-comment-filter {
  background-color: #fff;
  color: #FFF;
  border-radius: 2px;
  margin: 0 5px 5px 5px;
  background-repeat: no-repeat;
  background-position: center;
  width: 31px;
  height: 31px;
}

#fs-comment-filters .fs-comment-filter:hover {
  background-color: #e51133;
}

.fs-comment-filter[data-quadrant="topleft"] {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAfAQMAAAAlYIR6AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFAAAA////pdmf3QAAABhJREFUCNdjYICA/3+oQQBB/T8gi2ICBADm2UxL22xMYgAAAABJRU5ErkJggg==");
}

.fs-comment-filter[data-quadrant="topright"] {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAfAQMAAAAlYIR6AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFAAAA////pdmf3QAAABdJREFUCNdjYACB+n/UIKBG/f9DOQECAPtCRWdU9xbuAAAAAElFTkSuQmCC");
}

.fs-comment-filter[data-quadrant="bottomright"] {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAfAQMAAAAlYIR6AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFAAAA////pdmf3QAAABdJREFUCNdjYACB+n///1BOQI2iBgECABtHRWcrDwDhAAAAAElFTkSuQmCC");
}

.fs-comment-filter[data-quadrant="bottomleft"] {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAfAQMAAAAlYIR6AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAAZQTFRFAAAA////pdmf3QAAABlJREFUCNdjYACB+n///1BOQAGYRTHBwAAAAfRMSx8fTlkAAAAASUVORK5CYII=");
}

#fs-comment-filters .fs-comment-filter.fs-hide {
  background-color: #fff;
  color: #000;
  opacity: .35;
}

#fs-comment-filters .fs-comment-filter:hover {
  cursor: pointer;
  cursor: hand;
  text-decoration: underline;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: -moz-none;
  -ms-user-select: none;
  user-select: none;
}

#fs-comment-filters .fs-comment-filter img {
  width: 100%;
}

.fs-row .clear {
  clear: both;
}
