/* SCREEN.CSS

   This is where all styles for on-screen media are declaired

   

   --------------------------------------------------------------------------------------------------------------------------

   FILE INFO

   Revision number:  1.0

   Last updated:     2009/04/24

   Last updated by:  Matt Wilcox

   ----------------------------------------------------------------------------------------------------------------------- */



/* =global_reset | based on http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/

   ----------------------------------------------------------------------------------------------------------------------- */

   

   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,

   b, u, i, center,

   dl, dt, dd, ol, ul, li,

   fieldset, form, label, legend,

   table, caption, tbody, tfoot, thead, tr, th, td {

     margin: 0; padding: 0; border: 0; outline: 0;

     font-size: 100%; vertical-align: baseline; background: transparent; }

   body {

     line-height: 1; }

   ol, ul {

     list-style: none; }

   blockquote, q {

     quotes: none; }



   /* remember to define focus styles! */

   :focus {

     outline: 0; }



   /* remember to highlight inserts somehow! */

   ins {

     text-decoration: none; }

   del {

     text-decoration: line-through; }



   /* tables still need 'cellspacing="0"' in the markup */

   table {

     border-collapse: collapse; border-spacing: 0; }



/* =typography | based on http://alistapart.com/articles/settingtypeontheweb/

                          http://24ways.org/2006/compose-to-a-vertical-rhythm/

                          

    NOTE: found that margin-top applied to everything is be a pain - it often messes up layout and requires jumping through

          hoops to fix, so have stopped doing this as a default and now add top margin manually when required instead.

    NOTE: using px for type is bad for people using IE6, but good for my brain. IE6 is dying, so I think that's OK. Feel free

          to tut if you're a purist. I'm a pragmatist.

   ----------------------------------------------------------------------------------------------------------------------- */

   body {

     font : 93.75%/1.5 Verdana, Helvetica, Ariel, Verdana, sans-serif; }

   html > body {

     font-size : 15px; }

   div, applet, object, iframe,

   h1, h2, h3, h4, h5, h6, p, blockquote, pre,

   address, img, dl, dt, dd, ol, ul, li,

   fieldset, form, label, legend,

   table, caption, tbody, tfoot, thead, tr, th, td {

     margin-bottom : 1.5em; }

   h1,

   .home h2 { font-size : 24px; line-height: 36px; margin-bottom: 18px; font-weight : normal; }

   h2 { font-size : 20px; line-height: 36px; margin-bottom: 18px; font-weight : normal; }

   h3, h4, h5, h6 {

     font-size : 18px; line-height: 18px; margin-bottom: 18px;

     font-weight : normal; }

   

/* =design | now the browser reset and basic typographic layout is done, lets get designing

   ----------------------------------------------------------------------------------------------------------------------- */

   

/* =html =body */

   html {

     background : #000 url(../images/html.gif) 50% 100% no-repeat; color : #fff; }

   body {

     background : transparent url(../images/body2010.jpg) 50% 0 no-repeat; }



/* =h1 */

   .bands h1 {

     display : block; width : 310px; height : 49px; margin-top : 19px;

     background : url(../images/bands-h1.gif) 0 0 no-repeat; text-indent : -999em; overflow : hidden; }

   

   .beers h1 {

     display : block; width : 310px; height : 49px; margin-top : 19px;

     background : url(../images/beers-h1.gif) 0 0 no-repeat; text-indent : -999em; overflow : hidden; }

   

   .band-profile h1 {

     font : 34px impact; color : #ffed00; }

     

   .about h1 {

     display : none; }

     

   .ticket-info h1,

   .sponsors h1,

   .contact-us h1,

   .terms-and-conditions h1,

   .press h1,

   .about-this-website h1 {

     font : 34px impact; color : #ffed00;

     padding-bottom : 20px; background : url(../images/home-intro-h2.gif) 0 100% no-repeat; }

     

/* =h2 */

   #content_supp h2 {

     display : none; }

     

   #nav_main h2,

   form h2,

   form h3 {

     display : none; }

     

   .home #intro h2,

   #content_main h2 {

     font : 34px/1.5 impact; color : #ffed00; margin-bottom : 0;

     padding-bottom : 14px; background : url(../images/home-intro-h2.gif) 0 100% no-repeat; }

   .home div#news h2,

   .home div#beer h2 {

     display : none; }

   .home #intro h2 {

     margin-bottom : 10px; }

     

   .beers #content_main h2 {

     display : block; width : 620px; height : 49px; margin-top : 19px;

     background : url(../images/beers-tasting-notes.gif) 0 0 no-repeat; text-indent : -999em; overflow : hidden; }

     

   .band-profile #content_supp h2 {

     display : block; width : 310px; height : 49px; margin-top : 19px;

     background : url(../images/h2-appearing-on.gif) 0 0 no-repeat; text-indent : -999em; overflow : hidden; }



   .ticket-info #content_supp h2 {

     display : block;

     font : 22px impact; color : #ffed00; }

   

   .contact-us #content_main h2 {

     background-image : none; font-size : 24px; }

    

     

