* {padding: 0; margin: 0;}

img {border:0}

body {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#FFF;
	background-color:#000;
 /* padding if required to stop logo being too close to top */
}

div.container {
width:1000px;
background-color:#000;
background-image:url(images/page/banlogo200910bg.gif);
background-repeat:no-repeat;
overflow:auto; /* adding overflow auto forces the container to stretch to cover the height of its children */
margin:0px auto; /* auto keeps the container in the middle of the page when user changes window width */
}

#topsection {
width:100%;
height:70px; /*this is the height of the logo */
background-image:url(images/page/starsbg2.gif);
background-position:right;
background-repeat:no-repeat;
}

#topsection img {
float:left;
border:0px;
}

h1 {
font-size:20px;
font-weight:normal;
text-align:center;
line-height:75px; /*this line-height is the height of the logo. only works if heading does not wrap. reduce line-height if text wraps */
vertical-align:middle; /*aligns text to middle of line-height */
padding:0;
color:#CCC;
}

h2 {
font-size:13px;
font-weight:bold;
display:block;
text-align:left;
padding: 3px 0 3px 5px;
color:#CCC;
background-color:#333;
}

/*the reason for this holder is to be able to horizontally centre the top nav bar */

ul.topnav {
    list-style: none;
	line-height: 1.8em;
	width:100%; 
	padding:0;
    text-align:right;
	background-image:url(images/page/topnavbg.gif);
	background-repeat:no-repeat;
	background-position:right;
	font-size:11px;
}

ul.topnav li{
	display:inline;
	padding: .3em;
}

ul.topnav li a {
  padding: .3em;
  text-decoration: none;
  color:#FFF;
}

ul.topnav li a:hover {
	background-color: #fff;
	color:#000;
}


/*temp commented out CHOOSE VISITED LINK COLORS
ul.topnav li a:active { color:#009933; }
ul.topnav li a:visited { color: #009933; }
*/

#mainnav {
clear: both;
float:left;
width:180px;
position:absolute;
top:110px;

}

#mainnav p {
padding:4px 0 0 7px;
}

#mainnav div {
padding:7px;
}

#mainnav img {
padding:2px 0 2px 0;
}

ul.sidenav {
    list-style: none;
	font-size:11px;
	line-height: 2em;
    text-align:left;
	padding:0;
}

ul.sidenav li{
	padding: 0;
	width:100%;
}

ul.sidenav li a {
  color:#FFF;
  text-decoration:none;
  display:block;
  padding-left:7px;
}

ul.sidenav li a:hover {
	color: #000;
	background-color: #fff;
}

ul.sidenav li a:active { color:#999; }
ul.sidenav li a:visited { color: #999; }

ul.sidenav li a.title {
  color:#FFF;
  display:block;
  padding-left:7px;
  font-size:11px;
  font-weight: bold;
}

ul.sidenav li a.title:hover {
	color: #000;
	background-color: #FFF;
}

ul.sidenav li a.title:active { color:#999; }
ul.sidenav li a.title:visited { color: #999; }

ul.sidenav p a:hover {
	color: #fff;
	background-color: #000;
}

#maincontent {
width:820px;
padding-top: 10px;
margin-left:180px;
position:relative;
}

#maincontent a {
  color:#CCC;
  text-decoration:underline;
}

#maincontent a.shirtclass {
margin:15px;
font-weight:bold;
font-size:13px;
}

#maincontent p {
padding:15px;
}

/* NB: if text is to be added below images then div.one80shirtrow properties will need to be asigned to a div inside which each image will be placed. One div to one image, description text will be placed in separate div within each image div */
div.shirtdisplay
{
  margin-left: 10px;
  height: auto;
  width: auto;
}	
div.shirtdisplay img
{
  display: inline;
  margin: 5px;
  border: 1px solid #999999;
}

div.desc
{
  text-align: center;
  color:#FFFFFF;
  font-weight: normal;
  width: 120px;
  margin: 2px;
}

p.shirttype {
padding:15px;
line-height:1.4em;
text-align:justify;
}

table.tshirt {
border:0;
width:100%;
}

table.tshirt td {
padding:15px;
vertical-align:top;
text-align:center;
width:50%;
}


table.ws {
border:0;
width:80%;
}

table.ws td {
padding:10px;
}

#allmain div {
padding:15px;
float:left;
}

#allmain div.shirtsection {
padding:0;
width:100%;
}

#allmain p {
padding:15px;
}

#allmain a.shirtclass {
margin:15px;
font-weight:bold;
font-size:13px;
}



img.viewcart {
float:right;
padding:4px;
}

#teeholder {
width:630px;
text-align:center;
float:left;
}

#teeholder img {
padding:5px;
border:0;
}

