/* GLOBAL RESET by Eric Meyer
==================================================*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, td { margin: 0; padding: 0; border: 1; outline: 1; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

/* remember to define focus styles! */
:focus { outline: 0; }

body { line-height: 1; color: black; background: white; }
ol, ul { list-style: none; }

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: separate; border-spacing: 0; }
caption, td { text-align: left; font-weight: normal; padding: 5px; }

blockquote:before, blockquote:after,
q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

#content ul { list-style-type: disc; padding: 0 20px; }

#wrap-around-pic {
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
}

/* GENERAL
==================================================*/

body { background: url("images/body_bg.gif") repeat-x #cf110c; font-family: Arial, Helvetica, "Sans-Serif"; font-size: 64.5%; line-height: 160%; color: #FFF; text-shadow: 0 0 0 transparent; }
  /*body.ac { background-color: #f3e09b; color: #555; }*/

  body.ab {
	background: url("/images/ab_grad2.gif");
	background-repeat: repeat-x;
	background-position: 60px 100px;
	color: #555;
  }

  body.ac { 
	background: url("/images/ac_grad2.gif");
	background-repeat: repeat-x;
	background-position: 60px 100px;
	color: #555;
  }
  body.fi {
	background: url("/images/fi_grad2.gif");
	background-repeat: repeat-x;
	background-position: 60px 100px;
	color: #555;
  }

  body.yo {
	background: url("/images/yo_grad2.gif");
	background-repeat: repeat-x;
	background-position: 60px 100px;
	color: #555;
  }

  body.ch {
	background: url("/images/ch_grad2.gif");
	background-repeat: repeat-x;
	background-position: 60px 100px;
	color: #555;
  }

  body.ou {
	background: url("/images/ou_grad2.gif");
	background-repeat: repeat-x;
	background-position: 60px 100px;
	color: #555;
  }

  body.ad {
	background: url("/images/ad_grad2.gif");
	background-repeat: repeat-x;
	background-position: 60px 100px;
	color: #555;
  }

  body.ot {
	background: url("/images/ab_grad2.gif");
	background-repeat: repeat-x;
	background-position: 60px 100px;
	color: #555;
  }

  body.hl {
	background: url("/images/hl_grad.gif");
	background-repeat: repeat-x;
	background-position: 60px 100px;
	color: #555;
  }

  /*body.ot { background-color: #cf110c; color: #EFA6A4; } /* Other, like for carols */*/
/* Different background colours for different sections */

/* HEADERS */
h1 { margin: 0 0 1em 0; font-family: Arial, Helvetica, "Serif"; font-size: 2em; font-weight: normal; letter-spacing: -0.07em; color: #000; line-height: 1em; }
  body.ot h1 { color: #FFF; }
h2 { margin: 0 0 1em 0; font-family: Arial, Helvetica, "Serif"; font-size: 1.8em; font-style: normal; font-weight: normal; text-transform: normal; letter-spacing: -1px; color: #000; line-height: 1em; }
h3 { margin: 0 0 1em 0; font-family: Arial, Helvetica, "Sans-Serif"; font-size: 16px; font-weight: normal; font-style: bold; text-transform: normal; color: black; line-height: 1em; }

span { font-weight: normal; }
img { border: 0; padding: 0; margin: 0; }
p { margin: 0 0 1.4em 0; display: block; }
strong { font-weight: bold; }
em { font-style: italic; }

a:link, a:visited { color: #000; background: transparent; text-decoration: underline; }
a:active { color: #000; background: transparent; font-style: normal;	}
a:hover { color: #000; text-decoration: none; }
/*body.ot a:link, body.ot a:visited, body.ot a:active, body.ot a:hover { color: #fff; }
*/

blockquote { font-family: Georgia, 'Times New Roman', 'Serif'; font-style: italic; padding: 0 0 0 30px; background: url("imgs/quote.gif") no-repeat 0 0; }
blockquote a:link, blockquote a:visited { color: #555; border: none; }
blockquote a:hover, blockquote a:active { color: #000; font-style: italic; }

/* DIV TEMPLATE
=============================================================*/

#container { width: 910px; margin: 0 auto; }
/*#bgcontainer { width: 100%; float: left; background: url("imgs/main_bg.gif"); margin: 0 0 1.75em 0; }*/

#header { float: left; height: 100px; }
  #header h1.logo { width: 400px; height: 60px; background: url("images/ymca2.png") no-repeat; display: block; text-indent: -9999px; margin-top: 20px; float: left; }
  #header .right { width: 500px; float: right; margin: 0; padding: 0; }
  #header ul.menu { width: 100%; float: right; text-align: right; margin-top: 20px; font-size: 1.2em; color: #AAA; }
    #header ul.menu li { display: inline; }
    #header ul.menu li a { color: #333; }
    #header ul.menu li a:hover { color: #FF0000; }
  #header .search { float: right; width: 500px; text-align: right; margin-top: 10px; }
  #header .search input.searchfield { padding: 0.3em; font-size: 1.4em; background: url("images/search_bg.gif") repeat-x #FFF; display: inline; width: 200px; }
  #header .search input.gobutton { padding: 0.3em; font-size: 1.4em; background: #999; width: auto; color: #FFF; display: inline; margin-left: 5px; border: 0; }

#body { width: 910px; float: left; }
#content { width: 400px; float: left; margin: 0 0 20px 20px; font-size: 1.3em; }

/* Home styling */
.leftfloat { width: 450px; float: left; margin-top: 30px; color: #555; font-size: 1.3em; }
h2.home { clear: both; padding-top: 0.5em; font-size: 1.5em; color: #555; }
.leftfloat p { padding-right: 10px; }
.rightfloat { margin-top: 30px; float: right; width: 450px; display: inline; }

/* Testing to see if images overlay technique works */
/* Super image overlay stuff */

/* Common items */
.oimg { float: left; background-repeat: no-repeat; display: inline; }
.over { float: left; position: absolute; display: inline; }

.oimg.opening { width: 450px; height: 290px; display: none; }
  .oimg.opening .over { width: 450px; height: 290px; background: url("images/hm_ovr_large3.png"); }
.oimg.openingitems { width: 225px; height: 200px; }
  .oimg.openingitems .over { width: 225px; height: 200px; background: url("images/hm_ovr_small3.png"); cursor: pointer; display: inline; } /* pointer allows IE6 make it look like link */

.imgtorrenttop { float: left; padding: 30px 0 20px 0; width: 910px; display: inline; height: 135px; position: relative; }
.imgtorrentside { float: right; width: 280px; margin-top: -15px; font-size: 1.2em; }
.imgtorrentside .oimg { margin: 0 0 3px 3px; display: inline; }

.oimg.micro { width: 90px; height: 135px; margin-right: 2px; display: inline; }
.oimg.small { width: 175px; height: 134px; margin-right: 2px; display: inline; }
.oimg.large { width: 275px; height: 134px; margin-right: 2px; display: inline; }

.imgtorrenttop .over {  }

  /* Accommodation */
  .micro .over.micro.ac { width: 90px; height: 135px; background: url("images/ac_ovr_micro2.png") no-repeat; }
  .small .over.small.ac { width: 175px; height: 135px; background: url("images/ds_ovr_small.png") no-repeat; }
  .large .over.large.ac { width: 275px; height: 135px; background: url("images/ds_ovr_large.png") no-repeat; }
 
  /* Other sections */
  .over.micro.ot { width: 90px; height: 135px; background: url("images/ot_ovr_micro.png"); }
  .over.small.ot { width: 175px; height: 135px; background: url("images/ot_ovr_small.png"); }
  .over.large.ot { width: 275px; height: 135px; background: url("images/ot_ovr_large.png"); }

  /* Holiday */
  .over.micro.hl { width: 90px; height: 135px; background: url("images/hl_ovr_micro.png"); }
  .over.small.hl { width: 175px; height: 135px; background: url("images/hl_ovr_small.png"); }
  .over.large.hl { width: 275px; height: 135px; background: url("images/hl_ovr_large.png"); }

  /* Fitness */
  .over.micro.fi { width: 90px; height: 135px; background: url("images/fi_ovr_micro.png"); }
  .over.small.fi { width: 175px; height: 135px; background: url("images/fi_ovr_small.png"); }
  .over.large.fi { width: 275px; height: 135px; background: url("images/fi_ovr_large.png"); }

  /* Young */
  .over.micro.yo { width: 90px; height: 135px; background: url("images/yo_ovr_micro.png"); }
  .over.small.yo { width: 175px; height: 135px; background: url("images/yo_ovr_small.png"); }
  .over.large.yo { width: 275px; height: 135px; background: url("images/yo_ovr_large.png"); }

  /* Children */
  .over.micro.ch { width: 90px; height: 135px; background: url("images/ch_ovr_micro.png"); }
  .over.small.ch { width: 175px; height: 135px; background: url("images/ch_ovr_small.png"); }
  .over.large.ch { width: 275px; height: 135px; background: url("images/ch_ovr_large.png"); }

  /* Outdoor */
  .over.micro.ou { width: 90px; height: 135px; background: url("images/ou_ovr_micro.png"); }
  .over.small.ou { width: 175px; height: 135px; background: url("images/ou_ovr_small.png"); }
  .over.large.ou { width: 275px; height: 135px; background: url("images/ou_ovr_large.png"); }

  /* Adult */
  .over.micro.ad { width: 90px; height: 135px; background: url("images/ad_ovr_micro.png"); }
  .over.small.ad { width: 175px; height: 135px; background: url("images/ad_ovr_small.png"); }
  .over.large.ad { width: 275px; height: 135px; background: url("images/ad_ovr_large.png"); }

  /* About */
  .over.micro.ab { width: 90px; height: 135px; background: url("images/ab_ovr_micro.png"); }
  .over.small.ab { width: 175px; height: 135px; background: url("images/ab_ovr_small.png"); }
  .over.large.ab { width: 275px; height: 135px; background: url("images/ab_ovr_large.png"); }



/* Menu */

ul.sidemenu { float: left; width: 195px; font-size: 1.1em; line-height: 26px; vertical-align: middle; font-weight: normal; }
  ul.sidemenu li { float: left; clear: both; margin: 0; }
ul.sidemenu li a { height: 32px; width: 185px; float: left; margin-bottom: 5px; text-align: center; padding-right: 5px; font-weight: bold; background-repeat: no-repeat; }
ul.sidemenu li.ho a { background: url("images/sidemenu_ho.png"); }
ul.sidemenu li.ac a { background: url("images/sidemenu_ac.png"); }
ul.sidemenu li.fi a { background: url("images/sidemenu_fi.png"); }
ul.sidemenu li.yo a { background: url("images/sidemenu_yo.png"); }
ul.sidemenu li.ch a { background: url("images/sidemenu_ch.png"); }
ul.sidemenu li.ou a { background: url("images/sidemenu_ou.png"); }
ul.sidemenu li.ad a { background: url("images/sidemenu_ad.png"); }
ul.sidemenu li.ab a { background: url("images/sidemenu_ab.png"); }
ul.sidemenu li.hl a { background: url("images/sidemenu_hl.png"); }

/* Used to fix a bug found in IE6 where menu inherits body.ho etc bg and sizes */
ul.sidemenu li.ho, ul.sidemenu li.ac, ul.sidemenu li.fi, ul.sidemenu li.yo, ul.sidemenu li.ch, ul.sidemenu li.ou, ul.sidemenu li.ad, ul.sidemenu li.ab, ul.sidemenu li.hl { background: none; height: auto; width: auto; }

ul.sidemenu li a:link, ul.sidemenu li a:visited { color: #000; }
ul.sidemenu li a:hover, ul.sidemenu li a:active { color: #000; /*font-weight: bold;*/ }

ul.sidemenu ul.submenu { padding-bottom: 15px; float: left; font-size: 1.1em; }
ul.sidemenu ul.submenu li a { color: #000; background: transparent; height: 1em; line-height: 1.5em; font-weight: normal; }
  ul.sidemenu ul.submenu li a:link, ul.sidemenu .submenu li a:visited { color: #000; }
  ul.sidemenu ul.submenu li a:hover, ul.sidemenu .submenu li a:active { color: gray; }

.break { width: 100%; height: 1px; font-size: 0.0em; float: left; clear: both; margin-bottom: 20px; }

.footer { background: url("images/footer_bg.png") repeat-x !important; background: transparent; width: 910px; float: left; font-size: 1.1em; padding: 0; color: #FFF; text-align: center; clear: both; display: inline; }

.footer ul.footermenu { font-size: 1.1em; }
.footer ul.footermenu a { background: url("images/footer_bg.png") 100% 0 repeat-y !important; background: transparent; color: #333; padding: 0 12px 0 0; }
.footer ul.footermenu a.last { background: transparent; }
.footer ul.footermenu .end a { border: none; }
/*.footer ul.footermenu a:hover { color: #FFF; }*/
.footer ul.footermenu li { display: inline; padding-top: 9px; padding-right: 8px; text-align: center; }
.footer #copyright { padding: 10px 0 30px; color: #333; }

/* FORMS
==================================================*/

.fancy input { font-size: 1em; border: solid 1px #DDD; border-top: solid 1px #AAA; background: #FFF; padding: 0.2em; width: 20em; color: #AAA; }
.fancy textarea { font-family: Verdana, "Sans-Serif"; font-size: 1em; border: solid 1px #DDD; border-top: solid 1px #AAA; background: #FFF; padding: 0.2em; width: 35em; color: #AAA; }

/* OTHER
==================================================*/