/* This for 'photo-left/right/centre' common with newsletters */

@import url("photo.css");

h1,h2,h3,h4 {
    color:          black;
    font-family:    Helvetica, Tahoma, Verdana;
}

.news-item {
    display:    table;
    width:      100%;
}

/* For date-tags in header lines on front-page */

div.news-item > h2 > a {
    display:        block;
    float:          right;
    text-decoration: none;
    padding:        2px 6px;
    background:     #ff6666;
    color:          #fff;
    font-size:      8pt;
    font-weight:    normal;
}

div.news-item > h2 > a:hover {text-decoration: underline;}

/* The next three relate to previous implementation with an extra <span>

div.news-item > h2 > span {
    float:          right;
    padding:        2px 6px;
    background:     #ff6666;
    font-size:      8pt;
    font-weight:    normal;
    color:          #fff;
}

div.news-item > h2 > span > a {
    text-decoration: none;
    color: #fff;
    display: block;
}

div.news-item > h2 > span > a:hover {
    text-decoration: underline;
    color: #fff;
}

#########  above left in 'just in case' */

.col2 h2 {
    font-family:    Tahoma, Verdana;
	font-size:      small;
	font-weight:    normal;
	text-align:     center;

	color:          black;
    background-color: white;
    line-height:    120%;

    margin-top:     5px;
    padding:        4px;
    border:         2px solid #ff6666;

    border-radius:  9px;  /* CSS3 */ 
}

.col2 ul {
	list-style: circle;
	margin: 0px;
	padding: 0px;
	padding-left: 15px;
	margin-bottom: 12px;
}

.col2 ul li {margin-bottom: 2px;}

.col2 ul.forthcoming li:first-line {color: red;}
.col2 ul.forthcoming li > span {color:red;font-weight:bold}

/* ##################################### */

ul.navlinks {border-right: 1px solid #004080;}

ul.navlinks li a, ul.navlinks p {
    margin:             0;
    padding:            6px 0px;
    color:			    #ff6666;
    background:		    #ff9;
    text-align:         center;
    text-decoration:    none;
    font-weight:        bold;
    font-size:          10pt;
    line-height:        120%;
    font-family:        Calibri;
    border:		        1px solid #004080;
    border-right:       0;
}

ul.navlinks li ul li a {
    border-right: 1px solid #004080;
    border-bottom-width: 0px;
    border-top-width: 1px;
}

ul.navlinks li ul li:first-child a {border-top-width: 0px;}

ul.navlinks li ul {border-bottom: 1px solid black;}

ul.navlinks, ul.navlinks ul { /* all lists */
    padding: 0;
    margin: 0;
    list-style: none;
}

ul.navlinks a {
    display: block;
    width: 109px;
}

ul.navlinks li { /* all list items */
    float: left;
    width: 110px; /* width needed or else Opera goes nuts */
    margin-bottom: 0px;
    border-top: 0px solid black; 
 }

ul.navlinks li ul { /* second-level lists */
    position: absolute;
    width: 110px;
    left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

ul.navlinks li ul ul { /* third-and-above-level lists */
    margin: -1em 0 0 120px;
}

ul.navlinks li:hover ul ul, ul.navlinks li.sfhover ul ul {
    left: -999em;
}

ul.navlinks li:hover ul, ul.navlinks li li:hover ul, ul.navlinks li.sfhover ul, ul.navlinks li li.sfhover ul { /* lists nested under hovered list items */
    left: auto;
}

ul.navlinks li a:hover {
	color:			#ff9;
	border-color:		white;
	background:		gray;
}

ul.navlinks li > ul a {
	opacity: 		0.9;
/*	filter: 		alpha(opacity=90); */
}

ul.navlinks {
    display: table;
    margin: auto;
    margin-top: 5px;
}

/* This for lists in P2P */
ol li, ul li, dl dt, dl dd {margin-bottom: 6px;}

/* This for result pages (e.g. congresses) */

dl.results-summary dt {font-weight:bold; font-size: 2em; margin-left: 6px;}

dl.results-summary dt {
    font-weight:bold;
    font-size: 1.4em;
    margin-left: 30px;
}

dl.collapse-list {margin-left: 20px;}

dl.collapse-list > dt {
    font-size: 12pt;
    background: #ccc;
    padding: 2px;
    padding-left: 5px;
}

dl.collapse-list > dd {
    border: 1px dashed #ccc;
    margin-left: 20px;
    padding-left: 10px;
    padding-right: 10px;
}

span.collapse-list-icon {
    border: 1px solid gray;
    padding: 0 2px;
    font-size: 12pt;
    background: #ccc;
}

dl.collapse-list > dt > span {
    margin-right: 10px;
    border: 1px solid gray;
    padding: 0 2px;
}

dl.collapse-list > dd dt {font-weight: bold;}

dl.collapse-list > dt > b {
    font-weight: normal;
    float: right;
    font-family: 'Lucida Console','Courier New';
    letter-spacing: 6px;
}

span.red, span.blk, td.red, td.blk
{
	font-family: Arial;
	font-size:   14px;
	color: red;
}
span.blk, td.blk {color: black;}

div#bridge-in-the-cupboard > h2 {display: block;}
div#bridge-in-the-cupboard > h2 > div {float:left;margin-right:20px;}

table#committee {border-collapse: collapse;}

table#committee td {
    padding:    4px 4px 4px 9px;
    border:     1px solid black;
}

table#committee tr td:first-child {font-weight: bold}

table#committee tr td:first-child + td + td {font-size: 7pt}

/* TODO - add these instead of HTML column widths
table#events {table-layout: fixed;}
table#events td:first-child {width: 20%}
table#events td:first-child  + td {width: 10%}
table#events td:first-child  + td + td {width: 35%}
*/

table#events {
    border-collapse:    collapse;
    font-size:          7.5pt
}

