@charset "utf-8";

/* CSS Document */

/* ******************************************************************************** */
/*																					*/
/*		THIS CSS FILE IS NEW FOR 2018, AND CONTAINS ONLY THOSE PARTS OF THE 		*/
/*		2014 MOBILE CSS FILE THAT ARE USED RIGHT ACROSS THE SITE					*/
/*																					*/
/* ******************************************************************************** */


/*  Colours used:

green: 		#9ad459;
orange:		#ffb33d;
blue:		#2c8bfc (2006 revamp)
grey: 		#abb0b6;
palegreen:	#F3FFE6 (for background wash) - now changed to #efefef

*/

/*@import url('https://fonts.googleapis.com/css?family=Bitter&display=swap');*/
/*@import url('https://fonts.googleapis.com/css?family=Slabo+13px&display=swap');*/

/* ****************************************************	*/
/*				FONT FAMILY								*/
/* ****************************************************	*/

body, table, dd {
  font-family: "Roboto", Verdana, Helvetica, sans-serif;
  font-display: optional; 		/* To prevent FOUT */
  font-size: 16px;				/* Changed 15px to 16px 29 Nov 2020 */
  line-height: 1.5em;			/* Changed 1.45em to 1.55em 29 Nov 2020 */
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

.intro {
  font-size: 1.25em;
  line-height: 1.4em;
  font-weight: 400;
}


/* ****************************************************	*/
/*				MAIN LAYOUT DIVS						*/
/* ****************************************************	*/

body {
  /*text-align: center;*/		/* Removed 3 Nov 2018 */
  margin: 0;
  padding: 0;
  border: 0;	
  color: black;
}

div.wrapper	{
  position: relative; /* To stop advert dropping out */
  width: 100%;
  padding: 0;
}

div#footer, footer {					/* >>>>>>>>>>>>>>>>>>>>> MOVE TO TABLET OR DESKTOP */
  width: 94%;
  margin-left: 3%;
}


#maincontent {
  padding: 0 5%;				/* Needs some left/right padding on mobile, replaced with margin on outer at tablet */
  border: 0;
  margin: 0;
  margin-bottom: 20px;
}


/******************************	*/
/*		Paragraph				*/
/******************************	*/

p, table	{
  margin: 0 0 1em 0;
}


/******************************	*/
/*			Sidebar				*/
/******************************	*/

aside#sidebar	{
  margin: 0px;
  padding: 0 5%;				/* Needs some left/right padding on mobile, replaced with margin on outer at tablet */
  width: 90%;
}
  
#sidebar ul.seasons {
  list-style: none;
}


#sidebar h3,
#sidebar dt {
  border-bottom: 1px solid #ccc;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-top: 0px;
}
#sidebar h4 {
  font-size: 1.1em;
  padding: 10px 10px 0 10px;
  margin-bottom: 0;
}
body #sidebar dt { 					/* >>>>>>>>>>>>>>>>>>>>> WHAT'S THIS FOR??? */
  padding-left: 0 !important; 
  text-indent: 0px !important; 
  letter-spacing: 0 !important;
}

#sidebar .section {
  margin: 0 0 20px 0;			/* Changed top margin from 12px to 0px, and bottom margin 0 to 20 1 Dec 2018 */
}
#sidebar .section ul {
  margin: 0 0 0 10px;
  padding: 0 0 0 10px;			/* Changed to "0 0 0 10px" 3 Nov 2018 (left/right was undefined) */
}

#sidebar li,
#sidebar dl,
#sidebar p {
  text-align: left;
  margin-top: 0px;
  margin-bottom: 0 !important;
}
#sidebar ul,
#sidebar dl,
#sidebar p {
  padding-top: 5px;
  padding-bottom: 5px;
}
#sidebar dd,
#sidebar li {
  padding: 4px 0;
}
#maincontent a, 
#sidebar a {
  color: black;
}
div#featuredcontent { 
  width: 950px; 
  height: 150px; 
  border: 5px solid #C3C;
}



/******************************	*/
/*								*/
/*			HEADER				*/
/*								*/
/******************************	*/

div#header, 
header#brand {
  margin: 0;
  padding: 0;
  border: 0;
}

