@import "ie6win.css";
@import "ie7win.css";

/*  
========================================
Danone Actimel Screen stylesheet
Jesper Hills for Graphico, 09 April 2009
========================================

1. Common
2. Layout
3. Header
4. Primary, Breadcrumb and Secondary Nav
5. Site Information
6. Primary Content
7. Secondary Content

Base Styles:
*/
body { text-align: center; font-size: 62.5%; line-height: 1.4; font-family: Arial, Verdana, Sans-Serif; }
a { color: #8c2c83; text-decoration: none; }
a:hover, a:focus { color: #fff; background-color: #8c2c83 !important; }
a:active { color: #d85dcd !important; background-color: transparent !important; outline: none; }



/* 
	Actimel default.aspx styles;
	graphico.co.uk 
*/

/*
========================================
Copy Default CSS
========================================
*/


/* default headers */
h1 { font-size: 1.8em; }
h2 { font-size: 1.6em; }
h3 { font-size: 1.4em; }
h1,h2,h3 { margin: 1em 0; }

h1, h2, h3, h4, h5, h6 ,strong { font-weight:bold;  }

abbr,acronym 
{
	border-bottom: 1px dotted #000;
	cursor: help;
}
 
em 
{
	/*bringing italics back to the em element*/
	font-style:italic;
}

blockquote, ul, ol, dl 
{
	/*giving blockquotes and lists room to breath*/
	margin:1em;
}

ol, ul, dl 
{
	/*bringing lists on to the page with breathing room */
	margin-left:2em;
}

ol li 
{
	/*giving OL's LIs generated numbers*/
	list-style: decimal outside;	
}

ul li 
{
	/*giving UL's LIs generated disc markers*/
	list-style: none outside;
}

dl dd 
{
	/*giving UL's LIs generated numbers*/
	margin-left:1em;
}

th,td 
{
	/*borders and padding to make the table readable*/
	border: 1px solid #000;
	padding: .5em;
}

th 
{
	/*distinguishing table headers from data cells*/
	font-weight: bold;
	text-align: center;
}

caption 
{
	/*coordinated marking to match cell's padding*/
	margin-bottom: .5em;
	/*centered so it doesn't blend in to other content*/
	text-align: center;
}

p, fieldset, table 
{
	/*so things don't run into each other*/
	margin-bottom:1em;
}

.invisible { display: none; }

/* Hide content for visual users. E.g. skip links	*/
.hide
{
	position: absolute;
	top: -9999px;
	left: -9999px;
}

/* Can't hide legends cross browser with negative text indent */
legend.hide
{
	font-size: 0.005em;
	visibility: hidden;
}

fieldset
{
	border: 0;	
}

/* Used to space an ellipse nicely */
.ellipse { letter-spacing: -0.15em; }

/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.html] */
.clear { display: inline-block; }   
.clear:after, .container:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}
* html .clear { height: 1%; }
.clear { display: block; }

/* Generic Levin image replacement -  
   http://levin.grundeis.net/files/20030809/alternatefir.html */
.replace
{ 
	position: relative; 
	margin: 0px; 
	padding: 0px; 
	/* hide overflow:hidden from IE5/Mac */ 
	/* \*/ overflow: hidden; /* */ 
}

.replace span
{
	display: block; 
	position: absolute; 
	top: 0px; 
	left: 0px;
	z-index: 1; /*for Opera 5 and 6*/ 
}


/* default label styles */
label, .label, input, .input
{
	display: block;
	float: left;
	margin: 2px 0 3px 0;
	clear: left;	
}

label, .label { font-weight: bold; }

.input input, .input label 
{
	display: inline;
	float: none;
	margin: 0;
}   

input.submit { clear: left; }    

/*	For evil CMSs */
u { text-decoration: none; }

/*	Site Default Styles		*/
body
{
	font: 62.5% Arial,Verdana,Sans-Serif;
	text-align: center;
	min-width: 900px;
}

#wrap 
{
  font-size: 1em;
  width: 900px;
  margin: 0 auto;
  text-align: left;
}

.col 
{
  float: left;
  margin-right: 10px;
}


/*
========================================
1. Common
========================================
*/
.hide {
    position: absolute;
    left: -99999em;
    top: -99999em;
    }
.clear:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    } /* Hack: line 10 (ie6win.css), line 10 (ie7win.css) */
.left {
    float: left;
    }
