body{
  margin:0;
}

.abion2000{width: 100%;}
.abion2000 .row{width:100%;clear: both;}
.abion2000 *[class~=col]{width:100%;float:left;min-height: 1px;}
.abion2000 .rowFlex{display: -webkit-flex;display: flex;-webkit-flex-direction: row;flex-direction: row;}
.abion2000 .rowFlex > .colFlex{-webkit-flex: auto;flex: auto;}
/* cal base 12 */
.abion2000 .col-1{width:8.333333%;max-width:8.333333%;-webkit-box-flex:0;-webkit-flex:0 0 8.333333%;-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;}
.abion2000 .col-2{width:16.666666%;max-width:16.666666%;-webkit-box-flex:0;-webkit-flex:0 0 16.666666%;-ms-flex:0 0 16.666666%;flex:0 0 16.666666;}
.abion2000 .col-3{width:25%;max-width:25%;-webkit-box-flex:0;-webkit-flex:0 0 25%;-ms-flex:0 0 25%;flex:0 0 25%;}
.abion2000 .col-4{width:33.333333%;max-width:33.333333%;-webkit-box-flex:0;-webkit-flex:0 0 33.333333%;-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;}
.abion2000 .col-5{width:41.666666%;max-width:41.666666%;-webkit-box-flex:0;-webkit-flex:0 0 41.666666%;-ms-flex:0 0 41.666666%;flex:0 0 41.666666%;}
.abion2000 .col-6{width:50%;max-width:50%;-webkit-box-flex:0;-webkit-flex:0 0 50%;-ms-flex:0 0 50%;flex:0 0 50%;}
.abion2000 .col-9{width:75%;max-width:75%;-webkit-box-flex:0;-webkit-flex:0 0 75%;-ms-flex:0 0 75%;flex:0 0 75%;}
.abion2000 .col-12{width:100%;max-width:100%;-webkit-box-flex:0;-webkit-flex:0 0 100%;-ms-flex:0 0 100%;flex:0 0 100%;}

.abion2000 form{}

.abion2000 button
{
  display: inline;
  color: rgb(36,62,91);
  border: 1px solid rgb(200,200,200);
  border-radius: 3px;
  line-height: 200%;
  background: rgb(255,255,255) linear-gradient(to bottom,rgba(200,200,200,0.0), rgba(200,200,200,0.2), rgba(200,200,200,0.4));
}
.abion2000 button:hover
{
  cursor: pointer;
  background-color: rgb(240,240,240);
}

.abion2000 button:disabled:hover,
.abion2000 button:disabled
{
  cursor: no-drop;
  background: rgb(255,255,255) linear-gradient(to bottom,rgba(140,140,140,0), rgba(140,140,140,.05), rgba(140,140,140,.1));
  color: rgba(36,62,91,.1);
  border-color: rgba(200,200,200,.1);
}

.abion2000 button.active
{
  background-color: rgb(225,243,258);
  border-color: #fff;
}
/* ---------------------------------------------------------------------- */
/* ------------------------- apiInputNavigation ------------------------- */
/* ---------------------------------------------------------------------- */

.apiInputNavigation
{
  background-image: linear-gradient(to right, rgba(205,223,238,0.5), rgba(205,223,238,1.0), rgba(205,223,238,0.5));
  margin-bottom: 20px;
}

.apiInputNavigation button
{
  margin:4px;
}


/* ---------------------------------------------------------------------- */
/* ------------------------- apiInputSection ---------------------------- */
/* ---------------------------------------------------------------------- */

div.apiInputSection
{
  padding: 10px;
  background-color: #f5f5f5;
  position: relative;
  min-height: 1px;

}

div.apiInputSection .card,
div.apiInputSection .menu
{
  margin: 10px auto;
  background-color: white;
  border: 1px solid grey;
  border-radius: 3px;
}
div.apiInputSection .card:first-child{
  margin-top: 0;
}
div.apiInputSection .card:last-child{
  margin-bottom: 0;
}

div.apiInputSection .menu
{
  padding: 10px;
}
div.apiInputSection .menu.sticky
{
  position: -webkit-sticky;
  position: sticky;
  top: 10.5px;
}


div.apiInputSection .card.rotation
{
  padding: 0;
}

div.apiInputSection .menu input,
div.apiInputSection .menu select,
div.apiInputSection .menu option,
div.apiInputSection .menu button
{
  width: 100%;
}
div.apiInputSection .menu input,
div.apiInputSection .menu select,
div.apiInputSection .menu option
{
  color: rgb(36,62,91);
  border: 1px solid rgb(205,223,238);
  border-radius: 3px;
  line-height: 200%;
  padding: 4px;
  background: rgb(255,255,255) linear-gradient(to bottom,rgba(200,200,200,0.0), rgba(200,200,200,0.2), rgba(200,200,200,0.4));
}


div.apiInputSection .menu input[type="file"]
{
  width: calc(100% - 10px);
}

div.apiInputSection .menu option
{
  margin:0 0 4px 0;
}

