/**
 * WebsiteName - Description of Website
 * @version v1.0.0
 */
/* ==========================================================================
   Main
   ========================================================================== */
/* ==========================================================================
   Variables
   ========================================================================== */
/* Base
   ========================================================================== */
/* Namespace */
/* Colors */
/* Structure */
/* Components
   ========================================================================== */
/* Alert */
/* Banner */
/* Button */
/* CtaList */
/* Form */
/* Grid .... */
/* Icon .... */
/* Nav .... */
/* Social */
/* Typography  */
/* Links  */
/* All other modules here .... */
/*Tab Notifications*/
/* Always first */
/* ==========================================================================
   Base
   ========================================================================== */
/* ==========================================================================
   Mixins
   ========================================================================== */
/* Breakpoints
   ========================================================================== */
/* Calculations
   ========================================================================== */
/* CSS3
   ========================================================================== */
/* Helpers
   ========================================================================== */
/* Rem Fallbacks
   ========================================================================== */
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
    font-family: sans-serif;
    /* 1 */
    -ms-text-size-adjust: 100%;
    /* 2 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
}

/**
 * Remove default margin.
 */
body {
    margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */

/*new as feb 12 2016 css*/

.q_requet_form {
}

.form_block {
    border-top: 1px solid #fafafa;
    padding-top: 25px;
}

.q_requet_form .form-control {
    background-color: #fff;
    border: 1px solid #d5d7d8;
    border-radius: 1px;
    color: #222;
    font-size: 1.14286rem;
    padding: 0.71429rem;
    text-align: left;
    transition: border 300ms ease-in-out 0s;
    width: 100%;
    height: 40px;
}

    .q_requet_form .form-control:focus {
        border-color: #b5999e;
        box-shadow: none;
        outline: medium none;
    }

    .q_requet_form .form-control:hover {
        border-color: #aaa;
        box-shadow: none;
    }

.q_requet_form label.subtitle {
    color: #0c6ab8;
    font-family: "Titillium Web",Tahoma,Verdana,Segoe,sans-serif;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

.margb0 {
    margin-bottom: 5px !important;
}

.q_requet_form small {
    font-weight: normal;
}

.p-lineheight {
    line-height: 17px;
}

#MainContent_UcQuotationForm1_ddlClass label {
    padding-left: 20px;
}

#MainContent_UcQuotationForm2_ddlClass label {
    padding-left: 20px;
}
/*new as 17 feb*/
.form-horizontal .form-group {
    margin-left: -15px;
    margin-right: -15px;
}

.form-group {
    margin-bottom: 15px;
}

.q_requet_form .row, .q_requet_form .form-group, .q_requet_form .form-control {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.q_requet_form [class*="col-"] {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    float: left;
}

@media (min-width:1200px) {
    .col-lg-12 {
        width: 100%;
    }

    .col-lg-11 {
        width: 91.66666667%;
    }

    .col-lg-10 {
        width: 83.33333333%;
    }

    .col-lg-9 {
        width: 75%;
    }

    .col-lg-8 {
        width: 66.66666667%;
    }

    .col-lg-7 {
        width: 58.33333333%;
    }

    .col-lg-6 {
        width: 50%;
    }

    .col-lg-5 {
        width: 41.66666667%;
    }

    .col-lg-4 {
        width: 33.33333333%;
    }

    .col-lg-3 {
        width: 25%;
    }

    .col-lg-2 {
        width: 16.66666667%;
    }

    .col-lg-1 {
        width: 8.33333333%;
    }

    .col-lg-offset-0 {
        margin-left: 0;
    }

    .col-lg-offset-12 {
        margin-left: 100%;
    }

    .col-lg-offset-11 {
        margin-left: 91.66666667%;
    }

    .col-lg-offset-10 {
        margin-left: 83.33333333%;
    }

    .col-lg-offset-9 {
        margin-left: 75%;
    }

    .col-lg-offset-8 {
        margin-left: 66.66666667%;
    }

    .col-lg-offset-7 {
        margin-left: 58.33333333%;
    }

    .col-lg-offset-6 {
        margin-left: 50%;
    }

    .col-lg-offset-5 {
        margin-left: 41.66666667%;
    }

    .col-lg-offset-4 {
        margin-left: 33.33333333%;
    }

    .col-lg-offset-3 {
        margin-left: 25%;
    }

    .col-lg-offset-2 {
        margin-left: 16.66666667%;
    }

    .col-lg-offset-1 {
        margin-left: 8.33333333%;
    }
}

@media (min-width:992px) {
    .col-md-12 {
        width: 100%;
    }

    .col-md-11 {
        width: 91.66666667%;
    }

    .col-md-10 {
        width: 83.33333333%;
    }

    .col-md-9 {
        width: 75%;
    }

    .col-md-8 {
        width: 66.66666667%;
    }

    .col-md-7 {
        width: 58.33333333%;
    }

    .col-md-6 {
        width: 50%;
    }

    .col-md-5 {
        width: 41.66666667%;
    }

    .col-md-4 {
        width: 33.33333333%;
    }

    .col-md-3 {
        width: 25%;
    }

    .col-md-2 {
        width: 16.66666667%;
    }

    .col-md-1 {
        width: 8.33333333%;
    }

    .col-md-offset-0 {
        margin-left: 0;
    }

    .col-md-offset-12 {
        margin-left: 100%;
    }

    .col-md-offset-11 {
        margin-left: 91.66666667%;
    }

    .col-md-offset-10 {
        margin-left: 83.33333333%;
    }

    .col-md-offset-9 {
        margin-left: 75%;
    }

    .col-md-offset-8 {
        margin-left: 66.66666667%;
    }

    .col-md-offset-7 {
        margin-left: 58.33333333%;
    }

    .col-md-offset-6 {
        margin-left: 50%;
    }

    .col-md-offset-5 {
        margin-left: 41.66666667%;
    }

    .col-md-offset-4 {
        margin-left: 33.33333333%;
    }

    .col-md-offset-3 {
        margin-left: 25%;
    }

    .col-md-offset-2 {
        margin-left: 16.66666667%;
    }

    .col-md-offset-1 {
        margin-left: 8.33333333%;
    }
}

@media (min-width:768px) {
    .col-sm-12 {
        width: 100%;
    }

    .col-sm-11 {
        width: 91.66666667%;
    }

    .col-sm-10 {
        width: 83.33333333%;
    }

    .col-sm-9 {
        width: 75%;
    }

    .col-sm-8 {
        width: 66.66666667%;
    }

    .col-sm-7 {
        width: 58.33333333%;
    }

    .col-sm-6 {
        width: 50%;
    }

    .col-sm-5 {
        width: 41.66666667%;
    }

    .col-sm-4 {
        width: 33.33333333%;
    }

    .col-sm-3 {
        width: 25%;
    }

    .col-sm-2 {
        width: 16.66666667%;
    }

    .col-sm-1 {
        width: 8.33333333%;
    }

    .col-sm-offset-0 {
        margin-left: 0;
    }

    .col-sm-offset-12 {
        margin-left: 100%;
    }

    .col-sm-offset-11 {
        margin-left: 91.66666667%;
    }

    .col-sm-offset-10 {
        margin-left: 83.33333333%;
    }

    .col-sm-offset-9 {
        margin-left: 75%;
    }

    .col-sm-offset-8 {
        margin-left: 66.66666667%;
    }

    .col-sm-offset-7 {
        margin-left: 58.33333333%;
    }

    .col-sm-offset-6 {
        margin-left: 50%;
    }

    .col-sm-offset-5 {
        margin-left: 41.66666667%;
    }

    .col-sm-offset-4 {
        margin-left: 33.33333333%;
    }

    .col-sm-offset-3 {
        margin-left: 25%;
    }

    .col-sm-offset-2 {
        margin-left: 16.66666667%;
    }

    .col-sm-offset-1 {
        margin-left: 8.33333333%;
    }
}

@media (max-width:767px) {
    .col-xs-12 {
        width: 100%;
    }

    .col-xs-11 {
        width: 91.66666667%;
    }

    .col-xs-10 {
        width: 83.33333333%;
    }

    .col-xs-9 {
        width: 75%;
    }

    .col-xs-8 {
        width: 66.66666667%;
    }

    .col-xs-7 {
        width: 58.33333333%;
    }

    .col-xs-6 {
        width: 50%;
    }

    .col-xs-5 {
        width: 41.66666667%;
    }

    .col-xs-4 {
        width: 33.33333333%;
    }

    .col-xs-3 {
        width: 25%;
    }

    .col-xs-2 {
        width: 16.66666667%;
    }

    .col-xs-1 {
        width: 8.33333333%;
    }

    .col-xs-offset-12 {
        margin-left: 100%;
    }

    .col-xs-offset-11 {
        margin-left: 91.66666667%;
    }

    .col-xs-offset-10 {
        margin-left: 83.33333333%;
    }

    .col-xs-offset-9 {
        margin-left: 75%;
    }

    .col-xs-offset-8 {
        margin-left: 66.66666667%;
    }

    .col-xs-offset-7 {
        margin-left: 58.33333333%;
    }

    .col-xs-offset-6 {
        margin-left: 50%;
    }

    .col-xs-offset-5 {
        margin-left: 41.66666667%;
    }

    .col-xs-offset-4 {
        margin-left: 33.33333333%;
    }

    .col-xs-offset-3 {
        margin-left: 25%;
    }

    .col-xs-offset-2 {
        margin-left: 16.66666667%;
    }

    .col-xs-offset-1 {
        margin-left: 8.33333333%;
    }

    .col-xs-offset-0 {
        margin-left: 0;
    }
}

.row {
    margin-left: -15px;
    margin-right: -15px;
}

/*clear*/
.fullrow, .row, .form-group {
    *zoom: 1;
}

    .fullrow:after, .fullrow:before, .row:after, .row:before, .form-group:after, .form-group:before {
        content: "";
        display: table;
    }

    .fullrow:after, .row:after, .form-group:after {
        clear: both;
    }
/*new as 17 feb end*/


/*n/ew css*/


article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
    display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio, canvas, progress, video {
    display: inline-block;
    /* 1 */
    vertical-align: baseline;
    /* 2 */
}

    /**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
    audio:not([controls]) {
        display: none;
        height: 0;
    }

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */
[hidden], template {
    display: none;
}

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
    background: transparent;
}

    /**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
    a:active, a:hover {
        outline: 0;
    }

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
    border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b, strong {
    font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
    font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
    background: #ff0;
    color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
    border: 0;
    max-width: 100%;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
    overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
    margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
    box-sizing: content-box;
    height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
    overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code, kbd, pre, samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button, input, optgroup, select, textarea {
    color: inherit;
    /* 1 */
    font: inherit;
    /* 2 */
    margin: 0;
    /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
    overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button, select {
    text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button, html input[type="button"], input[type="reset"], input[type="submit"] {
    -webkit-appearance: button;
    /* 2 */
    cursor: pointer;
    /* 3 */
}

    /**
 * Re-set default cursor for disabled elements.
 */
    button[disabled], html input[disabled] {
        cursor: default;
    }

    /**
 * Remove inner padding and border in Firefox 4+.
 */
    button::-moz-focus-inner, input::-moz-focus-inner {
        border: 0;
        padding: 0;
    }

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
    line-height: normal;
}

    /**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
    input[type="checkbox"], input[type="radio"] {
        box-sizing: border-box;
        /* 1 */
        padding: 0;
        /* 2 */
    }

    /**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
    input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
        height: auto;
    }

    /**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *    (include `-moz` to future-proof).
 */
    input[type="search"] {
        -webkit-appearance: textfield;
        /* 1 */
        /* 2 */
        box-sizing: content-box;
    }

        /**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
        input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
            -webkit-appearance: none;
        }

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
    border: 0;
    /* 1 */
    padding: 0;
    /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
    overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
    font-weight: bold;
}

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
    border-collapse: collapse;
    border-spacing: 0;
}

td, th {
    padding: 0;
}

/* ==========================================================================
   Utilities
   ========================================================================== */
/* Cleafix
   ========================================================================== */
.starail-u-cf:before, .starail-u-cf:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */
}

.starail-u-cf:after {
    clear: both;
}

.starail-u-nbfc {
    overflow: hidden !important;
    _overflow: visible !important;
    zoom: 1;
}

/* Visibility
   ========================================================================== */
.starail-u-hide {
    display: none !important;
}

.starail-u-show, .starail-u-block {
    display: block !important;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */
.starail-u-hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */
.starail-u-visuallyHidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */
.starail-u-invisible {
    visibility: hidden;
}

/*
 * Image replacement
 */
.starail-u-ir {
    font: 0/0 a;
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

.starail-u-showMobile {
    display: none !important;
}

.starail-u-hideDesktop {
    display: none !important;
}

.starail-u-hideDesktopInline {
    display: none !important;
}

.starail-Full-wrap {
    align-items: center;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    /*display: flex;*/
    height: auto;
}


@media only screen and (min-width: 640px) {
    /*
     * Hide only visually, but have it available for screenreaders: h5bp.com/v
     */
    .starail-u-visuallyHiddenDesktop {
        border: 0;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }
}

@media only screen and (max-width: 639px) {
    .starail-u-showMobile {
        display: block !important;
    }

    .starail-u-hideDesktop {
        display: block !important;
    }

    .starail-u-hideDesktopInline {
        display: inline !important;
    }

     .starail-Form-label, .starail-Form-spacer {
        text-align: left;
    }
}

/* Position
   ========================================================================== */
.starail-u-floatLeft {
    float: left !important;
}

.starail-u-floatRight {
    float: right !important;
}

.starail-u-relative {
    position: relative !important;
}

/* Text
   ========================================================================== */
.starail-u-textCenter {
    text-align: center !important;
}

.starail-u-textLeft {
    text-align: left !important;
}

.starail-u-textRight {
    text-align: right !important;
}

/* Margin
   ========================================================================== */
.starail-u-marginBottom {
    margin-bottom: 20px !important;
}

.starail-u-marginBottomSmall {
    margin-bottom: 10px !important;
}

.starail-u-marginNone {
    margin: 0 !important;
}

/* Size
   ========================================================================== */
@media only screen and (min-width: 640px) {
    .starail-u-size2of12 {
        width: 16.66667% !important;
    }

    .starail-u-size3of12 {
        width: 25% !important;
    }

    .starail-u-size4of12 {
        width: 33.33333% !important;
    }

    .starail-u-size5of12 {
        width: 41.66667% !important;
    }

    .starail-u-size6of12 {
        width: 50% !important;
    }

    .starail-u-size7of12 {
        width: 58.33333% !important;
    }

    .starail-u-size8of12 {
        width: 66.66667% !important;
    }

    .starail-u-size9of12 {
        width: 75% !important;
    }

    .starail-u-size10of12 {
        width: 83.33333% !important;
    }

    .starail-u-size11of12 {
        width: 91.66667% !important;
    }
}

html {
    height: 100%;
}

body {
    height: 100%;
    margin: 0px;
    background-color: #edeff1;
}

/* ##STRUCTURE START ## */
.starail-Full-wrap {
    background-color: #ffffff;
    font-size: 16px;
}

.starail-Page-wrap {
    width: 100%;
    margin: 0 auto;
    *zoom: 1;
    /*background-color: #fff;*/
    padding-bottom: 10px;
}

    .starail-Page-wrap:before, .starail-Page-wrap:after {
        display: table;
        content: "";
        line-height: 0;
    }

    .starail-Page-wrap:after {
        clear: both;
    }

@media screen and (min-width: 640px) {
    .starail-Full-wrap {
        width: 100%;
        min-width: 960px;
    }

    .starail-Page-wrap {
        width: 960px;
        margin: 0 auto;
    }
}

@media screen and (max-width: 319px) {
    .starail-Page-wrap {
        width: 320px;
    }
}

/*

# Alert

i.e. Promotion callout image widget for homepage image links

### Modifiers

- .starail-Alert--info - Alert used for information
- .starail-Alert--error - Alert used for Error messages
- .starail-Alert--success - Alert used for successful notifications

### Example

    <div class="starail-Alert starail-Alert--info">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>
    </div>

    <div class="starail-Alert starail-Alert--error">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>
    </div>

    <div class="starail-Alert starail-Alert--success">
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>
    </div>

*/
/* ==========================================================================
   Alert
   ========================================================================== */
/* Component
   ========================================================================== */
.starail-Alert {
    border-width: 1px;
    border-style: solid;
    padding: 20px;
    padding: 1.42857rem;
    margin: 0 0 20px 0;
    margin: 0 0 1.42857rem 0;
}

    .starail-Alert > *:last-child, .starail-Alert > *:last-child > *:last-child, .starail-Alert > *:last-child > *:last-child > *:last-child {
        margin-bottom: 0;
    }

/* Modifiers
   ========================================================================== */
.starail-Alert--info {
    background-color: #D9EDF7;
    color: #3A87AD;
    border-color: #8CABBB;
}

.starail-Alert--success {
    background-color: #DFF0D8;
    color: #468847;
    border-color: #748B74;
}

.starail-Alert--error {
    background-color: #F2DEDE;
    color: #B94A48;
    border-color: #C78E8D;
}

/*

# Banner

Used for banners.

### Example

    <div class="starail-Wrapper"><!-- Page Wrapper -->
  

        <div class="starail-Banner"> 

            <div class="starail-Banner-content"> 

                <div class="starail-Banner-offer starail-u-hideMobile">Special Offer</div>

                <h1 class="starail-Banner-title starail-Banner-primaryTitle">Inter-Rail Global pass</h1>
                <h2 class="starail-Banner-title starail-Banner-secondaryTitle">See the world from just &pound;340</h2>

            </div>

            <img src="assets/img/banners/banner-pass.jpg" alt="Banner Alt" class="starail-Banner-image" />

        </div>


    </div><!-- /Page Wrapper -->

*/
/* Component
   ========================================================================== */
.starail-Banner {
    position: relative;
    overflow: hidden;
    height: 180px;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 0 30px 0;
    margin: 0 0 2.14286rem 0;
}

    .starail-Banner .starail-Banner-content {
        position: relative;
        z-index: 999;
        text-align: center;
        padding: 0 20px;
        padding: 0 1.42857rem;
    }

    .starail-Banner .starail-Banner-title {
        color: #FFF;
        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
    }

    .starail-Banner .starail-Banner-primaryTitle {
        font-size: 48px;
        font-size: 3.42857rem;
        margin: 0 0 5px 0;
        margin: 0 0 0.35714rem 0;
    }

    .starail-Banner .starail-Banner-secondaryTitle {
        font-size: 30px;
        font-size: 2.14286rem;
    }

    .starail-Banner .starail-Banner-image {
        position: absolute;
        top: -9999px;
        /* http://stackoverflow.com/questions/14562457/center-oversized-image-in-div */
        bottom: -9999px;
        left: -9999px;
        right: -9999px;
        margin: auto;
        min-width: 100%;
        min-height: 100%;
        z-index: 100;
    }

    .starail-Banner .starail-Banner-offer {
        display: inline-block;
        background-color: #f04d98;
        border: 1px solid #FFF;
        padding: 10px 12px;
        padding: 0.71429rem 0.85714rem;
        text-transform: uppercase;
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        color: #FFF;
        font-weight: 700;
        font-size: 17px;
        font-size: 1.21429rem;
        margin: 0 0 10px 0;
        margin: 0 0 0.71429rem 0;
        box-shadow: rgab(0, 0, 0, 0.2) 1px 1px;
    }

/* Desktop
   ========================================================================== */
@media only screen and (min-width: 640px) {
    .starail-Banner {
        height: 300px;
    }
}

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Banner {
        margin: 0 0 20px 0;
        margin: 0 0 1.42857rem 0;
    }

        .starail-Banner .starail-Banner-primaryTitle {
            font-size: 30px;
            font-size: 2.14286rem;
        }

        .starail-Banner .starail-Banner-secondaryTitle {
            font-size: 21px;
            font-size: 1.5rem;
        }
}

/* IE9 and below
   ========================================================================== */
.lt-ie10 .starail-Banner {
    display: table;
    width: 100%;
}

.lt-ie10 .starail-Banner-content {
    display: table-cell;
    vertical-align: middle;
}

@media only screen and (max-width: 639px) {
    .lt-ie10 .starail-Banner {
        display: block;
    }

    .lt-ie10 .starail-Banner-content {
        display: block;
        position: absolute;
        bottom: 50px;
        max-height: 120px;
        width: 100%;
    }
}

/* 

# Box

## Example

    <div class="starail-Box">
        <p>Nibh urna inceptos at ut eleifend sagittis, libero ipsum sed officia elit orci, sociosqu erat justo pellentesque ut orci.</p>
    </div>

 */
/* Component
   ========================================================================== */
.starail-Box {
    background-color: #edeff1;
    padding: 2.85714rem;
}

    .starail-Box .starail-Form-row:last-child {
        margin-bottom: 0px;
    }

/* Modifier
   ========================================================================== */
/* FullWidth
   ========================================================================== */
/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Box {
        padding: 25px 20px;
        padding: 1.78571rem 1.42857rem;
    }

    .starail-Box--fullMobile {
        margin: 0 -20px 35px -20px;
        margin: 0 -1.42857rem 2.5rem -1.42857rem;
    }

    .starail-Box--noPaddingBottomMobile {
        padding-bottom: 0;
        margin-bottom: 0;
    }
}

.progess-inner2 {
    background: #ffffff url('https://rail.statravel.com/images/ajax-loader.gif') no-repeat center 43px !important;
    z-index: 99999999;
    position: fixed;
    left: -7%;
    top: 42%;
    border: 1px solid #d2d2d2 !important;
    height: 80px;
    width: 350px;
    padding: 10px;
    margin-left: 46%;
    text-align: center;
    color: #444 !important;
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif !important;
    font-weight: bold !important;
    font-size: 18px !important;
    padding-top: 17px !important;
}

/*

# BookingDetails

Booking details styles

*/
/* Component
   ========================================================================== */
.starail-BookingDetails-titleAndButton {
    position: relative;
    clear: both;
    overflow: hidden;
    margin-bottom: 20px;
    margin-bottom: 1.42857rem;
}

    .starail-BookingDetails-titleAndButton h1.starail-BookingDetails-title {
        width: 480px;
        margin: 0px;
        margin: 0;
    }

.starail-BookingDetails-topRightBtn.starail-Button {
    float: right;
    padding: 8px 25px;
    padding: 0.57143rem 1.78571rem;
    font-size: 21px;
    font-size: 1.5rem;
}

.starail-BookingDetails-form {
    background-color: #edeff1;
    padding: 30px;
    padding: 2.14286rem;
    margin-bottom: 30px;
    margin-bottom: 2.14286rem;
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.starail-Wrapper .starail-BookingDetails-form h2 {
    border-bottom: 1px solid #d5d7d8;
    margin-bottom: 20px;
    margin-bottom: 1.42857rem;
    padding-bottom: 20px;
    padding-bottom: 1.42857rem;
    color: #1b365d;
    font-size: 21px;
    font-size: 1.5rem;
}

    .starail-Wrapper .starail-BookingDetails-form h2 i {
        color: #0c6ab8;
        display: inline-block;
        font-size: 20px;
        font-size: 1.42857rem;
        margin: -5px 10px 0px 0px;
        margin: -0.35714rem 0.71429rem 0 0;
    }

.starail-BookingDetails-form .starail-Form-label, .starail-BookingDetails-form .starail-Form-spacer {
    width: 210px;
}

.starail-BookingDetails-form .starail-Form-spacer {
    width: 210px;
    padding-right: 50px;
    padding-right: 3.57143rem;
}

.starail-BookingDetails-form > p {
    line-height: 20px;
    line-height: 1.42857rem;
    margin-bottom: 30px;
    margin-bottom: 2.14286rem;
    width: 78%;
}

    .starail-BookingDetails-form > p:last-child {
        margin-bottom: 15px;
        margin-bottom: 1.07143rem;
    }

.starail-BookingDetails-form .starail-Form-inputContainer-col {
    width: 40%;
}

    .starail-BookingDetails-form .starail-Form-inputContainer-col:first-child {
        padding-right: 20px;
        padding-right: 1.42857rem;
        width: 60%;
    }

.starail-BookingDetails-form .starail-BookingDetails-quantity .starail-Form-inputContainer-col {
    width: 45% !important;
    font-size: 14px;
    font-size: 1rem;
}

.starail-BookingDetails-form .starail-Form-inputContainer-col--autoWidth select {
    width: auto;
    margin-right: 20px;
    margin-right: 1.42857rem;
}

    .starail-BookingDetails-form .starail-Form-inputContainer-col--autoWidth select:last-child {
        margin-right: 0px;
        margin-right: 0;
    }

.starail-BookingDetails-form .starail-Form-inputContainer-col--ddInput {
    padding: 0px 20px 0px 100px;
    padding: 0 1.42857rem 0 7.14286rem;
}

    .starail-BookingDetails-form .starail-Form-inputContainer-col--ddInput select {
        position: absolute;
        top: 0px;
        left: 0px;
        height: 100%;
        width: 80px;
        width: 5.71429rem;
    }

.starail-BookingDetails-form .starail-Form-row--card .starail-Form-inputContainer--inputGrid {
    position: relative;
}

.starail-BookingDetails-form .starail-Form-row--card .starail-Form-row--card-first, .starail-BookingDetails-form .starail-Form-row--card .starail-Form-row--card-second {
    position: absolute;
    top: 10px;
    left: 340px;
}

.starail-BookingDetails-form .starail-Form-row--card .starail-Form-row--card-second {
    left: 390px;
}

@media only screen and (max-width: 639px) {
    .starail-BookingDetails-form .starail-Form-row--card .starail-Form-input {
        max-width: 75%;
        max-width: calc(100% - 115px);
    }

    .starail-BookingDetails-form .starail-Form-row--card .starail-Form-row--card-first, .starail-BookingDetails-form .starail-Form-row--card .starail-Form-row--card-second {
        position: absolute;
        top: 10px;
        left: auto;
        right: 10px;
    }
}

.starail-BookingDetails-form .starail-Form-row--card .starail-Form-row--card-first {
    right: 60px;
}

.starail-BookingDetails-form-fancyCheckbox:not(#ie8) {
    display: inline-block;
    line-height: 25px;
    line-height: 1.78571rem;
}

    .starail-BookingDetails-form-fancyCheckbox:not(#ie8) span span {
        border: 1px solid #d5d7d8;
        top: 2px;
    }

    .starail-BookingDetails-form-fancyCheckbox:not(#ie8) .starail-u-hideDesktopInline {
        position: relative;
        width: auto;
        margin: 0px;
        margin: 0;
        border: none;
    }

.starail-Form-label.starail-BookingDetails-protectPassLabel {
    padding-top: 0px;
    padding-top: 0;
}

.starail-BookingDetails--four-country {
    margin-top: 30px;
    margin-top: 2.14286rem;
}

    .starail-BookingDetails--four-country .starail-Button {
        text-transform: uppercase;
    }

.starail-BookingDetails-form-checkboxLink {
    display: block;
    margin: 10px 0px 0px 30px;
    margin: 0.71429rem 0 0 2.14286rem;
}

.starail-BookingDetails-radioRow {
    width: 50%;
    float: left;
    margin-bottom: 15px;
    margin-bottom: 1.07143rem;
}

    .starail-BookingDetails-radioRow a {
        display: inline-block;
        margin: -5px 0px 0px 20px;
        margin: -0.35714rem 0 0 1.42857rem;
    }

    .starail-BookingDetails-radioRow .starail-Form-fancyRadioGroup:not(#ie8) {
        font-size: 16px;
        font-size: 1.14286rem;
    }

        .starail-BookingDetails-radioRow .starail-Form-fancyRadioGroup:not(#ie8) span {
            margin-top: 1px;
        }

        .starail-BookingDetails-radioRow .starail-Form-fancyRadioGroup:not(#ie8) input {
            margin-right: 10px;
        }

.starail-BookingDetails-submit {
    margin: 0px 0px 25px 0px;
    margin: 0 0 1.78571rem 0;
    width: 100%;
    overflow: hidden;
}

.starail-BookingDetails-mobileRadios {
    padding-right: 30px;
    padding-right: 2.14286rem;
    position: relative;
    overflow: hidden;
}

    .starail-BookingDetails-mobileRadios a {
        position: absolute;
        right: 0px;
        top: 50%;
        margin-top: -12px;
    }

.starail-Form--promoCode .starail-BookingDetails-form {
    margin-bottom: 0px;
    margin-bottom: 0;
}

.starail-Form--promoCode .starail-BookingDetails-totalPrice {
    background-color: #edeff1;
    padding: 0px 30px 30px 30px;
    padding: 0 2.14286rem 2.14286rem 2.14286rem;
    margin: 0px 0px 30px;
    margin: 0 0 2.14286rem;
}

.starail-BookingDetails-trailingMobile {
    display: none;
}

#starail-delivery-address {
    overflow: hidden;
    max-height: 0;
    transition: all 0.5s ease-in-out;
}

    #starail-delivery-address.show {
        max-height: 10000px;
    }

/* Modifier 
   ========================================================================== */
.starail-BookingDetails-form--payAccount .starail-Form-inputContainer--inputGrid > div {
    width: 400px;
    box-sizing: border-box;
}

.starail-BookingDetails-form--payAccount .starail-Form-inputContainer-col:first-child {
    width: 480px;
}

/* Desktop
   ========================================================================== */
