@import url(blankcanvas.css);
@import url(base-typography.css);
@import url(base-datasets.css);
@import url(assets.css);
@import url(sifr.css);
@import url(lightview.css);

@media screen {

	body { background: #110315 url(/release/images/layout/gateway-bg.gif) no-repeat; position:relative; width:100%; height:100%; }
	div#content { width: 960px; margin: 0 auto 0 auto; overflow: hidden; }

/** =siteheader */
	
	div#siteheader { width: 960px; margin: -30px auto 0 auto; overflow: hidden; position: relative; top: 30px; }
	div#siteheader p#branding { float: left; }
	div#siteheader p#branding a { width: 159px; height: 147px; color: #FFFFFF; padding-left:2px;}
	div#siteheader p#branding a span { background: url(/release/images/branding/branding.png) no-repeat left top; height:147px; }
	
	div#siteheader ul#pagecontrols { margin: 5px 0 15px 0; float: right; display: inline; }
	div#siteheader ul#pagecontrols li { float: left; }
	div#siteheader ul#pagecontrols li a { 
		text-decoration: none; color: #FFFFFF; font-size: 0.75em; 
		padding-right: 10px; padding-left: 25px; 
		display: block; line-height: 1.8em; 
	}
	
	div#siteheader ul#pagecontrols li a:hover,
	div#siteheader ul#pagecontrols li a:focus,
	div#siteheader ul#pagecontrols li a:active
	{ text-decoration: underline; }
	
	div#siteheader ul#pagecontrols li a#gethelpnow { background: url(/release/images/icons/helpnow.gif) no-repeat 0 50%; }
	div#siteheader ul#pagecontrols li a#exitpage { background: url(/release/images/icons/exitpage.gif) no-repeat 0 50%; }
	div#siteheader ul#pagecontrols li a#parentalcontrol { background: url(/release/images/icons/parentalcontrol.gif) no-repeat 0 50%; padding-right: 0; }
	
	div#siteheader form#search { float: right; clear: right; display: inline; width:170px; }
	
	div#siteheader form#search label.text input { 
		font-size: 0.75em; 
		float: left; 				
		padding: 2px 0 0 2px; 		
		height: 18px;
		display: inline; 	
		margin:0;
		width:144px;;
	}
	
	div#siteheader form#search input {
		float:left;
	}

/**= primarynavigation */	

	div#content ul#primarynavigation { width: 160px; float: left; margin: 40px 0 10px 0; font-family: Arial, Sans-Serif; }
	div#content ul#primarynavigation li { font-size: 0.75em; width: 100%; }
	div#content ul#primarynavigation li li { font-size: 1em; position: relative; }
	
	div#content ul#primarynavigation li a,
	div#content ul#primarynavigation li span { 
		cursor:pointer;
		color: #ffffff; text-decoration: none; width: 150px; display: block;
		background: url(/release/images/layout/menuitemnormal.png); 
		line-height: 23px; margin-bottom: 2px; padding-left: 10px; 
		font-weight: bold; position: relative; z-index: 110;
	}
	
	div#content ul#primarynavigation li.active a,
	div#content ul#primarynavigation li.active span.current,
	div#content ul#primarynavigation li a:hover,
	div#content ul#primarynavigation li a:focus,
	div#content ul#primarynavigation li a:active
	{ background: url(/release/images/layout/menuitemcurrent.png); }
	
	div#content ul#primarynavigation li li a {
		width: auto; color: #333333; background: transparent;
		line-height: 1.2em; padding-bottom: 0.5em; font-weight: normal;
	}
	
	div#content ul#primarynavigation li.active li a { color: #333333; background: transparent; }
	div#content ul#primarynavigation li li a:hover,
	div#content ul#primarynavigation li li a:focus,
	div#content ul#primarynavigation li li a:active
	{ color: #794ca6; background: transparent; }

	div#content ul#primarynavigation ul li span { 
		background: url(/release/images/icons/menuarrow.png) no-repeat;
		background-position: 0px 3px; color: #794ca6; line-height: 1.2em;
		font-weight: normal; width: auto; padding-bottom: 0.5em; cursor: pointer;
		height: auto !important; height: 1.2em;
	}
	
	ul#primarynavigation li ul#secondary-navigation { background-color: #f6f6f6; position: relative; margin-top: -5px; z-index: 100; padding-top: 10px; }
	ul#primarynavigation li ul#secondary-navigation li ul { margin-left: 15px; }
	ul#primarynavigation li.active span.secondary-nav-bottom { background: url(/release/images/layout/secondary-nav-bg.png) no-repeat !important; margin-top: -3px; height: 5px; line-height: 0.01em; font-size: 0.01em; }

