@import url(http://fonts.googleapis.com/css?family=Muli:400,300,300italic,400italic); /* Abonnement layout ------------------------------------------------------------------------------------------------ COLORSCHEME Buttons, main divider, header (Dark blue) #002957 Sec. area copy (medium blue) #3f6a99 Secondary area - header/footer/body (light blue) #eff5fa Prod. border, sec. divider (light grey) #dbdbdb Form / order (alt. light grey) #ebebeb Tagline BG (strong yellow) #ffe500 Tagline border/text (golden brown) #504106 Callout/savings (deep red) #ef1f1f GRID Outer grid 40px Inner grid 20px COMMENTS - Some elements use alpha-PNG's, cond. comment for IE6 is in effect! ------------------------------------------------------------------------------------------------ */ /* =Global =Structure & =Elements ------------------------------------------------------------------------------------------------ */ * {margin: 0; padding: 0;} /* Allow 42px vert. offset on bg for magazine banners */ body {background: #eff5fa url(../gfx/headerBg.gif) repeat-x 0px 42px; color: #000; font: normal 62.5% 'Lucida Grande', Tahoma, Verdana, sans-serif; text-align: center;} /* Mag =banners */ #magBanner {height: 42px; background-repeat: no-repeat; background-position: center top;} .arena #magBanner {background-color: #fff; background-image: url(../gfx/magBanners/arena.jpg);} .benjamin #magBanner {background-color: #fff; background-image: url(../gfx/magBanners/benjamin.jpg);} .bilmagasinet #magBanner {background-color: #71aac5; background-image: url(../gfx/magBanners/bilmagasinet.jpg);} .bilrevyen #magBanner {background-color: #71aac5; background-image: url(../gfx/magBanners/bilmagasinet.jpg);} .brugtrevyen #magBanner {background-color: #71aac5; background-image: url(../gfx/magBanners/bilmagasinet.jpg);} .brugtbilguiden #magBanner {background-color: #71aac5; background-image: url(../gfx/magBanners/bilmagasinet.jpg);} .aaretsbiler #magBanner {background-color: #71aac5; background-image: url(../gfx/magBanners/bilmagasinet.jpg);} .mcrevyen #magBanner {background-color: #71aac5; background-image: url(../gfx/magBanners/bilmagasinet.jpg);} .boligmagasinet #magBanner {background-color: #b2d1d3; background-image: url(../gfx/magBanners/boligmagasinet.jpg);} .cosmopolitan #magBanner {background-color: #fff; background-image: url(../gfx/magBanners/cosmopolitan.jpg);} .costume #magBanner {background-color: #000; background-image: url(../gfx/magBanners/costume.jpg);} .costumeno #magBanner {background-color: #000; background-image: url(../gfx/magBanners/costumeno.jpg);} .fhm #magBanner, .fhmno #magBanner {background-color: #676767; background-image: url(../gfx/magBanners/fhm.jpg);} .m #magBanner {background-color: #000; background-image: url(../gfx/magBanners/m.jpg);} .vmax #magBanner {background-color: #272727; background-image: url(../gfx/magBanners/vmax.jpg);} .woman #magBanner, .womanno #magBanner {background-color: #f93479; background-image: url(../gfx/magBanners/woman.jpg);} .boligplussno #magBanner {background-color: #f0ede5; background-image: url(../gfx/magBanners/boligplussno.jpg);} .bobedreno #magBanner {background-color: #222; background-image: url(../gfx/magBanners/bobedreno.jpg);} .tarano #magBanner {background-color: #82002d; background-image: url(../gfx/magBanners/tarano.jpg);} .liv #magBanner {background-color: #fff; background-image: url(../gfx/magBanners/liv.jpg);} .womanno #magBanner {background-color: #ef789d; background-image: url(../gfx/magBanners/woman.jpg);} .boligplussno #magBanner {background-color: #f0ede5; background-image: url(../gfx/magBanners/boligplussno.jpg);} .bobedreno #magBanner {background-color: #222; background-image: url(../gfx/magBanners/bobedreno.jpg);} .tarano #magBanner {background-color: #82002d; background-image: url(../gfx/magBanners/tarano.jpg);} .stellamagasinetno #magBanner {background-color: #e2d4c5; background-image: url(../gfx/magBanners/stellamagasinetno.jpg);} .boligplus #magBanner {background-color: #f0ede5; background-image: url(../gfx/magBanners/boligplus.jpg);} /* =Logo links */ #magBanner a {position: absolute; top: 0; left: 50%; margin-left: -490px; height: 42px; text-indent: -9999px;} .arena #magBanner a {width: 200px;} .benjamin #magBanner a {width: 180px;} .bilmagasinet #magBanner a {width: 55px;} .boligmagasinet #magBanner a {width: 100px;} .cosmopolitan #magBanner a {width: 210px;} .costume #magBanner a, .costumeno #magBanner a {width: 205px;} .fhm #magBanner a, .fhmno #magBanner a {width: 115px;} .m #magBanner a {width: 50px;} .vmax #magBanner a {width: 140px;} .woman #magBanner a, .womanno #magBanner a {width: 230px;} .tarano #magBanner a {width: 87px;} /* =Header */ #header {position: relative; width: 759px; margin: 0 auto; padding-left: 201px; text-align: left; color: #002957;} body.multipleMags #header {padding-left: 0; width: 960px;} /* CONVERSION TEST 26. Jan 2010 */ body#orderView #header {width: 960px; padding-left: 0;} body#orderView #header #utils {width: 960px;} body#orderView #header #magCover, body#orderView #header #branding, body#orderView #header #introInfo {display: none;} #utils {float: left; width: 759px; margin: 0 0 20px; padding: 11px 0;} body.multipleMags #utils {width: 960px;} /* =Breadcrumb */ #utils ol, #utils ol * {float: left;} #utils ol { list-style: none; padding-right: 10px; border: 1px solid #fff; border-left-color: #e1e1e1; border-bottom-color: #e1e1e1; background: #fff url(../gfx/breadcrumbBg.jpg) repeat-x; font-weight: bold; } #utils li {padding: .25em; color: #666; text-indent: 45px; position: relative;} #utils ol li a {float: none; color: #666; text-decoration: none;} #utils ol li a:hover {text-decoration: underline;} /* Numbers */ #utils li em { position: absolute; left: 1em; top: -50%; width: 35px; height: 35px; background-repeat: no-repeat; background-position: left center; text-indent: -9999px; } /* Inactive state */ #step1 em {background-image: url(../gfx/breadcrumb_step1_inAct.png);} #step2 em {background-image: url(../gfx/breadcrumb_step2_inAct.png);} #step3 em {background-image: url(../gfx/breadcrumb_step3_inAct.png);} #step4 em {background-image: url(../gfx/breadcrumb_step4_inAct.png);} #receipt_step3 em {background-image: url(../gfx/breadcrumb_step3_inAct.png);} #receipt_step4 em {background-image: url(../gfx/breadcrumb_step4_inAct.png);} /* Active state */ #campaignsView #step1 em {background-image: url(../gfx/breadcrumb_step1_act.png);} #orderView #step2 em {background-image: url(../gfx/breadcrumb_step2_act.png);} #paymentView #step3 em{ background-image: url(../gfx/breadcrumb_step3_act.png); } #receiptView #receipt_step3 em {background-image: url(../gfx/breadcrumb_step3_act.png);} #receiptView #receipt_step4 em {background-image: url(../gfx/breadcrumb_step4_act.png);} #campaignsView #step1, #orderView #step2,#paymentView #step3, #receiptView #receipt_step4, #receiptView #receipt_step3 {color: #002957;} /* faq + terms */ #utils span {float: right; margin-top: 5px;} .faqLink, #termsLink {color: #fff; margin-right: 1em; padding: 2px 0 2px 19px; background-position: 0% 50%; background-repeat: no-repeat;} #utils span a:hover {text-decoration: none;} .faqLink {background-image: url(../gfx/icons/faq.png);} #termsLink {background-image: url(../gfx/icons/infoTerms.png);} #header #magCover {padding: 23px; position: absolute; top: -7px; left: -18px; background: url(../gfx/fpBg.png) no-repeat;} /* Header text */ .no #introInfo {background: url(../gfx/header_Linda.jpg) no-repeat left bottom;} .dk #introInfo.vmax{ background: url(/image/181348/1/0/70) no-repeat left 110px; } .dk #introInfo.bilmagasinet{ background: url(/image/159837/1/0/70) no-repeat left 110px; } .dk #introInfo.woman{ background: url(../gfx/Sara70x70.jpg) no-repeat left 110px; } .dk #introInfo.costume{ background: url(/images/frittet_rikke_small.jpg) no-repeat left 122px; } .dk #introInfo.m{ background: url(/image/181346/1/0/70) no-repeat left 110px; } #branding {float: left; width: 347px;} body.multipleMags #branding {width: 548px;} #introInfo {float: left; width: 346px; min-height: 165px; height: auto !important; height: 165px; padding: 0 0 20px 10px; border-left: 1px solid #3f6a99;} #introInfo span {display: block; margin: 20px 0 0; padding-left: 70px; font-weight: bold;} #introInfo img {display: block;} #header h1, #header h2 {font-size: 1.8em; margin-bottom: 10px;} #header p {font-size: 1.2em; color: #3f6a99;} /* =Content & =Footer */ #pageWrapper {clear: both; background: #fff; text-align: left;} #contentWrapper {width: 960px; margin: 0 auto;} #mainContent, #secondaryContent {width: 960px; float: left; padding: 40px 0;} #secondaryContent {padding-bottom: 0; border-top: 1px solid #dbdbdb;} #footer {clear: both; padding-top: 20px; background: #eff5fa; color: #3f6a99; font-size: 1.2em;} #footerWrapper {width: 960px; margin: 0 auto;} #footerWrapper h4, #footerWrapper h5 {color: #002957; font-size: 1.333em; margin-bottom: 10px;} #footerWrapper p {margin: 0 0 10px;} #footerWrapper a:hover {text-decoration: none;} #terms {float: left; display: inline; width: 542px; padding: 0 20px 0 0; margin: 0 20px 20px 0; border-right: 1px solid #3f6a99;} #faq {float: left; width: 367px; margin: 0 0 20px;} #faq .faqLink {color: #3f6a99; font-size: .833em;} #faq p {margin: 10px 0;} #faq strong, #faq p a {font-weight: bold; color: #002957} #cancellationToggle {outline: 0; color: #002957; font-weight: bold; display: none;} #cancellationTerms {clear: both; padding-top: 10px; border-top: 1px solid #3f6a99; font-size: .833em;} #cancellationTerms strong {display: block; margin: 5px 0 0; color: #002957;} .dk p#boilerPlate {background: url(../gfx/benjaminLogo.gif) no-repeat;} .no p#boilerPlate {background: url(../gfx/bonnierLogo_transp.png) no-repeat;} .no p#boilerPlate {padding: 10px 0 20px 170px;} p#boilerPlate {clear: both; border-top: 1px solid #3f6a99; margin: 20px 0; padding: 10px 0 20px 49px; color: #002957;} hr.clearfix {clear: both; border: 0; color: #fff; background: transparent;} #mainContent hr.clearfix {padding: 20px 0 0;} .calloutButton {border: 0; color: #fff; cursor: pointer; background-repeat: no-repeat; background-position: right top; text-decoration: none;} .calloutButton:hover {background-position: left top; text-decoration: underline;} .calloutButton.callout_primary { width: 133px; background-image: url(../gfx/button_primary.gif); font-size: 1.6em; line-height: 2.2em; text-align: center; } .calloutButton.callout_secondary { width: 110px; background-image: url(../gfx/button_secondary.gif); font-size: 1.2em; line-height: 33px; } .calloutButton.callout_prominent { width: 196px; height: 40px; padding-bottom: 5px; background-image: url(../gfx/button_prominent.gif); background-color: #002957; font-size: 1.4em; } .calloutButton.callout_excessive { width: 308px; height: 58px; padding-bottom: 5px; background-image: url(../gfx/button_excessive_greenbg.gif); background-color: #002957; font-size: 1.6em; } .calloutButton.callout_excessive:hover {text-decoration: none;} img.icon {vertical-align: bottom; margin-bottom: -3px;} .center { text-align: center;} .center.centerDK { text-align: center; height: 1085px;} /* Notifications */ .notify, .alert {margin: 0 0 20px; padding: 10px; font-size: 1.2em;} .notify {background-color: #fff2c0; border: 1px solid #eadeb1;} .notify.relative { position: relative; } .notify a.print-btn {background: url(../gfx/icons/print.jpg) no-repeat left center; color: #3f6a99; padding-left: 25px; font-size: 1.4em; font-weight: bold;} .notify p {line-height:1.5em;} .notify p.big{font-size: 1.7em;} .notify h2 {margin-bottom:5px;} .alert { background-color: #ffbcbc; border: 1px solid #c34646;} .validation-failed {background: #fff2c0;} .notify.confirm { padding-left: 62px; background: #bee38b; border-color: #5b8f16; font-size: 1em; } .confirm .icon {float: left; display: inline; margin: 0 0 0 -42px;} .confirm h2 {font-size: 2.4em;} .confirm p {font-size: 1.4em;} .notify.distinct { margin: 30px 0; padding-left: 52px; background: #ebebeb; border-color: #ccc; font-size: 1em; } .distinct .icon {float: left; display: inline; margin-left: -42px;} .distinct p {font-size: 1.2em;} .notify.additional_binding { position: relative; clear: right; margin: 10px 0 0; padding: 5px 5px 5px 25px; width: 335px; font-weight: bold; font-size: 1.2em; } .notify.additional_binding .bindingAsterisk {position: absolute; top: 5px; left: 5px; line-height: 1em;} /* Hvis du hader IE6 og du ved det - klap dine hænder */ * html .additional_binding {width: 350px !important;} * html .additional_binding .bindingAsterisk {left: -20px;} /* ------------------------------------------------------------------------------------------------ =Front ------------------------------------------------------------------------------------------------ */ #frontView #header {padding: 0; width: 960px;} #frontView h1 {font-size: 1.8em; color: #eff5fa; margin-top: 10px;} #frontView #mainContent {padding: 40px 0 0;} #frontView #mainContent a.rightmargin {margin: 0 20px 0 0;} #frontView a.center {margin: 0 30px;} #frontView a img {margin-bottom: 40px; border: 0; vertical-align: top;} #frontView #faq {float: none; width: 960px;} /* ------------------------------------------------------------------------------------------------ =Service ------------------------------------------------------------------------------------------------ */ #serviceView #header {padding: 0; width: 960px;} #serviceView h1 {font-size: 1.8em; color: #eff5fa; margin-top: 10px;} #serviceView #mainContent {padding: 40px 0 40px;} #serviceView #mainContent p {font-size: 1.4em; margin-bottom: 10px;} #serviceView #mainContent a.rightmargin {margin: 0 20px 0 0;} #serviceView h2 { font-size: 2em; margin: 20px 0 10px 0;} #serviceView a.center {margin: 0 30px;} #serviceView a img {margin-bottom: 40px; border: 0; vertical-align: top;} #serviceView #faq {float: none; width: 960px;} /* ------------------------------------------------------------------------------------------------ =Products ------------------------------------------------------------------------------------------------ */ .product {float: left; width: 293px; position: relative; display: inline; } .product.prodCenter {margin: 0 40px; display: inline;} .product a {position: relative; display: block; margin: 0 0 5px; text-align: center; border: 1px solid #dbdbdb; outline: 0;} .product a.gift {text-decoration: none; -webkit-border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius: 0 0 10px 10px;} .product a img {border: 0;} .caption { /* =Tagline */ position: absolute; top: 10px; left: -10px; padding: .5em; background: #ffe500 url(../gfx/taglineCornerBg.gif) no-repeat right bottom; border: solid #504106; border-width: 0 1px 1px 0; color: #504106; font-weight: bold; font-size: 1.3em; text-transform: uppercase; } .giftRibbon { display: block; position: absolute; top: -3px; right: -3px; width: 99px; height: 80px; background: url(../gfx/gift_ribbon.png) no-repeat; text-indent: -9999px; z-index: 0 !important; /* Always below anything else, eg. caption etc. */ } .giftLabel { position: absolute; width: 100%; left: 0; bottom: 0; padding: 3px 0 5px; border: 0; border-top: 1px solid #aaa; background: #333; color: #fff; font: italic 1.4em/1em Georgia, Times, 'Times New Roman', serif; text-align: center; -webkit-border-bottom-left-radius: 7px; -webkit-border-bottom-right-radius: 7px; -moz-border-radius: 0 0 7px 7px; } .prodHeading {font-size: 2em;} /* above
/
*/ .product h3 {color: #666; font-weight: normal; font-size: 1.4em;} .prodPrice {display: block; margin: .25em .25em 0 0; border-top: 1px solid #002957; font-size: 2.6em; color: #002957; letter-spacing: -.125em; vertical-align: middle;} .prodPrice em {position: relative; left: .5em; bottom: .5em; font-style: normal; color: #aaa; font-size: .5em; font-weight: normal; letter-spacing: 0;} .product p {padding: .5em 0 0; border-top: 1px solid #002957;} .product p .calloutButton {float: right; position: relative; right: -4px; border: 0;} .product p strong {float: right; text-align: right; color: #666; font-weight: normal; font-size: 1.4em;} .prodSavings {display: block; color: #ff6600; font-weight: bold;} /* Sec. content exceptions */ #secondaryContent .product {width: 210px; margin: 0 40px 0 0; padding-bottom: 40px; min-height: 331px; height: auto !important; height: 331px; display: inline;} #secondaryContent .prodLast {margin: 0;} #secondaryContent .caption, #secondaryContent .product p strong {font-size: 1.1em;} #secondaryContent .product h3 {font-size: 1.2em;} #secondaryContent .prodHeading {font-size: 1.6em;} #secondaryContent .prodPrice {font-size: 2.3em;} #secondaryContent .prodPrice em {font-size: .522em;} #secondaryContent .product p .calloutButton {margin: 0;} /* ------------------------------------------------------------------------------------------------ =Order ------------------------------------------------------------------------------------------------ */ .bindingAsterisk {vertical-align: text-top; color: #002957; font-weight: bold; font-size: 28px !important; cursor: help; line-height: .75em;} #orderView .product {width: 294px; margin-right: 20px; padding: 0 20px 0 258px; border-right: 1px solid #3f6a99;} #orderView .product a {float: left; margin: 0 0 0 -258px; width: 236px; display: inline;} #orderView .product h2 {font-size: 2em; color: #002957;} #orderView .product p {margin: 1em 0; padding: 0; border: 0; font-size: 1.4em;} /* Resetting regular txt-links in prod. description */ #orderView .product p a { position: static; display: block; float: none; width: auto; margin: 0; background: none; color: #002957; text-align: left; text-decoration: underline; line-height: 1em; font-size: 1em; } #orderView .product p a:hover {text-decoration: none;} #orderView .product span {display: block; color: #002957; font-size: 1.6em; line-height: .6em;} /* "Din pris:" */ #orderView .prodPrice {display: block; margin: 0; font-size: 4em; color: #002957; line-height: 1em; border: 0;} #orderView .prodSavings {font-size: 1.4em; display: block;} table {width: 367px; float: left; margin-bottom: 20px; font-size: 1.2em; color: #666; text-align: right; border-bottom: 1px solid #000;} th {text-align: left; font-weight: normal; padding: 0 0 .5em;} thead th {width: 250px;} .prodPriceSummary th, .prodPriceSummary td {padding: .25em 0; border-top: 1px solid #999; font-weight: bold;} #prodSavingsTotal {font-size: 1.166em; color: #ff6600;} #prodPriceTotal {font-size: 1.333em; color: #000;} #prodPriceAllIncluded{ color:#002957; font-size:1.333em; } #prodPriceAllIncluded th, #prodPriceAllIncluded td{ border-top: 2px solid #000; padding: .50em 0; font-weight: bold;} .footNote {float: right; width: 367px;} #orderView #secondaryContent {padding: 0 0 40px; border: 0;} #orderView h3 {clear: both; color: #002957; font-size: 1.8em;} #orderView #secondaryContent p {font-size: 1.2em; margin: 0 0 10px;} /* =Order form */ #benForm {float: left; position: relative; width: 948px; padding: 10px 0 10px 10px ; background: #ebebeb; border: 1px solid #000;} #benForm fieldset {float: left; width: 250px; margin-right: 10px; padding: 0 10px 10px 0; border: 0; border-right: 1px solid #999;} #benForm legend { position: absolute; top: 60px; right: -5px; padding: .5em 1.5em; background: #002957; color: #fff; font-weight: bold; font-size: 1.4em; text-transform: uppercase; } .benFormWrapper {float: left;} /* in
(Addr. & accepts) */ #benForm label {display: block; font-weight: bold; font-size: 1.1em;} #benForm label span {color: #666; font-weight: normal;} /* "(valgfri)" */ #benForm input {margin: .215em 0 .5em; padding: 1px 0;} .benFormName input, .benFormAddress input, .benFormAgeContact input {width: 250px;} /* Don't mess with 's !! */ /* =Address fields */ .benFormAddress .benFormWrapper * {width: 55px;} .benFormWrapper#benFormWrapper_city {float: right; } #benForm #benFormWrapper_city * {width: 169px;} /* =Age & =contact */ #benForm fieldset.benFormAgeContact {margin: 0; padding: 0; border: 0;} input#benFormAgeContact_age {width: 30px;} input#benFormAgeContact_phone {width: 60px;} input#benFormAgeContact_mail {width: 120px;} /* =Paymenttype */ #benForm .benFormPaymentType { width: 938px; margin: 0 0 10px -10px; padding: 10px; background: #eff5fa; border: 1px solid #999; border-width: 1px 0; } #benForm .benFormPaymentType strong {display: block; font-size: 1.2em; color: #002957; text-transform: uppercase;} .benFormPaymentType .benFormWrapper {float: none; display: block; margin: 10px 0 0;} #benForm .benFormPaymentType input {margin: 0 5px 0 0; vertical-align: middle;} #benForm .benFormPaymentType label {display: inline;} #benForm .benFormPaymentType img {vertical-align: text-bottom; margin: 0 0 0 10px;} #benForm button {float: left;} #benForm button:hover {background-position: left top;} /* =Accept & =submit */ #benForm .benFormAcceptSubmit {width: 948px; margin: 0; padding: 0; border: 0;} .benFormAcceptSubmit .benFormWrapper {width: 552px; margin-bottom: 5px;} #benForm .benFormAcceptSubmit input {float: left; margin: 0; padding: 0; vertical-align: middle;} #benForm .benFormAcceptSubmit label {float: left; width: 520px; margin-left: 5px; display: inline; font-weight: normal; color: #333;} /* Permission text */ #benForm .benFormAcceptSubmit span span {float: left; margin: 1em 0 0 2em; display: inline;} #benForm .benFormAcceptSubmit label .permissionToggle {margin-left: .25em;} /* =Gift recipients */ #benForm .benFormGiftData { width: 938px; margin: 0 0 10px -10px; padding: 10px; border: 1px solid #000; border-width: 1px 0; background: #cbcbcb; } /* Product =variants */ #benForm fieldset#prodOptions {float: none; padding: 10px 10px 10px 0; margin: 0 10px 10px 0; width: 928px; background: #3f6a99; color: #fff;} #prodOptions legend {display: none !important;} /* Only there for semantic purposes */ #prodOptions label {display: inline; margin: 0 1em;} #benForm em {display: block; font-weight: bold; font-style: normal; color: red; clear: both;} #permissionToggle {display: none;} /* ------------------------------------------------------------------------------------------------ =Payment ------------------------------------------------------------------------------------------------ */ #paymentView{ } #paymentView h3 {clear: both; color: #002957; font-size: 1.8em;} #paymentView #mainContent p {font-size: 1.2em; margin: 0 0 10px;} #paymentView #benForm {width: 525px; margin: 0 40px 0 0; padding: 10px; display: inline;} #paymentView #benForm fieldset {float: left;} #paymentView #benForm fieldset.benFormPaymentType {margin:0; padding: 0 0 15px 0; border: 0; width: 525px; height: 15px; background: url(../gfx/cards.jpg) no-repeat 280px 5px; margin-bottom: 10px;} #paymentView #benForm fieldset.benFormPaymentType label{ float: left; margin: 5px 10px 0 0; color:#002957; font-size: 1.2em;} #paymentView #benForm fieldset.benFormPaymentType select{ float: left; margin: 3px 0 0px 0; } #paymentView #benForm fieldset.benFormCardInfo {margin: 0; padding: 0; border: 0; width: 270px;} #paymentView #benForm fieldset.benFormCardInfo input{ width: 250px; } #paymentView #benForm fieldset.benFormAcceptSubmit{ width: 525px; margin: 0; padding: 0px 0 0px 0; float: left; } #paymentView #benForm fieldset.benFormAcceptSubmit button{ margin-right: 0px; margin-bottom: 0px; } #paymentView #benForm fieldset.benFormControlNumbers{ float: left; width: 245px; border: 0; margin: 0; padding: 0;} #paymentView #benForm fieldset.benFormControlNumbers span{ float: left; padding: 0 15px 5px 0; display: inline;} #paymentView #benForm fieldset.benFormControlNumbers span label{ float: left; } #paymentView #benForm fieldset.benFormControlNumbers input{ float: left; clear: both; margin-right: 10px; } #paymentView #benForm fieldset.benFormControlNumbers select{ float: left; clear: both; margin-right: 10px; margin: 3px 0 2px 0;} #benFormControlNumbers_expiryMonth{ width: 50px; float: left; } #benFormControlNumbers_expiryYear{ width: 50px; float: left; } #benFormControlNumbers_controlNumbers{ width: 30px; float: left; } #paymentView #benForm fieldset.benFormConditions{float: right; border: 0; border-left: 1px solid #999999; padding: 0 0 0 15px; margin-right: 0px; width: 235px; height: 130px;} #paymentView .recipientData{ float: right; width: 358px; margin-top: 10px; clear: right; } #paymentView strong{ font-size: 1.2em; float: right; margin-right: 230px;} #paymentView #benform .giro{ padding: 10px; } /* ------------------------------------------------------------------------------------------------ =Receipt ------------------------------------------------------------------------------------------------ */ #receiptView #header {padding-left: 0; width: 960px;} #receiptView #utils {width: 960px;} #receiptView #mainContent {padding: 20px 0;} #receiptView .confirm {padding-right: 400px;} #receiptView .confirm h2 {margin: 0 0 10px;} #receiptView .confirm form {float: right; display: inline; margin: 20px -400px 0 0; width: 400px; text-align: center;} #receiptView .confirm form img {display: block; float: none; margin: 5px auto 0;} #receiptView .confirm button {text-indent: -15px; font-size: 2.4em;} #receiptView .confirm form button img {display: inline; vertical-align: middle; margin: 0;} #receiptView .confirm .clearfix {color: #BEE38B;} #receiptView .column h2 {margin: 0 0 10px; font-size: 1.6em; border-bottom: 1px solid #ddd;} #receiptView .column h3 {margin: 20px 0 10px 0; font-size: 1.4em; color: #002957;} #receiptView .column p {font-size: 1.2em; margin: 0 0 20px;} #receiptWrapper {float: left; width: 528px; padding-right: 20px;} .recipientData {list-style: none; margin: 0 0 20px; padding-left: 10px; color: #002957; font-size: 1.4em; font-weight: bold; border-left: 5px solid #dbdbdb;} #receiptView li em {font-style: normal; color: #000;} #receiptView li strong {display: block; margin-top: 5px; font-weight: normal;} #printWrapper { display: block; padding-left: 30px; min-height: 25px; line-height: 150%; background: url(../gfx/icons/print.jpg) no-repeat left center; color: #3f6a99; } #printWrapper strong {display: block; font-weight: normal; font-size: 1.2em;} #printButton {color: #002957; font-size: 1.4em;} #printButton:hover {text-decoration: none; color: #000;} .only-when-print { display: none; } #paymentWrapper {float: left; width: 412px;} #paymentWrapper table {width: 412px;} #receiptView .notify.additional_binding {width: 380px;} #receiptView #secondaryContent {padding: 20px 0;} #receiptView #secondaryContent h3 {margin: 0 0 10px; color: #002957; font-size: 2em;} #receiptView .product {width: 394px; margin-right: 20px; padding: 0 20px 0 158px; border-right: 1px solid #dbdbdb; min-height: 200px;} #receiptView .product a {float: left; margin: 0 0 0 -158px; width: 136px; display: inline;} #receiptView .product h2 {font-size: 1.6em; color: #002957;} #receiptView .product p {margin: 1em 0; padding: 0; border: 0; font-size: 1.2em;} /* Resetting regular txt-links in prod. description */ #receiptView .product p a { position: static; display: block; float: none; width: auto; margin: 0; background: none; color: #002957; text-align: left; text-decoration: underline; line-height: 1em; font-size: 1em; } #receiptView .product p a:hover {text-decoration: none;} #receiptView .product span {display: block; color: #002957; font-size: 1.6em; line-height: .6em;} /* "Din pris:" */ #receiptView .prodPrice {display: block; margin: 0; font-size: 4em; color: #002957; line-height: 1em; border: 0;} #receiptView .prodSavings {font-size: 1.4em; display: block;} /* ------------------------------------------------------------------------------------------------ =Cancel_receipt ------------------------------------------------------------------------------------------------ */ #cancel_receiptView #mainContent h2 {margin: 0 0 20px; color: #002957; font-size: 2em;} #cancel_receiptView #mainContent h3 {margin: 20px 0 10px 0; font-size: 1.4em; font-weight: normal;} #cancel_receiptView #mainContent p {font-size: 1.4em; margin: 0 0 20px;} /* ----------------------------------------------------------------------------------------------- =Print gift card ------------------------------------------------------------------------------------------------ */ #printGiftcard h1, #printGiftcard h2 { color: #888; font-family: 'Muli', sans-serif; } #printGiftcard h1 { font-size: 5em; } #printGiftcard h2 { font-size: 3em; color: #000; } #printGiftcard .background { position: absolute; top: 0; display: block; margin-left: auto; margin-right: auto;} #printGiftcard p { font-family: 'Muli', sans-serif; margin-top: 20px; font-size: 2.5em; } #printGiftcard p.caps { text-transform: uppercase; } #printGiftcard p.caps.text_red {color:#cd0e13; margin-bottom: 50px;} #printGiftcard p.giftcardCode { padding: 10px 30px; width: 400px; margin: 40px auto 0 auto; font-weight: bold; margin-bottom: 50px; border: 2px dotted #000; } #printGiftcard .copy { font-size: 12px; width: 700px; margin: 0 auto; margin-top: 50px; } #printGiftcard ul.steps { font-size: 2em; list-style: none; width: 700px; line-height: 1.2em; margin: 0 auto; } #printGiftcard ul li { margin-top: 20px; } #printGiftcard ul li.icon { padding-left: 50px; min-height: 30px; } #printGiftcard ul li.icon.step1 { background: transparent url(/images/screen_icon.jpg) no-repeat; } #printGiftcard ul li.icon.step2 { background: transparent url(/images/book_icon.jpg) no-repeat; } #printGiftcard .DK_icons { position: absolute; margin-left: -70px; display: block;} #printGiftcard #mags { position: relative; display: block; width: 500px; height: 254px; margin: 80px 0 20px 135px; -moz-transform: rotate(-5deg); -o-transform: rotate(-5deg); -webkit-transform: rotate(-5deg); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9961946980917455, M12=0.08715574274765817, M21=-0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand')"; } #printGiftcard #mags img { position: absolute; bottom: 0; left: 0; -moz-box-shadow: 3px 3px 25px #CCC; -o-box-shadow: 3px 3px 25px #CCC; -webkit-box-shadow: 3px 3px 25px #CCC; box-shadow: 3px 3px 25px #CCC; -moz-transform: rotate(-20deg); -o-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9396926207859084, M12=0.3420201433256687, M21=-0.3420201433256687, M22=0.9396926207859084, sizingMethod='auto expand')"; zoom: 1; border: 1px solid #DBDBDB; } #printGiftcard #mags img { position: absolute; bottom: 0; left: 0; -moz-box-shadow: 3px 3px 25px #ccc; -o-box-shadow: 3px 3px 25px #ccc; -webkit-box-shadow: 3px 3px 25px #ccc; box-shadow: 3px 3px 25px #ccc; /* Rotations appear courtesy of http://css3please.com/ */ -moz-transform: rotate(-20deg); -o-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9396926207859084, M12=0.3420201433256687, M21=-0.3420201433256687, M22=0.9396926207859084, sizingMethod='auto expand')"; zoom: 1; border: 1px solid #dbdbdb; } * html #mags img {position: static;} /* Bilmagasinet */ #printGiftcard #mags img + img { bottom: 15px; left: 70px; -moz-transform: rotate(-15deg); -o-transform: rotate(-15deg); -webkit-transform: rotate(-15deg); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9659258262890683, M12=0.25881904510252074, M21=-0.25881904510252074, M22=0.9659258262890683, sizingMethod='auto expand')"; } /* Bolig */ #printGiftcard #mags img + img + img { bottom: 25px; left: 140px; -moz-transform: rotate(-10deg); -o-transform: rotate(-10deg); -webkit-transform: rotate(-10deg); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.984807753012208, M12=0.17364817766693033, M21=-0.17364817766693033, M22=0.984807753012208, sizingMethod='auto expand')"; } /* Vmax */ #printGiftcard #mags img + img + img + img { bottom: 25px; left: 210px; -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -webkit-transform: rotate(0deg); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=1, sizingMethod='auto expand')"; } /* Liv */ #printGiftcard #mags img + img + img + img + img { bottom: 25px; left: 280px; -moz-transform: rotate(5deg); -o-transform: rotate(5deg); -webkit-transform: rotate(5deg); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand')"; } /* Costume */ #printGiftcard #mags img + img + img + img + img + img { bottom: 15px; left: 350px; -moz-transform: rotate(10deg); -o-transform: rotate(10deg); -webkit-transform: rotate(10deg); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.984807753012208, M12=-0.17364817766693033, M21=0.17364817766693033, M22=0.984807753012208, sizingMethod='auto expand')"; } /* Woman */ #printGiftcard #mags img + img + img + img + img + img + img { bottom: -5px; left: 420px; -moz-transform: rotate(15deg); -o-transform: rotate(15deg); -webkit-transform: rotate(15deg); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9659258262890683, M12=-0.25881904510252074, M21=0.25881904510252074, M22=0.9659258262890683, sizingMethod='auto expand')"; } /* Bolig Plus */ #printGiftcard #mags img + img + img + img + img + img + img + img { bottom: -25px; left: 490px; -moz-transform: rotate(20deg); -o-transform: rotate(20deg); -webkit-transform: rotate(20deg); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.9396926207859084, M12=-0.3420201433256687, M21=0.3420201433256687, M22=0.9396926207859084, sizingMethod='auto expand')"; }