/*#######################################
	SHIRE CORPORATE GUIDLINES - GENERIC STYLESHEET
	www.bostockandpollitt.com (2009)

	-[Inherits]------------------------
	Base.css
	-----------------------------------

	-[Contents]------------------------
	1. CORE LAYOUT STRUCTURE
		1.1 HTML elements (within .inner-content)
		1.2 Site wide anchor links
	2. BRANDING	
	-----------------------------------
#######################################*/

/* RESET */
* { 	border: 0; margin: 0; padding: 0;color: #484848;}
body {	background: #2a2a2a; font-family: Arial, Verdana, sans-serif;font-size: 62.5%;}

a {text-decoration: none;color: #299bdc;}
a:hover {text-decoration: underline;}
p {font-size:1.1em;padding-bottom: 15px;line-height:1.4em;}
ul {font-size:1.1em;padding-bottom: 15px;padding-left: 15px;}
ol {padding-left: 20px;}
h2 {color: #2995d3;}
h3 {font-size:1.2em;}

/*#######################################
    MAIN CONTAINERS
#######################################*/

/* HEADER CONTAINER */
#header-outer {
    background: #fff;}
#header-outer #header-inner {
	width: 1004px;
	margin: 0px auto;
	background: url(../img/header-corporate-guidelines.gif) 626px 42px no-repeat;
	position: relative;
	height: 90px;
	overflow: hidden;
	padding-bottom: 10px;}
	
#header-inner #logo {
	width: 149px;
	height: 44px;
	margin-top: 25px;
	background: url(../img/shire-logo-blue.gif) top left no-repeat;}
#header-inner #logo span {visibility: hidden;}
#header-inner #header-nav {
    position: absolute;
    right: 20px;
    top: 0;
    padding: 0;}    
#header-inner #header-nav li {
    float: left;
    list-style: none;}
#header-inner #header-nav a {
    display: block;
    padding:10px 10px 2px 10px;
    border-right: 1px solid #e2e2e2;
    text-decoration: none;
    color: #484848;}
#header-inner #header-nav .first a {
    padding-left: 10px;
    border-left: 1px solid #e2e2e2;}
#header-outer #header-nav a:hover {background: #2995d3;color: #fff;}
/* GREY CONTAINER */
#grey-outer {
    background: #2a2a2a url(../img/header-background.gif) top left repeat-x;}
#grey-inner {
    width: 960px;
	margin: 0 auto;}
	
#grey-inner #grey-nav {
    overflow: hidden;
    font-size: 1.2em;
    font-weight: bold;
    padding: 0;}
#grey-inner #grey-nav li {
    float: left;
    border-left: 1px solid #737373;
    list-style-position:outside;
    list-style-type: none;}
#grey-inner #grey-nav a {
    color: #fff;
    padding: 7px 6px;
    display: inline-block;}
#grey-inner #grey-nav a:hover {
    text-decoration: none;}
#grey-inner #grey-nav .active {border-left: 0px;}
#grey-inner #grey-nav .active a {color: #000;display: inline-block;background: #fff url(../img/grey-nav-left.gif) left top no-repeat;padding:7px 3px 7px 9px;}
#grey-inner #grey-nav .active {background: url(../img/grey-nav-right.gif) right top no-repeat;padding-right:6px;}
#grey-inner #grey-nav .after-active {border: 0px;}

#grey-inner h1 {
    font-size:4em;
    color: #fff;
    font-style:italic;
    font-weight: normal;
    padding: 30px 0px 30px 0px;}
#grey-inner h1 span {
    visibility: hidden;
    float: right;}
    
#grey-inner #grey-nav .download-pdf {
    border-right: none;
    padding-right: 0;
    padding-left: 12px;
    margin-left: 10px;
    margin-right: 0;
    font-weight:normal;
    background: url(../img/header-download-arrow-blue.gif) 0px 10px no-repeat;color: #58bdf8;}

/* BAR CONTAINER */
#bar-outer {
    overflow: hidden;
    background: #2995d3 url(../img/header-bar-blue.gif) top left repeat-x;}