/* =h3 */

   .home div#news h3 {

     font : 22px impact; color : #ffed00; }

     

   .bands .day h3 {

     display : none; }

     

   .beers .note h3 {

     font : 32px impact; color : #ffed00; line-height : 32px; margin-bottom : 0; }

   .beers .note.strong h3 {

     color : #ea5a00; }

   .beers .note.average h3 {

     color : #ffed00; }

   .beers .note.weak h3 {

     color : #6ebecb; }

     

   .band-profile #content_supp h3,

   .about #content_supp h3 {

     font : 22px impact; color : #ffed00; }

     

   .contact-us #content_main h3 {

     font : 18px impact; color : #fff; }

     

/* =h4 */

   h4 {

     font : 18px impact; color : #000; }

     

   .bands .day h4 {

     margin : 0 10px; }

     

   .press #content_main h3 {

     font : 22px impact; color : #fff; }



/* =p */

   p.accessibility {

     position : absolute;

     margin : -3.5em 0 0 0;

     z-index : 2; }

     

   blockquote p:before {

     content : "\201c"; }

   blockquote p:after {

     content : "\201d"; }

   blockquote p.author {

     border-top : 1px dotted #666; }

   blockquote p.author:before,

   blockquote p.author:after {

     content : ""; }

     

   .attributed p {

     margin-bottom : 0; }

     

   label p.error {

     padding : .5em; color : #fff;

     background : #c00; text-ammlign : left; }

     

   #site_info p {

     position : absolute; bottom : 0; left : 277px;

     margin-bottom : 0;

     font-size : 11px; color : #000; }

     

   .home #news p {

     font-size : 12px; margin-left : 20px; }

   .home #beer p {

     font-size : 12px; text-align : right; margin-left : 90px; }

     

   #content_supp p.intro {

     font-size : 14px; font-weight : bold; }

     

   .band-profile p.quotation {

     margin-bottom : 10px;

     font : 20px/1.2 Georgia; font-style : italic; }

   .band-profile p.author {

     font-size : 12px; border-top : 0; }

   .band-profile #the-band p.intro {

     font-size : 14px; line-height : 1.8; font-weight : bold; }

     

/* =blockquote */

   .beers blockquote {

     font-family : Georgia; }

     

   .band-profile blockquote {

     margin-bottom : 30px;}



/* =em =strong =del =ins =abbr =acronym =code */

   em          { font-style : italic; }

   strong      { font-weight : bold; }

   del         { text-decoration : line-through; }

   ins         { text-decoration : none; color : #006; }

   del[title],

   ins[title]  { cursor : help; }

   acronym,

   abbr        { text-decoration : none; border-bottom : none; font-style : italic; cursor : help; }

   code        { font-family : dialogue, 'Courier New', courier, serif; }

   sup         { vertical-align : super; font-size : .8333em; }

   sub         { vertical-align : sub; }

   

/* =address */

   address {  }



/* =dl =dt =dd */

   dl {  }

   dt {

     margin-bottom : 0;

     font-weight : bold; font-style : italic; }

   dd {

     margin-top : 0;

     border-left : .3em solid #ddd; padding : .5em 0 0 .7em; }

   

/* =ul */

   #content ul {

     margin-left : 1.2em;

     list-style : disc outside; }

   #nav_main ul {

     margin : 0; }

     

   .home #content ul {

     margin-left : 10px;

     list-style : none; }

     

   .home div#beer ul {

     margin-bottom : 0; }

     

   .beers #content_supp ul {

     margin-left : 0; list-style-type : none; }

     

   .press #content .gallery ul {

     margin : 0; list-style-type : none; padding-top : 30px;

     background : #FFED00 url(../images/gallery-top.gif) 0 0 no-repeat; }

     