/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Wrapper h1.starail-BookingDetails-title {
        font-size: 21px;
        font-size: 1.5rem;
        padding: 20px 5px;
        padding: 1.42857rem 0.35714rem;
        margin: 0px 15px 0px 15px;
        margin: 0 1.07143rem 0 1.07143rem;
        border-bottom: 1px solid #edeff1;
    }

    .starail-BookingDetails-titleAndButton {
        margin-bottom: 0px;
        margin-bottom: 0;
    }

        .starail-BookingDetails-titleAndButton h1.starail-BookingDetails-title {
            width: auto;
            margin: 0px;
            margin: 0;
            margin: 0px 15px 0px 15px;
            margin: 0 1.07143rem 0 1.07143rem;
        }

    .starail-BookingDetails-form {
        background-color: #FFF;
        border: 1px solid #edeff1;
        padding: 10px;
        padding: 0.71429rem;
        margin: 0px 10px 20px 10px;
        margin: 0 0.71429rem 1.42857rem 0.71429rem;
        box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
    }

        .starail-BookingDetails-form hr {
            border-top: 1px solid #edeff1;
            margin: 10px 0px;
            margin: 0.71429rem 0;
        }

    .starail-Wrapper .starail-BookingDetails-form h2 {
        color: #444;
        padding: 5px 0px 15px;
        padding: 0.35714rem 0 1.07143rem;
        border-bottom: 1px solid #edeff1;
        line-height: 1.2em;
    }

    .starail-BookingDetails-form .starail-Form-label, .starail-BookingDetails-form .starail-Form-spacer {
        width: 100%;
    }

    .starail-BookingDetails-form .starail-Form-inputContainer-col {
        width: 100%;
    }

        .starail-BookingDetails-form .starail-Form-inputContainer-col:first-child {
            padding-right: 0px;
            padding-right: 0;
            width: 100%;
        }

    .starail-BookingDetails-form .starail-Form-row {
        margin-bottom: 15px;
        margin-bottom: 1.07143rem;
    }

    .starail-BookingDetails-form .starail-Form-inputContainer-col--ddInput {
        height: 50px;
        position: relative;
        display: block;
        padding: 0px 20px 0px 90px;
        padding: 0 1.42857rem 0 6.42857rem;
    }

        .starail-BookingDetails-form .starail-Form-inputContainer-col--ddInput select {
            height: 40px;
            width: 81px;
        }

        .starail-BookingDetails-form .starail-Form-inputContainer-col--ddInput input {
            height: 40px;
        }

    .starail-BookingDetails-form > p {
        width: 100%;
    }

    .starail-BookingDetails-form .starail-BookingDetails-protectPassDisclaimer {
        margin-bottom: 18px;
        margin-bottom: 1.28571rem;
    }

    .starail-BookingDetails-submit {
        padding: 0px 10px 5px;
        padding: 0 0.71429rem 0.35714rem;
        margin: 0px 0px 5px;
        margin: 0 0 0.35714rem;
    }

        .starail-BookingDetails-submit button {
            margin: 0px;
            margin: 0;
        }

    .starail-BookingDetails-radioRow {
        width: 100%;
    }

    .starail-BookingDetails-form-checkboxLink {
        margin: 10px 0px 10px 30px;
        margin: 0.71429rem 0 0.71429rem 2.14286rem;
    }

    .starail-Form--promoCode .starail-BookingDetails-form {
        margin-bottom: 20px;
        margin-bottom: 1.42857rem;
    }

    .starail-Form--promoCode .starail-BookingDetails-totalPrice {
        padding: 15px 10px;
        padding: 1.07143rem 0.71429rem;
        margin: 0px 10px 40px;
        margin: 0 0.71429rem 2.85714rem;
    }

    .starail-BookingDetails-form-fancyCheckbox:not(#ie8) > span {
        font-size: 14px;
        font-size: 1rem;
    }

    .starail-Form-label.starail-BookingDetails-protectPassLabel {
        padding: 0px 0px 5px;
        padding: 0 0 0.35714rem;
    }

    .starail-BookingDetails--four-country {
        border: none;
        padding: 10px;
        padding: 0.71429rem;
        margin: 0px 10px 0px 10px;
        margin: 0 0.71429rem 0 0.71429rem;
        box-shadow: none;
    }

        .starail-BookingDetails--four-country .starail-Button {
            margin-top: 10px;
        }

        .starail-BookingDetails--four-country .starail-BookingDetails-quantity .starail-Form-inputContainer-col {
            width: 100% !important;
            display: -webkit-flex;
            display: -ms-flexbox;
            display: flex;
            -webkit-align-items: center;
            -ms-flex-align: center;
            align-items: center;
        }

            .starail-BookingDetails--four-country .starail-BookingDetails-quantity .starail-Form-inputContainer-col label {
                margin-top: 0px;
                line-height: 1.3em;
            }

    .starail-BookingDetails-form.starail-BookingDetails-form--payAccount h2 {
        font-size: 17px;
        font-size: 1.21429rem;
    }

    .starail-BookingDetails-form.starail-BookingDetails-form--payAccount .starail-Form-inputContainer--inputGrid > div {
        width: 100%;
    }

    .starail-BookingDetails-form.starail-BookingDetails-form--payAccount .starail-Form-inputContainer-col:first-child {
        width: 100%;
    }
}

/* no-js
   ========================================================================== */
/*

# Button

i.e. CTA buttons used througout the site

### Modifiers
- .starail-Button--full - Full width button (Mainly for mobile)
- .starail-Button--blue - Alternative color button
- .starail-Button--cta - Alternative Call to action button
- .starail-Button--fullCallout - Alternative Call to action button
- .starail-Button--mobileBackButton - Back button for mobile view
- .starail-Button--rightSubmit - Right aligned submit button
    

### Example
    
    <button class="starail-Button">Button</button>
    <a href="index.html" class="starail-Button">Button</a>
    <input type="button" value="Button" class="starail-Button" />

    <a href="index.html" class="starail-Button starail-Button--blue">Button</a>


    <div style="margin: 10px 0;">
        <button class="starail-Button starail-Button--full">Button</button>
    </div>

    <div style="margin: 10px 0;">
        <button class="starail-Button starail-Button--cta">Button</button>
    </div>

    <div style="margin: 10px 0;">
        <button class="starail-Button starail-Button--fullCallout">Button</button>
    </div>

    <div style="margin: 10px 0;" class="starail-Wrapper">
        <button class="starail-Button starail-Button--mobileBackButton">Button</button>
    </div>

    <div style="margin: 10px 0;" class="starail-Wrapper starail-u-cf">
        <button class="starail-Button starail-Button--rightSubmit">Button</button>
    </div>
*/
/* ==========================================================================
   Button
   ========================================================================== */
/* Component
   ========================================================================== */
.starail-Button {
    position: relative;
    display: inline-block;
    color: #0073ae;
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    font-weight: 700;
    background-color: #c9da00;
    padding: 8px 10px;
    padding: 0.57143rem 0.71429rem;
    cursor: pointer;
    text-decoration: none;
    line-height: normal;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: normal;
    -webkit-appearance: none;
    text-transform: uppercase;
    border: 1px solid #bdcd00;
    border-radius: 1px;
    text-align: center;
    font-size: 17px;
    font-size: 1.21429rem;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
    background-image: none;
    transition: background-color 300ms ease-in-out, color 300ms ease-in-out;
}

    .starail-Button:hover, .starail-Button:focus, .starail-Button.is-active {
        background-color: #bdcd00;
    }

    .starail-Button:hover, .starail-Button:active, .starail-Button:visited, .starail-Button:focus {
        color: #0073ae;
    }

/* Button Generator Mixin
   ========================================================================== */
/* Modifiers
   ========================================================================== */
.starail-Button--full {
    display: block;
    width: 100%;
    font-size: 21px;
    font-size: 1.5rem;
}

.starail-Button--login {
    font-size: 19px;
    font-size: 1.35714rem;
    padding: 4px 10px;
    padding: 0.28571rem 0.71429rem;
}

.starail-Button--cta {
    display: block;
    width: 100%;
    padding: 20px;
    padding: 1.42857rem;
    border: none;
    font-size: 15px;
    font-size: 1.07143rem;
    color: #FFF;
    text-transform: none;
    background-color: #0c6ab8;
    border-radius: 0;
}

    .starail-Button--cta:visited {
        color: #FFF;
    }

    .starail-Button--cta:hover, .starail-Button--cta:focus, .starail-Button--cta.is-active {
        background-color: #074170;
        color: #FFF;
    }

.starail-Button--blue {
    border-radius: 0;
    border: 0;
    color: #FFF;
    background-color: #0c6ab8;
    text-transform: none;
    box-shadow: none !important;
    font-family: Tahoma, Verdana, Segoe, sans-serif;
    font-weight: 700;
    font-size: 14px;
    font-size: 1rem;
    padding: 11px 10px;
    padding: 0.78571rem 0.71429rem;
}

    .starail-Button--blue:visited, .starail-Button--blue:focus, .starail-Button--blue.is-active {
        background-color: #0c6ab8;
        color: #FFF;
    }

    .starail-Button--blue:hover {
        background-color: #074170;
        color: #FFF;
    }

.starail-Button--fullCallout {
    width: 100%;
    max-width: 620px;
    max-width: 44.28571rem;
    font-size: 18px;
    font-size: 1.28571rem;
    margin: 20px auto 20px auto;
    margin: 1.42857rem auto 1.42857rem auto;
    display: block;
    text-transform: uppercase;
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
}

    .starail-Button--fullCallout i {
        margin-top: -2px;
        margin-top: -0.14286rem;
    }

.starail-Button--continueShopping {
    width: 100%;
    max-width: 465px;
    max-width: 33.21429rem;
    font-size: 17px;
    font-size: 1.21429rem;
    margin: 0px auto 30px auto;
    margin: 0 auto 2.14286rem auto;
    display: block;
    text-transform: uppercase;
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
}

    .starail-Button--continueShopping i {
        margin-top: -2px;
        margin-top: -0.14286rem;
    }

.starail-Button--mobileBackButton {
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 18px;
    font-size: 1.28571rem;
    padding: 0 20px;
    padding: 0 1.42857rem;
    margin: 20px 0;
    margin: 1.42857rem 0;
    display: block;
}

    .starail-Button--mobileBackButton i {
        margin-top: -2px;
        margin-top: -0.14286rem;
    }

.starail-Button--rightSubmit {
    float: right;
    font-size: 21px;
    font-size: 1.5rem;
    padding: 8px 25px;
    padding: 0.57143rem 1.78571rem;
}

@media only screen and (max-width: 639px) {
    .starail-Button--rightSubmit {
        float: none;
        margin: 0 20px;
        margin: 0 1.42857rem;
    }
}

@media only screen and (max-width: 640px) {
    .starail-Button--rightSubmit {
        font-size: 16px;
        font-size: 1.14286rem;
    }
}

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Button--fullMobile {
        display: block;
        width: 100%;
    }

    .starail-Button--blue:hover {
        background-color: #0c6ab8;
        color: #FFF;
    }

    .starail-Button--continueShopping {
        margin: 0px 20px 15px;
        margin: 0 1.42857rem 1.07143rem;
        width: auto;
    }

    .starail-Button--four-country {
        margin-left: 20px;
        margin-left: 1.42857rem;
        margin-right: 20px;
        margin-right: 1.42857rem;
        width: auto;
    }
}

/* States
   ========================================================================== */
.starail-Button.is-disabled {
    cursor: default;
    background-color: #d2d2d2;
    border-color: #c0c0c0;
    color: #9d9d9d;
    box-shadow: none;
}

    .starail-Button.is-disabled:hover, .starail-Button.is-disabled:active, .starail-Button.is-disabled:focus, .starail-Button.is-disabled:visited {
        background-color: #d2d2d2;
        outline: 0;
    }

/*

# ContactForm

Contact form styles

*/
/* Component
   ========================================================================== */
.starail-ContactForm {
    /*     .starail-Form-fancyCheckbox:not(#ie8) { // don't do it in ie8
        @include px(padding-left, 30px);
    } */
}

    .starail-ContactForm h3, .starail-ContactForm p {
        text-align: center;
    }

    .starail-ContactForm .starail-Form-inputContainer--inputGrid .starail-Form-inputContainer-col {
        margin-bottom: 0px;
    }

.starail-ContactForm--header {
    max-width: 400px;
    margin: 0 auto;
}

.starail-Wrapper .starail-ContactForm h3 {
    font-size: 21px;
    font-size: 1.5rem;
}

.starail-Form-row.starail-ContactForm-contactPreference {
    margin-bottom: 0px;
    margin-bottom: 0;
}

    .starail-Form-row.starail-ContactForm-contactPreference input {
        border: 1px;
    }

    .starail-Form-row.starail-ContactForm-contactPreference .starail-Form-inputContainer--inputGrid > * {
        width: 30%;
    }

label.starail-ContactForm-contactPreferenceLabel {
    width: auto;
    margin-right: 25px;
    margin-right: 1.78571rem;
    margin-bottom: 25px;
    margin-bottom: 1.78571rem;
}

/* FullWidth
   ========================================================================== */
/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-ContactForm .starail-Form-inputContainer--inputGrid .starail-Form-inputContainer-col {
        margin-bottom: 20px;
    }

        .starail-ContactForm .starail-Form-inputContainer--inputGrid .starail-Form-inputContainer-col:last-child {
            margin-bottom: 0px;
        }

    .starail-Form-row.starail-ContactForm-contactPreference {
        margin-bottom: 20px;
        margin-bottom: 1.42857rem;
    }

        .starail-Form-row.starail-ContactForm-contactPreference .starail-Form-inputContainer--inputGrid > * {
            width: 50%;
            padding-left: 2px;
        }
}

/*

# Country

i.e. List for countries by region

### Example

    <section class="starail-Country starail-u-cf">

        <header class="starail-Country-header">
            <h2 class="starail-Country-title">Australia/New Zealand</h2>
        </header>

        <ul class="starail-Country-list starail-u-cf">
            <li class="starail-Country-listItem">
                <a href="#">Australia</a>
            </li>
            <li class="starail-Country-listItem">
                <a href="#">New Zealand</a>
            </li>
        </ul>

    </section>

*/
/* Component
   ========================================================================== */
.starail-Country {
    background-color: #edeff1;
    padding: 30px 30px 10px 30px;
    padding: 2.14286rem 2.14286rem 0.71429rem 2.14286rem;
    margin: 0 0 30px 0;
    margin: 0 0 2.14286rem 0;
}

    .starail-Country .starail-Country-header {
        border-bottom: 1px solid #d5d7d8;
        margin: 0 0 20px 0;
        margin: 0 0 1.42857rem 0;
    }

    .starail-Country .starail-Country-title {
        color: #1b365d;
    }

    .starail-Country .starail-Country-list {
        list-style: none;
        margin: 0;
        padding: 0;
        font-size: 16px;
        font-size: 1.14286rem;
    }

    .starail-Country .starail-Country-listItem {
        display: block;
        margin: 0 0 20px 0;
        margin: 0 0 1.42857rem 0;
        float: left;
        width: 25%;
        padding-right: 30px;
        padding-right: 2.14286rem;
    }

        .starail-Country .starail-Country-listItem a {
            color: #444;
        }

            .starail-Country .starail-Country-listItem a:visited {
                color: #444;
            }

            .starail-Country .starail-Country-listItem a:hover, .starail-Country .starail-Country-listItem a:focus {
                color: #fb4f14;
            }

    .starail-Country:last-child {
        margin: 0 0 50px 0;
        margin: 0 0 3.57143rem 0;
    }

.starail-Country-pageTitle {
    text-align: center;
    margin: 30px 20px 30px 20px;
    margin: 2.14286rem 1.42857rem 2.14286rem 1.42857rem;
}

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Country .starail-Country-listItem {
        width: 50%;
    }

    .starail-Wrapper h1.starail-Country-pageTitle {
        font-size: 21px;
        margin: 20px;
        margin: 1.42857rem;
    }

    .starail-Wrapper h2.starail-Country-title {
        font-size: 21px;
    }
}

/* Mobile Small
   ========================================================================== */
@media only screen and (max-width: 419px) {
    .starail-Country .starail-Country-listItem {
        width: 100%;
        float: none;
    }

    .new-sta-btn-hover {
        width: 100% !important;
    }

    .starail-ImageLink .starail-ImageLink-title .highlight {
        font-size: 1rem;
        line-height: 1.8rem;
    }
}

/*
# ui-datepicker

jQuery UI is used for datepickers

*/
/* Component
   ========================================================================== */
.ui-datepicker {
    z-index: 150 !important;
    background-color: #FFF;
    border: 1px solid #edeff1;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
    min-width: 290px;
}

    .ui-datepicker button.ui-state-default {
        border: 0;
        color: #FFF;
        background-color: #0c6ab8;
        text-transform: none;
        box-shadow: none !important;
        font-family: Tahoma, Verdana, Segoe, sans-serif;
        font-weight: 700;
        font-size: 14px;
        font-size: 1rem;
        padding: 8px 12px;
        padding: 0.57143rem 0.85714rem;
        transition: all 0.3s ease-in-out;
        margin: 10px;
        margin: 0.71429rem;
    }

        .ui-datepicker button.ui-state-default:visited {
            color: #FFF;
        }

        .ui-datepicker button.ui-state-default:hover, .ui-datepicker button.ui-state-default:focus, .ui-datepicker button.ui-state-default.is-active {
            background-color: #074170;
            color: #FFF;
        }

.ui-datepicker-header {
    background-color: #0c6ab8;
    color: #FFF;
    position: relative;
}

.ui-datepicker-prev, .ui-datepicker-next {
    position: absolute;
    top: 11px;
    color: #FFF;
    width: 20px;
    height: 20px;
}

    .ui-datepicker-prev:hover, .ui-datepicker-next:hover {
        cursor: pointer !important;
    }

    .ui-datepicker-prev.ui-state-disabled, .ui-datepicker-next.ui-state-disabled {
        display: none;
    }

    .ui-datepicker-prev .ui-icon, .ui-datepicker-next .ui-icon {
        font-family: 'icomoon';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        font-size: 19px;
        vertical-align: middle;
        display: inline-block;
        /* Better Font Rendering =========== */
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

        .ui-datepicker-prev .ui-icon:before, .ui-datepicker-next .ui-icon:before {
            position: absolute;
            top: 0px;
            text-indent: 0px;
        }

.ui-datepicker-prev {
    left: 10px;
    text-indent: -99999px;
}

    .ui-datepicker-prev .ui-icon-circle-triangle-w:before {
        content: "\f137";
        left: 0px;
    }

.ui-datepicker-next {
    right: 10px;
    text-indent: -99999px;
}

    .ui-datepicker-next .ui-icon-circle-triangle-e:before {
        content: "\f138";
        right: 0px;
    }

.ui-datepicker-title {
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    text-transform: uppercase;
    text-align: center;
    font-weight: 700;
    font-size: 16px;
    font-size: 1.14286rem;
    padding: 10px 20px;
    padding: 0.71429rem 1.42857rem;
}

.ui-datepicker-calendar {
    margin-bottom: 0px;
    margin-bottom: 0;
}

    .ui-datepicker-calendar th, .ui-datepicker-calendar td {
        width: 40px;
        height: 40px;
    }

    .ui-datepicker-calendar td {
        border: 1px solid #edeff1;
    }

        .ui-datepicker-calendar td .ui-state-default {
            display: block;
            background-color: #FFF;
            text-align: center;
            line-height: 40px;
            font-size: 14px;
            font-size: 1rem;
        }

        .ui-datepicker-calendar td a.ui-state-default {
            color: #444;
            transition: color 0.1s ease-in-out;
            transition: background-color 0.1s ease-in-out;
        }

            .ui-datepicker-calendar td a.ui-state-default.ui-state-highlight {
                background-color: #edeff1;
            }

            .ui-datepicker-calendar td a.ui-state-default.ui-state-active {
                font-weight: bold;
                background-color: #0c6ab8;
                color: #FFF;
            }

            .ui-datepicker-calendar td a.ui-state-default:hover {
                background-color: #0c6ab8;
                color: #FFF;
                transition: color 0.3s ease-in-out;
                transition: background-color 0.3s ease-in-out;
            }

        .ui-datepicker-calendar td span.ui-state-default {
            color: #c4c4c4;
        }

.ui-datepicker-buttonpane {
    overflow: hidden;
}

    .ui-datepicker-buttonpane .ui-datepicker-current {
        float: left;
    }

    .ui-datepicker-buttonpane .ui-datepicker-close {
        float: right;
    }

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 330px) {
    .ui-datepicker {
        margin-left: -20px !important;
        min-width: 0px;
        width: 100%;
        max-width: 100%;
    }

    .ui-datepicker-calendar {
        width: 100%;
    }

        .ui-datepicker-calendar th, .ui-datepicker-calendar td {
            width: 14%;
            height: 40px;
        }
}

.starail-DestinationIcon {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 45px;
    display: block;
    width: 8px;
    z-index: 100;
}

.starail-DestinationIcon-line {
    border-left: 1px dashed #d5d7d8;
    height: 45px;
    width: 0px;
    position: absolute;
    top: 0px;
    left: 3px;
}

.starail-DestinationIcon-circle {
    position: absolute;
    left: 0px;
    top: auto;
    bottom: 0px;
    background-color: #FFF;
    border: 1px solid #0c6ab8;
    border-radius: 4px;
    width: 8px;
    height: 8px;
    display: block;
}

    .starail-DestinationIcon-circle.starail-DestinationIcon-circle--filled {
        top: 0px;
        bottom: auto;
        background-color: #0c6ab8;
    }

.lt-ie9 .starail-DestinationIcon-circle {
    border: none;
    border-radius: 0px;
    background-color: transparent;
    background-image: url('../img/ie/ie-departure-icon.png');
    background-position: 0px -8px;
}

    .lt-ie9 .starail-DestinationIcon-circle.starail-DestinationIcon-circle--filled {
        background-position: 0px 0px;
    }

/* 

# Filters

List filters

### Example
    
    <div class="starail-Filter">

        <h2 class="starail-Filter-title  starail-u-alpha">Rail Passes And Routes in Europe</h2>
    
        <div class="starail-Filter-toggle starail-u-hideDesktop">
            <a class="starail-Filter-toggle-trigger" href="#">Filter <span class="starail-Filter-chevron"></span></a>
        </div>

        <div class="starail-Filter-filterBar starail-u-cf">

            <form action="#" method="post" class="starail-Filter-form">

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="allcountries" >
                        All countries
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>
 

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="belgium" checked="checked">
                        Belgium
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>


                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="france" checked="checked" >
                        France
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="germany" checked="checked" >
                        Germany
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="italy" data-filter="reset">
                        Italy
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="spain" checked="checked">
                        Spain
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="austria" checked="checked">
                        Austria
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="finland" checked="checked" data-filter="reset">
                        Finland
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="bulgaria" checked="checked" data-filter="reset">
                        Bulgaria
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="croatia" checked="checked" >
                        Croatia
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="czechrepublic" checked="checked" >
                        Czech Republic
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="denmark" >
                        Denmark
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>
                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="bosnia" >
                        Bosnia
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>

                <label class="starail-Form-label starail-Form-label--checkbox starail-Filter-filter">
                    <span class="starail-Form-fancyCheckbox">
                        <input type="checkbox" name="unitedkingdom" >
                        United Kingdom
                        <span>
                            <i class="starail-Icon-tick"></i>
                        </span>
                    </span>
                </label>


            </form>

        </div>

        <a class="starail-Filter-clear-trigger starail-Button starail-Button--blue" href="#"><i class="starail-Icon starail-Icon-timescircle"></i> Clear filters</a>

        <div class="starail-Filter-more starail-u-hideMobile">
            <a class="starail-Filter-more-trigger" href="#"><i class="starail-Icon starail-Icon-pluscircle"></i> More countries in Europe</a>
            <a class="starail-Filter-less-trigger" href="#"><i class="starail-Icon starail-Icon-minuscircle"></i> Hide countries</a>
        </div>

    </div>
       
*/
/* Component
   ========================================================================== */
.starail-Filter {
    padding: 30px 0 10px 0;
    padding: 2.14286rem 0 0.71429rem 0;
    position: relative;
}

    .starail-Filter .starail-Form-fancyCheckbox:not(#ie8) {
        padding-left: 30px;
        padding-left: 2.14286rem;
    }

.starail-Filter-title {
    text-align: center;
    padding: 0px 140px;
    padding: 0 10rem;
}

.starail-Filter-filterBar {
    position: relative;
    padding: 0px 10px 10px 10px;
    padding: 0 0.71429rem 0.71429rem 0.71429rem;
    display: block;
    border-top: 1px solid #edeff1;
    border-bottom: 1px solid #edeff1;
    transition: max-height 0.5s ease-in-out;
    max-height: 65px;
    overflow: hidden;
    height: 65px;
}

.starail-Filter-form {
    display: inline;
}

.starail-Filter-filter.starail-Form-label {
    margin: 0 0px 0 0;
    margin: 0 0 0 0;
    display: inline-block;
    width: 16.6%;
    padding: 20px 20px 10px 0px;
    padding: 1.42857rem 1.42857rem 0.71429rem 0;
}

.starail-Filter-clear-trigger {
    position: absolute;
    right: 0px;
    top: 25px;
}

    .starail-Filter-clear-trigger i {
        margin: -2px 3px 0px 0px;
        margin: -0.14286rem 0.21429rem 0 0;
    }

.starail-Filter-more {
    position: relative;
    padding: 20px 10px;
    padding: 1.42857rem 0.71429rem;
    display: block;
    border-bottom: 1px solid #edeff1;
    text-align: center;
}

a.starail-Filter-more-trigger, a.starail-Filter-less-trigger {
    font-weight: 700;
    transition: color 0.3s ease-in-out;
}

    a.starail-Filter-more-trigger i, a.starail-Filter-less-trigger i {
        margin: -2px 3px 0px 0px;
        margin: -0.14286rem 0.21429rem 0 0;
    }

a.starail-Filter-less-trigger {
    display: none;
}

.starail-Filter-chevron:after {
    position: absolute;
    right: 18px;
    top: 18px;
    content: ' ';
    border: 7px solid transparent;
    border-top: 7px solid #0c6ab8;
}

.starail-Filter--open .starail-Filter-filterBar {
    max-height: 9000px;
    height: auto;
}

.starail-Filter--open a.starail-Filter-less-trigger {
    display: block;
}

.starail-Filter--open a.starail-Filter-more-trigger {
    display: none;
}

.starail-Filter--open .starail-Filter-chevron:after {
    border: 7px solid transparent;
    border-bottom: 7px solid #0c6ab8;
    top: 11px;
}

/* Mobile 
	========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Filter {
        padding-bottom: 0px;
        padding-bottom: 0;
        padding-top: 15px;
        padding-top: 1.07143rem;
    }

    .starail-Filter-clear-trigger {
        right: auto;
        top: 100%;
        margin-top: 180px;
        display: none;
        width: 100%;
        z-index: 100;
    }

    .starail-Wrapper .starail-Filter-title.starail-u-alpha {
        padding: 0px 20px;
        padding: 0 1.42857rem;
        font-size: 21px;
        font-size: 1.5rem;
        margin-bottom: 15px;
        margin-bottom: 1.07143rem;
    }

    .starail-Filter-filter.starail-Form-label {
        width: 50%;
        margin-right: 0;
        padding-right: 5px;
        padding-left: 5px;
        font-size: 13px;
        font-size: 0.92857rem;
    }

    .starail-Filter-toggle {
        position: relative;
    }

        .starail-Filter-toggle .starail-Filter-toggle-trigger {
            position: relative;
            display: block;
            font-weight: 700;
            line-height: 45px;
            padding: 0px 20px;
            padding: 0 1.42857rem;
            border-top: 1px solid #edeff1;
        }

            .starail-Filter-toggle .starail-Filter-toggle-trigger:hover, .starail-Filter-toggle .starail-Filter-toggle-trigger:active, .starail-Filter-toggle .starail-Filter-toggle-trigger:visited {
                color: #0c6ab8;
            }

    .starail-Filter-filterBar {
        position: absolute;
        top: 100%;
        background-color: #FFF;
        background-color: rgba(255, 255, 255, 0.98);
        z-index: 100;
        padding: 0px 5px 0px 10px;
        padding: 0 0.35714rem 0 0.71429rem;
        display: block;
        border-bottom: 0px;
        transition: max-height 0s ease-in-out;
        max-height: 0px;
        overflow: hidden;
    }

    .starail-Filter--open .starail-Filter-filterBar {
        max-height: 180px;
        height: 180px;
        overflow: auto;
        padding: 0px 10px 10px 10px;
        padding: 0 0.71429rem 0.71429rem 0.71429rem;
    }

    .starail-Filter--open .starail-Filter-clear-trigger {
        display: block;
    }
}

/* no-js
	========================================================================== */
.no-js .starail-Filter-filterBar {
    max-height: none;
}

.no-js .starail-Filter-more {
    display: none;
}

/* ==========================================================================
   Footer
   ========================================================================== */
/* Component
   ========================================================================== */
.starail-Footer {
    background-color: #edeff1;
    overflow: hidden;
    box-sizing: border-box;
}

.starail-Footer-outerWrap {
    background-color: #edeff1;
    overflow: hidden;
    padding: 15px;
    padding: 1.07143rem;
    box-sizing: border-box;
}

.starail-Footer-wrap {
    text-align: center;
    font-size: 12px;
    font-size: 0.85714rem;
    line-height: 15px;
    line-height: 1.07143rem;
}

    .starail-Footer-wrap p {
        margin: 0px;
        margin: 0;
    }

.starail-Footer-links {
    margin: 0px 0px 5px 0px;
    margin: 0 0 0.35714rem 0;
}

    .starail-Footer-links a {
        white-space: nowrap;
    }

.starail-Footer-copyright {
    margin: 0px;
    margin: 0;
}

@media screen and (min-width: 640px) {
    .starail-Footer {
        width: 100%;
        min-width: 960px;
    }

    .starail-Footer-wrap {
        width: 740px;
        margin: 0 auto;
    }
}

@media screen and (max-width: 640px) {
    .starail-Footer-wrap {
        font-size: 13px;
        font-size: 0.92857rem;
        line-height: 20px;
        line-height: 1.42857rem;
    }
}

