﻿/* CSS Document */

body {
        margin: 0px auto 0px;
        font-family: Arial, Helvetica, sans-serif;
        line-height: 1.2;
        font-size: 100%;
		background-image:url(../images/fade.gif);
		background-repeat:repeat-x;
        width: 760px;
}

h1 {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 100%;
 color: #0367a3;
 margin: 0px;
 padding: 0px;
}

h2 {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 90%;
 color: #0367a3;
 margin: 0px;
 padding: 0px;
}

h3 {
 font-family: Arial, Helvetica, sans-serif;
 font-weight: normal;
 text-align: left;
 font-size: 85%;
color: #0367a3;
 margin: 0px;
 padding: 0px;
}

h4 {
 font-family: Arial, Helvetica, sans-serif;
 font-weight: bold;
 font-size: 75%;
 color: #013473;
 margin: 0px;
 padding: 0px;
}

h6 {
 font-family: Arial, Helvetica, sans-serif;
 font-weight: normal;
 font-size: 65%;
 color: #013473;
 margin: 0px;
 padding: 0px;
 }

p {
 font-family: Arial, Helvetica, sans-serif;
 font-weight: normal;
 font-size: 75%;
 color: #333333;
 margin: 0px;
 padding: 0px;
}

img {
	border:0px;
}

img.left {
	margin:0px 10px 10px 0px;
	border:0px;
	float:left;
}
img.right {
	margin:0px 0px 10px 10px;
	border:0px;
	float:right;
}

.red {
	color:#FF0000;
}
.ulclass {
	font-family: Helvetica, Arial, sans-serif;
 	font-weight: normal;
	font-size:75%;
	color:#333333;
}
/**************************************************/
/* header divs                                    */
/**************************************************/

#header {
	width:760px;
	height:140px;
	padding:0px 0px 0px 0px;
	background-image: url(../images/header.jpg);
	background-repeat:no-repeat;
	float:left;
	font-size:70%;
	color:#000000;
}
#topmenu {
	width:760px;
	height:25px;
	float:left;
}

ul#topnav {
	font-family: Helvetica, Arial, sans-serif;
	font-weight: normal;
	color: #000000;
	padding: 0px 0px 0px 10px;
	width: 500px;
	height: 25px;
	margin:0px;
	float:left;
	position: absolute;
	list-style: none;
	top: 8px;
	text-align:left;
}

li#topnav {
	display: inline;

	top: 0;
	position: relative;
}
#topnav a, #topnav_live a {text-decoration:none; color:#000000;}
#topnav a:hover, #topnav a:active { text-decoration:underline; color:#000000;}

/********************************************/
/* Text sizer                               */
/********************************************/

#textresize {
	width:150px;
	height:24px;
	padding:1px 0px 0px 10px;
	margin:80px 0px 3px 0px;
	font-size:100%;
	color:#000000;
	float:left;
}

#textresize A {
	padding: 0px 2px 0px 2px; 
	margin: 2px 0px 2px 5px;   
}

#textresize A.resizesmall {
	font-size: 80%;
	color:#000000;
	text-decoration:none; 

}

#textresize A.resizesmall:hover {
	font-size: 80%;
	color:#000000; 
	text-decoration: underline;
}
#textresize A.resizesmall:active {
	font-size: 80%;
	color:#ff0000; 
	text-decoration: underline;
}

#textresize A.resizemedium {
	font-size: 120%;
	color:#000000; 
	text-decoration: none
}
#textresize A.resizemedium:hover {
	font-size: 120%;
	color:#000000; 
	text-decoration:underline
}
#textresize A.resizemedium:active {
	font-size: 120%;
	color:#ff0000; 
	text-decoration:underline
}

#textresize A.resizelarge {
	font-size: 140%;
	color:#000000; 
	text-decoration: none
}
#textresize A.resizelarge:hover {
	font-size: 140%;
	color:#000000; 
	text-decoration:underline
}
#textresize A.resizelarge:active {
	font-size: 140%;
	color:#ff0000; 
	text-decoration:underline
}


/**************************************************/
/* main divs                                      */
/**************************************************/

#main {
	width:760px;
	background-color:#ffffff;
	float:left;
}