/** =maincontent */	

	div#content div#maincontent { float: left; display:inline; width: 640px; margin-left: 9px; padding-bottom: 25px; }
	div#content div#maincontent div#pageheader { padding-bottom: 20px; margin-top: 30px; border-bottom: #dfdfdf solid 1px; width: 100%; overflow: hidden; }
	div#content div#maincontent div#pageheader div#introduction { float: right; width: 280px; padding-right: 10px; }
	div#content div#maincontent div#pageheader div#introduction p { margin: 0 0 5px 0; padding-top: 10px; line-height: 1.3em; font-size: 0.95em; color: #794ca6; }
	div#content div#maincontent div#pageheader h1.sifr,
	div#content div#maincontent div#pageheader h1.sifr-gateway { width: 270px; padding-bottom: 30px; float: left; letter-spacing: 100%;}

	div#content div#maincontent div#quicklinks { padding-top: 20px; width: 100%; overflow: hidden; }
	div#content div#maincontent div#quicklinks ul { list-style-type: none; }
	div#content div#maincontent div#quicklinks ul li { font-size: 0.7em; margin-bottom: 0.5em; line-height: 1.2em; display: block; width: 100%; }
	div#content div#maincontent div#quicklinks ul li strong { padding-top: 10px; display: block; width: 100%; text-decoration: underline; }
	div#content div#maincontent div#quicklinks ul li:first-child strong { padding-top: 0px;  }
	div#content div#maincontent div#quicklinks div.quick_links_header { float: left; display: block; width: 210px; }
	div#content div#maincontent div#quicklinks div.quick_links_header h3 { font-size: 0.7em; }
	div#content div#maincontent div#quicklinks div.quick_links_right { float: left; width: 180px; padding-right: 10px; }
	div#content div#maincontent div#quicklinks div.quick_links_left { float: left; width: 180px; padding-right: 10px; }
	
	div#content div#maincontent div#copy { padding-right: 40px; padding-top: 2.5em; }		
	
