@charset "utf-8";
/* CSS Document */


body{
text-align:center; /** fix IE and consort to center **/
margin:0px auto;
padding:0px;
height:100%;
font: 12px Tahoma,Arial, Helvetica, sans-serif; 
background:url(/demo/images/background-repeat.gif);
}

body, html{ height:100%;} /** look up this info **/


a img{ border:0px;}
a{ color:#405f80; text-decoration:underline; font-size:12px;}
a:hover{ color:#405f80; text-decoration:none; font-size:12px;}
a:visited{ color:#666666; text-decoration:underline; font-size:12px;}

h2{
font-size:12px;
font-weight:bold;
text-transform:capitalize;
margin:0px;
padding:0px;
}

h3{
font-size:14px;
font-weight:bold;
margin:0px;
padding:0px;
}

h4{
font-size:14px;
margin:0px;
padding:0px;
}

p{
font-size:12px;
margin:0px;
padding:0px;
}

/* #wrapper
____________________________________________________________*/
#wrapper{
margin:0 auto;
width:766px;
}

/* #main 
____________________________________________________________*/
#main{
margin:0 auto;
border-width:0 2px 2px 2px;
border-style:solid;
border-color:ffffff;
width:762px;
text-align:left;
background:#44474c;
}

/* #header 
____________________________________________________________*/
#header{
margin:0;
padding:0;
text-align:left;
background-color:#ffffff;
width:762px;
height:95px;
}

#header-left{
float:left;
margin:7px 0px 0 8px;
padding:0;
width:114px;
height:88px;
}

#header-right{
float:right;
margin:0;
padding:0;
width:625px;
height:95px;
}

/* #content 
____________________________________________________________*/
#content{
margin:0;
padding:0;
width:762px;
background:#44474c;
}

#slogan{
float:left;
margin:0;
padding:0;
border-width:2px 0 2px 0;
border-style:solid;
border-color:ffffff;
width:762px;
height:44px;
}

/* #content-left 
____________________________________________________________*/
#content-left{
float:left;
margin:0;
padding:0;
width:174px;
background:#44474c;
}

#nav{
float:left;
margin:0;
padding:0;
width:174px;
background:url(/images/nav-repeat.gif);
}

#btn-home a{
display:block;
float:left;
width:128px;
height:36px;
background: url( ../images/nav-home.gif) 0 0 no-repeat;
}

#btn-home a:hover{
background-position:0 -36;
}

#btn-membership a{
display:block;
float:left;
width:128px;
height:36px;
background: url( ../images/nav-membership.gif) 0 0 no-repeat;
}

#btn-membership a:hover{
background-position:0 -36;
}

#btn-about-us a{
display:block;
float:left;
width:128px;
height:36px;
background: url( ../images/nav-about-us.gif) 0 0 no-repeat;
}

#btn-about-us a:hover{
background-position:0 -36;
}

#btn-zones a{
display:block;
float:left;
width:128px;
height:36px;
background: url( ../images/nav-zones.gif) 0 0 no-repeat;
}

#btn-zones a:hover{
background-position:0 -36;
}

#btn-amanzimtoti a{
display:block;
float:left;
margin:0 0 0 25px;
width:125px;
height:35px;
background: url(../images/nav-amanzimtoti.gif) 0 0 no-repeat;
}

#btn-amanzimtoti a:hover{
background-position:0 -35;
}

#btn-beach a{
display:block;
float:left;
margin:0 0 0 25px;
width:125px;
height:35px;
background: url(../images/nav-beach.gif) 0 0 no-repeat;
}

#btn-beach a:hover{
background-position:0 -35;
}

#btn-bluff a{
display:block;
float:left;
margin:0 0 0 25px;
width:125px;
height:35px;
background: url(../images/nav-bluff.gif) 0 0 no-repeat;
}

#btn-bluff a:hover{
background-position:0 -35;
}

#btn-central a{
display:block;
float:left;
margin:0 0 0 25px;
width:125px;
height:35px;
background: url(../images/nav-central.gif) 0 0 no-repeat;
}

#btn-central a:hover{
background-position:0 -35;
}

#btn-montclair a{
display:block;
float:left;
margin:0 0 0 25px;
width:125px;
height:35px;
background: url(../images/nav-montclair.gif) 0 0 no-repeat;
}

