/**
 *  Stylesheet for E-grip demo website
 *  ===============================================================
 *  $Id: destination.css,v 1.1.2.40 2006/09/07 09:52:19 nijenhuis Exp $
 *  ===============================================================
 *
 *  global styleguide:
 *
 *  colors {
 *    white  : #fff;
 *    black  : #000;
 *    orange : #f60;
 *    blue   : #003384;
 *  }
 *
 *  fonts {
 *    logo    : FF Unit - Medium;
 *    headers : Verdana, Helvetica, sans-serif;
 *    text    : Verdana, Helvetica, sans-serif;
 *  }
 */


/**
 * GLOBAL HTML ELEMENTS
 *
 * default html elements, such as html, body, img, p, a.
 */

html, body {
height: 100%;
margin: 0; padding: 0;
border: 0;
overflow: hidden; }

body {
font: normal .7em/1.2em Verdana, Helvetica, sans-serif; }


/* links */
a, a:link {
padding: 0;
font-weight: bold;
text-decoration: none; }



/* headers */
h1, h2, h3, h4, h5, h6 { margin: 0 0 1em 0; font-family: Verdana, Helvetica, sans-serif; }
h1 { font-size: 1.25em; }
h2 { font-size: 1.1em; }
h3 { font-size: 1em; }


/* images */
img, a img { border: 0; }


/* paragraphs */
p { }


/* lists and definition lists */
ul { list-style: none; margin: 0; padding: 0; }
    ul li {}

dl {}
    dl dt {}
    dl dd {}


/* tables */
table { font-size: 1em; vertical-align: top; border-collapse: collapse; }
    table thead { }
    table tbody { }

    table td, table th { text-align: left; }

/**
 * BASIC PAGE LAYOUT
 *
 * describes the default page layout
 */

#body {
height: 100%; }

    #total {
    height: 100%; }

        #body>#total { height: auto; min-height: 100%; }

    #container {
    width: 100%; height: 100%;
    position: absolute;
    top: 0; left: 0;
    border-style: solid; border-width: 17px 0 17px 0;
    overflow: auto;
    background: none; }

        #total>#container {
        top: 17px; left: 0; bottom: 17px; right: 0;
        height: auto;
        border: 0; }

        #content {
        text-align: left;
        height: 100%; width: 577px;
        margin-left: 51px; }

            /* Problem: to fill the content div in the body, height is set to 100%. IE auto-stretches the element, !IE does not. */
            /* Solution: set the height back to auto, and provide a min-height value of 100% */
            #container>#content {
            padding-left: 0;
            height: auto; min-height: 100%; }

        #header {
        position: absolute;
        top: 0; left: 0;
        height: 17px; width: 780px;
        text-indent: -9000px;
        z-index: 1; }

            #header h1 { width: 100%; height: 17px; margin: 0; }
                #header h1 a { display: none; height: 100%; border: 0; padding-left: 0; background: none; }

        #mainnav {
        position: absolute;
        top: 0; left: 628px;
        width: 168px; height: 100%; }

            #logo {
            position: absolute;
            top: 162px; left: 628px;
            width: 168px;
            text-indent: -9000px;
            margin: 0;
            z-index: 2; }

                #logo a {
                display: block;
                width: 168px; height: 45px; }

                #logo a.hide { display: none; }

                #logo img { display: none; }

            .mainnav_visual {
            position: absolute;
            top: 350px; left: 0;
            margin: .5em; }

            #mainnav ul {
            position: absolute;
            top: 209px;
            width: 156px;
            margin: 0; padding: 0; }

                #mainnav ul li {
                padding: 0 1em; margin: 0; }

                    #mainnav ul li a {
                    display: block;
                    width: 100%;
                    background-color: transparent; background-position: right center; background-repeat: no-repeat; }

                        #mainnav ul li a#nav0, #mainnav ul li a#nav1, #mainnav ul li a#nav6, #mainnav ul li a#nav11 { margin-bottom: 1em; }

                        #mainnav ul li a span { display: none; }

        #breadcrumbs {
        display: none; }

        #globalnav {
        position: absolute;
        top: 0; left: 0; bottom: 0;
        width: 257px; height: 100%;
        background-color: transparent; }

            #globalnav .header {
            text-indent: -1000px;
            width: 257px; height: 161px;
            margin-bottom: 2em; }

            #globalnav .header_visual {
            text-indent: -1000px;
            width: 257px; height: 168px; }

            #globalnav h3 {
            height: 30px;
            margin: 4em 0 0 2em; padding: 0;
            text-indent: -1000px;
            background-color: transparent; background-repeat: no-repeat; background-position: left top; }

            #globalnav select {
            width: 160px;
            margin-left: 2em;
            font-size: .9em; }

            #globalnav ul li { float: left; }

                #globalnav ul li a {
                border: 0;
                padding: 0 .3em .3em .3em;
                text-transform: uppercase; text-decoration: none;
                background-repeat: no-repeat; background-position: 50% 4px; }

                    #globalnav ul li a span { visibility: hidden; }

           ul#subnav {
           width: 100%;
           margin: 0 0 1em 0; padding: 0; }

            ul#subnav li {
            height: 100%;
            padding-left: 1em; margin: 0;
            background: transparent url(/images/a_bullet.gif) no-repeat left 4px; }

            ul#subnav li.extra { margin-top: 1em; }

        #breadcrumbs h2, #globalnav h2 { display: none; }

        #top {
        position: absolute;
        top: 0; left: 0;
        height: 162px; width: 780px;
        line-height: 0; font-size: 0;
        overflow: hidden; }

        #top img { float: left; }

    #footer {
    position: absolute;
    bottom: 0; left: 0;
    height: 17px; width: 780px;
    text-indent: -9000px;
    overflow: hidden; }


