/* ---------- ../../../common/styles/wide/pixies.css starts here ---------- */
div#highlights 
{
	width: 140px;
	float: left;
	margin-right: 20px;
}

body.network div#highlights
{
	margin-right: 0;
}

div#highlights, 
body.gu-america div#highlights,
body.observer div#highlights
{
	margin-right: 20px;
}

li.pixie
{
	overflow: hidden;
	position: relative
}

li.pixie,
li.mugshot
{
	margin-bottom: 7px;
}

li.open-pix
{
	margin-bottom: 10px;
}

li.pixie a,
li.pixie div,
li.pixie a:hover
{
	display: block;
	position: relative;
	text-decoration: none;
}

#wrapper #content li.pixie h3,
#wrapper #section-contents li.pixie h3,
#wrapper #section-contents li.mugshot h3,
#wrapper #section-contents li.mugshot p.strap,
#wrapper #section-contents li.pixie p.strap,
#wrapper #box #highlights li.pixie h3,
#wrapper #box #highlights li.pixie p.strap,
#wrapper #box #highlights li.mugshot h3,
#wrapper #box #highlights li.mugshot p.strap,
#wrapper div li.pixie h3,
#wrapper div li.pixie p.strap,
#wrapper div li.mugshot h3,
#wrapper div li.mugshot p.strap,
#wrapper #main-trailblock li.pixie p.strap,
#wrapper #third-trailblocks li.pixie p.strap,
#wrapper #second-trailblock li.pixie p.strap,
div#wrapper div#promo li.mugshot h3
{
	font-size: 1.333em;
	font-family: georgia, serif;
	font-weight: normal;
}

li.pixie div.caption,
li.open-pix div.caption,
li.mugshot div.caption,
#content li.pixie h3,
#wrapper div#promo .col li.pixie h3
{
	font-family: georgia, serif;
	font-weight: normal;
	line-height: 1.125;
}

li.pixie div.trail-text a
{
	padding-left: 4px;
	padding-right: 4px;
}

.highlight li a img
{
	position: absolute;
	top: 3.33333333em;
	left: 0;
	z-index: -1;
}

li.pixie div.caption,
li.pixie div.trail-text
{
	position: relative;
	top: 0;
	left: 0;
	z-index: 15;
	text-decoration: none;
}

li.pixie div.caption
{
	height: 4em;	
}

li.pixie div.caption,
li.mugshot div.caption
{
	padding-top: 2px;
	padding-left: 5px;
	padding-right: 5px;
}

#box li.pixie div.caption h3,
#box li.mugshot div.caption h3
{
	padding-top: 0;
}

#promo .col li.pixie div.caption h3,
div#promo li.mugshot div.caption,
div#wrapper div#promo li.mugshot h3
{
	margin-bottom: 0;
}

#wrapper ul#editor-zone-1 li.pixie div.trail-text,
#wrapper li.pixie div.trail-text
{
	display: none;
	margin-top: 1em;
	position: absolute;
	overflow: hidden;
	text-align: left;
	padding-top: 3.4em;
	padding-bottom: 0;
	z-index: 10;
	height: 4.25em;
	width: 100%;
}

#wrapper li.mugshot,
div#wrapper ul.pixie li,
#wrapper #content #main-trailblock li.pixie h3,
#wrapper #content #second-trailblock li.pixie h3
{
	border: none;
}

#wrapper #content #second-trailblock ul li.pixie
{
	margin-top: 0;
}

/* Mugshot version */

li.mugshot p,
li.mugshot div.trail-text
{
	font-family: georgia, serif;
}

li.mugshot div.trail-text 
{
	padding: 0 5px 5px 5px;
}

li.mugshot div.trail-text strong,
li.mugshot div.trail-text b
{
	padding-top: 0;
	font-family: arial,sans-serif;
	font-weight: normal;
	padding-bottom: 5px;
}

li.mugshot div.caption
{
	padding-bottom: 3px;
}

li.mugshot div.caption
{
	min-height: 3.420em;
}

/* Open pixie - same as mugshot but text and image are reversed */

#highlights ul.pixie li.open-pix div.trail-text a,
li.open-pix div.caption p.open-strap,
#content li.open-pix div.caption a
{
	font-size: 1.333em;
	font-family: georgia, serif;
	line-height: 1.125;
}

#highlights li.open-pix div.caption
{
	padding: 2px 5px 0 5px;
}

ul.pixie li.open-pix
{
	height: 19em;
	background: #e2e2e2;
	overflow: hidden;
	padding-bottom: 4px;
}

li.open-pix div.trail-text 
{
	height: 67px;
	padding: 0 5px 5px 5px;
}

li.open-pix a img
{
	vertical-align: bottom;
}

ul.pixie li.mugshot div.caption
{
	height: auto;
}
          /* ----------  ../../../common/styles/wide/pixies.css ends here ----------- */
          /* ---------- katine-other-additionals.css starts here ---------- */
div#article-header div#katine-partners
{
	position: absolute;
	top: 14px;
	right: 0;
	z-index: 1000;
}