.right {
    float: right;
    }
a img {
    border: none;
    }
.replace { 
    position: relative; 
    margin: 0px; 
    padding: 0px; 
    /* Hide overflow:hidden from IE5/Mac */ 
    /* \*/ overflow: hidden; /* */ 
    } /* http://levin.grundeis.net/files/20030809/alternatefir.html */
.replace span {
    display: block; 
    position: absolute; 
    top: 0px; 
    left: 0px;
    z-index: 1; /* For Opera 5 and 6 */ 
    }
div.hr hr {
    display: none;
    }
    div.hr {
        height: 1px;
        overflow: hidden;
        background: url(../../SiteImages/template/dotted.gif) 0 0.5em repeat-x;
        padding: 0.5em 0 0;
        margin: 0 -5px 1.5em -5px;
        }    
/*
========================================
2. Layout
========================================
*/
#container {
    width: 927px;
    margin: 0 auto;
    text-align: left;
    }
#header,
#primaryNav,
#breadcrumb {
    width: 100%;
    overflow: hidden;
    } /* Cheap self-clear trick */
    #primaryNav {
        padding: 0 0 14px;
        }    
    #breadcrumb {
        padding: 0 0 15px;
        }
#secondaryNav {
    width: 187px;
    padding: 17px 26px 0 15px;
    float: left;
    }
#siteInformation {
    text-align: center;
    background: url(../../SiteImages/template/pageContentBottom.gif) 0 0 no-repeat;
    margin: 0 -10px 0 -10px;
    padding: 18px;
    }
   
#home #siteInformation { background:none;}

#wrapContent {
    background: url(../../SiteImages/template/pageContentTop.gif) 0 0 no-repeat;
    padding: 8px 0 0;
    }
    
#home #wrapContent { background:none;}
#pageContent {
    border-left: 1px solid #e4e4e4;
    border-right: 1px solid #e4e4e4;
    background: #fff;
    } /* Cleared by .clear, line 31 (line 34, MasterPage.master) */

#home #pageContent {border:none;}    
    
#primaryContent {
    width: 475px;
    float: left;
    margin: 19px 0 0;
    }
    
#SiteMap #primaryContent {
	margin:39px 0 10px;}

#home #primaryContent {width:auto;}
#secondaryContent {
    width: 194px;
    float: right;
    margin: 7px 15px 0 0;
    }
/*
========================================
3. Header
========================================
*/
#header a,
#header p,
#header img {
    float: left;
    }
#header a {
    margin: 27px 0 0 20px;
    }

#header p {
    background: url(../../SiteImages/template/HelpSupport.gif) 0 0 no-repeat;
    width: 417px;
    height: 29px;
    text-indent: -999999em;
    margin: 40px 66px 0 88px;
    }    
/*  
========================================
4. Primary, Breadcrumb and Secondary Nav
========================================
*/
#primaryNav ul,
#primaryNav ul li,
#primaryNav ul li a {
    list-style: none outside;
    float: left;
    height: 29px;
    }
#primaryNav ul {
    padding: 0;
    margin: 20px 0 0 72px;
    } /* Hack: line 11 (ie6win.css) */