/* 

# Form

## Example

    <form class="starail-BookingDetails-form">
        <h2>Lead Passenger Information</h2>

        <div class="starail-Form-row">
            <label for="starail-dob-day" class="starail-Form-label">Date of birth <span class="starail-Form-required">*</span></label>
            <div class="starail-Form-inputContainer">
                                
                <div class="starail-Form-inputContainer-col starail-Form-inputContainer-col--autoWidth">
                    <select class="starail-Form-select" name="starail-dob-day" id="starail-dob-day">
                        <option value="" disabled="" selected="">DD</option>
                        <option value="01">01</option>
                        <option value="02">02</option>
                        <option value="03">03</option>
                    </select>

                    <select class="starail-Form-select" name="starail-dob-month" id="starail-dob-month">
                        <option value="" disabled="" selected="">MM</option>
                        <option value="01">Jan</option>
                        <option value="02">Feb</option>
                        <option value="03">Mar</option>
                    </select>

                    <select class="starail-Form-select" name="starail-dob-year" id="starail-dob-year">
                        <option value="" disabled="" selected="">YYYY</option>
                        <option value="2015">2015</option>
                        <option value="2014">2014</option>
                        <option value="2013">2013</option>
                    </select>
                </div>

            </div>
        </div>

        <div class="starail-Form-row">
            <label for="starail-country" class="starail-Form-label">Country of residence <span class="starail-Form-required">*</span></label>

            <div class="starail-Form-inputContainer">
                <div class="starail-Form-inputContainer-col">
                    <select class="starail-Form-select" name="starail-country" id="starail-country">
                        <option value="" disabled="" selected="">Choose a country</option>
                        <option value="uk">United Kingdom</option>
                        <option value="aus">Australia</option>
                        <option value="nz">New Zealand</option>
                    </select>
                                
                </div>
            </div>
        </div>


        <div class="starail-Form-row">
            <label for="starail-passportno" class="starail-Form-label">Passport number <span class="starail-Form-required">*</span></label>

            <div class="starail-Form-inputContainer">
                <div class="starail-Form-inputContainer-col">
                    <input class="starail-Form-input" type="text" name="starail-passportno" id="starail-passportno" placeholder="" value="">
                </div>
            </div>
        </div>


        <div class="starail-Form-row">
            <label for="starail-email" class="starail-Form-label">Email address <span class="starail-Form-required">*</span></label>

            <div class="starail-Form-inputContainer">
                <div class="starail-Form-inputContainer-col">
                    <input class="starail-Form-input" type="text" name="starail-email" id="starail-email" placeholder="" value="">
                </div>
            </div>
        </div>



        <div class="starail-Form-row">
            <label for="starail-pass" class="starail-Form-label">Which pass will this passenger use?</label>

            <div class="starail-Form-inputContainer">
                <div class="starail-Form-inputContainer-col">
                    <select class="starail-Form-select" name="starail-pass" id="starail-pass">
                        <option value="" disabled="" selected="">Choose one of the passes you selected</option>
                        <option value="1">pass #1</option>
                        <option value="2">pass #2</option>
                    </select>

                </div>
            </div>
        </div>


        <div class="starail-Form-row">
            <label for="starail-pass-day" class="starail-Form-label">When do you want to start using this pass?</label>
            <div class="starail-Form-inputContainer">

                <div class="starail-Form-inputContainer-col starail-Form-inputContainer-col--autoWidth">
                    <select class="starail-Form-select" name="starail-pass-day" id="starail-pass-day">
                        <option value="" disabled="" selected="">DD</option>
                        <option value="01">01</option>
                        <option value="02">02</option>
                        <option value="03">03</option>
                    </select>

                    <select class="starail-Form-select" name="starail-pass-month" id="starail-pass-month">
                        <option value="" disabled="" selected="">MM</option>
                        <option value="01">Jan</option>
                        <option value="02">Feb</option>
                        <option value="03">Mar</option>
                    </select>

                    <select class="starail-Form-select" name="starail-pass-year" id="starail-pass-year">
                        <option value="" disabled="" selected="">YYYY</option>
                        <option value="2015">2015</option>
                        <option value="2016">2016</option>
                    </select>
                </div>

            </div>
        </div>

        <div class="starail-Form-row">
            <div class="starail-Form-spacer starail-u-hideMobile">&nbsp;</div>

            <div class="starail-Form-inputContainer">
                               
                <div class="">

                    <label class="starail-BookingDetails-form-fancyCheckbox">
                        <span class="starail-Form-fancyCheckbox">
                            <input type="checkbox" name="starail-tc">
                            I confirm this passenger's name is as stated in the passport or legal travel document and that tickets are strictly personal and non-transferable.
                            <span>
                                <i class="starail-Icon-tick"></i>
                            </span>
                        </span>
                    </label>
                    <a href="#" class="js-lightboxOpen starail-BookingDetails-form-checkboxLink" data-lightbox-id="starail-ticket-info">Additional ticket info and conditions</a>
                </div>
            </div>
        </div>

    </form>

 */
/* Input, textarea styles
   ========================================================================== */
.starail-Form-input, .starail-Form-textarea, .starail-Form-select {
    padding: 10px;
    padding: 0.71429rem;
    font-size: 16px;
    font-size: 1.14286rem;
    border: 1px solid #d5d7d8;
    color: #222;
    background-color: #FFF;
    width: 100%;
    text-align: left;
    transition: border 300ms ease-in-out;
    border-radius: 1px;
}

    .starail-Form-input:hover, .starail-Form-textarea:hover, .starail-Form-select:hover {
        border-color: #aaaaaa;
    }

    .starail-Form-input:focus, .starail-Form-textarea:focus, .starail-Form-select:focus {
        outline: none;
        border-color: #389ef2;
    }

::-webkit-input-placeholder {
    color: #6e6e6e;
}

:-moz-placeholder {
    color: #6e6e6e;
}

::-moz-placeholder {
    color: #6e6e6e;
}

:-ms-input-placeholder {
    color: #6e6e6e;
}

.placeholder {
    color: #6e6e6e;
}

.starail-Form input[type="text"] {
    -webkit-appearance: none;
}

/* Form-input modifiers
   ========================================================================== */
.starail-Form-input--small {
    max-width: 60px;
}

.starail-Form-input--medium {
    max-width: 140px;
}

/* Form-Button
   ========================================================================== */
.starail-Form-button {
    width: 100%;
    max-width: 300px;
    display: block;
    margin: 0px auto;
    margin: 0 auto;
}
    /*sta*/
    .starail-Form-button.starail-Form-button--primary {
        font-size: 18px;
    }

/* Form-row
   ========================================================================== */
.starail-Form-row {
    margin: 0 0 25px 0;
    margin: 0 0 1.78571rem 0;
    clear: both;
}

@media only screen and (min-width: 640px) {
    .starail-Form-row--spaced {
        margin: 80px 0 25px 0;
        margin: 5.71429rem 0 1.78571rem 0;
        clear: left;
    }
}

.starail-Form-col {
    display: block;
    float: left;
    width: 60%;
}

.starail-Form-row--disabled label {
    opacity: 0.5;
}

.starail-Form-row--disabled select:disabled {
    opacity: 0.5;
}

    .starail-Form-row--disabled select:disabled:hover {
        border-color: #d5d7d8;
    }

.starail-Form-row--hasIcon {
    position: relative;
}

    .starail-Form-row--hasIcon [class^="starail-Icon-"] {
        position: absolute;
        top: 13px;
        right: 10px;
        color: #b2b2b2;
        transition: color 300ms ease-in-out;
    }

    .starail-Form-row--hasIcon .starail-Form-input {
        padding-right: 30px;
    }

    .starail-Form-row--hasIcon input:focus + [class^="starail-Icon-"] {
        color: #7f7f7f;
    }

/* Form-selectGroup
   ========================================================================== */
.starail-Form-selectGroup {
    float: none;
    width: 100%;
}

    .starail-Form-selectGroup select {
        display: block;
        width: 90px;
        margin-right: 15px;
        margin-right: 1.07143rem;
        float: left;
        color: #6e6e6e;
    }

        .starail-Form-selectGroup select.starail-Form-selectGroup--last {
            margin-right: 0;
        }

    .starail-Form-selectGroup .starail-Form-select--small {
        width: 75px;
    }

@media only screen and (max-width: 639px) {
    .starail-Form-selectGroup select {
        margin-right: 5px;
        margin-right: 0.35714rem;
    }
}

/* Form-inputContainer - general inputs
   ========================================================================== */
.starail-Form-inputContainer {
    position: relative;
    overflow: hidden;
}

    .starail-Form-inputContainer > * {
        display: block;
        float: left;
    }

    .starail-Form-inputContainer input[type="radio"] {
        margin-top: 14px;
        margin-right: 5px;
    }

        .starail-Form-inputContainer input[type="radio"] + label {
            font-size: 16px;
            font-size: 1.14286rem;
        }

.starail-Form-inputContainer--inputGroup > * {
    width: 250px;
}

    .starail-Form-inputContainer--inputGroup > *.starail-Form-inputContainer--last {
        padding-right: 0;
    }

        .starail-Form-inputContainer--inputGroup > *.starail-Form-inputContainer--last.starail-Form-inputContainer--time {
            padding-right: 10px;
        }

    .starail-Form-inputContainer--inputGroup > *.starail-Form-inputContainer--time {
        width: 100px;
    }

.starail-Form-inputContainer--inputGroup .starail-Form-datePicker i {
    right: 33px;
    background-color: #FFF;
}

/* --inputGrid - each input container is 50% of row */
.starail-Form-inputContainer--inputGrid > * {
    width: 50%;
}

.starail-Form-inputContainer--inputGrid > div {
    padding: 0px 20px 0px 0px;
    padding: 0 1.42857rem 0 0;
}

    .starail-Form-inputContainer--inputGrid > div:nth-child(2n) {
        padding: 0px 0px 0px 0px;
        padding: 0 0 0 0;
    }

.starail-Form-inputContainer--inputGrid .starail-Form-inputContainer-col {
    margin-bottom: 20px;
    margin-bottom: 1.42857rem;
}

/* Form-datePicker
   ========================================================================== */
.starail-Form-datePicker {
    position: relative;
}

    .starail-Form-datePicker input {
        position: relative;
        padding-right: 10px;
        padding-right: 0.71429rem;
    }

    .starail-Form-datePicker i {
        position: absolute;
        right: 13px;
        top: 13px;
        color: #0c6ab8;
    }

    .starail-Form-datePicker input[type="date"] + i {
        display: none;
    }

/* Form-label
   ========================================================================== */
.starail-Form-label, .starail-Form-spacer {
    display: block;
    float: left;
    width: 110px;
    padding: 10px 10px 0px 0px;
    padding: 0.71429rem 0.71429rem 0 0;
    font-size: 16px;
    font-size: 1.14286rem;
    color: #444;
}

.custom-sta .starail-Form-label, .custom-sta .starail-Form-spacer { /*sta*/
    display: block;
    float: none;
    width: 100%;
    padding: 10px 0;
    /*padding: .71429rem .71429rem 0 0;*/
    font-size: 14px !important;
    font-weight: bold;
    font-size: 1.14286rem;
    color: #434343 !important;
}

.starail-Form-spacer {
    padding: 0px 10px 0px 0px;
    padding: 0 0.71429rem 0 0;
}

.starail-Form-required {
    color: #0c6ab8;
}

.starail-Form-label--large {
    display: block;
    color: #898784;
    font-size: 16px;
    font-size: 1.14286rem;
    margin: 0 0 10px 0;
    margin: 0 0 0.71429rem 0;
}

.starail-Form-label--checkbox {
    font-weight: normal;
    font-size: 14px;
    font-size: 1rem;
}

    .starail-Form-label--checkbox input {
        vertical-align: middle;
    }

/* Form-fancyCheckbox
   ========================================================================== */
.starail-Form-fancyCheckbox:not(#ie8) {
    position: relative;
    padding-left: 40px;
    padding-left: 2.85714rem;
    display: inline-block;
    cursor: default;
}

    .starail-Form-fancyCheckbox:not(#ie8) input {
        position: absolute;
        opacity: 0.0001;
        top: 0px;
        left: 0px;
        margin-left: 15px;
    }

        .starail-Form-fancyCheckbox:not(#ie8) input:focus + span {
            border-color: #389ef2;
            transition: border-color 0.3s ease-in-out;
        }

        .starail-Form-fancyCheckbox:not(#ie8) input:checked + span i {
            display: inline;
            color: #0c6ab8;
        }

    .starail-Form-fancyCheckbox:not(#ie8) span {
        position: absolute;
        top: 0;
        left: 0;
        height: 20px;
        width: 20px;
        border: 1px solid #e5e5e5;
        background: #FFF;
    }

        .starail-Form-fancyCheckbox:not(#ie8) span i {
            position: absolute;
            top: -1px;
            left: 3px;
            font-size: 12px;
            font-size: 0.85714rem;
            line-height: 20px;
            display: none;
            vertical-align: middle;
        }

.lt-ie9 .starail-Form-fancyCheckbox input {
    margin-right: 5px;
}

.lt-ie9 .starail-Form-fancyCheckbox span {
    display: none;
}

.lt-ie9 .starail-Form-row--disabled label {
    color: #a3a3a3;
}

/* Form-fancyRadioGroup
   ========================================================================== */
.starail-Form-fancyRadioGroup:not(#ie8) {
    position: relative;
    font-size: 14px;
    font-size: 1rem;
}

    .starail-Form-fancyRadioGroup:not(#ie8) label {
        display: block;
        width: auto;
    }

    .starail-Form-fancyRadioGroup:not(#ie8) input {
        position: relative;
        opacity: 0.0001;
        margin-left: 5px;
    }

        .starail-Form-fancyRadioGroup:not(#ie8) input:checked + span i {
            display: block;
        }

    .starail-Form-fancyRadioGroup:not(#ie8) span {
        position: absolute;
        top: 2px;
        left: 0;
        height: 16px;
        width: 16px;
        border-radius: 8px;
        border: 1px solid #a3a3a3;
        background: #FFF;
        font-size: 14px;
        font-size: 1rem;
    }

        .starail-Form-fancyRadioGroup:not(#ie8) span i {
            position: absolute;
            width: 8px;
            height: 8px;
            background-color: #c9da00;
            border-radius: 4px;
            top: 3px;
            left: 3px;
            display: none;
        }

.lt-ie9 .starail-Form-fancyRadioGroup input {
    margin-right: 5px;
}

.lt-ie9 .starail-Form-fancyRadioGroup span {
    display: none;
}

/* Form-inputGroup
   ========================================================================== */
.starail-Form-inputGroup .starail-Form-input:first-child {
    margin-right: 20px;
    margin-right: 10px;
    margin-right: 0.71429rem;
}

@media only screen and (max-width: 640px) {
    .starail-Form-inputGroup--twoMobile .starail-Form-input {
        max-width: calc(50% - 10px);
    }
}

/* Form-switchRadioGroup
   ========================================================================== */
.starail-Form-switchRadioGroup:not(#ie8) label {
    display: block;
    float: left;
    position: relative;
    margin-right: 1px;
    margin-right: 0.07143rem;
    overflow: hidden;
    width: 120px;
    width: 8.57143rem;
}

    .starail-Form-switchRadioGroup:not(#ie8) label span {
        display: block;
        clear: both;
        float: none;
        margin-right: 0px;
        background-color: #d4d4d4;
        color: #888888;
        text-align: center;
        width: 100%;
        transition: all 0.3s ease-in-out;
        border: 1px solid transparent;
        font-size: 16px;
        font-size: 1.14286rem;
        padding: 0px 10px;
        padding: 0 0.71429rem;
        line-height: 40px;
        line-height: 2.85714rem;
    }

.starail-Form-switchRadioGroup:not(#ie8) input[type="radio"] {
    position: absolute;
    opacity: 0.0001;
    margin-left: 15px;
}

    .starail-Form-switchRadioGroup:not(#ie8) input[type="radio"]:hover + span {
        background-color: #c7c7c7;
    }

    .starail-Form-switchRadioGroup:not(#ie8) input[type="radio"]:checked + span {
        background-color: #0c6ab8;
        color: #FFF;
    }

/* Form-input
   ========================================================================== */
.starail-Form-input--error, .input-validation-error, .starail-Form-input.starail-Form-error {
    background-color: #ffedee;
    border-color: #e6462e !important;
}

.starail-Form-input--readonly {
    border: none;
    background-color: transparent;
    text-align: center;
    text-transform: uppercase;
    font-size: 18px;
    font-size: 1.28571rem;
    line-height: 20px;
    line-height: 1.42857rem;
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    padding: 0;
    color: #555;
}

/* Modifiers
   ========================================================================== */
select.starail-Form-select--narrow { /*sta*/
    width: 70px;
    font-size: 1rem;
}

.custom-sta select.starail-Form-select--narrow { /*sta*/
    width: 96px;
    font-size: 14px;
    font-size: 1rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff url(../img/droparrow.png) no-repeat 76% center;
}
/*sta*/
.custom-sta .starail-Form-select {
    background: #fff url(../img/droparrow.png) no-repeat 88% center;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

select.starail-Form-select--narrow + label {
    margin-left: 7px;
    margin-left: 0.5rem;
}

.starail-Form--paymentConfirmation {
    position: relative;
}

.starail-Form--bookingDetails {
    clear: both;
}

/* Form-note
   ========================================================================== */
.starail-Form-note {
    font-size: 13px;
    font-size: 0.92857rem;
}

.starail-Form-note--block {
    display: block;
    margin-top: 3px;
    margin-top: 0.21429rem;
}

/* Form-error-text
   ========================================================================== */
.starail-Form-errorText, .validation-summary-errors, .field-validation-error, label.starail-Form-error {
    display: block;
    color: red;
    text-align: left;
    margin: 5px 0 0 0;
    margin: 0.35714rem 0 0 0;
}

/* Form-cancel
   ========================================================================== */
.starail-Form-cancel {
    margin: 0 0 0 15px;
    margin: 0 0 0 1.07143rem;
}

@media only screen and (max-width: 639px) {
    .starail-Form-cancel {
        display: block;
        text-align: center;
        padding: 8px 12px;
        padding: 0.57143rem 0.85714rem;
    }
}

/* Form--onBox
   ========================================================================== */
.starail-Form--onBoxNarrow {
    max-width: 740px;
    width: 100%;
    margin: 0px auto;
    padding: 0px 20px;
    padding: 0 1.42857rem;
}

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Form-row > label {
        display: block;
        float: none;
        margin-bottom: 4px;
        margin-bottom: 0.28571rem;
        padding-top: 0px;
        padding-top: 0;
    }

    .starail-Form-row--disabled label {
        opacity: 1;
    }

    .starail-Form--onBoxNarrow {
        padding: 0px;
        padding: 0;
    }

    .starail-Form-switchRadioGroup:not(#ie8) label {
        margin-right: 0px;
        margin-right: 0;
        width: 50%;
    }

        .starail-Form-switchRadioGroup:not(#ie8) label:first-child {
            padding-right: 1px;
            padding-right: 0.07143rem;
        }

        .starail-Form-switchRadioGroup:not(#ie8) label:last-child {
            padding-left: 1px;
            padding-left: 0.07143rem;
        }

    .starail-Form-fancyCheckbox:not(#ie8) input {
        margin-left: 10px;
    }

    .starail-Form-fancyCheckbox:not(#ie8) .starail-Form-fancyCheckbox-trailingMobileText {
        border: none;
        position: relative;
        width: auto;
        height: auto;
        top: auto;
        left: auto;
    }

    .starail-Form-inputContainer--inputGroup > * {
        width: 64%;
    }

        .starail-Form-inputContainer--inputGroup > *.starail-Form-inputContainer--time {
            width: 36%;
        }

    /* --inputGrid - each input container is 50% of row */
    .starail-Form-inputContainer--inputGrid > * {
        width: 100%;
    }

    .starail-Form-inputContainer--inputGrid > div {
        padding: 0px;
        padding: 0;
    }
}

/* passContact Form
   ========================================================================== */
.starail-Form--passContact {
    max-width: 620px;
}

    .starail-Form--passContact .starail-Form-label {
        width: 140px;
    }

    .starail-Form--passContact .starail-Button {
        text-transform: uppercase;
        font-size: 17px;
        font-size: 1.21429rem;
    }

    .starail-Form--passContact .starail-Form-row--checkbox {
        padding-left: 140px;
        padding-left: 10rem;
    }

@media only screen and (max-width: 639px) {
    .starail-Form--passContact .starail-Form-label {
        width: 100%;
    }

    .starail-Form--passContact .starail-Form-row--checkbox {
        padding-left: 0;
    }

    .starail-Form--passContact .starail-Form-button {
        max-width: 100%;
    }

        .starail-Form--passContact .starail-Form-button.starail-Button--blue {
            color: #0073ae;
            font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
            font-weight: 700;
            background-color: #c9da00;
            padding: 8px 10px;
            padding: 0.57143rem 0.71429rem;
            border: 1px solid #bdcd00;
            border-radius: 1px;
            font-size: 17px;
            font-size: 1.21429rem;
            box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3) !important;
        }

            .starail-Form--passContact .starail-Form-button.starail-Button--blue:hover, .starail-Form--passContact .starail-Form-button.starail-Button--blue:focus, .starail-Form--passContact .starail-Form-button.starail-Button--blue.is-active {
                background-color: #bdcd00;
            }
}

/* promoCode Form
   ========================================================================== */
.starail-Form--promoCode .starail-Button {
    margin-left: 20px;
    margin-left: 1.42857rem;
    padding: 12px 12px;
    padding: 0.85714rem 0.85714rem;
}

@media only screen and (max-width: 639px) {
    .starail-Form--promoCode .starail-Button {
        margin: 20px 0 0 0;
        margin: 1.42857rem 0 0 0;
        clear: left;
    }
}

.starail-Form--promoCode .starail-Form--promoCode-note {
    clear: left;
    margin-top: 20px;
    margin-top: 1.42857rem;
    margin-bottom: 0px;
    margin-bottom: 0;
}

.starail-Form--promoCode .starail-Form-row {
    margin: 0 0 0px 0;
    margin: 0 0 0 0;
}

/* 

# Grid

Grid system. See all pages for examples.

*/
/* Component
   ========================================================================== */
.starail-Grid {
    margin: 0 auto;
    padding: 0 15px;
}

/* Responsive - need ie8 fallback
   ========================================================================== */
@media only screen and (min-width: 640px) {
    .starail-Grid {
        width: 100%;
        display: table;
        table-layout: fixed;
    }

    .starail-Grid-col {
        display: table-cell;
        vertical-align: top;
        padding: 0 10px;
    }

    .starail-Grid--leftAligned {
        margin: 0;
    }

    .starail-Grid--nopadding {
        padding: 0;
    }

    .starail-Grid-col--nopadding {
        padding: 0;
    }

    .starail-Grid-col--4of12 {
        width: 33.33333%;
    }

    .starail-Grid-col--8of12 {
        width: 66.66667%;
    }
}

/* Mobile Only
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Grid--mobileFull {
        padding: 0;
    }

        .starail-Grid--mobileFull .starail-Grid-col {
            padding: 0 !important;
        }
}

/* Small
   ========================================================================== */
.starail-Grid--small .starail-Grid-col {
    padding: 0;
}

@media only screen and (min-width: 640px) {
    .starail-Grid--small {
        max-width: 370px;
        padding: 0;
    }
}

/* Medium
   ========================================================================== */
@media only screen and (min-width: 640px) {
    .starail-Grid--medium {
        max-width: 620px;
        padding: 0;
    }
}

/* Large
   ========================================================================== */
@media only screen and (min-width: 640px) {
    .starail-Grid--large {
        max-width: 800px;
        padding: 0;
    }
}

/* 

# Icons

Icons.

# Example

    <i class="starail-Icon-arrow-up"></i>
    <i class="starail-Icon starail-Icon-pluscircle"></i>
    <i class="starail-Icon-shield"></i>
    <i class="starail-Icon starail-Icon-timescircle"></i>
    <i class="starail-Icon starail-Icon-magglass"></i>
    <i class="starail-Icon starail-Icon-reverse"></i>
    <i class="starail-Icon-datepicker"></i>
    <i class="starail-Icon-direction-arrow"></i>
    <i class="starail-Icon-question"></i>
    <i class="starail-Icon-chevron-left"></i>
    <i class="starail-Icon-chevron-right"></i>
    <i class="starail-Icon-changes"></i>
    <i class="starail-Icon-time"></i>
    <i class="starail-Icon-rail"></i>
    <i class="starail-Icon-map-pin"></i>
    <i class="starail-Icon-delete"></i>
    <i class="starail-Icon-phone"></i>
    <i class="starail-Icon-calendar-tick"></i>
    <i class="starail-Icon-email"></i>

*/
/* Component
   ========================================================================== */