div.apiInputSection .menu ul,
div.apiInputSection .menu ol
{
  list-style: none;
  margin: 0;
  padding: 0;
}
div.apiInputSection .menu li
{
  margin: 0;
  padding: 0;
}
div.apiInputSection .menu li button
{
  width: auto;
  margin: 0;
  padding: 0 4px;
}

div.apiInputSection .menu li button:nth-child(1){width: 80%;}
div.apiInputSection .menu li button:nth-child(2){width: 20%;}

p[contenteditable="true"]{
  display: inline-block;
  width: 100%;
}

div.apiInputSection.default
{
  padding: 10px;
}
div.apiInputSection.default label
{
  display: block;
  width: 100%;
  border-bottom: 1px solid darkgrey;
  padding:10px 0;
}
div.apiInputSection.default label input,
div.apiInputSection.default label select,
div.apiInputSection.default label textarea
{
  margin-top: 10px;
  display: block;
  width: 60%;
  padding: 4px;
  border: 1px solid grey;
  border-radius: 3px;
  line-height: 16px;

}
div.apiInputSection.default label:last-child
{
  border-bottom: none;
}

button.abion_extension_switch.active
{}

div.apiInputSection.stepstone .card
{
  max-width: 1142px;
  width: 846px;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;

  border: 1px solid rgba(220,223,226,0.8);
  background: #fff;
  border-radius: 3px;

  box-sizing: border-box;
}


div.apiInputSection.stepstone .card *:focus
{
  background-color: #00CCFF;
}

div.apiInputSection.stepstone .card .italic
{
  font-style: italic;
}
div.apiInputSection.stepstone .card .bold
{
  font-weight: bold;
}
div.apiInputSection.stepstone .card .underline
{
  text-decoration: underline;
}

div.apiInputSection.stepstone .card h2
{
  font-family: sans-serif;
  font-size: 1.4em;
  background-color: transparent;
  margin: 0 0;
  padding: 0;
  font-weight: 600;
}

div.apiInputSection.stepstone .card.rotation
{
  position: relative;
  width: 846px;
  height: calc(846px / 5 * 2 );
  overflow: hidden;
}

div.apiInputSection.stepstone .menu ul.fileBackgroundListStack button[data-action-used="1"],
div.apiInputSection.stepstone .menu ul.fileRotationListStack button[data-action-used="1"]
{
  background-color: #00CC00;
}

div.apiInputSection.stepstone .card .head,
div.apiInputSection.stepstone .card .body
{
  padding: 24px;
  font-size: 16px;
}
div.apiInputSection.stepstone .card .head
{
  padding-bottom: 12px;
}
div.apiInputSection.stepstone .card .body
{
  padding-top: 12px;
}

div.apiInputSection.stepstone .card .body ol,
div.apiInputSection.stepstone .card .body ul
{
  padding-left: 1.6em;
  box-sizing: border-box;
  font-size: 16px;
  font-family: "Helvetica Neue",Arial,sans-serif;
  line-height: 1.5;
  color: #3a434f;
  margin: 0 0 12px 0;
}

div.apiInputSection.stepstone .card .body p
{
  margin:0 0 12px 0;
}

div.apiInputSection.stepstone .card .body li,
div.apiInputSection.stepstone .card .body p
{
  list-style-type: disc;
  font-family: "Helvetica Neue",Arial,sans-serif;
  line-height: 1.5;
  color: #3a434f;
}

div.apiInputSection.stepstone .card .body ol li {list-style-type: decimal;}
div.apiInputSection.stepstone .card .body ul li {list-style-type: disc;}

div.apiInputSection.stepstone .card .head
{
  font-family: sans-serif;
  font-size: 1.4em;
  font-weight: 600;
  color: #000000;
  line-height: 1.3;
}

div.apiInputSection.stepstone .card .head *:hover,
div.apiInputSection.stepstone .card .body .dropzone:hover,
div.apiInputSection.stepstone .card .head *:focus,
div.apiInputSection.stepstone .card .body .dropzone:focus
{
  /* background-color: rgba(200,200,200,.5); */
}
div.apiInputSection.stepstone .card .head a[href],
div.apiInputSection.stepstone .card .body a[href]
{
  text-decoration: none;
}


div.apiInputSection.stepstone .card .body.dropzoneBlink,
div.apiInputSection.stepstone .card .body .dropzoneBlink
{
  line-height: 30px;

  box-sizing: content-box;
  border:1px solid grey;
  border-radius: 3px;
}
div.apiInputSection.stepstone .card .body li.dropzoneBlink
{
  border-bottom:none;
}
div.apiInputSection.stepstone .card .body li.dropzoneBlink:last-child
{
  border:1px solid grey;
}

div.apiInputSection.stepstone .menu .dragElementTemplateBox li,
div.apiInputSection.stepstone .menu .dragElementTemplateBox p
{
  color: rgb(36,62,91);
  border: 1px solid rgb(200,200,200);
  border-radius: 3px;
  line-height: 200%;
  background: rgb(255,255,255) linear-gradient(to bottom,rgba(200,200,200,0.0), rgba(200,200,200,0.2), rgba(200,200,200,0.4));
  padding: 2px;
  margin: 0;
}
div.liquidBackground
{
  background-size: auto;
  background: no-repeat top center;
}