#flashcontain {
	width:720px;
	height:330px;
	padding:10px 20px 0px 20px;
	float:left;
}

#flashcontaininside { width: 720px; height: 330px; float: left; text-indent: -9999em; background: url(../images/flash/warner_kern.jpg);left top no-repeat;  }

#homepicscontain {
	width:720px;
	height:125px;
	padding:0px 20px 0px 20px;
	margin:10px 0px 0px 0px;
	float:left;
}

#flashsmall {
	width:400px;
	height:183px;
	float:left;
}

#flashsmallmens { width: 400px; height: 183px; float: left; text-indent: -9999em; background: url(../../mens_shoes/flashimages/mens_shoes.jpg) left top no-repeat;  }


#homepicscontain a:link { color: #ffffff; text-decoration: none }
#homepicscontain a:visited { color: #ffffff; text-decoration: none }
#homepicscontain a:hover { color: #ffffff; text-decoration: underline }
#homepicscontain a:focus { color: #ffffff; text-decoration: underline }
#homepicscontain a:active { color: #ffffff; text-decoration: none }


#clubs {
	width:105px;
	height:27px;
	margin:0px 10px 0px 0px;
	padding: 98px 0px 0px 15px;
	font-size:70%;
	background-image:url(../images/home/clubs.jpg);
	background-repeat:no-repeat;
	float:left;
}

#diary {
	width:105px;
	height:27px;
	margin:0px 10px 0px 0px;
	padding: 98px 0px 0px 15px;
	font-size:70%;
	background-image: url(../images/home/diary.jpg);
	background-repeat:no-repeat;
	float:left;
}

#mail {
	width:105px;
	height:27px;
	margin:0px 10px 0px 0px;
	padding: 98px 0px 0px 15px;
	font-size:70%;
	background-image: url(../images/home/mail.jpg);
	background-repeat:no-repeat;
	float:left;
}

#hometext {
	width:330px;
	height:125px;
	float:left;
}

#maincontent {
	width:400px;
	margin:10px 0px 0px 10px;
	min-height:250px;
	float:left;
}

.leftrightcontain {
	margin:10px 0px 0px 0px;
	width:400px;
	float:left;
}

/**************************************************/
/* left menu divs                                 */
/**************************************************/

#leftnav {
	width:170px;
	margin:10px 0px 0px 0px;
	float:left;
}

.left_nav{
list-style-type: none;
margin: 0;
padding: 0;
width: 170px; /* width of menu (don't forget to add border with below!) */
}
.left_nav_live{
list-style-type: none;
margin: 0;
padding: 0;
width: 170px;
}

.left_nav li a{
background: url(../images/left_nav.jpg) no-repeat left top;
font: 75% Arial, Helvetica, sans-serif;
display: block;
color: #024c93;
width: 170px;
height:21px;
padding: 4px 0px 0px 0px;
text-indent: 10px;
text-decoration: none;
border-top:1px #adadad solid;
border-bottom:1px #ffffff solid;
}

.left_nav_live li a{
background: url(../images/left_nav.jpg) no-repeat left top;
background-position: -170px 0;
font: 75% Arial, Helvetica, sans-serif;
display: block;
color: #ffffff;
width: 170px;
height:21px;
padding: 4px 0px 0px 0px;
text-indent: 10px;
text-decoration: none;
border-top:1px #adadad solid;
border-bottom:1px #ffffff solid;

}

.left_nav li a:visited, .left_about li a:active{
color: #024c93;
}

.left_nav_live li a:visited, .left_about li a:active{
color: #ffffff;
}

.left_nav li a:hover{
background-position: -170px 0;
color: #ffffff; text-decoration:none;
}

.left_nav_live li a:hover{
background-position: -170px 0;
color: #ffffff; text-decoration:none;
}


/**************************************************/
/* right menu divs                                */
/**************************************************/

#rightnav {
	width:170px;
	margin:10px 0px 0px 0px;
	float:right;
}

/**************************************************/
/* forms divs                                     */
/**************************************************/

#formcontain {
	width:400px;
	float:left;
}