div#header h1, 
header h1,  
header#brand h1 {
  margin: 0 50px 0 0;
  padding: 10px 5%;				/* Needs some left/right padding on mobile, replaced with margin on outer at tablet */
  height: 70px;					/* From 61px to 70px 29 Nov 2020 to make more room for Ginther book advert */
  /*text-align: center;*/		/* Removed 3 Nov 2018 */
  
}

header h1 img {			/* Put a drop-shadow on the SVG logo! */
  filter: drop-shadow( .1rem .1rem .1rem #999 );
  width: 220px;			/* Make sure it doesn't crowd hamburger */
}


div#header #advert, 
header#brand #advert {
  position: absolute;
  top: 0px;
  right: 0;
}


/******************************	*/
/*								*/
/*		BREADCRUMBS				*/
/*								*/
/******************************	*/

div#breadcrumbs, 
p#breadcrumbs  {
  color: #2c8bfc;			/* 2006 revamp */
  font-size: 90%;
  margin-bottom: 10px;
}
div#breadcrumbs {
  margin-left: 6%;			/* Added 3 Nov 2018 */
}
div#breadcrumbs ol { 
  margin-top: 0;
}
div#breadcrumbs a { 
  color: #2c8bfc;			/* 2006 revamp */
  text-decoration: none;
}
body.nobreadcrumbs div#breadcrumbs {
  display: none;			/* Will be empty DIV if using 2014 template */
}


div#breadcrumbs ol  {
  list-style-type: none;
  padding-left: 0;
  margin-top: 0;
  margin-bottom: 0;
}
div#breadcrumbs ol li {
  display: inline-block;
}

/*********************************************/
/*		Adding Social bookmarks to right of Breadcrumbs		*/
/*********************************************/

/* Added 17 May 2012 */
#social { float: right; width: 240px; height: 25px;  }
#sidebar #social { float: none; }				/* But it should float when it's at the top of the sidebar */


/******************************	*/
/*														*/
/*				TYPOGRAPHY						*/
/*														*/
/******************************	*/

#maincontent h2,
#maincontent h3,
#maincontent h4,
#maincontent h5,
#maincontent h6 {
  text-align: left;
  color: #333;
  background-color: white;
  padding-top: 0.9em;
}

#maincontent h2,
#maincontent h3,
#maincontent h4 {
  border-bottom: 1px solid #ccc;
  overflow: hidden;				/* This stops the underline border going over a floated item to its right */
}

#maincontent h2 { font-size: 24px; }
#maincontent h3 { font-size: 20px; }
#maincontent h4 { font-size: 16px; }
#maincontent h5 { font-size: 14px; }
#maincontent h6 { font-size: 12px; }

#maincontent h1,
h2, h3, h4, h5, h6 {
  font-weight: bold;
  line-height: 1.4em;
  margin: 5px 0;
  padding-top: 5px;
  padding-bottom: 5px;
}


#maincontent h1,
h2 { font-size: 1.6em; }
h3 { font-size: 1.4em; }
h4, h5, h6 { font-size: 1.3em; }
th, table.standard .th { font-size: 1.3em; }

h6.author { font-size: 1em; color: #333; }

h3.h3smaller {
  font-size: 1.3em;
}


body#home dix#maincontent {
	padding-top: 25px;
}

body#home #maincontent h1, 
body#home #maincontent h2 {
  margin-top: 0px;
}

body#home #maincontent h2.follow	{
  margin-top: 5px;
}



/******************************	*/
/*														*/
/*				BLOCK QUOTES					*/
/*														*/
/* 		Still needed?				*/
/******************************	*/

blockquote	{
	padding: 0;
	padding-left: 10px;
	margin-left: 10px;
	border: 0;
	border-left: 1px dotted #abb0b6;	/* 2006 revamp */
}

blockquote p, dd blockquote	{
	font-weight: normal;
}

/******************************	*/
/*														*/
/*				SIDEBAR								*/
/*														*/
/* 		Move out?				*/
/******************************	*/

#sidebar dd, 
#sidebar dt {
	margin-left: 0;
	padding-left: 0;
	line-height: 17px;
	margin-bottom: 4px;
	}

body #sidebar dt 	{
	text-transform: uppercase;
	text-indent: 10px;
	letter-spacing: 2px;
	padding: 5px 0px;			/* Nifty recommends 5px vertical padding to be replaced by the corners	*/
	line-height: 1.4em;
	font-weight: bold;
	margin-top: 25px;
	color: #fff;
	background: #ffb33d;		/* 2006 revamp */