#primaryNav ul li a {
    background: url(../../SiteImages/template/PrimaryNavigation.gif) 0 0 no-repeat;
    text-indent: -999999em;
    outline: none;
    margin: 0 3px 0 0;
    }
    /* Static */
    #primaryNav #uiHplHome { width: 51px; background-position: 0 0; }
    #primaryNav #uiHplAbout { width: 91px; background-position: -54px 0; }
    #primaryNav #uiHplImmuneSystem { width: 191px; background-position: -148px 0; }
    #primaryNav #uiHplBenefits { width: 158px; background-position: -342px 0; }
    #primaryNav #uiHplProbiotics { width: 127px; background-position: -503px 0; }
    #primaryNav #uiHplSupport { width: 153px; background-position: -633px 0; }
    /* Hover/Focus */
    #primaryNav #uiHplHome:hover, #primaryNav #uiHplHome:focus { background-position: 0 -29px; }
    #primaryNav #uiHplAbout:hover, #primaryNav #uiHplAbout:focus { background-position: -54px -29px; }
    #primaryNav #uiHplImmuneSystem:hover, #primaryNav #uiHplImmuneSystem:focus { background-position: -148px -29px; }
    #primaryNav #uiHplBenefits:hover, #primaryNav #uiHplBenefits:focus { background-position: -342px -29px; }
    #primaryNav #uiHplProbiotics:hover, #primaryNav #uiHplProbiotics:focus { background-position: -503px -29px; }
    #primaryNav #uiHplSupport:hover, #primaryNav #uiHplSupport:focus { background-position: -633px -29px; }
    /* Current */
    #primaryNav #uiHplHome.current { background-position: 0 -58px; }
    #primaryNav #uiHplAbout.current { background-position: -54px -58px; }
    #primaryNav #uiHplImmuneSystem.current { background-position: -148px -58px; }
    #primaryNav #uiHplBenefits.current { background-position: -342px -58px; }
    #primaryNav #uiHplProbiotics.current { background-position: -503px -58px; }
    #primaryNav #uiHplSupport.current { background-position: -633px -58px; }

#breadcrumb ul {
    margin: 0 0 0 20px;
    padding: 0;
    font-size: 1.1em;
    }
    #breadcrumb ul li {
        float: left;
        list-style: none outside;
        margin: 0 5px 0 0;
        }
        #breadcrumb ul li a {
            padding: 0 10px 0 0;
            background: url(../../SiteImages/template/arrow.gif) center right no-repeat;
            }

#secondaryNav h2 {
    margin: 0;
    padding: 0;
    font: normal 1.8em/1 "FuturaBT MediumCondensed", FuturaBT, Arial, Verdana, Sans-Serif;
    line-height: 1;
    color: #0053a0;
    }
#secondaryNav ul {
    margin: 9px 0 0;
    padding: 0 0 1px;
    font-size: 1.2em;
    background: url(../../SiteImages/template/dotted.gif) left bottom repeat-x;
    list-style: none outside;
    }
    #secondaryNav li,
    #secondaryNav li a {
        display: block;
        }
    #secondaryNav li {
        padding: 3px 0 2px;
        background: url(../../SiteImages/template/dotted.gif) left top repeat-x;
        }
    #secondaryNav li a {
        background: #cceffc url(../../SiteImages/template/secondaryNavItem.gif) left top repeat-x;
        padding: 0 5px;
        width: 177px;
        line-height: 1.83em;
        }
    #About li.About a,
    #Works li.Works a,
    #Small li.Small a,
    #Importance li.Importance a
     {
        background: #991583 url(../../SiteImages/template/secondaryNavArrow.gif) 5px 50% no-repeat !important;
        color: #fff;
        font-weight: bold;
        width: 168px;
        padding: 0 5px 0 14px;
        }
    #secondaryNav li a:hover,
    #secondaryNav li a:focus {
        background: #d85ecd !important; /* Overwrite default focus !important, line 19 */
        color: #fff;
        }                
    #secondaryNav li a.current:hover,
    #secondaryNav li a.current:focus {
        background: #d85ecd url(../../SiteImages/template/secondaryNavArrow.gif) 5px 50% no-repeat !important;
        }
/*  
========================================
5. Site Information
========================================
*/
#siteInformation ul {
    margin: 25px 0 0;
    font-size: 1.2em;
    }