@font-face {
    font-family: 'icomoon';
    src: url('../fonts/icomoon.eot?-196dwk');
    src: url('../fonts/icomoon.eot?#iefix-196dwk') format('embedded-opentype'), url('../fonts/icomoon.woff?-196dwk') format('woff'), url('../fonts/icomoon.ttf?-196dwk') format('truetype'), url('../fonts/icomoon.svg?-196dwk#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* Specific
   ========================================================================== */
[class^="starail-Icon-"], [class*=" starail-Icon-"] {
    font-family: 'icomoon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    font-size: 16px;
    vertical-align: middle;
    display: inline-block;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.starail-Icon-googleplus:before {
    content: "\f0d5";
}

.starail-Icon-googleplus--colored {
    color: #e6462e;
}

    .starail-Icon-googleplus--colored:hover {
        color: #b22a15;
    }

.starail-Icon-facebook:before {
    content: "\f09a";
}

.starail-Icon-facebook--colored {
    color: #3c5a99;
}

    .starail-Icon-facebook--colored:hover {
        color: #263a62;
    }

.starail-Icon-instagram:before {
    content: "\f16d";
}

.starail-Icon-twitter:before {
    content: "\f099";
}

.starail-Icon-twitter--colored {
    color: #26aae1;
}

    .starail-Icon-twitter--colored:hover {
        color: #177aa4;
    }

.starail-Icon-email:before {
    content: "\e604";
}

.starail-Icon-email--colored {
    color: #8144b5;
}

    .starail-Icon-email--colored:hover {
        color: #592f7d;
    }

.starail-Icon-password:before {
    content: "\e605";
}

.starail-Icon-username:before {
    content: "\e606";
}

.starail-Icon-pencil:before {
    content: "\f040";
}

.starail-Icon-plus:before {
    content: "\f067";
}

.starail-Icon-minus:before {
    content: "\f068";
}

.starail-Icon-phone:before {
    content: "\f095";
}

.starail-Icon-history:before {
    content: "\e600";
}

.starail-Icon-eye:before {
    content: "\f06e";
}

.starail-Icon-exclamation:before {
    content: "\f06a";
    color: #c9da00;
    font-size: 18px;
    font-size: 1.28571rem;
}

.starail-Icon-tick:before {
    content: "\f00c";
}

.starail-Icon-tag:before {
    content: "\f02b";
}

.starail-Icon-user:before {
    content: "\f007";
}

.starail-Icon-question:before {
    content: "\f059";
}

.starail-Icon-magglass:before {
    content: "\e600";
}

.starail-Icon-pluscircle:before {
    content: "\f055";
}

.starail-Icon-minuscircle:before {
    content: "\f056";
}

.starail-Icon-timescircle:before {
    content: "\f057";
}

.starail-Icon-datepicker:before {
    content: "\f133";
}

.starail-Icon-delete:before {
    content: "\f014";
}

.starail-Icon-reverse:before {
    content: "\e601";
}

.starail-Icon-close:before {
    content: "\f00d";
}

.starail-Icon-chevron-left:before {
    content: "\f053";
}

.starail-Icon-chevron-right:before {
    content: "\f054";
}

.starail-Icon-double-chevron-left:before {
    content: "\f100";
}

.starail-Icon-double-chevron-right:before {
    content: "\f101";
}

.starail-Icon-chevroncircleleft:before {
    content: "\f137";
}

.starail-Icon-chevroncircleright:before {
    content: "\f138";
}

.starail-Icon-direction-arrow:before {
    content: "\e602";
}

.starail-Icon-changes:before {
    content: "\e603";
}

.starail-Icon-rail:before {
    content: "\e607";
}

.starail-Icon-time:before {
    content: "\e608";
}

.starail-Icon-question:before {
    content: "\f059";
}

.starail-Icon--extraSpace {
    margin-left: 5px;
}

.starail-Icon-chevron-down:before {
    content: "\e609";
}

.starail-Icon-chevron-up:before {
    content: "\e60a";
}

.starail-Icon-calendar-tick:before {
    content: "\e60b";
}

.starail-Icon-circle-tick:before {
    content: "\e60c";
}

.starail-Icon-map-pin:before {
    content: "\e60d";
}

.starail-Icon-shield:before {
    content: "\f132";
}

.starail-Icon-ticket:before {
    content: "\e60f";
}

.starail-Icon-receipt:before {
    content: "\e60e";
}

.starail-Icon-arrow-up:before {
    content: "\f062";
}

.starail-Icon-bars:before {
    content: "\f0c9";
}

/* 
# ImageLink

Used on the homepage

## Example

    <div class="starail-u-cf">

        <a class="starail-ImageLink" href="#">

            <div class="starail-Tag starail-Tag--specialOffer">
                <!--Available modifiers are starail-Tag--specialOffer and starail-Tag--bestSeller-->
            </div>

            <img src="http://lorempixel.com/220/220/city">
    
            <div class="starail-ImageLink-titleContainer">
                <p class="starail-ImageLink-title">
                    <span class="highlight">Rail Pass Title</span>
                </p>
            </div>


            <div class="starail-ImageLink-overlay">
                <div class="starail-ImageLink-overlay-content">
                    <p>This is a hover state. Lorem ipsum dolor sit amet stetur adipise.</p>
                    <div class="starail-Button">From £89/pp! <br> Find out more</div>
                </div>
            </div>
        </a>

    </div>
*/
/* Component
   ========================================================================== */
.starail-ImageLink {
    position: relative;
    display: block;
    width: 220px;
    height: 220px;
    float: left;
    margin: 10px;
    margin: 0.71429rem;
}

    .starail-ImageLink .starail-ImageLink-titleContainer {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        display: table;
    }

    .starail-ImageLink .starail-ImageLink-title {
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        font-size: 18px;
        font-size: 18px;
        font-size: 1.28571rem;
        line-height: 29px;
        line-height: 2.07143rem;
        font-weight: 700;
        text-align: center;
        text-transform: uppercase;
        opacity: 0.9;
        transition: all 0.3s ease-in-out;
        margin: 0px;
        margin: 0;
        padding: 0px 20px;
        padding: 0 1.42857rem;
        display: table-cell;
        vertical-align: middle;
        width: 100%;
    }

        .starail-ImageLink .starail-ImageLink-title .highlight { /*sta*/
            /*display: inline;
                background: #fff;
                color: #444;
                padding: .15625em;
                padding-left: 0;
                padding-right: 0;
                -webkit-box-decoration-break: clone;
                -ms-box-decoration-break: clone;
                box-decoration-break: clone;
                box-shadow: .5em 0 0 #fff,-.5em 0 0 #fff;*/
            display: block;
            background: #1d365e;
            color: #fff;
            padding: 10px;
            font-size: 14px;
            font-weight: normal;
            line-height: 22px;
        }

    .starail-ImageLink .starail-ImageLink-overlay { /*sta*/
        position: absolute;
        top: 0;
        left: 0;
        background-color: #000;
        background-color: rgba(0,0,0,0.65);
        display: table;
        opacity: 0;
        color: #FFF;
        text-align: center;
        width: 100%;
        height: 100%;
        padding: 0 25px;
        padding: 0 1.78571rem;
        transition: all .3s ease-in-out;
    }

    .starail-ImageLink.sta-bs .starail-ImageLink-overlay { /*sta*/
        background: url(../img/tags/best-seller-sta.png) no-repeat 88% 12px;
    }

    .starail-ImageLink.sta-so .starail-ImageLink-overlay { /*sta*/
        background: url(../img/tags/special-offer-sta.png) no-repeat 88% 12px;
    }


    .starail-ImageLink .starail-ImageLink-overlay-content {
        display: table-cell;
        vertical-align: middle;
        height: 100%;
        padding: 10px 0;
        padding: 3.71429rem 0; /*sta*/
    }

        .starail-ImageLink .starail-ImageLink-overlay-content p { /*sta*/
            display: block;
            background: #1d365e;
            color: #fff;
            padding: 10px;
            font-size: 14px;
            font-weight: normal;
            line-height: 22px;
        }

        .starail-ImageLink .starail-ImageLink-overlay-content .starail-Button {
            width: 100%;
        }

    .starail-ImageLink:hover .starail-ImageLink-overlay {
        opacity: 1;
    }

    .starail-ImageLink:hover .starail-ImageLink-title {
        opacity: 0;
    }

@media only screen and (min-width: 640px) {
    .starail-ImageLink:hover .starail-Tag {
        opacity: 0;
    }
}

@media only screen and (min-width: 640px) and (max-width: 1040px) {
    .starail-ImageLink {
        margin: 8px;
        margin: 0.57143rem;
    }

        .starail-ImageLink:nth-child(4n-2) {
            margin-left: 0px;
            margin-left: 0;
        }

        .starail-ImageLink:nth-child(4n+1) {
            margin-right: 0px;
            margin-right: 0;
        }
}

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-ImageLink {
        width: 50%;
        height: 100%;
        margin: 0px;
    }

        .starail-ImageLink img {
            width: 100%;
            display: block;
            height: auto;
        }

        .starail-ImageLink:nth-child(2n) img {
            padding: 1px 1px 1px 0px;
            padding: 0.07143rem 0.07143rem 0.07143rem 0;
        }

        .starail-ImageLink:nth-child(2n+1) img {
            padding: 1px 0px 1px 1px;
            padding: 0.07143rem 0 0.07143rem 0.07143rem;
        }

        .starail-ImageLink .starail-ImageLink-overlay {
            display: none;
        }

        .starail-ImageLink:hover .starail-ImageLink-title {
            opacity: 1;
        }

        .starail-ImageLink .starail-ImageLink-titleContainer {
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }
}

/* Mobile
   ========================================================================== */
.lt-ie9 .starail-ImageLink-overlay {
    display: none;
}

.lt-ie9 .starail-ImageLink:hover .starail-ImageLink-overlay {
    display: block;
    background: url('../img/ie/black-65.png') 0 0 repeat;
}

.lt-ie9 .starail-ImageLink:hover .starail-ImageLink-title {
    display: none;
}

.lt-ie9 .starail-ImageLink:hover .starail-Tag {
    display: none;
}

.lt-ie9 .highlight {
    display: block !important;
    line-height: 1.2em;
}

/* ==========================================================================
   Header
   ========================================================================== */
/* Component
   ========================================================================== */
.starail-Header {
    margin: 20px 0px 0px 0px;
    margin: 1.42857rem 0 0 0;
}

.starail-Header-topRow {
    margin: 0px 0px 15px 0px;
    margin: 0 0 1.07143rem 0;
}

.starail-Header-logo {
    float: left;
}

.starail-Header-tagline {
    float: left;
    padding: 15px 25px;
    padding: 1.07143rem 1.78571rem;
}

.starail-Header-contact {
    float: right;
    width: 330px;
    text-align: right;
}

.starail-Header-contact-title {
    text-transform: uppercase;
    font-size: 14px;
    font-size: 1rem;
    font-family: Tahoma, Verdana, Segoe, sans-serif;
    font-weight: bold;
    margin: 0px 0px 2px;
    margin: 0 0 0.14286rem;
}

.starail-Header-contact-phone {
    color: #fd3800;
    font-size: 25px;
    font-size: 1.78571rem;
    line-height: 1.2;
    font-family: 'Trebuchet MS', tahoma, arial, sans-serif;
    margin: 0px 0px 5px;
    margin: 0 0 0.35714rem;
}

.starail-Header-contact-disclaimer {
    font-size: 11px;
    font-size: 0.78571rem;
    line-height: 1.3;
    color: #b6b6b6;
    margin: 0px;
    margin: 0;
}

.starail-Header-mobile {
    padding: 0px 50px;
    padding: 0 3.57143rem;
    height: 43px;
    height: 3.07143rem;
    line-height: 40px;
    line-height: 2.85714rem;
    position: relative;
    z-index: 2;
    background-color: #edeff1;
}

    .starail-Header-mobile a.starail-Header-mobileMenu {
        display: block;
        position: absolute;
        top: 0;
        left: 10px;
        width: 35px;
        text-align: center;
        height: 43px;
        color: #444;
    }

        .starail-Header-mobile a.starail-Header-mobileMenu i {
            font-size: 24px;
            font-size: 1.71429rem;
            line-height: 43px;
            line-height: 3.07143rem;
        }

        .starail-Header-mobile a.starail-Header-mobileMenu:hover, .starail-Header-mobile a.starail-Header-mobileMenu:active, .starail-Header-mobile a.starail-Header-mobileMenu:focus, .starail-Header-mobile a.starail-Header-mobileMenu:visited {
            color: #444;
        }

.starail-Header-mobileLogo {
    position: absolute;
    left: 52px;
    display: block;
    height: 43px;
    padding-top: 4px;
    padding-top: 0.28571rem;
}

    .starail-Header-mobileLogo img {
        height: 36px;
        width: auto;
    }

/* Modifiers
   ========================================================================== */
/* Mobile
   ========================================================================== */
/* 

# HomeHero

The banner on the homepage.

# Example

    <div style="max-width: 960px;margin: 0 auto;"><!-- Only for style guide -->

        <div class="starail-Section starail-HomeHero starail-Section--nopadding">
            <img class="starail-HomeHero-img" src="http://lorempixel.com/960/300/nature" alt="Home hero" />

            <div class="starail-HomeHero-search">
                <h2 class="starail-HomeHero-title">Where do you want to go?</h2>

                <form class="starail-HomeHero-form" action="#" name="search" method="get" target="_top" id="search">
                    <input class="starail-Form-input starail-HomeHero-formInput" type="text" name="search" id="search" placeholder="Enter a continent or country" value="" />
                    <button class="starail-Button starail-HomeHero-formSubmit" type="submit">
                        <i class="starail-Icon starail-Icon-magglass"></i>
                        <span class="starail-u-visuallyHidden">Go</span>
                    </button>
                </form>

                <p class="starail-HomeHero-allLink"><a href="#">See all <span class="starail-u-hideMobile"> the</span> Countries<span class="starail-u-hideMobile"> you could explore</span></a></p>
            </div>


        </div>

    </div>

*/
/* Component
   ========================================================================== */
.starail-HomeHero {
    overflow: hidden;
}

.starail-HomeHero, .starail-HomeHero-img {
    position: relative;
    display: block;
    height: 300px;
}

.starail-HomeHero-search {
    position: absolute;
    bottom: 80px;
    width: 100%;
    padding: 0px 20px;
    padding: 0 1.42857rem;
}

    .starail-HomeHero-search .starail-HomeHero-title, .starail-HomeHero-search .starail-HomeHero-form {
        position: relative;
        width: 100%;
        max-width: 460px;
        margin: 0px auto;
        margin: 0 auto;
    }

    .starail-HomeHero-search h2.starail-HomeHero-title {
        color: #FFF;
        font-size: 30px;
        font-size: 2.14286rem;
        margin-bottom: 15px;
        margin-bottom: 1.07143rem;
        text-align: center;
        text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.65);
        text-shadow: 0 0 10px 10px rgba(0, 0, 0, 0.65);
    }

    .starail-HomeHero-search .starail-HomeHero-allLink {
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        font-size: 17px;
        font-size: 1.21429rem;
        margin: 15px 0px 0px;
        margin: 1.07143rem 0 0;
        text-align: center;
        text-transform: uppercase;
        font-weight: 700;
    }

        .starail-HomeHero-search .starail-HomeHero-allLink a {
            color: #FFF;
            text-decoration: underline;
            text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.65);
            text-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.65);
        }

.starail-HomeHero-formInput {
    border: none;
    outline: none;
    border-radius: 0;
    height: 40px;
    line-height: 40px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.starail-HomeHero-formSubmit {
    position: absolute;
    right: 0px;
    top: 0px;
    height: 40px;
    box-shadow: none;
    border-radius: 0;
    line-height: 22px;
}

    .starail-HomeHero-formSubmit i {
        margin-top: -2px;
        margin-top: -0.14286rem;
    }

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-HomeHero {
        height: 190px;
    }

    img.starail-HomeHero-img {
        width: auto;
        height: 190px;
        max-width: none;
        min-height: 100%;
        min-width: 100%;
    }

    .starail-HomeHero-search {
        bottom: 30px;
    }

        .starail-HomeHero-search h2.starail-HomeHero-title {
            font-size: 24px;
            font-size: 1.71429rem;
            padding: 0px 30px;
            padding: 0 2.14286rem;
        }
}

/* 

# JourneyBlock

Used on the train options page for display journey types

 */
/* Component
   ========================================================================== */
.starail-JourneyBlock {
    margin: 0px 0px 20px 0px;
    margin: 0 0 1.42857rem 0;
    background-color: #edeff1;
    position: relative;
}

.starail-JourneyBlock-content {
    background-color: #FFF;
    padding: 15px;
    padding: 1.07143rem;
    margin: 0px 15px;
    margin: 0 1.07143rem;
    overflow: hidden;
}

.starail-JourneyBlock-class {
    width: 50%;
    padding-right: 10px;
    display: block;
    position: relative;
    float: left;
    margin-top: 20px;
    margin-top: 1.42857rem;
}

    .starail-JourneyBlock-class:nth-child(1), .starail-JourneyBlock-class:nth-child(2) {
        margin-top: 0px;
        margin-top: 0;
    }

    .starail-JourneyBlock-class:nth-child(2n-1) {
        clear: both;
    }

    .starail-JourneyBlock-class > p {
        font-weight: bold;
        margin-bottom: 10px;
        margin-bottom: 0.71429rem;
    }

.starail-JourneyBlock-radioRow {
    position: relative;
    clear: both;
    margin-bottom: 10px;
    margin-bottom: 0.71429rem;
}

    /*.starail-JourneyBlock-radioRow > a {
        float: right;
    }*/

.starail-JourneyBlock-journeyDetails {
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: #edeff1;
    padding-top: 15px;
    padding-top: 1.07143rem;
    padding-bottom: 75px;
    padding-bottom: 5.35714rem;
    height: 100%;
    z-index: 50;
    width: 100%;
    display: none;
}

    .starail-JourneyBlock-journeyDetails .starail-JourneyBlock-content {
        height: 100%;
        overflow: auto;
    }

.starail-JourneyBlock-journeyDetails-row {
    position: relative;
    clear: both;
    font-size: 14px;
    font-size: 1rem;
    padding: 15px 0px;
    padding: 1.07143rem 0;
    overflow: hidden;
    border-bottom: 1px solid #d4d4d4;
}

    .starail-JourneyBlock-journeyDetails-row:first-child {
        padding: 0px 0px 15px 0px;
        padding: 0 0 1.07143rem 0;
    }

    .starail-JourneyBlock-journeyDetails-row:last-child {
        border-bottom: none;
        padding: 15px 0px 0px 0px;
        padding: 1.07143rem 0 0 0;
    }

    .starail-JourneyBlock-journeyDetails-row > div {
        float: left;
        padding-right: 15px;
        padding-right: 1.07143rem;
    }

    .starail-JourneyBlock-journeyDetails-row p {
        margin: 0px;
        margin: 0;
    }

    .starail-JourneyBlock-journeyDetails-row .starail-JourneyBlock-journeyDetails-title {
        font-weight: bold;
    }

    .starail-JourneyBlock-journeyDetails-row .starail-JourneyBlock-journeyDetails-provider {
        width: 28%;
    }

    .starail-JourneyBlock-journeyDetails-row .starail-JourneyBlock-journeyDetails-details {
        width: 36%;
    }

.starail-JourneyBlock-footer {
    position: relative;
    z-index: 100;
    height: 75px;
    padding: 15px;
    padding: 1.07143rem;
    overflow: hidden;
}

.starail-JourneyBlock-button {
    float: right;
}

.starail-JourneyBlock-less-trigger, .starail-JourneyBlock-more-trigger {
    line-height: 45px;
    font-weight: bold;
}

.starail-JourneyBlock-less-trigger {
    display: none;
}

/* Modifier 
   ========================================================================== */
.starail-JourneyBlock--show .starail-JourneyBlock-journeyDetails {
    display: block;
}

.starail-JourneyBlock--show .starail-JourneyBlock-less-trigger {
    display: inline;
}

.starail-JourneyBlock--show .starail-JourneyBlock-more-trigger {
    display: none !important;
}

/* Mobile up / Desktop
   ========================================================================== */
@media only screen and (min-width: 640px) {
    .starail-JourneyBlock-header {
        padding: 15px;
        padding: 1.07143rem;
        clear: both;
        float: none;
        overflow: hidden;
    }

        .starail-JourneyBlock-header .starail-JourneyBlock-summary {
            font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
            text-transform: uppercase;
            float: left;
            width: 60%;
            line-height: 1;
            position: relative;
        }

            .starail-JourneyBlock-header .starail-JourneyBlock-summary .starail-DestinationIcon {
                position: absolute;
                top: 11px;
                left: 0px;
                height: 36px;
                z-index: 40;
            }

                .starail-JourneyBlock-header .starail-JourneyBlock-summary .starail-DestinationIcon .starail-DestinationIcon-line {
                    border-left: 1px dashed #FFF;
                    border-right: 1px dashed #FFF;
                    height: 100%;
                }

        .starail-JourneyBlock-header .starail-JourneyBlock-summaryRow, .starail-JourneyBlock-header .starail-JourneyBlock-infoRow {
            margin: 0px 0px 5px 20px;
            margin: 0 0 0.35714rem 1.42857rem;
            min-height: 25px;
        }

            .starail-JourneyBlock-header .starail-JourneyBlock-summaryRow *, .starail-JourneyBlock-header .starail-JourneyBlock-infoRow * {
                vertical-align: bottom;
            }

        .starail-JourneyBlock-header .starail-JourneyBlock-info {
            float: left;
            width: 40%;
        }

        .starail-JourneyBlock-header .starail-JourneyBlock-infoRow i {
            font-size: 14px;
            font-size: 1rem;
            color: #888888;
            text-align: center;
            width: 17px;
            width: 1.21429rem;
        }

        .starail-JourneyBlock-header .starail-JourneyBlock-infoRow .starail-infoRow-time {
            margin-right: 10px;
            margin-right: 0.71429rem;
        }

        .starail-JourneyBlock-header .starail-JourneyBlock-infoRow span {
            line-height: 1;
            font-weight: 700;
            font-size: 14px;
            font-size: 1rem;
        }

        .starail-JourneyBlock-header .starail-JourneyBlock-title {
            display: inline-block;
            font-size: 21px;
            font-size: 1.5rem;
            margin: 0px 10px 0px 0px;
            margin: 0 0.71429rem 0 0;
            width: 100px;
            line-height: 1 !important;
            font-weight: 400;
        }

        .starail-JourneyBlock-header .starail-JourneyBlock-details {
            display: inline-block;
            margin: 0px;
            margin: 0;
        }

        .starail-JourneyBlock-header .starail-JourneyBlock-time {
            font-size: 21px;
            font-size: 1.5rem;
            font-weight: 700;
        }

        .starail-JourneyBlock-header .starail-JourneyBlock-divide {
            font-weight: normal;
            color: #FFF;
            font-size: 17px;
            font-size: 1.21429rem;
            margin: 0px 10px;
            margin: 0 0.71429rem;
        }

        .starail-JourneyBlock-header .starail-JourneyBlock-divide {
            font-size: 17px;
            font-size: 1.21429rem;
            line-height: 25px;
            line-height: 1.78571rem;
            font-weight: normal;
        }

    .starail-JourneyBlock-mobileTickets, .starail-JourneyBlock-mobileFooter {
        display: none;
    }
}

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-JourneyBlock {
        box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
        border: 1px solid #edeff1;
        background-color: #FFF;
    }

    .starail-JourneyBlock-confirm-trigger {
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        text-transform: uppercase;
        font-size: 17px;
        font-size: 1.21429rem;
        padding: 8px;
        padding: 0.57143rem;
        margin-top: 10px;
        margin-top: 0.71429rem;
    }

    .starail-JourneyBlock-footer {
        padding: 0px 10px 10px 10px;
        padding: 0 0.71429rem 0.71429rem 0.71429rem;
        height: auto;
    }

    .starail-JourneyBlock-mobile-title {
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        font-weight: 700;
        text-transform: uppercase;
        font-size: 17px;
        font-size: 1.21429rem;
        margin: 0px;
        margin: 0;
        padding: 10px;
        padding: 0.71429rem;
    }

    .starail-JourneyBlock-summary {
        background-color: #edeff1;
        padding: 2px 10px;
        padding: 0.14286rem 0.71429rem;
        overflow: hidden;
    }

    .starail-JourneyBlock-summaryRow {
        float: left;
        width: 50%;
        border-top: 1px solid #FFF;
        padding: 10px 0px;
        padding: 0.71429rem 0;
    }

        .starail-JourneyBlock-summaryRow:nth-of-type(2), .starail-JourneyBlock-summaryRow:nth-of-type(3) {
            border-top: 0px solid #FFF;
        }

        .starail-JourneyBlock-summaryRow:nth-last-child(1), .starail-JourneyBlock-summaryRow:nth-last-child(2) {
            padding-bottom: 0px;
        }

        .starail-JourneyBlock-summaryRow .starail-JourneyBlock-title {
            display: inline;
            margin-right: 10px;
            margin: 0px 5px 0px 0px;
            margin: 0 0.35714rem 0 0;
        }

        .starail-JourneyBlock-summaryRow .starail-JourneyBlock-details {
            display: inline;
        }

        .starail-JourneyBlock-summaryRow .starail-JourneyBlock-time {
            font-weight: 700;
            display: inline;
        }

    .starail-JourneyBlock-info {
        background-color: #edeff1;
        padding: 10px;
        padding: 0.71429rem;
        overflow: hidden;
    }

        .starail-JourneyBlock-info i {
            display: none;
        }

    .starail-JourneyBlock-header .starail-DestinationIcon {
        display: none;
    }

    .starail-JourneyBlock-journeyDetails {
        position: relative;
        background-color: #edeff1;
        padding: 12px 0px 0px 0px;
        padding: 0.85714rem 0 0 0;
        height: auto;
        width: 100%;
    }

        .starail-JourneyBlock-journeyDetails .starail-JourneyBlock-content {
            height: auto;
            overflow: auto;
            background-color: transparent;
            border-bottom: 1px solid #FFF;
            padding: 0px 0px 10px 0px;
            padding: 0 0 0.71429rem 0;
            margin: 0px 10px;
            margin: 0 0.71429rem;
        }

    .starail-JourneyBlock-journeyDetails-row {
        border: none;
        padding: 0px 0px 5px 0px;
        padding: 0 0 0.35714rem 0;
    }

        .starail-JourneyBlock-journeyDetails-row:last-child {
            padding: 0px;
            padding: 0;
        }

        .starail-JourneyBlock-journeyDetails-row:first-child {
            padding: 0px 0px 5px 0px;
            padding: 0 0 0.35714rem 0;
        }

        .starail-JourneyBlock-journeyDetails-row .starail-JourneyBlock-journeyDetails-title {
            width: 29%;
        }

        .starail-JourneyBlock-journeyDetails-row .starail-JourneyBlock-journeyDetails-details {
            width: 35%;
        }

            .starail-JourneyBlock-journeyDetails-row .starail-JourneyBlock-journeyDetails-details span {
                display: block;
            }

    .starail-JourneyBlock-mobileTriggers {
        background-color: #edeff1;
        text-align: center;
        padding: 7px 10px;
        padding: 0.5rem 0.71429rem;
        line-height: 25px;
        line-height: 1.78571rem;
    }

        .starail-JourneyBlock-mobileTriggers .starail-JourneyBlock-less-trigger, .starail-JourneyBlock-mobileTriggers .starail-JourneyBlock-more-trigger {
            line-height: 25px;
            line-height: 1.78571rem;
            width: 100%;
        }

        .starail-JourneyBlock-mobileTriggers .starail-JourneyBlock-more-trigger {
            border-top: 1px solid #FFF;
            display: block;
            padding-top: 5px;
        }

    .starail-JourneyBlock-mobileTickets {
        padding: 10px;
        padding: 0.71429rem;
    }

    .starail-JourneyBlock-select {
        font-size: 14px;
        font-size: 1rem;
    }

    .starail-JourneyBlock-mobileFooter .starail-JourneyBlock-mobileFooter-btns {
        width: 50%;
        float: left;
        padding: 0px 5px 0px 0px;
        padding: 0 0.35714rem 0 0;
    }

        .starail-JourneyBlock-mobileFooter .starail-JourneyBlock-mobileFooter-btns:last-child {
            padding: 0px 0px 0px 5px;
            padding: 0 0 0 0.35714rem;
        }

        .starail-JourneyBlock-mobileFooter .starail-JourneyBlock-mobileFooter-btns .starail-Button {
            width: 100%;
            border-radius: 0px;
            box-shadow: none;
        }

    .starail-JourneyBlock-mobileFooter .starail-undoTicket-trigger {
        border: 2px solid #0c6ab8;
        background-color: #FFF;
        color: #0c6ab8;
        padding: 7px 10px 7px 10px;
        padding: 0.5rem 0.71429rem 0.5rem 0.71429rem;
    }

        .starail-JourneyBlock-mobileFooter .starail-undoTicket-trigger:active, .starail-JourneyBlock-mobileFooter .starail-undoTicket-trigger:visited {
            color: #0c6ab8;
        }

    .starail-JourneyBlock-footer-ticketSelection {
        font-weight: 700;
        margin-top: 10px;
        margin-top: 0.71429rem;
    }

        .starail-JourneyBlock-footer-ticketSelection a i {
            margin: -4px 0px 0px 5px;
            margin: -0.28571rem 0 0 0.35714rem;
        }

    .starail-JourneyBlock--show .starail-JourneyBlock-summary {
        display: none;
    }
}

/* no-js
   ========================================================================== */
.no-js .starail-JourneyBlock-journeyDetails {
    display: block;
}

.no-js .starail-JourneyBlock-more-trigger {
    display: none;
}

/*

# Lightbox

## Modifiers

.is-open - displays the lightbox

## Example

    <div class="starail-Lightbox" id="starail-ticket-info">

        <div class="starail-Lightbox-content">

            <div class="starail-Lightbox-closeContainer">
                <a href="#" class="starail-Lightbox-close js-lightboxClose"><i class="starail-Icon starail-Icon-close"></i></a>
            </div>


            <div class="starail-Lightbox-content-inner" >
            
                <div class="starail-Lightbox-text" >
                    <h3 class="starail-Lightbox-textTitle">Ticket Info</h3>

                    <h4>Availability</h4>
                    <p>Yes</p>

                    <h4>Class &amp; seats</h4>
                    <p>Class AW, Seat 1-10</p>

                    <h4>Spring Promo</h4>
                    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
                    <p>Sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
                    <p>Sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>

                </div>

            </div>

        </div>

    </div>

*/
/* Component
   ========================================================================== */
.starail-Lightbox {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0.85);
    padding: 20px;
    box-sizing: border-box;
    display: none;
    overflow: scroll;
}

    .starail-Lightbox * {
        box-sizing: border-box;
    }

    .starail-Lightbox.is-open {
        display: table;
        height: 100%;
    }

.starail-Lightbox-content {
    margin: 0px auto;
    position: relative;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
}

.starail-Lightbox-content-inner {
    padding: 0px 30px;
    padding: 0 2.14286rem;
    max-height: 100%;
    max-width: 480px;
    margin: 0px auto;
    background-color: #FFF;
    overflow: auto;
    border-top: 30px solid #FFF;
    border-bottom: 30px solid #FFF;
}

.starail-Lightbox-text {
    font-size: 14px;
    font-size: 1rem;
}

    .starail-Lightbox-text h1, .starail-Lightbox-text h2, .starail-Lightbox-text h3, .starail-Lightbox-text h4 {
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        font-weight: 700;
        text-transform: uppercase;
        margin: 0px 0px 5px;
        margin: 0 0 0.35714rem;
    }

    .starail-Lightbox-text h4 {
        font-size: 17px;
        font-size: 1.21429rem;
    }

    .starail-Lightbox-text .starail-Lightbox-textTitle {
        padding-bottom: 15px;
        padding-bottom: 1.07143rem;
        font-size: 21px;
        font-size: 1.5rem;
        border-bottom: 1px solid #edeff1;
        margin: 0px 0px 20px;
        margin: 0 0 1.42857rem;
    }

.starail-Lightbox-closeContainer {
    position: relative;
    width: 100%;
    max-width: 480px;
    margin: 0px auto;
}

.starail-Lightbox-close {
    position: absolute;
    top: -11.2px;
    right: -11.2px;
    width: 32px;
    height: 32px;
    border-radius: 16px;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.15);
    display: block;
    color: #FFF;
    text-decoration: none;
    background-color: #0c6ab8;
    text-align: center;
    transition: background-color 0.3s ease-in-out;
}

    .starail-Lightbox-close i {
        font-size: 18px;
        font-size: 1.28571rem;
        line-height: 32px;
        line-height: 2.28571rem;
    }

    .starail-Lightbox-close:hover, .starail-Lightbox-close:focus, .starail-Lightbox-close:visited {
        color: #FFF;
        text-decoration: none;
    }

    .starail-Lightbox-close:focus {
        border: none;
        outline: none;
    }

    .starail-Lightbox-close:hover {
        background-color: #0a5ca0;
    }

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    html.is-LightboxActive {
        overflow: hidden !important;
        height: 100%;
        width: 100%;
    }

        html.is-LightboxActive body {
            overflow: hidden !important;
            height: 100%;
            width: 100%;
        }

    .starail-Lightbox {
        position: absolute;
    }

        .starail-Lightbox.is-open {
            display: block;
            height: 100%;
        }

    .starail-Lightbox-content {
        display: block;
    }
}

/* IE
   ========================================================================== */
.lt-ie9 .starail-Lightbox {
    background: url('../img/ie/black-65.png') 0 0 repeat;
}

.lt-ie9 .starail-Lightbox-content {
    height: 75%;
}

.lt-ie9 .starail-Lightbox-closeContainer {
    padding: 0px 30px;
}

/* ==========================================================================
   Login
   ========================================================================== */
/* Component
   ========================================================================== */
.starail-Login {
    background-color: #FFF;
    background-color: rgba(255, 255, 255, 0.9);
    margin-bottom: 90px;
    margin-bottom: 6.42857rem;
    padding: 20px 25px;
    padding: 1.42857rem 1.78571rem;
}

    .starail-Login .starail-Box-title {
        text-align: center;
    }

    .starail-Login .starail-Form-row {
        margin-bottom: 8px;
        margin-bottom: 0.57143rem;
    }

.starail-Login-wrapper {
    width: 100%;
    max-width: 380px;
    margin: 0px auto;
    margin: 0 auto;
    padding: 0px 10px;
    padding: 0 0.71429rem;
}

.starail-Wrapper h2.starail-Login-title {
    text-align: center;
    margin: 0px auto;
    margin: 0px auto 15px auto;
    margin: 0 auto 1.07143rem auto;
    width: 100%;
    max-width: 210px;
    font-size: 21px;
    font-size: 1.5rem;
    line-height: 25px;
    line-height: 1.78571rem;
}

    .starail-Wrapper h2.starail-Login-title.starail-Login-title--wide {
        max-width: 100%;
    }

.starail-Login-content {
    text-align: center;
    margin-bottom: 5px;
    margin-bottom: 0.35714rem;
}

    .starail-Login-content:last-child {
        margin-bottom: 15px;
        margin-bottom: 1.07143rem;
    }

.starail-Login-email {
    word-break: break-all;
    display: block;
    font-family: Tahoma, Verdana, Segoe, sans-serif;
    text-transform: none;
    margin-top: 15px;
    margin-top: 1.07143rem;
    font-size: 16px;
    font-size: 1.14286rem;
}

.starail-Login-forgottenPw {
    text-align: center;
    margin-bottom: 13px;
    margin-bottom: 0.92857rem;
}

    .starail-Login-forgottenPw a {
        font-size: 13px;
        font-size: 0.92857rem;
    }

.starail-Login-rememberedPw {
    text-align: center;
    margin-bottom: 0px;
    margin-bottom: 0;
}

    .starail-Login-rememberedPw a {
        font-size: 13px;
        font-size: 0.92857rem;
    }

.starail-Login-forgottenBtn {
    margin-top: 15px;
    margin-top: 1.07143rem;
}