#bar-outer #bar-nav {
    overflow: hidden;
    font-size: 1.2em;
    font-weight: bold;
    width: 960px;
	margin: 0 auto;
	padding-bottom: 0;
	padding-left: 0;}

#bar-outer #bar-nav li {
    float: left;
    list-style-position:outside;
    list-style-type: none;}
#bar-outer #bar-nav .active {
    color: #000;
    background: #2a2a2a;}

#bar-outer #bar-nav a {
    color: #fff;
    padding: 7px 7px;
    display: inline-block;}
#bar-outer #bar-nav a:hover {
    text-decoration: none;}    
    
#bar-outer #bar-nav .active a {color: #fff;display: inline-block;padding:7px 10px 7px 16px;background: #2a2a2a url(../img/bar-nav-left-blue.gif) left top no-repeat;}
#bar-outer #bar-nav .active {padding-right:6px;background: url(../img/bar-nav-right-blue.gif) right top no-repeat;border-left: 0px;}
        
/* CONTENT CONTAINER */
#content-outer {
    background: #fff;}
#content-inner {
	margin: 0 auto;
	width: 960px;
	overflow: hidden;
	padding-bottom: 30px;
	position: relative;}
	
/* Download Panel */
html #content-inner #download-panel {
    width: 224px;
    position: absolute;
    top: 0;
    right: 0;
    background: #2a2a2a url(../img/downloads-panel.gif) left bottom no-repeat;
    padding-bottom: 29px;}
    
html #content-inner #download-panel h2 {
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: 1.2em;
    font-style:normal;
    font-weight: bold;
    padding: 0 0 4px 10px;
    width:214px;}  
    
html #content-inner #download-panel h2 a {
    background: none;
    padding-left: 0;}      
         
html #content-inner #download-panel a {
    color: #fff;
    display:block;
    background: url(../img/header-download-arrow-white.gif) 0px 2px no-repeat;
    padding-left:13px}
html #content-inner #download-panel a:hover {text-decoration: none;}
html #content-inner #download-panel ul {margin: 10px 0 10px 10px;padding: 0;list-style: none;}
html #content-inner #download-panel ul li {color: #fff;padding-bottom:2px;}
html #content-inner #download-panel ul li a:hover {text-decoration: underline;}
	
/* FOOTER CONTAINER */
#footer-outer {
    background: #2a2a2a;
    width: 100%;
    border-top: 1px solid #fff;}
#footer-inner {
    width: 960px;
	margin: 0 auto;
	overflow: hidden;
    margin-bottom: 100px;}
#footer-inner  #footer-nav {
    overflow: hidden;
    float: right;
    padding: 0;}
#footer-inner  #footer-nav li {
    float: left;
    list-style: none;}
#footer-inner #footer-nav a {
    display: block;
    padding:7px 10px 7px 10px;
    border-left: 1px solid #737373;
    color: #a3a3a3;}
#footer-inner  #footer-nav .last a {
    border-right: 1px solid #737373;} 
#footer-inner  #copyright {
    float: left;
    padding: 0;}
#footer-inner  #copyright li {
    float: left;
    list-style: none;}
#footer-inner #copyright a {
    display: block;
    padding:7px 10px 7px 10px;
    border-left: 1px solid #737373;
    color: #a3a3a3;}
#footer-inner #copyright span {
    display: block;
    padding:7px 10px 7px 10px;
    border-left: 1px solid #737373;
    color: #a3a3a3;}
#footer-inner  #copyright .last a {
    border-right: 1px solid #737373;}    

    
/*#######################################
    PAGE COLOURS
#######################################*/