/*	text-shadow: 2px 3px 3px #896;	*/
}

#sidebar dd a:link, 
#sidebar dd a:visited {
	font-weight : normal; 
	}

#sidebar dt {
	text-align: center;			/* 2006 revamp */
}

/*	**********************	*/
/*		F/ATLANTIC SEASONS		*/
/* 		Move to seasons.css				*/
/*	**********************	*/

div#sidebar div.atlantic,
div#sidebar div.f3 {
  margin-top: 0px;
  font-size:85%;
}

aside#sidebar ul.seasons li {
  list-style: none;
  margin-bottom: 0.25em;
} 
div#sidebar div.atlantic ul.seasons li, 
div#sidebar div.f3 ul.seasons li {
  list-style: none;
  font-weight: bold;
  font-size: 110%;
  margin-bottom: 0.25em;
}

/*#sidebar ul.seasons li,
#sidebar ul.sections li {
  font-weight: bold;
}*/

#sidebar ul li {
  list-style: none;
  /*font-size: 12px;*/		/* Needs to be absolute size as some are wraped in atlantic or f3 divs */
  margin-bottom: 0.25em;
}

aside#sidebar ul.seasons li.active {
  font-weight: bold;
  /*font-size: 120%;*/
} 
div#sidebar div.atlantic ul.seasons li.active, 
div#sidebar div.f3 ul.seasons li.active {
  font-weight: bold;
  /*font-size: 120%;*/
}

aside#sidebar ul.seasons li.inactive {
  color: #666;
} 

#sidebar #helping p {
  margin-bottom: 0.25em;
}

/* ******************************	*/
/*		SEASONS NAVIGATION IN SIDEBAR		*/
/* 		Move to seasons.css				*/
/* ******************************	*/

ul.seasons li.active a {
  color: #333;
  font-weight: bold;
  text-decoration: none;
}

/* ******************************	*/
/*		SEASONS RACE LISTS			*/
/* 		Move to seasons.css				*/
/* ******************************	*/

p.season_race_list,
p.list-of-races,
div#racelist p {
  line-height: 1.75em;		/* Add space vertically (Google complaining clickable items too close) */
  word-spacing: 5px;		/* Add space horizontally (Google complaining clickable items too close) */
  text-align: left !important;			/* reinstated 22 Dec 2019 */
}
p.season_race_list a,
p.list-of-races a, 
div#racelist p a {
  word-spacing: normal;		/* But then reduce space to normal within each link */
  white-space: nowrap;		/* ... and ensure links do not break over lines */
}

section#maincontent div#racelist p, 
section#maincontent p.list-of-races {
}
section#maincontent div#racelist p a, 
section#maincontent p.list-of-races a {

}


/* Seasons championship race lists */
#maincontent h4.championship_races, 
#maincontent h4.championship_table {
  border-bottom: none;
  font-size: 18px;
  padding-bottom: 10px;
  color: black;
}

/******************************	*/
/*														*/
/*				LISTS (UL, DL)						*/
/*														*/
/******************************	*/

/*#maincontent ul 	{
	margin: 3px 0;
	padding: 0 0 5px 0;
	}
*/
#maincontent ol {
  margin-top: 0;
  margin-bottom: 10px;
}

#maincontent ol li		{
	list-style: decimal outside;
	line-height: 160%;
	margin: 0 5px 15px 0;
	padding: 0 0 0 5px;
	}

#maincontent ul {
    padding-left: 20px;
	}

#maincontent ul li	{
	line-height: 140%;
	margin-bottom: 5px;
	padding-bottom: 0;
	padding-left: 5px;
	margin-left: 5px;
	list-style: square;
	}
	
#maincontent ul ul li {
	margin-top: 10px;
	list-style: square;
	}

#maincontent ul.inlinelist	{
	padding: 0;
	margin: 0;
	}

#maincontent .inlinelist li	{
	display: inline;
	padding: 0 5px 0 0;
	margin: 0;
	border: 0;
	}	

#maincontent ul.standard {
	padding-left: 0.5em;
	margin-left: 1em;
}
#maincontent ul.standard li {
	list-style-position: outside;
	list-style-type: disc;
	padding-left: 0.0em;
	margin-left: 0.5em;
}

/* ***************************************	*/
/*		SITE UPDATES ON FRONT PAGE			*/
/* ***************************************	*/