.starail-Login-remember {
    text-align: center;
}

    .starail-Login-remember .starail-Form-fancyCheckbox:not(#ie8) {
        padding-left: 27px;
        padding-left: 1.92857rem;
        line-height: 17px;
        line-height: 1.21429rem;
    }

        .starail-Login-remember .starail-Form-fancyCheckbox:not(#ie8) span {
            height: 17px;
            width: 17px;
        }

            .starail-Login-remember .starail-Form-fancyCheckbox:not(#ie8) span i {
                line-height: 17px;
                left: 2px;
                font-size: 11px;
                font-size: 0.78571rem;
            }

.starail-Login-logo {
    display: block;
    position: relative;
    text-align: center;
    margin: 25px 0 15px 0;
    margin-bottom: 1.07143rem;
}

    .starail-Login-logo a {
        position: relative;
        display: inline-block;
        margin: 0px auto;
        margin: 0 auto;
    }

    .starail-Login-logo img {
        width: 150px;
        height: auto;
        display: block;
    }

.starail-LoginPage {
    background-color: #edeff1;
}

    .starail-LoginPage .starail-Full-wrap {
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        height: auto;
        min-height: 100%;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .starail-LoginPage .starail-Page-wrap {
        background-color: transparent;
    }

/* no flexbox
   ========================================================================== */
/* Desktop
   ========================================================================== */
@media only screen and (min-width: 640px) {
    .starail-LoginPage .starail-Footer {
        height: 1px;
        line-height: 0px;
        display: block;
        overflow: visible;
        position: relative;
        top: -1px;
        background-color: #edeff1 !important;
    }

    .starail-LoginPage .starail-Footer-outerWrap {
        position: absolute;
        bottom: 0px;
        display: block;
        left: 0px;
        width: 100%;
    }

    .lt-ie10 .starail-LoginPage .starail-Full-wrap {
        height: auto;
        min-height: 100%;
        display: table;
    }

    .lt-ie10 .starail-LoginPage .starail-Page-wrap {
        display: table-cell;
        vertical-align: middle;
    }

    .lt-ie10 .starail-LoginPage .starail-Wrapper {
        margin: 0px !important;
    }

    .lt-ie9 .starail-LoginPage .starail-Full-wrap {
        background-position: top center;
    }
}

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Login {
        padding: 20px;
        padding: 1.42857rem;
        margin-bottom: 30px;
        margin-bottom: 2.14286rem;
    }

    .starail-LoginPage .starail-Full-wrap {
        height: auto;
        min-height: 10px;
        display: block;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        background-position: 70% top;
    }

    .starail-LoginPage .starail-Page-wrap {
        background-color: transparent;
    }

    .starail-LoginPage .starail-Login-wrapper {
        margin-top: 25px;
        margin-top: 1.78571rem;
    }
}

/**/
.lt-ie9 .starail-Login-logo a {
    display: block;
    width: 200px;
}

.lt-ie9 .starail-Login-logo img {
    margin: 0px auto;
}

/* ==========================================================================
   Nav
   ========================================================================== */
.starail-Nav {
    border: 1px solid #d7d7d7;
    font-size: 13px;
    font-size: 0.92857rem;
    padding: 0px;
    padding: 0;
    margin: 0px;
    margin: 0;
}

    .starail-Nav li {
        list-style-type: none;
        display: list-item;
        text-align: left;
        width: auto;
        float: left;
        padding: 0px;
        padding: 0;
        margin: 0px;
        margin: 0;
    }

        .starail-Nav li div, .starail-Nav li a {
            text-transform: uppercase;
            padding: 2px 7px;
            padding: 0.14286rem 0.5rem;
            border-right: 1px solid #d7d7d7;
            display: block;
            text-align: center;
            width: auto;
            color: #444;
            line-height: 24px;
            line-height: 1.71429rem;
            font-size: 13px;
            font-size: 0.92857rem;
        }

            .starail-Nav li a:hover, .starail-Nav li a:visited, .starail-Nav li a:active, .starail-Nav li a:focus {
                color: #444;
                background-color: #d7d7d7;
            }

        .starail-Nav li.starail-Nav-right {
            float: right;
        }

            .starail-Nav li.starail-Nav-right a, .starail-Nav li.starail-Nav-right div {
                border-left: 1px solid #d7d7d7;
                border-right: 0px;
            }

/* Mobile Nav */
.starail-Nav-mobile {
    background-color: #FFF;
    width: 80%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
    overflow: auto;
}

    .starail-Nav-mobile .starail-Nav {
        border: none;
        position: relative;
    }

        .starail-Nav-mobile .starail-Nav li {
            display: block;
            float: none;
            border-bottom: 1px solid #d7d7d7;
        }

            .starail-Nav-mobile .starail-Nav li a, .starail-Nav-mobile .starail-Nav li div {
                text-align: left;
                border: none;
                padding: 10px 20px;
                padding: 0.71429rem 1.42857rem;
                font-size: 14px;
                font-size: 1rem;
            }

            .starail-Nav-mobile .starail-Nav li.starail-Nav-pinToBottom {
                position: absolute;
                top: 100%;
                width: 100%;
            }

    .starail-Nav-mobile .starail-Header-contact-title {
        margin: 3px 0px -2px 0px;
        margin: 0.21429rem 0 -0.14286rem 0;
    }

    .starail-Nav-mobile h2.starail-Header-contact-phone {
        font-size: 21px;
        font-size: 1.5rem;
        margin-bottom: 0px;
        margin-bottom: 0;
    }

.starail-Nav-mobileClose {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 200;
    display: none !important;
}

.starail-Outer-wrap {
    position: relative;
    z-index: 2;
    height: 100%;
    /***progress not working if enable**/
    /* -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
      transform: translateX(0);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  transition: 300ms ease all;*/
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

html.opening-nav {
    overflow: hidden;
}

    html.opening-nav .starail-Nav-mobile {
        display: block !important;
    }

    html.opening-nav .starail-Nav-mobileClose {
        display: block !important;
    }

    html.opening-nav .starail-Outer-wrap {
        top: 0px;
        height: 100%;
        overflow: hidden;
        -webkit-transform: translateX(80%);
        -ms-transform: translateX(80%);
        transform: translateX(80%);
        -webkit-transform: translate3d(80%, 0, 0);
        transform: translate3d(80%, 0, 0);
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    }

body.opened-nav {
    overflow: hidden;
    width: 100%;
    height: 100%;
}

/* Component
   ========================================================================== */
/*

# OrderInfo

Your booking styles.

*/
/* Component
   ========================================================================== */
.starail-OrderInfo {
    background-color: #edeff1;
    padding: 30px 30px 20px 30px;
    padding: 2.14286rem 2.14286rem 1.42857rem 2.14286rem;
    margin-bottom: 30px;
    margin-bottom: 2.14286rem;
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.1);
}

.starail-Wrapper .starail-OrderInfo h2 {
    color: #1b365d;
    font-size: 21px;
    font-size: 1.5rem;
}

.starail-OrderInfo-wrapper {
    position: relative;
    padding: 0px 25px;
    padding: 0 1.78571rem;
    margin: 0px 15px;
    margin: 0 1.07143rem;
}

.starail-OrderInfo-section {
    margin-bottom: 1px;
    background-color: #FFF;
    width: 100%;
    display: block;
    overflow: hidden;
    padding: 5px 0px 10px;
    padding: 0.35714rem 0 0.71429rem;
    font-size: 14px;
    font-size: 1rem;
}

.starail-OrderInfo-rowTitle, .starail-OrderInfo-rowContent {
    float: left;
    padding: 5px 15px;
    padding: 0.35714rem 1.07143rem;
}

.starail-OrderInfo-rowTitle {
    width: 210px;
    clear: both;
    font-weight: bold;
}

.starail-OrderInfo-totalPrice {
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    font-weight: 700;
    text-align: right;
    text-transform: uppercase;
    font-size: 17px;
    font-size: 1.21429rem;
    margin: 20px 0px 0px 0px;
    margin: 1.42857rem 0 0 0;
    text-transform: uppercase;
    color: #1b365d;
}

    .starail-OrderInfo-totalPrice .starail-OrderInfo-totalPrice-amount {
        font-size: 30px;
        font-size: 2.14286rem;
        margin-left: 20px;
        margin-left: 1.42857rem;
    }

.starail-OrderInfo-totalPrice-highlight {
    color: #f47c30;
}

.starail-OrderInfo-btn {
    position: absolute;
    top: 20px;
    right: 55px;
    padding: 8px 30px;
    padding: 0.57143rem 2.14286rem;
    z-index: 10;
}

    .starail-OrderInfo-btn i {
        margin-right: 5px;
    }

/* Modifier 
   ========================================================================== */
.starail-OrderInfo--confirmation {
    position: relative;
}

    .starail-OrderInfo--confirmation h2 {
        margin-bottom: 30px;
        margin-bottom: 2.14286rem;
        padding-right: 350px;
        padding-right: 25rem;
    }

@media only screen and (max-width: 639px) {
    .starail-OrderInfo--confirmation.starail-OrderInfo {
        padding: 0;
    }
}

/* Desktop
   ========================================================================== */
/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-OrderInfo {
        background-color: #FFF;
        padding: 10px;
        padding: 0.71429rem;
        margin-bottom: 70px;
        margin-bottom: 5rem;
        border: 1px solid #eaeaea;
    }

    .starail-Wrapper .starail-OrderInfo h2 {
        color: #444;
        font-size: 17px;
        font-size: 1.21429rem;
        padding: 10px 0px 10px 0px;
        padding: 0.71429rem 0 0.71429rem 0;
        margin: 0px 10px 0px;
        margin: 0 0.71429rem 0;
        border-bottom: 1px solid #edeff1;
    }

    .starail-OrderInfo-section {
        padding: 5px 10px 0px;
        padding: 0.35714rem 0.71429rem 0;
    }

    .starail-OrderInfo-rowTitle, .starail-OrderInfo-rowContent {
        float: none;
        line-height: 20px;
        line-height: 1.42857rem;
    }

    .starail-OrderInfo-rowTitle {
        padding: 5px 0px 0px;
        padding: 0.35714rem 0 0;
    }

    .starail-OrderInfo-rowContent {
        padding: 0px 0px 5px;
        padding: 0 0 0.35714rem;
    }

    .starail-OrderInfo-totalPrice {
        position: absolute;
        top: 100%;
        width: 100%;
        height: 45px;
        background-color: #edeff1;
        text-align: left;
        padding: 0px 10px;
        padding: 0 0.71429rem;
        line-height: 45px;
        overflow: hidden;
    }

        .starail-OrderInfo-totalPrice .starail-OrderInfo-totalPrice-amount {
            font-size: 21px;
            font-size: 1.5rem;
            float: right;
        }

    .starail-OrderInfo-section--section1 .starail-OrderInfo-rowContent:last-child {
        border-bottom: 1px solid #edeff1;
        padding: 0px 0px 10px;
        padding: 0 0 0.71429rem;
    }

    .starail-OrderInfo-section--section2 .starail-OrderInfo-rowContent:last-child {
        padding: 0px 0px 15px;
        padding: 0 0 1.07143rem;
    }

    .starail-OrderInfo-btn {
        position: relative;
        top: 0px;
        right: 0px;
        width: auto;
        display: block;
        margin: 0px 10px 20px;
        margin: 0 0.71429rem 1.42857rem;
    }

        .starail-OrderInfo-btn i {
            font-size: 20px;
            font-size: 1.42857rem;
            margin-top: -2px;
        }

    .starail-OrderInfo-wrapper {
        padding: 0px 10px 10px;
        padding: 0 0.71429rem 0.71429rem;
        margin: 0px;
        margin: 0;
    }
}

/* no-js
   ========================================================================== */
/*

# Print

Basic print styles

*/
@media print {
    *, *:before, *:after {
        background: transparent !important;
        color: #000 !important;
        /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a, a:visited {
        text-decoration: underline;
    }

    /*a[href]:after {
        content: " (" attr(href) ")";
    }*/
    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */
    a[href^="#"]:after, a[href^="javascript:"]:after {
        content: "";
    }

    pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
        /* h5bp.com/t */
    }

    tr, img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p, h2, h3 {
        orphans: 3;
        widows: 3;
    }

    h2, h3 {
        page-break-after: avoid;
    }

    .sta-header, #starail #sta-footer, #sta-newsletter[style], .starail-ShareList, .starail-Itinerary-trigger, .starail-Itinerary-triggerIcon, .starail-Button--cta, .starail-Offer, .starail-HomeHero, .starail-Switcher-tabs, .starail-Filter-more, .starail-Filter-clear-trigger, .starail-ProgressBar, .starail-DestinationIcon, .starail-JourneyBlock-select, .starail-Tabs-tabs, .starail-TrainOptions-earlierLaterBtns, .starail-BookingDetails-submit, .starail-Banner, .starail-CtaList, .starail-Back, .starail-Form-row--card-first, .starail-Form-row--card-second, .starail-rtnJourney-trigger, .starail-YourBooking-btn, .starail-u-hidePrint, .starail-YourBooking-col-delete, .starail-ImageLink img, .starail-Filter-filterBar {
        display: none !important;
    }

    .starail-Switcher-content, .starail-Tabs-content, .starail-Wrapper .starail-Accordion-item .starail-Accordion-body {
        display: block !important;
        max-height: 4000px !important;
    }

    .starail-Itinerary {
        background-color: #FFF !important;
    }

    #starail-passes {
        text-align: center !important;
    }

    .starail-JourneyBlock-content, .starail-JourneyBlock-footer {
        padding: 0 !important;
        margin: 0 !important;
    }

    .starail-YourBooking, .starail-BookingDetails-form {
        padding: 0 !important;
    }

    .starail-ImageLink {
        height: 100px !important;
        width: 25% !important;
    }
}

/*

# PrintQueue


*/
/* Component
   ========================================================================== */
.starail-PrintQueue {
    margin: 0px 40px 30px 40px;
    margin: 0 2.85714rem 2.14286rem 2.85714rem;
    padding-left: 250px;
    padding-left: 17.85714rem;
    overflow: hidden;
    position: relative;
}

.starail-PrintQueue-label {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 250px;
    display: block;
    overflow: hidden;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

    .starail-PrintQueue-label label {
        display: block;
        font-size: 16px;
        font-size: 1.14286rem;
    }

.starail-PrintQueue-inputs {
    display: block;
    width: auto;
}

    .starail-PrintQueue-inputs button {
        width: 43%;
        max-width: 300px;
    }

.starail-PrintQueue-select {
    width: 57%;
    max-width: 400px;
    padding-right: 20px;
    float: left;
}

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-PrintQueue {
        margin: 0px 20px 25px 20px;
        margin: 0 1.42857rem 1.78571rem 1.42857rem;
        padding-left: 0px;
        padding-left: 0;
    }

    .starail-PrintQueue-label {
        position: relative;
        float: none;
        display: block;
    }

    .starail-PrintQueue-select, .starail-PrintQueue-inputs button {
        float: none;
        width: 100%;
        max-width: none;
        padding-right: 0px;
        display: block;
    }

    .starail-PrintQueue-select {
        margin: 5px 0px 20px;
        margin: 0.35714rem 0 1.42857rem;
    }

        .starail-PrintQueue-select .starail-Form-select {
            padding: 5px 8px;
            padding: 0.35714rem 0.57143rem;
        }
}

/* 

# ProgressBar

Displays users progress through booking

## Example

    <div class="starail-ProgressBar starail-ProgressBar-stage--stage1 starail-u-hideMobile">

        <div class="starail-ProgressBar-line">
            <div class="starail-ProgressBar-progress"></div>
        </div>

        <div class="starail-ProgressBar-stage starail-ProgressBar-stage1">
            <div class="starail-ProgressBar-circle"></div>
            <p class="starail-ProgressBar-label">Ticket Selection</p>
            <div class="starail-ProgressBar-subStage"></div>

        </div>

        <div class="starail-ProgressBar-stage starail-ProgressBar-stage2">
            <div class="starail-ProgressBar-circle"></div>
            <p class="starail-ProgressBar-label">Booking Details</p>
            <div class="starail-ProgressBar-subStage"></div>
        </div>

        <div class="starail-ProgressBar-stage starail-ProgressBar-stage3">
            <div class="starail-ProgressBar-circle"></div>
            <p class="starail-ProgressBar-label">Checkout</p>
        </div>


    </div>

 */
/* Component
   ========================================================================== */
.starail-ProgressBar {
    position: relative;
    display: block;
    width: 640px;
    overflow: visible;
    margin: 55px auto 0px auto;
    margin: 3.92857rem auto 0 auto;
    height: 105px;
    height: 7.5rem;
}

.starail-ProgressBar-line {
    display: block;
    height: 6px;
    width: 100%;
    background-color: #d2d2d2;
}

.starail-ProgressBar-progress {
    display: block;
    height: 6px;
    width: 0%;
    background-color: #0c6ab8;
}

.starail-ProgressBar-stage {
    position: absolute;
    top: 3px;
    height: 0px;
    overflow: visible;
}

.starail-ProgressBar-stage1 {
    left: 0px;
    width: 50%;
}

.starail-ProgressBar-stage2 {
    left: 50%;
    width: 50%;
}

.starail-ProgressBar-stage3 {
    right: 0px;
    width: 0px;
}

.starail-ProgressBar-circle {
    position: relative;
    display: block;
    background-color: #FFF;
    border: 4px solid #d2d2d2;
    border-radius: 10px;
    width: 20px;
    height: 20px;
    margin-left: -10px;
    margin-top: -10px;
}

.starail-ProgressBar-label {
    white-space: nowrap;
    text-align: center;
    text-transform: uppercase;
    width: 200px;
    width: 14.28571rem;
    margin: 28px 0px 0px -100px;
    margin: 2rem 0 0 -7.14286rem;
    font-size: 17px;
    font-size: 1.21429rem;
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    color: #444;
    font-weight: 700;
}

.starail-ProgressBar-subStage {
    position: absolute;
    left: 50%;
    top: -3px;
    width: 5px;
    height: 11px;
    background-color: #d2d2d2;
}

/* Progress States
   ========================================================================== */
.starail-ProgressBar-stage--stage1 .starail-ProgressBar-stage1 .starail-ProgressBar-circle {
    border: 4px solid #0c6ab8;
}

.starail-ProgressBar-stage--stage1 .starail-ProgressBar-stage1 .starail-ProgressBar-label {
    color: #0c6ab8;
}

.lt-ie9 .starail-ProgressBar-stage--stage1 .starail-ProgressBar-stage1 .starail-ProgressBar-circle {
    border: none;
    background-position: 0px -20px;
}

.starail-ProgressBar-stage--stage1 .starail-ProgressBar-progress {
    width: 0%;
}

.starail-ProgressBar-stage--stage1b .starail-ProgressBar-stage1 .starail-ProgressBar-circle {
    border: 4px solid #0c6ab8;
}

.starail-ProgressBar-stage--stage1b .starail-ProgressBar-stage1 .starail-ProgressBar-label {
    color: #0c6ab8;
}

.lt-ie9 .starail-ProgressBar-stage--stage1b .starail-ProgressBar-stage1 .starail-ProgressBar-circle {
    border: none;
    background-position: 0px -20px;
}

.starail-ProgressBar-stage--stage1b .starail-ProgressBar-stage1 .starail-ProgressBar-subStage {
    background-color: #0c6ab8;
}

.starail-ProgressBar-stage--stage1b .starail-ProgressBar-progress {
    width: 25%;
}

.starail-ProgressBar-stage--stage2 .starail-ProgressBar-stage1 .starail-ProgressBar-circle, .starail-ProgressBar-stage--stage2 .starail-ProgressBar-stage2 .starail-ProgressBar-circle {
    border: 4px solid #0c6ab8;
}

.starail-ProgressBar-stage--stage2 .starail-ProgressBar-stage1 .starail-ProgressBar-label, .starail-ProgressBar-stage--stage2 .starail-ProgressBar-stage2 .starail-ProgressBar-label {
    color: #0c6ab8;
}

.lt-ie9 .starail-ProgressBar-stage--stage2 .starail-ProgressBar-stage1 .starail-ProgressBar-circle, .lt-ie9 .starail-ProgressBar-stage--stage2 .starail-ProgressBar-stage2 .starail-ProgressBar-circle {
    border: none;
    background-position: 0px -20px;
}

.starail-ProgressBar-stage--stage2 .starail-ProgressBar-stage1 .starail-ProgressBar-subStage {
    background-color: #0c6ab8;
}

.starail-ProgressBar-stage--stage2 .starail-ProgressBar-progress {
    width: 50%;
}

.starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage1 .starail-ProgressBar-circle, .starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage2 .starail-ProgressBar-circle, .starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage3 .starail-ProgressBar-circle {
    border: 4px solid #0c6ab8;
}

.starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage1 .starail-ProgressBar-label, .starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage2 .starail-ProgressBar-label, .starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage3 .starail-ProgressBar-label {
    color: #0c6ab8;
}

.lt-ie9 .starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage1 .starail-ProgressBar-circle, .lt-ie9 .starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage2 .starail-ProgressBar-circle, .lt-ie9 .starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage3 .starail-ProgressBar-circle {
    border: none;
    background-position: 0px -20px;
}

.starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage1 .starail-ProgressBar-subStage, .starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage2 .starail-ProgressBar-subStage, .starail-ProgressBar-stage--stage3 .starail-ProgressBar-stage3 .starail-ProgressBar-subStage {
    background-color: #0c6ab8;
}

.starail-ProgressBar-stage--stage3 .starail-ProgressBar-progress {
    width: 100%;
}

/* ie8
   ========================================================================== */
.lt-ie9 .starail-ProgressBar-circle {
    border: none;
    border-radius: 10px;
    background-image: url('../img/ie/progress-bar.png');
    background-position: 0px 0px;
}

/* 
# SearchTickets

Ticket search

 */
/* Component
   ========================================================================== */
.starail-SearchTickets {
    padding: 0px 25px 0px;
}

    .starail-SearchTickets hr {
        margin: 35px 0px;
        margin: 2.5rem 0;
    }

.starail-SearchTickets-title {
    text-align: center;
    margin-bottom: 40px;
    margin-bottom: 2.85714rem;
}

.starail-SearchTickets-destination {
    position: relative;
    overflow: hidden;
}

    .starail-SearchTickets-destination .starail-DestinationIcon {
        position: absolute;
        top: 20px;
        left: 133px;
        height: 45px;
        display: block;
        width: 8px;
        z-index: 100;
    }

.custom-sta .starail-SearchTickets-destination .starail-DestinationIcon { /*sta*/
    display: none;
}

.starail-SearchTickets-destination .starail-SearchTickets-destination-row {
    display: block;
    clear: both;
    overflow: hidden;
}

.starail-SearchTickets-destination .starail-SearchTickets-destinationInput {
    position: relative;
    overflow: hidden;
    background-color: #FFF;
    padding: 0px 50px;
    padding: 0 3.57143rem;
    border-left: 1px solid #d5d7d8;
    border-right: 1px solid #d5d7d8;
}

.custom-sta .starail-SearchTickets-destination .starail-SearchTickets-destinationInput { /*sta*/
    position: relative;
    overflow: hidden;
    background-color: #1a365e;
    padding: 0 50px;
    padding: 0 0 0 3.57143rem;
    border: 1px solid #d5d7d8;
    /*border-right: 1px solid #d5d7d8;*/
    margin: 0 !important;
    width: 80%;
}

.starail-SearchTickets-destination .starail-SearchTickets-destinationInput input {
    border: none;
}

.custom-sta .starail-SearchTickets-destination .starail-SearchTickets-destinationInput::before { /*sta*/
    content: "\f041";
    font-family: FontAwesome;
    left: 16px;
    position: absolute;
    top: 8px;
    color: #fff;
    font-size: 25px;
}

.custom-sta .switchRadioGroup { /*sta*/
    width: 56% !important;
}

.starail-SearchTickets-destination .starail-SearchTickets-destination-row--start .starail-SearchTickets-destinationInput {
    border-top: 1px solid #d5d7d8;
    transition: border 0.3s ease-in-out;
}

    .starail-SearchTickets-destination .starail-SearchTickets-destination-row--start .starail-SearchTickets-destinationInput input {
        /*border-bottom: 1px solid #edeff1;
            margin-top: 2px;*/
    }

.starail-SearchTickets-destination .starail-SearchTickets-destination-row--end .starail-SearchTickets-destinationInput {
    border-bottom: 1px solid #d5d7d8;
    transition: border 0.3s ease-in-out;
}

    .starail-SearchTickets-destination .starail-SearchTickets-destination-row--end .starail-SearchTickets-destinationInput input {
        /*margin-bottom: 2px;*/
    }

.starail-SearchTickets-destination .starail-SearchTickets-switch-trigger {
    position: absolute;
    right: 14%;
    top: 79px;
}

    .starail-SearchTickets-destination .starail-SearchTickets-switch-trigger .starail-Icon-reverse {
        font-size: 24px;
        font-size: 1.71429rem;
    }

.starail-SearchTickets-destination:hover .starail-SearchTickets-destinationInput {
    border-left: 1px solid #aaaaaa;
    border-right: 1px solid #aaaaaa;
}

.starail-SearchTickets-destination:hover .starail-SearchTickets-destination-row--start .starail-SearchTickets-destinationInput {
    border-top: 1px solid #aaaaaa;
}

.starail-SearchTickets-destination:hover .starail-SearchTickets-destination-row--end .starail-SearchTickets-destinationInput {
    border-bottom: 1px solid #aaaaaa;
}

.starail-SearchTickets-quantity {
    margin-top: 40px;
    margin-top: 2.85714rem;
    margin-bottom: 0px;
    margin-bottom: 0;
}

    .starail-SearchTickets-quantity .starail-Form-inputContainer-col label {
        font-size: 14px;
        font-size: 1rem;
    }

    .starail-SearchTickets-quantity + hr {
        margin-top: 10px;
    }

/* Modifiers
   ========================================================================== */
.starail-SearchTickets--mini {
    padding: 0px;
    padding: 0;
}

    .starail-SearchTickets--mini .starail-Box {
        padding: 0px 0px 15px 0px;
        padding: 0 0 1.07143rem 0;
    }

    .starail-SearchTickets--mini .starail-Form--onBoxNarrow {
        padding: 0px 15px;
        padding: 0 1.07143rem;
    }

    .starail-SearchTickets--mini .starail-Form-label {
        width: 63px;
        font-size: 14px;
        font-size: 1rem;
    }

    .starail-SearchTickets--mini .starail-Form-row {
        margin-bottom: 15px;
        margin-bottom: 1.07143rem;
    }

        .starail-SearchTickets--mini .starail-Form-row:last-child {
            margin-bottom: 0px;
            margin-bottom: 0;
        }

    .starail-SearchTickets--mini .starail-DestinationIcon {
        left: 73px;
        top: 16px;
    }

    .starail-SearchTickets--mini .starail-SearchTickets-destinationInput {
        padding: 0px 30px 0px 25px;
        padding: 0 2.14286rem 0 1.78571rem;
    }

        .starail-SearchTickets--mini .starail-SearchTickets-destinationInput .starail-Form-input {
            padding: 8px 0px;
            padding: 0.57143rem 0;
        }

    .starail-SearchTickets--mini .starail-Form-input {
        font-size: 14px;
        font-size: 1rem;
    }

    .starail-SearchTickets--mini .starail-SearchTickets-switch-trigger {
        right: 5px;
        top: 26px;
    }

    .starail-SearchTickets--mini .starail-Form-switchRadioGroup {
        overflow: hidden;
    }

        .starail-SearchTickets--mini .starail-Form-switchRadioGroup:not(#ie8) label {
            width: 49%;
        }

            .starail-SearchTickets--mini .starail-Form-switchRadioGroup:not(#ie8) label span {
                font-size: 14px;
                font-size: 1rem;
            }

    .starail-SearchTickets--mini .starail-Form-inputContainer--inputGroup .starail-Form-datePicker {
        width: 62%;
        padding-right: 10px;
        padding-right: 0.71429rem;
    }

        .starail-SearchTickets--mini .starail-Form-inputContainer--inputGroup .starail-Form-datePicker input {
            padding: 9px 10px 9px 9px;
            padding: 0.64286rem 0.71429rem 0.64286rem 0.64286rem;
        }

    .starail-SearchTickets--mini .starail-Form-inputContainer--inputGroup .starail-Form-inputContainer--time {
        width: 38%;
        padding: 8px 3px 8px 5px;
        padding: 0.57143rem 0.21429rem 0.57143rem 0.35714rem;
        font-size: 14px;
        font-size: 1rem;
        line-height: 14px;
        line-height: 1rem;
    }

    .starail-SearchTickets--mini .starail-SearchTickets-quantity {
        margin: 20px 0px 0px 0px;
        margin: 1.42857rem 0 0 0;
    }

        .starail-SearchTickets--mini .starail-SearchTickets-quantity > label {
            display: block;
            float: none;
            clear: both;
            margin-bottom: 5px;
            margin-bottom: 0.35714rem;
        }

        .starail-SearchTickets--mini .starail-SearchTickets-quantity .starail-Form-inputContainer-col:nth-child(2n-1) {
            padding: 0px 10px 0px 0px;
            padding: 0 0.71429rem 0 0;
        }

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-SearchTickets {
        padding: 15px 0px 10px;
        padding: 1.07143rem 0 0.71429rem;
    }

    .starail-SearchTickets-destination .starail-DestinationIcon {
        left: 15px;
    }

    .starail-SearchTickets-destination .starail-SearchTickets-destinationInput {
        padding: 0px 40px 0px 30px;
        padding: 0 2.85714rem 0 2.14286rem;
    }

    .starail-SearchTickets-destination .starail-SearchTickets-switch-trigger {
        right: 10px;
    }

        .starail-SearchTickets-destination .starail-SearchTickets-switch-trigger:hover {
            color: #0c6ab8;
        }

    .starail-Wrapper .starail-SearchTickets-title.starail-u-alpha {
        font-size: 21px;
        font-size: 1.5rem;
        padding: 0px 20px 15px 20px;
        padding: 0 1.42857rem 1.07143rem 1.42857rem;
        margin-bottom: 0px;
        margin-bottom: 0;
        border-bottom: 1px solid #edeff1;
    }

    .starail-SearchTickets-quantity select {
        float: left;
        margin-right: 10px;
        margin-right: 0.71429rem;
    }

    .starail-SearchTickets-quantity label {
        overflow: hidden;
        display: block;
        margin: 4px 0 0 0;
        margin: 0.28571rem 0 0 0;
    }

    .starail-SearchTickets-quantity > label {
        margin: 0 0 4px 0;
        margin: 0 0 0.28571rem 0;
        width: 100%;
    }

    .starail-SearchTickets-quantity .starail-Form-inputContainer-col {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

        .starail-SearchTickets-quantity .starail-Form-inputContainer-col label {
            margin: 0px;
            line-height: 1.3em;
        }

    .switchRadioGroup {
        width: 100% !important;
    }

    .sta-datepic {
        display: block;
        width: 100%;
        vertical-align: top;
    }

    .starail-Form-button {
        max-width: inherit;
    }
        /*sta*/
        .starail-Form-button.starail-Form-button--primary {
            font-size: 18px;
        }
    /*sta*/
    .mobile-search-input {
        width: 100% !important;
    }
}

