/* Natural box layout model */
*
{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

html
{
  overflow: -moz-scrollbars-vertical; 
  overflow-y: scroll;
  font-size: 100%;
  height: 100%;
}

/* Body Content */

body
{
  font-family: Arial, Helvetica, sans-serif;
  text-rendering: optimizeLegibility;
  background: white;
  overflow-x: auto;
  color: #202020;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.618;
  height: 100%;
}

iframe
{
  border: none; 
}

table
{
  border-collapse: collapse;
  border-spacing: 0px;
}

td, th
{
  font-family: Arial, Helvetica, sans-serif;
  vertical-align: top;
  font-size: 15px;
  font-weight: 400;
}

p
{
  font-family: Arial, Helvetica, sans-serif;
  line-height: 125%;
  font-size: 15px;
  font-weight: 400;
  margin: 0px 0px 1em 0px;
}

br.clear
{
  clear: both;
  display: block;
  line-height: 0px;
}

span.clear
{
  clear: both;
  display: block;
  height: 0px;
}

hr
{
  background: #ccc;
  clear: both; 
  display: block;
  float: none; 
  width: 100%; 
  height: 1px;
  margin: 10px auto;
  border: none; 
}

img
{
  display: inline-block;
  -ms-interpolation-mode: bicubic;
  zoom: 1;
}

a
{
  color: #404040;
  text-decoration: none;
}

a:hover,
a:focus
{
  color: #606060;
  text-decoration: underline;
}

a:focus
{
  outline: none;
}

a img
{
  border: none;
}

ol,
ul
{
  padding: 0px 0px 0px 30px;
}

ol.indent,
ul.indent
{
  list-style-type: none;
}

li
{
  padding: 0px 0px 8px 0px;
  line-height: 125%;
}

ol ol
{
  padding: 0px 0px 0px 10px;
}

ol ol li
{
  list-style-type: lower-alpha;
  margin-left: 12px;
  line-height: 110%;
}

/* Alignment Override */

p.left,
td.left,
th.left
{
  text-align: left !important;
}

p.center,
td.center,
th.center
{
  text-align: center !important;
}

p.right,
td.right,
th.right
{
  text-align: right !important;
}

img.left
{
  float: left !important;
  margin-right: 10px;
  border: 1px solid #999999;
}

img.right
{
  float: right !important;
  margin-left: 10px;
  border: 1px solid #999999;
}

div.left,
span.left,
ul.left,
table.left
{
  float: left !important;
  text-align: left !important;
}

div.center,
span.center,
ul.center,
table.center
{
  position: relative;
  margin-left: auto;
  margin-right: auto;
  text-align: center !important;
}

div.right,
span.right,
ul.right,
table.right
{
  float: right !important;
  text-align: right !important;
}

/* Text Formatting Override */

.inline
{
  display: inline-block !important;
}

.nowrap
{
  white-space: nowrap !important;
}

.wrap
{
  white-space: normal !important;
}

.margin
{
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.margin-box
{
  margin: 20px 20px !important;
}

.nopad
{
  margin: 0px !important;
  padding: 0px !important;
}

.strike
{
  text-decoration: line-through !important;
}

.upper
{
  text-transform: uppercase !important;
}

.underlined
{
  width: 100%;
  padding-bottom: 0px;
  margin-bottom: 10px !important;
  border-bottom: 1px solid #cccccc;
  padding: 0em 0.1em 0em 0.1em;
}

.bold
{
  font-weight: bold !important;
}

/* Small and Large Font */

.small
{
  font-size: 11px !important;
}

span.small
{
  font-size: 11px !important;
  line-height: 100%;
}

ul.small li,
ol.small li,
li.small
{
  font-size: 11px !important;
  line-height: 110%;
  list-style-type: lower-alpha;
}

.large
{
  font-size: 18px !important;
}

span.large
{
  font-size: 18px !important;
  line-height: 100%;
}

ul.large li,
ol.large li,
li.large
{
  font-size: 18px !important;
  line-height: 110%;
  list-style-type: lower-alpha;
}

/* Input Styles */

input,
select,
textarea,
div.readonly div
{
  cursor: text;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  vertical-align: middle;
  height: 28px;
  padding: 0px 6px;
  margin-bottom: 1px;
  color: #202020;
  background: #ffffff;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 2px solid #808080;
  max-width: 360px;
  min-width: 260px;
  max-height: 300px;
  display: inline-block;
  zoom: 1;
}

div.readonly
{
  max-width: 360px;
  min-width: 260px;
  display: inline-block;
  zoom: 1;
}

div.readonly div
{
  color: #989898;
  background-color: #f1f1f1;
  border: 2px solid #a0a0a0;
  padding: 5px 6px 0px 6px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  -ms-text-overflow: ellipsis;
}

input:focus,
select:focus,
textarea:focus
{
  outline: none;
  border-color: #a0a0a0;
}

select
{
  padding: 0px 6px 1px 6px;
}

textarea
{
  height: auto;
  padding: 6px 10px;
}

input[type="radio"],
input[type="checkbox"]
{
  margin: 4px 10px 0px 0px;
  line-height: normal;
  max-width: initial;
  min-width: initial;
}

input[type=button],
input[type=submit]
{
  cursor: pointer;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  font-weight: 700;
  text-transform: uppercase;
  text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
  line-height: 20px;
  color: white;
  height: 34px;
  padding: 4px 19px;
  text-align: center;
  white-space: nowrap;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #25bec3;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#ffa4ddee', endColorstr='#ff25bec3');
  background-image: -webkit-linear-gradient(top, #a4ddee 0%, #25bec3 100%);
  background-image: -moz-linear-gradient(top, #a4ddee 0%, #25bec3 100%);
  background-image: -o-linear-gradient(top, #a4ddee 0%, #25bec3 100%);
  background-image: linear-gradient(to bottom, #a4ddee 0%, #25bec3 100%);
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom: 2px solid #0c3f54;
  max-width: initial;
  min-width: initial;
  display: inline-block;
  zoom: 1;
}

input[type=button]:hover,
input[type=submit]:hover
{
  background: #25bec3;
}

input[type=button].slim,
input[type=submit].slim
{
  width: auto;
}

input[type=button].pad,
input[type=submit].pad
{
  padding: 9px 49px;
}

input[type=button].full-width,
input[type=submit].full-width
{
  width: 100%;
}

input.fit,
select.fit,
textarea.fit
{
  width: auto;
  min-width: 80px;
}

input::-moz-focus-inner,
select::-moz-focus-inner
{
  border: 0px;
}

/* Form Input */

.inputform
{
  display: block;
}

.inputform table
{
  width: 100%;
  margin: 20px 0px 0px 0px;
}

.inputform th
{
  padding: 3px 20px 3px 0px;
  white-space: nowrap;
  text-align: right;
  vertical-align: middle;
  font-weight: normal;
}

.inputform td
{
  padding: 3px 0px 3px 0px;
  white-space: nowrap;
  text-align: left;
  vertical-align: middle;
}

.inputform label
{
  font-size: 17px;
  font-weight: normal;
}

.inputform img
{
  width: 16px;
  height: 16px;
  position: relative;
  top: 3px;
  right: -6px;
}

.inputform select
{
  width: auto;
  min-width: 80px;
}

.inputform input[type=text],
.inputform input[type=password],
.inputform textarea
{
  width: 360px;
  min-width: 360px;
}

.inputform input[type=text].med,
.inputform input[type=password].med,
.inputform select.med
{
  width: 260px;
  min-width: 260px;
}

.inputform input[type=text].sml,
.inputform input[type=password].sml,
.inputform select.sml
{
  width: 180px;
  min-width: 180px;
}

.inputform input[type=text].num,
.inputform input[type=password].num,
.inputform select.num
{
  width: 80px;
  min-width: 80px;
}

/* Heading Styles */

.h1, .h2, .h3, .h4, .h5, .h6, .block,
h1, h2, h3, h4, h5, h6
{
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 700;
  vertical-align: baseline;
  white-space: nowrap;
  margin: 10px 0px;
}

.h1,
h1
{
  font-size: 30px;
  line-height: 33px;
}

h1.header
{
  width: 100%;
  display: block;
  background: #808080;
  color: #ffffff;
  padding: 8px 24px;
  margin: 3px 0px 10px 0px;
  text-transform: uppercase;
}

.h2,
h2
{
  font-size: 25px;
  line-height: 28px;
}

.h3,
h3
{
  font-size: 22px;
  line-height: 24px;
}

.h4,
h4
{
  font-size: 18px;
  line-height: 20px;
}

.h5,
h5
{
  font-size: 16px;
  line-height: 17px;
}

.h6,
h6
{
  font-size: 15px;
  line-height: 16px;
}

.h1.full-width, .h2.full-width, .h3.full-width, .h4.full-width, .h5.full-width, .h6.full-width,
h1.full-width, h2.full-width, h3.full-width, h4.full-width, h5.full-width, h6.full-width
{
  width: 100%;
  display: block;
  text-align: center;
  margin-bottom: 20px;
}

/* Image Cutouts */

div.page-image
{
  float: right;
  position: relative;
  display: inline-block;
  width: 200px;
  height: 200px;
}

div.page-image img
{
  position: relative;
  width: 200px;
  height: 200px;
  padding: 0px 25px 0px 25px;
}

div.page-image:after
{
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  height: 200px;
  width: 200px;
  background-repeat: no-repeat;
}

div.page-image.angle:after
{
  background-image: url('icons/cutout-angle.png');
}

div.page-image.circled:after
{
  background-image: url('icons/cutout-circle.png');
}

div.page-image.cloud:after
{
  background-image: url('icons/cutout-cloud.png');
}

div.page-image.cloud1:after
{
  background-image: url('icons/cutout-cloud1.png');
}

div.page-image.cloud2:after
{
  background-image: url('icons/cutout-cloud2.png');
}

div.page-image.fade:after
{
  background-image: url('icons/cutout-fade.png');
}

div.page-image.frame:after
{
  background-image: url('icons/cutout-frame.png');
}

div.page-image.heart:after
{
  background-image: url('icons/cutout-heart.png');
}

div.page-image.orbit:after
{
  background-image: url('icons/cutout-orbit.png');
}

div.page-image.orbit1:after
{
  background-image: url('icons/cutout-orbit1.png');
}

div.page-image.oval:after
{
  background-image: url('icons/cutout-oval.png');
}

div.page-image.pulse:after
{
  background-image: url('icons/cutout-pulse.png');
}

div.page-image.speech:after
{
  background-image: url('icons/cutout-speech.png');
}

div.page-image.stamp:after
{
  background-image: url('icons/cutout-stamp.png');
}

/* Unsupported Browsers */

#unsupported-browser
{
  position: relative;
  width: 100%;
  background: #fefbf6;
  padding: 4px 0px 10px 0px;
  margin: 0px;
  text-align: center;
  border-bottom: 4px solid #f8a531;
  font-size: 14px;
}

#unsupported-browser h4
{
  color: #f17030;
}

/* Main Document */

#site
{
  width: 100%;
}

#sitemain
{
  margin: auto;
  width: 1180px;
}

#slideshow
{
  width: 910px;
  height: 220px;
  position: relative;
  margin: 0px 0px 10px -20px;
  display: block;
}

#slideshow img
{
  width: 910px;
  height: 220px;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

#spotlight
{
  float: right;
  width: 302px;
  height: 326px;
  border: 1px solid #404040;
  margin: 0px 0px 20px 20px;
  padding: 0px;
}

#spotlight p
{
  width: 100%;
  display: block;
  background: #808080;
  color: #ffffff;
  padding: 4px;
  text-align: center;
  margin: 0px;
  text-transform: uppercase;
}

#spotlight div
{
  width: 298px;
  height: 298px;
  position: relative;
  padding: 5px;
  display: block;
}

#spotlight div img
{
  width: 288px;
  height: 288px;
  display: block;
  position: absolute;
  top: 5;
  left: 5;
  z-index: 1;
}

.logininfo
{
  color: #808080;
  font-size: 11px;
  text-align: right;
}

.login
{
  width: 100%;
  height: 100%;
  display: block;
}

.login div
{
  margin: auto;
  width: 560px;
  height: 500px;
  padding: 240px 0px 0px 30px;
  display: block;
  background: url("images/fletcher-login.png") left top no-repeat;
}

.login div table
{
  width: 360px;
}

td.sidebar
{
  width: 270px;
  padding-top: 17px;
}

td.frame
{
  width: 100%;
  padding: 2px 0px 10px 0px;
}

div.content
{
  width: 100%;
  padding: 10px 0px 20px 20px;
}

div.content-home
{
  width: 100%;
  padding: 3px 0px 0px 20px;
}

/* Menu Styles */

.menu
{
  background-color: #808080;
  padding: 12px 8px;
  width: 270px;
}

.menu table
{
  width: 100%;
}

.menu td a
{
  color: #ffffff;
  display: block;
  text-decoration: none;
  width: 100%;
  border: 1px solid #808080;
  border-radius: 5px;
}

.menu td a:hover
{
  background-color: #a0a0a0;
  text-decoration: none;
}

.menu td.menuitem
{
  background-color: #808080;
  color: #ffffff;
  font-size: 16px;
  padding: 3px 0px;
  text-transform: uppercase;
}

.menu td.menuitem a
{
  color: #808080;
  padding: 8px 8px 6px 8px;
  border: 1px solid #808080;
  border-radius: 8px;
  background-color: #ffffff;
}

.menu td.menuitem a:hover
{
  background-color: #e0e0e0;
}

.menu td.category
{
  color: #ffffff;
  font-size: 15px;
  font-weight: bold;
}

.menu td.category a
{
  padding: 3px 5px 3px 12px;
}

.menu td.product
{
  color: #ffffff;
  font-size: 13px;
}

.menu td.product a
{
  padding: 2px 5px 2px 12px;
}

/* Site Table Styles */

a.link
{
  color:#404040;
  font-weight:bold;
}

a.linked
{
  color:#303030;
  font-weight:bold;
}

a.login
{
  color:#202020;
  font-weight:bold;
  font-size:13px;
}

table.size
{
  border:1px solid #404040;
  border-collapse:collapse;
}

table.size th
{
  color:#ffffff;
  background-color:#808080;
  border:1px solid #404040;
  border-collapse:collapse;
  padding: 1px 2px;
}

table.size td
{
  border:1px solid #404040;
  border-collapse:collapse;
  background-color:#ffffff;
  padding: 2px 4px;
}

table.feature
{
  border:1px solid #404040;
  border-collapse:collapse;
}

table.feature th
{
  color:#ffffff;
  background-color:#808080;
  border:1px solid #404040;
  border-collapse:collapse;
  font-weight:bold;
  padding-top:5px;
  padding-left:10px;
  padding-right:6px;
  padding-bottom:6px;
  text-align:left;
}

table.feature td
{
  background-color:#ffffff;
}

#productImage
{
  width: 360px;
  height: 360px;
  background-color: #ffffff;
  border: 1px solid #404040;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  margin-right: 24px;
}

table.product
{
  border:1px solid #404040;
  border-collapse:collapse;
}

table.product th
{
  color:#ffffff;
  background-color:#808080;
  border:1px solid #404040;
  border-collapse:collapse;
  font-weight:bold;
  padding-top:4px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:4px;
  vertical-align:top;
}

table.product th.left
{
  text-align:left;
}

table.product td
{
  background-color:#ffffff;
  border:1px solid #404040;
  border-collapse:collapse;
  padding-top:2px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:2px;
  vertical-align:middle;
}

table.product td.small,
table.product td.small p,
table.product td.small ul,
table.product td.small li
{
  font-size: 13px;
  line-height: 100%;
  margin: 0px 0px 0px 0px;
}

table.product td.stock
{
  font-weight:bold;
  text-align:center;
}

table.product td.quantity
{
  padding: 1px;
  text-align:center;
}

table.basket td.details input,
table.basket td.details select,
table.product td.quantity input
{
  width: auto;
  margin: 0px;
  font-weight:bold;
  text-align:center;
  font-size: 15px;
  border: 1px solid #808080;
  height: 25px;
  min-width: 80px;
}

table.basket td.details table
{
  width: 100%;
}

table.product td.quantity input
{
  width: 80px;
}

table.basket
{
  border:1px solid #404040;
  border-collapse:collapse;
  font-size:14px;
}

table.basket th
{
  color:#ffffff;
  background-color:#808080;
  border:1px solid #404040;
  border-collapse:collapse;
  font-size:14px;
  font-weight:bold;
  padding-top:4px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:4px;
  vertical-align:top;
}

table.basket th.left
{
  text-align:left;
}

table.basket th.title
{
  padding-top:5px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:6px;
  font-size: 15px;
}

table.basket td
{
  background-color:#ffffff;
  border:1px solid #404040;
  border-collapse:collapse;
  font-size:13px;
  padding-top:2px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:2px;
  vertical-align:middle;
}

table.basket td.details
{
  padding:8px;
  text-align:left;
  vertical-align:top;
  background-color:#ffffff;
}

table.basket tr.empty
{
  background-color:#B7C1C8;
}

table.basket tr.empty td
{
  background-color:#B7C1C8;
  color:#000000;
  font-size:14px;
  font-weight:bold;
  padding-top:8px;
  padding-bottom:8px;
}

table.basket tr.divider
{
  padding:0px;
  height:2px;
}

table.basket tr.divider td
{
  background-color:#808080;
  border:none;
  padding:0px;
  height:2px;
}

table.basket td.action
{
  border:1px solid #404040;
  border-collapse:collapse;
  vertical-align:middle;
  padding:0px;
}

table.basket td.action a
{
  color:#ffffff;
  background-color:#808080;
  font-size:15px;
  font-weight:bold;
  text-align:center;
  padding-top:4px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:4px;
  text-decoration:none;
  display:block;
}

table.basket td.action a:hover
{
  background-color:#859CA9;
  text-decoration:none;
}

table.basket a.quantity
{
  color:#000000;
  font-weight:bold;
  text-decoration:none;
  padding-left:8px;
  padding-right:8px;
}

table.basket a.quantity:hover
{
  color:#ffffff;
  background-color:#A00000;
  text-decoration:none;
}

table.basket tr.summary
{
  background-color:#A00000;
}

table.basket tr.summary td
{
  font-weight:bold;
  padding-top:2px;
  padding-bottom:2px;
  text-align:right;
}

table.basket tr.summary td.checkout
{
  padding: 6px 10px;
}

table.basket tr.summary td.checkout input
{
  width: 100%;
}

table.basket tr.summary td.checkout a
{
  color:#ffffff;
  background-color:#A00000;
  font-weight:bold;
  text-decoration:none;
  display:block;
  padding-top:4px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:4px;
  text-align:center;
}

table.basket tr.summary td.checkout a:hover
{
  color:#ffffff;
  background-color:#859CA9;
  text-decoration:none;
}

table.detail
{
  border:1px solid #404040;
  border-collapse:collapse;
  font-size:14px;
}

table.detail th
{
  color:#000000;
  background-color:#ffffff;
  font-size:13px;
  font-weight:bold;
  padding-top:2px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:2px;
  text-align:left;
  vertical-align:top;
}

table.detail th.title
{
  font-size:14px;
  padding-top:3px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:3px;
  text-align:center;
}

table.detail td
{
  background-color:#ffffff;
  font-size:13px;
  padding-top:1px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:1px;
  vertical-align:middle;
}

table.detail td.address
{
  vertical-align:top;
  border:none;
}

table.detail a.checkout
{
  color:#ffffff;
  background-color:#A00000;
  border:1px solid #404040;
  font-weight:bold;
  padding-top:3px;
  padding-left:20px;
  padding-right:20px;
  padding-bottom:3px;
  text-decoration:none;
  display:block;
}

table.detail a.checkout:hover
{
  color:#ffffff;
  background-color:#A00000;
  text-decoration:none;
}

table.confirm
{
  border:1px solid #404040;
  border-collapse:collapse;
  font-size:14px;
}

table.confirm th
{
  color:#000000;
  background-color:#ffffff;
  font-size:13px;
  font-weight:bold;
  padding-top:2px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:2px;
  text-align:left;
  vertical-align:middle;
}

table.confirm th.title
{
  font-size:14px;
  padding-top:3px;
  padding-left:6px;
  padding-right:6px;
  padding-bottom:3px;
  text-align:center;
}

table.confirm td
{
  background-color:#ffffff;
  font-size:13px;
  padding-top:0px;
  padding-left:0px;
  padding-right:0px;
  padding-bottom:0px;
  vertical-align:middle;
}

table.confirm input.checkout
{
  color:#ffffff;
  background-color:#A00000;
  font-weight:bold;
  padding-top:3px;
  padding-left:100px;
  padding-right:100px;
  padding-bottom:3px;
}