/** =relatedcontent */
	
	div#content div#relatedcontent { float: right; width: 150px; }	
	
	div#content div.wrapper p { width:auto; }
	div#content div#maincontent div.panel div.wrapper p.button,	
	div#content div#relatedcontent div.panel div.wrapper p.button { min-width:0; background:none; padding: 0; line-height: 1em; text-align: left !important; }	
	
	div#content div#maincontent div.panel div.wrapper p.button,
	div#content div#maincontent p.button { width:196px; line-height: 1em; margin: 0; font-size: 0.75em; position: relative; }
	
	div#content div#maincontent div.panel div.wrapper p.button { position: absolute; }
	
	div#content div#maincontent p.button a,
	div#content div#relatedcontent div.wrapper p.button a { 
		position:relative; color:#FFF; padding: 6px 25px 6px 5px; width:auto; 
		font-family: Arial; font-weight:bold; text-decoration:none; 
		background:#794CA6 url(/release/images/assets/button.gif) no-repeat 98% 45%; }

	div#content p.button span.tl { font-size: 0.01em; line-height: 0.01em; position:absolute; top:0; left:0; height:2px; width:2px; background:url(/release/images/layout/button-tl.gif) no-repeat top left; }
	div#content p.button span.bl { font-size: 0.01em; line-height: 0.01em; position:absolute; bottom:0; left:0; height:2px; width:2px; background:url(/release/images/layout/button-bl.gif) no-repeat left bottom; }
	div#content p.button span.tr { font-size: 0.01em; line-height: 0.01em; position:absolute; top:0; right:0; height:7px; width:6px; background:url(/release/images/layout/button-tr.gif) no-repeat top left; }
	div#content p.button span.br { font-size: 0.01em; line-height: 0.01em; position:absolute; bottom:0; right:0; height:7px; width:6px; background:url(/release/images/layout/button-br.gif) no-repeat left bottom; }
	div#content p.button span.mr { font-size: 0.01em; line-height: 0.01em; position:absolute; top:0; right:0; height:20px; width:6px; background:url(/release/images/layout/button-mr.gif) no-repeat top left; }
		
	div#content div.panel.active div.wrapper p.button span.tl { font-size: 0.01em; line-height: 0.01em;position:absolute; top:0; left:0; height:2px; width:2px; background:url(/release/images/layout/button-tl-active.gif) no-repeat top left; }
	div#content div.panel.active div.wrapper p.button span.bl { font-size: 0.01em; line-height: 0.01em;position:absolute; bottom:0; left:0; height:2px; width:2px; background:url(/release/images/layout/button-bl-active.gif) no-repeat bottom left; }	
	div#content div.panel.active div.wrapper p.button span.tr { font-size: 0.01em; line-height: 0.01em;position:absolute; top:0; right:0; height:7px; width:6px; background:url(/release/images/layout/button-tr-active.gif) no-repeat top left; }
	div#content div.panel.active div.wrapper p.button span.br { font-size: 0.01em; line-height: 0.01em;position:absolute; bottom:0; right:0; height:7px; width:6px; background:url(/release/images/layout/button-br-active.gif) no-repeat bottom left; }
	div#content div.panel.active div.wrapper p.button span.mr { font-size: 0.01em; line-height: 0.01em; position:absolute; top:0; right:0; height:20px; width:6px; background:url(/release/images/layout/button-mr-active.gif) no-repeat top left; }
	
	div#content div#relatedcontent div#service-finder form { position: absolute; bottom:8px;}
	div#content div#relatedcontent div#service-finder form input.text { float:left; width:113px; height:20px; padding:0; }

	div#content div.panel div.wrapper p.button { margin-bottom:0px; }

/** =siteinformation */	

	div#content ul#site-information { width: 100%; clear: both; display: block; text-align: right; padding-bottom: 25px; }
	div#content ul#site-information li { display: inline;  }
	div#content ul#site-information li.last a { border: 0; }
	
	div#content ul#site-information a { font-size: 0.7em; color: #ffffff; text-decoration: none; border-right: 1px solid #DFDFDF; padding-right: 5px; padding-left: 3px; }
	div#content ul#site-information a:hover,
	div#content ul#site-information a:active,
	div#content ul#site-information a:focus
	{ text-decoration: underline; }

/* overlay */

	div#overlay { position:absolute; top:0; left: -100%; width:100%; height:100%; z-index:10000; }
	div#overlay div#background { position:absolute; top:0; left:0; width:100%; height:100%; background:#290c34; }
	div#overlay div#overlaypanel { position:relative; top:100px; margin:0 auto; z-index:10000;  width:551px; height:550px; padding-top:8px;  }	
	div#overlay.symptom div#overlaypanel { position:relative; top:100px; margin:0 auto; z-index:10000; width:551px; height:550px; padding-top:8px; background:url(/release/images/layout/overlay-panel-your-body.png) left top no-repeat; }	
	div#overlay.symptom div#overlaypanel.ie { background:url(/release/images/layout/overlay-panel-your-body.gif) left top no-repeat; }	
	a.back { background:url(/release/images/layout/back-link.png); width:118px; height:26px; position:absolute; top:10px; right:10px; }
	a.back span { position:absolute; top:8px; left:26px; color:#fff; text-transform:uppercase; text-decoration:none; font-weight:bold; font-size:0.625em; outline-color:none; }
	div#overlay.symptom #overlaypanelflash { position:absolute; top:5px; left:5px; }	
	
/* scottish-government */

	div#leftcontent { float:left; width:160px; }	
	div#scottish-government { float:left; width:160px; height:68px; }	
	div#scottish-government span { display:block; background:url(/release/images/branding/healthier-scotland-scottish-government.png); width:161px; height:68px; }
	div#scottish-government p { display:none; }
	
/* tracking */
	iframe#tracking-frame { position:absolute; width:0; height:0; }
	
/* Directory search error  */

	p.error { color: #cc3f31; font-weight: bold; }
	
}
