/*---------------------------------------------------------------------------

Copyright ©2011-2013 by Andrew Casson. All rights reserved. 

THIS CSS STYLESHEET IS NOT IN THE PUBLIC DOMAIN.

More information: http://www.cantigasdesantamaria.com/sourcecopy.html

Thank you for your understanding and cooperation.

---------------------------------------------------------------------------*/


/*-- Generalities ---------------------------------------------------*/

body {
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	font-size: 15px;
	margin: 0px;
	background: #2a3143 url(/img/diaper.png);	
}

body, a {
	color: #000044;
}

a:visited {
	color: #555577;
}

table {
	border-collapse: collapse;
}

h1, h2, h3 {
	color: #555577;
}

h1 {
	font-size: 18px;
}

h2 {
	font-size: 16px;
}

h3 {
	font-size: 14px;
}


* html a:hover { background: transparent; }


/*------------------------------------------------------------------*/

.tbar {
	background: #770000;
	font-family: 'Open Sans', Arial, sans-serif;
	font-weight: bold;
	font-size: 11px;
	color: white;
	text-align: center;
	padding: 4px;
	margin: 0px;
}

/*-- Standard inline formatting ------------------------------------*/

span.ipa {
	font-family: Arial, sans-serif;		/* do not use Open Sans here */
	color: #004488;
}

span.bul {
	font-weight: normal;
	font-size: smaller;
	color: #880000;
}

span.refrain {
	font-style: italic;
}

span.reprise {
	font-style: italic;
	font-size: 80%;
}

span.tsyl {
	font-style: italic;
}

span.refrain span.tsyl {
	font-style: normal;
}

span.ssyl {
	border-bottom: dotted 1px #880000;
}

span.syne {
	border-bottom: solid 2px #880000;		/* synaeresis and synalepha look the same */
}

span.syna {
	border-bottom: solid 2px #880000;		/* synaeresis and synalepha look the same */
}

span.diar {
	color: #880000;
}

span.brek {
	border-bottom: double 3px #880000;
}

span.fail {
	font-weight: bold;
	color: #cc0000;
}

span.tfix {
	background: #ffee88;
}

span.tmod {
	color: #880000;
}

span.qmod {
	/* nothing... it's a quiet mod */
}

span.hi01 {
	background: #88ff88;		/* generic re-purposable text highlight */
}

span.hi02 {
	background: #ff8888;		/* generic re-purposable text highlight */
}

span.hi03 {
	background: #8888ff;		/* generic re-purposable text highlight */
}

span.meli {
	vertical-align: super;
	font-size: 80%;
	color: #880000;
}

span.prhp {
	color: #880000;
	font-style: italic;
}

span.bar {
	font-style: normal;	
	padding-left: 4px;
	padding-right: 4px;
}

span.delbox {
	font-family: sans-serif;
	font-style: normal;	
	font-weight: normal;
}

span.footnoteref {
	font-family: sans-serif;
	font-weight: normal;
	font-style: normal;	
	padding-left: 4px;
	color: #880000;
}

span.qtext {
	font-family: 'Times New Roman', serif;
	color: #000044;
}

span.qftext {
	font-family: 'Times New Roman', serif;
	font-style: italic;
}


/*-- Standard links ------------------------------------------------*/

a.ipref {
	color: #555577;
	text-decoration: underline;
}

a.ipref:hover {
	color: #000044;
	text-decoration: underline;
}

a.msref {
	color: #555577;
	text-decoration: none;
}

a.facsref {
	color: #555577;
	text-decoration: none;
}

a.msref:hover {
	color: #000044;
	text-decoration: underline;
}

a.facsref:hover {
	color: #000044;
	text-decoration: underline;
}

a.xpref {
	color: #555577;
	text-decoration: none;
}

a.xpref:hover {
	color: #000044;
	text-decoration: underline;
}

a.cxref {
	color: #555577;
	text-decoration: underline;
}

a.cxref:hover {
	color: #000044;
	text-decoration: underline;
}


/*-- Dashboard ------------------------------------------------------*/

div.dashboard {
	position: fixed;
	width: 100%;
	left: 0px;
	top: 0px;
	padding: 0px;
	z-index: 990;
}

div.dashcontents {
	margin: auto;
	width: 95%;
	min-width: 980px;
	border-left: solid 1px #550000;	
	border-right: solid 1px #550000;	
	border-bottom: solid 1px #550000;
	color: white;
	font-size: 13px;
	font-weight: bold;
	
	background: #770000;
}