/**
 * PAGE-SPECIFIC ELEMENTS
 *
 * Style specially for pages
 */

/* contenttext: for all basic content text, such as page body's */
#content .header { padding-top: 2em; }

#content p { }

#content h1 { display: none; }

#content h3 {
font-size: 1em;
margin: 1em 0 0 0; padding: 0; }

#content .header h1.visible {
display: block;
text-indent: -1000px; }

#content h2.menuheader {
width: 100%; height: 30px;
text-indent: -1000px;
margin: 1em 0 0 0; padding: 0;
background-color: transparent; background-repeat: no-repeat; background-position: left top; }

#content h3.contentheader {
font-size: 1.1em;
margin: 1em 0; padding: 0; }

.contenttext { margin: 162px 1em 1em 1em; }
    #content>.contenttext { margin: 0 1em; padding-top: 162px; }

.contenttext_home { margin: 162px 1em 1em 1em; }
    #content>.contenttext_home { margin: 0 1em; padding-top: 162px; }

.contenttext .info_pictures img { margin: 0 1em 1em 0; }

/* blockcolumn: (news)blocks on the homepage */
#blockcolumn {
float: left;
width: 206px;
margin: 2em 0;
background-image: url(/images/rails.jpg);
background-color: transparent; background-repeat: no-repeat; background-position: left top; }

    #blockcolumn div.inner {
    float: left;
    background-image: url(/images/rails.jpg);
    background-color: transparent; background-repeat: no-repeat; background-position: left bottom; }

        .block {
        float: left;
        margin: 5px 0; padding: .5em 0 2em .5em;
        background-color: transparent; background-repeat: repeat; background-position: left top; }

            .block h2 {
            display: block;
            height: 24px;
            margin: 0; padding: 0;
            text-indent: -1000px;
            font-size: 1em; }

            .block img {
            float: right;
            margin: 0; padding: 0; }

            .block p { margin: 0; padding: 0; }

            .block a {
            display: block;
            margin: 1em 0; }

        .block_globalnav { clear: both; margin: 15px 0; }

               .block_globalnav ul {
               width: 100%;
               margin: 0; padding: 0; }

                .block_globalnav ul li {
                height: 23px; width: 100%;
                padding: 0; margin: 0; }

                    .block_globalnav ul li a {
                    display: block;
                    height: 100%; width: 100%;
                    background-color: transparent; background-position: center center; background-repeat: no-repeat; }

                        .block_globalnav ul li a span { display: none; }

        #presentationvideos { width: 200px; }
            #presentationvideos li { margin: 0; padding: 0; height: 1em; }
                html>body #presentationvideos li a { margin: .5em 0; }
                #presentationvideos li a { margin: 0; }


/* tripcolumn: trips on the homepage */
#tripcolumn {
float: right;
width: 370px; height: 100px;
padding: 5px 30px; margin-top: 2em; }

    #content>#tripcolumn { width: 310px; }

    #tripcolumn h2 {
    display: block;
    height: 24px;
    margin: 0; padding: 0;
    text-indent: -1000px;
    font-size: 1em; }

       #tripcolumn ul {
       width: 100%;
       margin: 1em 0; padding: 0; }

        #tripcolumn ul li {
        height: 100%;
        padding: 0 0 0 45px; margin: 0 0 .5em 0; }

            #tripcolumn ul li a {
               display: block; }

