/* 	Generic style sheet for two image toggle images with Gel style selectors
	Developed by Steven Atherton and Steven Connor
*/

div#toggle_wrapper {
	/*float: right;*/
	position: relative;
	margin-bottom: 10px;
	width: 976px;
	height: 650px;
}

div#toggle_wrapper div#intro-text{
	padding-bottom: 8px;
}

/* This is the container which just the controls */
div#toggle-controls {
	padding: 3px 3px 3px 0;
	/* background-color:#404040; */
	float:left;
	/*display:none;*/
}


/* The menu title*/
div#toggle-title {
	float:left;
	padding: 4px 6px 6px 4px; 
	display:none;
}



/* Position the list items for the menu*/
div#toggle-controls ul li{
	float:left;
	background-image:none;
	margin: 0;
	padding: 0;
	font-size: 0.95em;
}

div#toggle-controls ul li span{
	background-color: #404040;
	border-bottom: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
	color: #ffffff;
	display: block;
	float: left;
	padding: 2px 12px 4px 12px;
	text-align: center;
	font-weight: normal;
	
	/*padding-bottom: 5px;
	padding-top: 3px;*/
}

div#toggle-controls ul li span.selected{
	background-color: #D1700E;
}

div#toggle-controls ul li span.selected a{
	text-decoration: none;
	font-weight: bold;
}
div#toggle-controls ul li span a{
	font-weight: normal;
}

div#toggle-controls ul li span a,
div#toggle-controls ul li span a:visited{
	color: #ffffff;
}

div#toggle-controls ul li span:hover{
	background-color: #000000;
}

div#toggle-controls ul li span.selected a:hover{
	text-decoration: underline;
}

div#toggle-controls ul li span.selected:hover{
	background-color: #D1700E;
	text-decoration: none;
}

/* This is the container which just the images */
div#toggle-divs{
	clear: both;
}

div#display-pane{
	position:absolute;
	top: 55px;
	right:0;
	width: 442px;
	
}
div#display-pane h2{
	font-size: 1.846em;
	font-weight: bold;
	letter-spacing: -1px;
	line-height: 24px;
	margin-bottom: 8px;
    text-rendering: optimizelegibility;
}


div#display-pane div.img{
	height: 224px;
}

div#display-pane div.attributes p span.thickness,
div#display-pane div.attributes p span.diameter,
div#display-pane div.attributes p span.weight,
div#display-pane div.attributes p span.quantity{
	display: block; 
	float: left;
	width: 221px;
	padding: 8px  0 8px 0;
}

div#display-pane div.attributes p span.weight,
div#display-pane div.attributes p span.quantity{
	padding: 0  0 8px 0;
}

div#display-pane div.attributes p span.weight{	
	clear: left;
}

div#display-pane div.attributes p span.mint{	
	clear: left;
	display: block;
	padding: 0;
}

div#display-pane div.attributes p span.thickness span,
div#display-pane div.attributes p span.diameter span,
div#display-pane div.attributes p span.weight span,
div#display-pane div.attributes p span.quantity span,
div#display-pane div.attributes p span.mint span
{
	color: #d1700e;
	font-weight: bold;
}

div#summer-medals-container{
	position: relative;
	float: left;
	width: 534px;
}

div#winter-medals-container{
	position: relative;
	float: left;
	width: 534px;
}

div#summer-medals-container a{
	background: url("/news/special/uk/11/olympic_medals/timeline/img/olympic_summer_medals_525.jpg?cachebuster=cb456987123");}
div#winter-medals-container a{
	background: url("/news/special/uk/11/olympic_medals/timeline/img/olympic_winter_medals_525.jpg?cachebuster=cb456987123");}

div#summer-medals-container a,
div#winter-medals-container a{
	display: block;
	width: 80px;
	height: 80px;
	float: left;
	margin-right: 9px;
	margin-bottom: 32px;
	position: relative;
}
/* summer styles */
div#summer-medals-container a#summer-1896{background-position: 0 0px;}
div#summer-medals-container a#summer-1900{background-position: 437px -1px;}
div#summer-medals-container a#summer-1904{background-position: 348px 0px;}
div#summer-medals-container a#summer-1908{background-position: 259px 0px;}
div#summer-medals-container a#summer-1912{background-position: 170px 0px;}
div#summer-medals-container a#summer-1920{background-position: 81px 0px;}