.fieldwrap {
	margin:10px 0px 0px 0px;
	width:400px;
	float:left;
}
.labelcontain {
	width:110px;
	padding:3px 10px 0px 0px;
	text-align:right;
	float:left;
}
.fieldcontain {
	width:280px;
	float:left;
}

label.right {
	font-size:75%;
	color:#333333;

}
#main #maincontent #formcontain .fieldwrap .fieldcontain #size {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color:#333333;
}
#main #maincontent #formcontain .fieldwrap .fieldwrap .fieldcontain #how_many {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color:#333333;
}
#main #maincontent #formcontain .fieldwrap .fieldwrap .fieldcontain #name {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color: #333333;
}
#main #maincontent #formcontain .fieldwrap .fieldwrap .fieldcontain #street_1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color: #333333;
}
#main #maincontent #formcontain .fieldwrap .fieldwrap .fieldcontain #street_2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color: #333333;
}
#main #maincontent #formcontain .fieldwrap .fieldwrap .fieldcontain #street_3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color: #333333;
}
#main #maincontent #formcontain .fieldwrap .fieldwrap .fieldcontain #postcode {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color: #333333;
}
#main #maincontent #formcontain .fieldwrap .fieldwrap .fieldcontain #email_address {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color: #333333;
}
#main #maincontent #formcontain .fieldwrap .fieldwrap .fieldcontain #phone {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color: #333333;
}
#main #maincontent #formcontain .fieldwrap .fieldwrap input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color: #333333;
}
#main #maincontent #formcontain .fieldwrap .fieldwrap .fieldcontain #colour {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 75%;
	font-style: normal;
	font-weight: normal;
	color: #333333;
}


/**************************************************/
/* footer divs                                    */
/**************************************************/

#footer {
	width:760px;
	height:24px;
	margin:10px 0px 0px 0px;
	padding:10px 0px 0px 0px;
	border-top: 1px #cccccc solid;
	font-size:70%;
	text-align:center;
	float:left;
} 

#footer a:link { color: #000000; text-decoration: none }

#footer a:visited { color: #000000; text-decoration: none }

#footer a:hover { color: #000000; text-decoration: underline }

#footer a:active { color: #000000; text-decoration: none }
	
/**************************************************/
/* Menu divs                                      */
/**************************************************/
#menucontain {
	width:760px;
	height:25px;
	float:left;
}
ul#navbar {
	position: absolute;
	float: left;
	width: 760px;
	height: 25px;
	background: transparent url("../images/menu_bar.jpg") left top no-repeat;
	list-style: none;
	margin: 0;
}

ul#navbar li {	display: inline; }

	
ul#navbar li a {
	float: left;
	height: 25px;
	top: 0;
	text-align: center;
	color: #000;
	text-indent: -9999px;
	position: absolute;
}


#home_nav a, #home_nav_live a { left: 0; width: 70px; }
#mens_nav a, #mens_nav_live a {left: 70px; width: 115px; }
#ladies_nav a, #ladies_nav_live a {left: 185px; width: 121px;}
#contact_nav a, #contact_nav_live a {left: 306px; width: 95px; }

#home_nav a:hover, #home_nav a:active, #home_nav a:focus, #home_nav_live a, #home_nav_live a:hover, #home_nav_live a:active, #home_nav_live a:focus {background: transparent url("../images/menu_bar.jpg") 0px -25px no-repeat;}
#mens_nav a:hover, #mens_nav a:active, #mens_nav a:focus, #mens_nav_live a, #mens_nav_live a:hover, #mens_nav_live a:active, #mens_nav_live a:focus {background: transparent url("../images/menu_bar.jpg") -70px -25px no-repeat;}
#ladies_nav a:hover, #ladies_nav a:active, #ladies_nav a:focus, #ladies_nav_live a, #ladies_nav_live a:hover, #ladies_nav_live a:active, #ladies_nav_live a:focus {background: transparent url("../images/menu_bar.jpg") -185px -25px no-repeat;}
#contact_nav a:hover, #contact_nav a:active, #contact_nav a:focus, #contact_nav_live a, #contact_nav_live a:hover, #contact_nav_live a:active, #contact_nav_live a:focus {background: transparent url("../images/menu_bar.jpg") -306px -25px no-repeat;}
