/* ----------- iPhone 4 and 4S ----------- */

/* Portrait and Landscape */
@media only screen
and (min-device-width: 320px)
and (max-device-width: 480px)
and (-webkit-min-device-pixel-ratio: 2) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; font-size: 22px; }
    .info-message { padding: 0 0 10px; font-size: 12px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}

/* Portrait */
@media only screen
and (min-device-width: 320px)
and (max-device-width: 480px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) {
}

/* Landscape */
@media only screen
and (min-device-width: 480px)
and (max-device-width: 320px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: landscape) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px -15px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; }
    .info-message { padding: 0 0 10px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}

/* ----------- iPhone 5 and 5S ----------- */

/* Portrait and Landscape */
@media only screen
and (min-device-width: 320px)
and (max-device-width: 568px)
and (-webkit-min-device-pixel-ratio: 2) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; font-size: 22px; }
    .info-message { padding: 0 0 10px; font-size: 12px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}

/* Portrait */
@media only screen
and (min-device-width: 320px)
and (max-device-width: 568px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) {
}

/* Landscape */
@media only screen
and (min-device-width: 568px)
and (max-device-width: 320px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: landscape) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; float: none !important; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px -15px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; font-size: 22px; }
    .info-message { padding: 0 0 10px; font-size: 12px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}

/* ----------- iPhone 6 ----------- */

/* Portrait and Landscape */
@media only screen
and (min-device-width: 375px)
and (max-device-width: 667px) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px -15px !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; font-size: 22px; }
    .info-message { padding: 0 0 10px; font-size: 12px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}

/* Portrait */
@media only screen
and (min-device-width: 375px)
and (max-device-width: 667px)
and (orientation: portrait) {

}

/* Landscape */
@media only screen
and (min-device-width: 375px)
and (max-device-width: 667px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: landscape) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px -15px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; }
    .info-message { padding: 0 0 10px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}

/* ----------- iPhone 6+ ----------- */

/* Portrait and Landscape */
@media only screen
and (min-device-width: 414px)
and (max-device-width: 736px)
and (-webkit-min-device-pixel-ratio: 3) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; font-size: 22px; }
    .info-message { padding: 0 0 10px; font-size: 12px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}

/* Portrait */
@media only screen
and (min-device-width: 414px)
and (max-device-width: 736px)
and (-webkit-min-device-pixel-ratio: 3)
and (orientation: portrait) {

}

/* Landscape */
@media only screen
and (min-device-width: 414px)
and (max-device-width: 736px)
and (-webkit-min-device-pixel-ratio: 3)
and (orientation: landscape) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px -15px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; }
    .info-message { padding: 0 0 10px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }

}



/* ----------- Galaxy S3 ----------- */

/* Portrait and Landscape */
@media screen
and (device-width: 320px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 2) {

}

/* Portrait */
@media screen
and (device-width: 320px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 2)
and (orientation: portrait) {

}

/* Landscape */
@media screen
and (device-width: 320px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 2)
and (orientation: landscape) {

}

/* ----------- Galaxy S4 ----------- */

/* Portrait and Landscape */
@media screen
and (device-width: 320px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 3) {

}

/* Portrait */
@media screen
and (device-width: 320px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 3)
and (orientation: portrait) {

}

/* Landscape */
@media screen
and (device-width: 320px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 3)
and (orientation: landscape) {

}

/* ----------- Galaxy S5 ----------- */

/* Portrait and Landscape */
@media screen
and (device-width: 360px)
and (device-height: 640px) {
    header { margin: 0 -15px; }
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; }
    .info-message { padding: 0 0 10px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}

/* Portrait */
@media screen
and (device-width: 360px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 3)
and (orientation: portrait) {

}

/* Landscape */
@media screen
and (device-width: 640px)
and (device-height: 360px)
and (orientation: landscape) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; float: none !important; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; font-size: 22px; }
    .info-message { padding: 0 0 10px; font-size: 12px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}



/* ----------- Galaxy J5 ----------- */

/* Portrait and Landscape */
@media screen
and (device-width: 360px)
and (device-height: 640px) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; }
    .info-message { padding: 0 0 10px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}

/* Portrait */
@media screen
and (device-width: 360px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 3)
and (orientation: portrait) {

}

/* Landscape */
@media screen
and (device-width: 640px)
and (device-height: 360px)
and (orientation: landscape) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px -15px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; }
    .info-message { padding: 0 0 10px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}



/* ----------- Nexus 5X ----------- */

/* Portrait and Landscape */
@media screen
and (device-width: 412px)
and (device-height: 732px) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; }
    .info-message { padding: 0 0 10px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}

/* Portrait */
@media screen
and (device-width: 412px)
and (device-height: 732px)
and (-webkit-device-pixel-ratio: 3)
and (orientation: portrait) {

}

/* Landscape */
@media screen
and (device-width: 732px)
and (device-height: 412px)
and (orientation: landscape) {
    .nosmallscreens { display: none; }
    .stationsMapLink { right: 10% !important; top: 30% !important; }
    header > .person { margin-left: 5% !important; }
    #sidebar-wrapper { height: 60px !important; width: 100%; z-index: 3; }
    ._clueTop { padding-bottom: 20px; }
    #main-wrapper { margin-top: 50px; }
    ul.nav > li > a >  i { font-size: 20px !important; }
    ul.nav > li { margin: -20px 0 !important; /*width: 25% !important;*/ padding: 10px 0 !important; box-sizing: border-box !important; /*float: left !important;*/ }
    .b { margin: -71px -15px 0 !important; }
    .i-text { font-size: 10px; display: block; margin-top: 5px; }
    h3.balance { text-align: center; padding: 20px; }
    .info-message { padding: 0 0 10px; }
    .info-message:first-child { padding-bottom: 0; }
    .mobileWidth { width: 100% !important; }
    .balance-type { top: 0 !important; }
    .balance-type._fueling:before { display: none !important; }
    .balance-type._payment:before { display: none !important; }
    .balance-type._invoice:before { display: none !important; }
    table.data-more { font-size: 8px !important; margin-top: -20px !important; }
    span.mobile-currency { font-size: 7px !important; }
    .langSelect { width: 100% !important; margin-top: -20px; }
    .loginButton { padding: 8px 12px !important; font-size: 12px; margin-top: 12px; float: none !important; width: 100%; }

    /* loader  */
    .loader-wrapper { background: #eaecfa; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 9999; }
    .loader-wrapper._hide { display: none; }
    .loader-message  { position: relative; top: 10%; width: 75%; text-align: center; color: #2ecc71; font-size: 20px; margin: 0 auto; }
    @keyframes rotate {
        0%    { transform: rotate(0deg); }
        100%  { transform: rotate(360deg); }
    }
}




/* ----------- HTC One ----------- */

/* Portrait and Landscape */
@media screen
and (device-width: 360px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 3) {

}

/* Portrait */
@media screen
and (device-width: 360px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 3)
and (orientation: portrait) {

}

/* Landscape */
@media screen
and (device-width: 360px)
and (device-height: 640px)
and (-webkit-device-pixel-ratio: 3)
and (orientation: landscape) {

}