div.dashlayout {
	width: 100%;
	display: table;
	border-collapse: collapse;
}

div.dashlayoutrow {
	display: table-row;
}

div.dashpanel {
	display: table-cell;
	vertical-align: middle;
	margin: 0px;
	padding: 0px;
}


div#dashmain {								/* class .dashcontents */
	border-bottom: solid 1px #660000;
	color: white;
	font-size: 11px;
	font-weight: bold;	
	background: #770000;
	background: linear-gradient(to bottom, #aa0000 0%, #770000 100%);
}

div#dashlefthome {
	width: 50px;
	text-align: left;
	vertical-align: middle;
	padding: 6px 0px 6px 6px;
}

a#dashlefthomebutton {
	display: inline-block;
	vertical-align: middle;
	width: 40px;
	height: 40px;
	background: url(/img/homeleft.png) no-repeat 0 0;
}

a#dashlefthomebutton:hover {
	background-position: -40px 0;
}

a#dashlefthomebutton span {
	position: absolute;
	top: -999em;
}


div#dashrighthome {
	width: 50px;
	vertical-align: middle;
	text-align: right;
	padding: 6px 6px 6px 0px;
}

a#dashrighthomebutton {
	display: inline-block;
	vertical-align: middle;
	width: 40px;
	height: 40px;
	background: url(/img/home.png) no-repeat 0 0;
}

a#dashrighthomebutton:hover {
	background-position: -40px 0;
}

a#dashrighthomebutton span {
	position: absolute;
	top: -999em;
}


div#dashgo {
	width: 13%;
	text-align: left;
	padding-left: 0px;
	vertical-align: middle;
}

div#dashgo span.jump {
	vertical-align: middle;
}

div#dashgo span.jump span.csm {
	font-size: 9px;
}

input#csmnum {
	display: inline-block;
	overflow: visible;			/* IE7 bodge */
	margin-left: 0px;
	margin-right: 0px;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	font-size: 9px;
	width: 2.5em;
	font-style: italic;
	color: #aaaaaa;	
}


div#dashmenu {
	/*width: 60%;*/
	text-align: center;
	border-left: solid 1px #660000;
	border-right: solid 1px #660000;
}

div#dashsession {
	width: 13%;
	text-align: right;
	padding-right: 0px;
}

div#dashsession form {
	display: inline-block;
	overflow: visible;
	line-height: 1;
}

div#dashsession span.username {
	font-size: 9px;
	display: inline-block;
	margin-bottom: 6px;
}

div#dashsession span.username a {
	color: white;
	text-decoration: none;
}

div#dashsession span.username a:hover {
	text-decoration: underline;
}

/*--------*/

span.dashnobutton {
	display: block;
	width: 28px;
	height: 28px;
}

span.dashnobutton span {
	font-size: 13px;
	position: absolute;
	top: -999em;
}

a.dashbutton {
	display: block;
	width: 28px;
	height: 28px;
}

a.dashbutton span {
	font-size: 13px;
	position: absolute;
	top: -999em;
}
		
button.dashbutton {
	margin: 0px;
	padding: 0px;
	border: none;
	display: block;
	width: 28px;
	height: 28px;
}

button.dashbutton span {
	font-size: 13px;
	position: absolute;
	top: -999em;
}

div.dashprevnext {
	background: pink;
	width: 28px;
	text-align: center;
	border-right: solid 1px #550000;
}

span.dashnoprevlink {
	background: url(/img/noprev.png) no-repeat 0 0;
}

span.dashnonextlink {
	background: url(/img/nonext.png) no-repeat 0 0;
}

a.dashprevlink {
	background: url(/img/prev.png) no-repeat 0 0;
}

a.dashprevlink:hover {
	background-position: -28px 0;
}

a.dashnextlink {
	background: url(/img/next.png) no-repeat 0 0;
}

a.dashnextlink:hover {
	background-position: -28px 0;
}

div.dashheading {
	padding-left: 8px;
}

div.dashnoprevnextheading {
	padding-left: 8px;
}

div.dashnoprefsheading {
	padding-left: 8px;
	height: 28px;
}

div.dashheadingonly {
	padding-left: 8px;
	height: 28px;
}

h1.dash {
	font-size: 13px;
	font-weight: bold;
	color: white;
	margin: 0px;
	padding: 0px;
}	

div.dashspelling {
	font-size: 9px;
	text-align: right;
	padding-right: 8px;
	width: 28%;
}

