/********************************************************************************************** CSS on Sails Title: RailTeam Author: XHTMLized (http://www.xhtmlized.com/) Date: June 2009 *********************************************************************************************** 1. BASE 1.1 Reset 1.2 Accessibility Navigation 1.3 Clearfix 1.4 Default Styles 2. LAYOUT 2.1 Header 2.2 Navigation 2.3 Content 2.4 Sidebar 2.5 Footer ***********************************************************************************************/ /* 1. BASE ----------------------------------------------------------------------------------------------- ===============================================================================================*/ /* @import 'jqtransform.css'; @import 'jquery-fancybox.css'; */ /* 1.1 Reset -----------------------------------------------------------------------------------------------*/ 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, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption, tbody, tfoot, thead, tr { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } :focus { outline: 0; } ins { text-decoration: none; } del { text-decoration: line-through; } table { border-collapse: collapse; border-spacing: 0; } address { font-style: normal; } table {width:100%;color:#000;vertical-align: middle;} table thead th {background:#5c88a1;color:#fff;line-height:1.81em;padding-top:0;padding-bottom:0;padding-left:5px;padding-right:5px;border-bottom:1px solid #fff;border-left:1px solid #fff;} table thead th:first-child {border-left:none;} table thead th.sortable {cursor:pointer;} table thead th.sorted-asc, table thead th.sorted-desc {padding-right:24px;background-position:right center;background-repeat:no-repeat;} table thead th.sorted-asc {background-image:url(/images/ico/asc.gif);} table thead th.sorted-desc {background-image:url(/images/ico/desc.gif);} /* old border-bottom:1px solid #5c88a1;color:#5c88a1; */ table tbody td {line-height:15px;padding-top:5px;padding-bottom:5px;padding-left:5px;padding-right:5px;border-left:1px solid #dee7ec;} table tbody td.odd {background:#f2f2f2;border-left:1px solid #d4dde2;} table tbody td:first-child, table tbody td.odd:first-child {border-left:none;} #content table {font-size:0.91em;} /* 1.2 Accessibility Navigation & Hide -----------------------------------------------------------------------------------------------*/ ol#accessibility-nav, .hide, .descriptions .desc h2, .invisible { position: absolute; top: -999em; left: -999em; height: 1px; width: 1px; } /* 1.3 Clearfix -----------------------------------------------------------------------------------------------*/ .clearfix:after, #main:after, #sidebar .boxes .boxes-inner2:after, #content .two-cols:after, #content .three-cols:after, div.press-gallery div.press-gallery-inside ul:after, div.press-corner div.press-gallery-release-inside ul:after, #carriers-descriptions.descriptions .desc ul li a:after, form.extended:after, form.extended p:after, form.extended ol li:after, #content .four-columns:after, div.press-corner div.press-item ul.press-links:after, #content ul.linkboxes li a.full:after, #content .two-eq-cols:after, #content ul.discounts ul li:after, #content .small-cols:after, #cse-search-box2:after, #content .flv:after, #content .app_steps .phonebrand:after, #content .faq dl dd:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* To be moved to ie.css .clearfix, form.extended, form.extended p, form.extended ol li, #content .four-columns, div.press-corner div.press-item ul.press-links, #content ul.linkboxes li a.full, #content .two-eq-cols, #content ul.discounts ul li, #content ul.links li, #content .small-cols, #cse-search-box2, #content .flv, #content .app_steps .phonebrand, #content .faq dl dd {zoom:1;} */ /* 1.4 Default Styles -----------------------------------------------------------------------------------------------*/ body {font-size:62.5%;} body.fmedium {font-size:70%;} body.flarge {font-size:77.5%;} body { font-family:Verdana, Arial, Helvetica, sans-serif; text-align: center; } hr { display: none; } strong { font-weight: bold; } em { font-style: italic; } abbr, acronym { border-bottom: 1px dotted #999; cursor: help; } input, textarea, select { font: 1em Verdana, Arial, Helvetica, sans-serif; } a { color: #5c88a1; text-decoration: none; } a:hover { text-decoration: underline; } a * {cursor:pointer;} .clear {clear:both;} #main {font-size: 1.2em;} body .flash-content {display:none;} body.flash .flash-content {display:block;} body.flash .nonflash-content {display:none;} .hidden { display: none;} /* 1.5 Forms -----------------------------------------------------------------------------------------------*/ /* Wrappers */ form.extended {width:521px;color:#000;padding:1.33em 0 0 45px; display: block;} #content form.extended h3 {margin:0 0 6px 17px;font-size:1.08em;line-height:1.38em;color:#ed771a;} form.extended p, form.extended ol li {clear:both;margin:0 0 7px 0;} form.extended fieldset {margin:0 14px;padding:8px 0;} form.extended fieldset.important {padding:8px 13px;border:1px solid #fff;margin:0 0 2px 0;background:#cae7f5;} form.extended fieldset.submit { clear:both; padding:0;} form.extended fieldset.submit p.note {font-size:0.75em;line-height:1em;} form.extended fieldset.submit input.buttonimg {float:right;} form.extended fieldset.submit button {float:right;border:none;cursor:pointer;} form.extended ol li.col1 {float:left;width:250px;clear:left;} form.extended ol li.col2 {float:left;width:410px;clear:none;} form.extended ol li.col1 p, form.extended ol li.col2 p {float:left;margin:0 10px 0 0;clear:none;} form.extended #frm-top {position:relative;height:13px;background:url(/img/bg_frm_top.gif) no-repeat left bottom;} form.extended #frm-middle {position:relative;height: auto;background:url(/img/bg_frm_middle.gif) repeat-y left top;} form.extended #frm-footer {position:relative;height:13px;background:url(/img/bg_frm_footer.gif) no-repeat left top;} /* Form elements */ form.extended label { display:block; cursor:pointer; line-height:1.5em; padding:0 0 0 1px; float:left;width: 130px;} form.extended input.text, form.extended textarea {padding:1px 0 1px 2px;border:1px solid #a8a8a8;float:left;} form.extended input.text {width:210px;float:left;} form.extended textarea {width:210px;height:60px;float:left;} form.extended ol li.col1 input.text, form.extended ol li.col2 input.text {width:228px;float:left;} form.extended select {border:1px solid #a8a8a8;float:left;} form.extended fieldset.submit button.btn_submit {float:right;width:124px;height:30px;background:url(/img/submit.gif) no-repeat left top;} form.extended fieldset.submit button.btn_submit:hover {float:right;width:124px;height:30px;background:url(/img/submit.gif) no-repeat left -30px;} form.extended fieldset.submit button.btn_submit span {display:none;} /* Checkboxes / Radios li.multiple p input + label * */ form.extended ol li.multiple p {display:block;margin:0;} form.extended ol li.multiple label {float:left;line-height:1.5em;padding:0 0 0 3px;margin:0 4px 0 0; width: auto;} form.extended ol li.multiple input {float:left;} /* Errors */ form.extended label.error { color: red; } form.extended input.error {border-color:red;} form.extended #result {} form.extended #result h1 {clear:both; background-position:8px center; background-repeat:no-repeat; background-color:#DDE9D5; background-image:url(/images/ico/accept.png); border-style:solid; border-width:1px; font-size:13px; line-height:15px;border-color:#83C359; color:#1F4D00; padding:9px 16px 9px 32px; margin:49px 0 9px 0;font-size:13px;font-weight:normal;line-height:15px;} form.extended #result.error { background-color:#FFEAEA;background-image:url(/images/ico/cancel.png);border-color:#E88080;color:#7C0000; } /* Particular elements */ form.extended select#when1 {width:49px;} form.extended select#when2 {width:49px;} form.extended select#when3 {width:65px;} form.extended #zipcode2 {width:57px;} form.extended #travel-selects {position:relative;} form.extended #travel-selects label.error {position:absolute;top:0;left:180px;background:#CAE7F5;} form.extended #gender-radios {position:relative;} form.extended #gender-radios label.error {position:absolute;top:0;left:80px;} /* Navigational form */ form.navigational {margin:20px 0 10px 0;} form.navigational label {display:block;font-size:1.16em;line-height:1.28em;padding:0 0 8px 0;font-weight:bold;cursor:pointer;} form.navigational select {display:block;width:300px;font-size:11px;} form.returnto {float:left;border:1px solid #d6e1e7;background:#f5f9fb;padding:8px 10px 10px;} form.returnto label {float:left;white-space:nowrap;font-size:1em;line-height:1.75em;padding:0 0 3px 0;font-weight:normal;} form.returnto label a {padding:0 0 0 17px;background:url(/images/ico/read-more.gif) left center no-repeat;} /* 2. LAYOUT ----------------------------------------------------------------------------------------------- ===============================================================================================*/ .container { width: 978px; position: relative; margin: 0 auto; text-align: left; } /* Default Layout (Two Columns) */ #main {} #content { width: 565px; float: left;} #sidebar { width: 413px; float: right;} #footer { clear: both;padding: 0 0 0 35px;} #top {height:24px; position:relative;} #header {height:232px; position:relative;} #navigation {height:52px; position:relative; z-index:3;} #main {position:relative;z-index:2;} /* One Column Layout */ body.one-column #content { width: auto; float: none; } body.one-column #content #main-content {float:right;width:721px;} body.one-column #content #secondary-content {} /* Three Column Layout */ #content #main-content {float:right;width:477px;} #content #secondary-content {float:left;width:215px;} /* Main Backgrounds */ body {background:#fff;} .container { background:#fff url(/img/bg_middle.gif) left top repeat;} #top {background:#fff url(/img/bg_top.gif) bottom left no-repeat;} #header {background:url(/img/header1.jpg) 45px bottom no-repeat;} #footer {background:#fff url(/img/bg_footer.gif) left top no-repeat;} /* 2.1 Header -----------------------------------------------------------------------------------------------*/ /* Logo */ #header .logo { position:absolute;top:0px;left:80px; } #header .logo, #header .logo span { overflow: hidden; width: 192px; height: 50px; line-height:50px; font-size:20px; text-align:center; font-weight:bold;} #header .logo span { position: absolute; top: 0; left: 0; z-index: 10; background: url(/img/logo.gif) no-repeat; } /* 2.2 Navigation -----------------------------------------------------------------------------------------------*/ #navigation {} /* 1st level */ #navigation ul.menu {height:27px;background:#18a0be url(/images/bg_navigation.gif) repeat-x;} #navigation ul li {float:left;position:relative;border-right:1px solid #fff;} #navigation ul li a.level1 {float:left;line-height:27px;font-size:1.2em;font-weight:bold;background:#216084 url(/images/bg_nav-1.gif) repeat-x;color:#fff;padding:0 22px;} #navigation ul li.light a.level1 {background:#18a0be url(/images/bg_navigation.gif) repeat-x;} #navigation ul li a.level1:hover, #navigation ul li:hover a.level1 {text-decoration:underline;} #navigation ul li.light a.level1:hover, #navigation ul li.light:hover a.level1 {} /* 2nd level */ #navigation ul ul {position:absolute;top:27px;left:-9999%;width:235px;z-index:5;} #navigation ul li:hover {} #navigation ul li:hover ul {left:0;} #navigation ul li:hover ul ul {left:-9999%;} #navigation ul ul li {float:left;width:235px;border:none;} #navigation ul ul li a {float:left;display:block;padding:5px 10px;width:215px;font-size:1.1em;line-height:1.27em;background-color:#215e81;background-position:right center;background-repeat:no-repeat;color:#fff;border-top:1px solid #d7f0fc;} #navigation ul .light ul li a {background-color:#18a0be;} #navigation ul ul li.dropdown {position:relative;} #navigation ul ul li.dropdown a {background-image:url(/images/bg_dropdown.gif);} #navigation ul ul li a:hover, #navigation ul ul li:hover a {background:#d7f0fc;color:#215e81;text-decoration:none;} #navigation ul ul li.dropdown a:hover, #navigation ul ul li.dropdown:hover a {background-image:url(/images/bg_dropdown-h.gif);background-repeat:no-repeat;background-position:right center;} #navigation ul ul li.dropdown:hover ul a {background-image:none;} /* 3rd level */ #navigation ul ul ul {position:absolute;top:0;left:-9999%;z-index:10;} #navigation ul li:hover ul li:hover {} #navigation ul li:hover ul li:hover ul {left:235px;} #navigation ul ul li.dropdown ul li a {background:#d7f0fc;color:#215e81;background-image:none;border-top:1px solid #7aa6bd;border-left:1px solid #fff;} #navigation ul ul li.dropdown ul li a:hover {color:#000;background-image:none;} /* Breadcrumbs */ #navigation p.breadcrumbs {line-height:24px;font-size:1.1em;color:#5d88a2;border-bottom:1px solid #5d88a2;} /* 2.3 Content -----------------------------------------------------------------------------------------------*/ #content {color: #000;} #content h1 {font-size:2em;font-weight:bold;color:#08458a;margin:1em 0 22px 0;} #content h1 em {display:block;font-weight:normal;font-style:normal;color:#e33f00;font-size:0.74em;line-height:1.2em;} #content h2 {font-size:1.25em;line-height:1.53em;font-weight:bold;} #content h3 {font-size:1.16em;line-height:1.5em;font-weight:bold;} #content h4 {font-size:1.16em;line-height:1.5em;font-weight:normal;} #content h5 {font-size:1em;line-height:1.75em;font-weight:bold;} #content h6 {font-size:1.08em;line-height:1.61em;font-weight:bold;color:#f07927;margin:20px 0 0 0;} #content p {line-height:1.33em; padding:0 0 1.33em 0;} #content img.left {float:left;margin:0 10px 10px 0;} #content img.icon {float:left;margin:3px 12px 0 0;} #content img.right {float:right;margin:0 0 10px 10px;} #content a.pdf {padding:1px 0 1px 22px;background:left center no-repeat url(/images/ico/pdf.gif);} #content #introtext {padding: 0 10px 0 65px;} /* main buttons */ #content a#btn_ja {display:block;width:341px;height:69px;background:url(/img/btn_ja.png) no-repeat left top;} #content a#btn_ja:hover {display:block;width:341px;height:69px;background:url(/img/btn_ja.png) no-repeat left -69px;} #content a#btn_ja span { display:none;} #content a#btn_terug {display:block;width:216px;height:41px;background:url(/img/btn_terug.gif) no-repeat left top;} #content a#btn_terug:hover {display:block;width:216px;height:41px;background:url(/img/btn_terug.gif) no-repeat left -41px;} #content a#btn_terug span { display:none;} #content a#btn_ja.hidden, #content a#btn_terug.hidden { display: none;} /* vcard */ #content .vcard {line-height:1.75em;margin:0 0 42px 0;} #content .vcard .fn {display:none;} /* arrowed link list */ #content ul.links {margin:0 0 20px 0;} #content ul.links li {background:none;padding:0;} #content ul.links li a {display:block;padding:0.25em 0 0.25em 20px;line-height:1.25em;background:url(/images/ico/read-more.gif) left center no-repeat;} #myform option.odd {background:#f6f6f6;} #content #feedbacktext {padding: 20px 10px 0 65px;} #content #feedbacktext #message {padding: 10px;border: solid 1px #a8a8a8;} /* 2.4 Sidebar -----------------------------------------------------------------------------------------------*/ /* 2.5 Footer -----------------------------------------------------------------------------------------------*/ #footer {padding:33px 0 30px 0;} #footer ul.menu {text-align:center;line-height:32px;font-size:1.1em;} #footer ul.menu li {display:inline;padding:0 0 0 6px;background:url(/images/sep.gif) left center no-repeat;} #footer ul.menu li a {padding:0 2px 0;} #footer ul.menu li.first {background:none;} #footer p {position:absolute;right:45px;text-align:right;}