body{ font: 12px/1.5em Arial, sans-serif; background: #ffffff; color: #000000;}
h2{
	font-size: 16px;
	color: #000000;
}

a, a:visited {
  color: #eeeeee;
  text-decoration: none;
}
a:hover {
  color: #eeeeee;
}
.header, .content{ width: 960px; margin: 0 auto;  }
.content .feature{ width: 300px; float: left; margin-right: 15px;}
/*.feature{ border-bottom: 1px solid #85a0ac; }*/

#screen {
  /*background-color: #fff;*/
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% auto;
  border: 1px solid #999;
  height: 300px;
  margin: 0 auto;
  max-width: 900px;
  width: 85%;
   text-align:left;
}

#dimensions-container {
  margin: 20px auto;
  width: 600px;
  text-align: center;  
}
#dimensions-container input[type="button"] {
  width: 80px;
  background-color: #333;
  color: #fff;
  cursor: pointer;
  border: solid 1px #999;
}

#font_img:hover{cursor:move;
}

#dimensions-container input[type=text] {
  border: solid 1px #ccc;
}
#dimensions-container input.auto {
  background-color: #e0ffe0;
  font-weight: bold;
}
#dimensions {
  margin: 0px auto;
  width: 400px;
  height: 140px;
  background-position: center;
  background-repeat: no-repeat;
  border: solid 1px #999;
}
.undev, .undev h2{ color: #ccc; }
.back-colors{ display: none; }
.clear{ clear: both; }

.fonts-list {
	height: 300px;
	overflow: auto;
	overflow-x: hidden;
	overflow-y: auto;
}
.image_content
{
    width: 25%;
}
#send-container {
  padding: 20px;
  font-weight: bold;
  font-size: 14px;
  text-align: center;
}

#superbox {
  background-color: #666;
}

#form-container {
  width: 440px;
  margin: 0 auto;
}
#contact-table {
  border-spacing: 0px;
  border-collapse: collapse;
  width: 100%;
}

#fonts-table,#image-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0px;
}

#fonts-table td,
#image-table td{
  padding: 2px;
  border-bottom: 1px solid #333;
}
tr.selected td {
  background-color: #666;
  color: #fff;
}
td.font-divider {
  background-color: #fff;
  padding: 3px;
  text-align: center;
  font-weight: bold;
}
td.font-preview img,
td.image-preview{
  cursor: pointer;
}
#plating-table {
  border-collapse: collapse;
  border-spacing: 0px;
}
#plating-table td {
  text-align: center;
  vertical-align: middle;
  padding: 6px;
  border-bottom: solid 1px #333;
  font-weight: bold;
}
#plating-table td label {
  cursor: pointer;
}

#contact-table th, #contact-table td {
  vertical-align: top;
  padding: 4px;
}
#contact-table th {
  text-align: right;
}
#contact-table td {
  text-align: left;
}

.form-title {
  font-weight: bold;
  font-size: 16px;
  text-align: center;
}
#contact-table .section {
	font-weight: bold;
	font-size: 16px;
	background-color: #FFFFFF;
	padding: 8px;
}
.centered {
  text-align: center !important;
}
#form-container input[type=text], 
#form-container textarea {
  width: 280px;
}
#form-container textarea {
  height: 80px;
}
#form-container input[type=submit] {
  width: 150px;
  font-weight: bold;
}

div.color-container {
  display: block;
  width: 36px;
  height: 36px;
  float: left;
  margin: 0px;
  padding: 0px;
  border: solid 1px #fff;
}
div.color-block {
  display: block;
  width: 20px;
  height: 20px;
  margin: 6px;
  cursor: pointer;
  border: solid 2px;
  border-color: #ccc #666 #333 #999;
}
div.color-selected {
  background-color: #d0d0d0;
  border-color: #ff6600;
}

.tile-option {
  display: block;
  width: 70px;
  height: 70px;
  margin: 5px auto;
  background-position: 0 0;
  background-repeat: repeat;
}

#tile-mirror {
  background-image: url(../images/tiles/stainless-mirror.jpg);
}
#tile-brushed {
  background-image: url(../images/tiles/tile-002.png);
}
#tile-gold {
  background-image: url(../images/tiles/tile-003.png);
}

#stainless {background-image: url(../images/tiles/stainless.jpg);}
#carbon-fibre{background-image: url(../images/tiles/carbon-fibre.jpg);}
#teak {background-image: url(../images/tiles/teak.jpg);}
#carbon-fibre-white {background-image: url(../images/tiles/carbon-fibre-white.jpg);}


#font_img {
    border: 1px solid #000000;
    width: 300px;
    height: 40px;
    overflow: hidden;
}
#nwgrip, #negrip, #swgrip, #segrip, #ngrip, #egrip, #sgrip, #wgrip {
    width: 10px;
    height: 10px;
    background-color: #ffffff;
    border: 1px solid #000000;
}
#nwgrip {
    left: -5px;
    top: -5px;
}
#negrip{
     top: -5px;
     right: -5px;
}
#swgrip{
    bottom: -5px;
    left: -5px;
}
#segrip{
     bottom: -5px;
    right:-5px;
}
table.select_part_class {width: 100%;border-collapse: collapse;}
.select_part_mobile_only {display:none;}
@media only screen and (max-width: 610px) {
.desktop_only {display:none;}
.select_part_mobile_only {display:block;}
#nwgrip, #negrip, #swgrip, #segrip, #ngrip, #egrip, #sgrip, #wgrip {
      width: 30px;
    height: 30px;
    background-color: rgba(255,255,255,0.4);
}
td.font-preview img,
td.image-preview img{width:75%!important}
#dimensions-container {width:100%}
#dimensions-container #dimensions{background-size: 98% auto;height: 56px!important;width: 210px!important;}
#send-container img{width:100%}
#superbox-wrapper {position:absolute}
#superbox {width:300px!important;margin:0 auto;display:block;}
#superbox #superbox-innerbox {height:680px!important}
#superbox #superbox-innerbox iframe{width:100%!important;height:680px!important;}
#form-container{width:100%}
#form-container input[type="text"], #form-container textarea {width: 175px;}
#contact-table {width: auto;}
}