@font-face {
  font-family: Delicious;
  font-style: normal;
  font-weight: normal;
  src: url('Delicious-Roman.woff');
}

@font-face {
  font-family: Delicious;
  font-style: normal;
  font-weight: bold;
  src: url('Delicious-Bold.woff');
}

input:-moz-placeholder, input::-webkit-input-placeholder {
  font-style: italic;
  color: #bbbbbb;
}

html {
  background: #e9e9ea;
  height: 100%;
}

body {
  padding: 0;
  margin: 0;
  font-family: Delicious, sans-serif;
  font-size: 13px;
  height: 100%;
}

.Caption, fieldset>legend {
  color: #334860;
  font-size: 20px;
  font-weight: bold;
  text-shadow: 1px 1px 0px #fff;
  padding-left: 40px;
  padding-top: 5px;
  height: 30px;
}

fieldset {
  border: none;
  border: 1px solid #F0F0F0;
  background-color: #ECECEC;
  border-radius: 5pt;
  padding: 10px 15px 10px 15px;
  margin-bottom: 15px;  
}

h1 {
  color: #334860;
  font-size: 20px;
  text-shadow: 1px 1px 0px #fff;
  padding-left: 60px;
  padding-top: 5px;
  height: 30px;
}

input, textarea {
  border: 1pt solid #D0D0D0;
  border-radius: 2pt;
  font-family: Delicious, sans-serif;
  padding: 2pt;
  margin: 2px;
}

input[type=text], input[type=password], input[type=number], input[type=range], textarea, select, input:not([type]) {
  background: linear-gradient(bottom, #fff, #eee);
  background: -moz-linear-gradient(bottom, #fff, #eee);
  background: -webkit-linear-gradient(bottom, #fff, #eee);
  border: 1px solid #c4cedc;
  border-radius: 3px;
  box-shadow: 0 0 3px #aaa;
  padding: 2px 2px 3px 2px;
  margin-bottom: 5px;
}

input[type=text]:focus, input[type=password]:focus, input[type=number]:focus, input[type=range]:focus, textarea:focus, select, input:not([type]):focus {
  border-color: #334860;
  box-shadow: 0 0 3px #334860;
}

textarea {
  height: 100px;
  width: 500px;
}

.button, .link {
  padding: 5px 2px;
  text-decoration: none;
  font-size: 11px;
  line-height: 1;
  text-align: center;
  min-width: 100px;
  margin-right: 10px;
}

.button {
  color: #2c3a4d;
  background: linear-gradient(bottom, #f0f3f5, #cad9dd);
  background: -moz-linear-gradient(bottom, #f0f3f5, #cad9dd);
  background: -webkit-linear-gradient(bottom, #f0f3f5, #cad9dd);
  border: 1px solid #d8d8d8;
  border-radius: 5px;
  box-shadow: 0 0 3px #999;
  font-weight: bold;
  text-shadow: 0 -1px 0 #fff;
  cursor: pointer;
}

.button:hover {
  background: linear-gradient(bottom, #fbe094, #fccf56, #f8b706, #fad266);
  background: -moz-linear-gradient(bottom, #fbe094, #fccf56, #f8b706, #fad266);
  background: -webkit-linear-gradient(bottom, #fbe094, #fccf56, #f8b706, #fad266);
  border: 1px solid #dea303;
}

.button:active, .button:focus {
  box-shadow: inset 0 0 8px 4px #dea303;
}

.link {
  color: white;
  border: none;
  background: transparent;
  cursor: pointer;
}

.link:hover {
  border: none;
  color: #FFBB00;
  text-decoration: underline;
}

.dialogButtonContainer {
  display: box;
  display: -moz-box;
  display: -webkit-box;
  box-pack: end;
  -moz-box-pack: end;
  -webkit-box-pack: end;
  box-align: center;
  -moz-box-align: center;
  -webkit-box-align: center;
  padding-top: 10px;
}

.colorSpan {
  float: left;
  clear: both;
  margin-left: 8px;
}

.styleName {
  float: left;  
  padding-top: 3px;
  margin-left: 5px;
}

.layerLegende {
  float: left;
  width: 100%;
}