#siteInformation ul li {
    list-style: none outside;
    display: inline;
    border-right: 1px solid #bcbcbc;
    padding: 0 0.4em 0 0.2em;
    } /* Hack: line 12 (ie6win.css), line 11 (ie7win.css) */
#siteInformation ul li.last {
    border: none;
    padding-right: 0.2em;
    }
#siteInformation p {
    color: #999999;
    margin: 30px 0 0;
    font-size: 1.1em;
    }
#siteInformation #Danone {
    width: 170px;
    height: 125px;
    background: url(../../SiteImages/template/DanoneLogo.gif) 0 0 no-repeat;
    overflow: hidden;
    text-indent: -99999em;
    margin: -8em 0 0;
    position: absolute;
    right: 0;
    z-index: -1;
    }
    #siteInformation #Danone a {
        display: block;
        width: 100%;
        height: 100%;
        background: transparent !important; /* Overwrite default focus !important, line 19 */
        } 
/*  
========================================
6. Primary Content
========================================
*/
/* Headings */
#primaryContent h1,
#primaryContent h2,
#primaryContent h3 {
	line-height: 1;
	margin: 0;
	font-weight: normal;
}
#primaryContent h1 {
    font-size: 3.1em;
    text-transform: uppercase;
    font-family: "FuturaBT BoldCondensed", FuturaBT, Impact, Arial, Verdana, Sans-Serif;
    color: #8a2981;
    margin: 0 0 0.5em;
    }
#primaryContent h2 {
    font-size: 1.4em;
    font-weight: bold;
    text-transform: uppercase;
    color: #0055a5;
    margin: 2em 0 1em;
    }
    
#SiteMap #primaryContent h2 {
    font-size: 1.2em;
    margin: 0 0 2em;
    }
    
#primaryContent h3 {
    font-size: 1.2em;
    font-weight: bold;
    color: #0055a5;
    margin: 0.9em 0 0.8em;
    }
/* Content tags */
#primaryContent p,
#primaryContent ol,
#primaryContent dl {
    margin: 0 0 0.83em;
    font-size: 1.2em;
    }
#primaryContent ul 	{
	font-size: 1.2em;
	margin:1.5em 0 2em;}

#primaryContent ul ul,
#primaryContent ul ol,
#primaryContent ol ol,
#primaryContent ol ul {
    font-size: 1em;}
    
#primaryContent ul li {
	list-style:outside disc;
	margin:0.83em 10px 0 15px;
	padding-left:10px;}     

/* Forms */
#primaryContent fieldset {
width: 333px;
}
#primaryContent fieldset legend,
#primaryContent fieldset .captchaMessage {
    display: none;
    }
#primaryContent fieldset label {
    float: left;
    width: 145px;
    margin: 0.5em 0 0;
    }
#primaryContent fieldset ol,
#primaryContent fieldset ul {
    margin: 0;
    padding: 0;
    }
#primaryContent fieldset li {
    width: 100%;
    overflow: hidden;
    display: block;
    list-style: none outside;
    margin: 5px 0 0;
    } /* Hack: line 13 (ie6win.css), line 12 (ie7win.css) */
#primaryContent fieldset li ul,
#primaryContent fieldset li ol,
#primaryContent fieldset li li,
#primaryContent fieldset li li label,
#primaryContent fieldset li.checkbox label,
#primaryContent fieldset li input,
#primaryContent fieldset li select,
#primaryContent fieldset li textarea {
    float: left;
    width: auto;
    margin: 0;
    font-size: 1em;
    }
#primaryContent fieldset li ul,
#primaryContent fieldset li ol {
    margin: 0.5em 0 0;
    }
    #primaryContent fieldset li li {
        margin: 0 1em 0 0;
        }
    #primaryContent fieldset li li input {
        margin: 0;
        }
#primaryContent fieldset li .text, 
#primaryContent fieldset li.captcha input {
    font-size: 1.1em;
    font-family: Arial, Verdana, Sans-Serif;
    padding: 4px 2px;
    width: 180px;
    border-top: 2px inset #f1efe2;
    border-left: 2px inset #f1efe2;
    border-right: 1px solid #f1efe2;
    border-bottom: 1px solid #f1efe2;
    }
