body { overflow:hidden; }
#container { padding-bottom:21px; }
#holderholder.full { bottom:14px; }
#holderholder {
  bottom:40px;
  padding-right: 4px;
  position: absolute;
  top: 29px;
  left:0;
  right:0;
}
#holder {
  width:100%;
  height:100%;
  padding:4px 4px 0 8px;
  margin-bottom:7px;
  overflow:auto;
  font-size:12px;
  font-weight:bold;
  text-shadow:0 1px 3px rgba(0,0,0,0.5);
}
#bottom {
  bottom:11px;
  height:20px;
  position:absolute;
  right:12px;
  left:0;
  text-align:center;
}
#ok {
  width:55px;
  right:0px;
  margin-left:6px;
}
.left *,.right *{
  vertical-align:middle;
}
.left {
  word-wrap: break-word;
  text-align:right;
  width:110px;
  display:-webkit-box;
  -webkit-box-pack:center;
  -webkit-box-orient:vertical;
}
.inner {
  width:100%;
  padding:3px;
  position:relative;
}
.left + .right {
  padding-left:4px;
}
.right {
  width:100%;
  display:-webkit-box;
  -webkit-box-flex:1;
}
.item {
  position:relative;
  margin-top:2px;
  display:-webkit-box;
}
.inline.item {
  position:relative;
  display:inline-block;
}
.inner .textarea,.inner input { width:100%; }
.inner select {
  width:auto;
  max-width:100%;
  min-width:60%;
}
.inner .textarea { max-width:100%; height:60px; resize:height; }
.radio {
  display:inline-block;
  overflow:hidden;
  padding-right:4px;
  text-overflow:ellipsis;
  white-space:nowrap;
  width:130px;
}
.radio input { width:auto; }
.color {
  position:relative;
  -webkit-border-image:url(../global/images/search.png) 0 12 / 0 12px;
  height:21px;
  width:auto;
  display:inline-block;
  line-height:21px;
}
.color .swatch {
  width:15px;
  height:14px;
  margin:0 5px 0 -9px;
  display:inline-block;
  background:red;
  -webkit-border-bottom-left-radius: 9px 9px;
  -webkit-border-top-left-radius: 9px 9px;
}
.color.fullswatch .swatch {
  width:33px;
  height:14px;
  margin:3px 5px 0 -9px;
  display:inline-block;
  background:red;
  -webkit-border-radius:9px;
}
.color.fullswatch {
  width:40px;
}
.color.fullswatch .colortext {
  display:none;
}