/* =ol */

   #content ol {

     margin-left : 1.6em;

     list-style : decimal outside; }



/* =li */

   li {

     margin : .5em 0; }

   #nav_main li {

     display : inline; margin : 0 0 0 1em; }

   

   .home div#beer li {

     display : inline; }

     

   .beers li.strong {

     color : #ea5a00;

     border-left : 22px solid #ea5a00; padding-left : 12px; }

   .beers li.average {

     color : #ffed00;

     border-left : 22px solid #ffed00; padding-left : 12px; }

   .beers li.weak {

     color : #6ebecb;

     border-left : 22px solid #6ebecb; padding-left : 12px; }

     

   .press #content .gallery ul li {

     display : inline; margin : 0 8px; }

     

/* =img */

   img,

   img a { border : none; }

   .attributed img {

     margin : 0; }

     

   .bands .day img {

     position : absolute; top : 51px; left : 10px;

     margin : 0; z-index : 1; }

   .bands .day img.mask {

     z-index : 2; }

   

   .beers .note img {

     float : left; }

     

   .band-profile #the-band img {

     position : absolute; top : 13px; left : 310px;

     margin : 0; }

     

   .press #content .gallery ul li a img {

     border : 2px solid #000; margin : 0; }

   

/* =hr */

   hr { display : none; }



/* =a */

   a:link    { color : #FFED00; text-decoration : none; }

   a:visited { color : #FFED00; text-decoration : none; }

   a:hover   { text-decoration : underline; }

   a:focus   { color : #fff; }

   a:active  { color : #fff; outline : none; }

   :target   { background-color : #ff6; }

   

   p.accessibility a {

     margin : 0; padding : 0; line-height : 1em; }

   p.accessibility a:focus {

     position : absolute; left : 1em;

     margin-top : 2.5em;

     background-color : #ffff99; }

     

   #nav_main li a {

     position : absolute; top : 355px; left : -2px;

     display : block; width : 71px; height : 38px;

     text-indent : -999em; }

   #nav_main li#nm_bands a {

     top : 342px; left : 94px; 

     width : 64px; height : 34px; }

   #nav_main li#nm_beers a {

     top : 329px; left : 168px; 

     width : 64px; height : 34px; }

   #nav_main li#nm_about a {

     top : 314px; left : 244px; 

     width : 64px; height : 40px; }

   #nav_main li#nm_ticket-info a {

     top : 296px; left : 329px; 

     width : 106px; height : 38px; }

   #nav_main li#nm_sponsors a {

     top : 279px; left : 447px; 

     width : 92px; height : 39px; }

   #nav_main li#nm_press a {

     top : 271px; left : 550px;

     width : 65px; height : 33px; }

   #nav_main a.nm_book-ticket {

     position : absolute; top : 160px; left : 6px;

     display : block; width : 165px; height : 160px;

     text-indent : -999em; overflow : hidden; }

     

   #nav_supp li a {

     position : absolute; bottom : 35px; left : 276px;

     display : block; width : 79px; height : 46px; 

     text-indent : -999em; overflow : hidden; }

   #nav_supp li#ns_press a {

     left : 373px;

     width : 57px; height : 44px; }

   #nav_supp li#ns_terms-and-conditions a {

     left : 449px; bottom : 30px;

     width : 99px; height : 48px; }