#primaryContent fieldset li.checkbox input,
#primaryContent fieldset img.captchaImage {
    margin: 0 5px 0 145px;
    }
    #primaryContent fieldset li.checkbox label {
        width: 160px;
        font-size: 0.92em;
        }
#primaryContent fieldset img.captchaImage {
    display: block;
    border: 1px solid #cccccc;
    margin-bottom: 5px;
    }
#primaryContent fieldset .submitButton {
    display: block;
    margin: 1em 0 0 auto;
    }
/*
========================================
7. Secondary Content
========================================
*/
#secondaryContent .item {
    background: url(../../SiteImages/template/itemBottom.gif) left bottom no-repeat;
    width: 170px;
    padding: 0 14px 8px;
    margin: 0 0 15px;
    }
#secondaryContent .item h2 {
    margin: 0 -14px;
    padding: 14px 15px 8px;
    background: url(../../SiteImages/template/itemTop.gif) 0 0 no-repeat;
    font: normal 1.8em/1 "FuturaBT BoldCondensed", FuturaBT, Impact, Arial, Verdana, Sans-Serif;
    line-height: 1;
    text-transform: uppercase;
    color: #0055a5;
    }
#secondaryContent .item .hr {
    margin: 0 0 5px;
    }
#secondaryContent .item p,
#secondaryContent .item ol,
#secondaryContent .item ul,
#secondaryContent .item dl {
    margin: 0 0 0.83em;
    font-size: 1.1em;
    }
    
/*
========================================
8. Home Page content
========================================
*/

#home .panels {
	padding-bottom:8px;
	position:relative;	}
	
	
.main.panel .gutter {}

	
#home .txtWhat {
	background:transparent url(../../SiteImages/txtWhatIs.png) no-repeat scroll left top;
	height:82px;
	text-indent:-999em;
	width:354px;}
	
#home .howItWorks {
	background:transparent url(../../SiteImages/txtHowItWorks.png) no-repeat scroll left top;
	height:54px;
	text-indent:-999em;
	width:127px;}
	
#home .howSmall {
	background:transparent url(../../SiteImages/txtHowSmall.png) no-repeat scroll left top;
	height:54px;
	text-indent:-999em;
	width:143px;}
	
#home .immune {
	background:transparent url(../../SiteImages/txtImmune.png) no-repeat scroll left top;
	height:54px;
	text-indent:-999em;
	width:261px;}

	
#home .mainPanel p {
	float:right;
	margin-bottom:15px;
	margin-right:-10px;}
	
#home .panel p.cta {
	font-size:1.2em;
	font-weight:bold;
	text-transform:uppercase;}
	
#home .mainPanel p.cta {
	font-size:1.6em;
	font-weight:bold;
	text-transform:uppercase;} 
	
#home .cta a {
	background:transparent url(../../SiteImages/lnk-arrow.gif) no-repeat scroll right 55%;
	padding-right:15px;}
	
#home .mainPanel .desc {
	bottom:30px;
	left:20px;
	position:absolute;
	width:354px}
	
#home .panel .desc {
	bottom:25px;
	left:30px;
	position:absolute;
	width:261px;}

#home .panel .desc p { color:#0959a3;}
	
#home .panel {
	background:transparent url(../../SiteImages/panelBG.jpg) no-repeat scroll left top;
	float:left;
	width:309px;
	height:174px;
	margin-top:27px;
	position:relative;}
	
#home .mainPanel
{
	background: url(../../SiteImages/mainPanelBG.jpg) center no-repeat;
	width:929px;
	height:247px;}
	
#primaryContent p {margin:0 0 1em;}	

#primaryContent .panel p,
#primaryContent .panel h3 {margin:0 0 0.5em;}

#primaryContent img	{ margin:1.5em 0 3em;}

#primaryContent .imgCaption {
	margin:0.1em 0 2em 0;
	text-align:center;
	display:block;}