table#events td {
    padding:    4px 4px 4px 4px;
    border:     1px solid black;
}

table#events tr:first-child {
    background:     #ccc;
    font-weight:    bold;
    font-size:      8pt
}

table#events .subtitle{
    background:     #ff6666;
    font-weight:    bold;
    font-size:      8pt;
}

table#events td > span.highlight {
    background:     #ff6666;
    color:          #000;
    font-weight:    bold;
    padding:        2px 0;
}

span.green-point {background: #347235;}
span.blue-point {background: #3232d2;}
span.green-point, span.blue-point {
    color:          #fff;
    font-weight:    bold;
    padding:        2px 4px;
}
p > span.green-point, p > span.blue-point {padding: 1px 4px;}
td > span.green-point, td > span.blue-point {margin-left: -2px;}

div.two-col-dd div {
	float: left;
	width: 274px;
}

div.two-col-dd div > table {margin-left: -70px;}

div.two-col-dd div {
    border-right:   1px dashed black;
    margin-bottom:  15px;
}

div.two-col-dd div + div {
    margin-left:    20px;
    border-right:   none;
}

ul.bitc-icon-list li img {margin-right: 20px;}

ul.bitc-icon-list li {
    font-size: 10pt;
    list-style: none;
    height: 100%;
}

ul.bitc-icon-list li a {text-decoration: none;}
ul.bitc-icon-list li a img {border: none;}

span.highlight {
    background:     #ff6666;
    color:          #fff;
    padding:        1px 3px;
}

/* These for the ECL board-by-board review */

#board-detail > table {
    padding: 0px;
    margin: 0;
    border-collapse: collapse;
    border: 1px solid black;
}

#board-detail > table tr {height: 19px;}

#board-detail > table td {padding-left: 3px;}

#board-detail > table td.minus {padding-left: 40px;}

#board-detail > table td.zero {padding-left: 20px;visibility:hidden;}

#board-detail > p > span {
    background: red;
    padding: 2px 10px;
    color: white;
}

#board-detail > table tr:first-child {border-bottom: 1px solid black;}
#board-detail > table tr:first-child td {border-right: 1px solid black;}

li.divider {
    list-style:     none;
    font-weight:    bold;
    font-size:      9pt;
    padding:        8px 0px 8px 30px;
}

img.plain-logo {
    background:     none;
    border:         1px solid black;
}

/* This is for the a icon/photo followed a couple of lines of text */

.icon-slice {
    display:    table;
    width:      100%;
}

div.icon-slice h2, div.icon-slice p {
    margin: 3px;
    margin-left: 100px;
}

div.icon-slice > a > img.photo-left {
    padding: 0;
    border: 3px solid blue;
}

span.team {font-variant: small-caps;}

dl.result-archive {margin-left: 10px;}

dl.result-archive > dt {
    font-size: 12pt;
    padding: 2px;
    padding-left: 5px;
}

dl.result-archive ul, dl.result-archive li {
    display: inline;
    padding: 0 15px 0 0;
    margin: 0;
}

div.news-item ul ul {margin-top: 7px;} /* maybe everywhere? */

div.news-item table.info-text {margin-left: 25px}
div.news-item table.info-text td {padding-right: 25px;}

div.news-item table.place-col tr td:first-child {padding-right: 5px}

div.news-item table.division + table.division {margin-top: 50px;} /* this is a bit of a bodge to prevent divs crowding each other */

table.info-text {margin-left: 15px}
table.info-text th {padding-right: 10px;font-weight: bold;}
table.info-text td {padding-right: 10px;}

table.place-col tr td:first-child {padding-right: 5px}