/*   #nav_supp li#ns_camra a {

     left : 568px; bottom : 6px;

     width : 71px; height : 96px; }*/

   #nav_supp li#ns_jobs a {

     left : 568px;

     width : 53px; height : 44px; }     

   #site_info p a {

     color : #000; border-bottom : 1px dotted #000; }

     

   .home div#news h3 a {

     color : #ffed00; }

   .home div#news .two h3 a {

     color : #f18e00; }

   .home div#news p a,

   .home div#beer p a {

     font-family : impact; font-size : 16px;}

     

   .bands .day a {

     position : absolute; top : 0; left : 0;

     display : block; width : 100%; height : 100%;

     text-indent : -999em; overflow : hidden; z-index : 3; background : url(../images/ie-pixel.gif); }

     

   #content_supp a.book-now {

     display : block; width : 105px; height : 36px;

     background : url(../images/book-now.gif) 0 -36px no-repeat; text-indent : -999em; overflow : hidden; }

   #content_supp a.book-now:hover,

   #content_supp a.book-now:focus {

     background-position : 0 0px; }

      

/* =table */

   table {

     width : 100%; border : 1px solid #ddd; }



/* =caption */

   caption {  }



/* =thead */

   thead {

     text-align : left; background : #ddd; }



/* =tfoot */

   tfoot {

     background-color : #ddd; }

   

/* =tbody */

   tbody {  }

   

/* =tr */

   tbody tr:hover { background-color : #f6f6f6; }

   

/* =th */

   th {

     font-weight : bold; padding : 2px; }



/* =td*/

   td {

     border : 1px dotted #ddd; padding : 2px; }



/* =form */

   form {

     position : relative;

     width : 100%;

     overflow : hidden; }

     

   #nav_main form {

     margin : 0; }

     

   #site_info form {

     position : relative;

     width : 260px; height : 138px; margin-bottom : 0; }

   

/* =fieldset */

   fieldset {  }



/* =legend */

   legend {

     margin : 0; }

   

   #nav_main legend {

     display : none; }

   

/* =label */

   label {

     position : relative; /* so we can absolutely position errors */

     display : block; width : 178px;

     overflow : hidden; /* so no collapsing float issues */ }

     

   label.name_first,

   label.name_last,

   label.email {

     position : absolute; top : 10px; left : 60px; }

   label.name_last {

     left : 60px; top : 42px; }

   label.email {

     top : 75px; }

   

/* =input */

   #site_info label input {

     width : 100%; border : 0;

     background-color : #F18E00; }

     

   form div input {

     position : absolute; top : 105px; left : 75px; }

   

/* =textarea */

    textarea {

      width : 99%; height : 8em; }



/* =select */

   label select {

     width : 100%; }

   select:focus {

     background-color : #ff9; }

     

/* =div */

   #container {

     position : relative;

     width : 960px; min-height : 375px; padding-top : 425px; margin : 0 auto; }

     

   #site_context {

     position : absolute; left : -999em;

     overflow : hidden; }

   #site_info {

     margin-bottom : 12px; }

   

   #content {

     overflow : hidden; }

   #content_supp {

     position : relative; float: left;

     width : 300px; }

   #content_main {

     float : right;

     width : 620px;

     overflow : hidden; }

   #content_supp div {

     margin-left : 10px; }

     

   .home #content_main {

     float : left;

     width : 650px;

     overflow : hidden; }

   .home #content_supp {

     position : relative; float: right;

     width : 240px; margin-top : 30px; }

   .home #intro div {

     margin-left : 10px; margin-right : 10px; padding-bottom : 30px; }

   .home div#news {

     float : left;

     width : 250px; padding-top : 60px;

     background : url(../images/home-latest-news.gif) 0 0 no-repeat; }

   .home div#beer {

     float : right;

     width : 340px; padding-top : 98px;

     background : url(../images/home-beer-h2.gif) 0 0 no-repeat; }

   .home #content_supp div {

     z-index : 5; }

     

   .bands #content_supp {

     font-size : 12px; }

   .bands #content_main,

   .beers #content_main,

   .press #content_main {

     padding-bottom : 20px; }

   .bands .day {

     position : relative;

     display : block; width : 620px; height : 310px;

     background : url(../images/programme.gif) 0 100% no-repeat; }

   .bands .lunch,

   .bands .afternoon,

   .bands .evening {

     position : absolute;

     display : block; width : 192px; height : 199px; margin-top : 45px; }

   .bands .afternoon {

     left : 214px; }

   .bands .evening {

     left : 427px; }

     

   .beers .note {

     background : url(../images/home-intro-h2.gif) no-repeat scroll 0 100%;

     overflow : hidden; }

   .beers .note div {

     width : 520px; float : right; }

     

   .band-profile #the-band {

     position : relative;

     padding : 40px 20px 0 20px; margin-bottom : 40px;

     background : #ffed00 url(../images/the-band-top.gif) 0 0 no-repeat; color : #000; font-size : 12px; line-height : 1.8; }

   .band-profile .left {

     margin-right : 310px; width : 270px; min-height : 174px; }

     

   .press #content .gallery {

     padding-bottom : 30px;

     background : #FFED00 url(../images/gallery-bottom.gif) 0 100% no-repeat; }

     

   .about-this-website .pseudo-row {

     clear : both; overflow : hidden; border-bottom : 1px dotted #333; }

   .about-this-website .techy {

     float : left;

     width : 630px; font-size : 12px; }

   .about-this-website .human {

     float : right;

     width : 300px;

     font-weight : bold; }

   

   #content {

     padding-bottom : 60px; }

     

   #content_supp div.vcard {

     margin-left : 0; }

     

