/* Trunki Stylesheet 2009 */

html{height: 100%;}
body{height: 100%;}

body{margin: 0; padding: 0 0 0 0; font-family: Arial, Helvetica, sans-serif; background: url(../images/bg/bg_sun.jpg) 255px 0 no-repeat;}
form{margin: 0; padding: 0;}

/* *************************************************************
WRAP - Used to position footer in the bottom
************************************************************* */
/* #wrap{min-height: 100%; width: 955px; height: auto !important; height: 100%; margin: 0 0 -123px; border: 1px solid #000;} */

#nonFooter{position: relative; min-height: 100%; }
* html #nonFooter{height: 100%;}

#wrap{width: 955px; padding-bottom: 123px;}

/* *************************************************************
CONTENT WRAP
************************************************************* */
#contentWrap{float: right; width: 670px;}


/* *************************************************************
HEADER
************************************************************* */
.logo{ float: left; margin: 10px 0 0 10px;}
.header_buyNow{ float: left; margin: 35px 0 0 60px;}

#navigation{ float: left; width: 670px; margin: 15px 0 0 0;}

#topNavWrap{ border-style: solid; border-width: 1px 1px 0 1px; border-color: #F49300; float: left; width: 668px;}
#topNav{ float: left; width: 666px; border: 1px solid #FFF0C4;}
#topNav ul{ float: left; list-style: none; width: 666px; margin: 0; padding: 0; height: 38px; background: url(../images/nav/bg_top-nav.jpg) 0 0 repeat-x;}
#topNav li{ float: left; margin: 0; padding: 0;}
#topNav li a{ float: left; display: block; height: 38px; overflow: hidden; padding: 0 15px; border-left: 1px solid #F9AE00; border-right: 1px solid #FEF47F;}
#topNav li.end{ float: left; height: 38px; border-left: 1px solid #F9AE00;}

#topNav a:hover, #topNav a.active{ background: url(../images/nav/bg_top-nav.jpg) 0 -38px repeat-x;}
#topNav a:hover img, #topNav a.active img{ margin-top: -38px;}

#subNav{ float: left; width: 668px; border: 1px solid #F49300; background: url(../images/bg/bg_sub-nav.jpg) 0 0 repeat-x; height: 29px;}
#subNav ul{float: left; width: 668px; list-style: none; height: 29px; margin: 0; padding: 0;}
#subNav li{ float: left; color: #fff; font-size: 55%; text-transform: uppercase;}
#subNav li a{ text-decoration: none; color: #fff; margin: 6px 5px 0 10px; float: left; padding: 5px 0 3px 0;}
#subNav li a:hover{ text-decoration: underline; color: #FF6; }

#subNav li a.my_account{ background: url(../images/icons/icons.gif) 0 4px no-repeat; padding-left: 11px;}
#subNav li a.customer_service{ background: url(../images/icons/icons.gif) 0 -15px no-repeat; padding-left: 16px;}
#subNav li a.privacy{ background: url(../images/icons/icons.gif) 0 -34px no-repeat; padding-left: 10px;}
#subNav li a.returns{ background: url(../images/icons/icons.gif) 0 -55px no-repeat; padding-left: 15px;}
#subNav li a.sitemap{ background: url(../images/icons/icons.gif) 0 -75px no-repeat; padding-left: 15px;}

#subNav li.items{ float: right;}
#subNav li a.checkout{ background: url(../images/icons/icons.gif) 0 -94px no-repeat; padding-left: 22px; margin-right: 10px;}

#awards{ float: right; width: 200px; margin: 15px 0 0 0;}
#awards ul{ float: right; margin: 0; padding: 0; list-style: none;}
#awards li{ float: right; margin: 0 0 0 10px; padding: 0; }
#awards a{ float: left; display: block; height: 22px;}
#awards a.home{ background: url(../images/icons/icon_home.gif) 0 0 no-repeat; width: 23px;}
#awards a.contact{ background: url(../images/icons/icon_email.gif) 0 6px no-repeat; width: 22px;}
#awards a.tv{ background: url(../images/icons/icon_tv.gif) 0 1px no-repeat; width: 22px;}
#awards a.awards{ background: url(../images/icons/icon_awards.gif) 0 0 no-repeat; width: 21px;}


/* *************************************************************
FLAGS
************************************************************* */

#flags{ float: right; width: 250px; text-align: right; margin: 10px 0 0 0;}
#flags a{ margin: 0 0 0 3px; float: right; width: 25px; height: 25px;}
#flags a.EN, #flags a.US, #flags a.FR, #flags a.DK, #flags a.IT, #flags a.JP, #flags a.CH, #flags a.KO
{ background-image: url(../images/icons/icon_flags.png); background-repeat: no-repeat;}

