/* -------------------------------------- Ecommerce website - main layout styles Base styles are in id966 Generic styles stylesheet (which serves Academic, Bibles, Alerts and ecommerce (checkout/my account)) Andrew Maison, oct 2008 Julie Elsden, jan 2009 -------------------------------------- */ /* -------------------------------------- body (ecommerce styles in addition to the base ones) -------------------------------------- */ body { background: #ececec; } /* -------------------------------------- header -------------------------------------- #header {margin: 0;padding: 0; } .user-login input, .user-forgotten-password input {margin-bottom: 10px; } .user-login {margin-top: 10px; } /* -------------------------------------- header brand -------------------------------------- */ #headerbrand {margin: 0;padding: 30px 0 20px 20px; background: #004884;} #wrapper_popup #headerbrand {margin: 0; padding: 13px 0 10px 20px;} #header #utilities {background:#fff;} /* -------------------------------------- logo -------------------------------------- */ #logo {margin: 0;padding: 0;width: 257px;height: 54px; background: url(../images/ecomm_logo_reversed.gif) no-repeat; } #logo a:link, #logo a:visited, #logo a:hover, #logo a:active {display: block; height: 54px; } #logo img {display: none;} #wrapper_popup #logo {margin: 0;padding: 0;width: 257px;height: 54px; background: url(../images/ecomm_logo_reversed.gif) no-repeat;} /* -------------------------------------- structure - two column layout - supplementary to base styles -------------------------------------- */ #contentwrapper_2col {margin: 0;padding: 0 0 20px 0;float: right;width: 100%;margin-left: -190px;} #contentwrapper_2col #content {margin: 0 0 0 190px;padding: 5px 20px 5px 10px; height: 1%; } #column {margin: 0 0 0 10px;padding: 10px 0 0 0;float: left;display: inline; /* IE double margin bug */width: 170px;} /* -------------------------------------- structure - one col layout - supplementary to base styles -------------------------------------- */ #contentwrapper_1col { margin: 0; padding: 0 0 20px 0;} #contentwrapper_1col #content { padding: 10px 40px 5px 40px;} #wrapper_popup #content .contentbox { margin: 0 0 15px 0; padding: 25px 25px 15px 25px; height: 1%; line-height: 1.3; } #wrapper_popup #content .contentbox h2 { margin: 20px 0 10px 0;} #wrapper_popup #content .contentbox ul { margin: 0 0 20px 20px; padding: 0; } #wrapper_popup #content .contentbox li { margin: 0 0 15px 0; list-style: disc; } /* -------------------------------------- utilities (specified on template) wraps all items at top of screen 1. logout 2. utility tools 3. Change location -------------------------------------- */ #utilities { margin: 0; padding: 3px 0; font-size: 0.93em; background: #fff; } /* -------------------------------------- utility tools (specified in saved search portlet properties) wraps most utility tools and Country select; does NOT include the (separate) Vyre Logout portlet -------------------------------------- */ .utilityTools { margin: 0; padding: 0; float: right; } /* -------------------------------------- utilities - toolbox -------------------------------------- */ #utilities #toolbox { margin: 0; float: left; } #utilities #toolbox ul, #utilities #toolbox ul li { margin: 0; padding: 0; float: left; list-style: none; } #utilities #toolbox ul li { padding: 2px 7px 2px 7px; background: url(../images/generic_standard_dotdivider.gif) no-repeat 100% 50%;} #utilities #toolbox ul li.toolUserEmail { padding: 2px 7px 2px 0; } #utilities #toolbox ul li.toolHelp { background: none;} #utilities #toolbox ul li a:link, #utilities #toolbox ul li a:visited { margin: 0; padding: 0x; text-decoration: none; display: block; float: left; font-weight: 700; color: #333;} #utilities #toolbox ul li a:hover, #utilities #toolbox ul li a:active { color: #004F9A; text-decoration: underline;} #utilities #toolbox ul li.toolMyCart a:link, #utilities #toolbox ul li.toolMyCart a:visited { background: url(../images/generic_standard_toolbasket.gif) no-repeat 0 50%; padding-left: 26px;} #utilities #toolbox ul li.toolMyCart a:hover, #utilities #toolbox ul li.toolMyCart a:active { background: url(../images/generic_standard_toolbasket_hover.gif) no-repeat 0 50%; padding-left: 26px; } /* -------------------------------------- utilities - country select -------------------------------------- */ #utilities #countryselect { margin: 0 15px 0 5px; padding: 2px 0 2px 10px; font-weight: 700; color: #004f9a; border-left: 1px solid #333; float: left; } #utilities #countryselect ul { margin: 0; padding: 0; list-style: none; } #utilities #countryselect ul li { margin: 0 0 0 3px; padding: 0; display: inline; } #utilities #countryselect ul li a:link, #utilities #countryselect ul li a:visited { margin: 0; padding: 0 0 0 3px; color: #333;} /* -------------------------------------- utilities - Log out -------------------------------------- */ #utilities .utilityLogout { margin: 0; padding: 2px 5px 2px 7px; float: right; } #utilities .utilityLogout a:link, #utilities .utilityLogout a:visited { margin: 0; padding: 0x; text-decoration: none; display: block; float: left; font-weight: 700; color: #333;} #utilities .utilityLogout a:hover, #utilities .utilityLogout a:active { color: #004F9A; text-decoration: underline;} /* -------------------------------------- generic styles -------------------------------------- */ h1 {margin: 10px 0 10px 0;padding: 0;font-size: 1.5em; color: #004884;} h2 {margin: 10px 0 0 0;padding: 0;font-size: 1.2em; color: #004884; } h3 {margin: 5px 0 2px 0;padding: 0;color: #000;font-size: 1.1em;} h4 {margin: 5px 0 2px 0;padding: 0;color: #000;font-size: 1em;} table {width: 99%; margin: 0 5px 0 5px;} table#checkboxTable {display: block; clear: both;} table#checkboxTable table table {width: 185px; } td {padding: 5px 0 5px 0; vertical-align: top;} th {font-weight: 700; text-align: left; } p.short {clear: both; padding-top: 5px;} p.short a {margin-right: 5px;} a.helpLink {background:transparent url(../images/help_icon.gif) no-repeat scroll left top; padding: 1px 0 0 17px; } fieldset{clear: both;} /* #continueText a.helpLink {display:block;} */ /* -------------------------------------- link styles for content area -------------------------------------- */ a:link {color: #004884; text-decoration: underline;} a:visited {color: #004884; text-decoration: underline;} a:hover, a:active { color: #004884; text-decoration: none;} /* -------------------------------------- footer - supplementary to base styles -------------------------------------- */ #footer { padding: 10px; /* border-top: 1px solid #ccc; */ color: #666; background: #ececec; } /* ============================================= */ /* FOLLOWING TO BE ADDED TO BRANDED WEBSITES */ /* ============================================= */ /* -------------------------------------- button styles -------------------------------------- */ /* button style - used on Update payment details */ #content a:link.button, #content a:visited.button, #content .boxButtons a:link, #content .boxButtons a:visited { border: 1px solid #000000; font-weight: bold;margin: 5px 0 5px 0; background: #004884 url(../images/button.jpg) repeat-x scroll left bottom;padding: 5px; color: #fff; text-decoration: none; display: block; float: left; /* clear: both; */ } #content a:hover.button, #content a:active.button, #content .boxButtons a:hover, #content .boxButtons a:active {background: #000000 url(../images/button_hover.jpg) repeat-x scroll left bottom; } #content #newAccountBt a:link.button, #content #newAccountBt a:visited.button, #content #contentPaymentContinue a:link.button, #content #contentPaymentContinue a:visited.button, #content #dispatchAddressBt a:link.button, #content #dispatchAddressBt a:visited.button, #content .dispatch a:link, #content .dispatch a:visited, #content #placeOrderBt a:link.button, #content #placeOrderBt a:visited.button, #content .okbutton a:link.button, #content .okbutton a:visited.button, #content a:link#confirmLogin, #content a:visited#confirmLogin {background: #ffc538 url(../images/button_gold.jpg) repeat-x scroll left bottom; border: 1px solid #000000; color: #000000; font-size: 1.2em; padding: 8px; } #content #newAccountBt a:hover.button, #content #newAccountBt a:active.button, #content #contentPaymentContinue a:hover.button, #content #contentPaymentContinue a:active.button, #content #dispatchAddressBt a:hover.button, #content #dispatchAddressBt a:active.button, #content .dispatch a:hover, #content .dispatch a:active, #content #placeOrderBt a:hover.button, #content #placeOrderBt a:active.button, #content .okbutton a:hover.button, #content .okbutton a:active.button, #content a:hover#confirmLogin, #content a:active#confirmLogin {background: #000000 url(../images/button_hover.jpg) repeat-x scroll left bottom; border: 1px solid #000000; color: #ffc538;} #content a#lookup_bt_a:link {margin-bottom: 10px;} #submit-user-login, #submit-forgotten-password { background: #ffc538 url(../images/button_gold.jpg) repeat-x scroll left bottom; border: 1px solid #000000; color: #000000; font-size: 1.2em; padding: 7px;vertical-align:middle; font-weight: bold; display: block; margin:10px 0; height: 34px; } #submit-user-login:hover, #submit-forgotten-password:hover {background: #000000 url(../images/button_hover.jpg) repeat-x scroll left bottom; color: #ffc538; border:1px solid #000000;} .boxButtons .edit {float: left; margin-right: 5px;} .boxButtons .delete {float: left} #content .updateCard .boxButtons a:link.button, #content #editCard .boxButtons a:link.button {margin-right: 5px;} /* small button: used in Update of Delivery Charges portlet */ #content a:link.small-button, #content a:visited.small-button { border: 1px solid #000000; font-weight: bold; margin: 0; background: #004884 url(../images/button.jpg) repeat-x scroll left bottom; padding: 2px 3px; color: #fff; text-decoration: none; font-size: 0.93em; } #content a:hover.small-button, #content a:active.small-button {background: #000000 url(../images/button_hover.jpg) repeat-x scroll left bottom; } /* end small button: used in Update of Delivery Charges portlet */ /* button style - Place order - button suppressed - */ #content span.disabled-button {border: 1px solid #000000; font-weight: bold;margin: 5px 0 5px 0; background: #333 url(../images/button_hover.jpg) repeat-x scroll left bottom;padding: 5px; color: #fff; text-decoration: none; display: block; float: left; } /* -------------------------------------- login page styles generic styles for checkout and my account -------------------------------------- */ input[type=password], input[type=text] {height: 15px;} #login {margin: 0 10px 0 140px; /* move login over to left to give appearance of centred */padding: 20px 0;width: 300px; float: left; display: inline; /* avoid double margin float bug on IE */background: #E8EDF3;} #loginNew, .user-login{margin: 5px 30px 5px 0; padding: 10px 0;width: 330px; background: #E8EDF3; float: left;} #loginNew input[type=text], #loginNew input[type=password] {width: 225px;} .user-login input[type=text], .user-login input[type=password] {width: 150px;} #login h2, #loginNew h2 {margin: 10px 10px 0 10px; padding: 0;} #login form, #loginNew form, .user-login form {margin: 0 10px; padding: 0;} #login form p, #loginNew form p, .user-login form input.text {margin: 0 0 6px 0; padding: 0; clear: both;} #login #sendPassLink {margin: 0 10px; clear: both;} /* #submit-user-login, #submit-forgotten-password { border: 1px solid #000000; background: transparent url(../images/button.jpg) repeat-x scroll left bottom; padding: 2px; color: #fff; margin: 10px 0 0 0; vertical-align:middle; font-weight: bold; display: block;} */ .user-forgotten-password {margin-top: 10px;} form#genericRegistrationForm {background-color: #E8EDF3; padding: 10px; margin: 5px 0;} form#genericRegistrationForm label {float: left; margin-right: 5px;} form#genericRegistrationForm input {margin-right: 5px;} form#genericRegistrationForm h4 {margin-top: 10px;} form#genericRegistrationForm a.button {clear: both;} /* -------------------------------------- send password generic styles for checkout and my account -------------------------------------- */ #contentPassword {margin: 0 auto; padding: 20px 0;width: 500px; background: #E8EDF3;} #contentPassword h2 {margin: 0 10px; padding: 0;} #contentPassword form {margin: 0 10px; padding: 0;} /* -------------------------------------- alumni discount generic styles for checkout and my account -------------------------------------- */ #alumniDiscount {float: left; margin: 10px 0; padding: 10px 0;width: 350px; background: #E8EDF3; } #alumniDiscount form {margin: 0 10px; padding: 0; } #alumniDiscount a.button:link {margin-right: 5px; } #alumniDiscount p.form_key {margin-bottom: 20px;} #alumniDiscount select.select {margin: 0 0 10px 0;} #alumniDiscount label{clear: both; margin-top: 10px;} #alumniDiscount span.assist{margin-bottom: 10px;} /* -------------------------------------- discount box -------------------------------------- */ #discount_box {margin: 0 0 5px 0; border: 1px solid #b4cdec; padding: 10px 0;width: 250px; background: #E8EDF3;float: right;display: inline; } #discount_box form {margin: 0 10px; padding: 0;} #discount_box form input {float: left; margin-top: 3px;} #discount_error {color: red;} #discount_link {margin: 0;padding: 0;float: right;font-weight: 700;} /* -------------------------------------- promotion landing page -------------------------------------- */ #categoryPanel {padding-bottom: 10px; margin-bottom: 5px; border-bottom: 1px solid #E8EDF3;} #landingPagePanel table#isbnTable {border-top: 1px solid #E8EDF3; margin-top: 5px; width: 100%;} #landingPagePanel table#isbnTable td {padding: 10px 0; border-bottom: 1px solid #E8EDF3;} #landingPagePanel table#isbnTable td.image {vertical-align: top; width: 90px;} #landingPagePanel table#isbnTable td.image img {width: 70px;} #subheadingPanel a {margin-left: 10px;} #subheadingPanel a:link, #subheadingPanel a:visited {background: #E8EDF3; border: 1px solid #004884; padding: 3px; text-decoration: none;} #subheadingPanel a:hover, #subheadingPanel a:active{background: #004884; padding: 3px; text-decoration: none; color: #E8EDF3;} #subheadingPanel select#orderBy {margin-bottom: 0;} table#isbnTable td.detail {padding-top: 5px;} table#isbnTable td.detail li {padding-bottom: 5px;} table#isbnTable td.detail li.book {font-weight: bold; font-size:1.1em;} table#isbnTable td.detail li.now {font-weight: bold;} #landingPagePanel table.data-scroller {width: auto;} #landingPagePanel table.data-scroller a {margin-right: 7px;} /* -------------------------------------- Delivery addresses page Address box items -------------------------------------- */ #paymentBox {clear: both; padding: 10px; } #paymentBox ul li {margin-top: 5px;} #paymentBox strong {margin-left: 5px;} .addressItem {margin: 10px 0 0 0; padding: 10px;background: #E8EDF3; overflow: hidden; height: 1%; float: left;width: 30%;} .confirmPage .addressItem {float: left; width: 400px; margin-right: } /* .Delivery .addressItem{float: left; width: 420px; margin-right: 13px;} .Billing .addressItem{float: left; width: 420px;} */ .addressItem ul {margin: 0 10px 10px 0; } .addressDetails {margin-bottom: 7px;} #addressDetails, .addressDetails {height: 1%; } #addressDetails .buildingNumber, .addressDetails .buildingNumber {float: left; margin-right: 5px;} #addressDetails .street, .addressDetails .street {float: left; } #addressDetails .town, .addressDetails .town {clear: left; } #selectAddressPanel fieldset {margin-top: 30px;} /* NEW by J.E. for address lookup markup changes */ .leftLabel {float: left; width: 117px; } .rightInput {float: left; } input.rightInput {width: 210px;} #addressForms {/* width: 380px; float: left; */ margin-bottom: 10px; } #addressForms input, #addressForms .leftLabel, #addressForms #createAddress select, #editDelivery input, #editDelivery .leftLabel, #editDelivery select {margin: 4px 0; } #addressForms a {margin-top: 2px;} #addressForms p {margin: 0; width: 100%;} #addressForms #saveAddressBt, #addressForms #dispatchAddressBt {margin-top: 7px;} #addressItems {margin: 5px 0 10px 0; /* float: left; */ overflow: hidden; height: 1%; width: 820px; background: #E8EDF3; } /* -------------------------------------- Create Address Delivery addresses -------------------------------------- */ #createAddress, #editDelivery {margin: 10px 10px 10px 0; padding: 10px 0;width: 400px/* 370px */; background: #E8EDF3;float: left;} #createAddress h2, #editDelivery h2 {margin: 0 10px 10px 10px;padding: 0;b/order: 1px solid red;} #createAddress form, #editDelivery form {margin: 0 10px; padding: 0;} #createAddress p, #addressLookup p, #editDelivery p {ma/rgin: 0 0 10px 0; clear: both;} #editDelivery #saveAddressBt, #createAddress #saveAddressBt, /* #createAddress #dispatchAddressBt, */ #editDelivery #dispatchAddressBt {margin: 5px 5px 0 0;float: left;} #createAddress #dispatchAddressBt {clear:both;} #createAddress select, #editDelivery select {margin: 0; padding: 0} /* -------------------------------------- Address Lookup and Result boxes- Capspan form Delivery addresses -------------------------------------- */ #addressLookup{margin: 10px 20px 0 0; padding: 10px 0 0 0;width: 400px/* 370px */; background: #E8EDF3;float: left;} #addressLookup h2 {margin: 0 10px 10px 0; padding: 0;} #addressLookup form {margin: 0 10px; padding: 0;} #addressResult {margin: 10px 0 0 0; padding: 8px 0;width: 100%; /* background: #E8EDF3; */float: left;} #addressResult h2, #addressResult p{margin: 0; padding: 0;} #addressResult select {width: 350px;margin: 0 0 10px 0; } #addressForms .active {background: #f8eed5;} /* -------------------------------------- edit card checkout page -------------------------------------- */ #editCard {margin: 5px 0 15px 0; width: 300px; padding: 10px;background: #E8EDF3; } #editCard p {margin-top: 15px; } #editCard label {float: left; margin-right: 5px;} #editCard table {margin: 0;} #editCard td {vertical-align: middle;} #editCard form {margin: 0 10px; padding: 0;} #editCard form input.validateCheckbox {margin: 0 5px 0 0;} #editCard h3 {color: #004884; font-size:1.2em;} #editCard ul li {margin-top: 15px;} #editCard #validToMonth, #editCard #validFromMonth {margin: 0 20px;} #editCard #validToYear, #editCard #validFromYear {margin: 0;} #editCard span#expires, #editCard span#validfrom {display:block; width: 80px; float: left;} /* -------------------------------------- select payment method -------------------------------------- */ /* radio buttons at top of page */ #selectMethod {margin: 0 0 15px 0; padding: 10px;background: #E8EDF3;} #selectMethod input, #selectMethod label {display: inline;vertical-align: middle;} /* pay with existing card */ #selectExisting {margin: 0 0 15px 0; padding: 10px;background: #E8EDF3;} #selectExisting table {margin: 0} td.cardType {padding-left: 20px;} /* create new card */ #selectNew {margin: 0 0 15px 0; padding: 10px;background: #E8EDF3;} #selectNew select, #selectNew input {margin: 1px 0 0 0;} /* create new card */ #selectNew table{margin-left: 28px; width: 90%;} #selectNew table td.cell6, #selectNew table td.cell8 {wid/th: 150px;bor/der: 1px solid red;} #selectNew select, #selectNew input.validateCardNum, #selectNew input.validateName {display: block;} select.validateED, select.validateVF {min-width: 50px;} #selectNew input[type="radio"],#selectProforma input[type="radio"],#selectExisting input[type="radio"] {margin-right: 10px;} #selectNew .cell4 {width: 92px;} #selectNew .cell5 {width: 50px;} #selectNew .cell6, #selectNew .cell8 {width: 220px; padding-left: 60px;} /* proforma invoice */ #selectProforma {margin: 0 0 15px 0; padding: 10px;background: #E8EDF3;} #selectProforma a {margin: 2px 0 0 30px;} /* select payment continue button */ #contentPaymentContinue {float:right;} #continueText {float:left; width: 85%; margin: 3px 0 0 10px; line-height:150% } #confirmCheckout {} #confirmCheckout label {float: left; margin-right:5px;} #confirmCheckout p {margin-top: 20px; } #confirmCheckout .validateCheckbox {margin-left: 10px;} #printOrderSummary {float: right;} #allOrdersPanel, #fulfilledOrdersPanel, #openOrdersPanel {margin: 5px 10px 0 0; padding: 10px;width: 95%; background: #E8EDF3;float: left;} #allOrdersPanel h3, #fulfilledOrdersPanel h3, #openOrdersPanel h3 {color: #004884; font-size:1.2em;} #allOrdersPanel th, #fulfilledOrdersPanel th, #openOrdersPanel th {color: #004884; text-transform:uppercase;} #allOrdersPanel table, #fulfilledOrdersPanel table, #openOrdersPanel table {margin: 0} table#allOrdersTable td {vertical-align: middle; } table#allOrdersTable td.button {vertical-align: top; padding-top:0; } #loadPanel h3 {color: #004884; font-size:1.2em; margin: 15px 0 5px 0; clear: both;} #loadPanel h4 {color: #004884; text-transform:uppercase; margin: 15px 0 5px 0;} .returnPolicy {margin: 7px 0; } /* -------------------------------------- my account homepage -------------------------------------- */ /* #ecomViewSites - view our sites - browse area to take users to website homepage */ #ecomViewSites { padding: 10px ; margin: 30px 0 10px 0; background: #e5ecf2; border: 1px solid #b5c7D5;} #ecomViewSites h2 { margin: 0; padding: 0; font-size: 1em; } #ecomViewSites ul { margin: 0 0 10px 0; padding: 0; list-style: none;} #ecomViewSites ul li { margin: 0 0 10px 0; padding: 0; display: inline; border-left: 1px solid #000; } #ecomViewSites a:link { padding: 0 0 0 5px; } #ecomViewSites a:visited { padding: 0 0 0 5px;} #ecomViewSites a:hover, #ecomViewSites a:active { } #ecomViewSites li.first { border-left: none;} #contentCamAlerts {margin-bottom: 10px;} /* -------------------------------------- update details my account -------------------------------------- */ #changeDetails {margin: 5px 0; padding: 10px 0;width: 330px; background: #E8EDF3;} #changeDetails p {margin-bottom: 13px;} #changeDetails fieldset {margin: 0 10px; padding: 0;b/order: 1px solid red;} #content_alert_maintenance {margin-left: 5px;} #content_subject_list{background:#E8EDF3 none repeat scroll 0 0; margin:5px 0; padding:10px 5px 40px 5px; width:410px;} #content_subject_list table {margin: 0; padding: 0; border-collapse: collapse;} #content_subject_list table#checkboxTable tr.parent td {padding-top: 5px; border-top: 1px solid /* #D0DDE8 */ #ffffff; } #content_subject_list table#checkboxTable tr.child td {border: none; padding-top: 0; } #content_subject_list table td {padding: 0 2px 10px 0; } #content_subject_list input {margin: 0 8px 0 3px; float: right;} #content_subject_list select {margin-left: 10px;} .update_success {padding: 25px; color: #004884; font-weight: bold;} /* -------------------------------------- update payment details my account -------------------------------------- */ #updatePaymentWrap {margin: 0 0 20px 0; padding: 20px 0 30px 0;width: 500px; background: #E8EDF3;} #updatePaymentWrap .updateCard, #updatePaymentWrap .updateBilling {width: 220px; margin: 0 10px; float: left;} #updatePaymentWrap .updateCard form {margin: 0; padding: 0;} #updatePaymentWrap .updateCard h4, #updatePaymentWrap .updateBilling h4 {margin: 0 0 10px 0 ; padding: 0;font-size: 1em;} #updatePaymentWrap .updateCard ul {margin: 0 0 20px 0 ; padding: 0;} #updatePaymentWrap .updateCard ul li {clear: both; margin-bottom: 5px;} #updatePaymentWrap .updateCard label{float: left; display: inline; margin-right: 5px;} #updatePaymentWrap .updateBilling span{margin-right: 5px;} /* -------------------------------------- location check page generic page, on checkout and my account -------------------------------------- */ #contentLocationsAll { margin: 0 0 10px 0; padding: 0; float: left;} #contentLocationsAll .contentlocationitem {margin: 0 0 0 15px; padding: 0; width: 110px; float: left; display: inline; } #contentLocationsAll h2 { font-size: 1em;} #contentLocationsAll ul li{ margin: 0 0 5px 0; } /* once tammy has removed table layout from the location page, the line below can be removed, AM, 21 Aug 08 */ table.countries ul li{ margin: 0 0 3px 0; } /* -------------------------------------- logout button -------------------------------------- */ #logout {margin: 0;padding: 0;float: right;font-weight: 700;} #logout a {/* margin-right: 10px; */ margin: 0 10px;} /* -------------------------------------- step menu checkout --------------------------------------*/ #stepMenu {margin: 0;padding: 0;float: right;font-size: 1.1em;} #stepMenu ul, #stepMenu li {margin: 0;padding: 0 4px;float: left;color: #ccc;} #stepMenu li.current {color: #666;font-weight: 700;} /* -------------------------------------- basket style pages - Confirm order, Edit order, Thank you page -------------------------------------- */ .col5 {margin: 0 0 20px 0; float: left; } .thankyoumsg .col5 {width: 100%;} .col6 {margin: 0 0 0 0; width: 280px; float: right;} #contentBasket, #content_basket {margin: 0 0 5px 0;b/order: 1px solid red;} #contentBasket #availHead, #content_basket #emptyHead {margin: 0;bor/der: 1px solid red;} #emptyMsg {margin: 0 0 0 5px; } #emptyMsg p {margin: 0 0 5px 0; padding: 0;b/order: 1px solid red;} #contentBasket #availHead h2, #content_basket #emptyHead h2, #deliverySection h2, #availNow h3,#preorderHead h3, #unavailHead h2, #oopHead h2 {padding: 5px;background: #E8EDF3; color: #004884; font-size:1.2em; margin:0;} #contentBasket #unavailHead p, #contentBasket #oopHead p{padding:0;margin:0;} #contentBasket #availNowHead,#contentBasket #preorderHead, #contentBasket #oop #oopHead, #contentBasket #unavailHead p, #contentBasket #mrHead{padding: 5px;background: #F8F8F8; margin: 1px 0 5px 0; } #contentBasket #availNowHead h3, #contentBasket #preorderHead h3 {background: #F8F8F8; color: #000; padding-left: 0;} ul.assist, span.assist, p.badlogin {color: red; float: left; clear: both; width: 100%; font-weight: bold;margin-bottom: 5px;} ul.generalErrorMsg, span.generalErrorMsg {color: red; float: left; clear: both; width: 100%; font-weight: bold;margin-bottom: 5px; font-size: 1.2em;} #contentBasket #preorder, #contentBasket #availNow{margin: 0 0 20px 0;} #contentBasket table, #deliverySection table {border-collapse: collapse; width: 99%; margin:0 5px;} #availNow th, #preorder th, #unavail th, #oop th, #marketRestricted th{border-bottom: 1px solid #ccc; text-transform: uppercase; color: #004884; padding: 5px 0 3px 0; font-weight: bold;} #availNow td, #preorder td, #unavail td, #oop td, #marketRestricted td{border-bottom: 1px solid #ccc;padding: 15px 0;} /* basket table styles */ .thBookTitle {width: 40%; text-transform: uppercase; padding: 10px 0 5px 0;} .thUnit {width: 13%; text-align: center; text-transform: uppercase; padding: 10px 0 5px 0;} .thQuantity {width: 13%; text-align: center; text-transform: uppercase; padding: 10px 0 5px 0;} .thDelitem {width: 15%; text-align: center; text-transform: uppercase; padding: 10px 0 5px 0;} .thTotal {width: 20%; text-align: right; text-transform: uppercase; padding: 10px 0 5px 0;} .thCancel {width: 10%; text-align: center; text-transform: uppercase; padding: 10px 0 5px 0;} h4.bookTitle {margin: 0 0 3px 0;padding: 0; font-size: 1em;} li.author {margin: 0 0 3px 0; font-style: italic; color: #004884;} li.format {margin: 0 0 3px 0; } li.availability {margin: 0 0 0 0; } td.unitPrice {text-align: center;} td.centrePrice {text-align: right; } td.quantity {text-align: center;} td.delete {text-align: center;} td.price{text-align: right;} td.cancel #cancelBt{float: right;} td.cancel #cancelBt a:link{margin-top: 0;} .subtotal {padding: 3px 0 3px 0;} .state_tax {padding: 3px 0 3px 0;} .country_tax, .countryTax {padding: 3px 0 3px 0;} .shipping {padding: 3px 0 3px 0;} .shipping_tax {padding: 3px 0 3px 0;} .delitem {text-align: center;} .discountText {display: block;} /* -------------------------------------- basket buttons -------------------------------------- */ #editConfirmBt, #placeOrderBt, .checkoutbutton, .okbutton, .update_bt, #content #placeOrderBt a#placeOrder:link, #content #placeOrderBt span.disabled-button {float: right;} .continuebutton {float: left; margin-left: 5px;} /* .primaryaction {float: right;} */ .primaryaction a.button { margin: 0 0 0 10px;} #newAccountBt a {margin-right: 5px;} /* -------------------------------------- Delivery and Charges - basket style pages - Confirm order, Edit order, Thank you page -------------------------------------- */ #delHead, #deliverySection {margin: 0; bo/rder: 1px solid green;} #delHead h2, #deliverySection h2, #preorderHead h3 {padding: 5px;background: #E8EDF3;bo/rder: 1px solid green;color:#004884;font-size:1.2em; margin:10px 0 0;} #deliverySection table {margin: 0 0 0 5px; bo/rder: 1px solid green;} #deliverySection td {margin: 0; padding: 0;/* line-height: 130%; */} #delMethod {margin: 0 0 0 5px; float: left;bo/rder: 1px solid red;} #delMethod span#method {font-weight: bold;} #delCharges {margin: 0; width: 99%; b/order: 1px solid red;} #totalBox, #total_box, #subtotal_box {text-align: right;float: right; margin: 0; color: #004884;} .credit_cards {padding: 12px 0; clear: both; float: left; } /* -------------------------------------- grand total -------------------------------------- */ #grand_head, #grandHead {margin: 0; padding: 0 0 5px 0;font-weight: bold; color: #004884;text-align: right; font-size: 1.2em; border-bottom:1px solid #CCCCCC; } /* #grandHead p.grandTotal {margin-top: 20px; } */ #grand_now_head {padding: 15px 0;font-weight: bold; color: #004884;text-align: right; font-size: 1em;} .editorder #grand_now_head {padding-top: 0;} /* -------------------------------------- contact information -------------------------------------- */ #contactInfo {margin: 0 0 1px 0; padding: 15px 0; } #contactInfo table{border: 1px solid green;} /* -------------------------------------- address heading -------------------------------------- */ #addressHead{margin: 0; clear: right;} #addressHead h2 {padding: 5px;background: #E8EDF3;} /* -------------------------------------- teachers Registration -------------------------------------- */ #teachersRegistration p{margin:15px 0;} #teachersRegistration div{margin: 10px 0; clear: both;} #teachersRegistration div.teachRegText{width: 130px; float: left; margin: 0;} #teachersRegistration input.input {margin-left: 15px;} #teachersRegistration select.dropdown {margin-left: 15px;} #teachersRegistration input.checkbox {margin-left: 15px;} /* -------------------------------------- Help - FAQ pages - standard and popup -------------------------------------- */ .faqItem { margin: 0 0 20px 0; } .faqItem h3 { font-size: 1em; } .faqItem p { margin: 0 0 10px 0;} .faqItem img {margin-left: 5px;} a.helpLink {margin-left: 5px;} /* -------------------------------------- Help - FAQ page - close window -------------------------------------- */ #popupClose, #windowClose, #backLink { float: right; padding: 10px;} /* -------------------------------------- Help - Pop up help - navigation (appears horizontal) -------------------------------------- */ #wrapper_popup #content .contentbox .ecomPopupNav { margin: 0 0 10px 0; padding: 10px 0 0 0; line-height: 1.2; } #wrapper_popup #content .contentbox .ecomPopupNav ul { margin: 0; padding: 0; list-style: none; } #wrapper_popup #content .contentbox .ecomPopupNav ul li { margin: 0 0 10px 0; padding: 0 5px; border-left: 1px solid #000; font-weight: 700; float: left; list-style: none;} #wrapper_popup #content .contentbox .ecomPopupNav li.first { border-left: none; padding: 0 5px 0 0;} .ecomPopupNav a:link, .ecomPopupNav a:visited, .ecomPopupNav a:hover, .ecomPopupNav a:active { font-weight: normal; display: block; } /* -------------------------------------- 404 error -------------------------------------- */ #error404 h3 {color: #004884;} #error404 p {margin: 5px 0;} #error404 div {margin: 17px 0;} #error404 ul li {margin: 7px;} /* -------------------------------------- navigation in column only on 2 col my account pages -------------------------------------- */ #colNav1 {padding: 10px 0;margin: 0 0 15px 0;background: #e5ecf2;border: 1px solid #b5c7D5;} #colNav1 ul {padding: 0;margin: 0 0 0 10px;font-weight: 700;} #colNav2, #colNav3 {padding: 0 0 20px 0;margin: 0 0 15px 0;width: 170px;background: #F3F6F9 url(../images/ecomm_nav_bottom.jpg) no-repeat 100% 100%;} #colNav2 h2, #colNav3 h2 {background: #216094 url(../images/ecomm_nav_h_bg.jpg) repeat-x;margin: 0;padding: 3px 10px 4px 8px;color: #fff;font-size: 1em;font-weight: 700;border-bottom: 1px solid #fff;} #colNav2 ul, #colNav3 ul {padding: 0;margin: 0; background: url(../images/ecomm_nav_bg.jpg) repeat-y 100% 0; } #colNav2 ul li, #colNav3 ul li {padding: 0;margin: 0;list-style: none;border-bottom: 1px dashed #D0DDE8;} /* style child links in the Account information box - no hyperlink on these items */ #colNav2 ul ul { padding: 0 0 0 15px; font-size: 0.93em; } #colNav2 ul ul li { border-bottom: none; padding: 4px 10px 5px 8px;} #colNav2 ul li a:link, #colNav3 ul li a:link, #colNav2 ul li a:visited, #colNav3 ul li a:visited {padding: 4px 10px 5px 8px;margin: 0; display: block;color: #000;text-decoration: none;wid/th: 179px;} #colNav2 ul li a:hover, #colNav3 ul li a:hover, #colNav2 ul li a:active, #colNav3 ul li a:active {background: #D0DDE8;text-decoration: none;} /* selected state for links in this navigation */ #colNav2 ul li.selected a:link, #colNav2 ul li.selected a:visited {background: #D0DDE8;text-decoration: none;} #colNav3 ul li.selected a:link, #colNav3 ul li.selected a:visited {background: #D0DDE8;text-decoration: none;} /* -------------------------------------- security certifcates (verisign et al) -------------------------------------- */ .security { margin: 0; padding: 10px 20px 10px 0; float: right; width: 100px; display: inline; b/order: 1px solid red; clear: both;} .sslCertificate {overflow: hidden;clear: both;} .sslCertificate table {width: 135px; /* margin: 0 auto; */ float: left; margin: 5px 0 25px 0; } #content_body {padding: 5px 0 2px 5px;} #content_header {clear: both; padding: 2px 0 2px 5px;} #content_sub_header {margin-right: 300px;} #content_address_confirm {clear: both;} #content_password {clear: both;} #content_alumni_discount {clear: both;} #content_login {clear: both;} #content_action {clear: both;} #content_ {clear: both;} #create_delivery {clear: both;} #create_delivery-text {clear: both;} #contact_info {clear: both;} #content_my_login {clear: both;} #content_payment_continue {clear: both;} #content_proforma {width: 875px; clear: both;} #content_select_payment {clear: both; wi//dth: 900px;} /* don't need width here as controlled by wrapper */ #confirm_checkout p {clear: both;} #confirm_editorder {float: right; clear: both; } #select_existing {width: 875px;} #select_existing table {border-collapse: collapse; margin-left: 10%; width: 90%;} #select_new {width: 875px;} #select_new table {border-collapse: collapse; margin-left: 10%; width: 90%;} /* 4 boxes per line that wrap left */ .box4 {background-color: #cccccc; height: 350px; width: 275px; margin: 5px 9px 5px 0;} #payment_box {width: 300px; float: right;} li.form {list-style: none;} /* basket ids */ #mr_error,#mrError{color: red;}