/*structural stuff*/

* {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

body {
    background: #fff url(images/bg.gif) repeat-x;
    font-family:  "Trebuchet MS", helvetica, arial, sans-serif;
    font-size: 100%;
    line-height: 100%;
    color:#666666;
	
}

#menu {
    height: 70px;
    line-height: 70px;
    background: #fff url(images/menu2.gif) no-repeat;
}

#content {
    background: #fff url(images/content1.gif) repeat-y;
    padding: 0 40px 20px 20px;
}


#header {
    height: 70px;
}

#wrap {
    margin: 0 auto;
    width: 960px;
}

.right {
    float: right;
    width: 82%;
    text-align: justify;
	max-width:740px;	
}

.rightx {
    float: left;
    width: 920px;
    text-align: justify;
	position:absolute
	left:0px;
    top:100px;
	
}









/*end structural stuff*/


/*header stuff*/

.left1 {
    float: left;
    width: 17%;
    padding-top: 10px;
	padding-left: 15px;	
}


div.right1 { 
width: 200px;
position: relative; 
float: right; 
} 


#header h1 a { 
    color: #FFFFFF;
    text-decoration: none;
    font-weight: 100;
    letter-spacing: -2px;
}

#header h1 a:hover {
    color: #fff;
}

#header h2 {
    font-size: 18px;
    color: #fff;
    padding: 5px 0 0 20px;
    letter-spacing: -1px;
    font-weight: 100;
	background:none;
}	
	
#header h3 {
    font-size: 16px;
    color: #fff;
    padding: 3px 0 0 20px;
    letter-spacing: -1px;
    font-weight: 100;
	background:none;
	text-align:right;
	
}



#menu ul {
    list-style-type: none;
    padding-left: 70px;
	
}

#menu ul li {
    display: block;
    float: left;
	color: #444444;
}

#menu ul li a {
    padding: 0 10px 0 0;
    text-decoration: none;
    font-weight: 100;
    font-size: 14px;
	color: #444444;
}

#menu ul li a:hover {
    color: #3399F;
    text-decoration:underline;
}




/*general content*/

p { 
    color:#666666;
	font-size: 0.8em;
	line-height: 1.2;
	margin:20px;
	
}

a {
    text-decoration:none;
    color: #222;
}
a:hover {
    
    color: #000067;
}



h1 { 
    background-color:#000067;
	color: #ffffff;
    font-size: 1.2em;
    letter-spacing: -1px;
    padding: 5px 0 0 5px;
	font-weight:lighter;
	padding:15px 80px;
	line-height:130%;

}
h1 a { 
    color: #FFFFFF;
    
}
h1 a:hover {
    
    color: #666666;
}

h2 { 
    background-color:#E8E8E8;
	color: #444444;
    font-size: 1em;
    letter-spacing: -1px;
    padding: 5px 0 0 5px;
	font-weight:lighter;
	padding:7.5px;

}
h2 a { 
    color: #444444;
    
}
h2 a:hover {
    
    color: #000067;
}


h3 { 
    background-color:#666666;
	color: #ffffff;
    font-size: 1em;
    letter-spacing: -1px;
    padding: 5px 0 0 5px;
	font-weight:lighter;
	padding:7px 2px;
	text-align:center;

}
h3 a { 
    color: #FFFFFF;
    
}
h3 a:hover {
    
    color: #000067;
}


h4 { 
    background-color: ;
	color: #444444;
    font-size: 1.4em;
    letter-spacing: -1px;
	font-weight:lighter;
	padding:10px 3px;
	border-bottom: #666666 1px solid;

}

h4 a { 
    color: #222;
    
}
h4 a:hover {
    
    color: #000067;
}


h5 { 
    background-color: ;
	color: #444444;
    font-size: 1.1em;
    letter-spacing: -1px;
    padding: 5px 0 0 5px;
	font-weight:lighter;
	padding:4px 3px;
	
}

h5 a { 
    color: #222;
    
}
h5 a:hover {
    
    color: #000067;
}


h6 { 
    background-color: ;
	color: #444444;
    font-size: 0.72em;
	font-weight:lighter;
	padding: 0px 100px 20px 0px;
	text-align:left;
	
}

h6 a { 
    color: #000067;
    text-decoration:underline;
}
h6 a:hover {
    
    color: ;#222
}

/*end general content*/


/*Right Content*/



.right h2 {
	
    font-size: 20px;
    font-weight: 100;
    padding: 15px 0 7px 0;
}

.right h2 {
    font-size: 18px;
    font-weight: 100;
    padding: 15px 0 7px 0;
}

.right h2 a {
    text-decoration: none;
}