/* Orange */
.basic-elements #header-outer #logo {background: url(../img/shire-logo-orange.gif) top left no-repeat;}
.basic-elements #header-outer #header-nav a:hover {background: #ff6600;color: #fff;}
.basic-elements #bar-outer {background: #ff6600 url(../img/header-bar-orange.gif) top left repeat-x;}
.basic-elements #grey-inner #grey-nav .download-pdf {background: url(../img/header-download-arrow-orange.gif) 0px 10px no-repeat;color: #f60;}
.basic-elements #bar-outer #bar-nav li {border-left: 1px solid #ffa45c;}
html .basic-elements #bar-outer #bar-nav .last {border-right: 1px solid #ffa45c;}
.basic-elements #bar-outer #bar-nav .active a {background: #2a2a2a url(../img/bar-nav-left-orange.gif) left top no-repeat;}
.basic-elements #bar-outer #bar-nav .active {background: url(../img/bar-nav-right-orange.gif) right top no-repeat;border-left: 0px;}
.basic-elements #bar-outer #bar-nav .after-active {border: 0;}
.basic-elements #content-inner h2 {color: #f60;}
.basic-elements #content-inner #breadcrumb a {color: #f60;}

/* Purple */
.photography-and-illustration #header-outer #logo {background: url(../img/shire-logo-purple.gif) top left no-repeat;}
.photography-and-illustration #header-outer #header-nav a:hover {background: #8b1c88;color: #fff;}
.photography-and-illustration #bar-outer {background: #8b1c88 url(../img/header-bar-purple.gif) top left repeat-x;}
.photography-and-illustration #grey-inner #grey-nav .download-pdf {background: url(../img/header-download-arrow-purple.gif) 0px 10px no-repeat;color: #eb58e8;}
.photography-and-illustration #bar-outer #bar-nav li {border-left: 1px solid #b56eb4;}
html .photography-and-illustration #bar-outer #bar-nav .last {border-right: 1px solid #b56eb4;}
.photography-and-illustration #bar-outer #bar-nav .active a {background: #2a2a2a url(../img/bar-nav-left-purple.gif) left top no-repeat;}
.photography-and-illustration #bar-outer #bar-nav .active {background: url(../img/bar-nav-right-purple.gif) right top no-repeat;border-left: 0px;}
.photography-and-illustration #bar-outer #bar-nav .after-active {border: 0;}
.photography-and-illustration #content-inner h2 {color: #781b76;}
.photography-and-illustration #content-inner #breadcrumb a {color: #781b76;}

/*Pink*/
.stationary-templates #header-outer #logo {background: url(../img/shire-logo-pink.gif) top left no-repeat;}
.stationary-templates #header-outer #header-nav a:hover {background: #e72967;color: #fff;}
.stationary-templates #bar-outer {background: #e72a68 url(../img/header-bar-pink.gif) top left repeat-x;}
.stationary-templates #grey-inner #grey-nav .download-pdf {background: url(../img/header-download-arrow-pink.gif) 0px 10px no-repeat;color: #ff5b91;}
.stationary-templates #bar-outer #bar-nav li {border-left: 1px solid #fa82a9;}
html .stationary-templates #bar-outer #bar-nav .last {border-right: 1px solid #fa82a9;}
.stationary-templates #bar-outer #bar-nav .active a {background: #2a2a2a url(../img/bar-nav-left-pink.gif) left top no-repeat;}
.stationary-templates #bar-outer #bar-nav .active {background: url(../img/bar-nav-right-pink.gif) right top no-repeat;border-left: 0px;}
.stationary-templates #bar-outer #bar-nav .after-active {border: 0;}
.stationary-templates #content-inner h2 {color: #e72967;}
.stationary-templates #content-inner #breadcrumb a {color: #e72967;}

/* Red */
.digital-templates #header-outer #logo {background: url(../img/shire-logo-red.gif) top left no-repeat;}
.digital-templates #header-outer #header-nav a:hover {background: #cc0033;color: #fff;}
.digital-templates #bar-outer {background: #cd0033 url(../img/header-bar-red.gif) top left repeat-x;}
.digital-templates #grey-inner #grey-nav .download-pdf {background: url(../img/header-download-arrow-red.gif) 0px 10px no-repeat;color: #ff1e58;}
.digital-templates #bar-outer #bar-nav li {border-left: 1px solid #f95c84;}
html .digital-templates #bar-outer #bar-nav .last {border-right: 1px solid #f95c84;}
.digital-templates #bar-outer #bar-nav .active a {background: #2a2a2a url(../img/bar-nav-left-red.gif) left top no-repeat;}
.digital-templates #bar-outer #bar-nav .active {background: url(../img/bar-nav-right-red.gif) right top no-repeat;border-left: 0px;}
.digital-templates #bar-outer #bar-nav .after-active {border: 0;}
.digital-templates #content-inner h2 {color: #cc0033;}
.digital-templates #content-inner #breadcrumb a {color: #cc0033;}

