@charset "UTF-8";
* {
    padding: 0;
    margin: 0;
}
html {
    height: 100%;
    margin-bottom: 1px;
}
body {
    background-color:#ffffff;
    width: 600px;
    color: #666666;
    font-family: "century gothic", helvetica, arial;
    font-size: 14px;
}
a {
    text-decoration:none;
}
a:active { outline: none; }
a:focus { -moz-outline-style: none; }
a, h1, h2, h3, .color {
  color:#27bdff;
  font-weight:normal;
}
p, h1, h2, h3, label, input, textarea, ul, hr {
  margin: 0px 20px 10px 20px; /*insert the banners as TVs in stead*/
  margin: 0px 0px 10px 0px;
}
h1{font-size:22px;}
h2{font-size:18px;}
h3{font-size:14px;}
li{margin:0px 0px 0px 20px;}
hr { height:2px; background-color:#27bdff; border:0px; }/******************** overwrite styles set in content.css ***********************/
body {
    background: #fff url(images/diyteez-t-shirt-body-background.gif) repeat-x top;
    width: 100%;
}
p, h1, h2, h3, label, input, textarea, hr {
  margin: 0px 0px 10px 0px;
}
ul { margin: 0px 0px 0px 10px;}
li { margin: 0px 0px 0px 5px;}



/******************** template styles ***********************/
img {
    border: 0px;
}
#masthead {
    height: 150px;
    width: 250px;
    display:block;
}
#wrapper {
    background: url(images/diyteez-t-shirt-page-background.gif) no-repeat top;
    margin: 0px auto;
    width: 850px;
    padding: 0px 67px 40px 73px;
    min-height: 645px;
}

/******************** left col ***********************/
#t-shirt-left {
    width: 600px;
    float: left;
}
#content {
  margin: 0px 20px 10px 20px;
}
/*
#content p, #content h1, #content h2, #content h3, #content label, #content input, #content textarea, #content ul, #content hr {
  margin: 0px 20px 10px 20px;
}
#content li {
  margin: 0px 0px 0px 20px;
}
*/

/******************** menu ***********************/
#menu {
    font-weight: bold;
    font-size: 18px;
    padding: 4px 0px 0px 10px;
}
#menu ul {
    margin: 0px;
    height: 40px;
}
#menu ul li {
    margin: 0px;
    list-style: none;
    float: left;
    padding: 0px 7px;
    border-right: 2px solid #666666;
}
#menu ul li a {
    color:#666666;
    font-weight: bold;
    text-transform: uppercase;
}
#menu ul li.last {
    border-right: 0px;
}

/******************** right col ***********************/
#t-shirt-right {
    width: 216px;
    padding: 50px 12px 0px 12px;
    float: left;
}
/* #t-shirt-right div p {
    padding: 0px 20px;
}*/
#t-shirt-right div h3 {
    color: #fff;
    font-size: 20px;
    padding: 12px 10px 0px 10px;
    text-transform: uppercase;
    margin-bottom: 0px;
}
#t-shirt-right #cart h3 {
    background: url(images/t-shirt-cart.gif) no-repeat;
    padding-top: 14px;
    min-height: 35px;
}
#t-shirt-right #cart #cartContents {
    padding: 5px 20px 10px 20px;
    border: 1px solid #666666;
    margin-bottom: 20px;
}
.tabs img {
    border: 0px;
    margin-top: 20px;
}
#t-shirt-right #whats-hot h3 {
    background: url(images/t-shirt-whats-hot.gif) no-repeat;
    padding-top: 21px;
    min-height: 45px;
}
#t-shirt-right #whats-hot #whats-hot-contents {
    padding: 0px 20px 10px 20px;
    border: 1px solid #27bdff;
    margin-bottom: 20px;
}
#t-shirt-right #newsletter {
    background: url(images/t-shirt-newsletter.gif) no-repeat;
    min-height: 119px;
    color: #fff;
}
#t-shirt-right #newsletter h3 {
    padding-top: 12px;
}
#t-shirt-right #newsletter #newsletter-contents {
    padding: 0px 20px;
}


/******************** footer ***********************/

#footer {
    margin: 0px auto;
    width: 890px;
    border-top: 5px solid #27bdff;
    padding: 40px 0px;
    font-size: 14px;
    text-align: right;
}
#footer .menu{
    padding: 20px 0px 0px 0px;
    font-size: 12px;
}
#footer a{
    text-decoration: none;
}
#footer #menuFooter {
    padding: 5px 0px;
}
#footer #menuFooter a {
    text-transform: uppercase;
    color: #666666;
    border-right: 1px solid #666666;
    padding: 0px 5px;
    font-size: 12px;
}
#footer #menuFooter a.last {
    border: 0px;
}


.clearBoth { clear: both; }



/******************** t-shirt configuator ***********************/
#instructionsContainer {
    width: 580px;
    height: 25px;
}
#instructions {
    padding: 5px 0px 3px 10px;
    background: #27bdff;
    color: white;
}
#configuator{
    float: left;
    width: 350px;
    margin: 0px;
}
.configuratorLabel{
    text-align: center;
}
#tshirt{
    height: 350px;
}
#design{
/*    width:75px;
    height:100px;
    margin:80px 0px 0px 135px;*/
}
#garmentType, #tshirtColours, #categoriesContainer, #designs {
    float: left;
    width: 35px;
}
#categoriesContainer, #designs {
    width: 140px;
}
#garmentType img, #tshirtColours img, #designs img{
    width: 35px;
    height: 35px;
}
#designs img{
    margin: 0px 2px 2px 0px;
}
label {
    width: 70px;
}

/******************** display items ***********************/
.category-page-show-item {
    width: 255px;
    margin: 10px;
    float: left;
    text-align: center;
}
.category-page-show-item img {
    width: 255px;
    height: 383px;
}
.category-page-show-item .price {
    width: 176px;
    margin: 0px auto;
    padding: 7px 20px;
    height: 35px;
    background: url(images/t-shirt-category-price-bg.gif) no-repeat;
    color:#666666;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: left;
}input, textarea, select, option {
    font-family: Helvetica, Verdana, Arial, sans-serif;
    font-size: 12px;
    color: #666666;
    border: 1px solid #999;
    background: #fff;
    padding-left: 3px;
}
option {
    border: 0px;
}
input.text {
    width: 70px;
}
textarea {
    height:100px;
    padding-left: 3px;
}
label{
  width: 100px;
}
.button{
    width:110px;
    height: 24px;
    display: block;
    padding: 4px 0px;
    text-align: center;
    cursor:pointer;
    color: white;
    border: 0px;
    /*text-transform: uppercase;*/
    background: url(images/button.png) no-repeat;
}
input.button{
    display: inline;
}


/* PURCHASER'S DETAILS FORM */

div.contactForm{
    width: 300px;
    padding: 0px;
    margin: 0px;
}
div.row {
    clear: both;
    padding-top: 5px;
}
div.row span.label {
    float: left;
    width: 90px;
    text-align: right;
    padding:0px 10px 0px 0px;
}
div.row span.formw {
    float: right;
    width: 190px;
    text-align: left;
}
div.row span.formw input.text, div.row span.formw textarea{
    width: 190px;
}
div.row span.formw textarea{
    height:50px;
}
div.spacer {
    clear: both;
}