.right h2 a:hover {
    color: #3399ff;
}

.right h3 {
    font-size: 18px;
    font-weight: 100;
    padding: 15px 0 7px 0;
}



.right ul { 
    color:#666666;
	font-size: 0.8em;
	line-height: 1.2;
	margin: 0px 20px;
	
}

.right ul {
    padding: 10px 0 15px 20px;
    list-style-type: circle;
}

.right ol { 
    color:#666666;
	font-size: 0.8em;
	line-height: 1.2;
	margin: 0px 20px;
	
}

.right p {
    margin-top: 10px;
	font-size: 0.8em;
}
.background-product {
	background: #E8E8E8 ;
    	
}


.rightx ul { 
    color:#666666;
	font-size: 0.8em;
	line-height: 1.2;
	margin: 0px 20px;
	
}

.rightx p {
    margin-top: 10px;
	font-size: 0.8em;
}

.productpic {
	width: 600px; 
    position: relative;
    float: left; 

}


img.plain
{
width:70px;
height:27px;
background:url(/images/swabs/fonts.gif) 0 0;
}

img.times
{
width:70px;
height:27px;
background:url(/images/swabs/fonts.gif) -70px 0;
}

img.arial
{
width:70px;
height:27px;
background:url(/images/swabs/fonts.gif) -140px 0;
}

img.casual
{
width:70px;
height:35px;
background:url(/images/swabs/fonts.gif) 0 -50px;
}

img.hobo
{
width:70px;
height:35px;
background:url(/images/swabs/fonts.gif) -70px -50px;
}

img.speedie
{
width:70px;
height:35px;
background:url(/images/swabs/fonts.gif) -140px -50px;
}


img.energy
{
width:70px;
height:40px;
background:url(/images/swabs/fonts.gif) 0 -103px;
}

img.folio
{
width:70px;
height:40px;
background:url(/images/swabs/fonts.gif) -70px -103px;
}

img.college
{
width:70px;
height:40px;
background:url(/images/swabs/fonts.gif) -140px -103px;
}


img.script
{
width:70px;
height:31px;
background:url(/images/swabs/fonts.gif) 0 -170px;
}

img.royale
{
width:70px;
height:31px;
background:url(/images/swabs/fonts.gif) -70px -170px;
}

img.carla
{
width:70px;
height:31px;
background:url(/images/swabs/fonts.gif) -140px -170px;
}





/*Left Content*/

.left {
	
    float: left;
    width: 16%;
    padding-top: 0px;
	padding-left: 10px;
	border-top: 1px solid #FFF;
	border-left: 3px solid #FFF;
	
}


.left h1 {
    margin: 5px 0 0 0;
    padding-left: 5px;
    height: 15px;
    line-height: 13px;
    color: grey;
    font-size: 13px;
	font-weight: 400;
}



.left h2 {
    margin: 5px 0 0 0;
    padding-left: 10px;
    height: 15px;
    line-height: 13px;
    color: black;
    font-size: 13px;
	font-weight: 200;
}


.left h3 {
    margin: 5px 0 0 0;
    padding-left: 0px;
    height: 17px;
    line-height: 13px;
    
	color: black;
    font-size: 16px;
}

.left h4 {
    margin: 5px 0 0 0;
    padding-left: 15px;
    height: 17px;
    line-height: 13px;
    padding:7px 3px;
    font-size: 16px;
}


.left h6{
    margin: 0px 0 0 0;
    padding: 10px 0px 5px;
	text-align:center;
}

.left h5 {
    margin: 5px 0 0 0;
    padding-left: 15px;
    height: 17px;
    line-height: 13px;
    background: none;
    font-size: 14px;
}



.left ul {
    padding: 10px 0 15px 10px;
    list-style-type: none;
}


.left ul li a {
    color: #0033CC;
    text-decoration: none;
    font-weight: 100;
}

.left ul li a:hover {
    color: #3399ff;
}



/*Footer Content*/

#bottom {
    background: #fff url(images/bottom1.gif) no-repeat;
    padding: 10px 0;
}

#footer {
    text-align: left;
    font-size: 0.8em;
}

#footer ul {
    list-style-type: none;
    padding-left: 40px;
}

#footer ul li {
    display: block;
    float: left;
    border-right: 1px;
}

#footer ul li a {
    padding: 0 20px 0 0;
    text-decoration: none;
    font-weight: 100;
    font-size: 14px;
}

#footer ul li a:hover {
    color: #3399FF;
    text-decoration: none;
}


/*Order Page Content*/

#order-page h2 { 
	margin-top: 10px;
	font-size: 0.8em;
	line-height:1;
}