/* crosslinks */
#crosslinks {
clear: both;
position: relative;
top: 40px; left: 30px;
margin: 0; padding: 0;
list-style: none; }

    #crosslinks li { position: relative; float: left; width: 47%; height: 60px; }

    #crosslinks #default, #crosslinks #junior, #crosslinks #wandel { background-position: left top; background-color: transparent; background-repeat: no-repeat; }

        #crosslinks li a { position: relative; top: 5px; left: 40px; color: #c30; }
            #crosslinks li a:hover { color: #600; }

/* routecolumn: routedays of trip */
#routecolumn {
float: left;
width: 360px;
margin-top: 1em; }

       #routecolumn ol {
       list-style: none;
       width: 100%;
       margin: 1em 1em 1em 0; padding: 0; }

        #routecolumn ol li.normal {
        height: 100%;
        margin-bottom: .1em; padding: .2em; }

            #routecolumn ol li.normal img {
            float: left;
            margin-right: .5em; }

            #routecolumn ol li.normal span {
            display: block;
            height: 100%;
            vertical-align: top;
            margin-left: 2em; }

        #routecolumn ol li.custom {
        height: 100%;
        margin-bottom: .5em; padding: 0; }

            #routecolumn ol li.custom span.date { float: left; margin-right: 1em; }

            #routecolumn ol li.custom span.day {
            display: block;
            height: 100%;
            vertical-align: top;
            margin-left: 6em; }

/* customize routecolumn: customize routedays of trip */
#customize_routecolumn {
float: left;
width: 190px;
margin-top: 1em; }

    #customize_routecolumn form {
    margin: 0; padding: 0; }

/* pricescolumn: prices of trip */
#pricescolumn {
float: left;
width: 270px;
margin-top: 1em; }

    #pricescolumn span.row { display: block; }

        #pricescolumn span.row span.title {
        display: block;
        float: left;
        font-weight: bold;
        width: 17em; }

/* airlines */
.airline {
float: right;
display: block;
width: 100%; height: 60px;
background-color: transparent; background-repeat: no-repeat; background-position: right top; }

    .number1 { background-image: url(/images/airlines/l_klm.gif); }
    .number2 { background-image: url(/images/airlines/l_cat.gif); }
    .number3 { background-image: url(/images/airlines/l_fin.gif); }
    .number4 { background-image: url(/images/airlines/l_ice.gif); }
    .number5 { background-image: url(/images/airlines/l_jal.gif); }
    .number6 { background-image: url(/images/airlines/l_jor.gif); }
    .number7 { background-image: url(/images/airlines/l_luf.gif); }
    .number8 { background-image: url(/images/airlines/l_mal.gif); }
    .number9 { background-image: url(/images/airlines/l_mar.gif); }
    .number10 { background-image: url(/images/airlines/l_sin.gif); }
    .number11 { background-image: url(/images/airlines/l_sri.gif); }
    .number12 { background-image: url(/images/airlines/l_air.gif); }
    .number13 { background-image: url(/images/airlines/l_uni.gif); }
    .number14 { background-image: url(/images/airlines/l_bra.gif); }
    .number15 { background-image: url(/images/airlines/l_aus.gif); }
    .number16 {  }
    .number17 {  }
    .number18 {  }
    .number19 {  }
    .number20 {  }
    .number21 {  }
    .number22 { background-image: url(/images/airlines/l_ba.gif); }
    .number23 {  }
    .number24 { background-image: url(/images/airlines/l_sas.gif); }
    .number25 {  }
    .number26 {  }
    .number27 {  }

/* infocolumn: info about trip */
#infocolumn {
float: left;
width: 270px;
margin-top: 1em; }

    #pricescolumn span.row { display: block; }

        #pricescolumn span.row span.title {
        display: block;
        float: left;
        font-weight: bold;
        width: 17em; }

/* departuretable: table of all info of arrangements*/