div#summer-medals-container a#summer-1924{background-position: 0px -112px;}
div#summer-medals-container a#summer-1928{background-position: 437px -112px;}
div#summer-medals-container a#summer-1932{background-position: 348px -112px;}
div#summer-medals-container a#summer-1936{background-position: 259px -112px;}
div#summer-medals-container a#summer-1948{background-position: 170px -112px;}
div#summer-medals-container a#summer-1952{background-position: 81px -112px;}

div#summer-medals-container a#summer-1956{background-position: 0px -224px;}
div#summer-medals-container a#summer-1960{background-position: 437px -224px;}
div#summer-medals-container a#summer-1964{background-position: 348px -224px;}
div#summer-medals-container a#summer-1968{background-position: 259px -224px;}
div#summer-medals-container a#summer-1972{background-position: 170px -224px;}
div#summer-medals-container a#summer-1976{background-position: 81px -224px;}

div#summer-medals-container a#summer-1980{background-position: 0px -336px;}
div#summer-medals-container a#summer-1984{background-position: 437px -336px;}
div#summer-medals-container a#summer-1988{background-position: 348px -336px;}
div#summer-medals-container a#summer-1992{background-position: 259px -336px;}
div#summer-medals-container a#summer-1996{background-position: 170px -336px;}
div#summer-medals-container a#summer-2000{background-position: 81px -336px;}

div#summer-medals-container a#summer-2004{background-position: 0px -448px;}
div#summer-medals-container a#summer-2008{background-position: 437px -448px;}
div#summer-medals-container a#summer-2012{background-position: 348px -448px;}

div#summer-medals-container a#summer-1896.current-selection, div#summer-medals-container a#summer-1896:hover{background-position: 0 -592px;}
div#summer-medals-container a#summer-1900.current-selection, div#summer-medals-container a#summer-1900:hover{background-position: 437px -592px;}
div#summer-medals-container a#summer-1904.current-selection, div#summer-medals-container a#summer-1904:hover{background-position: 348px -592px;}
div#summer-medals-container a#summer-1908.current-selection, div#summer-medals-container a#summer-1908:hover{background-position: 259px -592px;}
div#summer-medals-container a#summer-1912.current-selection, div#summer-medals-container a#summer-1912:hover{background-position: 170px -592px;}
div#summer-medals-container a#summer-1920.current-selection, div#summer-medals-container a#summer-1920:hover{background-position: 81px -592px;}

div#summer-medals-container a#summer-1924.current-selection, div#summer-medals-container a#summer-1924:hover{background-position: 0px -704px;}
div#summer-medals-container a#summer-1928.current-selection, div#summer-medals-container a#summer-1928:hover{background-position: 437px -704px;}
div#summer-medals-container a#summer-1932.current-selection, div#summer-medals-container a#summer-1932:hover{background-position: 348px -704px;}
div#summer-medals-container a#summer-1936.current-selection, div#summer-medals-container a#summer-1936:hover{background-position: 259px -704px;}
div#summer-medals-container a#summer-1948.current-selection, div#summer-medals-container a#summer-1948:hover{background-position: 170px -704px;}
div#summer-medals-container a#summer-1952.current-selection, div#summer-medals-container a#summer-1952:hover{background-position: 81px -704px;}

div#summer-medals-container a#summer-1956.current-selection, div#summer-medals-container a#summer-1956:hover{background-position: 0px -816px;}
div#summer-medals-container a#summer-1960.current-selection, div#summer-medals-container a#summer-1960:hover{background-position: 437px -816px;}
div#summer-medals-container a#summer-1964.current-selection, div#summer-medals-container a#summer-1964:hover{background-position: 348px -816px;}
div#summer-medals-container a#summer-1968.current-selection, div#summer-medals-container a#summer-1968:hover{background-position: 259px -816px;}
div#summer-medals-container a#summer-1972.current-selection, div#summer-medals-container a#summer-1972:hover{background-position: 170px -816px;}
div#summer-medals-container a#summer-1976.current-selection, div#summer-medals-container a#summer-1976:hover{background-position: 81px -816px;}