/* =span */

   label span {

     display : block; }

   label.boolean span {

     display : inline; }

     

   .home #cycle_prev,

   .home #cycle_next {

     position : absolute; left:  12px; bottom : 21px;

     display : block; width : 107px; height : 60px; cursor : pointer; z-index : 12; }

   .home #cycle_next {

     left : 123px; }

     

   .band-profile #the-band span {

     display : block; width : 630px; height : 40px; margin-left : -20px;

     background : transparent url(../images/the-band-bottom.gif) 0 0 no-repeat; }

     

/* =layout-classes */

   .float-left {

     float : left;

     margin-right : 30px; }

   .float-right {

     float : right;

     margin-left : 20px; }

   .float-left.last {

     margin-right : 0; }

   .clear {

     clear : both; }

     

   /* full width portions */

   .one-third {

     width : 300px; text-align : justify; /* text align to show column bounds */ }

   .two-thirds {

     width : 630px; text-align : justify; /* text align to show column bounds */ }

   .half {

     width : 465px; text-align : justify; /* text align to show column bounds */ }

     

   /* portions inside a two-third parent portion */

   .two-thirds .one-third {

     width : 190px; }

   .two-thirds .two-thirds {

     width : 410px; }

   

/* =display-classes */

   .attributed {

     padding : 9px; border : 1px solid #eee;

     background-color : #f6f6f6; }

     

/* fix display glitch with the mp3 player */

   div.media {

     margin : 0; height : 19px; overflow : hidden; }
	 
	 #toggle{
	 	color:#CC6600;
		text-decoration:none;
	 }
	 
   a.inurface ,

    a.inurface:hover,

   a.inurface:focus {

     color:#00FF00; 
	 font-weight:bold;
	 font-size:20px;
	 text-decoration:none;}