#flags a.EN{background-position: 0 -25px;}
#flags a.EN:hover, #flags a.EN.active{ background-position: 0 0;}

#flags a.US{ background-position: -27px -25px}
#flags a.US:hover, #flags a.US.active{ background-position: -27px 0;}

#flags a.FR{ background-position: -54px -25px;}
#flags a.FR:hover, #flags a.FR.active{ background-position: -54px 0;}

#flags a.DK{ background-position: -81px -25px;}
#flags a.DK:hover, #flags a.DK.active{ background-position: -81px 0;}

#flags a.IT{ background-position: -108px -25px;}
#flags a.IT:hover, #flags a.IT.active{ background-position: -108px 0;}

#flags a.JP{ background-position: -135px -25px;}
#flags a.JP:hover, #flags a.JP.active{ background-position: -135px 0;}

#flags a.CH{background-position: -162px -25px;}
#flags a.CH:hover, #flags a.CH.active{ background-position: -162px 0;}

#flags a.KO{ background-position: -187px -25px;}
#flags a.KO:hover, #flags a.KO.active{ background-position: -187px 0;}

/*
#flags{ float: left; width: 100%; text-align: right; margin: 10px 0 10px 0;}
#flags a{ margin: 0 0 0 3px; float: left; width: 25px; height: 25px;}
#flags a.EN, #flags a.US, #flags a.FR, #flags a.DK, #flags a.IT, #flags a.JP, #flags a.CH, #flags a.KO{ background-image: url(../../images/icons/icon_flags.png); background-repeat: no-repeat;}

#flags a.EN{background-position: 0 0;}
#flags a.EN:hover, #flags a.EN.active{ background-position: 0 -25px;}

#flags a.US{ background-position: -27px 0}
#flags a.US:hover, #flags a.US.active{ background-position: -27px -25px;}

#flags a.FR{ background-position: -54px 0;}
#flags a.FR:hover, #flags a.FR.active{ background-position: -54px -25px;}

#flags a.DK{ background-position: -81px 0;}
#flags a.DK:hover, #flags a.DK.active{ background-position: -81px -25px;}

#flags a.IT{ background-position: -108px 0;}
#flags a.IT:hover, #flags a.IT.active{ background-position: -108px -25px;}

#flags a.JP{ background-position: -135px 0;}
#flags a.JP:hover, #flags a.JP.active{ background-position: -135px -25px;}

#flags a.CH{background-position: -162px 0;}
#flags a.CH:hover, #flags a.CH.active{ background-position: -162px -25px;}

#flags a.KO{ background-position: -187px 0;}
#flags a.KO:hover, #flags a.KO.active{ background-position: -187px -25px;}
*/
/* *************************************************************
MAIN PIC + OPTIONS ON LEFT
************************************************************* */
#subContent{ float: left; width: 285px;}
#quote h1{ font-size: 75%; margin: 0; color: #F90; padding: 20px 20px 0 30px; width: 210px;}
#quote h2{ font-size: 75%; margin: 0; color: #F60; font-weight: bold; padding: 5px 0 0 30px; width: 230px; clear: both;}

#options{ float: left; width: 240px; clear: left; padding: 20px 0 0 0; margin: 20px 0 0 20px; border-top: 1px dotted #ccc;}
#options ul{ float: left; width: 245px; margin: 0 0 0 0; padding: 0; list-style: none;}
#options li{ font-size: 90%; width: 200px; margin: 0 0 15px 0; padding: 0 0 0 45px; float: left; display: block; clear: both;}
#options li a{ text-decoration: none; font-weight: bold;}
#options li a span{ font-size: 75%; font-weight: normal; float: left; display: block;}

#options li.passport{ background: url(../images/icons/icon_passport.gif) 5px 0 no-repeat;}
#options li.passport a{ color: #F60;}
#options li.passport a:hover{ color: #F30; text-decoration: underline;}
#options li.subscribe{ background: url(../images/icons/icon_subscribe.gif) 2px 0 no-repeat;}
#options li.subscribe a{ color: #7ABD21;}
#options li.subscribe a:hover{ color: #690; text-decoration: underline;}
#options li.recommend{ background: url(../images/icons/icon_recommend.gif) 0 0 no-repeat;}
#options li.recommend a{ color: #006AB5;}
#options li.recommend a:hover{ color: #039; text-decoration: underline;}

