/* NEWSPRESS LTD. SITE STYLES Contents 1.0 Reset 2.0 Base styles 3.0 Site Header 3.1 Logo 3.2 Account 3.3 Search 3.4 Menu 3.5 Temp Lgin Warning 4.0 Content Area 5.0 Left Column 6.0 Right Column 7.0 Site Footer 8.0 Image Listings 9.0 PR Contact Listings 10.0 Release Listings 11.0 Video Listings 12.0 Document Listings 13.0 Scrollable Elements (jTools Carousel) 14.0 Search Results NOTES: * BODY font-size is set to 10px, use 1em per 10px */ /****************************************************************** 1.0 Resets /*****************************************************************/ /* 1.1 Reset http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/ */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent} sub { vertical-align:sub; font-size:0.9em} sup { vertical-align:super; font-size:0.9em} h1 sub, h1 sup, h2 sub, h2 sup{ font-size:0.6em} ul, ol {list-style: none} blockquote, q {quotes: none} q:before, q:after{content:''} :focus {outline: 0} del {text-decoration: line-through} table {border-collapse: collapse;border-spacing: 0} /***************************************************************** 2.0 Base styles *****************************************************************/ body{ background:#D9E4E8 url('../images/site-bg.png') top left repeat-x; color:#333; font:62.5%/1.4 Arial, Calibri, Verdana, sans-serif} /*body{ background:#C2DAE3 url('../images/seasonsgreetings.jpg') top left repeat-x; color:#333; font:62.5%/1.4 Arial, Calibri, Verdana, sans-serif}*/ h1{ font-size:2.4em; font-weight:normal; line-height:1; color:#DCEDF5; cursor:default} h2{ font-size:1.8em; font-weight:normal; line-height:1; color:#9AAAAA; cursor:default} h3{ font-size:1.4em; font-weight:bold; line-height:1; color:#212121} #content-container { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } #content-container h1{ font:bold 2.0em/2.2 Arial, Calibri, Verdana, sans-serif; color:#212121; margin:18px 0 6px 0} #content-container h2{ font:bold 1.8em/2.0 Arial, Calibri, Verdana, sans-serif; color:#212121; margin:16px 0 4px 0} #content-container h3{ font:bold 1.4em/1.8 Arial, Calibri, Verdana, sans-serif; color:#212121; margin:14px 0 2px 0} #content-container h4{ font:bold 1.2em/1.4 Arial, Calibri, Verdana, sans-serif; color:#212121; margin:18px 0 6px 0} #content-container ul { list-style:square; margin-left:16px} #content-container ol { list-style:decimal; margin-left:0; list-style-position:inside} #content-container th, #content-container td{ border-bottom:1px solid #666} #content-container .noborder td{ border-bottom:0px;} p,ol,ul{ margin-bottom:1em} ol ol, ul ul, ol ul, ul ol{ margin-bottom:0} a{ text-decoration:none} a:link{ color:#70818E} a:visited{ color:#70818E} a:hover{ color:#00b3ff} a:active{ color:#00b3ff} .clearfix:before, .clearfix:after { content: "."; display: block; height: 0; overflow: hidden; } .clearfix:after {clear: both;} .clearfix {zoom: 1;} /* IE < 8 */ table{ margin-bottom:18px} td{ vertical-align:top} small{ font-size:0.8em} /* 2.0.1 Form container elements etc */ .ElementHolder { position:relative; min-height:20px; margin-bottom:8px; width: 420px} .ElementHolder-Wide { width: 590px} .ElementHolder label { left:0px; position:absolute; width:190px; display:block; color: #22424E; font:bold 1.2em/1.2 Arial, Calibri, Verdana, sans-serif} .ElementHolder div { /* left:200px; position:absolute; */ float: right; width: 230px; text-align: left} .ElementHolder-Wide div { width: 370px} .ElementHolder div label { position: static; width: auto; display: inline; font:normal 1.0em/1.0 Arial, Calibri, Verdana, sans-serif} /* reverse attributes from label declaration above */ .ElementHolder div input, .ElementHolder div select, .ElementHolder div textarea { color: #222; background-color: #fff; border: 1px solid #7f9db9; padding: 2px} .ElementHolder div input[type="checkbox"], .ElementHolder div input[type="radio"] { margin: 0 5px 0 0; padding: 0; position: relative; top: 2px; border: 0; background-color: transparent} /* CSS2.1 margin override for those that support it */ .ElementHolder div input.loginfield { width: 200px} .ElementHolder div input.ButtonBasic, input.ButtonBasic { font-weight: bold; color: #fff; background-color: #35383C; border: 1px solid #35383C; padding: 4px 5px 4px 5px; margin: 1px 0 1px 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px} .EndOfForm { margin-bottom: 30px} .validation { margin: 10px 0 10px 0} .MediaContacts { width: 400px; margin: 10px 0 10px 0; border: 1px solid #fff; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px} .MediaContacts th, .MediaContacts td { background-color: #fff; padding: 3px; text-align: left} input.MiniButton { font-weight: bold; font-size: 7pt; color: #fff; background-color: #35383C; padding: 1px 2px 1px 2px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 1px solid #35383C !important} .ElementHolder-ColSet { } .ElementHolder-Col { float: left; width: 280px; margin-right: 10px} ul.categoryList { list-style-type: none !important; margin-left: 0 !important} .inline-error { width: 100%; /*background-color: #B81900; color: #fff;*/ color: #b81900; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 5px; margin-top: 10px} div.success div p { width: 98%; color: #EFEFEF; background-color:#35383C; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 5px; margin: 5px 10px 5px 0} div.success { margin-bottom: 10px} div.success a { color: #efefef; } div.wide-content { width: 594px; display: block; overflow: auto; } /*.RegistrationForm input, .RegistrationForm select, .RegistrationForm textarea { width: 200px; }*/ /* 2.1 Elements using site sprite background */ /*#newspress-logo, #search, ul#menu, #menu li a, .addtodownloads, .removefromdownloads, .release a.addtodownloads, #footer, #content-header div.h1 div, #date-client, .release .info, .imgs-vids, #account .tab, a.left, a.right, #footer .col h1, #footer .vcard h1, table.documents-list .doc-icon, #print-icon{background:url('../images/site-sprite.png') top left no-repeat; display:block; overflow:hidden}*/ #search, #menu, #menu li a, .addtodownloads, .removefromdownloads, .release a.addtodownloads, #footer, #content-header div.h1 div, #date-client, .release .info, .imgs-vids, #account .tab, a.left, a.right, #footer .col h1, #footer .vcard h1, table.documents-list .doc-icon, #print-icon{background:url('../images/site-sprite.png?1') top left no-repeat; display:block; overflow:hidden} /* Elements using site sprite that need text hidden */ .addtodownloads, .removefromdownloads, .release a.addtodownloads, #content-header div.h1 div, ul#menu li a, #footer .col h1, #footer .vcard h1, #print-icon { text-indent:-5000px} /***************************************************************** 3.0 Site Header *****************************************************************/ #header{width:980px; height:90px;margin:0 auto 0 auto;clear:both;position:relative} /* 3.1 Logo */ #header #newspress-logo{ display:block; position:absolute; top:30px; left:0; width:275px; height:40px} /* 3.2 Partners Box */ #header #np-partners{ position:absolute;right:345px;height:84px;width:218px;background:url('../images/partners/background.png') top left no-repeat;} #header #np-partners div{ position:absolute;overflow:hidden;right:0px;top:0;height:84px;width:183px;} #header #np-partners { visibility: hidden; } /* 3.3 Account Options */ #header #account{ width:337px; height:44px; float:right; clear:both; margin-bottom:8px} #header #account .tab{ width:110px; height:24px; margin:0 2px 0 0; padding-top:8px; display:block; float:left; text-align:center; font-size:1.4em; color:#9AAAAA; background-position:-626px 0px} #header #account a:link, #header #account a:visited{ color:#9AAAAA} #header #account a:hover{ color:#FFF} #header #account a:active{ color:#9AAAAA} /* 3.4 Search */ #header #search{ width:343px; height:52px; position:absolute; top:38px; right:-4px; background-position:-280px 0px } #search input{ position:absolute; top:9px;right:15px} #search input[type=text]{ color:#999;top:9px;left:15px; width:216px; padding:6px 3px 3px 6px; border:0; background:0; position:absolute} /* 3.5 Site menu */ #menu{display:block;width:980px;height:54px;border-bottom:1px solid #0F0F0F;background-position:0px -430px;margin:0 auto 0 auto; clear:both} #menu li{ display:block; float:left; height:54px; margin:0 0 0 6px} #menu li a{ display:block; height:46px; margin-top:8px} #menu #m-releases a{ width:81px; background-position:-6px -631px} #menu #m-releases a:hover{ background-position:-6px -678px} #menu #m-releases a.current-page{ background-position:-6px -725px} #menu #m-images a{ width:71px; background-position:-97px -631px} #menu #m-images a:hover{ background-position:-97px -678px} #menu #m-images a.current-page{ background-position:-97px -725px} #menu #m-videos a{ width:68px; background-position:-178px -631px} #menu #m-videos a:hover{ background-position:-178px -678px} #menu #m-videos a.current-page{ background-position:-178px -725px} #menu #m-vehicle-data a{ width:111px; background-position:-256px -631px} #menu #m-vehicle-data a:hover{ background-position:-256px -678px} #menu #m-vehicle-data a.current-page{ background-position:-256px -725px} #menu #m-motorshows a{ width:114px; background-position:-377px -631px} #menu #m-motorshows a:hover{ background-position:-377px -678px} #menu #m-motorshows a.current-page{ background-position:-377px -725px} #menu #m-press-office-contacts a{ width:175px; background-position:-501px -631px} #menu #m-press-office-contacts a:hover{ background-position:-501px -678px} #menu #m-press-office-contacts a.current-page{ background-position:-501px -725px} #menu #m-rss a{ width:64px; background-position:-686px -631px} #menu #m-rss a:hover{ background-position:-686px -678px} #menu #m-rss a.current-page{ background-position:-686px -725px} #menu #m-login a{ width:58px; background-position:-760px -631px} #menu #m-login a:hover{ background-position:-760px -678px} #menu #m-login a.current-page{ background-position:-760px -725px} #menu #m-register a{ width:78px; background-position:-828px -631px} #menu #m-register a:hover{ background-position:-828px -678px} #menu #m-register a.current-page{ background-position:-828px -725px} #menu #m-forgot-pass a{ width:173px; background-position:-916px -631px} #menu #m-forgot-pass a:hover{ background-position:-916px -678px} #menu #m-forgot-pass a.current-page{ background-position:-916px -725px} #menu #m-links a{ width:119px; background-position:-1099px -631px} #menu #m-links a:hover{ background-position:-1099px -678px} #menu #m-links a.current-page{ background-position:-1099px -725px} /* 3.6 Site temp login warning */ #unmigratedUserWarningPlaceholder, #ie6WarningPlaceholder{ border: 2px #900 solid; background: #FCF0EF; padding: 5px} /***************************************************************** 4.0 Content Area *****************************************************************/ #content{width:976px;padding:0;background:#35383C url('../images/content-bg.png') top right no-repeat;border:2px solid #0F0F0F;border-top:0;border-bottom:0;margin:0 auto 0 auto;clear:both;position:relative} .addtodownloads, .removefromdownloads{ width:20px; height:16px; float:left} a.addtodownloads { background-position:0px -48px} a.addtodownloads:hover { background-position:-49px -48px} a.removefromdownloads { background-position:-98px -48px} a.removefromdownloads:hover { background-position:-147px -48px} /***************************************************************** 5.0 Left Column *****************************************************************/ #left-col{ width:628px; margin-right:10px; float:left; position:relative} /* 5.1 Content Header (Page title) */ #left-col #content-header{width:628px; min-height:117px;padding-top:12px;position:relative;background:url('../images/content-header-bg.png') bottom left repeat-x} #left-col #content-header h1{ width:608px; min-height:75px; margin-left:10px; display:block} #content-header div.h1{ display:block; height:28px; width:400px; margin:0 0 5px 0; overflow:hidden; text-indent:-500px} #content-header div.h1 div{ float:left; height:28px} #content-header div.h1 div.you-are-browsing{ width:195px; margin:0 10px 0 12px; background-position:0px -125px} #content-header div.h1 div.you-are-viewing{ width:178px; margin:0 10px 0 12px; background-position:-277px -125px} #content-header div.h1 div.press-releases{ width:169px; background-position:0px -155px} #content-header div.h1 div.videos{ width:81px; background-position:0px -185px} #content-header div.h1 div.press-offices{ width:149px; background-position:0px -215px} #content-header div.h1 div.downloads{ width:131px; background-position:0px -245px} #content-header div.h1 div.industry-toolkit{ width:184px; background-position:0px -275px} #content-header div.h1 div.your-account{ width:161px; background-position:-277px -245px} #content-header div.h1 div.search-results{ width:173px; background-position:-277px -215px} #content-header div.h1 div.motorshows{ width:150px; background-position:-277px -185px} #content-header div.h1 div.images{ width:84px; background-position:-277px -155px} #content-header div.h1 div.vehicle-data{ width:150px; background-position:-511px -215px} #content-header div.h1 div.conversion-tool{ margin:0 10px 0 12px;width:200px; background-position:-511px -245px} #content-header p{color:#FFF;font:normal 1.2em/1.2 Arial, Calibri, Verdana, sans-serif;margin:0 0 0 10px;width:390px;height:44px} #content-header div.h1 div.website-links{ width:173px; background-position:-277px -275px} #content-header div.h1 div.journalistShowcase{ position:absolute;left:215px;width:240px; background-position:-509px -275px} a#primebanner{ width:195px;height:111px;position:absolute;top:12px;right:12px;z-index:50} /* 5.2 Content Controls (Pagination, release date and client etc) */ body.ie6 #left-col #content-controls{ width:618px; } #left-col #content-controls{height:33px; padding:7px 0 0 10px;clear:both; position: absolute; bottom: 0; max-width: 618px; z-index:60; } #left-col #content-controls #date-client{width:466px;height:20px;background-position:0 -343px;font:normal 1.1em/1 Arial, Calibri, Verdana, sans-serif;color:#333;padding:8px 0 0 8px;margin:0 7px 0 0px;float:left;position: relative;} #left-col #content-controls #date-client a:link, #left-col #content-controls #date-client a:visited, #left-col #content-controls #date-client a:hover, #left-col #content-controls #date-client a:active{ color:#315570; border:0; font-size:1em; margin:0 0 0 12px} #content-controls .addtodownloads, #content-controls .removefromdownloads{ width:125px; height:28px; float:left} #content-header #content-controls .addtodownloads, #content-header #content-controls .removefromdownloads{ width:125px; height:28px} #content-header #content-controls .addtodownloads{ background-position:0px -80px} #content-header #content-controls .addtodownloads:hover{ background-position:-127px -80px} #content-header #content-controls .removefromdownloads{ background-position:-254px -80px} #content-header #content-controls .removefromdownloads:hover{ background-position:-381px -80px} /* Pagination control css */ body.ie6 .pagination li{ width:19px; } body.ie6 .pagination a{ width:3px; } body.ie6 .selected img, body.ie7 .selected img{ display:none; } body.ie6 .selected a, body.ie7 .selected a{ margin-top:0; } body.ie6 .pagination-prev a, body.ie6 .pagination-next a{ padding-top:3px } body.ie7 .pagination li{ min-width:19px; } body.ie7 .pagination a{ min-width:3px; } .pagination{ margin-bottom:0; } .pagination li{ display:block; float:left; padding-top:1px; margin:0 6px 0 0; position:relative; min-width:19px; height:24px; } .pagination a{ display:block; min-width:3px; height:12px; background:#3A4954; padding:6px 8px 7px; text-align:center; border-bottom:1px solid #B1BECA; font:normal 12px/1 Arial, sans-serif; text-decoration:none; z-index:1; } .pagination a:link, .pagination a:visited{ color:#FFF } .pagination a:hover, .pagination a:active{ color:#FFF; border-color:#FFF; } .pagination img{ border:0 } .pagination-prev a{background:#3A4954 url('/images/pagination-left-arrow.png') center 6px no-repeat} .pagination-next a{background:#3A4954 url('/images/pagination-right-arrow.png') center 6px no-repeat} li.selected a{ background:#48718F; margin:-3px auto 0; border-color:#48718F; font-weight:bold; } .selected img{ display:block; margin:-1px auto 0; z-index:100; } body.ie7 .pagination li.selected a{margin:0;} #content-container ul.pagination { bottom:10px;margin-left:0;position:absolute;} /* 5.3 Content Container (Release text, item listings etc) */ #left-col #content-container{background:#ECECEC;margin:10px 0 28px 10px;padding:12px 12px 36px;min-height:400px;clear:both;color:#444;font:normal 1.2em/1.4 Arial, Calibri, Verdana, sans-serif; position:relative;} .aside{-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;} /***************************************************************** 6.0 Right Column *****************************************************************/ #right-col{ width:328px; margin-right:10px; padding-top:12px; float:right} /* 6.1 Aside boxes - Structure */ .aside{width:304px;background:#232323;margin:0 0 7px 0;padding:12px;clear:both;position:relative;color:#9E9E9E} .view-all-full{-webkit-border-bottom-right-radius: 5px;-webkit-border-bottom-left-radius: 5px;-moz-border-radius-bottomright: 5px;-moz-border-radius-bottomleft: 5px;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;} .asideExpandable{ padding-bottom:32px} .aside .float-buttons{ clear:both; position:absolute; bottom:12px; width:304px} .aside .float-buttons2{ clear:both; width:304px; float: right; margin-bottom: 5px} .aside img.expandcontract{ cursor:pointer; position:absolute; bottom:0; left:0} .aside img.otherbutton{ position:relative; float:left} .aside input.apply-settings{ position:absolute; bottom:0; right:0} .aside input.apply-settings2{ float: right} .aside .view-all{ position:absolute; text-align:right; top:12px; right:13px;font-size:1.4em;} .aside .column{ width:50%; padding:0; margin:0 0 12px 0; float:left} .aside .colright{ text-align:right} /* 6.2 Aside boxes - Fonts & Styling */ .aside h2{padding:0 0 9px 0;border-bottom:1px solid #A4A4A4;margin:0 0 12px 0;clear:both} .aside h3{color:#9E9E9E;font-size:1.2em;margin-top:8px;} .aside .company-name-logo{border-bottom:1px solid #A4A4A4;width:300px;margin-bottom:9px;position:relative;padding-bottom:5px;} .aside .company-name-logo img{float:right; border:3px solid #FFF;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;} .aside .company-name-logo h2{float:left;border:0;padding:0;margin-right:4px;display:block;} /* 6.3 Aside - Filters / Display Options */ #filters .column ul{ margin:0} #filters .column ul li{ display:block; padding:0; line-height:1em} #filters .column ul li label{ margin:0 0 0 -3px; padding:0; font-size:1.1em; vertical-align:top; height:1.1em; color:#70818E} #filters .column input{ margin:0} #filters .column select{ width:95%} #filters select{ width:100%} #filters #company-atoz #letters{ padding-left:12px; width:135px; line-height:1.2em; cursor:default} /* 6.4 Aside - Useful Tools */ #useful-tools{ padding-bottom:0} #useful-tools ul{ margin:0} #useful-tools ul li{ float:left;margin:0 0 8px 0; display:block; height:90px} #useful-tools ul li a{display:block; margin:0 12px 0 0; padding:55px 0 0 0; width:51px; height:35px;font:normal 1.2em/1.2 Arial, Calibri, Verdana, sans-serif;text-align:center; background:url('../images/useful-utility-icons.png') top left no-repeat; overflow:hidden} #useful-tools ul li a.image-gallery{ background-position: 0 0} #useful-tools ul li a.image-gallery:hover{ background-position: 0 -93px} #useful-tools ul li a.video-gallery{ background-position: -63px 0} #useful-tools ul li a.video-gallery:hover{ background-position: -63px -93px} #useful-tools ul li a.pr-contacts{ background-position: -126px 0} #useful-tools ul li a.pr-contacts:hover{ background-position: -126px -93px} #useful-tools ul li a.industry-toolkit{ background-position: -189px 0} #useful-tools ul li a.industry-toolkit:hover{ background-position: -189px -93px} #useful-tools ul li a.media-contacts{ background-position: -126px 0; margin:0} #useful-tools ul li a.media-contacts:hover{ background-position: -126px -93px} #useful-tools ul li a.vehicle-data{ background-position: -252px 0; margin:0} #useful-tools ul li a.vehicle-data:hover{ background-position: -252px -93px} /* 6.5 Aside - Client Details */ #client-details #pr-individual-details{ width:100%; clear:both; overflow:hidden} /* 6.6 Aside - Associated Photos */ #right-col #photos{ padding-bottom:0} #photos .image-video{font:normal 1.1em/1.1 Arial, Calibri, Verdana, sans-serif; margin:0 15px 0 0} #photos .image-video a:hover{ color:#F9F9F9} /* 6.7 Aside - Associated Videos */ #right-col #videos{ padding-bottom:0} #right-col #videos .video{ margin-bottom:12px} /* 6.8 Aside - Other Media From This Client */ #content #right-col #moremedia{ font-size:1.2em; padding:8px 8px 8px 13px; width:307px} /***************************************************************** 7.0 Site footer *****************************************************************/ #footer{ width:980px; height:147px; margin:0 auto 0 auto; clear:both; background-position:0px -490px; color:#A4A4A4; font:normal 1.1em/1.4 Arial, Calibri, Verdana, sans-serif} #footer .adr, .tel{ width:50%; padding:0 0 10px 0; margin:0 0 12px 0; float:left} #footer .vcard{ width:333px; margin:17px 0 0 16px; float:left} #footer .vcard .org{ clear:both; margin:0 0 12px 0} #footer .vcard a.url{ margin-bottom:12px} #footer .vcard .type{ color:#F9F9F9} #footer .vcard div{ border:0;padding:0;margin:0} #footer .col{ width:263px; margin:17px 0 0 18px; float:left} #footer .col ul{ float:left; margin-right:28px} #footer .col h1, #footer .vcard h1{ margin:0 0 12px 0; clear:both; display:block} #footer .vcard h1{background-position:-511px -130px;width:127px; height:21px} #footer #site-map h1{background-position:-511px -160px;width:78px; height:21px} #footer #looking-for-something h1{background-position:-511px -190px;width:211px; height:21px} /***************************************************************** 8.0 Image Listings (may need to add div.image-video in front of these selectors!) *****************************************************************/ .image-video { width:128px; height:185px; padding:4px 4px 0; float:left; margin:0 12px 8px 0; background:#AAB4BB; position:relative; font:0.9em/1.1 Arial, Calibri, Verdana, sans-serif; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; color:#444; } .thumbnail { width:120px; height:85px; padding:4px; position:relative; background:#232323 } .thumbnail a { text-align:center; display:block; width:120px; height:85px; position:relative; } .thumbnail, .thumbnail img, .thumbnail a{ -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px } .thumbnail span { opacity:0; width:120px; height:60px; padding-top:25px; position:absolute; top:0; left:0; color:#232323; position:absolute; text-align:center; font-size:1.6em; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px } .thumbnail span:hover { display:block; opacity:1; background:rgba(255, 255, 255, 0.9); -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; } .no-opacity .thumbnail span{ display:none; } .no-rgba .thumbnail span{ background:#FFF } .caption{ display:block; overflow:hidden; font:normal 11px/14px Arial, sans-serif; padding:4px 0 0; max-height:42px; margin:0 } .download-options { width:136px; position:absolute; background:#C2CACF; border-top:1px solid #9FA9AF; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px } .res, .size { float:left; height:15px; padding-top:5px } .res { width:55px; display:block; color:#5A6268; padding-left:4px } .res:hover { color:#FFF } .size { width:50px; text-align:center; } .image-video .addtodownloads { display:block; width:20px; margin-top:1px; height:17px; float:left; } .highres { border-bottom:1px solid #ADB6BC; bottom:21px; left:0; } .lowres { border-top:1px solid #CAD0D4; bottom:0; left:0; } .lowres .res, .lowres .size{ padding-top:4px; height:16px } .image-video .lowres .addtodownloads{ margin-top:0 } /***************************************************************** 9.0 PR Contact Listings *****************************************************************/ .pr-contact{ clear:both; margin-bottom:16px} .pr-contact img{ width:25px; float:left; border:1px solid #FFF} .pr-contact .individual-name{ color:#F9F9F9;clear:right;width:265px;float:right; font:normal 1.2em/1.1 Arial, Calibri, Verdana, sans-serif; margin:0 0 4px 0} .pr-contact .individual-details{ color:#A4A4A4;clear:right;width:265px;float:right; font:normal 1em/1.1 Arial, Calibri, Verdana, sans-serif} .contactPhoto { display: block; float: left; } .contactText { float: left; } .contact-container { margin-bottom: 10px; clear: both; width: 100%; } .contact-photo-container { width:25px;height:37px;margin-right:10px;float:left; } /***************************************************************** 10.0 Release Listings *****************************************************************/ .release{ width:594px; padding-bottom:16px; margin-bottom:12px; background:url('../images/release-divider.png') bottom left no-repeat} .release .info{ width:594px; height:24px; margin-bottom:9px; background-position:0px -399px} .release .info .date{font-size:0.9em; color:#232323;width:45px; margin:7px 0 0 8px; padding:0;vertical-align:middle; float:left;font:normal 0.9em/1 Arial, Calibri, Verdana, sans-serif;cursor:default} .release .info .client{width:380px; height:19px; margin:5px 0 0 23px; padding:0;vertical-align:middle; float:left;font:normal 1em/1.2 Arial, Calibri, Verdana, sans-serif} .release .info .client a{ color:#F9F9F9; height:19px; font-weight:bold; padding:0; display:block;} .release .info .imgs-vids{ width:92px;height:18px;margin:4px 0 0 0; padding:0; vertical-align:middle; float:left; background-position:-49px -373px; cursor:default} .release .info .imgs-vids .image-count, .release .info .imgs-vids .video-count{ width:46px;height:12px; float:left; color:#F9F9F9; font-size:0.9em} .release .info .imgs-vids .image-count a, .release .info .imgs-vids .video-count a{ width:46px; padding-left:22px; height:12px; display:block} .release a.addtodownloads { padding:6px 12px 4px 12px; background-position:14px -45px} .release a.addtodownloads:hover { background-position:-35px -45px} .release a.removefromdownloads { padding:6px 12px 4px 12px; background-position:-84px -45px} .release a.removefromdownloads:hover { background-position:-133px -45px} .release .thumb{ width:120px; min-height:85px; clear:both; margin-right:12px; float:left;} #left-col #content-container .release h2{ font:bold 1.2em/1.2 Arial, Calibri, Verdana, sans-serif; width:462px; float:left; margin:-3px 0 9px 0} #left-col #content-container .release h2 a:link, #left-col #content-container .release h2 a:visited{ color:#232323} #left-col #content-container .release h2 a:hover{ color:#70818E} #left-col #content-container .release h2 a:active{ color:#232323} #left-col #content-container .release p{ font:normal 1em/1.2 Arial, Calibri, Verdana, sans-serif; color:#232323; width:462px; float:left; margin:0; cursor:default} /* 10.1 Top Spot Release Area */ #left-col #content-container #topspot .release{ margin-bottom:30px; background:#FFF url('../images/topspot-bg.gif') top left repeat; border-bottom:1px solid #FFF} #print-icon { position: absolute; top: 2px; right: 3px; display: block; height:24px; width:24px; background-position:-193px -44px; } #print-icon:hover { background-position:-240px -44px; } /***************************************************************** 11.0 Video Listings *****************************************************************/ #video-preview{ width:304px; height:245px} .video .title{ font-size:1.2em; padding-top:4px} /*.video{ width:304px; font:normal 1.1em/1.4 Arial, Calibri, Verdana, sans-serif; color:#A4A4A4} .video .title{ width:304px; border-bottom:1px solid #A4A4A4; color:#A4A4A4; padding:6px 0; margin:0 0 9px 0} .video .download{ height:15px; display:block; float:left} .video .res{ height:15px; display:block; float:right} */ /***************************************************************** 12.0 Document Listings *****************************************************************/ table.documents-list{ width:304px} table.documents-list tr{ border-bottom:0} table.documents-list .doc-title{ width:208px;font-size:1.2em; } table.documents-list .doc-size { width:60px} table.documents-list .doc-download { width:20px} table.documents-list .doc-icon{ width:14px; height:16px; background-position:-842px 0} table.documents-list .pdf{ background-position:-762px 0} table.documents-list .powerpoint{ background-position:-782px 0} table.documents-list .word{ background-position:-802px 0} table.documents-list .excel{ background-position:-822px 0} /****************************************************************** 13.0 Scrollable Elements (jTools Carousel) ******************************************************************/ .scrollable {position:relative; overflow:hidden;width:287px; height:190px; margin:0 auto 12px auto; } .scrollable .scrollitems {/* don't adjust */width:20000em;position:absolute;clear:both} .scrollable .scrollitem{float:left; margin:0 15px 0 0} .scroll-buttons{margin:0 auto 4px auto; width:50px; position:relative; height:24px; } a.browse {width:24px;height:24px;margin:0;cursor:pointer;overflow:hidden;top:-5px; position:absolute; } a.left { margin: 0px; background-position:-511px -60px; left:0;} a.left:hover, a.left:active { background-position:-511px -84px} a.right { margin:0; background-position:-535px -60px; right:0;} a.right:hover, a.right:active { background-position:-535px -84px} a.disabled { visibility:hidden !important} /****************************************************************** 14.0 Search Results ******************************************************************/ #left-col #content-container ul#tabs{ list-style:none; width:594px; height:28px; border-bottom:1px solid #232323; margin:0 0 18px 0} #left-col #content-container ul#tabs li{ display:block; float:left; height:28px; background:#232323; margin:0 8px 0 0} #left-col #content-container ul#tabs li a{ display:block; height:18px; text-align:center; padding:5px 12px 5px 12px; color:#FFF} #left-col #content-container ul#tabs li a:hover{ color:#70818E} .thumb img{ max-width: 120px; /* Resize the image for IE6 */ width: expression(this.width > 120 ? 120: true); max-height: 85px; /* Resize the image for IE6 */ height: expression(this.height > 85 ? 85: true); } #nrn, #nrn-number, #nrn-number a{ -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; } #nrn{ width:594px; height:37px; background:#8eabb5; position:relative; font:normal 14px Arial, Verdana, sans-serif; margin-bottom:12px; } #nrn-number{ padding:0 18px 0 0; background:#668997; width:290px; float:left; } #nrn-number div{ height:27px; padding:10px 0 0 0; color:#FFF; text-shadow:1px 1px 1px rgba(0,0,0,0.6); float:left; } #nrn-number a{ background:#232323 url('/images/refresh.gif') 12px 11px no-repeat; height:27px; padding:10px 15px 0 36px; color:#FFF; text-decoration:none; margin:0 13px 0 0; float:left; } #nrn-number a:hover{ color:#e5d200; } #nrn-help{ display:block; float:right; padding:3px 5px; margin:9px 10px 0 0; font:normal 12px Arial, Verdana, sans-serif; color:#FFF; text-decoration:none; background:#000; cursor:help; } .clearfix:after { display:block; visibility:hidden; clear:both; height:0; content:"." } .ConversionTool tr td { border:solid 1px black; } #imagefilters select { width:100%; } /* New motor show gallery full page CSS */ .pg-ms-images #left-col{ width:956px; } .pg-ms-images #content-container{ width:932px } .pg-ms-images .aside{ position:absolute; top:12px; right:10px; } .pg-ms-images #left-col a#primebanner{ right:340px; } /*Lightbox */ .popup { width:518px; position:relative; margin:15px auto 0; color:#232323; } .popup .preview { background:#FFF; border:2px solid #FFF; -moz-box-shadow: 0px 0px 1px rgba(35, 35, 35, 0.65); -webkit-box-shadow: 0px 0px 1px rgba(35, 35, 35, 0.65); box-shadow: 0px 0px 1px rgba(35, 35, 35, 0.65); z-index:0; width:518px; max-height:400px; overflow:auto; margin:0 auto 7px; text-align:center; } .popup .image-details { background:#C2CACF; padding:12px 12px 34px 12px; position:relative; border: 2px solid white; -moz-box-shadow: 0px 0px 1px rgba(35, 35, 35, 0.65); -webkit-box-shadow: 0px 0px 1px rgba(35, 35, 35, 0.65); box-shadow: 0px 0px 1px rgba(35, 35, 35, 0.65); width:494px; } .popup h1 { height:35px; position:relative; padding:0; margin:0 0 30px; color:#35383C; font:normal 16px/1.2 Helvetica, Arial, sans-serif; width:295px; } .popup p { padding:6px 0 0; margin:0; color:#66707E; border-top:1px solid #8897A2; font:normal 12px/1.3 Helvetica, Arial, sans-serif; } .popup time{ position:absolute; bottom:10px;right:12px; color:#35383c; font:normal 11px/1.2 Helvetica, Arial, sans-serif; } .popup .download-options { border:0; font-size:1.2em; position:absolute; width:185px; right:12px; } .popup .do1{ top:12px; } .popup .do2{ top:42px; } /*.popup .res { float:left; display:block; width:134px; height:17px; padding:4px 2px 2px 20px; border:1px solid #A9B4BC; background:#ECECEC; background:#ECECEC -moz-linear-gradient(top, rgba(255,255,255,0.13) 0%, rgba(0,0,0,0.13) 100%); background:#ECECEC -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.13)), color-stop(100%,rgba(0,0,0,0.13))); position:relative; color:#73818B; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; -webkit-background-clip:padding-box; -webkit-transition:color 0.4s; -moz-transition:color 0.4s; transition:color 0.4s; } .popup .res:before{ content:''; width:0; height:0; border:3px solid transparent; border-left-color:#8897a2; position:absolute; top:9px; left:7px; } .popup .res:hover{ background:#ECECEC; -webkit-transition:color 1s; -moz-transition:color 1s; transition:color 1s; } .popup .size { width:52px; height:17px; text-align:right; padding:4px 6px 2px 0; display:block; position:absolute; top:0; right:0; border-left:1px solid #A9B4BC; background:#F7F7F7; color:#8897A2; -moz-border-radius:0 3px 3px 0; -webkit-border-radius:0 3px 3px 0; border-radius:0 3px 3px 0; }*/ #videos .res, .popup .res { float:left; display:block; width:134px; height:17px; padding:4px 2px 2px 20px; border:1px solid #A9B4BC; background:#ECECEC; background:#ECECEC -moz-linear-gradient(top, rgba(255,255,255,0.13) 0%, rgba(0,0,0,0.13) 100%); background:#ECECEC -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.13)), color-stop(100%,rgba(0,0,0,0.13))); position:relative; color:#73818B; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; -webkit-background-clip:padding-box; -webkit-transition:color 0.4s; -moz-transition:color 0.4s; transition:color 0.4s; } #videos .res:before, .popup .res:before{ content:''; width:0; height:0; border:3px solid transparent; border-left-color:#8897a2; position:absolute; top:9px; left:7px; } #videos .res:hover, .popup .res:hover{ background:#ECECEC; -webkit-transition:color 1s; -moz-transition:color 1s; transition:color 1s; } #videos .size, .popup .size{ width:52px; height:17px; text-align:right; padding:4px 6px 2px 0; display:block; position:absolute; top:0; right:0; border-left:1px solid #A9B4BC; background:#F7F7F7; color:#8897A2; -moz-border-radius:0 3px 3px 0; -webkit-border-radius:0 3px 3px 0; border-radius:0 3px 3px 0; } .popup .addtodownloads { float:right; margin-top:2px } .popup a:hover { color:#232323 } .ie6 .popup .preview{ height:400px; } /* PHOTOGRAPHY FEATURES BANNERS */ #photo-features{ width:303px; margin-bottom:3px; } #photo-features img{ margin:0; } #photo-features a{ background:url('/images/photo-features/banner.jpg'); display:block; width:151px; padding-top:154px; height:19px; text-align:center; font:normal 12px arial, sans-serif; -webkit-transition:color 0.5s; -moz-transition:color 0.5s; transition:color 0.5s; color:#384762; text-decoration:none } #photo-features a:hover{ -webkit-transition:color 0.3s; -moz-transition:color 0.3s; transition:color 0.3s; color:#FFF; } #ford-feature{ margin:0 1px 0 0; float:left } a#showcase-feature{ margin:0; background-position:-152px 0; float:right } .videoitem .size{width:60px;} #videos .size{width:65px;} #videos .res{font-size:1.2em;} .videoitem .size{padding-right:4px;float:right;text-align:right;}