div.dashprefs {
	width: 28px;
	text-align: center;
	border-left: solid 1px #550000;
}

div.dasherrata {
	width: 8em;
	text-align: center;
	border-left: solid 1px #550000;
	background: #f00;
	font-size: 9px;
	font-weight: bold;
	cursor: default;
}

div.dasherrata:hover {
	background: #f22;
}


div.dasherratatotal {
	width: 8em;
	text-align: center;
	border-left: solid 1px #550000;
	background: #f00;
	font-size: 9px;
	font-weight: bold;
	cursor: default;
}

div.dasherratatotal:hover {
	background: #f22;
}


button.dashprefslink {
	background: url(/img/cog.png) no-repeat 0 0;
}

button.dashprefslink:hover {
	background-position: -28px 0;
}

/*--------*/

table.dashmenu {
	border-collapse: collapse;
	margin: auto;
}

table.dashmenu td {
	margin: 0px;
	padding: 0px 12px 0px 12px;
	border: none;
}

table.dashmenu td a {
	color: white;
	text-decoration: none;
}

table.dashmenu td a:hover {
	text-decoration: underline;
}

table.dashmenu td div.menu {
	padding: 12px 0px 12px 0px;		/* WARNING: this vertical padding is crucial: the top of the menu must pop up inside it */
	position: relative;
	cursor: default;
}

table.dashmenu td div.menu div.popup {
	display: none;
	background: white;
	border: solid 1px #550000;
	position: absolute;
	font-weight: normal;
	width: 20em;
	color: #555577;
	text-align: left;
	padding: 4px 0px 4px 0px;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
}

table.dashmenu td div.menu:hover div.popup {
	display: block;
	z-index: 999;
	left: 0px;
	top: 0px;
	margin-top: 32px;
}

table.dashmenu td div.menu div.popup div.subitem {
	padding: 4px 8px 4px 8px;
}

table.dashmenu td div.menu div.popup div.subsep {
	margin-top: 4px;
	padding-top: 8px;
	border-top: solid 1px #cccccc;
}

table.dashmenu td div.menu div.popup div.subitem a {
	color: #555577;
}

table.dashmenu td div.menu div.item a.popupanchor:hover {
	text-decoration: none;
	cursor: default;
}


/*-- High-level divisions of the scrolling page ---------------------*/

div.all {
	background: white;
	margin: auto;
	width: 95%;
	min-width: 980px;	
	padding-top: 82px;					/* WARNING: keep this value 10px less than .offsetanchor span.offset { top: ... } defined below */
	padding-bottom: 0px;
	border-left: solid 1px #550000;
	border-right: solid 1px #550000;
}

.offsetanchor {
	position: relative;
}

.offsetanchor span.offset {
	position: absolute;
	top: -92px;						/* WARNING: keep this value 10px more than div.all { padding-top: ... } defined above */
}

div#jswarning {
	margin: 0px;
	padding: 6px 0px 6px 0px;	
	background: #004488;
	color: white;
	font-size: 11px;
	font-weight: bold;
	text-align: center;
	border-bottom: solid 1px black;
}

div#compatwarning {
	margin: 0px;
	padding: 6px 0px 6px 0px;	
	background: #004488;
	color: white;
	font-size: 11px;
	font-weight: bold;
	text-align: center;
	border-bottom: solid 1px black;
}

div.main {
	margin: 8px 16px 16px 16px;
}

.cf:before, .cf:after { content: " "; display: table; }
.cf:after { clear: both; }
.cf { *zoom: 1; }


div.footer {
	clear: both;
	font-weight: bold;
	font-size: 11px;
	color: white;
	margin: 24px 0px 0px 0px;
	border-top: solid 1px #660000;	
	background: #770000;
	background: linear-gradient(to bottom, #770000 0%, #990000 100%);
}

div.footerlayout {
	width: 100%;
	display: table;
}

div.footerrow {
	display: table-row;
}

div.footerpanel {
	display: table-cell;
	vertical-align: middle;
}

div#footercopyright {
	width: 70%;
	text-align: left;
	padding: 6px 8px 8px 8px;
	vertical-align: middle;
}

div#footercopyright span.db {
	font-size: 9px;
	margin-left: 16px;
}

div#footercopyright a.termsofuse {
	margin-left: 16px;
	color: white;
	text-decoration: underline;
}

div#footercontact {
	width: 30%;
	text-align: right;
	padding: 6px 8px 8px 8px;
}