/* 

# Section

Section styles

*/
/* Component
   ========================================================================== */
.starail-Section {
    padding: 20px;
    padding: 1.42857rem;
    position: relative;
}

.starail-Section-nextButtonSection {
    text-align: right;
    margin: 30px 0;
    margin: 2.14286rem 0;
}

    .starail-Section-nextButtonSection button {
        width: 300px;
        width: 21.42857rem;
    }

/* Modifiers
   ========================================================================== */
.starail-Section--nopadding {
    padding: 0;
}

.starail-Section--backToTop {
    text-align: center;
    font-weight: bold;
    font-size: 14px;
    font-size: 1rem;
    margin-bottom: 20px;
    margin-bottom: 1.42857rem;
}

    .starail-Section--backToTop .starail-Icon-arrow-up {
        margin: -3px 5px 0px 0px;
        margin: -0.21429rem 0.35714rem 0 0;
    }

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Section--backToTop {
        display: none;
    }

    .starail-Section-nextButtonSection {
        margin: 20px 0;
        margin: 1.42857rem 0;
    }
}

/* 

# Sidebar

Sidebar styles

*/
/* Component
   ========================================================================== */
.starail-Sidebar {
    position: relative;
}

.starail-Sidebar-title {
    padding: 0px 15px;
    padding: 0 1.07143rem;
    margin-bottom: 15px;
    margin-bottom: 1.07143rem;
}

    .starail-Sidebar-title h4 {
        border-bottom: 1px solid #FFF;
        padding: 20px 0px 15px 0px;
        padding: 1.42857rem 0 1.07143rem 0;
        margin: 0px;
        margin: 0;
        font-size: 17px !important;
    }

.starail-Sidebar-tabs {
    margin: 20px 0px;
    margin: 1.42857rem 0;
}

    .starail-Sidebar-tabs .starail-Tabs-tab {
        padding: 0px 5px 0px 0px;
        padding: 0 0.35714rem 0 0;
    }

        .starail-Sidebar-tabs .starail-Tabs-tab:last-child {
            padding: 0px 0px 0px 5px;
            padding: 0 0 0 0.35714rem;
        }

        .starail-Sidebar-tabs .starail-Tabs-tab a {
            min-height: 10px;
            text-transform: uppercase;
            text-align: center;
            font-weight: 700;
            background-color: #5595cc;
            color: #FFF;
            font-size: 17px;
            font-size: 1.21429rem;
        }

            .starail-Sidebar-tabs .starail-Tabs-tab a:active, .starail-Sidebar-tabs .starail-Tabs-tab a:visited {
                color: #FFF;
            }

            .starail-Sidebar-tabs .starail-Tabs-tab a:hover {
                background-color: #377cb7;
                color: #FFF;
            }

            .starail-Sidebar-tabs .starail-Tabs-tab a div {
                margin: 15px 5px 10px 5px;
                margin: 1.07143rem 0.35714rem 0.71429rem 0.35714rem;
            }

.starail-Sidebar-bottomBtns {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    padding: 0px 20px;
}

.starail-Sidebar-map {
    width: 100%;
    height: 335px;
    margin-bottom: 30px;
}

/* Modifier 
   ========================================================================== */
/* Mobile
   ========================================================================== */
/* no-js
   ========================================================================== */
/* 

# Switcher

Tabs used on the homepage

 */
/* Component
   ========================================================================== */
.starail-Switcher-tabs {
    margin: 0px;
    margin: 0;
    padding: 0px;
    padding: 0;
    list-style-type: none;
    display: block;
    height: 50px;
    background-color: #edeff1;
}

.starail-Switcher-tab {
    margin: 0px;
    margin: 0;
    padding: 0px;
    padding: 0;
    position: relative;
    display: table;
    float: left;
    width: 50%;
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    font-weight: 700;
    font-size: 21px;
    font-size: 1.5rem;
    text-align: center;
}

    .starail-Switcher-tab:after, .starail-Switcher-tab:before {
        transition: all 0.3s ease-in-out;
        content: '';
        position: absolute;
        opacity: 0;
        width: 0px;
        height: 0px;
        right: 50%;
    }

    .starail-Switcher-tab:after {
        bottom: -19px;
        border: 10px solid transparent;
        border-top: 10px solid #0c6ab8;
        margin-right: -10px;
    }

    .starail-Switcher-tab:before {
        bottom: -24px;
        border: 12px solid transparent;
        border-top: 12px solid #FFF;
        margin-right: -12px;
    }

    .starail-Switcher-tab a {
        display: block;
        width: 100%;
        height: 50px;
        display: table-cell;
        vertical-align: middle;
        color: #444;
        text-transform: uppercase;
        background-color: #edeff1;
        transition: background-color 0.3s ease-in-out;
        padding: 10px 20px;
        padding: 0.71429rem 1.42857rem;
    }

        .starail-Switcher-tab a:active, .starail-Switcher-tab a:visited {
            color: #444;
        }

        .starail-Switcher-tab a:hover {
            background-color: #dfe2e6;
            color: #444;
        }

    .starail-Switcher-tab.starail-Switcher-tab--active {
        background-color: #0c6ab8;
        border-bottom: 1px solid #FFF;
    }

        .starail-Switcher-tab.starail-Switcher-tab--active:after, .starail-Switcher-tab.starail-Switcher-tab--active:before {
            opacity: 1;
        }

        .starail-Switcher-tab.starail-Switcher-tab--active a {
            color: #FFF;
            background-color: #0c6ab8;
            cursor: default;
        }

.starail-Switcher-content {
    clear: both;
    float: none;
    overflow: hidden;
    display: block;
}

/*.starail-Switcher-content.starail-Switcher-content--hidden {
        display: none;
    }*/

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {

    .starail-Switcher-tab {
        font-size: 17px;
        font-size: 1.21429rem;
        z-index: 10;
    }

        .starail-Switcher-tab:last-child {
            border-left: 2px solid #FFF;
        }

    .starail-Switcher-content {
        margin-top: 0px;
        margin-top: 0;
        z-index: 5;
    }
}

/* no-js
   ========================================================================== */
.no-js .starail-Switcher-content.starail-Switcher-content--hidden {
    display: block;
}

/* ie8
   ========================================================================== */
.lt-ie9 .starail-Switcher-tab:after, .lt-ie9 .starail-Switcher-tab:before {
    display: none;
}

.lt-ie9 .starail-Switcher-tab.starail-Switcher-tab--active:after, .lt-ie9 .starail-Switcher-tab.starail-Switcher-tab--active:before {
    display: block;
}

/* 

# Tabs

Tab styles.

 */
/* Component
   ========================================================================== */
.starail-Tabs-tabs {
    margin: 0px;
    margin: 0;
    padding: 0px;
    padding: 0;
    list-style-type: none;
    display: table;
    width: 100%;
    table-layout: fixed;
    border-bottom: 10px solid #0c6ab8;
}

/* horrible nasty hackiness to make the tabs grow properly*/
.starail-Tabs-tab {
    margin: 0px;
    margin: 0;
    padding: 0px 20px 0px 0px;
    padding: 0 1.42857rem 0 0;
    position: relative;
    display: table-cell;
    height: 100%;
    width: 33.3%;
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    vertical-align: top;
}

    .starail-Tabs-tab a {
        display: inline-block;
        position: relative;
        width: 100%;
        height: 100%;
        min-height: 70px;
        color: #888888;
        background-color: #edeff1;
        transition: background-color 0.3s ease-in-out;
        padding: 0px;
        padding: 0;
    }

        .starail-Tabs-tab a div {
            display: block;
            margin: 15px 20px 5px 20px;
            margin: 1.07143rem 1.42857rem 0.35714rem 1.42857rem;
        }

        .starail-Tabs-tab a:active, .starail-Tabs-tab a:visited {
            color: #888888;
        }

        .starail-Tabs-tab a:hover {
            color: #888888;
            background-color: #dfe2e6;
        }

    .starail-Tabs-tab.starail-Tabs-tab--active a {
        color: #FFF;
        background-color: #0c6ab8;
        cursor: default;
    }

.starail-Tabs-content {
    clear: both;
    float: none;
    overflow: hidden;
    display: block;
    margin-top: 10px;
    margin-top: 0.71429rem;
}

    .starail-Tabs-content.starail-Tabs-content--hidden {
        display: none;
    }

.starail-Tabs-passSelectionTabs {
    margin-top: 60px;
    margin-top: 4.28571rem;
}

    .starail-Tabs-passSelectionTabs .starail-Tabs-tab {
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        font-weight: bold;
        text-transform: uppercase;
        line-height: 1;
        text-align: center;
        font-size: 17px;
        font-size: 1.21429rem;
        width: 16%;
        vertical-align: middle;
    }

        .starail-Tabs-passSelectionTabs .starail-Tabs-tab a {
            min-height: 58px;
            min-height: 4.14286rem;
            padding-top: 15px;
            padding-top: 1.07143rem;
            height: auto;
        }

    .starail-Tabs-passSelectionTabs .starail-Tabs-tab--passSelection {
        text-align: right;
        padding-right: 2px;
        padding-right: 0.14286rem;
        width: 36%;
    }

        .starail-Tabs-passSelectionTabs .starail-Tabs-tab--passSelection .starail-Button {
            width: 300px;
            width: 21.42857rem;
        }

/* Modifier 
   ========================================================================== */
.starail-Tabs--small .starail-Tabs-tab {
    width: 150px;
}

    .starail-Tabs--small .starail-Tabs-tab a {
        min-height: 60px;
    }

.starail-Tabs-tab--passSelection {
    width: 230px;
    width: 16.42857rem;
    text-align: right;
}

.starail-Tabs-wrapper--dropShadowDesktop {
    box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
}

@media only screen and (max-width: 639px) {
    .starail-Tabs-wrapper--dropShadowDesktop {
        box-shadow: none;
    }
}

.starail-Tabs-notification {
    position: absolute;
    background-color: #f47c30;
    display: none;
    top: -10px;
    top: -0.71429rem;
    right: -10px;
    right: -0.71429rem;
    width: 30px;
    width: 2.14286rem;
    height: 30px;
    height: 2.14286rem;
    font-size: 17px;
    font-size: 1.21429rem;
    padding-top: 3px;
    padding-top: 0.21429rem;
    color: white;
    box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
    font-style: normal;
    text-align: center;
    border: 3px solid white;
    border-radius: 50%;
    background-clip: padding-box;
}

    .starail-Tabs-notification.is-showing {
        display: block;
    }

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Tabs {
        overflow: hidden;
    }

        .starail-Tabs .starail-Tabs-tabs {
            margin-left: -1px;
            margin-right: -1px;
        }

        .starail-Tabs .starail-Tabs-tab {
            font-size: 17px;
            font-size: 1.21429rem;
            z-index: 10;
            padding: 0px 1px;
        }

            .starail-Tabs .starail-Tabs-tab a {
                padding-top: 10px;
                padding-top: 0.71429rem;
                min-height: 49px;
            }

    .starail-Tabs-content {
        margin-top: 0px;
        margin-top: 0;
        z-index: 5;
    }

    .starail-Tabs-notification {
        right: 5px;
        right: 0.35714rem;
        top: -20px;
        top: -1.42857rem;
    }

    .starail-Tabs-passSelectionTabs {
        margin-top: 20px;
        margin-top: 1.42857rem;
    }
}

/* no-js
   ========================================================================== */
.no-js .starail-Tabs-content.starail-Tabs-content--hidden {
    display: block;
}

/* IE8
   ========================================================================== */
.lt-ie9 .starail-Tabs-wrapper--dropShadowDesktop {
    border: 1px solid #DFDFDF;
    border-top: none;
}

.lt-ie9 .starail-Tabs-passSelectionTabs .starail-Tabs-tab a {
    min-height: 45px;
}

/*! jQuery UI - v1.11.4 - 2015-03-11
* http://jqueryui.com
* Includes: core.css, accordion.css, autocomplete.css, button.css, datepicker.css, dialog.css, draggable.css, menu.css, progressbar.css, resizable.css, selectable.css, selectmenu.css, slider.css, sortable.css, spinner.css, tabs.css, tooltip.css, theme.css
* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Verdana%2CArial%2Csans-serif&fwDefault=normal&fsDefault=1.1em&cornerRadius=4px&bgColorHeader=cccccc&bgTextureHeader=highlight_soft&bgImgOpacityHeader=75&borderColorHeader=aaaaaa&fcHeader=222222&iconColorHeader=222222&bgColorContent=ffffff&bgTextureContent=flat&bgImgOpacityContent=75&borderColorContent=aaaaaa&fcContent=222222&iconColorContent=222222&bgColorDefault=e6e6e6&bgTextureDefault=glass&bgImgOpacityDefault=75&borderColorDefault=d3d3d3&fcDefault=555555&iconColorDefault=888888&bgColorHover=dadada&bgTextureHover=glass&bgImgOpacityHover=75&borderColorHover=999999&fcHover=212121&iconColorHover=454545&bgColorActive=ffffff&bgTextureActive=glass&bgImgOpacityActive=65&borderColorActive=aaaaaa&fcActive=212121&iconColorActive=454545&bgColorHighlight=fbf9ee&bgTextureHighlight=glass&bgImgOpacityHighlight=55&borderColorHighlight=fcefa1&fcHighlight=363636&iconColorHighlight=2e83ff&bgColorError=fef1ec&bgTextureError=glass&bgImgOpacityError=95&borderColorError=cd0a0a&fcError=cd0a0a&iconColorError=cd0a0a&bgColorOverlay=aaaaaa&bgTextureOverlay=flat&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=aaaaaa&bgTextureShadow=flat&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=8px
* Copyright 2015 jQuery Foundation and other contributors; Licensed MIT */
/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
    display: none;
}

.ui-helper-hidden-accessible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.ui-helper-reset {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    line-height: 1.3;
    text-decoration: none;
    font-size: 100%;
    list-style: none;
}

.ui-helper-clearfix:before, .ui-helper-clearfix:after {
    content: "";
    display: table;
    border-collapse: collapse;
}

.ui-helper-clearfix:after {
    clear: both;
}

.ui-helper-clearfix {
    min-height: 0;
    /* support: IE7 */
}

.ui-helper-zfix {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    opacity: 0;
    filter: Alpha(Opacity=0);
    /* support: IE8 */
}

.ui-front {
    z-index: 100;
}

.ui-tooltip {
    padding: 8px 10px;
    position: absolute;
    z-index: 9999;
    max-width: 200px;
    box-shadow: 0 0 5px #aaa;
    background-color: #FFF;
    border: 1px solid #ccc;
}

body .ui-tooltip {
    border-width: 1px;
}

/* 

# TrainOptions

Train option styles

 */
/* Component
   ========================================================================== */
.starail-TrainOptions-mainTabs {
    margin-bottom: 65px;
    margin-bottom: 4.64286rem;
}

    .starail-TrainOptions-mainTabs .starail-Tabs-wrapper {
        border: 1px solid #edeff1;
        border-top: 0px;
        box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.1);
        padding: 20px 0px;
        padding: 1.42857rem 0;
        margin-top: 0px;
        margin-top: 0;
    }

        .starail-TrainOptions-mainTabs .starail-Tabs-wrapper .starail-Grid-col--8of12 {
            padding: 0px 0px 0px 20px;
            padding: 0 0 0 1.42857rem;
        }

        .starail-TrainOptions-mainTabs .starail-Tabs-wrapper .starail-Grid-col--4of12 {
            padding: 0px 20px 20px 20px;
            padding: 0 1.42857rem 1.42857rem 1.42857rem;
        }

    .starail-TrainOptions-mainTabs .starail-Tabs-content {
        margin: 0px;
        margin: 0;
    }

    .starail-TrainOptions-mainTabs .starail-Tabs-tab--trainOptions {
        padding: 0px 0px 0px 10px;
        padding: 0 0 0 0.71429rem;
    }

        .starail-TrainOptions-mainTabs .starail-Tabs-tab--trainOptions.starail-TrainOptions-outbound {
            padding: 0px 10px 0px 0px;
            padding: 0 0.71429rem 0 0;
        }

        .starail-TrainOptions-mainTabs .starail-Tabs-tab--trainOptions.starail-TrainOptions-subtotal {
            padding: 10px 10px 10px 20px;
            padding: 0.71429rem 0.71429rem 0.71429rem 1.42857rem;
            overflow: hidden;
        }

    .starail-TrainOptions-mainTabs .starail-TrainOptions-tab-title {
        text-transform: uppercase;
        font-size: 17px;
        font-size: 1.21429rem;
        margin-bottom: 5px;
        margin-bottom: 0.35714rem;
        font-weight: 700;
    }

        .starail-TrainOptions-mainTabs .starail-TrainOptions-tab-title i {
            font-size: 11px;
            font-size: 0.78571rem;
            margin: -3px 10px 0px;
            margin: -0.21429rem 0.71429rem 0;
        }

    .starail-TrainOptions-mainTabs .starail-TrainOptions-tab-details {
        font-family: Tahoma, Verdana, Segoe, sans-serif;
        font-size: 14px;
        font-size: 1rem;
        margin: 0px;
        margin: 0;
    }

        .starail-TrainOptions-mainTabs .starail-TrainOptions-tab-details .starail-TrainOptions-tab-details-time--init {
            opacity: 0.6;
        }

    .starail-TrainOptions-mainTabs .starail-TrainOptions-tab-cost {
        float: right;
        font-size: 17px;
        font-size: 1.21429rem;
        margin: 0px 0px 0px 10px;
        margin: 0 0 0 0.71429rem;
        font-weight: 700;
    }

    .starail-TrainOptions-mainTabs .starail-TrainOptions-subtotal .starail-TrainOptions-title {
        font-size: 20px;
        font-size: 1.42857rem;
    }

    .starail-TrainOptions-mainTabs .starail-TrainOptions-subtotal .starail-TrainOptions-subtotal-details {
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        float: left;
        font-weight: 700;
    }

        .starail-TrainOptions-mainTabs .starail-TrainOptions-subtotal .starail-TrainOptions-subtotal-details .starail-TrainOptions-subtotal-title {
            font-size: 17px;
            font-size: 1.21429rem;
            margin: 0px 0px 2px 0px;
            margin: 0 0 0.14286rem 0;
            text-transform: uppercase;
        }

        .starail-TrainOptions-mainTabs .starail-TrainOptions-subtotal .starail-TrainOptions-subtotal-details .starail-TrainOptions-subtotal-cost {
            font-size: 30px;
            font-size: 2.14286rem;
            margin: 0px;
            margin: 0;
        }

    .starail-TrainOptions-mainTabs .starail-TrainOptions-subtotal .starail-TrainOptions-subtotal-passengers {
        margin: 0px;
        margin: 0;
        padding: 25px 0px 0px 10px;
        padding: 1.78571rem 0 0 0.71429rem;
        height: 100%;
        width: auto;
        position: relative;
        display: table-cell;
        vertical-align: bottom;
        font-family: Tahoma, Verdana, Segoe, sans-serif;
        font-size: 14px;
        font-size: 1rem;
        line-height: 1.2em;
    }

.starail-TrainOptions-earlierLaterBtns {
    margin-bottom: 20px;
    margin-bottom: 1.42857rem;
}

    .starail-TrainOptions-earlierLaterBtns:last-child {
        margin-bottom: 0px;
        margin-bottom: 0;
    }

    .starail-TrainOptions-earlierLaterBtns i {
        margin: 0px 10px 0px 0px;
        margin: 0 0.71429rem 0 0;
    }

    .starail-TrainOptions-earlierLaterBtns .starail-Icon-double-chevron-left, .starail-TrainOptions-earlierLaterBtns .starail-Icon-double-chevron-right {
        display: none;
    }

    .starail-TrainOptions-earlierLaterBtns .starail-Icon-chevron-left, .starail-TrainOptions-earlierLaterBtns .starail-Icon-chevron-right {
        display: inline;
    }

.starail-TrainOptions-later {
    float: right;
}

    .starail-TrainOptions-later i {
        margin: 0px 0px 0px 10px;
        margin: 0 0 0 0.71429rem;
    }

.starail-TrainOptions-outboundError--animateClose {
    overflow: hidden;
    height: 0px;
    border: 0px solid transparent;
    padding-top: 0px;
    padding-bottom: 0px;
    transition: height 0.3s ease-in-out;
    transition: padding 0.3s ease-in-out;
}

/* Modifier 
   ========================================================================== */
/* Mobile
   ========================================================================== */
.starail-TrainOptions-mobileNav {
    overflow: hidden;
}

    .starail-TrainOptions-mobileNav > div {
        display: table;
        width: 100%;
    }

    .starail-TrainOptions-mobileNav .starail-Button {
        width: 50%;
        margin: 0px;
        display: table-cell;
        vertical-align: middle;
        height: 100%;
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        text-transform: uppercase;
        font-size: 17px;
        font-size: 1.21429rem;
        padding: 10px 10px;
        padding: 0.71429rem 0.71429rem;
        line-height: 1.2em;
    }

        .starail-TrainOptions-mobileNav .starail-Button i {
            margin: 0px 0px 0px 8px;
            margin: 0 0 0 0.57143rem;
            font-size: 15px;
            font-size: 1.07143rem;
        }

        .starail-TrainOptions-mobileNav .starail-Button:first-child {
            border-right: 1px solid #FFF;
        }

            .starail-TrainOptions-mobileNav .starail-Button:first-child i {
                margin: 0px 8px 0px 0px;
                margin: 0 0.57143rem 0 0;
            }

@media only screen and (max-width: 639px) {
    .starail-TrainOptions-earlierLaterBtns {
        margin-bottom: 5px;
        margin-bottom: 0.35714rem;
    }

        .starail-TrainOptions-earlierLaterBtns .starail-Button--blue {
            background-color: #FFF;
            color: #0c6ab8;
        }

            .starail-TrainOptions-earlierLaterBtns .starail-Button--blue:active, .starail-TrainOptions-earlierLaterBtns .starail-Button--blue:visited {
                color: #0c6ab8;
            }

            .starail-TrainOptions-earlierLaterBtns .starail-Button--blue i.starail-Icon-double-chevron-left, .starail-TrainOptions-earlierLaterBtns .starail-Button--blue i.starail-Icon-double-chevron-right {
                display: inline-block;
                margin-top: -3px;
            }

            .starail-TrainOptions-earlierLaterBtns .starail-Button--blue .starail-Icon-chevron-left, .starail-TrainOptions-earlierLaterBtns .starail-Button--blue .starail-Icon-chevron-right {
                display: none;
            }

    .starail-TrainOptions-mainTabs {
        margin-bottom: 0px;
        margin-bottom: 0;
    }

        .starail-TrainOptions-mainTabs .starail-Tabs-tabs {
            border: none;
            display: block;
            margin: 10px 10px 5px 10px;
            margin: 0.71429rem 0.71429rem 0.35714rem 0.71429rem;
            padding: 12px;
            padding: 0.85714rem;
            background-color: #edeff1;
            width: auto;
        }

        .starail-TrainOptions-mainTabs .starail-Tabs-tab--trainOptions {
            display: none;
            width: auto;
            padding: 0px;
            padding: 0;
        }

            .starail-TrainOptions-mainTabs .starail-Tabs-tab--trainOptions.starail-Tabs-tab--active, .starail-TrainOptions-mainTabs .starail-Tabs-tab--trainOptions.starail-TrainOptions-subtotal {
                padding: 0px;
                display: block;
                background-color: transparent;
            }

                .starail-TrainOptions-mainTabs .starail-Tabs-tab--trainOptions.starail-Tabs-tab--active a, .starail-TrainOptions-mainTabs .starail-Tabs-tab--trainOptions.starail-TrainOptions-subtotal a {
                    background-color: transparent;
                    color: #444;
                }

        .starail-TrainOptions-mainTabs .starail-TrainOptions-mobiletab-title {
            font-size: 14px;
            font-size: 1rem;
            line-height: 21px;
            line-height: 1.5rem;
            margin-bottom: 5px;
            margin-bottom: 0.35714rem;
            font-family: Tahoma, Verdana, Segoe, sans-serif;
        }

        .starail-TrainOptions-mainTabs .starail-TrainOptions-tab-title {
            font-size: 21px;
            font-size: 1.5rem;
        }

        .starail-TrainOptions-mainTabs .starail-TrainOptions-tab-details-date {
            font-size: 14px;
            font-size: 1rem;
            line-height: 21px;
            line-height: 1.5rem;
            font-weight: 700;
        }

        .starail-TrainOptions-mainTabs .starail-TrainOptions-subtotal .starail-TrainOptions-subtotal-details {
            float: none;
            display: inline;
            font-family: Tahoma, Verdana, Segoe, sans-serif;
            font-weight: 400;
            font-size: 14px;
            font-size: 1rem;
            line-height: 21px;
            line-height: 1.5rem;
        }

            .starail-TrainOptions-mainTabs .starail-TrainOptions-subtotal .starail-TrainOptions-subtotal-details p {
                display: inline;
                font-size: 14px;
                font-size: 1rem;
                line-height: 21px;
                line-height: 1.5rem;
            }

            .starail-TrainOptions-mainTabs .starail-TrainOptions-subtotal .starail-TrainOptions-subtotal-details .starail-TrainOptions-subtotal-cost {
                font-size: 14px;
                font-size: 1rem;
                line-height: 21px;
                line-height: 1.5rem;
                font-weight: 700;
            }

        .starail-TrainOptions-mainTabs .starail-TrainOptions-subtotal .starail-TrainOptions-subtotal-passengers {
            display: inline;
            padding: 0px;
            padding: 0;
            text-transform: lowercase;
            font-size: 14px;
            font-size: 1rem;
            line-height: 21px;
            line-height: 1.5rem;
        }

        .starail-TrainOptions-mainTabs .starail-TrainOptions-tab-container {
            margin: 0px;
        }

        .starail-TrainOptions-mainTabs .starail-Tabs-wrapper {
            border: none;
            box-shadow: none;
            padding: 0px 10px;
            padding: 0 0.71429rem;
        }

    .starail-JourneyBlock + .starail-TrainOptions-earlierLaterBtns {
        margin-top: -15px;
        margin-top: -1.07143rem;
        margin-bottom: 5px;
        margin-bottom: 0.35714rem;
    }
}

/* no-js
   ========================================================================== */
/* 

# Typography

## Example

    <div class="starail-Wrapper">

        <h1>Style Guide</h1>

        <h2>Header Level 2</h2>

        <h3>Header Level 3</h3>

        <h4>Header Level 4</h4>

        <h5>Header Level 5</h5>

        <h6>Header Level 6</h6>

        <p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, <ins>ante</ins>. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien <mark>ullamcorper</mark> pharetra. Vestibulum <dfn>erat</dfn> wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum <abbr title="Rut">rutrum</abbr> orci, sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>

        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>

        <p class="Placeholder">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>

        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>

        <blockquote><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p></blockquote>

        <ol>
            <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
            <li>Aliquam tincidunt mauris eu risus.</li>
        </ol>

        <ul>
            <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
            <li>Aliquam tincidunt mauris eu risus.</li>
        </ul>

    </div>

 */
/* Font face
   ========================================================================== */