div#katine-partners img#katine-partnership
{
	display: block;
	margin-bottom: 10px;
}

div#article-header div#katine-partners a img
{
	float: left;
}

div#wrapper div#promo div.ed-zone
{
	background-color: white;
	border: none;
	float: left;
	padding: 0;
	width: 140px;
}

div#promo div.ed-zone li
{
	border-top-color: #999;
	border-top-style: dotted;
	border-top-width: 1px;
	margin-left: 0;
	margin-right: 0;
	padding-top: 3px;
	width: 140px;
}

div#wrapper div#promo div.ed-zone ul.tri li.image
{
	margin-left: 0;
	border-top: none;
	padding-top: 0;
}

div#promo div.capsule li.major-heading
{
	border-top-style: solid;
	border-top-width: 10px;
}

div#promo div.capsule li.major-heading h2
{
	border-top: none;
	font-size: 1.166em;
	padding-top: 0;
	padding-bottom: 13px;
}

div#promo div.capsule li div
{
	margin-bottom: 5px;
}

body.article div#promo,
body.audio div#promo,
body.competition div#promo,
body.quiz div#promo
{
	background-image: url(images/katine-promo-bg.gif);
	background-position: 5px 0;
	background-repeat: repeat-y;
}

div#wrapper div#promo li.pixie h3
{
	font-weight: normal;
	font-size: 1.3em;
	margin-bottom: 0;
}

div#promo li.pixie p.strap
{
	font-size: 1.3em;
}

div#promo li.pixie div.caption
{
	height: 4em;
	margin-bottom: 0;
}

body.interactive div#article-header div#katine-partners
{
	top: 0;
}
          /* ----------  katine-other-additionals.css ends here ----------- */
          /* ---------- accent.css starts here ---------- */


@media all{

/*front heading link colour set */

body.front #content .first ul#main-trailblock li.wide h3 a,
body.front #content #main-zone .first li.wide h3 a
{
    color: #005ca3; /* $frontLink */
    background-color: white; /* $frontLinkReverse */
}

body.front #content .first ul#main-trailblock li.wide h3 a:focus,
body.front #content .first ul#main-trailblock li.wide h3 a:active,
#badge a,
#badge
{
    color:  white;/* $frontLink */
    background-color: #005ca3; /* $frontLinkReverse */
}

}
          /* ----------  accent.css ends here ----------- */

@media screen
{
ul.pixie div.caption
{
	background-color: #a5a5a5;
	height: 3em
}

ul.trail h3
{
	font-family: georgia, serif;
}

div#wrapper div#header
{
	border-bottom-color: #f47200
}

#nav ul,
div#footer,
body.article #wrapper div#footer #footer-links
{
	border-top-color: #e85e11;
}

#nav ul li
{
	border-color: white;
}
	
#katine-promo h2,
body.article #box,
#wrapper div#box div#content ul li h2,
#wrapper div#box div#related ul li h2,
body.other div#box div#content h2,
body.other div#box div#content h3,
body.other div#box div#related h2,
body.other div#box div#related h3,
body.front div#box div#content h2,
div#wrapper div#box div#content div#main-trailblock div.first div.capsule ul#editor-zone-1 li.major-heading h2,
body.other div#wrapper div#box div#content h2.first,
body.other div#wrapper div#box div#related h2,
div#page-header,
body#katine-front div#section-contents div.capsule li.major-heading h2,
body#katine-front div#footer ul#footer-links,
div#promo div.capsule li.major-heading
{
	border-top-color: #f47200
}

#nav ul li a
{
	background-color: #f29f11;
	color: white;
	display: block;
	padding: 2px 2px 11px 2px;
}



body.front #wrapper #content #main-zone .first li.wide div.trailtext
{
	font-family: georgia, serif;
}

body.front #wrapper #content #main-zone .first li.wide h3 a
{
	color: #005ca3;
	font-weight: bold;
}

body.front #wrapper #content #main-zone .first li.wide h3 a:active,
body.front #wrapper #content #main-zone .first li.wide h3 a:focus
{
	background-color: #005ca3;
	color: white;
}

li.mugshot div.trail-text
{
	background-color: #ccc;
}


li.mugshot h3 a,
li.mugshot div.trail-text a,
li.mugshot div.trail-text strong,
li.mugshot div.trail-text b
{
	color: #333;
}

body.katine-front ul#pixie-block li.pixie .caption
{
    background-color: #a5a5a5;
}

li.mugshot p a 
{
	color: #005689;
}

li.mugshot div.trail-text strong a,
li.mugshot div.trail-text 
{
	color: #333;
}


li.mugshot div.caption
{
	background-color: #e2e2e2;
}

#wrapper div#section-contents li.mugshot p.strap a,
#wrapper div#highlights li.mugshot p.strap a
{
	color: #000;
}

li.mugshot div.trail-text
{
	background-color: #e2e2e2;
}

li.pixie.wide div.caption
{
	background-color: #a5a5a5;
}

li.pixie h3 a 
{
	color: #000;
}


#badge,
#badge a
{
	background-color: transparent;
	color: #333
}
}