/* weird ie8 bug fix*/
#grey-inner #grey-nav .active a {padding:7px 4px 7px 9px;}
/* weird ie8 bug fix*/
.photography-and-illustration #grey-inner #grey-nav .active a {padding:7px 3px 7px 9px;}
/* weird ie8 bug fix*/
.digital-templates #grey-inner #grey-nav .active a {padding:7px 4px 7px 11px;}


/*#######################################
    MAIN CONTAINER
#######################################*/

#content-inner #breadcrumb {
    font-weight: bold;
    font-size: 1.2em;
    padding: 30px 0;}
#content-inner #breadcrumb a {
    font-weight: normal;
    border-right: 1px solid #e2e2e2;
    padding: 0 10px;}
#content-inner #breadcrumb .last {
    border-right: none;}
    
#content-inner h2 {
    font-style: italic;
    font-size: 3em;
    font-weight: normal;
    width: 960px;
    margin: 0 auto 3px;}

/* Back to top */    
#content-inner .back-to-top {
    overflow: hidden;
    padding: 5px 0 20px;
    font-size: 1.1em;
    width: 960px;}
#content-inner .back-to-top a {
    float: right;
    padding-left: 12px;
    background: url(../img/content-back-to-top-arrow.gif) 0px 3px no-repeat;
    text-decoration: none;
    color: #484848;}
#content-inner .back-to-top a:hover {
    text-decoration: underline;}
#content-inner .back-to-top hr {
    display: none;}

/* content holders */
#content-inner .content-section {
    background: url(../img/horiz-line.gif) top left no-repeat;
    margin: 0 auto;
    overflow: hidden;}
    
#content-inner .content-section-no-sidebar {
    background: url(../img/horiz-line-no-sidebar.gif) top left no-repeat;
    margin: 0 auto;
    overflow: hidden;}
        
#content-inner .content-section-background {
    overflow: hidden;
    background: url(../img/horiz-line.gif) bottom left no-repeat;
    _zoom: 1;}
#content-inner .content-section .content-section-content, #content-inner .content-section-no-sidebar .content-section-content {
    width: 715px;
    float: left;
    margin:20px 0;}
#content-inner .content-section .content-section-sidebar {
    width: 225px;
    float: right;
    margin:20px 0;}
/* content holders - reverse */    
#content-inner .content-section-reverse {
    background: url(../img/horiz-line-reverse.gif) top left no-repeat;
    margin: 0 auto;}
#content-inner .content-section-reverse-background {
    overflow: hidden;
    background: url(../img/horiz-line-reverse.gif) bottom left no-repeat;
    _zoom: 1;}
#content-inner .content-section-reverse .content-section-content {
    width: 715px;
    float: right;
    margin:20px 0;}
#content-inner .content-section-reverse .content-section-sidebar {
    width: 225px;
    float: left;
    margin:20px 0;}
    


/*#######################################
    PAGE SPECIFIC
#######################################*/

/* Contact Us */
.contact-us #content-inner .content-section-reverse {margin-top: 60px;}
.contact-us #content-inner .content-section-reverse-background {background: none;}

.contact-us #content-inner .content-section-reverse #contact-nav {
    font-size: 1em;
    overflow: hidden;
    list-style: none;
    padding: 0;}
.contact-us #content-inner .content-section-reverse #contact-nav li {
    float: left;
    width: 195px;}
.contact-us #content-inner .content-section-reverse #contact-nav .last {
    float: left;
    width: 130px;}
    
/* Downloads */
.downloads #content-inner .link-holder {
    float: left;
    width: 225px;
    margin: 50px 20px 0 0;
    overflow: hidden;}
html .downloads #content-inner .last {
    margin-right: 0;}