@font-face {
    font-family: 'CachetStd-Medium';
    src: url('../fonts/CachetStd-Medium.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

/* Base
   ========================================================================== */
html {
    font-size: 14px;
    font-family: Tahoma, Verdana, Segoe, sans-serif;
    color: #444;
}

h1, h2, h3, h4, h5, h6, hgroup, ul, ol, dl, blockquote, p, address, table, fieldset, figure, pre {
    margin: 0 0 20px 0;
    margin: 0 0 1.42857rem 0;
}

/* Headings
   ========================================================================== */
.starail-Wrapper h1, .starail-Wrapper h2, .starail-Wrapper h3, .starail-Wrapper h4, .starail-Wrapper h5, .starail-Wrapper h6 {
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    color: #444;
    font-weight: 700;
    line-height: 1;
}

.starail-Wrapper h1, .starail-Wrapper .starail-u-alpha {
    font-size: 30px;
    font-size: 2.14286rem;
}

.starail-Wrapper h2, .starail-Wrapper .starail-u-beta {
    font-size: 24px;
    font-size: 1.71429rem;
}

.starail-Wrapper h3, .starail-Wrapper .starail-u-gamma {
    font-size: 18px;
    font-size: 1.28571rem;
}

.starail-Wrapper h4, .starail-Wrapper .starail-u-delta {
    font-size: 16px;
    font-size: 1.14286rem;
}

.starail-Wrapper h5, .starail-Wrapper .starail-u-epsilon {
    font-size: 13px;
    font-size: 0.92857rem;
}

.starail-Wrapper h6, .starail-Wrapper .starail-u-zeta {
    font-size: 11px;
    font-size: 0.78571rem;
}

/* Links
   ========================================================================== */
a {
    color: #0c6ab8;
    background: transparent;
    text-decoration: none;
    transition: color 300ms ease-in-out;
}

    a:visited {
        color: #0c6ab8;
    }

    a:hover {
        color: #fb4f14;
    }

    a:focus {
        outline: thin dotted;
        color: black;
    }

    a:active {
        color: #063358;
    }

/* Hr
   ========================================================================== */
hr {
    display: block;
    padding: 0;
    height: 1px;
    border: 0;
    border-top: 1px solid #dddcdc;
    margin: 20px 0;
    margin: 1.42857rem 0;
}

.starail-Type-hr--large {
    margin: 30px 0;
    margin: 2.14286rem 0;
}

/* Title--light
   ========================================================================== */
.starail-Type-title--light {
    color: #FFF !important;
}

/* Pipe
   ========================================================================== */
.starail-Type-pipe {
    color: #dddcdc;
    padding: 0 10px;
    padding: 0 0.71429rem;
}

/* withHR
   ========================================================================== */
.starail-Type-withHR {
    position: relative;
    text-align: center;
    margin: 20px 0;
    margin: 1.42857rem 0;
    font-size: 18px;
    font-size: 1.28571rem;
    font-style: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    font-weight: normal;
    text-transform: uppercase;
    line-height: 1;
    padding: 0 10px;
}

    .starail-Type-withHR:after {
        content: '';
        position: absolute;
        top: 10px;
        left: 0;
        width: 100%;
        height: 1px;
        background-color: #dddcdc;
        z-index: 99;
    }

.starail-Type-withHRText {
    position: relative;
    display: inline-block;
    background-color: #FFF;
    padding: 0 10px;
    z-index: 100;
}

/* Type
   ========================================================================== */
.starail-Type-large {
    font-size: 17px;
    font-size: 1.21429rem;
}

.starail-Type-normal {
    font-weight: normal;
}

.starail-Type-hyphen {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    word-break: break-all;
}

/* Precis
   ========================================================================== */
.starail-Precis {
    font-size: 16px;
    font-size: 1.14286rem;
}

    .starail-Precis a {
        color: #FFF;
        font-weight: bold;
        text-decoration: underline;
    }

/* Page Header 
 =========================================================================== */
.starail-Wrapper .starail-Type-PageHeader {
    text-align: center;
    padding: 0 20px;
    padding: 0 1.42857rem;
}

@media only screen and (max-width: 639px) {
    .starail-Wrapper .starail-Type-PageHeader {
        margin-top: 20px;
        margin-top: 1.42857rem;
        text-align: left;
        font-size: 21px;
        font-size: 1.5rem;
    }
}

/* 

# Wrapper

The page wrapper.

*/
/* Main
   ========================================================================== */
.starail-Wrapper--main {
    box-sizing: border-box;
}

    .starail-Wrapper--main *, .starail-Wrapper--main *:before, .starail-Wrapper--main *:after {
        box-sizing: inherit;
    }

/* Desktop
   ========================================================================== */
@media only screen and (min-width: 1040px) {
    .starail-Wrapper--main {
        margin: 0 -15px;
    }
}

/* IE Fix
   ========================================================================== */
.lt-ie9 .starail-Page-wrap {
    width: 960px;
}

/*

# Accordion

i.e. Inpage Accordion

### Example
    <div class="starail-Wrapper">
       <ul class="starail-Accordion js-accordon">
            <li class="starail-Accordion-item js-accordonItem">

                <div class="starail-Accordion-header js-accordonHeader">
                    <h4 class="starail-Accordion-title">1. Accoridon Title</h4>
                    <button class="starail-Accordion-carat js-accordonButton"><i class="starail-Icon-chevron-down"></i></button>
                </div>

                <div class="starail-Accordion-body">
                    <div class="starail-Accordion-bodyContent">
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>
                    </div>

                </div>
            </li>
            <li class="starail-Accordion-item js-accordonItem is-open">

                <div class="starail-Accordion-header js-accordonHeader">
                    <h4 class="starail-Accordion-title">2. Accoridon Title<br />on two lines</h4>
                    <button class="starail-Accordion-carat js-accordonButton"><i class="starail-Icon-chevron-down"></i></button>
                </div>

                <div class="starail-Accordion-body">
                    <div class="starail-Accordion-bodyContent">
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>
                    </div>

                </div>
            </li>
            <li class="starail-Accordion-item  js-accordonItem">

                <div class="starail-Accordion-header js-accordonHeader">
                    <h4 class="starail-Accordion-title">3. Accoridon Title</h4>
                    <button class="starail-Accordion-carat js-accordonButton"><i class="starail-Icon-chevron-down"></i></button>
                </div>

                <div class="starail-Accordion-body">
                    <div class="starail-Accordion-bodyContent">
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p>
                    </div>

                </div>
            </li>
        </ul>
    </div>

*/
.starail-Wrapper .starail-Accordion {
    list-style: none;
    padding: 0;
}

.starail-Wrapper .starail-Accordion-item .starail-Accordion-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 500ms ease-in-out;
}

.starail-Wrapper .starail-Accordion-item.is-open .starail-Accordion-body {
    max-height: 1000px;
    margin-bottom: 20px;
    margin-bottom: 1.42857rem;
}

.starail-Wrapper .starail-Accordion-item.is-open .starail-Accordion-header {
    background-color: #5595cc;
}

.starail-Wrapper .starail-Accordion-item.is-open .starail-Accordion-carat i:before {
    content: "\e60a";
}

.starail-Wrapper .starail-Accordion-header {
    background-color: #0c6ab8;
    color: white;
    position: relative;
    border-top: 1px solid white;
    cursor: pointer;
}

.starail-Wrapper .starail-Accordion-title {
    color: inherit;
    padding: 15px 20px;
    padding: 1.07143rem 1.42857rem;
    margin: 0;
    line-height: 1;
}

.starail-Wrapper .starail-Accordion-carat {
    position: absolute;
    background: transparent;
    top: 0;
    right: 0;
    padding: 0 20px;
    padding: 0 1.42857rem;
    height: 100%;
    border: 0;
    border-left: 1px solid white;
}

    .starail-Wrapper .starail-Accordion-carat i {
        font-style: normal;
    }

.starail-Wrapper .starail-Accordion-bodyContent {
    padding: 20px 20px 0px 20px;
    padding: 1.42857rem 1.42857rem 0 1.42857rem;
    border: 1px solid #edeff1;
}

/*

# YourBooking

Your booking styles.

*/
/* Component
   ========================================================================== */
.starail-YourBooking {
    background-color: #edeff1;
    padding: 30px 30px 20px 30px;
    padding: 2.14286rem 2.14286rem 1.42857rem 2.14286rem;
    margin-bottom: 30px;
    margin-bottom: 2.14286rem;
    box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.1);
}

.starail-Wrapper .starail-YourBooking h2 {
    color: #1b365d;
    font-size: 21px;
    font-size: 1.5rem;
}

.starail-YourBooking-table {
    display: table;
    width: 100%;
}

.starail-YourBooking-ticketDetails {
    background-color: #FFF;
    display: table-row;
    width: 100%;
}

    .starail-YourBooking-ticketDetails > div {
        display: table-cell;
        vertical-align: middle;
        border-bottom: 1px solid #edeff1;
        padding: 10px;
        font-size: 14px;
        font-size: 1rem;
    }

        .starail-YourBooking-ticketDetails > div.starail-YourBooking-col-price {
            padding-right: 20px;
            padding-right: 1.42857rem;
        }

        .starail-YourBooking-ticketDetails > div p {
            margin: 0px 0px 2px 0px;
            margin: 0 0 0.14286rem 0;
        }

    .starail-YourBooking-ticketDetails .starail-Icon-shield {
        color: #0c6ab8;
        font-size: 21px;
        font-size: 1.5rem;
    }

.starail-YourBooking-passProtection {
    background-color: #FFF;
    width: 100%;
}

    .starail-YourBooking-passProtection > div {
        border-bottom: 1px solid #edeff1;
        padding: 20px 10px;
        padding: 20px 10px;
        padding: 1.42857rem 0.71429rem;
        font-size: 14px;
        font-size: 1rem;
    }

    .starail-YourBooking-passProtection h3 {
        font-size: 21px;
        font-size: 1.5rem;
        margin: 0px 0px 8px 0px;
        margin: 0 0 0.57143rem 0;
    }

        .starail-YourBooking-passProtection h3 i {
            font-size: 21px;
            font-size: 1.5rem;
            margin: -4px 8px 0px 0px;
            margin: -0.28571rem 0.57143rem 0 0;
            color: #0c6ab8;
        }

    .starail-YourBooking-passProtection p {
        margin: 0px;
        margin: 0;
    }

.starail-YourBooking-title {
    font-weight: 700;
}

.starail-YourBooking-ticketDetails--header {
    font-weight: 700;
    white-space: nowrap;
}

.starail-YourBooking-col-center {
    text-align: center;
}

.starail-YourBooking-col-price {
    width: 11%;
    text-align: right;
    font-weight: bold;
}

.starail-YourBooking-ticketDetails.starail-YourBooking-ticketDetails--header .starail-YourBooking-col-price {
    text-align: center;
    padding-right: 10px;
    padding-right: 0.71429rem;
}

.starail-YourBooking-col-price-wInput {
    text-align: left;
    width: 19%;
}

    .starail-YourBooking-col-price-wInput .starail-YourBooking-col-price-title {
        font-weight: bold;
        margin-right: 10px;
        margin-right: 0.71429rem;
    }

    .starail-YourBooking-col-price-wInput input {
        display: inline-block;
        width: 60px;
        margin-left: 10px;
        margin-left: 0.71429rem;
        padding: 8px 10px;
        padding: 0.57143rem 0.71429rem;
    }

.starail-YourBooking-col-delete {
    width: 6%;
    text-align: center;
}

.starail-YourBooking-extraRow {
    background-color: #FFF;
    margin-top: 10px;
    margin-top: 0.71429rem;
    font-size: 14px;
    font-size: 1rem;
    font-weight: bold;
    overflow: hidden;
}

    .starail-YourBooking-extraRow > p {
        margin: 0px;
        margin: 0;
    }

.starail-YourBooking-extraRow-title {
    float: left;
    padding: 10px 5px 10px 10px;
    padding: 0.71429rem 0.35714rem 0.71429rem 0.71429rem;
}

.starail-YourBooking-extraRow-price {
    float: right;
    text-align: right;
    width: 11%;
    padding: 10px 20px 10px 5px;
    padding: 0.71429rem 1.42857rem 0.71429rem 0.35714rem;
}

.starail-YourBooking-totalPrice {
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    font-weight: 700;
    color: #1b365d;
    text-align: right;
    text-transform: uppercase;
    font-size: 17px;
    font-size: 1.21429rem;
    margin: 20px 0px 0px 0px;
    margin: 1.42857rem 0 0 0;
    text-transform: uppercase;
}

    .starail-YourBooking-totalPrice .starail-YourBooking-totalPrice-amount {
        font-size: 30px;
        font-size: 2.14286rem;
    }

.starail-YourBooking-totalPrice-highlight {
    color: #f47c30;
}

.starail-YourBooking-btn {
    position: absolute;
    top: 20px;
    right: 30px;
    padding: 8px 30px;
    padding: 0.57143rem 2.14286rem;
}

    .starail-YourBooking-btn i {
        margin-right: 5px;
    }

.starail-YourBooking-receipt {
    position: absolute;
    bottom: 20px;
    left: 30px;
    font-size: 14px;
    font-size: 1rem;
}

    .starail-YourBooking-receipt i {
        margin-right: 5px;
    }

/* Modifier 
   ========================================================================== */
.starail-YourBooking--confirmation {
    position: relative;
}

    .starail-YourBooking--confirmation h2 {
        margin-bottom: 30px;
        margin-bottom: 2.14286rem;
        padding-right: 350px;
        padding-right: 25rem;
    }

@media only screen and (max-width: 639px) {
    .starail-YourBooking--confirmation.starail-YourBooking {
        padding: 0;
    }
}

/* Desktop
   ========================================================================== */
/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-YourBooking {
        background-color: #FFF;
        box-shadow: none;
        padding: 10px;
        padding: 0.71429rem;
    }

    .starail-Wrapper .starail-YourBooking h2 {
        color: #444;
        font-size: 21px;
        font-size: 1.5rem;
        padding: 10px 10px 20px 10px;
        padding: 0.71429rem 0.71429rem 1.42857rem 0.71429rem;
        margin: 0px;
        margin: 0;
    }

    .starail-YourBooking--paymentConfirm {
        background-color: #edeff1;
        margin-bottom: 20px;
        margin-bottom: 1.42857rem;
    }

    .starail-Wrapper .starail-YourBooking--paymentConfirm h2 {
        font-size: 17px;
        font-size: 1.21429rem;
    }

    .starail-YourBooking--paymentConfirm .starail-YourBooking-totalPrice, .starail-YourBooking--paymentConfirm .starail-YourBooking-extraRow {
        margin-top: 0px;
        margin-top: 0;
        background-color: #edeff1;
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        text-transform: uppercase;
        font-size: 17px;
        font-size: 1.21429rem;
    }

    .starail-YourBooking--paymentConfirm .starail-YourBooking-totalPrice {
        text-align: left;
    }

    .starail-YourBooking--paymentConfirm .starail-YourBooking-totalPrice-amount {
        float: right;
    }

    .starail-YourBooking--paymentConfirm .starail-YourBooking-ticketDetails:last-child {
        margin-bottom: 5px;
        margin-bottom: 0.35714rem;
    }

    .starail-YourBooking-extraRow-price {
        width: 30%;
        padding-right: 10px;
        padding-right: 0.71429rem;
    }

    .starail-YourBooking-table {
        display: block;
        width: 100%;
    }

    .starail-YourBooking-ticketDetails {
        display: block;
        border: 1px solid #edeff1;
        overflow: hidden;
        position: relative;
        box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
        margin-bottom: 20px;
        margin-bottom: 1.42857rem;
        padding: 10px 10px 50px 10px;
        padding: 0.71429rem 0.71429rem 3.57143rem 0.71429rem;
        overflow: hidden;
    }

        .starail-YourBooking-ticketDetails > div {
            display: block;
            border-bottom: none;
            padding: 5px 5px 0 0;
        }

        .starail-YourBooking-ticketDetails .starail-YourBooking-col-delete {
            padding: 0 0 5px 0;
        }

        .starail-YourBooking-ticketDetails .starail-YourBooking-mobileTrigger, .starail-YourBooking-ticketDetails .starail-YourBooking-mobileHeader {
            padding: 0px;
            font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
            font-weight: 700;
            text-transform: uppercase;
            font-size: 17px;
            font-size: 1.21429rem;
            position: relative;
        }

            .starail-YourBooking-ticketDetails .starail-YourBooking-mobileTrigger a, .starail-YourBooking-ticketDetails .starail-YourBooking-mobileHeader a {
                color: #444;
                border-bottom: 1px solid #edeff1;
                display: block;
                padding: 5px 30px 10px 0px;
                padding: 0.35714rem 2.14286rem 0.71429rem 0;
            }

                .starail-YourBooking-ticketDetails .starail-YourBooking-mobileTrigger a .starail-YourBooking-light, .starail-YourBooking-ticketDetails .starail-YourBooking-mobileHeader a .starail-YourBooking-light {
                    color: #888888;
                }

            .starail-YourBooking-ticketDetails .starail-YourBooking-mobileTrigger i, .starail-YourBooking-ticketDetails .starail-YourBooking-mobileHeader i {
                position: absolute;
                right: 5px;
                top: 8px;
                color: #0c6ab8;
            }

        .starail-YourBooking-ticketDetails .starail-YourBooking-mobileHeader {
            color: #444;
            border-bottom: 1px solid #edeff1;
            display: block;
            padding: 0px 30px 8px 0px;
            padding: 0 2.14286rem 0.57143rem 0;
        }

        .starail-YourBooking-ticketDetails .starail-YourBooking-col-price, .starail-YourBooking-ticketDetails .starail-YourBooking-col-price-wInput {
            position: absolute;
            bottom: 0px;
            top: auto;
            right: 0px;
            clear: both;
            float: none;
            width: 100%;
            font-size: 17px;
            font-size: 1.21429rem;
            padding: 0px 10px;
            padding: 0 0.71429rem;
        }

            .starail-YourBooking-ticketDetails .starail-YourBooking-col-price p, .starail-YourBooking-ticketDetails .starail-YourBooking-col-price-wInput p {
                padding: 10px 5px;
                padding: 0.71429rem 0.35714rem;
                border-top: 1px solid #edeff1;
            }

        .starail-YourBooking-ticketDetails .starail-YourBooking-col-price {
            text-align: right;
        }

            .starail-YourBooking-ticketDetails .starail-YourBooking-col-price p {
                height: 43px;
            }

        .starail-YourBooking-ticketDetails .starail-YourBooking-col-price-wInput p {
            padding-right: 25px;
            padding-right: 1.78571rem;
            height: 65px;
        }

        .starail-YourBooking-ticketDetails.starail-YourBooking-ticketDetails--four-pass {
            padding: 10px 10px 85px 10px;
            padding: 0.71429rem 0.71429rem 6.07143rem 0.71429rem;
        }

            .starail-YourBooking-ticketDetails.starail-YourBooking-ticketDetails--four-pass .starail-YourBooking-col-delete {
                position: absolute;
                bottom: 15px;
                right: 10px;
                z-index: 20;
                width: auto;
            }

                .starail-YourBooking-ticketDetails.starail-YourBooking-ticketDetails--four-pass .starail-YourBooking-col-delete i {
                    text-align: right;
                }

            .starail-YourBooking-ticketDetails.starail-YourBooking-ticketDetails--four-pass .starail-YourBooking-col {
                padding: 10px 0px 0px 0px;
                padding: 0.71429rem 0 0 0;
            }

        .starail-YourBooking-ticketDetails.starail-YourBooking-ticketDetails--closed {
            padding-bottom: 4px;
            padding-bottom: 0.28571rem;
        }

            .starail-YourBooking-ticketDetails.starail-YourBooking-ticketDetails--closed > div {
                display: none;
            }

                .starail-YourBooking-ticketDetails.starail-YourBooking-ticketDetails--closed > div.starail-YourBooking-mobileTrigger {
                    display: block;
                }

                    .starail-YourBooking-ticketDetails.starail-YourBooking-ticketDetails--closed > div.starail-YourBooking-mobileTrigger a {
                        border-bottom: none;
                    }

                    .starail-YourBooking-ticketDetails.starail-YourBooking-ticketDetails--closed > div.starail-YourBooking-mobileTrigger .starail-Icon-chevron-up:before {
                        content: "\e609";
                    }

        .starail-YourBooking-ticketDetails .starail-Icon-shield {
            font-size: 14px;
            font-size: 1rem;
            margin-right: 3px;
            margin-right: 0.21429rem;
        }

    .starail-YourBooking-col-center, .starail-YourBooking-col, .starail-YourBooking-col-delete {
        float: left;
        width: 50%;
        text-align: left;
    }

        .starail-YourBooking-col-center .starail-u-hideDesktop, .starail-YourBooking-col .starail-u-hideDesktop, .starail-YourBooking-col-delete .starail-u-hideDesktop {
            font-weight: 700;
        }

    .starail-YourBooking-col--mobileFullWidth {
        width: 100%;
        clear: both;
    }

    .starail-YourBooking-passProtection {
        overflow: hidden;
        background-color: #edeff1;
    }

        .starail-YourBooking-passProtection > * {
            text-align: center;
        }

    .starail-Wrapper .starail-YourBooking-passProtection h3 {
        font-size: 17px;
        font-size: 1.21429rem;
    }

    .starail-YourBooking-totalPrice {
        background-color: #edeff1;
        color: #1b365d;
        text-align: left;
        overflow: hidden;
        margin-top: 20px;
        margin-top: 1.42857rem;
        padding: 15px 10px;
        padding: 1.07143rem 0.71429rem;
    }

        .starail-YourBooking-totalPrice .starail-YourBooking-totalPrice-title {
            float: left;
            max-width: 70%;
        }

        .starail-YourBooking-totalPrice .starail-YourBooking-totalPrice-amount {
            font-size: 21px;
            font-size: 1.5rem;
            float: right;
            max-width: 30%;
        }

    .starail-YourBooking-btn {
        position: relative;
        top: 0px;
        right: 0px;
        width: 100%;
        margin-bottom: 10px;
        margin-bottom: 0.71429rem;
    }

        .starail-YourBooking-btn i {
            font-size: 20px;
            font-size: 1.42857rem;
            margin-top: -2px;
        }

    .starail-YourBooking-receipt {
        position: relative;
        bottom: 0px;
        left: 0px;
        width: 100%;
        display: block;
        background-color: #0c6ab8;
        color: #FFF;
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        font-weight: 700;
        font-size: 17px;
        font-size: 1.21429rem;
        padding: 11px 10px;
        padding: 0.78571rem 0.71429rem;
        text-align: center;
        text-transform: uppercase;
        margin-top: 20px;
        margin-top: 1.42857rem;
    }

        .starail-YourBooking-receipt:hover, .starail-YourBooking-receipt:active, .starail-YourBooking-receipt:focus, .starail-YourBooking-receipt:visited {
            color: #FFF;
        }

        .starail-YourBooking-receipt i {
            margin-top: -2px;
        }

    .starail-YourBooking--passPrices {
        margin-bottom: 0;
        padding-bottom: 0;
    }
}

/* no-js
   ========================================================================== */
/*

# CalloutBox

i.e. Box at top of Pass selction page

### Example
    <div class="starail-Wrapper"><!-- Page Wrapper -->

        <section class="starail-CalloutBox">
            <h3>This pass is great because...</h3>
            <ul class="starail-Checklist">
                <li>Nibh urna inceptos at ut eleifend sagittis, libero ipsum sed officia elit orci, sociosqu erat justo pellentesque ut orci.</li>
                <li>Nibh urna inceptos at ut eleifend sagittis, libero ipsum sed officia elit orci, sociosqu erat justo pellentesque ut orci.</li>
                <li>Nibh urna inceptos at ut eleifend sagittis, libero ipsum sed of lentesque ut orci.</li>
            </ul>
        </section>

    </div><!-- /Page Wrapper -->      

*/
.starail-Wrapper {
    /* Mobile Full
    ========================================================================== */
}

    .starail-Wrapper .starail-CalloutBox {
        padding: 20px 20px 20px 20px;
        padding: 1.42857rem 1.42857rem 1.42857rem 1.42857rem;
        max-width: 620px;
        max-width: 44.28571rem;
        margin: 0 auto 20px auto;
        margin: 0 auto 1.42857rem auto;
        background-color: #edeff1;
    }

@media only screen and (max-width: 639px) {
    .starail-Wrapper .starail-CalloutBox--mobileFull {
        margin: 0 -20px 20px -20px;
        margin: 0 -1.42857rem 1.42857rem -1.42857rem;
    }
}

/*

# Checklist

i.e. List with tick circles



### Example

    <div class="starail-Wrapper"><!-- Page Wrapper -->

        <ul class="starail-Checklist">
            <li>Nibh urna inceptos at ut eleifend sagittis, libero ipsum sed officia elit orci, sociosqu erat justo pellentesque ut orci.</li>
            <li>Nibh urna inceptos at ut eleifend sagittis, libero ipsum sed officia elit orci, sociosqu erat justo pellentesque ut orci.</li>
            <li>Nibh urna inceptos at ut eleifend sagittis, libero ipsum sed of lentesque ut orci.</li>
        </ul>

    </div><!-- /Page Wrapper -->

*/
.starail-Wrapper .starail-Checklist {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .starail-Wrapper .starail-Checklist li {
        margin: 15px 0 0 0;
        margin: 1.07143rem 0 0 0;
        padding: 0 0 0 25px;
        padding: 0 0 0 1.78571rem;
        position: relative;
    }

        .starail-Wrapper .starail-Checklist li:before {
            content: "\e60c";
            font-family: 'icomoon';
            display: inline-block;
            color: #0c6ab8;
            font-size: 18px;
            font-size: 1.28571rem;
            position: absolute;
            left: 0;
            top: 0;
            /* Better Font Rendering =========== */
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

/*

# Offer

Used for crossell adverts

### Modifiers


### Example

    <a class="starail-Offer" href="#" target="_blank">

        <div class="starail-Offer-content">
            <h3 class="starail-Offer-title starail-Offer-title--primary">Cross Sale Ad On Two Lines</h3>
            <h4 class="starail-Offer-title starail-Offer-title--secondary">From &pound;547</h4>
        </div>

        <div class="starail-Offer-more">
            <p>This is a hover state that reveals short detail on cross ad.</p>
        </div>


        <img src="http://lorempixel.com/480/300/" alt="Offer Alt" class="starail-Offer-image" />

    </a><!-- .starail-Offer -->

*/
/* Component
   ========================================================================== */
.starail-Offer {
    display: block;
    position: relative;
    overflow: hidden;
    height: 220px;
    max-width: 320px;
    margin: 0 auto 20px auto;
}

    .starail-Offer .starail-Offer-content {
        position: relative;
        margin: 20px;
        margin: 1.42857rem;
        z-index: 101;
        max-width: 170px;
    }

    .starail-Offer .starail-Offer-title {
        color: #FFF;
        margin: 0;
        display: inline-block;
        padding: 10px;
        padding: 0.71429rem;
        background-color: #000;
        background-color: rgba(0, 0, 0, 0.7);
    }

    .starail-Offer .starail-Offer-title--primary {
        font-size: 21px;
        font-size: 1.5rem;
        margin-bottom: -3px;
        line-height: 1.2;
    }

    .starail-Offer .starail-Offer-title--secondary {
        font-size: 16px;
        font-size: 1.14286rem;
        padding-top: 0;
        text-transform: none;
        font-weight: 400;
    }

    .starail-Offer .starail-Offer-image {
        position: absolute;
        top: -9999px;
        /* http://stackoverflow.com/questions/14562457/center-oversized-image-in-div */
        bottom: -9999px;
        left: -9999px;
        right: -9999px;
        margin: auto;
        min-width: 100%;
        min-height: 100%;
        max-width: none;
        z-index: 99;
    }

    .starail-Offer .starail-Offer-more {
        position: absolute;
        bottom: 20px;
        left: 20px;
        right: 20px;
        padding: 10px;
        padding: 0.71429rem;
        color: #FFF;
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0);
        transition: opacity 300ms ease-in-out;
        z-index: 100;
        background-color: #0c6ab8;
    }

        .starail-Offer .starail-Offer-more p {
            margin: 0;
        }

    .starail-Offer:hover .starail-Offer-more, .starail-Offer:focus .starail-Offer-more {
        opacity: 0.9;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
        filter: alpha(opacity=90);
    }

/* Modifiers
   ========================================================================== */
/*
# Image scroller

For scrollable images on mobile.

## Example
     <div class="starail-ImageScroller">
        <div class="starail-ImageScroller-inner starail-u-cf">
            <img src="http://lorempixel.com/300/200/" alt="Image Alt" class="starail-ImageScroller-image" />
            <img src="http://lorempixel.com/300/200/" alt="Image Alt" class="starail-ImageScroller-image" />
        </div>
    </div>
 */
/* Component
   ========================================================================== */
.starail-ImageScroller {
    max-width: 630px;
    overflow: hidden;
    margin: 0 0 20px 0;
    margin: 0 0 1.42857rem 0;
}

.starail-ImageScroller-inner {
    margin: 0 0 0 -20px;
    margin: 0 0 0 -1.42857rem;
}

.starail-ImageScroller-image {
    display: block;
    float: left;
    margin: 0 0 0 20px;
    margin: 0 0 0 1.42857rem;
}

/* Mobile Only
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-ImageScroller {
        overflow-x: scroll;
        /* has to be scroll, not auto */
        -webkit-overflow-scrolling: touch;
    }

    .starail-ImageScroller-inner {
        width: 580px;
    }

    .starail-ImageScroller-image {
        width: 260px;
    }
}

/*

# CTA List

List of CTAs

### Example

    <ul class="starail-CtaList starail-u-cf">

        <li class="starail-CtaList-item">
            <a href="#" class="starail-CtaList-link starail-CtaList-link--call">
                <span class="starail-CtaList-iconContainer"><i class="starail-Icon-phone"></i></span>
                <span class="starail-CtaList-content">Give us a call</span>
            </a>
        </li>

        <li class="starail-CtaList-item">
            <a href="#" class="starail-CtaList-link starail-CtaList-link--book">
                <span class="starail-CtaList-iconContainer"><i class="starail-Icon-calendar-tick"></i></span>
                <span class="starail-CtaList-content">Book an appointment</span>
            </a>
        </li>

        <li class="starail-CtaList-item">
            <a href="#" class="starail-CtaList-link starail-CtaList-link--pin">
                <span class="starail-CtaList-iconContainer"><i class="starail-Icon-map-pin"></i></span>
                <span class="starail-CtaList-content">Find a store</span>
            </a>
        </li>

        <li class="starail-CtaList-item">
            <a href="#" class="starail-CtaList-link starail-CtaList-link--email">
                <span class="starail-CtaList-iconContainer"><i class="starail-Icon-email"></i></span>
                <span class="starail-CtaList-content">Email us</span>
            </a>
        </li>

    </ul>

*/
/* Component
   ========================================================================== */
.starail-CtaList {
    padding: 0;
    margin: 0 0 20px -20px;
    margin: 0 0 1.42857rem -1.42857rem;
    list-style: none;
}

.starail-CtaList-item {
    display: block;
    width: 25%;
    float: left;
    padding: 0 0 0 20px;
    padding: 0 0 0 1.42857rem;
}

.starail-CtaList-link {
    border: 1px solid #f49266;
    color: #444;
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    font-weight: bold;
    display: table;
    table-layout: fixed;
    width: 100%;
    transition: all 300ms ease-in-out;
    text-transform: uppercase;
    font-size: 14px;
    font-size: 1rem;
}

    .starail-CtaList-link:visited {
        color: #444;
    }

    .starail-CtaList-link:hover, .starail-CtaList-link:focus {
        color: #FFF;
    }

.starail-CtaList-iconContainer {
    position: relative;
    vertical-align: middle;
    display: table-cell;
    width: 30px;
    background-color: #f49266;
    text-align: center;
}

    .starail-CtaList-iconContainer [class^="starail-Icon-"], .starail-CtaList-iconContainer [class*=" starail-Icon-"] {
        color: #FFF;
        margin-top: -2px;
    }

    .starail-CtaList-iconContainer:after {
        content: '';
        position: absolute;
        top: 16px;
        right: -4px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 5px 0 5px 5px;
        border-color: transparent transparent transparent #f49266;
    }