table.table-centre {margin: 0 auto;}

/* For General Competition Rules */

div.gcr-note {
    background: yellow;
    padding: 0px 10px 10px 10px;
    border: 1px dotted black;
}

/* tables on RHS - all VP Scales */

div.col2 table.gcr {margin: auto;}
div.col2 table.gcr td {min-width: 70px;}
div.col2 table.gcr td:first-child {text-align: center;}
div.col2 table.gcr tr:first-child {font-weight: bold;}

/* overall list managment */
dl.gcr > dt {font-weight: bold;counter-increment: term;counter-reset: tol 0;}
dl.gcr > dt:before {content: counter(term) ". \0000a0 \0000a0 \0000a0";}
dl.gcr > dd {margin-left: 0;}

/* nested list - Ordered type level 1 */
dl.gcr > dd > ol {margin-left: 1em}
dl.gcr > dd > ol li {list-style: none;text-indent: -3em;counter-increment: tol;}
dl.gcr > dd > ol li:before {content:  counter(term) "." counter(tol) " \0000a0 \0000a0"}

/* nested list - Ordered type level 2 */
dl.gcr > dd > ol > li > ol {margin-left: 0em;margin-top: 1em;}
dl.gcr > dd > ol > li > ol li {list-style: none;text-indent: -3.8em;counter-increment: tol2;}
dl.gcr > dd > ol > li > ol li:before {content:  counter(term) "." counter(tol) "." counter(tol2) " \0000a0 \0000a0"}

/* nested list - Notes level-1 */
div.gcr-note > ol {margin-left: 0em;counter-reset: nb1 0;}

/* nested list - Notes level-1 - start at specified */
div.gcr-note > ol.start-at-4 {counter-reset: nb1 4;}
div.gcr-note > ol.start-at-4 > li {list-style:none;}
div.gcr-note > ol.start-at-4 > li:before {content:  counter(nb1) ". \0000a0";}

/* nested list - Notes level-2 */
div.gcr-note > ol > li > ol {margin-left: 0em;margin-top: 1em;}
div.gcr-note > ol > li > ol li {list-style: none;text-indent: -2.5em;counter-increment: nb2;}
div.gcr-note > ol > li > ol li:before {content:  counter(nb1) "." counter(nb2) "\0000a0 \0000a0"}

/* For Newsletter management */

form#unsubscribe textarea {margin: 10px 25px;width: 90%;}
form#unsubscribe input {font-weight: bold;}

span.unsubscribe {font-weight:bold;}

/* For Create Event form */

form#create-event textarea {margin: 10px 25px;width: 90%;height: 1.5em;}

dl.page-history dt {font-weight: bold;font-size: 0.9em;}
dl.page-history dt:after {content: ":";}
dl.page-history dd {margin-left: 10px;margin-top: -5px;font-size: 0.9em;}


div#hg-footer > iframe {
    width: 100%;
    border: 0;
    margin: 0;
    padding: 0;
    overflow: auto;
}

table#clubs.info-text {border-collapse: collapse;}
table#clubs.info-text th, table#clubs td  {padding: 2px 8px 1px 5px;text-align: right;}
table#clubs.info-text th {border-bottom: 1px solid black;}

table#clubs.info-text tr > td:first-child,
table#clubs.info-text tr > td:first-child + td,
table#clubs.info-text tr > td:first-child + td + td + td {border-right: 1px solid black;}

table#clubs.info-text tr > th:first-child,
table#clubs.info-text tr > th:first-child + th,
table#clubs.info-text tr > th:first-child + th + th + th  {border-right: 1px solid black;}

a.enter-button {font-size: 1.2em; background: yellow; margin: 6px 4px; padding: 0 10px; border: 1px dashed red;}

div#ebu-vp-scale table.info-text td {
    text-align: center;
    width: 50px;
    padding:0;
}

div#ebu-vp-scale table.info-text td:first-child,
div#ebu-vp-scale table.info-text td:first-child + td + td,
div#ebu-vp-scale table.info-text td:first-child + td + td + td + td,
div#ebu-vp-scale table.info-text td:first-child + td + td + td + td + td + td {
    color: red;
    background: yellow;
    border: 1px solid black;
}

table.gridlines
{
    border-collapse: collapse;
    border-color: #600;
    border-width: 0 0 1px 1px;
    border-style: solid;
    margin-left: 30px;
}

table.gridlines > tr > td, table.gridlines > tr > th,
table.gridlines > tbody > tr > td, table.gridlines > tbody > tr > th
{
    border-color: #600;
    border-width: 1px 1px 0 0;
    border-style: solid;
    margin: 0;
    padding: 4px;
}

table.gridlines td {background-color: #ffffcc;}