/*
	Site:		Direct Line
	File:		/css/directline.website.css
	Version:	2009-06-25
----------------------------------------------- */


/* -----------------------------------------------
IMPORTS
----------------------------------------------- */
@import url("base.css");

/* -----------------------------------------------
STYLES
----------------------------------------------- */
body { color: #000; background: #fff; font-family: Verdana, Helvetica, Arial, sans-serif; }
a { color: #ed2230; text-decoration:none;}
a:hover{text-decoration:underline; }
h1 { font-family: 'Gill Sans','Gill Sans MT',  Verdana; }
h2 { font-family: 'Gill Sans','Gill Sans MT',  Verdana; text-transform: uppercase; }

/* Container
------------------------- */
div#Container { margin: 0 auto; width: 975px; padding:0 0 5px;}

/* Header
------------------------- */
div#Header { border-bottom: 2px solid #ed2230; padding: 15px; position: relative; }
/* Branding */
div#Header div#Branding { width: 50px; height: 49px; float: left; }
div#Header div#Branding span { background: url(../img/website/header_sprite.png); }
div#Header div#Branding a:hover span { background-position: 0 -49px; }
body.home div#Header div#Branding span { background-position: 0 0; }
/* Heading */
div#Header div#Heading { margin: 5px 0 0 15px; float: left; }
div#Header div#Heading h1 { font-size: 1.35em; text-transform: uppercase; margin: 0 0 5px 0; font-weight: bold; }
div#Header div#Heading h2 { font-size: 1.25em; text-transform: none; }
/* Nav Primary */
div#Header div#NavPrimary { float: right; }
div#Header div#NavPrimary li { float: left; margin: 0 0 0 20px; overflow: hidden; width: 50px;  }
div#Header div#NavPrimary li a { height: 49px; display: block; }
div#Header div#NavPrimary li a span { cursor:pointer;background: url(../img/website/header_sprite.png); }
/* Nav Primary - Section 1 */
div#Header div#NavPrimary li.section1 a span { background-position: -50px 0; }
div#Header div#NavPrimary li.section1 a:hover span { background-position: -50px -49px; }
div#Header div#NavPrimary li.section1.selected a span { background-position: -50px -98px; }
/* Nav Primary - Section 2 */
div#Header div#NavPrimary li.section2 a span { background-position: -100px 0; }
div#Header div#NavPrimary li.section2 a:hover span { background-position: -100px -49px; }
div#Header div#NavPrimary li.section2.selected a span { background-position: -100px -98px; }
/* Nav Primary - Section 3 */
div#Header div#NavPrimary li.section3 a span { background-position: -150px 0; }
div#Header div#NavPrimary li.section3 a:hover span { background-position: -150px -49px; }
div#Header div#NavPrimary li.section3.selected a span { background-position: -150px -98px; }
/* Nav Primary - Section 4 */
div#Header div#NavPrimary li.section4 a span { background-position: -200px 0; }
div#Header div#NavPrimary li.section4 a:hover span { background-position: -200px -49px; }
div#Header div#NavPrimary li.section4.selected a span { background-position: -200px -98px; }
/* Nav Primary - Section 5 */
div#Header div#NavPrimary li.section5 a span { background-position: -250px 0; }
div#Header div#NavPrimary li.section5 a:hover span { background-position: -250px -49px; }
div#Header div#NavPrimary li.section5.selected a span { background-position: -250px -98px; }
/* Nav Primary - Section 6 */
div#Header div#NavPrimary li.section6 a span { background-position: -300px 0; }
div#Header div#NavPrimary li.section6 a:hover span { background-position: -300px -49px; }
div#Header div#NavPrimary li.section6.selected a span { background-position: -300px -98px; }
div#Header div#SectionName { position: absolute; bottom: -20px; right: 15px; font-size: 1.2em; color: #ED2230; }

/* Main
------------------------- */
div#Main {  min-height: 450px; width:602px;padding: 25px 0; margin:auto; }
div#Main p, div#Main ul, div#Main ol{line-height:1.2em;font-size:1.1em;margin:0 0 1em;}

/* Footer
------------------------- */
div#Footer { position: relative; }
div#Footer div.links { border-top: 2px solid #ed2230; padding: 5px 0 0 0; margin: 28px 0 0 0;  }
div#Footer div.links div.share { float: left; }
div#Footer div.links ul.legal { float: right; margin: 0 245px 0 0; }
div#Footer div.links ul.legal li { display: inline; margin-left: 15px;; }
div#Footer div.links ul.legal a { text-decoration: none; color: #000; }
div#Footer div.logo { position: absolute; right: 0; top: -40px; }

/* -----------------------------------------------
HOMEPAGE
----------------------------------------------- */
body.home div#Main #WhatIsTeaMergency #Question{float:left;width:130px;}
body.home div#Main #WhatIsTeaMergency #Question h1{font-size:1.3em;text-transform:uppercase;}
body.home div#Main #WhatIsTeaMergency #Answer{float:left;width:472px;}
body.home div#Main #WhatIsTeaMergency #Answer h2{font-size:1.5em;color:#ed2230;font-weight:bold;text-transform: none;}
body.home div#Main #WhatIsTeaMergency #Answer h2 span{color:#000;font-style:italic;font-weight:normal;}
body.home div#Main #WhatIsTeaMergency #Answer div{font-size:1.2em;}
body.home div#Main #WhatToDo{margin:10px 0 15px;}

body.home div#Main #WhatToDo #WhatToDoImage{width:360px;float:left;}
body.home div#Main #WhatToDo #WhatToDoImage h2 a span { line-height: 1.3em; }
body.home div#Main #WhatToDo #WhatToDoImage h2 a{text-decoration:none;display:block;min-height:24px;background:url(../img/website/report_icon.png) left top no-repeat;margin:0 0 .5em;padding:9px 0 0 40px;font-size:1.2em;font-weight:bold;}
body.home div#Main #WhatToDo #WhatToDoImage h2 a:hover,
body.home div#Main #WhatToDo #WhatToDoImage h2 a:active{background-position:0 -66px;}
body.home div#Main #WhatToDo #WhatToDoImage h2 a:hover span,
body.home div#Main #WhatToDo #WhatToDoImage h2 a:active span{border-bottom:2px solid #ed2230; }

body.home div#Main #WhatToDo #WhatToDoText{float:left;width:221px;padding-left:21px;}
body.home div#Main #WhatToDo #WhatToDoText h2 a{text-decoration:none;display:block;min-height:24px;background:url(../img/website/map_icon.png) left top no-repeat;margin:0 0 .5em;padding:9px 0 0 40px;font-size:1.2em;font-weight:bold;}
body.home div#Main #WhatToDo #WhatToDoText h2 a:hover,
body.home div#Main #WhatToDo #WhatToDoText h2 a:active{background-position:0 -33px;}
body.home div#Main #WhatToDo #WhatToDoText h2 a:hover span,
body.home div#Main #WhatToDo #WhatToDoText h2 a:active span{border-bottom:2px solid #ed2230; }
body.home div#Main #WhatToDo #WhatToDoText p span{margin:2px 0 0;display:block;padding-left:8px;background:url(../img/website/bullet.png) left center no-repeat;color:#ed2230;}
body.home div#Main #WinAPack #WinText{float:left;width:356px;padding-right:25px;}
body.home div#Main #WinAPack #WinText h2 a{text-decoration:none;display:block;min-height:24px;background:url(../img/website/gift_icon.png) left top no-repeat;margin:0 0 .5em;padding:9px 0 0 40px;font-size:1.2em;font-weight:bold;}
body.home div#Main #WinAPack #WinText h2 a:hover,
body.home div#Main #WinAPack #WinText h2 a:active{background-position:0 -167px;}
body.home div#Main #WinAPack #WinText h2 a:hover span,
body.home div#Main #WinAPack #WinText h2 a:active span{border-bottom:2px solid #ed2230; }
body.home div#Main #WinAPack #WinImage	{float:left;width:221px;}
body.home div#Main ol{font-size:1.6em;font-weight:bold;padding:0 20px 0 20px;list-style:decimal;margin:15px 0;}
body.home div#Main ol span{font-size:.75em;font-weight:normal;}

/* -----------------------------------------------
RESEARCH
----------------------------------------------- */
body.research div#Main {padding-bottom:0;}
body.research div#TroubleResearch h1, body.research div#TroubleResearch h2{font-size:1.4em;margin:0 0 1em;text-transform:uppercase;}
body.research div#PdfLink a{margin:80px auto;text-indent:-3000px;display:block;height:130px;width:129px;background: url(../img/website/pdf_button.png);}
body.research div#PdfLink a:hover{background-position:0px -130px;}
body.research div#PdfLink a.click, body.research div#PdfLink a.click:hover{background-position:0px -130px;}
body.research div#TroubleResearch #WhyTea{float:left;width:280px;}
body.research div#TroubleResearch #WhyTea p.small{font-size:1em;}
body.research div#TroubleResearch #WhyTea ol{list-style:decimal;padding:0 0 0 20px;}
body.research div#TroubleResearch #WinText {margin: 20px 0 0 0;}
body.research div#TroubleResearch #WinText h2 {margin:0;font-size:1.2em;}
body.research div#TroubleResearch #WinText h2 a{text-decoration:none;display:block;background:url(../img/website/gift_icon.png) left top no-repeat;margin:0 0 .5em;padding:5px 0 0 40px;font-weight:bold;}
body.research div#TroubleResearch #WinText h2 a span { line-height: 1.5em; }
body.research div#TroubleResearch #WinText h2 a:hover,
body.research div#TroubleResearch #WinText h2 a:active{background-position:0 -167px;}
body.research div#TroubleResearch #WinText h2 a:hover span,
body.research div#TroubleResearch #WinText h2 a:active span{border-bottom:2px solid #ed2230;}
body.research div#TroubleResearch #TheEvidence{float:right;width:280px;}
body.research div#TroubleResearch #TheEvidence div.quote { border: 2px solid #ed2230;padding:10px;margin:0 0 15px 0;}
body.research div#TroubleResearch #TheEvidence p.cite{font-size:1em;margin:0;}
body.research div#TroubleResearch #TheEvidence blockquote{font-weight:bold;}
body.research div#TroubleResearch #TheEvidence a{font-weight:bold;}
body.research div#TroubleResearch #TheEvidence a:hover,
body.research div#TroubleResearch #TheEvidence a:active{text-decoration:none;}
body.research div#TroubleResearch #TheEvidence a:hover span,
body.research div#TroubleResearch #TheEvidence a:active span{border-bottom:2px solid #ed2230;}


/* -----------------------------------------------
BLEND
----------------------------------------------- */
body.blend #BlendThumbs{margin:0 0 1em;}
body.blend #BlendThumbs img{margin:0 0 0 13px;}
body.blend #BlendThumbs img.first{margin:0;}
body.blend h1{font-size:1.2em;margin:0 0 1em;}
body.blend #BlendSecondary{margin:3em 0 0;}
body.blend #BlendSecondary #Poster{width:277px;float:left;}
body.blend #BlendSecondary #WinDownload{padding:0 0 0 30px;width:295px;float:left;}
body.blend #BlendSecondary #WinDownload h2{font-size:1.5em;font-weight:bold;margin:0 0 .5em;text-transform:uppercase;}
body.blend #BlendSecondary #WinDownload div.desktop{float:left;width:98px;}
body.blend #BlendSecondary #WinDownload div.desktop h3{margin:0 0 .3em;font-weight:bold;font-size:1.2em;}
body.blend #BlendSecondary #WinDownload div.desktop li{margin:0 0 .2em;}
body.blend #BlendSecondary #WinDownload h2.wintea{font-size:1.2em;text-transform:uppercase;}
body.blend #BlendSecondary #WinDownload h2.wintea a{text-decoration:none;display:block;min-height:40px;background:url(../img/website/gift_icon.png) left top no-repeat;margin:0 0 1.2em .6em;padding:0 0 0 40px;font-weight:bold;}
body.blend #BlendSecondary #WinDownload h2.wintea a span { line-height: 1.5em; }
body.blend #BlendSecondary #WinDownload h2.wintea a:hover,
body.blend #BlendSecondary #WinDownload h2.wintea a:active{background-position:0 -167px;}
body.blend #BlendSecondary #WinDownload h2.wintea a:hover span,
body.blend #BlendSecondary #WinDownload h2.wintea a:active span{border-bottom:2px solid #ed2230;}
body.blend #BlendSecondary #WinDownload h2.download{text-decoration:none;display:block;min-height:26px;background:url(../img/website/download_icon.png) left top no-repeat;margin:1.5em 0 1.2em .6em;padding:7px 0 0 40px;font-size:1.2em;font-weight:bold;}
body.blend #BlendSecondary #WinDownload li{margin-right:13px;float:left;display:inline;}
body.blend #BlendSecondary #WinDownload li a{float:left;display:block;background:url(../img/website/desktop_icons.png);}
body.blend #BlendSecondary #WinDownload li.desktop-320x240 a{background-position:-10px 0;width:31px;height:52px;}
body.blend #BlendSecondary #WinDownload li.desktop-320x240 a:hover{background-position:-10px -115px;}
body.blend #BlendSecondary #WinDownload li.desktop-1440x900 a{background-position:-58px 0;width:66px;height:52px;}
body.blend #BlendSecondary #WinDownload li.desktop-1440x900 a:hover{background-position:-58px -115px;}
body.blend #BlendSecondary #WinDownload li.desktop-1280x1024 a{background-position:-140px 0;width:66px;height:41px;}
body.blend #BlendSecondary #WinDownload li.desktop-1280x1024 a:hover{background-position:-140px -115px;}
body.blend #BlendSecondary #WinDownload li.desktop-1024x768 a{background-position:-223px 0;width:52px;height:39px;}
body.blend #BlendSecondary #WinDownload li.desktop-1024x768 a:hover{background-position:-223px -115px;}
body.blend #BlendSecondary #WinDownload li.desktop-1280x800 a{margin-top:15px;background-position:0px -69px;width:73px;height:46px;}
body.blend #BlendSecondary #WinDownload li.desktop-1280x800 a:hover{background-position:0px -184px;}
body.blend #BlendSecondary #WinDownload li.desktop-1650x1050 a{margin-top:8px;background-position:-88px -62px;width:85px;height:53px;}
body.blend #BlendSecondary #WinDownload li.desktop-1650x1050 a:hover{background-position:-88px -177px;}
body.blend #BlendSecondary #WinDownload li.desktop-1920x1200 a{background-position:-188px -54px;width:97px;height:61px;}
body.blend #BlendSecondary #WinDownload li.desktop-1920x1200 a:hover{background-position:-188px -169px;}


/* -----------------------------------------------
MEET
----------------------------------------------- */
body.meet div#TeaTips{width:343px;margin:auto;}
body.meet div#TeaTips h1{text-transform:uppercase;height:215px;background: url(../img/website/tea_tips.png);font-size:1.4em;margin:0 0 1em;}
body.meet div#TeaTips h2{font-size:1.4em;margin:1.5em 0;}
body.meet div#TeaTips ul{list-style:disc;padding:0 0 0 15px;}
body.meet div#TeaTips ul li{margin:0 0 1em;}
body.meet div#TeaTips h2.winabox, body.meet div#TeaTips h2.findoutmore{font-size:1.2em;}

body.meet div#TeaTips h2.winabox a{text-decoration:none;display:block;min-height:24px;background:url(../img/website/gift_icon.png) left top no-repeat;margin:0 0 1.2em 1em;padding:9px 0 0 40px;font-weight:bold;text-transform:uppercase;}
body.meet div#TeaTips h2.winabox a:hover,
body.meet div#TeaTips h2.winabox a:active{background-position:0 -167px;}
body.meet div#TeaTips h2.winabox a:hover span,
body.meet div#TeaTips h2.winabox a:active span{border-bottom:2px solid #ed2230;}

body.meet div#TeaTips h2.findoutmore a{text-decoration:none;display:block;min-height:24px;background:url(../img/website/tea_icon.png) left top no-repeat;margin:0 0 1.2em 1em;padding:9px 0 0 40px;font-weight:bold;text-transform:uppercase;}
body.meet div#TeaTips h2.findoutmore a:hover,
body.meet div#TeaTips h2.findoutmore a:active{background-position:0 -33px;}
body.meet div#TeaTips h2.findoutmore a:hover span,
body.meet div#TeaTips h2.findoutmore a:active span{border-bottom:2px solid #ed2230;}

body.meet div#TeaTips p.visitwebsite{text-align:right;font-size:1.2em;font-family: 'Gill Sans','Gill Sans MT',  Verdana;}
body.meet div#TeaTips p.visitwebsite a{font-weight:bold;}
body.meet div#TeaTips p.visitwebsite a:hover{text-decoration:none;}
body.meet div#TeaTips p.visitwebsite a:hover span,
body.meet div#TeaTips p.visitwebsite a:active span{border-bottom:2px solid #ed2230;}

/* -----------------------------------------------
TWITTER
----------------------------------------------- */
body.twitter #Columns { position: relative; }
body.twitter #Map { float: left; }
body.twitter #Map #GoogleMap { width:470px; height:700px; margin: 0 0 10px 0; }
body.twitter #Map #GoogleMap div.tweet { color: #cc0000; padding: 0 0 0 58px; position: relative; min-height: 85px; }
body.twitter #Map #GoogleMap div.tweet img { position: absolute; top: 0; left: 0; }
body.twitter #Info { float: right;  width: 120px; }
body.twitter #Info div.base { position: absolute; bottom: 0; width: 120px; }
body.twitter div.fact { position: absolute; top: 0; width: 110px; left: -120px; text-align: right; }
body.twitter div.fact strong { display: block;  margin: 0 0 0 0; text-transform:uppercase;font-family: 'Gill Sans','Gill Sans MT',  Verdana; font-size: 1.2em; }
body.twitter h2.winabox {font-size:1.2em;text-transform:uppercase;}
body.twitter h2.winabox a{text-decoration:none;display:block;min-height:24px;background:url(../img/website/gift_icon.png) left top no-repeat;margin:0 0 1.2em 1em;padding:9px 0 0 40px;font-weight:bold;}
body.twitter h2.winabox a:hover,
body.twitter h2.winabox a:active{background-position:0 -167px;}
body.twitter h2.winabox a:hover span,
body.twitter h2.winabox a:active span{border-bottom:2px solid #ed2230;}
body.twitter h2.twitter {font-size:1.2em;text-transform:uppercase;}
body.twitter h2.twitter a{text-decoration:none;display:block;min-height:24px;background:url(../img/website/twitter_icon_small.png) left top no-repeat;margin:0 0 1.2em 1em;padding:9px 0 0 40px;font-weight:bold;}
body.twitter h2.twitter a:hover,
body.twitter h2.twitter a:active{background-position:0 -33px;}
body.twitter h2.twitter a:hover span,
body.twitter h2.twitter a:active span{border-bottom:2px solid #ed2230;}

/* -----------------------------------------------
CONTACT
----------------------------------------------- */
body.contact div#ContactDetails{width:340px;margin:180px auto 0;}
body.contact div#ContactDetails p.link {font-weight:bold;}

/* -----------------------------------------------
TERMS
----------------------------------------------- */
body.terms{background:#fff;}
body.terms div#Header{border-color:#000;}
body.terms div#Header h1, body.terms div#Header h2{color:#000;}
body.terms #Main h2{color:#000;font-size:1.6em;font-weight:bold;margin:0 0 1em;padding: 0 0 5px 0;text-transform:uppercase;}
body.terms #Main h3{color:#000;font-size:1.1em;font-weight:bold;margin:0 0 1em;}
body.terms #Main p{color:#000;}
body.terms #Main a{color:#000;text-decoration:underline;}
body.terms #Main p.indent{padding-left:25px;}
body.terms #Main li { color:#000; background: url(../img/website/terms_li.png) no-repeat left 3px; padding: 0 0 0 10px; margin: 0 0 5px 0; }
body.terms div#Header div#Branding span { background: url(../img/website/header_sprite_terms.png); }
body.terms div#NavPrimary { display: none; }
body.terms div#Footer { display: none; }

/* -----------------------------------------------
WINTEA
----------------------------------------------- */
body.win div#GiveAway{float:left;width:273px;padding-right:29px;}
body.win div#Twitter h2, body.win div#GiveAway h2, body.win div#GiveAway h3{font-size:1.4em;margin:0 0 1em;text-transform:uppercase;}
body.win div#GiveAway p strong{font-weight:bold;}
body.win div#Twitter{float:left;width:300px;}
body.win div#Twitter h2.follow{font-size:1.2em;}
body.win div#Twitter h2.follow a{text-decoration:none;display:block;min-height:33px;background:url(../img/website/twitter_icon.png) left top no-repeat;margin:0 0 1.2em 0;padding:15px 0 0 56px;font-weight:bold;}
body.win div#Twitter h2.follow a:hover,
body.win div#Twitter h2.follow a:active{background-position:0 -49px;}
body.win div#Twitter h2.follow a:hover span,
body.win div#Twitter h2.follow a:active span{border-bottom:2px solid #ed2230;}

body.win div#Twitter p.join-twitter{margin:0 0 2.2em;}
body.win div#Twitter p.terms-link{margin:4em 0 1em;}
body.win div#Twitter p.join-twitter a, body.win div#Twitter p.terms-link a{font-weight:bold;}
body.win div#Twitter #Recent p{font-size:1.1em;margin:0 0 1.8em;}
body.win div#Twitter #Recent p img{float:left;margin-right:8px;display;inline;}
body.win div#Twitter #Recent p span{padding-left:8px;background:url(../img/website/bullet.png) left center no-repeat;margin:.5em 0 0;clear:left;display:block;font-size:.9em;}

body.trivia blockquote h1{font-size:2.5em;margin:0 0 .5em;font-family: 'Gill Sans','Gill Sans MT',  Verdana; line-height: 1.1em;}
body.trivia div#TeaFacts{float:left;width:390px;padding-right:30px;}
body.trivia div#TeaFacts a{display:block;font-weight:bold;}
body.trivia div#TeaFacts ul{list-style:disc;padding:0 0 0 15px;margin:0 0 2em;}
body.trivia div#TeaFacts ul li{margin:0 0 1em;}
body.trivia div#BrewTube h2, body.trivia div#TeaFacts h2{font-size:1.4em;margin:1em 0;}
body.trivia div#BrewTube{float:left;width:182px;}
body.trivia div#BrewTube h3{font-size:1.2em;}