
* {
  padding: 0;
  margin: 0;
}

br.clear{
  display: block;
  clear: both;
  height: 2px;
  line-height: 2px;
  background-color: #555;
}

div.itemDetails h3{
  font-size: 1.5em;
  margin-top: 1.5em;
  padding: 0.15em;
  border-bottom: solid 1px #00539f;
  clear: left;
  background-color: #01397b;
  color: #fd0;
}

form#engravingForm h4{
  font-size: 1.25em;
  color: #00539f;
  padding-left: 0.75em;
}

div.itemDetails,
div.fontSelect,
div.positionDetails,
div.repeatText,
div.fileUpload,
div.itemUpdate,
div.itemPreview,
div.itemComments,
div.itemCosts {
  display: block;
  clear: both;
  width: 100%;
  float: left;
}

div.previewImages{
  float: left;
  clear: left;
}

input.engravingTextInput{
  border: solid 1px #999;
  margin-bottom: 0.5em;
  float: left;
}

input.repeatText, input.updateItem, input.showFont{
  clear: left;
  float: left;
}

div#fontSelect input.showFont{
  margin-top: 1em;
  color: red;
}

input.clearText{
  clear: none;
  float: left;
  margin-left: 1em;
}

span.fileUpload, span.fontSelect{
  display: block;
  float: left;
  clear: left;
  margin-top: 5px;
  width: 100%;
}

span.fileUpload label, span.fontSelect label{
  display: block;
  width: 6em;
  float: left;
}

span.fontSelect select, span.fontSelect img{
  float: left; 
}

span.fontSelect select, span.fontSelect label{
  margin-top: 8px;
  float: left; 
}

img.fontImg{
  /*margin-top: 10px; */
}

label.rowLabel{
  display: block;
  float: left;
  clear: left;
  width: 5em; 
  margin-left: 5px;
}

label.repeatLabel{
  display: block;
  float: left;
  clear: none;
  margin-left: 10px;
}

select.repeatSelect{
  float: left;
  margin-left: 5px;
}

img.imgEngravingThumb{
  display: block;
  float: left;
}

span.rowDetails{
  display: block;
  float: left;
}

p.stepText{
  clear: left;
}

p.stepDescription{
  clear: left;
  font-weight: bold;
  margin: 0;
  padding: 1em 0 0.5em 0;
}

/* take some padding of this para, as ont image creates spacing anyway */
div.fontSelect p.stepDescription{
  padding-bottom: 0;
}

p.inputNotes{
  float: left;
  clear: both;
  width: 100%;
  margin: 0;
  padding: 0;
}

div.itemCosts p.itemCosts{
  clear: both;
  float: left;
  font-weight: bold;
  font-size: 1.2em;
  width: 100%;
}

div#totalCosts p.totalCosts{
  clear: left;
  float: left;
  font-weight: bold;
  font-size: 1.4em;
  padding: 1.5em 0;
}

table#tblTotalEngravingCosts{
  float: left;
  clear: left;
  font-size: 1.1em;
  font-weight: bold;
  width: 95%;
}

table#tblTotalEngravingCosts td.decimal{
  text-align: right;
}

form#productSummary{
  display: block;
  float: left;
  clear: left;  
}

img.previewImage{
  float: left;
}

textarea.commentsTextArea{
  width: 80%;
  border: solid 1px #252525;
  height: 5em;
}

input.add-button{
  margin-left: 1em;
}