div#summer-medals-container a#summer-1980.current-selection, div#summer-medals-container a#summer-1980:hover{background-position: 0px -928px;}
div#summer-medals-container a#summer-1984.current-selection, div#summer-medals-container a#summer-1984:hover{background-position: 437px -928px;}
div#summer-medals-container a#summer-1988.current-selection, div#summer-medals-container a#summer-1988:hover{background-position: 348px -928px;}
div#summer-medals-container a#summer-1992.current-selection, div#summer-medals-container a#summer-1992:hover{background-position: 259px -928px;}
div#summer-medals-container a#summer-1996.current-selection, div#summer-medals-container a#summer-1996:hover{background-position: 170px -928px;}
div#summer-medals-container a#summer-2000.current-selection, div#summer-medals-container a#summer-2000:hover{background-position: 81px -928px;}

div#summer-medals-container a#summer-2004.current-selection, div#summer-medals-container a#summer-2004:hover{background-position: 0px -1040px;}
div#summer-medals-container a#summer-2008.current-selection, div#summer-medals-container a#summer-2008:hover{background-position: 437px -1040px;}
div#summer-medals-container a#summer-2012.current-selection, div#summer-medals-container a#summer-2012:hover{background-position: 348px -1040px;}


/* winter styles */
div#winter-medals-container a#winter-1924{background-position: 0 0px;}
div#winter-medals-container a#winter-1928{background-position: 437px -1px;}
div#winter-medals-container a#winter-1932{background-position: 348px 0px;}
div#winter-medals-container a#winter-1936{background-position: 259px 0px;}
div#winter-medals-container a#winter-1948{background-position: 170px 0px;}
div#winter-medals-container a#winter-1952{background-position: 81px 0px;}

div#winter-medals-container a#winter-1956{background-position: 0px -112px;}
div#winter-medals-container a#winter-1960{background-position: 437px -112px;}
div#winter-medals-container a#winter-1964{background-position: 348px -112px;}
div#winter-medals-container a#winter-1968{background-position: 259px -112px;}
div#winter-medals-container a#winter-1972{background-position: 170px -112px;}
div#winter-medals-container a#winter-1976{background-position: 81px -112px;}

div#winter-medals-container a#winter-1980{background-position: 0px -224px;}
div#winter-medals-container a#winter-1984{background-position: 437px -224px;}
div#winter-medals-container a#winter-1988{background-position: 348px -224px;}
div#winter-medals-container a#winter-1992{background-position: 259px -224px;}
div#winter-medals-container a#winter-1994{background-position: 170px -224px;}
div#winter-medals-container a#winter-1998{background-position: 81px -224px;}

div#winter-medals-container a#winter-2002{background-position: 0px -336px;}
div#winter-medals-container a#winter-2006{background-position: 437px -336px;}
div#winter-medals-container a#winter-2010{background-position: 348px -336px;}


div#winter-medals-container a#winter-1924.current-selection,div#winter-medals-container a#winter-1924:hover{background-position: 0 -480px;}
div#winter-medals-container a#winter-1928.current-selection,div#winter-medals-container a#winter-1928:hover{background-position: 437px -481px;}
div#winter-medals-container a#winter-1932.current-selection,div#winter-medals-container a#winter-1932:hover{background-position: 348px -480px;}
div#winter-medals-container a#winter-1936.current-selection,div#winter-medals-container a#winter-1936:hover{background-position: 259px -480px;}
div#winter-medals-container a#winter-1948.current-selection,div#winter-medals-container a#winter-1948:hover{background-position: 170px -480px;}
div#winter-medals-container a#winter-1952.current-selection,div#winter-medals-container a#winter-1952:hover{background-position: 81px -480px;}