div#footercontact a {
	vertical-align: middle;
	color: white;
	text-decoration: none;
}

div#footercontact a img.logo {
	margin-left: 8px;
	vertical-align: middle;
	border: none;
}

div#footercontact a:hover {
	text-decoration: underline;
}

div#footerdisclaimer {
	padding: 0px 8px 8px 8px;
	font-size: 9px;
	text-align: justify;
	font-weight: normal;
}


/*-------------------------------------------------------------------*/

div.prose {
	width: 90%;
	font-size: 13px;
	color: #555577;
}

div.prose img.buttonref {
	border: solid 1px black;
}

div.prose a {
	color: #555577;
}

div.prose a:hover {
	color: #000044;
}

div.prose ul.xlinks li, div.prose ul.ipanotes li {
	margin-bottom: 6px;
}

div.prose a.xlink {
	text-decoration: underline;
	font-weight: bold;
}

div.prose table.references td {
	vertical-align: top;
	padding-bottom: 6px;
}

div.prose table.references td.tag {
	padding-right: 16px;
}

div.prose table.references td.tag.ref {
	width: 7em;
}

/*-------------------------------------------------------------------*/

span.fntooltip {
	color: #880000;
	outline: none;
	text-decoration: none;
	position: relative;
	font-size: 11px;
}

span.fntooltip span.popup {
	display: block;
	position: absolute;
	z-index: 999;
	margin-left: -999em;
	font-size: 11px;
	font-weight: normal;
	color: #555577;
	width:30em;
	border: solid 1px #550000;
	background: white;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); 
	-webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); 
	-moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);		
}

span.fntooltip:hover span.popup {
	top: 0em;
	left: 0em;
	margin-left: 0em;
}

span.fntooltip:hover span.popup span.title {
	display: block;
	font-size: 11px;
	font-weight: bold;
	color: white;
	background: #770000;
	padding: 4px;
	text-align: center;
}

span.fntooltip:hover span.popup span.text {
	display: block;
	padding: 4px;
}

span.fntooltip:hover span.popup span.text b {
	display: inline;
}

span.fntooltip span.popup span.fnquote a.fnccref {	
	color: #000044;
	text-decoration: underline;
}


/*-- Push buttons ---------------------------------------------------*/

#loginform button, button.b1, button.b2, button.b3, button.b4, input.b1 {
	display: inline-block;
	overflow: visible;			/* IE7 bodge */
	text-align: center;
	vertical-align: middle;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	margin: 0px;
}


#loginform button, button.b1, button.b2, button.b3, input.b1 {
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-khtml-border-radius: 6px;
	padding: 0px 5px 0px 5px;
}

button::-moz-focus-inner {
	padding: 0px;
	border: none;
}

#loginform button, button.b1, button.b2, input.b1 {
	font-size: 11px;
	line-height: 16px;
}

button.b3 {
	font-size: 9px;
	line-height: 14px;
}

button.b4 {
	width: 14px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	-khtml-border-radius: 6px;
	font-size: 11px;
	line-height: 11px;
	font-weight: bold;
	padding: 0px 4px 0px 4px;
	vertical-align: middle;
}


#loginform button, button.b1, input.b1 {					/* b1: dark red when not hovering */
	border: solid 1px #660000;
	background: #aa3333;
	color: white;
}

button.b2, button.b3, button.b4 {					/* b2 and b3: light grey and white when not hovering */
	border: solid 1px #cccccc;
	background: white;
	color: #999999;
}

#loginform button:hover, button.b1:hover, button.b2:hover, button.b3:hover, button.b4:hover {		/* all buttons look the same when hovering */
	border: solid 1px #660000;
	background: #bb4444;
	color: white;
}

/*-------------------------------------------------------------------*/

div#gtitle {
	margin: 0px;
	height: 50px;
}

div.gtitlecanvas {	
	color: white;				/* fallback: white */
	color: rgba(0,0,0,0);		/* better: "fully transparent black" */
}

div.gtitlenocanvas {
	color: #555577;
	font-size: 28px;
	font-family: 'Times New Roman', serif;
	font-weight: normal;
}

/*-------------------------------------------------------------------*/

a.external {
    background: url(/img/external.png) center right no-repeat;
    padding-right: 13px;
}

/*-------------------------------------------------------------------*/

span.screendisclaimer {
	display: inline;
}

span.printdisclaimer {
	display: none;
}

img.illustration {
	max-width: 100%;
}