#teeholder p {
text-align:justify;
margin:5px 15px 5px 5px;
}

#ordercol {
float:right;
width:180px;
padding-right:10px;
padding-top:10px;
}

#ordercol p {
font-size:11px;
color:#999;
padding-top:5px;
padding-left:0px;
}

#ordercol span.boldtext {
font-weight:bold;
color:#F7CB35;
font-size:11px;
line-height:2em;
}

#ordercol a {
  color:#FFF;
  text-decoration:underline;
  font-size:11px;
}

#ordercol a:hover {
  color:#CCC;
}

#ordercol input:hover {
	background-color:#333;
}

#beloworder {
font-size:11px;
color:#999;
padding-bottom:10px;
}

#beloworder input {
float:left;
}

#beloworder img {
padding-top:10px;
}

img.imageleft { float: left }
img.imageright { float: right } 
.imagecenter {    display:block;
   margin:auto;
}

p.big14 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
}

p.spacedlist {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 150%;
    vertical-align: middle;
    text-align : left;
	font-weight: normal;
	color: #FFFFFF;
	text-decoration: none;
}

.email {
	font-family: "Courier New", Courier, mono;
	font-size: 13px;
	line-height: normal;
    text-align : left;
	font-weight: normal;
	color: #FFFFFF;
	text-decoration: none;
}
.emailreply {
	font-family: "Courier New", Courier, mono;
	font-size: 13px;
	line-height: normal;
    text-align : left;
	font-weight: normal;
	color: #FF99CC;
	text-decoration: none;
}

table.distro {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px; /* change to px value */
    text-align : center;
	font-weight: normal;
	text-decoration: none;
    background: none;
    width: 70%;
}

table.sizes {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px; 
    text-align : center;
    width:650px;
	margin-left:50px;
}

table.sizes td {
    width:25%;
}

table.tcolors {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px; 
    text-align : center;
    width:500px;
	margin-left:15px;
}

table.tcolors td {

}

table.tprice {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px; 
    text-align : center;
    width:400px;
	margin-left:15px;
}

table.tcolors td {

}

p.small {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: normal;
	text-decoration: none;
    line-height: normal;
}

a.small1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-weight: normal;
	color:#FFF;
	text-decoration:underline;
    line-height: normal;
}

a.small1:link {

}

a.small1:visited {
	color: #999999;
}

a.small1:hover {
	color:#CCC;
}

a.small1:active {
	color: #CCC;
}

.footer {
	font-family: "Times New Roman", Times, serif;
	font-size: 12px;
	color:#CCC;
	width:800px;
	text-align:right;
	float:right;
}

.hcartarea {
width:41%;
float:left;
margin: 8px;
padding: 5px;
font-size:11px;
color:#E60C00;
}

.vcartarea {
width:100%;
margin: 0px;
padding: 0px;
font-size:12px;
font-weight:bold;
text-align:left;
color:#FFF;
}

.sizebox {
        position:relative;
		width:125px;
        top: 3px; 
        font-size: 12px; 
        font-family: Verdana, Arial, Helvetica, sans-serif;
}

.cartbutton {
background-color:#000;
padding: 2px;
margin-top: 7px;
color:#F7CB35;
font-size: 16px;
font-weight:bold;
border-color:#CCC;
border-width:2px;
font-family:Arial, Helvetica, sans-serif;
}


.viewbutton {
background-color:#000;
padding: 2px;
color:#FFF;
font-size: 14px;
font-weight:bold;
border-color:#CCC;
border-width:2px;
font-family:Arial, Helvetica, sans-serif;
}

.mainitalic {
font-style:italic;
}

.mainbold {
font-weight:bold;
}

.maincenter {
text-align : center;
}

.hot {
color:#FF0000;
}

.moreshirts {
text-align:center;
padding:12px;
}

/*following is a fix to make height of container stretch to full height in firefox: can be removed if body background color is same as div backgrounds http://www.positioniseverything.net/easyclearing.html
  .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }
	 */

.roundedcornr_box {
   background: #333333;
}
.roundedcornr_top div {
   background: url(images/page/roundedcornr_236587_tl.png) no-repeat top left;
}
.roundedcornr_top {
   background: url(images/page/roundedcornr_236587_tr.png) no-repeat top right;
}
.roundedcornr_bottom div {
   background: url(images/page/roundedcornr_236587_bl.png) no-repeat bottom left;
}
.roundedcornr_bottom {
   background: url(images/page/roundedcornr_236587_br.png) no-repeat bottom right;
}

.roundedcornr_top div, .roundedcornr_top, 
.roundedcornr_bottom div, .roundedcornr_bottom {
   width: 100%;
   height: 10px;
   font-size: 1px;
}
.roundedcornr_content { margin: 0 10px; }
