/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Title : Walking With Dinosaurs Stylesheet Author : Wes Smith / wes.smith@mediarock.co.uk / Mediarock Ltd - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* COMMON AND GLOBAL */ body { font:62.5%/1.6 arial, verdana, helvetica, sans-serif; margin:0; padding:0; background:#000000; color:#ffffff; text-align:center; } td, textarea, input, select { font:100% arial, verdana, helvetica, sans-serif; } /* ----- IDS ----- */ #container { position:relative; width:1020px; margin:0 auto; text-align:left; font-size:110%; } #mainPanel { position:relative; width:543px; height:593px; background:url(/images/site/mainPanelBg.png) top left no-repeat; margin:0 auto;} #scrollableArea { position:absolute; top:245px; left:275px; width:445px; height:340px; padding:10px; border-top:3px solid #b00000; border-bottom:3px solid #b00000; overflow:auto; color:#fff; font-size:12px;} /* ----- LOGIN ----- */ #flashBackToSite { position:absolute; top:10px; left:3px; width:195px; height:190px;} #loginLogo { position:absolute; top:62px; left:224px; width:558px; height:133px;} #loginArea { width:420px; height:125px; position:absolute; top:329px; left:285px; background:url(/images/site/loginPasswordBg.gif) 16px 59px no-repeat;} #loginArea #loginTitle { position:absolute; top:10px; left:16px; width:349px; height:45px;} #loginArea #loginPassword {} #loginArea #loginPassword #loginPasswordInput { border:none; background:#ffffff; padding:2px 4px; width:233px; color:#8d8d8d; position:absolute; top:59px; left:105px;} #loginArea #loginPasswordSubmit { position:absolute; top:59px; left:360px; width:54px; height:18px;} #loginArea #loginPasswordSubmit a { display:block; width:54px; height:18px;} #loginArea #loginRequestPassword {} #loginArea #loginRequestPassword #loginRequestPasswordInput { border:none; background:#ffffff; padding:2px 4px; width:210px; color:#8d8d8d; position:absolute; top:103px; left:128px;} #loginArea #loginRequestPasswordSubmit { position:absolute; top:103px; left:360px; width:54px; height:18px;} #loginArea #loginRequestPasswordSubmit a { display:block; width:54px; height:18px;} /* ----- MEDIA ----- */ #mediaHeader { height:182px; width:1020px;} #mediaHeader #mediaLogo { position:absolute; top:30px; left:290px; width:426px; height:91px;} #mediaHeader #logout { width:65px; position:absolute; top:20px; left:940px;} #mediaHeader #logout a { color:#FFFFFF; text-decoration:none; font-weight:bold; font-size:10px; display:block; width:65px; background:url(/images/site/logout.gif) 51px 3px no-repeat;} #mediaHeader #logout a:hover { text-decoration:underline;} #mediaNav { position:absolute; top:142px; left:118px;} #mediaNav #mediaNavLink { float:left; width:65px; height:26px; display:block;} #mediaNav #mediaNavLink a { background:url(/images/site/mediaNav.gif) 0px 0px no-repeat; width:65px; height:26px; display:block;} #mediaNav #mediaNavLink a:hover { background:url(/images/site/mediaNav.gif) 0px -26px no-repeat;} #mediaNav #mediaNavLink.active a { background:url(/images/site/mediaNav.gif) 0px -26px no-repeat;} #mediaNav #mediaPressLink { float:left; width:65px; height:26px; display:block; margin-left:45px;} #mediaNav #mediaPressLink a { background:url(/images/site/pressNav.gif) 0px 0px no-repeat; width:65px; height:26px; display:block;} #mediaNav #mediaPressLink a:hover { background:url(/images/site/pressNav.gif) 0px -26px no-repeat;} #mediaNav #mediaPressLink.active a { background:url(/images/site/pressNav.gif) 0px -26px no-repeat;} #mediaScroller { background:transparent; height:450px; overflow:auto; position:relative;} #mediaScroller .padding { padding: 20px 95px 50px 115px;} #mediaScroller .listItem { border-bottom:1px solid #ffffff; padding:25px 0 10px 0; display:block; position:relative;} #mediaScroller .listItem .listItemTitle { font-size:18px; color:#ffffff; font-weight:bold; line-height:22px;} #mediaScroller .listItem .listItemContent { font-size:12px; color:#ffffff; font-weight:normal; line-height:16px; padding: 0 150px 10px 0;} #mediaScroller .listItem .listItemVideo {} #mediaScroller .listItem .listItemDownload { position:absolute; bottom:10px; right:4px; width:63px; height:18px; display:block;} #mediaScroller .listItem .listItemDownload a { width:63px; height:18px; display:block;} /* ----- PAGINATION ----- */ .pagination { font-size:11px; float:right; line-height:22px;} .pagination ul { margin:0; padding:0; list-style:none;} .pagination li { display:block; float:left; width:18px; text-align:center; border-right:1px solid #ffffff; height:22px;} .pagination a { text-decoration:none; font-weight:normal;} .pagination a:hover { font-weight:bold;} .pagination .active a { font-weight:bold;} .pagination .last { border:none;} .pagination .pageOf { border:none; width:25px; text-align:right;} /* ----- CLASSES ----- */ .clear { clear:both; } .hide { display:none; } .show { display:block; } .printShow { display:none; } .float_left { float:left !important; } .float_right { float:right !important; } .align_left { text-align:left !important; } .align_center { text-align:center !important; } .align_right { text-align:right !important; } .align_justify { text-align:justify !important; } .align_bottom { vertical-align:bottom !important; } .image_right { float:right; padding:0 0 15px 15px; } .image_left { float:left; padding:0 15px 15px 0; } .image_center { margin:0 auto;} .relative { position:relative; } .inline {display:inline;} .hand { cursor:pointer;} .title { position:absolute; top:214px; left:254px;} /* ----- HEADINGS & PARAGRAPHS ----- */ h1, h2, h3, h4, h5, h6 { margin:0; padding:0 0 15px 0; font-size:100%; font-weight:bold; color:#CCCCCC;} /* ----- TOP NAVIGATION ----- */ #topNav { width:1020px; height:125px;} /* ----- FUN STUFF NAVIGATION ----- */ #funStuffNav { position:absolute; top:180px; left:400px; width:auto; height:15px; margin:0 auto;} /* #funStuffNav #screensavers { display:block; width:84px; height:15px; background:url(/images/site/screensaversNav.gif) 0 0 no-repeat; margin:0 7px; float:left;} #funStuffNav #screensavers:hover { display:block; width:84px; height:15px; background:url(/images/site/screensaversNav.gif) 0 -15px no-repeat;} #funStuffNav #screensavers.active { display:block; width:84px; height:15px; background:url(/images/site/screensaversNav.gif) 0 -15px no-repeat;} #funStuffNav #eCards { display:block; width:46px; height:15px; background:url(/images/site/eCardsNav.gif) 0 0 no-repeat; margin:0 7px; float:left;} #funStuffNav #eCards:hover { display:block; width:46px; height:15px; background:url(/images/site/eCardsNav.gif) 0 -15px no-repeat;} #funStuffNav #eCards.active { display:block; width:46px; height:15px; background:url(/images/site/eCardsNav.gif) 0 -15px no-repeat;} */ #funStuffNav #funStuff { display:block; width:70px; height:20px; background:url(/images/site/funStuffNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #funStuffNav #funStuff:hover { display:block; width:70px; height:20px; background:url(/images/site/funStuffNav.gif) 0 -22px no-repeat;} #funStuffNav #funStuff.active { display:block; width:70px; height:20px; background:url(/images/site/funStuffNav.gif) 0 -22px no-repeat;} #funStuffNav #videoGallery { display:block; width:50px; height:20px; background:url(/images/site/videoGalleryNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #funStuffNav #videoGallery:hover { display:block; width:50px; height:20px; background:url(/images/site/videoGalleryNav.gif) 0 -22px no-repeat;} #funStuffNav #videoGallery.active { display:block; width:50px; height:20px; background:url(/images/site/videoGalleryNav.gif) 0 -22px no-repeat;} #funStuffNav #photoGallery { display:block; width:50px; height:20px; background:url(/images/site/photoGalleryNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #funStuffNav #photoGallery:hover { display:block; width:50px; height:20px; background:url(/images/site/photoGalleryNav.gif) 0 -22px no-repeat;} #funStuffNav #photoGallery.active { display:block; width:50px; height:20px; background:url(/images/site/photoGalleryNav.gif) 0 -22px no-repeat;} #funStuffNav #worksheets { display:block; width:86px; height:20px; background:url(/images/site/worksheetsNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #funStuffNav #worksheets:hover { display:block; width:86px; height:20px; background:url(/images/site/worksheetsNav.gif) 0 -20px no-repeat;} #funStuffNav #worksheets.active { display:block; width:86px; height:20px; background:url(/images/site/worksheetsNav.gif) 0 -20px no-repeat;} /* ----- NEWS NAVIGATION ----- */ #newsNav { position:absolute; top:180px; left:320px; width:auto; height:15px; margin:0 auto;} #newsNav #pressReleases { display:block; width:99px; height:20px; background:url(/images/site/pressReleasesNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #newsNav #pressReleases:hover { display:block; width:99px; height:20px; background:url(/images/site/pressReleasesNav.gif) 0 -22px no-repeat;} #newsNav #pressReleases.active { display:block; width:99px; height:20px; background:url(/images/site/pressReleasesNav.gif) 0 -22px no-repeat;} /* #newsNav #stories { display:block; width:46px; height:22px; background:url(/images/site/storiesNav.gif) 0 0 no-repeat; margin:0 7px; float:left;} #newsNav #stories:hover { display:block; width:46px; height:22px; background:url(/images/site/storiesNav.gif) 0 -15px no-repeat;} #newsNav #stories.active { display:block; width:46px; height:22px; background:url(/images/site/storiesNav.gif) 0 -15px no-repeat;} */ #newsNav #quotes { display:block; width:50px; height:17px; background:url(/images/site/quotesNav.gif) 0 -5px no-repeat; margin:0 7px; float:left;} #newsNav #quotes:hover { display:block; width:50px; height:17px; background:url(/images/site/quotesNav.gif) 0 -22px no-repeat;} #newsNav #quotes.active { display:block; width:50px; height:17px; background:url(/images/site/quotesNav.gif) 0 -22px no-repeat;} #newsNav #celebGallery { display:block; width:100px; height:20px; background:url(/images/site/celebGalleryNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #newsNav #celebGallery:hover { display:block; width:100px; height:20px; background:url(/images/site/celebGalleryNav.gif) 0 -22px no-repeat;} #newsNav #celebGallery.active { display:block; width:100px; height:20px; background:url(/images/site/celebGalleryNav.gif) 0 -22px no-repeat;} #newsNav #milestones { display:block; width:75px; height:17px; background:url(/images/site/milestonesNav.gif) 0 -5px no-repeat; margin:0 7px; float:left;} #newsNav #milestones:hover { display:block; width:75px; height:17px; background:url(/images/site/milestonesNav.gif) 0 -22px no-repeat;} #newsNav #milestones.active { display:block; width:75px; height:17px; background:url(/images/site/milestonesNav.gif) 0 -22px no-repeat;} #newsNav #mylinks { display:block; width:90px; height:20px; background:url(/images/site/linksNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #newsNav #mylinks:hover { display:block; width:90px; height:20px; background:url(/images/site/linksNav.gif) 0 -22px no-repeat;} #newsNav #mylinks.active { display:block; width:90px; height:20px; background:url(/images/site/linksNav.gif) 0 -22px no-repeat;} /* ----- MEET THE DINOS NAVIGATION ----- */ #meetNav { position:absolute; top:180px; left:300px; width:auto; height:15px; margin:0 auto;} #meetNav #videoGallery { display:block; width:50px; height:20px; background:url(/images/site/videoGalleryNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #meetNav #videoGallery:hover { display:block; width:50px; height:20px; background:url(/images/site/videoGalleryNav.gif) 0 -22px no-repeat;} #meetNav #videoGallery.active { display:block; width:50px; height:20px; background:url(/images/site/videoGalleryNav.gif) 0 -22px no-repeat;} #meetNav #photoGallery { display:block; width:50px; height:20px; background:url(/images/site/photoGalleryNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #meetNav #photoGallery:hover { display:block; width:50px; height:20px; background:url(/images/site/photoGalleryNav.gif) 0 -22px no-repeat;} #meetNav #photoGallery.active { display:block; width:50px; height:20px; background:url(/images/site/photoGalleryNav.gif) 0 -22px no-repeat;} #meetNav #biogs { display:block; width:120px; height:19px; background:url(/images/site/meetTheDinosBiogNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #meetNav #biogs:hover { display:block; width:120px; height:19px; background:url(/images/site/meetTheDinosBiogNav.gif) 0 -22px no-repeat;} #meetNav #biogs.active { display:block; width:120px; height:19px; background:url(/images/site/meetTheDinosBiogNav.gif) 0 -22px no-repeat;} /*#meetNav #biog { display:block; width:130px; height:25px; background:url(/images/site/meetTheDinosBiogNav.gif) 0 0 no-repeat; margin:0 7px; float:left;} #meetNav #biog:hover { display:block; width:130px; height:25px; background:url(/images/site/meetTheDinosBiogNav.gif) 0 -22px no-repeat;} #meetNav #biog.active { display:block; width:130px; height:25px; background:url(/images/site/meetTheDinosBiogNav.gif) 0 -22px no-repeat;}*/ #meetNav #sizechart { display:block; width:130px; height:20px; background:url(/images/site/meetTheDinosSizechartNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #meetNav #sizechart:hover { display:block; width:130px; height:20px; background:url(/images/site/meetTheDinosSizechartNav.gif) 0 -22px no-repeat;} #meetNav #sizechart.active { display:block; width:130px; height:20px; background:url(/images/site/meetTheDinosSizechartNav.gif) 0 -22px no-repeat;} #meetNav #gallery { display:block; width:100px; height:15px; background:url(/images/site/meetTheDinosGalleryNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #meetNav #gallery:hover { display:block; width:100px; height:15px; background:url(/images/site/meetTheDinosGalleryNav.gif) 0 -22px no-repeat;} #meetNav #gallery.active { display:block; width:100px; height:15px; background:url(/images/site/meetTheDinosGalleryNav.gif) 0 -22px no-repeat;} /* ----- ABOUT NAVIGATION ----- */ #aboutNav { position:absolute; top:180px; left:284px; width:auto; height:15px; margin:0 auto;} #aboutNav #theStory { display:block; width:80px; height:24px; background:url(/images/site/theStoryNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #aboutNav #theStory:hover { display:block; width:80px; height:24px; background:url(/images/site/theStoryNav.gif) 0 -22px no-repeat;} #aboutNav #theStory.active { display:block; width:80px; height:24px; background:url(/images/site/theStoryNav.gif) 0 -22px no-repeat;} #aboutNav #synopsis { display:block; width:108px; height:24px; background:url(/images/site/synopsisNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #aboutNav #synopsis:hover { display:block; width:108px; height:24px; background:url(/images/site/synopsisNav.gif) 0 -22px no-repeat;} #aboutNav #synopsis.active { display:block; width:108px; height:24px; background:url(/images/site/synopsisNav.gif) 0 -22px no-repeat;} #aboutNav #makingOf { display:block; width:75px; height:24px; background:url(/images/site/makingOfNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #aboutNav #makingOf:hover { display:block; width:75px; height:24px; background:url(/images/site/makingOfNav.gif) 0 -22px no-repeat;} #aboutNav #makingOf.active { display:block; width:75px; height:24px; background:url(/images/site/makingOfNav.gif) 0 -22px no-repeat;} #aboutNav #faqs { display:block; width:41px; height:24px; background:url(/images/site/faqsNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #aboutNav #faqs:hover { display:block; width:41px; height:24px; background:url(/images/site/faqsNav.gif) 0 -22px no-repeat;} #aboutNav #faqs.active { display:block; width:41px; height:24px; background:url(/images/site/faqsNav.gif) 0 -22px no-repeat;} #aboutNav #factSheet { display:block; width:70px; height:24px; background:url(/images/site/factSheetNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #aboutNav #factSheet:hover { display:block; width:70px; height:24px; background:url(/images/site/factSheetNav.gif) 0 -22px no-repeat;} #aboutNav #factSheet.active { display:block; width:70px; height:24px; background:url(/images/site/factSheetNav.gif) 0 -22px no-repeat;} #aboutNav #creativeTeam { display:block; width:95px; height:24px; background:url(/images/site/creativeTeamNav.gif) 0 -2px no-repeat; margin:0 7px; float:left;} #aboutNav #creativeTeam:hover { display:block; width:95px; height:24px; background:url(/images/site/creativeTeamNav.gif) 0 -22px no-repeat;} #aboutNav #creativeTeam.active { display:block; width:95px; height:24px; background:url(/images/site/creativeTeamNav.gif) 0 -22px no-repeat;} /* ----- TICKETS NAVIGATION ----- */ #ticketsNav { position:absolute; top:180px; left:345px; width:auto; height:15px; margin:0 auto;} #ticketsNav #ukdates { display:block; width:60px; height:17px; background:url(/images/site/ukTicketsNav.gif) 0 -5px no-repeat; margin:0 0px; float:left;} #ticketsNav #ukdates:hover { display:block; width:60px; height:17px; background:url(/images/site/ukTicketsNav.gif) 0 -24px no-repeat;} #ticketsNav #ukdates.active { display:block; width:60px; height:17px; background:url(/images/site/ukTicketsNav.gif) 0 -24px no-repeat;} #ticketsNav #usdates { display:block; width:70px; height:17px; background:url(/images/site/usTicketsNav.gif) 0 -5px no-repeat; margin:0 0px; float:left;} #ticketsNav #usdates:hover { display:block; width:70px; height:17px; background:url(/images/site/usTicketsNav.gif) 0 -24px no-repeat;} #ticketsNav #usdates.active { display:block; width:70px; height:17px; background:url(/images/site/usTicketsNav.gif) 0 -24px no-repeat;} #ticketsNav #canadadates { display:block; width:95px; height:17px; background:url(/images/site/canadaTicketsNav.gif) 0 -4px no-repeat; margin:0 0px; float:left;} #ticketsNav #canadadates:hover { display:block; width:95px; height:17px; background:url(/images/site/canadaTicketsNav.gif) 0 -21px no-repeat;} #ticketsNav #canadadates.active { display:block; width:95px; height:17px; background:url(/images/site/canadaTicketsNav.gif) 0 -21px no-repeat;} #ticketsNav #swedendates { display:block; width:95px; height:17px; background:url(/images/site/swedenTicketsNav.gif) 0 -6px no-repeat; margin:0 0px; float:left;} #ticketsNav #swedendates:hover { display:block; width:95px; height:17px; background:url(/images/site/swedenTicketsNav.gif) 0 -24px no-repeat;} #ticketsNav #swedendates.active { display:block; width:95px; height:17px; background:url(/images/site/swedenTicketsNav.gif) 0 -24px no-repeat;} /* ----- SITE MAP ----- */ #sitemap { list-style:none; margin:0 0 0 5px; padding:0;} #sitemap ul { list-style:none; margin:10px 0 0px 15px; padding:0;} #sitemap li { background:url(/images/site/layup/bulletSitemap.gif) 0px 11px no-repeat; padding:6px 0 5px 15px;} /* ----- FOOTER ----- */ #footer { position:absolute; bottom:-20px; left:0; width:1020px; height:148px; background:url(/images/site/footerBg.png) top left no-repeat;} #footer p { padding:0; font-size:10px;} #footer a { font-weight:normal; text-decoration:none; outline:none;} #footer a:hover { text-decoration:underline;} #footer #copyright { position:absolute; bottom:13px; left:305px; font-size:9px;} #footer #bbc { position:absolute; bottom:18px; right:15px;} #footer #media { position:absolute; bottom:18px; left:15px;} /* ----- FOOTER LOGIN ----- */ #footerLogin { position:absolute; bottom:0; left:0; width:1020px; height:148px;} #footerLogin p { padding:0; font-size:10px;} #footerLogin a { font-weight:normal; text-decoration:none; outline:none;} #footerLogin a:hover { text-decoration:underline;} #footerLogin #copyright { position:absolute; bottom:13px; left:305px; font-size:9px;} #footerLogin #bbc { position:absolute; bottom:18px; right:20px;} /* ----- FOOTER MEDIA ----- */ #footerMedia { width:1020px; height:56px; margin:0 auto; position:relative;} #footerMedia p { padding:0; font-size:10px;} #footerMedia a { font-weight:normal; text-decoration:none; outline:none;} #footerMedia a:hover { text-decoration:underline;} #footerMedia #copyright { position:absolute; top:20px; left:305px; font-size:9px;} #footerMedia #bbc { position:absolute; top:20px; right:20px;} /* ----- GLOBAL ----- */ img { display:block; border:0; } p { padding:0 0 15px 0; margin:0; color:#CCCCCC;} address { font-style:normal;} /* ----- LINKS ----- */ a { color:#ffffff; font-weight:bold; text-decoration:underline; } a:hover { text-decoration:none; } /* ----- FORMS ----- */ form { padding:0; margin:0; } fieldset { padding:0; margin:0; border:0px none; display:inline; } legend { padding:0; margin:0; display:none; } label { display:block; width:260px; float:left; } input, textarea { width:200px; font-size:11px !important;} .required { color:#0033FF;} .checkRadio { width:20px; position:relative; left:-7px;} #frmContact { margin-bottom:15px;} #frmContact p { padding:7px 0;} #frmContact select { width:204px;} #frmContact div { margin-bottom:10px;} #submit { width:55px; height:18px; border:none;} /* ----- FORM VALIDATION ----- */ input.disabled { border: 1px solid #F2F2F2; background-color: #F2F2F2; } input.validation-failed, textarea.validation-failed, select.validation-failed { border: 1px solid #4544e4; color : #FF3300; } input.validation-passed, textarea.validation-passed, select.validation-passed { border: 1px solid #00CC00; color : #000; } .validation-advice { margin: 5px 0; width:452px; padding: 5px; background-color: #4544e4; color : #FFF; font-weight: bold; } /* ----- TABLES ----- */ table { border-collapse:collapse; } table p { padding:0px; } /* ----- SCROLLABLE AREA ----- */ #scrollableArea h2 {font-size:140%;}