.starail-CtaList-content {
    vertical-align: middle;
    display: table-cell;
    padding: 10px 8px;
    padding: 0.71429rem 0.57143rem;
}

/* Modifiers
   ========================================================================== */
.starail-CtaList-link--call {
    border-color: #f49266;
}

    .starail-CtaList-link--call:hover, .starail-CtaList-link--call:focus {
        background-color: #f49266;
    }

    .starail-CtaList-link--call .starail-CtaList-iconContainer {
        background-color: #f49266;
    }

        .starail-CtaList-link--call .starail-CtaList-iconContainer:after {
            border-color: transparent transparent transparent #f49266;
        }

.starail-CtaList-link--book {
    border-color: #49176e;
}

    .starail-CtaList-link--book:hover, .starail-CtaList-link--book:focus {
        background-color: #49176e;
    }

    .starail-CtaList-link--book .starail-CtaList-iconContainer {
        background-color: #49176e;
    }

        .starail-CtaList-link--book .starail-CtaList-iconContainer:after {
            border-color: transparent transparent transparent #49176e;
        }

.starail-CtaList-link--pin {
    border-color: #f8c700;
}

    .starail-CtaList-link--pin:hover, .starail-CtaList-link--pin:focus {
        background-color: #f8c700;
    }

    .starail-CtaList-link--pin .starail-CtaList-iconContainer {
        background-color: #f8c700;
    }

        .starail-CtaList-link--pin .starail-CtaList-iconContainer:after {
            border-color: transparent transparent transparent #f8c700;
        }

.starail-CtaList-link--email {
    border-color: #8246b2;
}

    .starail-CtaList-link--email:hover, .starail-CtaList-link--email:focus {
        background-color: #8246b2;
    }

    .starail-CtaList-link--email .starail-CtaList-iconContainer {
        background-color: #8246b2;
    }

        .starail-CtaList-link--email .starail-CtaList-iconContainer:after {
            border-color: transparent transparent transparent #8246b2;
        }

/* Mobile Only
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-CtaList-item {
        width: 100%;
        float: none;
        margin: 0 0 10px 0;
        margin: 0 0 0.71429rem 0;
        font-weight: bold;
    }

        .starail-CtaList-item .starail-CtaList-link {
            font-size: 15px;
            font-size: 1.07143rem;
        }
}

/*

# PassChoiceTable

Large table on pass selection page

*/
.starail-Wrapper .starail-PassChoiceTable {
    font-size: 14px;
    font-size: 1rem;
}

    .starail-Wrapper .starail-PassChoiceTable input[type=number], .starail-Wrapper .starail-PassChoiceTable input[type=text] {
        max-width: 3em;
        margin-left: 15px;
        margin-left: 1.07143rem;
        margin-right: 15px;
        margin-right: 1.07143rem;
    }

.starail-Wrapper .starail-PassChoiceTable-extraInfo {
    margin: 10px 0px 0px 0px;
    margin: 0.71429rem 0 0 0;
    width: 100%;
    max-width: 640px;
    line-height: 1.3em;
}

.starail-Wrapper .starail-PassChoiceTable-col {
    width: 25%;
    padding: 0;
    margin: 0;
    display: block;
    float: left;
}

.starail-Wrapper .starail-PassChoiceTable-bigCol {
    width: 75%;
    padding: 0;
    margin: 0;
    display: block;
    float: left;
}

    .starail-Wrapper .starail-PassChoiceTable-bigCol .starail-PassChoiceTable-col {
        width: 33.33%;
    }

.starail-Wrapper .starail-PassChoiceTable-headerRow {
    border-bottom: 1px solid #0c6ab8;
    padding: 15px 0;
    padding: 1.07143rem 0;
    font-weight: bold;
}

.starail-Wrapper .starail-PassChoiceTable-row {
    border-bottom: 1px solid #edeff1;
    padding: 15px 0;
    padding: 1.07143rem 0;
}

.starail-Wrapper .starail-PassChoiceTable-passDetails {
    display: none;
}

.starail-Wrapper .starail-PassChoiceTable-mobileLabel {
    display: none;
}

.starail-Wrapper .starail-PassChoiceTable-footer {
    margin: 25px 0;
    margin: 1.78571rem 0;
}

.starail-Wrapper .starail-PassChoiceTable-totalContainer {
    background-color: #edeff1;
    padding: 25px;
    padding: 1.78571rem;
    margin-bottom: 15px;
    margin-bottom: 1.07143rem;
}

    .starail-Wrapper .starail-PassChoiceTable-totalContainer table {
        margin: 0;
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        text-transform: uppercase;
        font-weight: bold;
        width: 100%;
    }

.starail-Wrapper .starail-PassChoiceTable-description {
    width: 80%;
    text-align: right;
    font-size: 17px;
    font-size: 1.21429rem;
}

.starail-Wrapper .starail-PassChoiceTable-total {
    width: 20%;
    text-align: right;
    font-size: 30px;
    font-size: 2.14286rem;
}

.starail-Wrapper .starail-PassChoiceTable-protect h3 {
    font-size: 21px;
    font-size: 1.5rem;
    margin-bottom: 10px;
    margin-bottom: 0.71429rem;
}

.starail-Wrapper .starail-PassChoiceTable-protect p {
    font-size: 14px;
    font-size: 1rem;
}

.starail-Wrapper .starail-PassChoiceTable-protect .starail-Icon-shield {
    color: #0c6ab8;
    font-size: 21px;
    font-size: 1.5rem;
    margin-right: 10px;
    margin-right: 0.71429rem;
    margin-top: -4px;
    margin-top: -0.28571rem;
}

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Wrapper .starail-PassChoiceTable {
        font-size: 15px;
        font-size: 1.07143rem;
    }

        .starail-Wrapper .starail-PassChoiceTable input[type=number], .starail-Wrapper .starail-PassChoiceTable input[type=text] {
            margin-left: 7px;
            margin-left: 0.5rem;
            margin-right: 7px;
            margin-right: 0.5rem;
        }

    .starail-Wrapper .starail-PassChoiceTable-extraInfo {
        padding: 0px 10px 10px;
        padding: 0 0.71429rem 0.71429rem;
        font-size: 14px;
        font-size: 1rem;
    }

    .starail-Wrapper .starail-PassChoiceTable-headerRow {
        display: none;
    }

    .starail-Wrapper .starail-PassChoiceTable-col {
        width: 100%;
        float: none;
    }

    .starail-Wrapper .starail-PassChoiceTable-bigCol {
        width: 100%;
        padding: 0 10px;
        padding: 0 0.71429rem;
        margin: 0;
        display: block;
        float: none;
    }

        .starail-Wrapper .starail-PassChoiceTable-bigCol .starail-PassChoiceTable-col {
            width: 100%;
        }

    .starail-Wrapper .starail-PassChoiceTable-header {
        font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
        font-weight: bold;
        font-size: 16px;
        font-size: 1.14286rem;
        text-transform: uppercase;
    }

    .starail-Wrapper .starail-PassChoiceTable-passDetails {
        font-size: 14px;
        font-size: 1rem;
    }

    .starail-Wrapper .starail-PassChoiceTable-inputContainer {
        text-align: right;
    }

    .starail-Wrapper .starail-PassChoiceTable-mobileLabel {
        display: inline;
        vertical-align: middle;
        float: left;
    }

    .starail-Wrapper .starail-PassChoiceTable-inputContainer {
        margin: 0 0 10px 0;
        margin: 0 0 0.71429rem 0;
    }

    .starail-Wrapper .starail-PassChoiceTable-header {
        padding: 10px;
        padding: 0.71429rem;
        position: relative;
        /*background: red;*/
    }

        .starail-Wrapper .starail-PassChoiceTable-header:after {
            content: "\e609";
            font-family: 'icomoon';
            display: inline-block;
            color: #0c6ab8;
            font-size: 18px;
            font-size: 1.28571rem;
            position: absolute;
            top: 50%;
            margin-top: -10px;
            margin-top: -0.71429rem;
            right: 10px;
            right: 0.71429rem;
            /* Better Font Rendering =========== */
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

    .starail-Wrapper .starail-PassChoiceTable-bigCol {
        max-height: 0;
        overflow: hidden;
        transition: max-height 500ms ease-in-out;
    }

    .starail-Wrapper .starail-PassChoiceTable-row {
        padding: 0;
    }

        .starail-Wrapper .starail-PassChoiceTable-row.is-open .starail-PassChoiceTable-bigCol {
            max-height: 1000px;
            overflow: hidden;
            margin-bottom: 20px;
            margin-bottom: 1.42857rem;
        }

        .starail-Wrapper .starail-PassChoiceTable-row.is-open .starail-PassChoiceTable-header:after {
            content: "\e60a";
        }

    .starail-Wrapper .starail-PassChoiceTable-protect {
        text-align: center;
        background-color: #edeff1;
        padding: 20px;
        padding: 1.42857rem;
        margin: 20px;
        margin: 1.42857rem;
    }

        .starail-Wrapper .starail-PassChoiceTable-protect p {
            margin-bottom: 0;
        }

    .starail-Wrapper .starail-PassChoiceTable-totalContainer {
        margin: 20px;
        margin: 1.42857rem;
        padding: 15px;
        padding: 1.07143rem;
        color: #1b365d;
    }

    .starail-Wrapper .starail-PassChoiceTable-description {
        text-align: left;
        font-size: 17px;
        font-size: 1.21429rem;
        line-height: 1.1;
    }

    .starail-Wrapper .starail-PassChoiceTable-total {
        font-size: 21px;
        font-size: 1.5rem;
    }

    .starail-Wrapper .starail-Section-nextButtonSection button {
        display: block;
        margin-right: auto;
        margin-left: auto;
    }

    .starail-Wrapper .starail-PassChoiceTable-footer, .starail-Wrapper .starail-PassChoiceTable-totalContainer {
        margin-bottom: 0;
    }
}

/* IE8
   ========================================================================== */
.lt-ie9 .starail-Wrapper .starail-PassChoiceTable-totalContainer {
    margin-bottom: 0;
}

/*

# Tag

i.e. Promotion callout image widget for homepage image links

### Modifiers

- .starail-Tag--bestSeller - used for best seller tag 
- .starail-Tag--specialOffer - used for special offer tag

### Example
    <div class="starail-Wrapper" style="position: relative; width: 200px; height: 200px; background-color: #CCCCCC; ">
        <div class="starail-Tag starail-Tag--specialOffer">
         </div>
    </div>

*/
.starail-Tag {
    position: absolute;
    width: 80px;
    width: 100px;
    height: 80px;
    height: 18px;
    top: 12px;
    right: 15px;
    background: no-repeat;
    background-size: inherit;
    transition: opacity .3s ease-in-out;
}

.starail-Tag--bestSeller {
    background-image: url(../img/tags/best-seller-sta.png); /*sta*/
}

.starail-Tag--specialOffer {
    background-image: url(../img/tags/special-offer-sta.png); /*sta*/
}

.lt-ie9 .starail-Tag--bestSeller {
    background-image: url(../img/tags/best-seller-sta.png); /*sta*/
}

.lt-ie9 .starail-Tag--specialOffer {
    background-image: url(../img/tags/special-offer-sta.png); /*sta*/
}
/*

# Back

### Example

    <div class="starail-u-cf" style="width: 500px; height: 150px; margin: 0 auto; position: relative;">
        <div class="starail-Back starail-u-hideMobile">
            <a href="#" class="starail-Back-link"><i class="starail-Icon-chevron-left"></i> Back</a>
        </div>
    </div>

    

*/
/* ==========================================================================
   Back
   ========================================================================== */
/* Component
   ========================================================================== */
.starail-Back {
    padding: 20px;
    padding: 1.42857rem;
    text-transform: uppercase;
    font-family: 'Titillium Web', Tahoma, Verdana, Segoe, sans-serif;
    font-weight: 700;
    font-size: 18px;
    font-size: 1.28571rem;
}

    .starail-Back .starail-Back-link {
        color: #0c6ab8;
        text-decoration: none;
    }

        .starail-Back .starail-Back-link:hover, .starail-Back .starail-Back-link:focus {
            color: #fb4f14;
        }

        .starail-Back .starail-Back-link:visited {
            color: #0c6ab8;
        }

    .starail-Back [class^="starail-Icon-"], .starail-Back [class*=" starail-Icon-"] {
        margin-top: -4px;
    }


/*sta*/
.sta-datepic {
    display: inline-block;
    width: 48%;
    vertical-align: top;
}

    /*sta*/
    .sta-datepic .starail-Form-datePicker { /*sta*/
        background: #1a365e;
        width: 184px;
        padding-left: 45px;
        margin-right: 20px;
        padding-right: 0;
        position: relative;
    }

        .sta-datepic .starail-Form-datePicker::before { /*sta*/
            content: "\f073";
            font-family: FontAwesome;
            left: 12px;
            position: absolute;
            top: 11px;
            color: #fff;
            font-size: 20px;
        }

    .sta-datepic .starail-Form-inputContainer--inputGroup .starail-Form-datePicker i { /*sta*/
        left: 33px;
        right: auto;
        display: none;
        background-color: #FFF;
    }

.starail-SearchTickets-switch-trigger.sta-both-arrow i { /*sta*/
    display: none;
}

.starail-SearchTickets-switch-trigger.sta-both-arrow { /*sta*/
    background: url(../img/double-arrow.png) no-repeat left top;
    width: 14px;
    height: 38px;
}


/* Desktop
   ========================================================================== */
@media only screen and (min-width: 640px) {
    .starail-Back {
        position: absolute;
        top: 0;
        left: -170px;
        width: 132px;
        text-align: right;
        background-color: #edeff1;
    }
}

/* Mobile
   ========================================================================== */
@media only screen and (max-width: 639px) {
    .starail-Back {
        padding: 12px 10px;
        padding: 0.85714rem 0.71429rem;
    }

    .sta-datepic {
        display: block;
        width: 100%;
        vertical-align: top;
    }

    .starail-Form-button {
        max-width: inherit;
    }
        /*sta*/
        .starail-Form-button.starail-Form-button--primary {
            font-size: 18px;
        }
    /*sta*/
    .mobile-search-input {
        width: 100% !important;
    }
}




/*new as Aug 10 2017 css*/
.MainContent_StaBanner_updUcStaBanner {
    background: #fff;
}

.starai8l-Section {
    width: 100%;
    background: #f0f0f0;
    float: left;
    position: relative;
}
/*.starai8l-Section::before { content:""; background:#f0f0f0; position:absolute; left:-100%; bottom:0; top:0; width:100%; }
.starai8l-Section::after { background: #f0f0f0;
    bottom: 0;
    content: "";
    position: absolute;
    right: -100%;
    text-align: center;
    top: 0;
    width: 100%;}*/

.container {
    margin: 0 auto;
}

.section-heading {
    margin-top: 0;
    text-align: center;
    margin-bottom: 16px;
    font-size: 26px !important;
    text-transform: none !important;
}

.section-desc {
    font-family: 'Titillium Web',Tahoma,Verdana,Segoe,sans-serif;
    text-align: center;
    font-weight: bold;
    max-width: 78%;
    margin: 0 auto;
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 0px;
}

.section-subheading {
    text-align: center;
    margin-bottom: 0px;
    font-size: 22px;
    text-transform: none !important;
    font-weight: 700;
}

.btn_findout {
    width: 100%;
    border: 1px solid #fff;
    display: block;
    margin-top: 35px;
    color: #fff;
    background: #9f9f9f;
    font-size: 14px;
}

.tickets {
    background: #fff;
}

.bg-grey {
    background: #f0f0f0;
}

.starail-Grid--mobileFull-content {
    padding: 40px 0 60px !important;
    width: 100% !important;
    float: left !important;
}

.starail-Grid--mobileFull h1 {
    text-align: center;
    text-transform: none !important;
    font-size: 35px;
    font-weight: bold;
}

.starail-Grid--mobileFull-content p {
    text-align: center;
    font-size: 21px;
    margin-bottom: 70px;
}

*/ .booking_options {
    width: 100%;
    float: left;
}

.booking_options h1 {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 30px;
}

.booking_options p {
    font-size: 14px;
    margin: 25px auto;
}

.book_railpasses {
    text-align: center;
    margin-bottom: 0;
}

.book_railtickets {
    text-align: center;
    margin-bottom: 0;
}

.btn_bordered {
    display: inline-block;
    font-family: "Titillium Web",Tahoma,Verdana,Segoe,sans-serif;
    padding: 10px 90px;
    margin-bottom: 0;
    font-size: 15px;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid #bdcd00;
    color: #0073ae;
    font-weight: 700;
    letter-spacing: 3px;
    transition: all .5s ease-in-out;
    background-color: #c9da00;
}

    .btn_bordered:hover {
        border: 1px solid #bdcd00;
        background-color: #bdcd00;
        transition: all .5s ease-in-out;
    }

.btn_filled {
    display: inline-block;
    font-family: "Titillium Web",Tahoma,Verdana,Segoe,sans-serif;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 12px;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid #434343;
    color: #fff;
    font-weight: bold;
    letter-spacing: 3px;
    transition: all .5s ease-in-out;
    background: #434343;
    text-decoration: none !important;
}

    .btn_filled:hover {
        border: 1px solid #434343;
        color: #434343;
        background: #fff;
        transition: all .5s ease-in-out;
    }

.wide {
    padding: 10px 90px;
}


.search_destinations {
    margin-top: 10px;
    font-size: 14px;
    font-family: "Titillium Web",Tahoma,Verdana,Segoe,sans-serif;
    padding: 0 10px;
}

    .search_destinations a {
        text-decoration: underline;
    }

        .search_destinations a:hover {
            text-decoration: none;
        }

    .search_destinations h1 {
        font-size: 20px;
        font-weight: bold;
        padding: 0;
        margin: 0 0 25px 0;
        text-transform: none;
        text-align: center;
    }

    .search_destinations p {
        padding: 0;
        margin: 0 0 20px 0;
        text-align: center;
    }

    .search_destinations input {
        border: 1px solid #a0a0a0;
        background: #fff;
        width: 100%;
        max-width: 500px;
        padding: 8px 13px;
        font-family: "Titillium Web",Tahoma,Verdana,Segoe,sans-serif;
    }

        .search_destinations input.btn {
            display: inline-block;
            font-family: "Titillium Web",Tahoma,Verdana,Segoe,sans-serif;
            padding: 10px 90px;
            margin-bottom: 0;
            font-size: 15px;
            line-height: 1.42857143;
            text-align: center;
            white-space: nowrap;
            cursor: pointer;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
            border: 1px solid #bdcd00;
            color: #0073ae;
            font-weight: bold;
            letter-spacing: 3px;
            transition: all .5s ease-in-out;
            background-color: #c9da00;
            text-decoration: none !important;
            width: auto;
        }

            .search_destinations input.btn:hover {
                background-color: #bdcd00;
                color: #0073ae;
            }

.form-group {
    margin-bottom: 15px;
    margin-top: 25px;
}

    .form-group .control-label {
        padding-top: 7px;
        margin-bottom: 0;
        width: 25%;
        float: left;
    }


.input-xl {
    width: 300px;
}

.input-lg {
    width: 230px;
}

.input-md {
    width: 100px;
}

.input-sm {
    width: 60px;
}

.small_desc {
    width: 100%;
    max-width: 670px;
    margin: 0 auto;
    text-align: center;
    padding: 80px 0;
    background: #fff;
}

    .small_desc a {
        font-weight: bold;
        color: #000;
        text-decoration: underline;
    }

        .small_desc a:hover {
            color: #000;
            text-decoration: none;
        }

.margin_auto {
    margin: 10px auto;
    float: none;
}

.padb_35 {
    padding: 35px 0;
}


@media (max-width:767px) {
    .book_railpasses {
        text-align: center;
        margin-bottom: 60px;
    }

    .book_railtickets {
        text-align: center;
        margin-bottom: 0;
    }


    .search_destinations input {
        max-width: inherit !important;
        width: 100% !important;
        display: block;
    }
}

.white_bg {
    background: #fff !important;
    padding-bottom: 30px;
}

#MainContent_pnlStaFooter {
    width: 100%;
    float: left;
}


@media (max-width:400px) {

    .starail-Switcher #starail-passes .starail-ImageLink {
        height: 170px !important;
        margin: 0;
        width: 47% !important;
    }


    .starail-ImageLink .starail-ImageLink-title .highlight {
        font-size: 11px;
        line-height: 16px;
    }

    .starail-SearchTickets-destination .starail-SearchTickets-destinationInput {
        width: 90%;
    }


    .sta-datepic .starail-Form-datePicker {
        background: #1a365e;
        width: 160px;
        padding-left: 40px;
        margin-right: 15px;
        padding-right: 0;
        position: relative;
    }

        .sta-datepic .starail-Form-datePicker::before {
            left: 12px;
            top: 12px;
            font-size: 17px;
        }


    .starail-SearchTickets-destination .starail-SearchTickets-switch-trigger {
        right: 0px;
    }

    .starail-SearchTickets-quantity label {
        text-align: left;
    }

    .search_destinations input.btn {
        padding: 10px !important;
    }

    .sta-select-trans {
        width: 100% !important;
    }
}

@media (min-width: 768px) {
    .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9 {
        float: left;
    }
}



.new-sta-header h1, .new-sta-header h2, .new-sta-header h3 {
    font-weight: 600 !important;
}

.new-sta-header .h1-tag {
    color: #434343 !important;
    font-size: 26px !important;
}

.new-sta-header .h1-tag-top {
    font-size: 36px !important;
    color: #434343;
    line-height: 46px;
    margin: 0 0 10px;
}

.new-sta-header .comman {
    color: #434343 !important;
    font-family: Tahoma !important;
    font-size: 14px !important;
    line-height: 21px;
    margin: 20px auto 20px auto;
    width: 69%;
    text-align: center;
}

.new-sta-header img {
    height: 157px;
    width: 157px;
}

.new-sta-top {
    font-weight: 600 !important;
    color: #434343 !important;
    font-size: 16px !important;
    margin-bottom: 40px !important;
    font-family: Titillium Web !important;
    line-height: 26px;
}

.new-sta-header h2.h1-tag {
    text-align: center;
    line-height: 33px !important;
    padding-top: 60px !important;
}

.new-sta-header h2.h2-new {
    margin-bottom: 30px;
    line-height: 1;
    font-size: 26px !important;
}

.new-sta-header h3 {
    text-align: center;
    font-size: 21px !important;
    line-height: 27px !important;
    margin-top: 38px !important;
}

    .new-sta-header h3.h3-tag {
        line-height: 33px !important;
        padding-top: 60px !important;
        font-size: 26px !important;
        margin-top: 0px !important;
    }

.new-sta-left-button {
    float: left !important;
}


.new-sta-pass-bg-dark:hover {
    background-color: rgba(0, 0, 0, 0.6) !important;
}

.new-sta-pass-bg-dark .starail-ImageLink-overlay-content {
    padding: 0 0 0 0 !important;
}

.new-sta-btn-hover {
    width: auto;
    height: 40px;
    color: #1B365D !important;
    font-size: 14px !important;
    font-weight: bold !important;
    letter-spacing: 2px !important;
    background-color: #BED600 !important;
    padding: 10px 20px 10px 20px !important;
}

    .new-sta-btn-hover:hover {
        background-color: #E6F623 !important;
    }

.new-sta-need-some-more-inspi {
    color: #434343 !important;
    font-family: Tahoma !important;
    font-size: 12px !important;
    margin-bottom: 60px !important;
}

.new-sta-the-cheapest-and-mos {
    color: #434343 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 26px;
}


.new-sta-search-destinations {
    text-decoration: none !important;
    color: #0065BD !important;
    font-family: Tahoma !important;
    font-size: 12px !important;
    font-weight: bold !important;
}

    .new-sta-search-destinations:hover {
        text-decoration: underline !important;
        color: #0065BD !important;
    }

.new-sta-our-top-routes {
    color: #434343 !important;
    font-size: 21px !important;
}


[class^="starail-Icon-"], [class*=" starail-Icon-"] {
    font-size: 17px;
}

.switchRadioGroup tr td input[type=radio]:checked + label, .switchRadioGroup tr td input[type=radio] + label {
    text-transform: uppercase;
}


.popupselect {
    font-size: 13px !important;
}

body {
    font-family: "Titillium Web" !important;
}

.switchRadioGroup tr td input[type=radio] + label:hover {
    background-color: #0065BD !important;
    color: #FFFFFF !important;
}

.val-error {
    color: #434343 !important;
}

.child-popup, .youth-popup {
    color: #bac2ce !important;
}

    .child-popup:hover, .youth-popup:hover {
        color: #0065BD !important;
    }

.starail-SearchTickets-quantity .pnlTravellerPopUPSTA {
    width: 864px !important;
    left: 50px !important;
    box-shadow: 0 2px 7px 2px rgba(0,0,0,0.5);
}

.pnlTravellerPopUPSTA .starail-popup {
    z-index: 99999999 !important;
    position: relative !important;
}


.child-age-range-per {
    height: 22px;
    color: #434343;
    font-family: "Titillium Web";
    font-size: 21px !important;
    font-weight: 600;
    line-height: 22px;
    text-align: center;
    margin-top: 40px;
}

.sta-pass-child ul li, .sta-pass-youth ul li {
    display: table-row;
}

    .sta-pass-child ul li span:first-of-type, .sta-pass-youth ul li span:first-of-type {
        display: table-cell;
        width: 158px;
        color: #434343;
        font-family: "Titillium Web";
        font-size: 16px;
        font-weight: 600;
        line-height: 25px;
        text-align: left;
    }

    .sta-pass-child ul li span:last-of-type, .sta-pass-youth ul li span:last-of-type {
        display: table-cell;
        width: 158px;
        color: #434343;
        font-family: Tahoma;
        font-size: 14px;
        line-height: 25px;
        text-align: left;
    }

    .sta-pass-child ul li.li-header span, .sta-pass-youth ul li.li-header span {
        height: 35px;
        width: 30px;
        color: #434343;
        font-family: "Titillium Web";
        font-size: 18px;
        font-weight: 600;
    }

.sta-pass-child ul, .sta-pass-youth ul {
    display: table-cell;
    width: 50%;
    margin: 0px;
}

.sta-pass-child, .sta-pass-youth {
    padding-bottom: 40px;
}

.select-mide-line {
    width: 1px !important;
    background: #dadada;
    position: absolute;
    z-index: 1;
}

.li-f3, .li-f4, .li-f5, .li-f6 {
    margin-left: 46px;
    margin-top: 1px;
    height: 41px;
}

.li-f9, .li-f2 {
    margin-left: 55px;
    height: 44.5px;
    margin-top: 1px;
}

.li-f7 {
    margin-left: 136px;
    height: 44.5px;
    margin-top: 1px;
}

.journey-div {
    width: 105px !important;
}

.sta-select-trans {
    width: 189px !important;
}

#MainContent_ucLoyaltyCart_divSearch .starail-SearchTickets-destinationInput,
#MainContent_ucLoyaltyCart_divSearch .starail-SearchTickets-destinationInput:hover {
    border: none !important;
}

#MainContent_ucLoyaltyCart_ddldepTime, #MainContent_ucLoyaltyCart_ddlReturnTime {
    background: #fff url(../img/droparrow.png) no-repeat 79% center !important;
}

input[type="text"], select, label, .starail-Form-input, .starail-Form-textarea, .starail-Form-select {
    color: #434343 !important;
}

#MainContent_StaBanner_txtSearch, #MainContent_ucLoyaltyCart_updLoyalty input[type="text"], #MainContent_ucLoyaltyCart_updLoyalty select {
    border: 1px solid #DADADA;
}

    #MainContent_StaBanner_txtSearch:hover {
        width: 510px;
        border: 1px solid #BED600;
    }


    #MainContent_ucLoyaltyCart_txtReturnDate:hover, #MainContent_ucLoyaltyCart_updLoyalty input[type="text"]:hover, #MainContent_ucLoyaltyCart_updLoyalty select:hover {
        border: 1px solid #0065BD !important;
    }






@media only screen and (max-width: 639px) {
    .new-sta-header .h1-tag-top {
        font-size: 26px !important;
    }

    .new-sta-header .comman {
        max-width: 100% !important;
    }

    .new-sta-the-cheapest-and-mos {
        max-width: 90% !important;
    }

    .child-popup, .youth-popup {
        padding: 0px 0px 6px 2px;
    }

    .sta-pass-child ul, .sta-pass-youth ul {
        display: block;
        width: 100%;
    }

    .child-popup, .youth-popup {
        padding: 0px 0px 6px 3px !important;
    }

    .starail-SearchTickets-quantity .pnlTravellerPopUPSTA {
        width: 96% !important;
        left: 2% !important;
    }

    .mobile-hide {
        display: none !important;
    }


    .custom-sta .switchRadioGroup { /*sta*/
        width: 100% !important;
    }

    .new-sta-header .comman {
        width: 100%;
    }

    .new-sta-our-top-routes {
        margin-bottom: 17px;
    }
}

@media only screen and (max-width: 419px) {
    .new-sta-header .h1-tag-top {
        font-size: 26px !important;
    }

    .new-sta-header .comman {
        max-width: 100% !important;
    }

    .new-sta-the-cheapest-and-mos {
        max-width: 90% !important;
    }

    .child-popup, .youth-popup {
        padding: 0px 0px 6px 2px;
    }

    .sta-pass-child ul, .sta-pass-youth ul {
        display: block;
        width: 100%;
    }

    .child-popup, .youth-popup {
        padding: 0px 0px 6px 3px !important;
    }

    .starail-SearchTickets-quantity .pnlTravellerPopUPSTA {
        width: 96% !important;
        left: 2% !important;
    }

    .mobile-hide {
        display: none !important;
    }

    .custom-sta .switchRadioGroup { /*sta*/
        width: 100% !important;
    }

    .new-sta-header .comman {
        width: 100%;
    }

    .new-sta-our-top-routes {
        margin-bottom: 17px;
    }
}