#cpholder {
  display:none;
  opacity:0;
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 5px;
  -webkit-box-shadow: black 0 2px 55px;
  -webkit-transition:opacity 0.2s ease-in-out;
  height: 228px;
  left: 50%;
  margin-left: -178px;
  margin-top: -119px;
  padding: 5px;
  position: absolute;
  right: 1px;
  top: 50%;
  width: 356px;
  z-index: 100;
}
#cpholder #picker {
  position:relative;
}
#cpholder #picker input {
  font:-webkit-small-control;
}
#cpholder .ok,#cpholder .cancel {
  position:absolute;
  right:6px;
  bottom:6px;
  width:55px;
}
#cpholder .cancel {
  position:absolute;
  right: 89px;
}
.reorderable {
  -webkit-border-image:url(images/draggable-item.png) 0 21 0 13 / 0 21px 0 13px;
  line-height:21px;
  text-overflow:ellipsis;
  white-space:nowrap;
  overflow:hidden;
  height:21px;
  position:relative;
}
@-webkit-keyframes oppulse {
 from { opacity:1; }
 to { opacity:0.5; }
}
.error .highlight {
  -webkit-animation-name:oppulse;
  -webkit-animation-duration:0.7s;
  -webkit-animation-direction:alternate;
  -webkit-animation-iteration-count:infinite;
  -webkit-animation-timing-function:ease-in-out;
  position:absolute;
  -webkit-border-image:url(images/highlight.png) 0 20 / 0 20px;
  height:34px;
  top:-4px;
  left:-4px;
  right:-4px;
}
.inputholder {
  position:relative;
}
.error + .errormsg { display:block; }
.errormsg {
  display:none;
  text-align:center;
  padding:10px;
}
.errormsg::before {
  content:url(images/warning.png);
  display:inline-block;
  vertical-align:-5px;
  padding-right:5px;
}
input[type=range] { margin:8px 0px; }
.fancyslider {
  height:21px;
  position:relative;
}
.fancyslider input[type=range] {
  position:absolute;
  right:65px;
  left:0;
  width:auto;
}
.fancyslider input[type=text] {
  text-align:center;
  width:61px;
  position:absolute;
  right:0;
}
.rangeslider {
  display:-webkit-box;
  -webkit-box-orient:horizontal;
}
.rangeslider * {
  display:-webkit-box;
}
.rangeslider input[type=range] {
  -webkit-box-flex:1;
  margin-left:5px;
  margin-right:5px;
}
.rangeslider input[type=text] {
  width:61px;
  text-align:center;
}
.button { text-align:center; }
.button input { width:auto; }
.centered { text-align:center; }
.hr {
  border-top:1px solid rgba(0,0,0,0.5);
  border-bottom:1px solid rgba(255,255,255,0.2);
  margin:7px 0;
}
.subtext {
  color:rgba(255,255,255,0.5);
}
.grabber {
  position:relative;
  display:inline-block;
  width:140px;
  -webkit-transition:
    margin-right 0.5s ease-in-out,
    width 0.5s ease-in-out,
    opacity 0.35s ease-in;
  margin:1px 10px 1px 0;
}
.grabber input[type=submit] {
  width:100%;
  overflow:hidden;
  padding-right:15px;
  min-width:0;
  -webkit-transition:padding-right 0.35s ease-in-out;
}
.grabber .erase,.grabber .undo {
  height:18px;
  width:18px;
  right:0px;
  top:4px;
  background:url(images/close.png) no-repeat;
  -webkit-background-size:13px;
  position:absolute;
}
.grabber .undo {
  background-image:url(images/undo.png);
  display:none;
}
.grabber.active .undo {
  display:block;
}
.grabber.active .erase {
  display:none;
}
.grabber:only-child input[type=submit] {
  padding-right:8px;
}
.grabber:only-child .erase,.grabber.empty .undo {
  display:none;
}
.grabber .erase:active,.grabber .undo:active {
  opacity:0.5;
}
.grabber.active .highlight {
  -webkit-animation-name:oppulse;
  -webkit-animation-duration:0.7s;
  -webkit-animation-direction:alternate;
  -webkit-animation-iteration-count:infinite;
  -webkit-animation-timing-function:ease-in-out;
  position:absolute;
  -webkit-border-image:url(images/highlightbutton.png) 0 20 / 0 20px;
  height:32px;
  top:-5px;
  left:-5px;
  right:-6px;
}
.grabber.remove {
  width:1;
  opacity:0;
  margin-right:0;
}
.keygrabber .innergrabber {
  display:inline-block;
  margin:-1px 0;
  max-width:300px;
}
.keygrabber .addkey {
  background:url(images/add.png) no-repeat;
  display:inline-block;
  height:16px;
  width:16px;
  position:relative;
  top:1px;
  opacity:0;
  cursor:pointer;
  -webkit-transition:opacity 0.2s ease-in-out;
}
.keygrabber:hover .addkey {
  opacity:1;
}
.keygrabber .addkey:active {
  opacity:0.5;
}
.labelediting {
  -webkit-user-modify: read-write-plaintext-only;
  -webkit-user-select: text;
}
.removable .right {
  margin-right:20px;
}
.remover-widget {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 18px;
  background: url(images/close.png) no-repeat 50% 50%;
  -webkit-background-size: 13px;
  opacity:0.4;
}
.remover-widget:hover {
  opacity:1;
  -webkit-transition:opacity 0.2s ease-in-out;
  cursor:pointer;
}
.remover-widget:active {
  opacity:0.4;
  -webkit-transition:opacity 0;
  cursor:pointer;
}
.prompt {
  position: relative;
  min-height: 16px;
  white-space: pre-wrap;
  word-wrap: break-word;
  -webkit-user-modify: read-write-plaintext-only;
  -webkit-user-select: text;
  max-height:70px;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-border-radius:8px;
  padding:4px 10px;
  border: 1px solid #222;
/*  box-shadow: inset 0 1px 3px #555;*/
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(51, 51, 51, 0.5)), to(rgba(0, 0, 0, 0.5)));
}
.hascaption::after {
  display: block;
  content: ':';
  position: absolute;
  top: 50%;
  left: 110px;
  margin-top: -7px;
}