#bookmarking{ float: left; width: 240px; clear: left; padding: 20px 0 0 0; margin: 10px 0 0 20px; border-top: 1px dotted #ccc;}


/* *************************************************************
MAIN CONTENT
************************************************************* */
/* #contentBodyWrap{ float: left; width: 670px; border-width: 0 0px; border-style: solid; border-color: #fff;} */
#contentBodyWrap{ float: left; width: 653px; background: #FFFDF4 url(../images/bg/bg_content.jpg) 0 0 repeat-x; border-color: #FFEEBC #F49300 #F49300 #F49300; border-style: solid; border-width: 1px 1px 0 1px; padding: 15px 0 10px 15px;}
#contentBody{ float: left; width: 320px;}

h1{ margin: 5px 0 0 0; padding: 0; width: 320px; float: left;}
#contentBodyWrap h1 { font-size: 150%; color: #F60; margin: 5px 0 10px 0; padding: 0; width: auto; float: left; letter-spacing: -0.03em; font-weight: normal;}
h2{color: #005CB6; font-size: 100%; margin: 0 0 10px 0; padding: 0; width: 320px; float: left; font-weight: bold; clear: left;}

#contentBody h3{ color: #09F; font-size: 110%; font-weight: normal; margin: 10px 0 5px 0; float: left; width: 235px;}
#contentBody p{ float: left; width: 100%;}

p{color: #005CB6; font-size: 75%; line-height: 150%; clear: both; margin: 0 0 10px 0; padding: 0;}
/*#contentBodyWrap p a{ color: #690; }
#contentBodyWrap p a:hover{ color: #F60; }*/

li{color: #005CB6; font-size: 75%;}

#contentFooter{ float: left; width: 670px; height: 8px; background: url(../images/bg/bg_content-footer.gif) 0 0 no-repeat; }



/* INDIVIDUAL PAGE STYLES ***************** */
body#products #subNav{ background-image: url(../images/bg/bg_sub-nav_products.jpg); border: 1px solid #C42215;}
body#products #contentBodyWrap {background: #fff url(../images/bg/bg_content_products.jpg) 0 0 repeat-x; border-color: #FFDCEC #F757AF #F757AF #F757AF;}
body#products #contentFooter{ background: url(../images/bg/bg_content-footer_products.gif) 0 0 no-repeat; }

body#news #subNav{ background-image: url(../images/bg/bg_sub-nav_news.jpg); border: 1px solid #5A21A0;}
body#news #contentBodyWrap {background: #FDF9FB url(../images/bg/bg_content_news.jpg) 0 0 repeat-x; border-color: #E4C5E3 #985FDE #985FDE #985FDE;}
body#news #contentFooter{ background: url(../images/bg/bg_content-footer_news.gif) 0 0 no-repeat; }

body#friends #subNav{ background-image: url(../images/bg/bg_sub-nav_friends.jpg); border: 1px solid #305791;}
body#friends #contentBodyWrap {background: #F7F7FF url(../images/bg/bg_content_friends.jpg) 0 0 repeat-x; border-color: #B5BACB #4677C1 #4677C1 #4677C1;}
body#friends #contentFooter{ background: url(../images/bg/bg_content-footer_friends.gif) 0 0 no-repeat; }

body#questions #subNav{ background-image: url(../images/bg/bg_sub-nav_questions.jpg); border: 1px solid #267DFF; }
body#questions #contentBodyWrap {background: #FBFBFC url(../images/bg/bg_content_questions.jpg) 0 0 repeat-x; border-color: #AABFEE #62A0FF #62A0FF #62A0FF;}
body#questions #contentFooter{ background: url(../images/bg/bg_content-footer_questions.gif) 0 0 no-repeat; }

body#fun #subNav{ background-image: url(../images/bg/bg_sub-nav_fun.jpg); border: 1px solid #7EAB12; }
body#fun #contentBodyWrap {background: #F0F8DA  url(../images/bg/bg_content_fun.jpg) 0 0 repeat-x; border-color: #D2E995 #7EAB12 #7EAB12 #7EAB12;}
body#fun #contentFooter{ background: url(../images/bg/bg_content-footer_fun.gif) 0 0 no-repeat; }

/* body#tips #subNav{ background-image: url(../images/bg/bg_sub-nav_tips.gif); border: 1px solid #C42215; }
body#tips #contentBodyWrap {background-image: url(../images/bg/bg_content_tips.jpg); border-color: #EDA093;}
body#tips #contentFooter{ background: url(../images/bg/bg_content-footer_tips.gif) 0 0 no-repeat; } */

body#tips #subNav{ background-image: url(../images/bg/bg_sub-nav_press.jpg); border: 1px solid #267F14; }
body#tips #contentBodyWrap {background: #ECF5DE url(../images/bg/bg_content_press.jpg) 0 0 repeat-x; border-color: #B0D79D #267F14 #267F14 #267F14;}
body#tips #contentFooter{ background: url(../images/bg/bg_content-footer_press.gif) 0 0 no-repeat; }

body#about #subNav{ background-image: url(../images/bg/bg_sub-nav_about.jpg); border: 1px solid #C42215; }
body#about #contentBodyWrap {background: #FDF5F3 url(../images/bg/bg_content_about.jpg) 0 0 repeat-x; border-color: #E8C8C3 #C42215 #C42215 #C42215;}
body#about #contentFooter{ background: url(../images/bg/bg_content-footer_about.gif) 0 0 no-repeat; }


/* *************************************************************
VIDEO
************************************************************* */
#video{ float: right; width: 290px; margin: 0 15px 0 0;}

/* *************************************************************
NEWS ON HOMEPAGE
************************************************************* */
#hp_news_wrap{float: right; width: 290px; margin: 15px 15px 0 0; background: #FFFDF4 url(../images/bg/bg_hp_news.jpg) left bottom repeat-x;border-bottom: 1px solid #FFCC00; }
#hp_news{ float: left; width: 270px; background: url(../images/bg/bg_news_talk.gif) 0 0 no-repeat; border-bottom: 1px solid #fff; padding: 10px 10px 10px 10px;}
#hp_news img{ float: left;}
#hp_news h2{ float: left; margin: 10px 0 0px 0; padding: 0;}
#hp_news h3{ font-size: 75%; color: #F60; margin: 5px 0 0 0; padding: 0; font-weight: normal; float: left; clear: both; width: 100%;}
#hp_news p{ font-size: 70%; color: #444; margin: 5px 0 0 0; padding: 0; float: left; clear: both; width: 100%;}
#hp_news p a{ color: #F60; text-transform: uppercase;}
#hp_news p a:hover{ color: #000;}
#div_container {position:relative;290px;height:120px;z-index:1;overflow:hidden;}
#Layer2 {position:relative;width:290px;height:22px;z-index:2;}


/* *************************************************************
CONTENT BODY FOR TIPS, QUESTIONS & FUN
************************************************************* */
body#about #contentBody,
body#tips #contentBody,
body#fun #contentBody,
body#questions #contentBody{ width: 240px;}
#contentBodyList{ float: right; width: 370px; padding: 0 0 0 20px;}
/* body#tips #contentBodyList{border-left: 1px dotted #9C0;} */


#contentBodyList img{ margin: 0 0 0 20px; float: left;}
#contentBodyList h2{ float: left; width: 320px; margin: 0; padding: 0; color: #09F; font-size: 100%; font-weight: bold;}
#contentBodyList #scroll { float: left; height: 470px; margin: 15px 10px 0 0; overflow: auto; width: 350px;}
#contentBodyList p a{ color: #06F; }
#contentBodyList p a:hover{ color: #F09; }

#contentList { margin: 10px 0 10px 0; float: left;}
#contentList ul{ float: left; width: 240px; margin: 0; padding: 0; list-style: none;}
#contentList li{ float: left; width: 240px; margin: 0 0 0px 0; padding: 0; font-size: 90%; color: #fff; letter-spacing: -0.03em;}
#contentList li a{ color: #fff; font-weight: bold; text-decoration: none; float: left; width: 225px; display: block; line-height: 200%; padding: 14px 0 5px 15px; background-position: 0 0; background-repeat: no-repeat;}
#contentList li ul{ margin: 5px 0 0 10px;}
#contentList li li{ font-size: 85%; margin: 0 0 3px 0; color: #F3C; letter-spacing: normal;}
#contentList li li a{color: #F3C; text-decoration: none; padding: 0 0 0 10px; line-height: 140%; background: none;}
#contentList li li a:hover{ color: #000;}


/* *************************************************************
FUN
************************************************************* */
.funList { float: left; width: 320px; margin: 10px 0 0px 0; padding: 10px 0 0 0; border-top: 1px dotted #9C0; clear: both;}
.funList h3{ float: left; width: 320px; margin: 0 0 5px 0; padding: 0; color: #F09; font-size: 75%; font-weight: bold;}
.funList img{ float: left;}
.funList p{ font-size: 70%; color: #005CB6; float: left; width: 320px; margin: 0 0 0 0; padding: 0; line-height: 150%;}

p.footnote{ margin: 30px 0 0 0; float: left; }

/* *************************************************************
TIPS
************************************************************* */
.tipsList { float: left; width: 320px; margin: 10px 0 0px 0; padding: 10px 0 0 0; border-top: 1px dotted #9C0; clear: both;}
.tipsList h3{ float: left; width: 100%; margin: 0 0 5px 0; padding: 0; color: #F09; font-size: 75%; font-weight: bold;}
.tipsList img{ float: left;}
.tipsList p{ font-size: 70%; color: #005CB6; float: left; width: 100%; margin: 0 0 0 0; padding: 0; line-height: 150%;}

a.downloads{ float: left; width: auto; white-space: nowrap; color: #690; padding: 0 0 0 15px; margin: 15px 0 0 5px; font-size: 100%; font-weight: bold; background: url(../images/icons/icons.gif) 0 -113px no-repeat; text-decoration: none}
a.downloads:hover{ text-decoration: underline; color: #360;}


/* *************************************************************
NEWS
************************************************************* */
.newsList { float: left; width: 650px; margin: 15px 0 0px 0; padding: 15px 0 0 0; border-top: 1px dotted #C891FF;}
.newsList h3{ float: left; width: 650px; margin: 0 0 5px 0; padding: 0; color: #F09; font-size: 75%; font-weight: bold;}
.newsList img{ float: left;}
.newsList p{ font-size: 70%; float: left; width: 510px; margin: 0 0 0 10px; padding: 0; color: #639; line-height: 150%; clear: none; display: inline;}
.newsList p a{ color: #690; }
.newsList p a:hover{ color: #F60; }


/* *************************************************************
AWARDS
************************************************************* */
.awardsList { float: left; width: 300px; margin: 15px 20px 0px 5px; padding: 15px 0 0 0; border-top: 1px dotted #C891FF;}
.awardsList h3{ float: left; width: 295px; margin: 0 0 10px 0; padding: 0; color: #005CB6; font-size: 80%; font-weight: bold;}
.awardsList img{ float: left;}
.awardsList p{ font-size: 70%; float: left; width: 190px; margin: 0 0 0 10px; padding: 0; color: #639; line-height: 150%; clear: none; display: inline;}


/* *************************************************************
QUESTIONS
************************************************************* */
.questionsList { float: left; width: 320px; margin: 10px 0 5px 0; padding: 0px 0 0 0; }
.questionsList h3{ float: left; width: 100%; margin: 0 0 5px 0; padding: 0; color: #F09; font-size: 75%; font-weight: bold;}
.questionsList img{ float: left;}
.questionsList p{ font-size: 70%; color: #005CB6; float: left; width: 100%; margin: 0 0 0 0; padding: 0; line-height: 150%;}

body#questions #contentList li a{ height: 90px; background-position: top center;}
body#questions #contentList li li a{ height: auto;}
body#questions #contentList li span{ display: none;}
body#questions #contentList li ul{ margin: 5px 0 15px 10px;}


/* *************************************************************
INTERNATIONAL
************************************************************* */
.internationalList{ float: left; width: 325px; margin: 10px 0 10px 0; padding: 5px 0 10px 0; display: inline;}
.internationalList img{ float: left; margin: 0 10px 0 0;}
.internationalList h2{ float: left; width: 260px; margin: 0 0 5px 0; padding: 0; color: #F09; font-size: 95%; font-weight: normal; clear: none;}
.internationalList p{ font-size: 70%; color: #005CB6; float: left; width: 260px; margin: 0 0 3px 0; padding: 0; line-height: 150%; clear: none;}
.internationalList p a{ margin: 0 0 0 0; font-weight: normal; color: #690}
.internationalList p a:hover{ color: #F60;}


/* *************************************************************
FRIENDS
************************************************************* */
.friendsList { float: left; width: 300px; margin: 10px 20px 5px 5px; padding: 15px 0 0 0; border-top: 1px dotted #C891FF;}
.friendsList h2{ float: left; width: 295px; margin: 0 0 5px 0; padding: 0; color: #F09; font-size: 75%; font-weight: bold;}
.friendsList img{ float: left; margin: 0 10px 0 0;}
.friendsList p{ font-size: 70%; color: #666; float: left; width: 300px; margin: 0 0 0 0; padding: 0; color: #639; line-height: 150%;}



/* NEWSLETTER ARCHIVE NAVIGATION */

#newsletterNav ul { float: left; width: 150px; height: 27px; margin: 0; padding: 0; list-style: none; clear: left;}
#newsletterNav a{ width: auto; text-decoration: none; padding: 0; text-align: left; margin: 0; color: #fff;}

#newsletterNav li {float: left; margin: 0; padding: 0; width: auto; color: #DAF5FE; font-size: 100%; line-height: 100%; font-weight: normal; white-space: nowrap;}
#newsletterNav li a{ color: #CCC; padding: 0;}

#newsletterNav li ul {position: absolute; left: -999em; height: auto; width: 300px; font-weight: normal; padding: 0; margin: 0;}
#newsletterNav li li {padding: 0 0 0 10px; line-height: 200%; background-color: #09C; font-size: 70%; width: 280px; float: left;}

#newsletterNav li li a{padding: 0; color: #fff; text-decoration: none;}
#newsletterNav li li a:hover{ color: #036; }

#newsletterNav li:hover ul ul, #newsletterNav li:hover ul ul ul, #newsletterNav li.sfhover ul ul, #newsletterNav li.sfhover ul ul ul {left: -999em;}
#newsletterNav li:hover ul, #newsletterNav li li:hover ul, #newsletterNav li li li:hover ul, #newsletterNav li.sfhover ul, #newsletterNav li li.sfhover ul, #newsletterNav li li li.sfhover ul {	left: auto;}


/* *************************************************************
PASSPORT DOWNLOADS
************************************************************* */
.passportList{ float: left; width: 325px; margin: 10px 0 10px 0; padding: 5px 0 10px 0; display: inline;}
.passportList.passport{ background: url(../images/icons/icon_passport.png) 0 0 no-repeat;}
.passportList.diary{ background: url(../images/icons/icon_diary.png) 0 0 no-repeat;}
.passportList.log{ background: url(../images/icons/icon_log.png) 0 0 no-repeat;}
.passportList.car{ background: url(../images/icons/icon_car.png) 0 0 no-repeat;}
.passportList.plane{ background: url(../images/icons/icon_plane.png) 0 0 no-repeat;}
.passportList.boat{ background: url(../images/icons/icon_boat.png) 0 0 no-repeat;}
.passportList.hatch{ background: url(../images/icons/icon_hatch.png) 0 0 no-repeat; clear: left;}

.passportList h3{ float: left; width: 200px; margin: 0 0 5px 85px; padding: 0; color: #F09; font-size: 95%; font-weight: normal;}
.passportList p{ font-size: 75%; color: #005CB6; float: left; width: 220px; margin: 0 0 3px 85px; padding: 0; line-height: 150%;}
.passportList a.downloads{ margin: 0 0 0 0; font-weight: normal;}
.passportList a.downloads:hover{ color: #F60;}


/* *************************************************************
PRESS
************************************************************* */
#pressList { float: left; margin: 10px 0 0 0;}
#pressList img{ float: left;}
#pressList a{ float: left; margin: 0 8px 8px 0; border: 1px solid #9C6; padding: 1px;}
#pressList a:hover{ border: 1px solid #060;}

.speech{ float: left; width: 203px; margin: 0 13px 0 0;}
.speech img{ float: left; clear: both;}
.speech p{ font-size: 70%; color: #fff; float: left; width: 173px; padding: 0 15px; margin: 0; line-height: 140%;}
.speech p a{ text-decoration: none; color: #fff;}
.pink { background: url(../images/misc/speech_pink_bg.jpg) 0 12px no-repeat; margin-top: 5px;}
.blue { background: url(../images/misc/speech_blue_bg.jpg) 0 12px no-repeat; margin-top: -50px;}
.orange { background: url(../images/misc/speech_orange_bg.jpg) 0 12px no-repeat; margin-top: -30px;}


/* *************************************************************
ABOUT US
************************************************************* */
#contentBodyList #logo_magmatic{float: right; margin: 0 20px 20px 0; padding: 5px 10px; background-color: #fff; border: 1px solid #F99;}
body#about #contentBodyList p{ width: 340px; text-align: justify;}

body#about #contentBodyList { width: 380px;}
body#about #contentBodyList #scroll { float: left; height: 390px; margin: 15px 0 0 0; overflow: auto; width: 370px; }

/* *************************************************************
PASSPORT PAGE
************************************************************* */
.passportPic{ float: right; margin: 10px 30px 0 0;}

#passport { float: left; width: 640px;}
#passport form{ float: left; margin: 0; padding: 0; }
#passport p{ width: 100%;}
#passport fieldset{ border: none; float: left; width: 100%; margin: 20px 0 0 0; padding: 0;}
#passport h2{ clear: both; width: 100%; display: block; margin: 0 0 10px 0; padding: 0; float: left; color: #F60; font-size: 100%; font-weight: bold; border-bottom: 1px solid #FC9;}
#passport h3{ clear: both; width: 90%; margin: 10px 0 0 0; float: left; color: #005CB6; font-size: 90%; font-weight: normal;}
#passport label { font-size: 70%; }
#passport .options{ clear: both; float: left; width: 90%; margin: 5px 0 20px 0; color: #005CB6;}
#passport table{ float: left; font-size: 70%; color: #663399; width: 100%; clear: both;}
#contentBodyWrap #passport th {font-weight: bold; height: 2.5em; padding: 0px 0 0 10px; text-align: left; background: #FEF0BF url(../images/bg/bg_th.jpg) 0 0 repeat-x; font-size: 110%;}
#passport td{ color: #663399; padding: 8px 0 8px 10px;  border-top: 1px solid #F7C2F8; }
#passport td input{ width: 95%;}
#passport tr a{ color: #663399; text-decoration: none;}
#passport tr a:hover{ color: #CC6600; text-decoration: underline;}

#passport .bg{ background-color: #F7C2F8;}
#passport .bg2{ background-color: #FCE8FD;}

#contentBody ul{ clear: both;}
#contentBody p a{ color: #690; }
#contentBody p a:hover{ color: #F60; }


#passportThankyou {width: 520px; height: 260px; text-align: center; margin: -180px 0 0 -260px; position:absolute; left: 50%; top: 50%; background: url(../images/trunki-passport-medium.gif) 0 0 no-repeat; padding: 0 0 0 0;}
#passportThankyou p { float: right; width: auto; padding: 0 0 0 0; margin: 0 0 10px 0; clear: both; width: 250px; text-align: left; color: #660099; font-size: 80%; font-weight: bold;}


/* *************************************************************
SEND TO A FRIEND
************************************************************* */
form#sendToAFriend{ float: left; width: auto;}
#sendToAFriend h2{ float: left; width: 210px; padding: 0 0 2px 0; margin: 10px 0 0 0; font-size: 75%; font-weight: bold; color: #09F; clear: none;}
#sendToAFriend p{ margin: 0 0 3px 0; width: 450px;}
#sendToAFriend textarea{ font: 100% Arial, Helvetica, sans-serif;}

img.sendToAFriend{ float: right; margin: 0px 20px 0 0; border:1px solid #CCC;}


/* *************************************************************
NEWSLETTER
************************************************************* */
#replaceme, #sackdata{ float: left; width: 260px; margin: 5px 0 0 0;}
#subscribeForm #replaceme p, #contactPopup #sackdata p{ float: left; width: 100%; margin: 0 0 0 0; padding: 0 0 0 0;  display: inline; color: #F09; font-size: 75%; background-color: #FFF; line-height: 130%;}
#subscribeForm form p{ float: left; width: 290px; font-size:75%; margin: 0 0 0 0; padding: 0; line-height: 220%; display: inline;}
#subscribeForm form label{ width: 100px; float: left}
#subscribeForm form .submit { background: url(../images/buttons/btn_submit.jpg) 0 0 no-repeat; border: none; width: 100px; height: 31px; cursor: pointer; float: left; margin: 5px 0 0 0;}
#subscribeForm form .submit:hover{background: url(../images/buttons/btn_submit.jpg) 1px 1px no-repeat; height: 31px; width: 101px;}


/* *************************************************************
TRUNKI STORY
************************************************************* */
#storyWrap{width: 600px; margin: 0 auto; padding-top: 20px;}
#storyWrap #leftColumnStory{width: 250px; margin-right: 30px; float: left;}
#storyWrap #rightColumnStory{width: 300px; float: right; margin-right: 20px; text-align: right;}
#storyWrap #leftColumnStory h1{margin: 0 0 30px 0;}
#storyWrap p{font: 75% Arial, Helvetica, sans-serif; color: #0066FF; line-height: 170%;}
#storyWrap p a{font-family: Arial, Helvetica, sans-serif; color: #FF399C; text-transform: uppercase;}


/* *************************************************************
AS SEEN ON TV
************************************************************* */
#seenOnTV{width: 300px; margin: 0 0 0 20px; padding-top: 20px;}
#seenOnTV p{font-size: 70%;}
#seenOnTV ul{ padding: 0 0 20px 0; margin: 0; list-style-type: none;}
#seenOnTV li {font-size: 70%; color: #FF399C; text-transform: uppercase; float: left; width: 100px;}
#seenOnTV li a{color: #FF399C;}
#seenOnTV .line{margin: 0 20px 0 0; padding: 0; height: 20px; border-bottom: 1px solid #ccc; width: 300px; clear: both;}


/* *************************************************************
SITEMAP
************************************************************* */
#siteMap ul{ float: left; clear: both;}
#siteMap li{ font-size: 75%; color: #005CB6; line-height: 150%;}
#siteMap li a{ color: #005CB6; text-decoration: none;}
#siteMap li a:hover{ color: #FF399C;}


/* *************************************************************
CAROUSEL
************************************************************* */
#carousel{ float: left; width: 670px; margin: 20px 0 0 0; }
#carousel ul{ float: left; list-style: none; margin: 0; padding: 0; overflow: hidden; height: 70px;}


/* *************************************************************
IMAGES ROLLOVER
************************************************************* */
.imageRollover{background: #FFFFFF url(../images/img_load.gif) center 90px no-repeat; border: 1px solid #999; overflow: auto; padding: 5px;}
.imageRollover img{ padding: 1px 0 1px 1px; float: left; clear: both;}
.imageRollover h2{ font-size: 75%; color: #3399FF; margin: 5px 0 5px 5px; padding: 0; float: left; clear: both; display: inline; width: 97%;}
.imageRollover p{ font-size: 70%; color: #666; margin: 0 0 0 5px; padding: 0; float: left; clear: both; display: inline; width: 97%;}


/* *************************************************************
PAGE NAVIGATION
************************************************************* */
#pageNav { float: right; width: 200px; padding: 0; margin: 10px 15px 10px 0; color: #666; display: inline; }
#pageNav p{color: #F09; font-size: 70%; line-height: 100%; float: left; width: 200px; margin: 0; padding: 0;}
#pageNav form{ float: right; width: auto; text-align: right; padding: 0; margin: 0; color: #666; display: inline;}
#pageNav select{ font-size: 70%; margin: 0 5px; float: left; display: inline;}
#pageNav a{padding: 0; margin: 1px 0 0 0; color: #666; line-height: 150%; text-decoration: none; float: left;}
#pageNav img{ float: left; padding: 0; margin: 0;}


/* *************************************************************
CONTACT PAGE
************************************************************* */
#contact{ background: url(../images/misc/stamp.png) top right no-repeat; padding: 40px 0 0 20px; margin: 0 20px 0 0; float: right; border-left: 1px dotted #F90;}
#contact fieldset{border: 1px solid #FDDEA6; float: left; background: #fff; width: 100%; padding: 10px;}
#contact h2{ font-size: 100%; color: #F60; padding: 0; margin: 0 0 10px 0; font-weight: normal; float: left; clear: both;}
#contact p{ float: left; margin: 0 0 2px 0; padding: 0; width: 290px; font-size: 75%; line-height: 120%; color: #09F;}
#contact label{ float: left; width: 125px;}
#contact textarea{ font: 110% Arial, Helvetica, sans-serif; width: 140px;}

#contact ul{ list-style: none; margin: 0 0 20px 0; padding: 0; clear: both; float: left;}
#contact li{ float: left; color: #005CB6; margin: 0 0 5px 0; padding: 0 0 0 10px; background: url(../images/icons/icon_arrow-blue.gif) 0 5px no-repeat; clear: both; white-space: nowrap;}
#contact li a{ color: #09F;}
#contact li a:hover{ color: #F09;}

#enquiryForm { float: left; margin: 0 0 20px 0;}
#enquiryForm h2{ color: #005CB6; font-size: 100%; font-weight: normal; margin: 10px 0 10px 0; float: left; width: 100%;}


/* *************************************************************
BUTTONS
************************************************************* */
.submit { background: url(../images/buttons/btn_submit.jpg) 0 0 no-repeat; border: none; width: 100px; height: 27px; cursor: pointer; margin: 0;}


/* *************************************************************
FOOTER
************************************************************* */
/* #footer { width: 100%; background: url(../images/footer.jpg) no-repeat; height: 123px;}
#footer, .push {height: 123px;} */
#footer{position: relative; margin-top: -113px; width: 100%; background: url(../images/bg/footer.jpg) no-repeat; height: 123px; clear: both;}


/* *************************************************************
MISCELLANEOUS
************************************************************* */
p.message{ width: 640px; border-top: 1px dotted #C891FF; padding: 10px 0 0 0; color: #F09; clear: both; margin: 20px 0 0 0; float: left;}