.downloads #content-inner .link-holder h2 {
    font-size: 1.2em;
    padding-bottom: 5px;
    margin-bottom: 10px;
    border-bottom: #e2e2e2 1px solid;
    font-weight: bold;
    font-style:normal;
    color: #2a2a2a;}
    
.downloads #content-inner .link-holder h3 {
    font-size: 1.1em;
    font-weight: normal;
    margin-bottom:3px;}
    
.downloads #content-inner .link-holder ul {
    list-style: none;
    padding-left: 0;}
    
.downloads #content-inner .link-holder ul li {
    padding-left: 12px;
    background: url(../img/download-arrow-blue-on-white.gif) 0px 2px no-repeat;}
    
/* Sitemap */
.sitemap #content-inner .link-holder {
    float: left;
    width: 225px;
    margin: 50px 20px 0 0;
    overflow: hidden;}
html .sitemap #content-inner .last {
    margin-right: 0;}

.sitemap #content-inner .link-holder h2 {
    font-size: 1.2em;
    padding-bottom: 5px;
    margin-bottom: 10px;
    border-bottom: #e2e2e2 1px solid;
    font-weight: bold;
    font-style:normal;
    color: #2a2a2a;}
    
.sitemap #content-inner .link-holder h3 {
    font-size: 1.1em;
    font-weight: normal;
    margin-bottom:3px;}
    
.sitemap #content-inner .link-holder ul {
    list-style: none;
    padding-left: 0;}
    
    
/*#######################################
    LOOK OF BRAVE
#######################################*/    

/* BAR CONTAINER */
#brave-bar-outer {
    overflow: hidden;}
    
#brave-bar-outer ul {
    overflow: hidden;
    width: 960px;
	margin: 0 auto;
	padding-bottom: 0;
	padding-left: 0;}

#brave-bar-outer ul li {
    float: left;
    list-style-position:outside;
    list-style-type: none;
    width: 48px;
    height: 50px;}
#brave-bar-outer ul li a {
    color: #fff;
    display: block;
    width: 48px;
    height: 50px;}
#brave-bar-outer ul li a span {
    visibility: hidden;}
    
#brave-bar-outer ul a:hover {
    text-decoration: none;}
    
/* Look Of Brave */
.look-of-brave #content-inner h2 {color:#fff; font-size: 3.8em;margin:20px 0;}
.look-of-brave #content-inner p {color:#fff;font-size: 1.2em;font-weight: bold;}
.look-of-brave #content-inner h3 {color:#fff;font-size:1.6em;}
.look-of-brave #content-inner h3 {color:#fff;}

.look-of-brave .brave-content {overflow: hidden;}
.look-of-brave .brave-content .image-holder {float: left; width: 465px;}
.look-of-brave .brave-content .copy-holder {float: right; width: 460px;}

.look-of-brave .brave-content .videoModal{
    background: url(../img/download-arrow-blue-on-white.gif) left 2px no-repeat;
    padding-left: 12px;
    font-size:0.611em;
    margin-left: 230px;}

 
/* Look Of Brave - B - Pink */

.home #content-inner p {color:#484848;font-size: 1.8em;margin-top:20px;font-weight: normal;}
html .home .brave-content .image-holder {width: 430px;background: url(../img/home-brave.gif) left 140px no-repeat;height:450px;}
.home .brave-content .copy-holder {background: url(../img/home-title-brave.gif) left 180px no-repeat;height:400px;}