dl#siteupdates	{
  /*margin-top: 5px;*/
  /*padding-top: 0;*/
}

dl#siteupdates dt {
  color: white;
  background-color: #abb0b6;		/* 2006 revamp	*/
  width: 60px;
  margin: 5px 10px 15px 0;
  padding: 5px 5px;			/* Nifty recommends 5px vertical padding to be replaced by the corners	*/
  /*line-height: 140%;*/
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  clear: left;
  float: left;				/* 2006 revamp */
}

dl#siteupdates dt a {
  color: white;
  text-decoration: none;
}
	
dl#siteupdates dd {
  margin-bottom: 15px;
  padding: 0;
  min-height: 60px;
  margin-left: 0;
}
dl#siteupdates dd p {
  padding-left: 0;
  margin-left: 80px;
}
#maincontent dl#siteupdates h4 {
  font-size: 1.1em;
  margin: 0;
  padding: 0;
  border-bottom: none;
}

/* ****************************************************	*/
/*				HIGHLIGHTS (ODDS & SODS)				*/
/* 		Move out?				*/
/* ****************************************************	*/

.winner {  
	font-weight: bolder; 
}

.person {  
	background-color: #FFFFbb;	/* was a orangey colour - now a background highlight instead - 2006 revamp */
}
ol#carnotes span.person { background-color: transparent; }
ol#carnotes span.winner { font-weight: normal; }

.new {  
	font-weight: bolder; 
	font-size: 110%;
	color: #ffb33d;				/* 2006 revamp */
	background-color: transparent;
	text-transform: uppercase;
}

.needed {  
	font-weight: bolder; 
	color: #993300;				/* 2006 revamp but then replaced Jan 2010 with something bolder */
	background-color: transparent;
}

.entrant {							/* Added 28 April 2011 */
	font-size: 90%;
	color: #666;
}

.entrant a:link, .entrant a:visited {	/* Added 28 April 2011 */
	color: #666;
}

.lastupdated {
	font-size: 90%;
	color: #abb0b6;				/* 2006 revamp */
}

.lastupdated a:link, .lastupdated a:visited {
	color: #abb0b6;				/* 2006 revamp */
}

.lastupdated a:hover {
	text-decoration: underline;	/* 2006 revamp */
}

hr {  
	width: 70%;
	color: #abb0b6;				/* 2006 revamp */
	background-color: transparent;
}

hr.finegrey {  
	width: 98%;
	color: #abb0b6;				/* 2006 revamp */
	background-color: transparent;
}

td.racelistdivider {
	border-bottom: 1px solid #ffb33d;
}

span.available {
	color: #bedf5d;
	font-weight: bold;
}

span.libre { font-style: italic; }

p.access {
	display: none;
	}

div.boxed {
  margin: 10px; 
  padding: 10px; 
  max-width: 350px; 
  border: 1px solid #999;
}

span:lang(de), 
span:lang(fr), 
span:lang(it) {
  font-style: italic;
}


/********************************/
/*			IMAGES				*/
/********************************/

img.indesc {					/* Old Form.  This is switched off below if it's inside a new div.image */
	clear: right;
	float: right;
	border-left: 0.5em solid white;
	border-bottom: 0.5em solid white;
}

span.caption {
	float: right;
	border-left: 0.5em solid white;
	border-bottom: 0.5em solid white;
	clear: right;				/* Needed or text doesn't flow around image in IE (Firefox ok)	*/
	width: 400px;
	background-color: white;
	color: #333333;
	font-size: 75%;
	text-decoration: none;
}

div.image {
  margin-bottom: 8px;
  border: 1px solid #bbb;
  border-width: 1px 0px;
  background-color: white;
  color: #333333;
}

section#maincontent > a:first-child img, 
section#maincontent > img:first-child,
div.typeimage, 
div.watn-title img {		/* Make the title image reach across the page */
  height: auto !important;
  max-width: 111%;
  margin-left: -5.5%;	/* Let it explode out of the 5% left padding */
}

div.typeimage {		/* Force the title image to reach across the page */
  width: 111%;
}

div.image img.indesc {			/* Turn off the white borders if it's been wrapped in a div.image	*/
	float: none;
	clear: none;	/* Failed experiment 12 Nov 2006 to clean up DW8 display */
	border-left: none;
	border-bottom: none;
}