div#winter-medals-container a#winter-1956.current-selection,div#winter-medals-container a#winter-1956:hover{background-position: 0px -592px;}
div#winter-medals-container a#winter-1960.current-selection,div#winter-medals-container a#winter-1960:hover{background-position: 437px -592px;}
div#winter-medals-container a#winter-1964.current-selection,div#winter-medals-container a#winter-1964:hover{background-position: 348px -592px;}
div#winter-medals-container a#winter-1968.current-selection,div#winter-medals-container a#winter-1968:hover{background-position: 259px -592px;}
div#winter-medals-container a#winter-1972.current-selection,div#winter-medals-container a#winter-1972:hover{background-position: 170px -592px;}
div#winter-medals-container a#winter-1976.current-selection,div#winter-medals-container a#winter-1976:hover{background-position: 81px -592px;}

div#winter-medals-container a#winter-1980.current-selection,div#winter-medals-container a#winter-1980:hover{background-position: 0px -704px;}
div#winter-medals-container a#winter-1984.current-selection,div#winter-medals-container a#winter-1984:hover{background-position: 437px -704px;}
div#winter-medals-container a#winter-1988.current-selection,div#winter-medals-container a#winter-1988:hover{background-position: 348px -704px;}
div#winter-medals-container a#winter-1992.current-selection,div#winter-medals-container a#winter-1992:hover{background-position: 259px -704px;}
div#winter-medals-container a#winter-1994.current-selection,div#winter-medals-container a#winter-1994:hover{background-position: 170px -704px;}
div#winter-medals-container a#winter-1998.current-selection,div#winter-medals-container a#winter-1998:hover{background-position: 81px -704px;}

div#winter-medals-container a#winter-2002.current-selection,div#winter-medals-container a#winter-2002:hover{background-position: 0px -816px;}
div#winter-medals-container a#winter-2006.current-selection,div#winter-medals-container a#winter-2006:hover{background-position: 437px -816px;}
div#winter-medals-container a#winter-2010.current-selection,div#winter-medals-container a#winter-2010:hover{background-position: 348px -816px;}

div#toggle-divs a div.area span.year-label{
	position: absolute;
	top: 82px;
	left: 0px;
}

div#toggle-divs a#summer-1896 div.area{background-position: 10px 10px;}
div#toggle-divs a#summer-1900 div.area{background-position: 10px 10px;}

div#toggle_wrapper div.medals-key{
	clear:both; height: 30px;
	padding: 6px 0px 0px 40px;
}

#toggle_wrapper #summer-medals-container .medals-key{
	background: url("/news/special/uk/11/olympic_medals/timeline/img/olympic_summer_medals_525.jpg?cachebuster=cb456987123") no-repeat;
	background-position: 5px -551px;
}

#toggle_wrapper #winter-medals-container .medals-key{
	background: url("/news/special/uk/11/olympic_medals/timeline/img/olympic_winter_medals_525.jpg?cachebuster=cb456987123") no-repeat;
	background-position: 5px -442px;
}
	
div#toggle_wrapper div#medals-key span.label{position: absolute; top:0; right: -1020px;}


/* added by SJC */
#toggle_wrapper a.hotspot-link:focus,
#toggle_wrapper a.hotspot-link:hover{
	text-decoration: none;
}

#toggle_wrapper a.hotspot-link:active div.area span.year-label{
	color: #d1700e;
}

div#toggle-divs a div.area span.year-label{
	font-weight: normal;
}

div#toggle-divs a:hover div.area span.year-label{
	font-weight: bold;
}

div#toggle-divs a.current-selection div.area span.year-label{
	font-weight: bold;
	color: #d1700e;
}

.ie7 div#toggle-divs a div.area span.year-label,
.ie div#toggle-divs a div.area span.year-label {
	cursor: pointer;
}

.ie7 div#toggle_wrapper div.medals-key,
.ie div#toggle_wrapper div.medals-key{
	position: relative;
	top: 32px;
	left: 0;
}

.ie7 #toggle_wrapper,
.ie #toggle_wrapper{
	margin-bottom: 38px;
}