.big-b #brave-bar-outer {background: url(../img/brave-b-line.gif) top left repeat-x;}
.big-b #content-outer {background: #ff4582 url(../img/brave-b-background.gif) top left repeat-x;}
.big-b #brave-bar-outer ul {background: url(../img/brave-b.gif) top left no-repeat;}
.big-b #grey-inner #grey-nav .download-pdf {background: url(../img/header-download-arrow-pink.gif) 0px 10px no-repeat;color: #ff5b91;}
.big-b #header-outer #logo {background: url(../img/shire-logo-pink.gif) top left no-repeat;}
.big-b #header-outer #header-nav a:hover {background: #e72967;color: #fff;}
.big-b .brave-content .image-holder {background: url(../img/brave-b-image.gif) left 90px no-repeat;height: 360px;}
.big-b .brave-content .copy-holder .next {background: url(../img/brave-b-arrow.gif) right 4px no-repeat; padding-right: 18px;font-weight: bold; font-size: 1.334em;color: #fff;}
.big-b .brave-content .copy-holder .next {text-decoration: none;}

.big-r #brave-bar-outer {background: url(../img/brave-r-line.gif) top left repeat-x;}
.big-r #content-outer {background: #1da4f1 url(../img/brave-r-background.gif) top left repeat-x;}
.big-r #brave-bar-outer {background: url(../img/brave-r-line.gif) top left repeat-x;}
.big-r #brave-bar-outer ul {background: url(../img/brave-r.gif) top left no-repeat;}
.big-r .brave-content .image-holder {background: url(../img/brave-r-image.gif) left 80px no-repeat;height: 370px;}
.big-r .brave-content .copy-holder .next {background: url(../img/brave-r-arrow.gif) right 4px no-repeat; padding-right: 18px;font-weight: bold; font-size: 1.334em;color: #fff;}
.big-r .brave-content .copy-holder .next {text-decoration: none;}

.big-a #brave-bar-outer {background: url(../img/brave-a-line.gif) top left repeat-x;}
.big-a #content-outer {background: #ff7e00 url(../img/brave-a-background.gif) top left repeat-x;}
.big-a #brave-bar-outer ul {background: url(../img/brave-a.gif) top left no-repeat;}
.big-a #grey-inner #grey-nav .download-pdf {background: url(../img/header-download-arrow-orange.gif) 0px 10px no-repeat;color: #f60;}
.big-a #header-outer #logo {background: url(../img/shire-logo-orange.gif) top left no-repeat;}
.big-a #header-outer #header-nav a:hover {background: #f60;color: #fff;}
.big-a .brave-content .image-holder {background: url(../img/brave-a-image.gif) left 90px no-repeat;height: 360px;}
.big-a .brave-content .copy-holder .next {background: url(../img/brave-a-arrow.gif) right 4px no-repeat; padding-right: 18px;font-weight: bold; font-size: 1.334em;color: #fff;}
.big-a .brave-content .copy-holder .next {text-decoration: none;}

.big-v #brave-bar-outer {background: url(../img/brave-v-line.gif) top left repeat-x;}
.big-v #content-outer {background: #68c429 url(../img/brave-v-background.gif) top left repeat-x;}
.big-v #brave-bar-outer ul {background: url(../img/brave-v.gif) top left no-repeat;}
.big-v #grey-inner #grey-nav .download-pdf {background: url(../img/header-download-arrow-green.gif) 0px 10px no-repeat;color: #55a220;}
.big-v #header-outer #logo {background: url(../img/shire-logo-green.gif) top left no-repeat;}
.big-v #header-outer #header-nav a:hover {background: #55a220;color: #fff;}
.big-v .brave-content .image-holder {background: url(../img/brave-v-image.gif) left 70px no-repeat;height: 380px;}
.big-v .brave-content .copy-holder .next {background: url(../img/brave-v-arrow.gif) right 4px no-repeat; padding-right: 18px;font-weight: bold; font-size: 1.334em;color: #fff;}
.big-v .brave-content .copy-holder .next {text-decoration: none;}

.big-e #brave-bar-outer {background: url(../img/brave-e-line.gif) top left repeat-x;}
.big-e #content-outer {background: #941f91 url(../img/brave-e-background.gif) top left repeat-x;}
.big-e #brave-bar-outer ul {background: url(../img/brave-e.gif) top left no-repeat;}
.big-e #grey-inner #grey-nav .download-pdf {background: url(../img/header-download-arrow-purple.gif) 0px 10px no-repeat;color: #eb58e8;}
.big-e #header-outer #logo {background: url(../img/shire-logo-purple.gif) top left no-repeat;}
.big-e #header-outer #header-nav a:hover {background: #8b1c88;color: #fff;}
.big-e .brave-content .image-holder {background: url(../img/brave-e-image.gif) left 80px no-repeat;height: 360px;}