body, html {
  margin: 0;
  height: 100%;
}

body.no-block {
  flex-flow: column;
  overflow-x: hidden;
  display: flex;
}

body {
  background: #DEDEDE;
}

.fp-no-block {
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-direction: column;
  cursor: pointer;
  color: #444;
  display: none;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  text-align: center;
  background: #FFF;
  transition: margin 0.25s linear 0.25s;
}

.fp-no-block:hover {
  background: #EFEFEF;
}

.fp-no-block.fp-visible {
  display: flex;
}

.fp-no-sections {
  flex: 2;
}

.fp-no-block p {
  margin: 0;
}

.fp-no-sections p + p {
  font-size: 16px;
  margin-top: 5px;
}

.fdb-block {
  box-shadow: 0;
  margin-bottom: 0;
  transition: margin 0.25s linear 0.25s;
}

.fp-active {
  box-shadow: 0px 0px 20px rgba(0,0,0,0.14), 0 0px 6px rgba(0,0,0,0.16);
  -moz-box-shadow: 0px 0px 20px rgba(0,0,0,0.14), 0 0px 6px rgba(0,0,0,0.16);
  -webkit-box-shadow: 0px 0px 20px rgba(0,0,0,0.14), 0 0px 6px rgba(0,0,0,0.16);
  z-index: 9999;
}

body.fp-add-view [data-block-type],
body.fp-add-view .fp-no-block {
  margin-bottom: 20px;
}

body.fp-add-view [data-block-type] {
  user-select: none;
  position: relative;
}

body.fp-add-view section[data-block-type] {
  cursor: move;
}

body.fp-add-view [data-block-type]:after {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: block;
  z-index: 10000;
  content: "";
}

.fp-drop-placeholder {
  height: 200px;
  width: 100%;
  border: solid 10px  #0098f7;
  background: #FFF;
  margin-bottom: 20px;
}

.fp-dragging {
  display: none;
}

.fr-popup {
  z-index: 10000 !important;
}

img.fr-dib {
  margin: 5px auto;
  display: block;
  float: none;
  vertical-align: top;
}

span.fr-emoticon.fr-emoticon-img {
  background-repeat: no-repeat !important;
  font-size: inherit;
  height: 1em;
  width: 1em;
  min-height: 20px;
  min-width: 20px;
  display: inline-block;
  margin: -.1em .1em .1em;
  line-height: 1;
  vertical-align: middle;
}

/* for the sub menu example only */

.fdb-block,.fdb-block .container {
    background-position: center;
    background-repeat: no-repeat
}

.fdb-block,.rounded {
    overflow: hidden
}

.fdb-block {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizelegibility;
    padding: 7.5rem 0;
    position: relative;
    background-size: cover;
    background-color: #FFF
}

.fdb-block .container {
    background-size: contain
}

.fdb-block .container.bg-r {
    background-position: right
}

.fdb-block.fdb-viewport,.fdb-block.fdb-viewport .container {
    min-height: calc(100% - 2 * 7.5rem)
}

.fdb-block.fdb-image-bg {
    color: #f2f2f2
}

.fdb-block .fdb-box {
    background: #FFF;
    padding: 3.75rem 2.5rem;
    overflow: hidden;
    color: #444;
    border-radius: .25rem;
    box-shadow: 0 .3125rem .875rem 0 rgba(129,129,129,.2)!important
}

.fdb-block .col-fill-left,.fdb-block .col-fill-right {
    width: 50%;
    top: 0;
    bottom: 0;
    background-size: cover;
    background-position: center
}

.fdb-block .fdb-touch {
    border-top: solid .3125rem #329ef7;
    z-index: 2
}

.fdb-block img+h3,.fdb-block img+h4,.fdb-block img+p {
    margin-top: 1.25rem
}

.fdb-block img+h1,.fdb-block img+h2 {
    margin-top: 2.5rem
}

.fdb-block .col-fill-left {
    position: absolute;
    left: 0;
    z-index: 1
}

.fdb-block .col-fill-left+div {
    position: relative;
    z-index: 2
}

.fdb-block .col-fill-right {
    position: absolute;
    right: 0;
    z-index: 1
}

.fdb-block .col-fill-right+div {
    position: relative;
    z-index: 2
}

.fdb-block img.fdb-icon,.fdb-block img.fdb-icon-round {
    width: auto;
    width: 3.75rem
}

.fdb-block .row-100 {
    height: 6.25rem;
    width: 100%
}

.fdb-block .row-50 {
    height: 3.125rem;
    width: 100%
}

.fdb-block .row-70 {
    height: 4.375rem;
    width: 100%
}