#btn-montclair a:hover{
background-position:0 -35;
}

#btn-north-durban a{
display:block;
float:left;
margin:0 0 0 25px;
width:125px;
height:35px;
background: url(../images/nav-north-durban.gif) 0 0 no-repeat;
}

#btn-north-durban a:hover{
background-position:0 -35;
}

#btn-pinetown a{
display:block;
float:left;
margin:0 0 0 25px;
width:125px;
height:35px;
background: url(../images/nav-pinetown.gif) 0 0 no-repeat;
}

#btn-pinetown a:hover{
background-position:0 -35;
}

#btn-upper-highway a{
display:block;
float:left;
margin:0 0 0 25px;
width:125px;
height:35px;
background: url(../images/nav-upper-highway.gif) 0 0 no-repeat;
}

#btn-upper-highway a:hover{
background-position:0 -35;
}

#btn-westville a{
display:block;
float:left;
margin:0 0 0 25px;
width:125px;
height:35px;
background: url(../images/nav-westville.gif) 0 0 no-repeat;
}

#btn-westville a:hover{
background-position:0 -35;
}

#btn-contact-us a{
display:block;
float:left;
width:124px;
height:35;
background: url( ../images/nav-contact-us.gif) 0 0 no-repeat;
}

#btn-contact-us a:hover{
background-position:0 -36;
}

.btn-nav a{
display:block;
float:left;
width:128px;
height:36px;
background: url(/images/nav-home.gif) 0 0 no-repeat;
}

.btn-nav a:hover{
background-position:0 -36;
}

#nav hr{
display:block;
clear:left;
visibility:hidden;
}

/* #content-right 
____________________________________________________________*/
#content-right{
float:right;
margin:0;
padding:0;
width:587px;
height:494px;
background:#d9d9d9;
}

#content-right-zones{
float:right;
margin:0;
padding:0;
width:587px;
background:#d9d9d9;
}

/* #content-1 
____________________________________________________________*/

#content-1{
margin:0;
padding:0;
width:587px;
}

#content-1-zones{
margin:0;
padding:10px;
width:567px;
}

#content-1-zones div{
padding:0px 0 3px 0;
}

#content-1-zones img{
margin:0;
padding:0px 0 3px 0;
}

#page-heading{
margin:0;
padding:0;
width:587px;
}

#content-1-1{
margin:0;
padding:0;
width:587px;
}

#content-1-1 p{
margin:0;
padding:10px 10px 0 10px;
font:12px;
width:567px;
}

#content-1-1 h3{
margin:0;
padding:10px 10px 0 10px;
width:567px;
}

/* #content-2 
____________________________________________________________*/
#content-2{
float:left;
margin:0;
padding:0;
width:587px;
}

#content-2 h3{
margin-top:10px;
padding:10px 0 0 10px;
}

#content-2-1{
float:left;
margin:20px 0 10px 10px;
padding:0;
width:359px;
border:3px solid #000000;
}

#content-2-2{
float:right;
text-align:justify;
margin:0;
padding:120px 10px 0px 10px;
font-size:12px;
font-weight:bold;
width:191px;
}

#content-1-left{
float:left;
margin:0;
padding:10px 10px 0 10px;
width:50px;
}

#content-1-right{
float:right;
margin:0;
padding:10px 10px 0 10px;
width:300px;
}

#list-left{
float:left;
margin:0;
padding:10px 10px 10px 10px;
width:200px;
}

#list-right{
float:right;
margin:0;
padding:10px 10px 10px 10px;
width:300px;
}

#list-left-2{
float:left;
margin:0;
padding:10px 10px 10px 10px;
width:567px;
}

#content-3{
margin:0;
padding:0;
width:587px;
}

#content-3 p{
margin:0;
padding:10px 10px 0 10px;
font:12px;
width:567px;
}

.heading{
float:right;
margin-top:15px;
width:350px;}

.logo{
float:left;
width:190px;}

.clear-both{
clear:both;}

/* #footer 
____________________________________________________________*/
#footer{
clear:both;
margin:0;
padding:10px 0 0 0;
font:12;
color:999999;
text-align:center;
width:762px;
height:78px;
}

#footer a{
text-decoration:none;
color:999999;
}

#footer a:hover{
text-decoration:none;
color:999999;
}

#footer p{
padding:10px 0 0 0;
font:12;
}