@charset "utf-8";

/* CSS last updated 26 May 2024 - Jamie Broadfield jbroadfield@gmail.com */

/* 
	Colors in use:
	Tawny (Orange): #CC6600 (same as #C60)
	Dark Charcoal: #333333 (same as #333) - This is used as the standard text color
	Royal Blue: #3579DC - This is used as the standard anchor color
	Maroon: #800000 - This is used to display deleted content
	Boston University Red: #CC0000 (same as #C00) - This is used in the debug light system and all error messages
	Sea Green: #2E8B57 - This is used for date headers, color bars, green buttons and some left nav
	Light Gray: #D0D0D0 - This is used for the masthead text, main navigation text and to display past events
	Aubergine: #231F20 - This is used for the masthead and navigation background color
	White: #FFFFFF (same as #FFF) - Page background
	Black: #000000 (same as #000)
*/

/*
	font-sizes:
	xx-small
	x-small
	small  10px
	medium  <-- default 16px 1em 100% 12pt
	large
	x-large
	xx-large
	smaller - smaller than its parent
	larger - larger than its parent
	length - px, cm etc
	% - percentage of its parent
*/


/* 
@media print {
    div {
        break-inside: avoid; !important;
    }
}
 */


/* The print font size is larger than the screen and the font family primary choice is verdana, just like the screen */
body {
	background: white;
	font-family:verdana,arial,helvetica,sans-serif;
	font-size: 20px;
	color: #000;
}

/* Masthead - Redefined for print - WHITE background instead of aubergine */
#masthead,#masthead-dev	{  
	position:fixed;
	top:0; 
	left:0;
	width:100%; 
	height:50px;
	color:#D0D0D0;
	background:#FFF;
	background-size:70% 70%;
	z-index:1;
	padding:0;
	margin:0;
}

/* 
#sitename {
	position:fixed;
	top:0;
	width:100%; 
}
 */


/* Changed position to relative because the site title was overlying the event name */
#content,
#content-main,
#contact-page
{
	position:relative;
	top:0px;
	width:100% !important;
	margin-top:0px !important;
	margin-left:0px !important;
	padding:0px !important;
}

/* H1 headers */
h1 {
    font-size:large !important; 
    color:#333333; 
    font-weight:bold;
    line-height:100%;
}



/* No decoration (underline) or colour on links for printing */
a:link, a:visited {
	text-decoration:none; color:inherit;
}

/* This class is defined as hidden on the page so it only shows on print-outs to make it better laid out 
Can be used with divs or spans etc */
.printOnly {
	display:block !important;
}

/* Generic color classes  - allows you to choose slightly different colours from the main CSS for printing 
Only changed green so far from #2E8B57 (Sea Green) because it was a bit too bright on the print preview, instead
electing simply 'green' which looks a lot better on the print */
.orangesmall {font-size:small; color:#CC6600;}
.orangexsmall {font-size:x-small; color:#CC6600;}
.orangexsmall-bg {font-size:x-small; background-color:#CC6600;}
.orangexxsmall {font-size:xx-small; color:#CC6600; font-weight:bold;}
.ambersmall {font-size:small; color:#CC6600;}
.amberxsmall {font-size:x-small; color:#CC6600;}
.amberxsmall-bg {font-size:x-small; background-color:#CC6600;}
.amberxxsmall {font-size:xx-small; color:#CC6600;}
.redsmall {font-size:small; color:#800000;}
.redxsmall {font-size:x-small; color:#800000;}
.redxxsmall {font-size:xx-small; color:#800000;}
.greensmall {font-size:small; color:green;}
.greenmedium {font-size:medium; color:green;}
.greenxsmall {font-size:x-small; color:green;}
.javascripttimer {font-size:x-small; color:#2E8B57; font-weight:bold;}
.greenxxsmall {font-size:xx-small; color:green;}
.greenl {font-size:large; color:green;}
.green {color:green;}
.orange {color:#CC6600;}
.debugred {color:#CC0000;font-size:x-small;}

/* About Us and Terms of Use - Font size (different between screen and print */
p.defaultterms {text-align:justify;} 
a.defaultterms {font-size:x-small; color:#3579DC;} 
.defaultterms {font-size:x-small; color:#333333;} 
h1.termsheader {font-size:xx-small; color:#333333; font-weight:bold;}
h2.termsheader {font-size:x-small; color:#333333; font-weight:bold;}

/* Main content window.  66% width on the screen, but on print-out we want full width - 25 May 2024 */
#contentMainWithSidebar { 
	float:left;
	width:100%; 
	border-right:1px solid #2E8B57; 
	background:#FFFFFF; 
	padding-right:10px;
}

/* ========================== EVENT POSTER =========== 30 May 2024 ================ */

img.grayscale { 
    filter: grayscale(100%); 
}

/* ========================== VENUES PAGE and BANDS PAGE (listings) =========== 27 May 2024 ================ */

td.venuesArtistsPicture {
	width: 50px;
	border: 0px;
	text-align:right;
	vertical-align:middle;
	overflow: hidden;
    font-size: x-small;  
    page-break-inside: avoid;
	}

td.venuesArtistsDetails {
	width: 100%;
	border: 0px;
	overflow: hidden;
	text-overflow: ellipsis;
    font-size: x-small; 
    page-break-inside: avoid;
	}

table, tr, td {
    page-break-inside: avoid; !important;
}

/* =============================================================================================================== */


/* ===================== NO PRINT - elements with this class will never be printed - 29 May 2024 ================= */

/* TIP: If an element already has a class='' assigned to it, you can ALSO have noPrint assigned to it.  Example: echo"<h2 id='EmailLog' class='anchor noPrint'>E-mail Log</h2>\n"; */

.noPrint { 
    display:none !important;
}

/* =============================================================================================================== */