.order-page h2 { 
    
	background-color:none;
    text-decoration: none;
    font-weight: 100;
}

.order-page p { 
    font-size: 0.8em;
	line-height: 1.2;
	margin:10px;
    font-weight: 100;
}

.order-table {
    font-size: 0.8em;
	line-height: 1.2;
	font-weight: 100;	
}


/*Extra Content*/

.photo {
    border: 1px solid #ccc;
    padding: 3px;
    margin-top: 10px;
    margin-left: 15px;
    float: left;	
}

.product-image  {
    border: 1px solid #ccc;
    padding: 3px;
    margin-top: 10px;
    margin-left: 15px;
    float: left;	
}


.photo1 {
    border: 1px solid #ccc;<a href="left-nav.html">left-nav.html</a>
    padding: 3px;
    margin-top: 10px;
    margin-left: 0px;
    float: left;	
}

.photo2 {
    border: 1px solid #ccc;
    padding: 3px;
    margin-top: 10px;
    margin-left: 0px;
    float: middle;	
}

.photo5 {
    border: 1px solid #ccc;
    padding: 0px;
    margin-top: 0px;
    margin-left: 0px;
    float: middle;	
}

.nonPhotoContainer {
    clear: both;
}

.icon {
    border: 0;
    
}

#importantList {
	
	font-weight: bold; 
	}

ol li {
	margin-bottom: 10px;
}

.listTitle {
	
}

.nestedList li{
	margin-bottom: 0;
}



#news-list li {
    margin-bottom: 5px;
}

product-image
{
    border: 1px solid #ccc;
    padding: 3px;
    margin-top: 10px;
    margin-left: 0px;
    float: middle;	
	}


OPTION.blank{background-color:#333;}	
OPTION.white{background-color:#333; color:white}
OPTION.red{background-color:#333; color:red}
OPTION.black{background-color:white; color:black}
OPTION.gold{background-color:#333; color:yellow}
OPTION.navy-blue{background-color:#333; color:#151B8D}
OPTION.royal-blue{background-color:#333; color:#2B60DE}
OPTION.green{background-color:#333; color:green}
OPTION.brown{background-color:#333; color:#804000}
OPTION.pink{background-color:#333; color:pink}
  
    
   
 OPTION.arial{font:Arial;
	background-color: #FF0000}
 OPTION.script{font:"script"}
 OPTION.comic-sans{font:comic-sans}
 OPTION.times-new-roman{font:times-new-roman}
 OPTION.hobostd{font:hobostd}
 OPTION.garamondprmrpro{font:garamondprmrpro}
 OPTION.verdana{font:verdana}
 
 /*Rubbish Content*/
 
 
 div.wrapper { 
width: 600px; 
position: center; 
clear: both; 
} 

div.left1 { 
width: 200px; 
position: relative;
float: left; 
} 

div.center1 { 
width: 200px;
position: relative; 
float: centre; 
} 




#container { 
height: 100%; 
padding: 5px; 
} 
#col_one { 
margin: 0; /* Applied to first column only in lieu of padding (personal thing) */ 
width: 45%; /* Allows for fluid design. Can be set to pixels */ 
float: left; 
} 
#col_two { 
margin: 0 0 0 10px; /* Puts a 10 pixel space between columns (left side) - think cellspacing */ 
width: 50%; 
float: right; 
} 
#col_three { 
margin: 0 0 0 10px; /* Puts a 10 pixel space between columns (left side) - think cellspacing */ 
width: 600px; 
float: left; 
} 



div.background { 
background-image: url(images/photos/index-background/large/Sock-assortment4.jpg);
background-repeat: no-repeat;
height: 312.5px;
} 

div.left2 { 
width: 160px; 
position: relative;
float: left; 
} 

div.background-wedding { 
background-image: url(../images/store-categories/personalise-socks-wedding.jpg);
background-repeat: no-repeat;
height: 85px;
} 

div.background-labour{ 
background-image: url(../images/store-categories/labour-header.jpg);
background-repeat: no-repeat;
height: 85px;
} 

div.background-liberal{ 
background-image: url(../images/store-categories/liberal-header.jpg);
background-repeat: no-repeat;
height: 85px;
} 

div.background-conservative{ 
background-image: url(../images/store-categories/conservative-header.jpg);
background-repeat: no-repeat;
height: 85px;
} 

.rightx1 {
    float: center;
    width: 750px;
    text-align: justify;
	left:200px;
    top:500px;
    border-style:margin;
	border-right-width:1px;
    border-left-width:1px;
	margin: 100;
	padding-left:100px;
	padding-right:-50px;
	
	} 