div.image span.caption {		/* Turn off the white borders if it's been wrapped in a div.image	*/
	float: none;
	border-left: none;
	border-bottom: none;
	padding-left: 0.5em;
	width: 390px;				/* Effectively some right padding too	*/
}
div.image p.caption {
}

div.image p.caption {		/* Turn off the white borders if it's been wrapped in a div.image	*/
	background-color: white;
	color: #333;
	font-size: 75%;
  line-height: 1.35em;
	text-decoration: none;
	padding: 0 0 8px 0.5em;
	margin: 0;
	width: 390px;				/* Effectively some right padding too	*/
  max-width: 96%;
	overflow: hidden;
}
div.image p.caption a { /* Added 28 Dec 2010 */
  color: #333;
  text-decoration: none !important;
}
div.image p.caption a:hover { /* Added 28 Dec 2010 */
  text-decoration: underline !important;
}


div.image p.caption {		/* Align caption with content above and below when image is full width */
  max-width: 88%;
  padding-left: 6%;
  padding-right: 6%;
}




div.image span {
  clear: right;
  display: none;		/* An old attempt switched off ...		 */
}

div.image span.caption {
  display: block;		/* ... so need to switch on the new form */
}

img	{
  border: 0;
}

img {					/* Make images shrink to fit on mobile */
  height: auto !important;
  max-width: 100%;
}



/************************************************/
/*				Admin pages						*/
/************************************************/

form.contribution { height: 1%; overflow: visible; }
form.contribution div.form-block { min-height: 250px; float: left; }
form.contribution div.form-block.first { width: 56%; }
form.contribution div.form-block.second { width: 42%; }
form.contribution label { width: 30%; display: inline-block; }
form.contribution label.orc_contribution_notes { width: auto; display: block; }
form.contribution p.orc_contribution * { vertical-align: top; margin-top: 5px; }
form.contribution input { width: 60%;  }
form.contribution textarea { width: 60%; height: 150px; }
form.contribution textarea.orc_contribution_notes { width: 100%; height: 260px; }
form.contribution input.submit { clear: left; width: auto; padding: 8px 30px;}



form.dossier p,
form.content h3,
form.content h4,
form.content p { padding-left: 0; }


form.dossier label { width: 20%; }
form.dossier input { width: 25%; margin-right: 5%; }
form.dossier input.comment { width: 60% }

form.content textarea { width: 94%; }
form.content textarea.car-text-record0-edit { height: 90px; }
form.content textarea.car-text-record1-edit { height: 300px; }


form.contribution input,
form.contribution select,
form.contribution textarea {
  border: 1px solid rgba(208, 208, 208, 1); 
  box-shadow: 0 0 5px rgba(208, 208, 208, 1);
  font-size: 16px;
  padding: 3px;
}
form.admin.update { height: auto; } 
form.admin.update label { width: 100px; } 



/* This next part of mobile.css moved to orc2018-footer-mobile.css */





/********************************/
/*					*/
/********************************/

#maincontent a.feedicon {
  display: inline-block;
  margin-left: 5px;
  padding: 0px 5px 2px 20px;
  height: 16px;
  width: 16px;
  background: url(../rss/feed-icon-14x14.png) no-repeat left 50%;
}

p.eligibility { color: #666; font-style: italic; }

div.cleared { clear: both; }

a.driver {
  text-decoration: none !important;
}
a.driver:hover {
  text-decoration: underline !important;
}


/* This next part of mobile.css moved to orc2018-watn-mobile.css */

/* ***************************************	*/
/*			Photographers					*/
/* ***************************************	*/

div.photographer-info {
  float: right;
  width: 250px;
  min-height: 259px;
  border: 1px solid #666;
  padding: 10px;
}
div.photographer-info h3 {
  text-align: left;
  margin-top: 0;
  margin-bottom: 12px;
  color: black;
  background: none;
  font-size: 120%;
}

/* This next part of mobile.css moved to orc2018-nav-... css files */
/* ***************************************	*/
/*		SOCIAL MEDIA WIDGETS				*/
/* ***************************************	*/

/* This lines up the buttons; otherwise Fb buttons a few pixels too low */
.fb-like.fb_iframe_widget > span { height: 25px !important; }


/* ***************************************	*/
/*		SITE MAP							*/
/* ***************************************	*/

div#multicolumnfooter { display: none; }