#departures_border {
float: left;
width: 557px;
padding: 1px; margin: 2em 0; }

    .contenttext>#departures_border { width: 555px; }

    #departures { width: 555px; padding: 5px 0 0 0; }

        .contenttext>#departures { width: 550px; }

        table.departures {
        width: 100%;
        border: 0;
        border-style: solid;
        border-top-width: 0px; border-right-width: 0px; border-left-width: 0px; border-bottom-width: 1px;
        border-collapse: collapse; }

            table.departures td {
            font-size: 10px;
            vertical-align: top;
            padding: 0 10px 0 5px; }

            table.departures td.year {
            font-weight: bold;
            padding-top: 10px;
            border-style: solid;
            border-top-width: 0; border-left-width: 0; border-right-width: 0; border-bottom-width: 1px; }

            table.departures td.month {
            font-weight: bold;
            width: 70px;
            padding-top: 5px;
            border-style: solid;
            border-top-width: 1px; border-left-width: 0; border-right-width: 0; border-bottom-width: 0; }

            table.departures td.monthprice {
            font-weight: bold;
            width: 50px;
            padding-top: 10px;
            border-style: solid;
            border-top-width: 1px; border-left-width: 0; border-right-width: 0; border-bottom-width: 0; }

            table.departures td.monthinfo {
            font-weight: bold;
            padding-top: 10px;
            border-style: solid;
            border-top-width: 1px; border-left-width: 0; border-right-width: 0; border-bottom-width: 0; }

            table.departures td.monthavailable {
            font-weight: bold;
            width: 140px;
            padding-top: 10px;
            border-style: solid;
            border-top-width: 1px; border-left-width: 0; border-right-width: 0; border-bottom-width: 0; }

            table.departures td.monthbook {
            font-weight: bold;
            width: 60px;
            padding-top: 10px;
            border-style: solid;
            border-top-width: 1px; border-left-width: 0; border-right-width: 0; border-bottom-width: 0; }

            table.departures td.day {
            font-weight: bold;
            width: 70px;
            border-style: solid;
            border-top-width: 1px; border-left-width: 0; border-right-width: 0; border-bottom-width: 0; }

            table.departures td.price {
            width: 50px;
            border-style: solid;
            border-left-width: 1px; border-right-width: 1px; border-top-width: 1px; border-bottom-width: 0; }

            table.departures td.info {
            border-style: solid;
            border-left-width: 1px; border-right-width: 1px; border-top-width: 1px; border-bottom-width: 0; }

            table.departures td.available {
            width: 140px;
            border-style: solid;
            border-left-width: 1px; border-right-width: 1px; border-top-width: 1px; border-bottom-width: 0; }

            table.departures td.book {
            width: 60px;
            border-style: solid;
            border-left-width: 1px; border-right-width: 1px; border-top-width: 1px; border-bottom-width: 0; }

            table.departures td a:link, table.departures td a:active, table.departures td a:visited {
            font-size: 10px;
            font-weight: normal; }

            table.departures td a:hover { font-weight: normal; }

                table.departures td p a:link, table.departures td p a:active, table.departures td p a:visited {    font-weight: normal; }

                table.departures td p a:hover { font-weight: normal; }

                    /* departure moreinfo */
                    table.departures td.info div .more_info {
                    display: none;
                    position: absolute;
                    left: 300px;
                    width: 100%;
                    border-style: solid;
                    border-width: 1px;
                    margin-top: 7px;
                    padding: 5px;
                    z-index: 10; }

                    #departures>table.departures td.info div.more_info {
                    width: 200px;
                    margin-top: -5px; }

                    table.departures td.info:hover div .more_info, table.departures td.info div.sfhover .more_info { display: block; }

/* extrainfocolumn */
#extrainfocolumn {
float: left;
margin-bottom: 2em; }

#large_map {
clear: both;
text-align: center; }

/* menubox */
.default { padding: .5em 1em; }

    .default li {
    margin-bottom: .2em; padding-left: 1.5em;
    background: transparent url(/images/a_bullet.gif) no-repeat left 3px; }

/* .feed: RSS-feed button placement */
.feed { float: right; border: 0 !important; margin: .5em .5em 1.5em 2em; padding: 0; background-image: none !important; }


/**
 * GLOBAL CLASSES
 *
 * global classes are used for very common styles, such as floating, coloring or clearing. Often used in combination, such as: <a href="link.html" class="align-right no-border">link to the right without border</a>.
 */

/* positioning and visibility */
.clear-both     { clear: both; }
.float-left     { float: left; }
.float-right    { float: right; }
.inline         { display: inline; }
.show           { display: block; }
.hide           { display: none; }
.align-left     { text-align: left; }
.align-right    { text-align: right; }

/* coloring and text decoration/transformation */
.no-border      { text-decoration: none; }
.plain          { padding-left: 0 !important; background: none !important; }
.back           { background-image: url(/images/arrow_left.gif); }
.back:hover     { background-image: url(/images/arrow_left_over.gif); }
.red            { color: red; }
.req            { color: red; background-color: white; }
.err            { color: red; font-weight: bold; }
.notice         { background-color: #ffa; color: #f60; }
.white          { color: white; }

/* default list behaviour */
.bulleted       { list-style: square inside; margin: .4em; padding: 0 1em; }

/* file types */
.doc            { padding: 2px 0 2px 20px; background: url(/images/ico_doc.gif) center left no-repeat; }
.pdf            { padding: 2px 0 2px 20px; background: url(/images/ico_pdf.gif) center left no-repeat; }