body {background: url(../images/bg.jpg); text-align: center; color: #FFF}
#wrap {width: 980px; margin: 30px auto; text-align: left; position: relative;}

/* Nav Bar *******************************************************************/
.menu {margin: 0; border-top:  8px solid #424242; /* border-bottom:  8px solid #424242; background: #171310; */ position: relative; z-index: 10}
#nav {margin:0;  padding:0;  list-style:none; float: right}	
#nav li {float:left;  display:block;  text-transform: uppercase;  position:relative; z-index:500;  margin:0 1px; background:#000}
#nav li a {display:block; background-image: url(../images/nav_bar.gif);  text-decoration:none;  color:#fff; text-align:center; color:#FFF; margin-left: 20px;}
#nav li a:hover {color:#fff;}
#nav a.selected {color:#f00;}
#nav ul.submenu {position:absolute; left:0; width: 200px; display:none; margin:0 0 0 -1px; padding:0; list-style:none; }
#nav ul.submenu li a {width:160px; float:left; background-image: none; text-indent: 1px; text-align: left; padding-left: 10px;}
#nav ul a:hover {text-decoration:underline;}

.home a {background-position:  0 0; width: 60px; height: 40px; text-indent: -900em;}
.home a:hover {background-position:  0 -40px;}
.classes a {background-position: -90px 0; width: 80px; height: 40px; text-indent: -900em;}
.classes a:hover {background-position:  -90px -40px;}
.training a {background-position: -190px 0; width: 170px; height: 40px; text-indent: -900em;}
.training a:hover {background-position:  -190px -40px;}
.gym a {background-position: -390px 0; width: 80px; height: 40px; text-indent: -900em;}
.gym a:hover {background-position:  -390px -40px;}
.blog a {background-position: -490px 0; width: 60px; height: 40px; text-indent: -900em;}
.blog a:hover {background-position:  -490px -40px;}
.contact a {background-position: -570px 0; width: 105px; height: 40px; text-indent: -900em;}
.contact a:hover {background-position:  -570px -40px;}

.menuEnd {border-bottom:  8px solid #424242; background: #000; display: block; height: 50px; width: 100%; position: absolute; top: 0px;}

/* Top *******************************************************************/
#logoHome {background:url(../images/logo_home.png) no-repeat; position: absolute; display: block; width: 457px; height: 266px; top: 30px; left: 20px; z-index: 5; text-indent: -900em;}
#logoMain {background:url(../images/logo_main.png) no-repeat; position: absolute; display: block; width: 500px; height: 170px; top: 30px; left: 20px; z-index: 5; text-indent: -900em;}

.tagHome {position: relative; top: 240px; left: 100px; background: #3e3e3e; width: 375px; padding: 5px 0; text-align: center; font-size: 21px; text-transform: uppercase;}
.tagMain {position: relative; top: 120px; left: 150px; background: #3e3e3e; width: 375px; padding: 5px 0; text-align: center; font-size: 21px; text-transform: uppercase;}


#topImage {position: relative; display: block;  float: right;}	
#translucentbkg { background:#FFF; filter:alpha(opacity=15); -moz-opacity:0.15; opacity: 0.15;}
#topImage, #translucentbkg {width: 430px; height: 270px;}
#imageHolder {background-color: transparent; position: absolute; top: 10px; left: 10px; z-index: 2;  }
.pics { height: 250px; width: 410px; padding:0; margin:0; overflow: hidden }

.twitterfeed, .twitterfeed p {font-size: 11px }

/* Fonts  *******************************************************************/
a {font-weight: bold; color:#FFF; text-decoration: none; outline: none}
a:hover {text-decoration: underline}
h1 {color: #FFF; font-size: 35px; text-transform: uppercase;}
h2 {color: #FFF; font-size: 18px; text-transform: uppercase; margin-bottom: 0;}
h4 {color: #FFF; font-size: 12px; text-transform: uppercase; font-weight: normal;}
.highlight {text-transform: uppercase; font-weight:bold; font-size: 15px; background: url(../images/star.gif) 0 0 no-repeat;  display: inline;}
.highlight span { padding: 0 20px; background: url(../images/star.gif) 100% 0px no-repeat; }

.kf {color: #F48A9A;}
.kids {color: #42ACB1;}
.kb {color: #C43E46;}
.bf {color: #E5B15F;}
.box {color: #B16146;}
.teen {color: #6D6594;}

/* Footer *******************************************************************/
.footer {border-top: 8px solid #444; border-bottom: 5px solid #444; padding: 10px 0; margin-bottom: 10px; position: relative;}
.footer a {color: #FFF; text-decoration: none;}


.mailer {width: 400px}
.mailer h2 { padding: 10px 0 10px 0px; line-height: 40px; float: left;}
.mailer form {width: 200px; float: left; padding: 7px 0 0 3px;}

.mailer input.newsletterInput {border: none; background: #666 url(../images/input_bg.gif) no-repeat; width: 155px; height: 23px; color:#FFF; float: left }
input.newsletterButton {background: #636363; color: #FFF; font-size: 12px; font-weight: bold; display: block; height: 25px; color: #FFF; width: 25px; border: none; float: left }

.twitter {width: 250px;}
.twitter h2 a {background: url(../images/twitter.gif) 0 0 no-repeat; padding: 10px 0 10px 45px; line-height: 40px;}
.facebook {width: 300px;}
.facebook h2 a {background: url(../images/facebook.gif) 0 0 no-repeat; padding: 10px 0 10px 45px;  line-height: 40px;}
.end {color:#999; font-style: italic;}

.successBalloon {width: 146px; height: 126px; position:absolute; top: -100px; left: 390px;}
.errorBalloon {width: 146px; height: 126px; position:absolute; top: -100px; left: 390px;}
.resultText {width: 146px; height: 126px; position:absolute; top: -80px; left: 430px;}


/* Content *******************************************************************/
.content {padding: 0 20px;}
.contentHome {padding:  20px;}
.ColumnOne {width: 310px; float: left; margin-right: 50px; padding: 20px 0 20px 0px; border-top: 5px solid #350702;}

.OffersColumn {float: left; margin-right: 50px;  border-top: 5px solid #350702; position: relative; display: block;}	
.Offersbg{background-color: #FFF; filter:alpha(opacity=15); -moz-opacity:0.15; opacity: 0.15;}
.OffersColumn, .Offersbg {height: 300px; width: 230px;}
.OffersText {background-color: transparent; position: absolute; top: 20px; left: 10px;  z-index: 2; padding-right: 10px;}
.OffersText ul {list-style: none; margin: 0px; padding: 0}
.OffersText ul li {border-bottom: 1px solid #000; padding: 10px 0;}

.NewsColumn {width: 280px; float: left; padding: 20px 10px; border-top: 5px solid #350702;}
.NewsColumn ul {list-style: none; margin: 0px; padding: 0}
.NewsColumn ul li {background: url(../images/double_border.gif) bottom left repeat-x; margin: 10px 0 20px; padding-bottom: 20px }
.NewsColumn ul li span {display: block; background: url(../images/star.gif) no-repeat 0 2px; padding: 0 18px}

.mainColumn {padding: 0 10px 20px 10px;}
.noImage {margin-top: 130px;}

/* Timetable *******************************************************************/
table.timetable {width: 100%; text-align: center; margin-bottom: 20px;}
table.timetable td {border: 5px solid #333;}
table.timetable td {width: 13%;}
table.timetable td.time { width: 15%;}
table.timetable th {text-transform: uppercase}

/* Tab *******************************************************************/
.Price {background: url(../images/double_border.gif) bottom left repeat-x; margin-bottom: 20px; }
.listTab {width: 440px; float: left; margin-right: 10px;}
.listTab p {clear: both; margin-bottom: 0.5em;}
.listTab p span {width: 300px; float: left;}

table.pricetable {width: 100%; margin: 10px 0 30px;}
table.pricetable th {background: #000; border-bottom:8px solid #424242; padding: 4px}
table.pricetable td {padding: 4px;}

/* Contact *******************************************************************/
input.mailform_button {
border:medium none;
color:transparent;
cursor:pointer;
display:block;
font-size:0;
line-height:0;
text-indent:-900em; }

.mailform_button {background: url(../images/bt_email.gif) no-repeat; display: block; width: 124px; height: 26px;}

