/* ==========================================================================
   Fonts
   ========================================================================== */

/* Vodafone Group v3 implementation had only TTF version for VodafoneLight font, which causes problems in IE. Imported EOT and WOFF versions of the font from v4 of the implementation. */
@font-face {
    font-family: 'VodafoneLight';
    src: url("../../css/fonts/VodafoneLt.eot");
    src: url("../../css/fonts/VodafoneLt.eot?#iefix") format("embedded-opentype"), url("../../css/fonts/VodafoneLt.woff") format("woff"), url("../../css/fonts/VodafoneLt.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}


/* ==========================================================================
   Base
   ========================================================================== */

img {
    max-width: 100%;
}

/* Mobile Safari zooms on selecting form control if font is lower than the 16px threshold */
input,
select,
textarea {
    font-family: inherit; /* force same font into inputs (no defaults in VFGroup) */
    font-size: 12px;
}

@media only screen and (min-width: 992px) {
    input,
    select,
    textarea {
        font-size: 14px;
    }
}

/* ==========================================================================
   Layout
   ========================================================================== */

header {
    height: 50px; /* force mobile header height because of fixed menu */
}

@media only screen and (min-width: 767px) {
    header {
        height: auto; /* reset header height back to auto */
    }

    .teaser {
        min-height: 270px;
    }
}

.l-block {
    display: block;
}

.l-inline-block {
    display: inline-block;
}

.l-only-print {
    display: none;
}


/* Center align column items both horizontally and vertically on all resolutions */
.l-flex-center {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;

    -ms-flex-align: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    align-items: center;
    justify-content: center;
}

.l-flex-center-space {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;

    -ms-flex-align: center;
    -ms-flex-pack: space-between;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -webkit-box-pack: space-between;
    -webkit-justify-content: space-between;
    align-items: center;
    justify-content: space-between;
}

.l-flex-reverse {
    -webkit-flex-direction: row-reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

.l-flex-grow {
    -webkit-flex: 1 1 auto;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

@media only screen and (min-width: 767px) {
    /* Center align column items both horizontally and vertically only on high resolutions */
    .l-flex-center-lrg {
        display: -ms-flexbox;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;

        -ms-flex-align: center;
        -ms-flex-pack: center;
        -webkit-align-items: center;
        -webkit-box-align: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        align-items: center;
        justify-content: center;
    }

    .l-flex-center-space-lrg {
        display: -ms-flexbox;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;

        -ms-flex-align: center;
        -ms-flex-pack: space-between;
        -webkit-align-items: center;
        -webkit-box-align: center;
        -webkit-box-pack: space-between;
        -webkit-justify-content: space-between;
        align-items: center;
        justify-content: space-between;
    }

    .l-flex-grow-lrg {
        -webkit-flex: 1 1 auto;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }
}

.l-clear {
    clear: both;
}

.l-no-margin-top {
    margin-top: 0 !important;
}

.l-no-margin-bottom {
    margin-bottom: 0 !important;
}

.l-no-padding-top {
    padding-top: 0 !important;
}

.l-no-padding-bottom {
    padding-bottom: 0 !important;
}

/* Set some custom margins (from 5px to 50px) */

.l-margin-top-5 {
    margin-top: 5px;
}

.l-margin-top-10 {
    margin-top: 10px;
}

.l-margin-top-15 {
    margin-top: 15px;
}

.l-margin-top-20 {
    margin-top: 20px;
}

.l-margin-top-25 {
    margin-top: 25px;
}

.l-margin-top-30 {
    margin-top: 30px;
}

.l-margin-top-35 {
    margin-top: 35px;
}

.l-margin-top-40 {
    margin-top: 40px;
}

.l-margin-top-45 {
    margin-top: 45px;
}

.l-margin-top-50 {
    margin-top: 50px;
}

.l-margin-bottom-5 {
    margin-bottom: 5px;
}

.l-margin-bottom-10 {
    margin-bottom: 10px;
}

.l-margin-bottom-15 {
    margin-bottom: 15px;
}

.l-margin-bottom-20 {
    margin-bottom: 20px;
}

.l-margin-bottom-25 {
    margin-bottom: 25px;
}

.l-margin-bottom-30 {
    margin-bottom: 30px;
}

.l-margin-bottom-35 {
    margin-bottom: 35px;
}

.l-margin-bottom-40 {
    margin-bottom: 40px;
}

.l-margin-bottom-45 {
    margin-bottom: 45px;
}

.l-margin-bottom-50 {
    margin-bottom: 50px;
}

@media only screen and (max-width: 766px) {
    .l-margin-top-sml-5 {
        margin-top: 5px;
    }

    .l-margin-top-sml-10 {
        margin-top: 10px;
    }

    .l-margin-top-sml-15 {
        margin-top: 15px;
    }

    .l-margin-top-sml-20 {
        margin-top: 20px;
    }

    .l-margin-top-sml-25 {
        margin-top: 25px;
    }

    .l-margin-top-sml-30 {
        margin-top: 30px;
    }

    .l-margin-top-sml-35 {
        margin-top: 35px;
    }

    .l-margin-top-sml-40 {
        margin-top: 40px;
    }

    .l-margin-top-sml-45 {
        margin-top: 45px;
    }

    .l-margin-top-sml-50 {
        margin-top: 50px;
    }

    .l-margin-bottom-sml-5 {
        margin-bottom: 5px;
    }

    .l-margin-bottom-sml-10 {
        margin-bottom: 10px;
    }

    .l-margin-bottom-sml-15 {
        margin-bottom: 15px;
    }

    .l-margin-bottom-sml-20 {
        margin-bottom: 20px;
    }

    .l-margin-bottom-sml-25 {
        margin-bottom: 25px;
    }

    .l-margin-bottom-sml-30 {
        margin-bottom: 30px;
    }

    .l-margin-bottom-sml-35 {
        margin-bottom: 35px;
    }

    .l-margin-bottom-sml-40 {
        margin-bottom: 40px;
    }

    .l-margin-bottom-sml-45 {
        margin-bottom: 45px;
    }

    .l-margin-bottom-sml-50 {
        margin-bottom: 50px;
    }
}

@media only screen and (min-width: 767px) {
    .l-margin-top-lrg-5 {
        margin-top: 5px;
    }

    .l-margin-top-lrg-10 {
        margin-top: 10px;
    }

    .l-margin-top-lrg-15 {
        margin-top: 15px;
    }

    .l-margin-top-lrg-20 {
        margin-top: 20px;
    }

    .l-margin-top-lrg-25 {
        margin-top: 25px;
    }

    .l-margin-top-lrg-30 {
        margin-top: 30px;
    }

    .l-margin-top-lrg-35 {
        margin-top: 35px;
    }

    .l-margin-top-lrg-40 {
        margin-top: 40px;
    }

    .l-margin-top-lrg-45 {
        margin-top: 45px;
    }

    .l-margin-top-lrg-50 {
        margin-top: 50px;
    }

    .l-margin-bottom-lrg-5 {
        margin-bottom: 5px;
    }

    .l-margin-bottom-lrg-10 {
        margin-bottom: 10px;
    }

    .l-margin-bottom-lrg-15 {
        margin-bottom: 15px;
    }

    .l-margin-bottom-lrg-20 {
        margin-bottom: 20px;
    }

    .l-margin-bottom-lrg-25 {
        margin-bottom: 25px;
    }

    .l-margin-bottom-lrg-30 {
        margin-bottom: 30px;
    }

    .l-margin-bottom-lrg-35 {
        margin-bottom: 35px;
    }

    .l-margin-bottom-lrg-40 {
        margin-bottom: 40px;
    }

    .l-margin-bottom-lrg-45 {
        margin-bottom: 45px;
    }

    .l-margin-bottom-lrg-50 {
        margin-bottom: 50px;
    }
}

/* Set some common paddings */

.l-inner-padding,
.l-inner-padding-sml,
.l-inner-padding-lrg {
    padding: 15px;
}

@media only screen and (min-width: 767px) {
    .l-inner-padding,
    .l-inner-padding-lrg {
        padding: 25px;
    }
}

@media only screen and (min-width: 992px) {
    .l-inner-padding-lrg {
        padding: 35px ;
    }
}

.l-content-padding-70 {
    padding-top: 70px;
    padding-bottom: 70px;
}

/* Alignment classes */

.l-pull-left {
    float: left;
}

.l-pull-right {
    float: right;
}

.l-align-center,
.l-align-center-sml {
    text-align: center;
}

.l-align-vertical {
    display: table-cell;
    vertical-align: middle;
}

.l-direction-ltr {
    direction: ltr;
}

@media only screen and (min-width: 767px) {
    .l-pull-left-lrg {
        float: left;
    }

    .l-pull-right-lrg {
        float: right;
    }

    .l-align-center-sml {
        text-align: inherit;
    }
}

.l-block-center {
    display: block;
    margin: 0 auto;
}

.l-text-underline {
    text-decoration: underline;
}

/* Lists */

.l-list-inline > li {
    display: inline-block;
}

.l-list-inline-bordered > li + li {
    margin-left: 10px;
    padding-left: 10px;
    border-left: 1px solid inherit;
}

/* Filler element - if the element is empty, it will still take space */

.l-filler {
    min-height: 1px;
}

/**
 * Grid
 */

.col,
.l-medium-col {
    position: relative;

}

/* Medium Grid - breakpoint is at 992px instead of 768px */

.l-medium-grid:before {
    content: " ";
    display: table;
}

.l-medium-grid:after {
    clear: both;
}

@media only screen and (min-width: 767px) {
    .grid-sml {
        margin-left: -10px;
    }

    .grid-sml .col {
        padding-left: 10px;
    }

    /* Reversible grid - same order on mobile like the standard grid, but reversed on desktop */
    .grid-reverse {
        margin: 0 -30px 0 0;
    }

    .grid-reverse .col-reverse {
        float: right;
        padding: 0 30px 0 0;
    }
}

@media only screen and (min-width: 992px) {
    .l-medium-grid {
        margin-left: -30px;
    }

    .l-medium-col {
        float: left;
        padding: 0 0 0 30px;
    }

    .l-medium-w-25 {
        width: 25%;
    }

    .l-medium-w-75 {
        width: 75%;
    }

    .l-medium-push-w-75 {
        left: 75%;
    }

    .l-medium-pull-w-25 {
        right: 25%;
    }
}

/* ==========================================================================
   Modules
   ========================================================================== */

/*
   Farcry containers
   ========================================================================== */

div.containeradmin,
div.ruleadmin,
.container-edit {
    position: relative;
    z-index: 999; /* make it visible over anything on the page */
}

/*
   Helpers
   ========================================================================== */

.red-text {
    color: #e60000;
}

.round {
    border-radius: 50%;
}

.small-text {
    font-size: .9em;
}

.large-text {
    font-size: 1.2em;
}

.bg-light-grey {
    background-color: #efefef;
}

/*
   Icons
   ========================================================================== */

.i-vfqa {
    background: transparent url('img/vfqa-icons.png') no-repeat 0 0;
}

.i-pill {
    padding: 1em;
    border-style: solid;
    border-width: 2px;
    border-radius: 50%;

    display: -ms-inline-flexbox;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: inline-flex;

    -ms-flex-align: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    align-items: center;
    justify-content: center;
}

.i-pill-lg {
    width: 65px;
    height: 65px;
}

.i-pill-primary {
    border-color: #525252;
    background-color: #fff;
}

.i-pill-secondary {
    border-color: transparent;
    background-color: #f1f1f1;
}

.i-pill-alt {
    border-color: transparent;
    background-color: #fff;
}

.i-dial-mvf {
    width: 41px;
    height: 16px;
    background-position: -3px -17px;
}

.i-dial-mvf-lrg {
    width: 47px;
    height: 45px;
    background-position: -407px -1px;
}

.i-online-recharge {
    width: 30px;
    height: 33px;
    background-position: -51px -10px;
}

.i-obp {
    width: 32px;
    height: 30px;
    background-position: -95px -11px;
}

.i-obp-lrg {
    width: 41px;
    height: 38px;
    background-position: -342px -7px;
}

.i-call-us {
    width: 25px;
    height: 35px;
    background-position: -141px -9px;
}

.i-email-us {
    width: 27px;
    height: 21px;
    background-position: -180px -16px;
}

.i-store-locator {
    width: 24px;
    height: 32px;
    background-position: -218px -10px;
}

.i-online-recharge-2 {
    width: 43px;
    height: 45px;
    background-position: -274px -4px;
}

.i-extras-lrg {
    width: 33px;
    height: 52px;
    background-position: -481px 0px;
}

.i-all-phones {
    width: 30px;
    height: 31px;
    background-position: -2410px -7px;
}

.i-postpaid {
    width: 29px;
    height: 29px;
    background-position: -2458px -7px;
}

.i-bundles {
    width: 29px;
    height: 33px;
    background-position: -2495px -7px;
}

.i-fixed-line {
    width: 24px;
    height: 29px;
    background-position: -2533px -7px;
}

.i-need-help-2 {
    width: 29px;
    height: 29px;
    background-position: -2565px -7px;
}

.i-store-locator-2 {
    width: 33px;
    height: 25px;
    background-position: -2606px -7px;
}

.i-business-sms {
    width: 26px;
    height: 24px;
    background-position: -525px -17px;
}

.i-business-data {
    width: 23px;
    height: 22px;
    background-position: -558px -18px;
}

.i-business-unltd {
    width: 24px;
    height: 24px;
    background-position: -588px -17px;
}

.i-business-min {
    width: 24px;
    height: 24px;
    background-position: -619px -17px;
}

.i-business-lounge {
    width: 53px;
    height: 43px;
    background-position: -1817px -7px;
}

.i-business-lounge-2 {
    width: 48px;
    height: 48px;
    background-position: -1277px -5px;
}

.i-business-parking {
    width: 53px;
    height: 55px;
    background-position: -1869px -4px;
}

.i-business-parking-2 {
    width: 48px;
    height: 48px;
    background-position: -1330px -5px;
}

.i-business-discounts {
    width: 53px;
    height: 41px;
    background-position: -1923px -7px;
}

.i-business-discounts-2 {
    width: 48px;
    height: 48px;
    background-position: -1383px -5px;
}

.i-business-vip {
    width: 53px;
    height: 45px;
    background-position: -1986px 5px;
}

.i-business-vip-2 {
    width: 48px;
    height: 48px;
    background-position: -1437px -5px;
}

.i-business-secure {
    width: 53px;
    height: 46px;
    background-position: -2047px -7px;
}

.i-business-secure-2 {
    width: 48px;
    height: 48px;
    background-position: -1492px -5px;
}

.i-business-voicesms {
    width: 53px;
    height: 42px;
    background-position: -2105px -7px;
}

.i-business-voicesms-2 {
    width: 48px;
    height: 48px;
    background-position: -1546px -5px;
}

.i-business-data-lrg {
    width: 53px;
    height: 49px;
    background-position: -2167px -7px;
}

.i-business-data-2-lrg {
    width: 48px;
    height: 48px;
    background-position: -1600px -5px;
}

.i-business-roaming {
    width: 53px;
    height: 26px;
    background-position: -2230px -7px;
}

.i-business-roaming-2 {
    width: 48px;
    height: 48px;
    background-position: -1651px -5px;
}

.i-business-passport {
    width: 53px;
    height: 61px;
    background-position: -2286px -7px;
}

.i-business-passport-2 {
    width: 48px;
    height: 48px;
    background-position: -1706px -5px;
}

.i-business-bb {
    width: 53px;
    height: 36px;
    background-position: -2342px -7px;
}

.i-business-bb-2 {
    width: 48px;
    height: 48px;
    background-position: -1757px -5px;
}

.i-purple-circle-arrow {
    width: 29px;
    height: 29px;
    background-position: -4223px -7px;
}

.i-mobile-phone {
    width: 22px;
    height: 42px;
    background-position: -667px -10px;
}

.i-battery {
    width: 22px;
    height: 42px;
    background-position: -714px -10px;
}

.i-audio {
    width: 33px;
    height: 31px;
    background-position: -758px -14px;
}

.i-car {
    width: 49px;
    height: 24px;
    background-position: -810px -17px;
}

.i-smart-phone-acc {
    width: 28px;
    height: 39px;
    background-position: -878px -11px;
}

.i-star {
    width: 38px;
    height: 36px;
    background-position: -917px -13px;
}

.nav-aux i.i-promo-badge {
    margin: -2px -5px 0 0;
}

.nav-aux i.i-new-badge {
    margin: -7px -5px 0 11px;
    height: 23px;
}

@media only screen and (min-width: 767px){
    .nav-aux li:nth-child(-n+5):nth-child(n+4) i{
        margin-right: -5px;
    }
}

.i-consumer-sms {
    width: 43px;
    height: 43px;
    background-position: -2646px -7px;
}

.i-consumer-data {
    width: 51px;
    height: 49px;
    background-position: -2168px -7px;
}

.i-consumer-unltd {
    width: 24px;
    height: 24px;
    background-position: -588px -17px;
}

.i-consumer-min {
    width: 50px;
    height: 42px;
    background-position: -2106px -7px;
}

.i-consumer-lounge {
    width: 53px;
    height: 43px;
    background-position: -1817px -7px;
}

.i-consumer-lounge-2 {
    width: 48px;
    height: 48px;
    background-position: -1277px -5px;
}

.i-consumer-parking {
    width: 53px;
    height: 55px;
    background-position: -1869px -4px;
}

.i-consumer-parking-2 {
    width: 48px;
    height: 48px;
    background-position: -1330px -5px;
}

.i-consumer-discounts {
    width: 53px;
    height: 41px;
    background-position: -1923px -7px;
}

.i-consumer-discounts-family {
    background: transparent url('/css/images/red/red-plans-sprite.png') no-repeat 0 0;
    width: 53px;
    height: 41px;
    background-position: -10px -5px;
}

.i-consumer-international-discounts {
    background: transparent url('/css/images/red/red-plans-sprite.png') no-repeat 0 0;
    width: 53px;
    height: 41px;
    background-position: -210px -101px;
}

.i-consumer-redteam {
    background: transparent url('/css/images/red/red-plans-sprite.png') no-repeat 0 0;
    width: 53px;
    height: 41px;
    background-position: -10px -158px;
}

.i-consumer-discounts-2 {
    width: 48px;
    height: 48px;
    background-position: -1383px -5px;
}

.i-consumer-vip {
    width: 53px;
    height: 45px;
    background-position: -1986px 5px;
}

.i-consumer-vip-2 {
    width: 48px;
    height: 48px;
    background-position: -1437px -5px;
}

.i-consumer-secure {
    width: 53px;
    height: 46px;
    background-position: -2047px -7px;
}

.i-consumer-secure-2 {
    width: 48px;
    height: 48px;
    background-position: -1492px -5px;
}

.i-consumer-voicesms {
    width: 53px;
    height: 42px;
    background-position: -2105px -7px;
}

.i-consumer-voicesms-2 {
    width: 48px;
    height: 48px;
    background-position: -1546px -5px;
}

.i-consumer-data-lrg {
    width: 53px;
    height: 49px;
    background-position: -2167px -7px;
}

.i-consumer-data-2-lrg {
    width: 48px;
    height: 48px;
    background-position: -1600px -5px;
}

.i-consumer-roaming {
    width: 53px;
    height: 26px;
    background-position: -2230px -7px;
}

.i-consumer-roaming-2 {
    width: 48px;
    height: 48px;
    background-position: -1651px -5px;
}

.i-consumer-passport {
    width: 53px;
    height: 61px;
    background-position: -2286px -7px;
}

.i-consumer-passport-2 {
    width: 48px;
    height: 48px;
    background-position: -1706px -5px;
}

.i-consumer-bb {
    width: 53px;
    height: 36px;
    background-position: -2342px -7px;
}

.i-consumer-bb-2 {
    width: 48px;
    height: 48px;
    background-position: -1757px -5px;
}

.i-warranty {
    width: 39px;
    height: 33px;
    background-position: -2700px -7px;
}

.i-product-specs-1 {
    width: 48px;
    height: 48px;
    background-position: -2753px -7px;
}

.i-product-specs-2 {
    width: 50px;
    height: 38px;
    background-position: -2819px -6px;
}

.i-product-specs-3 {
    width: 49px;
    height: 47px ;
    background-position: -2882px -6px;
}

.i-product-specs-4 {
    width: 50px;
    height: 35px;
    background-position: -2942px -7px;
}

.i-product-specs-5 {
    width: 50px;
    height: 40px;
    background-position: -2999px -6px;
}

.i-product-specs-6 {
    width: 33px;
    height: 47px;
    background-position: -3061px -7px;
}

.i-product-specs-7 {
    width: 48px;
    height: 47px;
    background-position: -3108px -8px;
}

.i-product-specs-8 {
    width: 47px;
    height: 49px;
    background-position: -3168px -7px;
}

.i-product-specs-9 {
    width: 44px;
    height: 46px;
    background-position: -3228px -6px;
}

.i-product-specs-10 {
    width: 42px;
    height: 46px;
    background-position: -3282px -7px;
}

.i-best-buy {
    width: 71px;
    height: 44px;
    background-position: -3329px -14px;
}

.i-data-only {
    width: 70px;
    height: 79px;
    background-position: -3901px -7px;
}

.i-talk-and-data {
    width: 59px;
    height: 79px;
    background-position: -3602px -7px;
}

.i-be-connected {
    width: 58px;
    height: 58px;
    background-position: -3409px -7px;
}

.i-save-time {
    width: 58px;
    height: 58px;
    background-position: -3474px -7px;
}

.i-great-value {
    width: 58px;
    height: 58px;
    background-position: -3539px -7px;
}

.i-micro-sim {
    width: 48px;
    height: 60px;
    background-position: -3672px -6px;
}

.i-nano-sim {
    width: 41px;
    height: 51px;
    background-position: -3726px -6px;
}

.i-regular-sim {
    width: 51px;
    height: 80px;
    background-position: -3775px -6px;
}

.i-free {
    width: 57px;
    height: 56px;
    background-position: -3835px -7px;
}

.i-credit-recharge {
    width: 81px;
    height: 81px;
    background-position: -3984px -7px;
}

.i-internet-packs {
    width: 81px;
    height: 81px;
    background-position: -4078px -7px;
}

.i-red-arrow {
    width: 25px;
    height: 13px;
    background-position: -4174px -7px;
}

.i-consumer-sms-mini {
    width: 32px;
    height: 32px;
    background-position: -4287px -7px;
}

.i-consumer-data-mini {
    width: 32px;
    height: 31px;
    background-position: -4324px -7px;
}

.i-consumer-min-mini {
    width: 37px;
    height: 31px;
    background-position: -4361px -7px;
}

.i-consumer-roaming-mini {
    width: 43px;
    height: 21px;
    background-position: -4408px -7px;
}

.i-consumer-passport-mini {
    width: 34px;
    height: 43px;
    background-position: -4456px -7px;
}

.i-consumer-international-discounts-mini {
    width: 31px;
    height: 31px;
    background-position: -4494px -7px;
}

.i-consumer-parking-mini {
    width: 24px;
    height: 37px;
    background-position: -4532px -7px;
}

.i-consumer-discounts-mini {
    width: 35px;
    height: 29px;
    background-position: -4731px -7px;
}

.i-consumer-discounts-family-mini {
    width: 31px;
    height: 35px;
    background-position: -4566px -7px;
}

.i-consumer-lounge-mini {
    width: 30px;
    height: 28px;
    background-position: -4611px -7px;
}

.i-consumer-redteam-mini {
    width: 27px;
    height: 30px;
    background-position: -4649px -7px;
}

.i-consumer-vip-mini {
    width: 37px;
    height: 16px;
    background-position: -4685px -7px;
}

.i-privileges-valet {
    width: 88px;
    height: 88px;
    background-position: -4782px -7px;
}

.i-privileges-airport {
    width: 88px;
    height: 88px;
    background-position: -4879px -8px;
}

.i-privileges-family {
    width: 88px;
    height: 88px;
    background-position: -4975px -8px;
}

.i-privileges-red-team {
    width: 88px;
    height: 88px;
    background-position: -5071px -8px;
}

.i-privileges-vip {
    width: 88px;
    height: 88px;
    background-position: -5168px -8px;
}

.i-arrow-use-current-location {
    width: 12px;
    height: 12px;
    background-position: -5285px -8px;
}
.i-business-bb-mini {
    width: 33px;
    height: 27px;
    background-position: -5326px -10px;
}

.i-business-secure-mini {
    width: 31px;
    height: 31px;
    background-position: -5372px -8px;
}

.i-ios-white {
    width: 36px;
    height: 41px;
    background-position: -6689px -8px;
}

.i-android-white {
    width: 36px;
    height: 41px;
    background-position: -6741px -8px;
}

.i-ios-title-white {
    background-position: -6911px -8px;
    width: 55px;
    height: 24px;
}

.i-android-title-white {
    background-position: -6793px -8px;
    width: 106px;
    height: 31px;
}
/*
   Media object
   ========================================================================== */

/*
 * Default media
 * Media item is on the left of the body
 * Body wraps around the image
 */

.media {
    overflow: hidden;
}

.media-item {
    float: left;
    margin-right: 10px;
}

/*
 * Flipped media
 * Media item is on the right of the body
 * Body wraps around the image
 */

.media-flip,
.media-flip > .media-body {
    display: inline-block; /* make the media as width as it's content */
}

.media-flip > .media-item {
    float: right;
    margin-left: 10px;
    margin-right: 0;
}

/*
 * Stacked media
 * Media item on top of the body (no float)
 */

.media-stack > .media-item {
    float: none;
    margin-right: 0;
    margin-bottom: 10px;
}

/*
 * Nowrap media
 * Image is floated
 * Body does not wrap around the floated image
 */

.media-nowrap > .media-body {
  overflow: hidden;
}

/*
 * Vertical aligned media (Flag)
 * Image is on the left
 * Body is centerd against the image
 */

.media-valign { display: table; }

.media-valign > .media-item,
.media-valign > .media-body {
  display: table-cell;
  vertical-align: middle;
}

.media-valign > .media-item {
    float: none;
    padding-right: 10px;
}

/**
 * Reversed/flipped flag
 * This extends the .media-valign class
 * To flip just change the order of the item and bodyF
 */
.media-valign-flip > .media-item {
    padding-left: 10px;
    padding-right: 0;
}

/*Business Lead Genertation
*thank you page
*/
.media-thankyou{
    font-size: 20px;
}

/* Full width flag (similar to default media obj) */
.media-valign-full > .media-body { width: 100%; }

/*
 * Responsive media
 * Media item changes aspect on mobile devices
 */

@media only screen and (max-width: 766px) {
    .media-responsive {
        display: block;
    }

    .media-responsive > .media-item {
        float: none;
        margin: 0 0 10px 0;
        padding: 0;
    }

    .media-responsive > .media-item,
    .media-responsive > .media-body {
        display: block;
    }
}

/* Media Extends */

.media-popular-accessories > .media-item {
    position: relative;
    text-align: center;
}

.media-popular-accessories > .media-body {
    font-family: 'VodafoneRegular';
    font-size: 24px;
    color: #e60000;
}

@media only screen and (min-width: 767px) {
    .media-popular-accessories > .media-item {
        width: 45%;
        margin-right: 50px;
    }

    .media-popular-accessories > .media-body {
        width: 55%;
    }
}

/*
   Responsive media

   [1] - Item's height is given via bottom padding in percents relative
        to width (see [2])
   [2] - Two aspects ratios (16:9 and 4:3)
   [3] - The media is absolutely placed over the parent
        (padding from [2] pushes content down)
   ========================================================================== */

.embed-responsive {
    position: relative;
    display: block;
    height: 0; /* [1] */
    padding: 0;
    overflow: hidden;
}

.embed-responsive-16by9 {
    padding-bottom: 56.25%; /* [2] */
}

.embed-responsive-4by3 {
    padding-bottom: 75%; /* [2] */
}

.embed-responsive-item {
    position: absolute; /* [3] */
    top: 0px;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    border: 0px none;
}



/*
   Hero Banner
   ========================================================================== */

/**
 * We add a top margin for the hero banner on low res devices to prevent the
 * logo from overlapping it (this is noticeable when there is no other element
 * above the banner).
 */
@media only screen and (min-width: 767px) {
    .hero-banner {
        margin-top: 20px;
    }
}

@media only screen and (min-width: 1140px) {
    .hero-banner {
        margin-top: 0;
    }
}



/*
   Youtube Video
   ========================================================================== */

.youtube-video {
    position: relative;
}

.youtube-video::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .75);
    z-index: 10;
}

.youtube-play {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 77px;
    height: 77px;
    background: transparent url('../../css/img/icon/play.png') no-repeat center center;
    cursor: pointer;

    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 20;
}

.youtube-play-original {
    opacity: .75;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 68px;
    height: 48px;
    background: transparent url('img/icon/yt-play-btn-dark.png') no-repeat center center;
    cursor: pointer;

    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);

    -webkit-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;

    z-index: 20;
}

.youtube-play-original:hover {
    background-image: url('img/icon/yt-play-btn-color.png');
}

.youtube-video::after,
.youtube-thumb,
.youtube-play {
    opacity: 1;

    -webkit-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
}

.youtube-video.is-video-playing::after,
.youtube-video.is-video-playing .youtube-thumb,
.youtube-video.is-video-playing .youtube-play {
    opacity: 0;
}

.youtube-video.is-video-playing iframe {
    z-index: 900;
}

/*
   Tooltips
   ========================================================================== */

/* Inline tooltip */

.wrap-tooltip {
    position: relative;
}

.wrap-tooltip .tg-tooltip {
    display: inline-block;
    position: static;
}

.wrap-tooltip .tg-tooltip .tg-body {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 11;
}


/*
   Spacers
   ========================================================================== */

.spacer {
    display: block;
}

.spacer-light {
    background-color: #e3e3e3;
}

.spacer-vertical {}

.spacer-vertical-default {
    width: 1px;
}

.spacer-vertical-md {
    width: 2px;
}

.spacer-vertical-lg {
    width: 3px;
}

.spacer-horizontal {}

.spacer-horizontal-default {
    height: 1px;
}

.spacer-horizontal-md {
    height: 2px;
}

.spacer-horizontal-lg {
    height: 3px;
}

/*
   Buttons
   ========================================================================== */

.btn {
    text-decoration: none;
}

.btn-overlay {
    background-color: rgba(50, 50, 50, .75);
}

.btn-overlay:hover,
.btn-overlay:active,
.btn-overlay:focus {
    background-color: rgba(50, 50, 50, 1);
}

.btn-flat {
    border: 1px solid #a9a9a9;
    border-radius: 0;
    background-color: transparent;
    box-shadow: unset;
    color: #424242;
}

.btn-flat:hover,
.btn-flat:focus,
.btn-flat:active,
.btn-flat:visited {
    background-color: transparent;
    box-shadow: unset;
    color: #424242;
}

.btn-wide {
    width: 100%;
}

.btn-icon span {
    vertical-align: middle;
}

/*
   Spinners
   ========================================================================== */

.spinner { }

.spinner-sml {
    height: 22px;
    width: 22px;
}

.spinner-lrg {
    height: 28px;
    width: 28px;
}

.spinner-snake {
    -webkit-animation: rotate 0.8s infinite linear;
    -ms-animation: rotate 0.8s infinite linear;
    animation: rotate 0.8s infinite linear;
    border-style: solid;
    border-radius: 50%;
    border-color: #333 transparent #333 #333;
}

.spinner-sml.spinner-snake {
    border-width: 2px;
}

.spinner-lrg.spinner-snake {
    border-width: 8px;
}

/*.spinner-snake-light {
    border-color: #fff transparent #fff #fff;
}

.spinner-snake-dark {
    border-color: #333 transparent #333 #333;
}*/

@keyframes rotate {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/**
 * Orbital Spinner
 * Inspired by: http://codepen.io/biht/pen/azQVxQ
 * Structure:
    <div id="spinner-orbital">
        <div class="spinner-orbital-wrap">
            <ul class="spinner-orbital-bokeh">
                <li></li>
                <li></li>
                <li></li>
                <li></li>
            </ul>
        </div>
    </div>
 */

/* Spinner container */
#spinner-orbital {
    opacity: .95;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9999;
    background: #222;
}

/* Spinner container gradient */
#spinner-orbital::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    background: -webkit-radial-gradient(center center, circle cover, rgba(0,0,0,0), rgba(0,0,0,0.75));
    background: radial-gradient(center center, circle cover, rgba(0,0,0,0), rgba(0,0,0,0.75));
}

.spinner-orbital-wrap {
    position: fixed;
    top: 45%;
    right: 25%;
    bottom: 45%;
    left: 25%;
}

.spinner-orbital-text {
    margin-top: 10px;
    color: #999;
    text-align: center;
}

/* Orbit */
.spinner-orbital-bokeh {
    position: relative;
    width: 1em;
    height: 1em;
    margin: 0 auto;
    padding: 0;
    border: .01em solid rgba(150,150,150,0.1);
    border-radius: 50%;
    font-size: 100px;
}

.spinner-orbital-bokeh li {
    position: absolute;
    width: .2em;
    height: .2em;
    border-radius: 50%;
}

/* Circles */
.spinner-orbital-bokeh li:nth-child(1) {
    left: 50%;
    top: 0;
    margin: 0 0 0 -.1em;
    background: #9c2aa0;

    -webkit-transform-origin: 50% 250%;
    transform-origin: 50% 250%;

    -webkit-animation:
        rota 1.13s linear infinite,
        opa 3.67s ease-in-out infinite alternate;
    animation:
        rota 1.13s linear infinite,
        opa 3.67s ease-in-out infinite alternate;
}

.spinner-orbital-bokeh li:nth-child(2) {
    top: 50%;
    right: 0;
    margin: -.1em 0 0 0;
    background: #e60000;

    -webkit-transform-origin: -150% 50%;
    transform-origin: -150% 50%;

    -webkit-animation:
        rota 1.86s linear infinite,
        opa 4.29s ease-in-out infinite alternate;
    animation:
        rota 1.86s linear infinite,
        opa 4.29s ease-in-out infinite alternate;
}

.spinner-orbital-bokeh li:nth-child(3) {
    left: 50%;
    bottom: 0;
    margin: 0 0 0 -.1em;
    background: #ff5400;
    -webkit-transform-origin: 50% -150%;
    transform-origin: 50% -150%;

    -webkit-animation:
        rota 1.45s linear infinite,
        opa 5.12s ease-in-out infinite alternate;
    animation:
        rota 1.45s linear infinite,
        opa 5.12s ease-in-out infinite alternate;
}

.spinner-orbital-bokeh li:nth-child(4) {
    top: 50%;
    left: 0;
    margin: -.1em 0 0 0;
    background: #427d00;

    -webkit-transform-origin: 250% 50%;
    transform-origin: 250% 50%;

    -webkit-animation:
        rota 1.72s .1s linear infinite,
        opa 5.25s .1s ease-in-out infinite alternate;
    animation:
        rota 1.72s .1s linear infinite,
        opa 5.25s .1s ease-in-out infinite alternate;
}

/* Rotation keyframes */
@-webkit-keyframes rota {
    from { }
    to { -webkit-transform: rotate(360deg); }
}

@keyframes rota {
    from { }
    to { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

/* Opacity keyframes */
@-webkit-keyframes opa {
    0% { }
    12.0% { opacity: 0.80; }
    19.5% { opacity: 0.88; }
    37.2% { opacity: 0.64; }
    40.5% { opacity: 0.52; }
    52.7% { opacity: 0.69; }
    60.2% { opacity: 0.60; }
    66.6% { opacity: 0.52; }
    70.0% { opacity: 0.63; }
    79.9% { opacity: 0.60; }
    84.2% { opacity: 0.75; }
    91.0% { opacity: 0.87; }
}

@keyframes opa {
    0% { }
    12.0% { opacity: 0.80; }
    19.5% { opacity: 0.88; }
    37.2% { opacity: 0.64; }
    40.5% { opacity: 0.52; }
    52.7% { opacity: 0.69; }
    60.2% { opacity: 0.60; }
    66.6% { opacity: 0.52; }
    70.0% { opacity: 0.63; }
    79.9% { opacity: 0.60; }
    84.2% { opacity: 0.75; }
    91.0% { opacity: 0.87; }
}


/*
   Box
   ========================================================================== */

.box {
    margin-bottom: 30px;
    padding: 15px 10px;
    border: 1px solid #e9e9e9;
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(50, 50, 50, 0.75);
}

.box-title {
    overflow: hidden;
    margin-bottom: 10px;
    padding: 0 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.box-banner {
    margin-bottom: 10px;
}

.box-banner img {
    width: 100%;
    max-width: 100%;
}

.box-body {
    padding: 0 10px;
}

.box-body p {
    margin-bottom: 10px;
    line-height: 1.2;
}

.box-homepage {
    overflow: hidden;
    position: relative;
}

@media only screen and (min-width: 767px) {
    .box-homepage {
        height: 352px;
    }

    .box-homepage .btn {
        position: absolute;
        bottom: 10px;
    }
}

/*
   Lists
   ========================================================================== */

/*.wysiwyg ul,
.wysiwyg ol,
.list {
    padding-left: 20px;
    padding-right: 20px;
}*/

/* @TODO: Remove after old styles are purged (added to overwrite some FC4 old styles) */
.list li {
    list-style-type: inherit;
}

/*
   Tables
   ========================================================================== */

.table-default thead {
    display: table-header-group;
}

.table-default tr {
    display: table-row;
}

.table-default th,
.table-default td {
    display: table-cell;
    padding: 5px;
}

.table-blank tr,
.table-blank th,
.table-blank td {
    border: 0;
}

.table-stripped tbody tr:nth-child(odd) th,
.table-stripped tbody tr:nth-child(odd) td,
.table-stripped-even thead th,
.table-stripped-even thead td,
.table-stripped-even tbody tr:nth-child(even) th,
.table-stripped-even tbody tr:nth-child(even) td {
    background-color: #f4f4f4;
}

.table-row-emphasize td,
.table-row-emphasize-alt td {
    font-weight: bold;
}

.table-row-emphasize-alt td {
    color: #9c2aa0;
}

.table-broadband-coverage {
    border-collapse: separate;
    border-spacing: 3px;
}

.table-broadband-coverage tr {
    border: none;
}

.table-broadband-coverage th {
    padding: 14px;
    border-radius: 5px;
    background-color: #e60000;
    font-weight: bold;
    color: #fff;
    text-align: center;
    vertical-align: middle;
}

.table-broadband-coverage td {
    padding: 0;
    border-radius: 5px;
    vertical-align: middle;
    text-align: center;
}

.table-broadband-coverage th {
    padding: 14px;
    border-radius: 5px;
    background-color: #e60000;
    color: #fff;
    vertical-align: middle;
}

.table-broadband-coverage .content-cell {
    padding: 50px 14px;
    background-color: #bcbdc1;
    font-weight: 700;
}

.table-broadband-coverage tfoot td {
    padding-top: 25px;
}

.table-broadband-coverage .btn {
    width: 100%;
    margin: 10px 0;
    font-size: 14px;
}

.table-broadband-coverage .border-cell {
    border-bottom: 1px solid #bcbdc1;
    border-radius: 0;
}

.table-obp-details td {
    padding: 15px 25px;
    vertical-align: middle;
}

.table-obp-details tfoot td {
    font-size: 18px;
}

@media only screen and (max-width: 767px) {
    /* Responsive Table - Scroll */
    .table-responsive-scroll {
        display: block;
    }

    .table-responsive-scroll tr {
        padding: 0;
    }

    .table-responsive-scroll th,
    .table-responsive-scroll td {
        padding: 7px 10px;
    }

    .table-responsive-scroll th + th,
    .table-responsive-scroll td + td {
        border-top: 1px solid #b5b5b5;
    }

    .table-responsive-scroll thead {
        display: block;
        float: left;
    }

    .table-responsive-scroll thead tr,
    .table-responsive-scroll thead th {
        display: block;
    }

    .table-responsive-scroll thead th {
        font-weight: bold;
    }

    .table-responsive-scroll tbody {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
        font-size: 0; /* needed to remove spacing between columns induces by display inline-block on the <tr>s */
    }

    .table-responsive-scroll tbody tr {
        display: inline-block;
        border: 0;
        font-size: 14px; /* we set font-size to 0 on the parent <tbody> so we need to reset it to the default value now */
    }

    .table-responsive-scroll tbody td {
        display: block;
        border-width: 1px 0 0 0;
    }

    .table-responsive-scroll tbody td:last-child {
        border-bottom-width: 1px;
    }

    /* Responsive Table - Blocks */
    .table-responsive-blocks,
    .table-responsive-blocks thead,
    .table-responsive-blocks tbody,
    .table-responsive-blocks tr,
    .table-responsive-blocks th,
    .table-responsive-blocks td {
      display: block;
    }

    .table-responsive-blocks tr {
        margin: 10px 0;
        padding: 0;
        border-top: 3px solid #b5b5b5;
        border-bottom: 3px solid #b5b5b5;
    }

    .table-responsive-blocks tr:first-child {
        border-top: 3px solid #b5b5b5;
    }

    .table-responsive-blocks tr:nth-child(2n+1) {
        background-color: #f5f5f5;
    }

    /* Move table headers out of the viewport; keep them for accessibility */
    .table-responsive-blocks thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .table-responsive-blocks td {
        padding: 7px 10px;
    }

    .table-responsive-blocks tbody td {
        border: 1px solid #b5b5b5;
        border-width: 0 1px 1px 1px;
        padding-left: 50%;
    }



    .table-responsive-blocks tbody td:last-child {
        border-bottom-width: 0;
    }

    /* Add table headers before the content cells */
    .table-responsive-blocks tbody td:before {
        content: attr(data-title);
        display: inline-block;
        width: 95%;
        padding-right: 5%;
        margin-left: -100%;
        font-weight: bold;
    }
}

@media only screen and (min-width: 767px) {
    .table-default th,
    .table-default td {
        padding: 7px 10px;
    }

    .table-broadband-coverage .broadband-speeds {
        padding: 0;
        border-radius: 0;
        background-color: transparent;
        vertical-align: bottom;
    }

    .table-broadband-coverage .broadband-speeds div {
        padding: 14px;
        border-radius: 5px;
        background-color: #e60000;
        color: #fff;
    }

    .table-broadband-coverage td {
        vertical-align: bottom;
    }

    .table-broadband-coverage .content-cell {
        padding: 14px;
        vertical-align: middle;
    }

    .table-broadband-coverage .btn {
        margin: 0;
        padding-left: 15px;
        padding-right: 15px;
    }

    .table-broadband-coverage .border-cell {
        border-bottom: 1px solid #bcbdc1;
        border-radius: 0;
    }
}


/*
   Animations
   ========================================================================== */

.transition05 {
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.transition10 {
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -ms-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
}

.transition12 {
    -webkit-transition-duration: 1.2s;
    -moz-transition-duration: 1.2s;
    -ms-transition-duration: 1.2s;
    -o-transition-duration: 1.2s;
    transition-duration: 1.2s;
}

.transition15 {
    -webkit-transition-duration: 1.5s;
    -moz-transition-duration: 1.5s;
    -ms-transition-duration: 1.5s;
    -o-transition-duration: 1.5s;
    transition-duration: 1.5s;
}

@media only screen and (min-width: 767px) {
    .animated {
        visibility: hidden;
    }
}

/* Taken from animate.css @ https://github.com/daneden/animate.css */

.is-animated.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.is-animated.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.is-animated.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.is-animated.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.is-animated.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }

  70% {
    -webkit-transform: scale(.9);
    transform: scale(.9);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: scale(.3);
    -ms-transform: scale(.3);
    transform: scale(.3);
  }

  50% {
    opacity: 1;
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
  }

  70% {
    -webkit-transform: scale(.9);
    -ms-transform: scale(.9);
    transform: scale(.9);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
  }
}

.is-animated.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

/* Custom keyframes */
@-webkit-keyframes fadeInOut {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes fadeInOut {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

/*
   Forms
   ========================================================================== */

/* Small input (half width) */
.input-sm {
    width: 50%;
}

/* Hide IE10+ clear button next to inputs */
.input-clearable::-ms-clear {
    display: none;
}

/**
 * Inline forms
 * The VFGroup implementation for combined inputs in inline forms is poor, almost non-existent
 */
.fm-inline .fm-combine {
    max-width: none; /* don't limit the width of the combined inputs container */
}

.fm-inline .fm-data-group {
    /* overwrite vfgroup styles because of collapsible margins */
    display: inline-block;
    width: 100%;
    margin: 0;
}

.fm-inline .fm-data-group .fm-data {
    margin: 0; /* reset vfgroup styles because we don't need margins anymore as we use grids */
}

/* Addons */
.input-group {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;

    -ms-flex-align: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    align-items: center;
    justify-content: center;

    padding: 3px;
    border: 1px solid #e9e9e9;
    border-radius: 3px;
    background-color: #fff;
    box-shadow: 0 1px 2px rgba(50, 50, 50, 0.75) inset;
}

.input-group-sm {
    width: 50%;
}

.input-group input,
.input-group select,
.input-group textarea {
    overflow: hidden;

    -webkit-flex: 1 0 0px;
    -ms-flex: 1 0 0px;
    flex: 1 0 0px;

    border: none;
    border-radius: 0;
    box-shadow: none;
}

.input-group-addon {
    padding: 4px 7px;
    font-size: 16px;
    border-style: solid;
    border-color: #b5b5b5;
}

.input-group-addon:first-child {
    border-width: 0 1px 0 0;
}

.input-group-addon:last-child {
    border-width: 0 0 0 1px;
}

.input-clear {
    display: none;
    cursor: pointer;
}

.l-flex-center input,
.l-flex-center select,
.l-flex-center textarea {
    width: 100%; /* make all inputs in a flex layout full width */
}

@media only screen and (min-width: 767px) {
    .input-sm {
        width: 145px; /* half the width from VFGroup */
    }

    .fm-inline .fm-data-group {
        width: 290px; /* default VFGroup input width */
    }

    .input-group {
        width: 290px;
    }

    .input-group-sm {
        width: 145px;
    }

    .ng-content .fm-inline label,
    .ng-content .fm-inline .fm-label,
    .ng-content .fm-inline legend {
        /* make form label smaller on pages with a side menu */
        width: 220px;
    }

    .ng-content .fm-inline .fm-caption,
    .ng-content .fm-inline .fm-submit {
        /* align the submit btn and caption with the left side of the input */
        padding-left: 220px;
    }
}

.online-recharge-phone-wrap .input-group {
    width: 150px;
}

/*@media only screen and (max-width: 783px) {
    .fm-inline .fm-data-group{
        width: 200px;
    }
}*/

@media only screen and (min-width: 992px) {
    .input-group-addon {
        font-size: 14px;
    }
}

/*
   Logo
   ========================================================================== */

.sticky-logo {
    display: none;
    float: left;
    width: 50px;
    padding: 5px 5px 0 10px;
}

@media only screen and (min-width: 767px) {
    .sticky .rhombus,
    .sticky #logo {
        display: none;
    }

    .sticky .sticky-logo {
        display: block;
    }

    .mod-nav .rhombus {
        z-index: 10;
    }
}

/*
   Navigation
   ========================================================================== */

ul#nav-business-customer {
    width: 135%;
}

.nav-aux .tg-body {
    width: 111%;
}

.mod-nav {
    position: fixed;
    width: 100%;
    z-index: 100;
    background-color: #222;
}

/* Fix for fixed elements on touch devices on input focus */
.has-touch .mod-nav {
    position: static;
}

.nav-base-inner {
    overflow-y: auto;
}

/*.sticky .nav-base-inner {
    overflow-y: scroll;
    position: relative;
}*/

.nav-content .foot {
    display: block;
    overflow: hidden;
    padding: 20px;
}

.nav-content .foot-left {
    float: left;
}

.nav-content .foot-right {
    float: right;
}

.nav-content .foot-left a,
.nav-content .foot-right a {
    margin: 0;
    padding: 0 5px;
}

.nav-content .foot-left a:first-child {
    padding-left: 0;
}

.nav-content .foot-right a:last-child {
    padding-right: 0;
}

.nav-content .foot .nav-close {
    display: none;
}

.is-nav-open {
    /*prevent scrolling on body when the menu is opened */
    position: fixed;
    width: 100%;
    overflow: hidden;
}

.fl a {
    text-decoration: none;
}

@media only screen and (min-width: 767px) {

    #nav-plansnumbersen_gb .body.grid {
            /*margin-left: -90px;*/
    }

    .mod-nav {
        position: relative;
        width: auto;
        background-color: transparent;
    }

    .nav-base-inner {
        overflow-y: inherit;
    }

    .nav-container {
    	min-height:39px;
        /*margin-bottom: 25px;*/
    }

    .nav-base {
        margin-bottom: 0;
    }

    .sticky .nav-container {
        width: 100%; /* need this for IE centering */
    }

    .sticky .nav-base,
    .lt-ie9 .sticky .nav-base {
        position: fixed;
        left: 0;
        right: 0;
        width: inherit;
        z-index: 100;
        max-width: 1250px;
        margin: 0 auto;
        /*padding: 0 15px;*/
    }

    .sticky .nav-base {
        -webkit-transform: translateZ(0); /* fixing rendering issues with "position: fixed" on the navbar */
    }

    .nav-menu a {
        margin-bottom: 0;
        padding-bottom: 10px;
    }

    .nav-content .items {
        width: 25%;
        padding: 0 20px;
    }

    .nav-content .foot {
        padding: 15px 25px;
    }

    .nav-content .foot-left a,
    .nav-content .foot-right a {
        padding: 10px 5px;
    }

    .nav-content .foot .nav-close {
        display: inline-block;
    }

    .nav-aux > ul > li:last-child > a {
        padding-left: 5px;
        padding-right: 5px;
    }

    .nav-aux > ul > li:nth-child(3) > a {
        padding-right: 5px;
    }

    .nav-aux > ul > li:first-child > a {
        padding-right: 0;
        padding-left: 5px;
    }

    /* Business nav */
    .nav-business-plans .items {
        width: 20%;
    }

    .nav-business-support .items {
        width: 33%;
    }
}

@media only screen and (max-width: 820px) {
    .nav-business .nav-primary a {
        padding-top: 12px;
        padding-bottom: 12px;
        font-size: 18px;
    }
}

@media only screen and (min-width: 1140px) {
    .nav-aux ul > li:first-child > a {
        padding-left: 10px;
    }

    .nav-aux ul > li:nth-child(3) > a {
        padding-right: 10px;
    }

    .nav-aux > ul > li:last-child > a {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/*
   Side Nav
   ========================================================================== */

@media only screen and (max-width: 766px) {
    /* Color the parent menu container on mobile (otherwise only the link is colored) */
    .nv-sub-selected {
        margin-left: -4px; /* make it full width */
        margin-right: -4px;
        padding-right: 4px; /* this is needed to correct the missalignment of the dropdown arrow, caused by the right negative margin */
        background-color: #f4f4f4;
    }

    /* Cancel default link styles on parent */
    .nv-sub-selected .nv-selected {
        margin-left: 0;
        margin-right: 0;
    }
}

@media only screen and (min-width: 767px) {
    .nav-vertical .nv-sub .nv-selected {
        font-weight: 700;
    }
}

/*
   Side Nav - THIS IS JUST TEMPORARY DESIGN - TO BE CHANGED IN THE FINAL VERSION
   ========================================================================== */

.old-lhn-rwd.ng-menu li a {
    display: block;
    padding: 10px;
    border-bottom: 1px solid #CCC;
    outline: medium none;
    font-size: 13px;
    line-height: 15px;
    text-decoration: none;
}

.old-lhn-rwd.ng-menu li a:hover,
.old-lhn-rwd.ng-menu li a:focus,
.old-lhn-rwd.ng-menu li a:active,
.old-lhn-rwd.ng-menu li.parent li a:hover,
.old-lhn-rwd.ng-menu li.parent li a:focus,
.old-lhn-rwd.ng-menu li.parent li a:active {
    color: #e60000;
    font-weight: bold;
}

.old-lhn-rwd.ng-menu li.active {
    position: relative;
    background: none repeat scroll 0 0 #5b5b5b;
    z-index: 1;
}

.old-lhn-rwd.ng-menu li.active:after {
    content: "";
    position: absolute;
    top: 0;
    left: 100%;
    width: 10px;
    height: 100%;
    background: transparent url('../../css/img/icon/nav-vert-arrow.png') no-repeat center center;
}

.old-lhn-rwd.ng-menu li.parent li a {
    position: relative;
    padding-left: 28px;
    padding-right: 5px;
    /*background: url("/cssold/images/common/sprite2.png") no-repeat scroll 18px -3123px transparent;*/
    font-weight: normal;
    outline: medium none;
    color: #333;
}

.old-lhn-rwd.ng-menu li.parent li a:before {
    content: "";
    display: block;
    position: absolute;
    left: 20px;
    top: 50%;
    width: 4px;
    height: 1px;
    margin-top: -0.5px;
    background-color: #333;
    z-index: 5;
}

.old-lhn-rwd.ng-menu li.parent li a:hover:before,
.old-lhn-rwd.ng-menu li.parent li a:focus:before,
.old-lhn-rwd.ng-menu li.parent li a:active:before {
    background-color: #e60000;
}

.old-lhn-rwd.ng-menu li.parent li.active a {
    color: #FFF;
    text-decoration: none;
    font-weight: bold;
}

.old-lhn-rwd.ng-menu li.parent li.active a:before {
    background-color: #fff;
}


/*
   Callouts
   ========================================================================== */
/* Default - White text on red background */
.callout {
    padding: 45px 0;
    background-color: #e60000;
    text-align: center;
}

.callout h2 {
    color: #fff;
}

/*
   Sliders
   ========================================================================== */

/* Generic Flexslider */

.flexslider {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.flex-viewport {
    position: relative;
    z-index: 5;
}

.flex-direction-nav {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    margin-top: -85px;
    padding: 20px 0;
    border-left: 1px solid #bbbbbb;
    border-right: 1px solid #bbbbbb;
}

.flex-direction-nav a {
    position: relative;
    width: 35px;
    height: 80px;
    background-color: #fff;
    border-image: none;
    font-size: 0;
    text-align: center;
    z-index: 3;
}

.flex-direction-nav .flex-prev {
    left: auto;
    float: left;
    border-left: none;
    border-right: 1px solid #eeeeee;
    border-radius: 0 3px 3px 0;
    border-style: solid none solid solid;
    border-width: 1px medium 1px 1px;
    border-color: #dddddd currentColor #eeeeee #eeeeee;
    box-shadow: 1px 2px 1px rgba(150, 150, 150, 0.75);
}

.flex-direction-nav .flex-next {
    right: auto;
    float: right;
    border-left: 1px solid #eeeeee;
    border-radius: 3px 0 0 3px;
    border-style: solid solid solid none;
    border-width: 1px 1px 1px medium;
    border-color: #dddddd #eeeeee #eeeeee currentColor;
    box-shadow: -1px 2px 1px rgba(150, 150, 150, 0.75);
}

.flex-direction-nav a:after {
    content: "";
    display: inline-block;
    position: relative;
    top: 27px;
    width: 13px;
    height: 25px;
    background: transparent url('../../css/img/icon-s89931741e5.png') no-repeat 0 0;
}

.flex-direction-nav .flex-prev:after {
    background-position: -987px 0;
}

.flex-direction-nav .flex-next:after {
    background-position: -1005px 0;
}

.flex-nav-container {
    margin-bottom: 30px;
    text-align: center;
}

/* Navigation is next to pagination*/

.flex-nav-container .flex-control-nav {
    position: static;
    display: inline-block;
    width: auto;
    margin-top: 0;
    margin-right: 15px;
    text-align: center;
}

.flex-nav-container .flex-control-nav li {
    margin: 0;
}

.flex-nav-container .flex-control-paging li a {
    display: block;
    margin: 0 5px 5px 4px;
    padding: 4px;
    border: 1px solid #6d6d6d;
    border-radius: 8px;
    background: none;
    box-shadow: none;
}

.flex-nav-container .flex-control-paging li a.flex-active {
    background-color: #6d6d6d;
}

.flex-nav-container .flex-direction-nav {
    position: static;
    display: inline-block;
    width: auto;
    padding: 4px 0;
    border: 1px solid #eeeeee;
    border-radius: 25px;
    background: none repeat scroll 0 0 #fff;
    box-shadow: -1px 2px 1px rgba(150, 150, 150, 0.75);
}

.flex-nav-container .flex-direction-nav li {
    float: left;
}

.flex-nav-container .flex-direction-nav a {
    /*opacity: 0;*/
    display: block;
    position: relative;
    float: none;
    width: auto;
    height: auto;
    padding: 10px 15px;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    font-size: 0;
    /*top: 50%;*/
    /*width: 30px;
    height: 75px;*/
    /*margin-top: -37.5px;*/
    /*z-index: 10;*/
    /*border: 1px solid #ddd;
    background-color: #fff;
    font-size: 0;
    text-decoration: none;

    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    transition: all .3s ease;*/
}

.flex-nav-container .flex-direction-nav li:first-child a {
    border-right: 1px solid #ccc;
}

.flex-nav-container .flex-direction-nav a:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 6px;
    height: 10px;
    margin: -5px 0 0 -3px;
}

.flex-nav-container .flex-direction-nav .flex-prev {
    left: auto;
    /*border-radius: 0 3px 3px 0;
    box-shadow: 1px 2px 1px rgba(150, 150, 150, 0.75);*/
}

.flex-nav-container .flex-direction-nav .flex-prev:after {
    background-position: -358px 0;
}

.flex-nav-container .flex-direction-nav .flex-next {
    right: auto;
    /*border-radius: 3px 0 0 3px;
    box-shadow: -1px 2px 1px rgba(150, 150, 150, 0.75);*/
}

.flex-nav-container .flex-direction-nav .flex-next:after {
    background-position: -436px 0;
}


/* Homepage slider */

.flexslider-hp {
    margin-bottom: 30px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

.flexslider-hp .teaser .btn-wrap {
    left: 30px;
    right: 30px;
}

.flexslider-hp .flex-caption,
.flexslider-hp .lt-ie9 .flex-caption {
    position: static;
    min-height: 0;
    margin-bottom: 0;
    border: 0 none;
    border-radius: 0;
    box-shadow: none;
}

.flexslider-hp .flex-progress-container {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
    opacity: 0.75;
    position: absolute;
    bottom: 0;
    width: 100%;
    z-index: 10;
}

.flexslider-hp .flex-progress {
    width: 0;
    height: 4px;
    background: #e60000;
}

@media only screen and (min-width: 767px) {
    .flexslider-hp .flex-caption,
    .lt-ie9 .flexslider-hp .flex-caption {
        position: absolute;
        top: 0;
        width: 100%;
    }

    .flexslider-hp .flex-caption .mod-banner {
        margin: 8% 0 0;
        background: none;
    }

    .flexslider-hp .flex-caption .txt-wrap {
        color: #fff;
    }
}

.HP-full-width-container {
    width:100%;
    margin-bottom: 2%;
}

/* Plans & Extras sliders */

.slides .anghami {
    background: url('/images/dmImage/SourceImage/icon-1.png') no-repeat center left 30px;
    background-size: 40px;
}

.slides .osn {
    background: url('/images/dmImage/SourceImage/osn-go-160x161.png') no-repeat center left 35px;
    background-size: 36px;
}

.flexslider-plans-nav-wrapper {
    visibility: hidden;
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 0;
}

.flexslider-plans-nav {
    overflow: visible;
    position: static;
    /* center active slide */
    width: 240px;
    margin: 0 auto;
    box-shadow: none;
    border-radius: 0;
}

.flexslider-plans-nav .flex-viewport {
    overflow: visible !important;
    z-index: 1; /* need this to put the nav elements over the slider body */
}

.flexslider-plans-nav .flex-direction-nav {
    top: 0;
    left: 0;
    margin-top: 0;
    padding: 0;
    border: 0;
}

.flexslider-plans-nav .slides li {
    padding: 15px 0;
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 20px;
    text-align: center;
    cursor: pointer;
}

.flexslider-plans-nav .slides .flex-active-slide {
    font-family: 'Signika Negative', Arial, sans-serif;
    font-weight: 700;
    color: #e60000;
}

.flexslider-plans-nav .flex-direction-nav a {
    display: block;
    width: 245px;
    height: 50px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    font-size: 0;
}

.flexslider-plans-nav .flex-direction-nav a:after {
    content: none;
}

.flexslider-plans-nav .flex-prev {
    left: 0;

    background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
}

.flexslider-plans-nav .flex-next {
    right: 0;

    background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
}

.flexslider-plans {
    margin: 0;
    padding: 0 40px;
    text-align: center;
}

.flexslider-plans .btn {
    max-width: 99%;
}

.flexslider-plans .plan-name {
    margin: 30px 0px;
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 30px;
    line-height: 1.2;
}

.flexslider-plans .slider-body {
    position: relative;
}

.flexslider-plans .slides img {
    width: auto;
    margin: 0 auto 30px;
}

.flexslider-plans .flex-direction-nav {
    top: 130px;
    margin-top: 0;
}

.flexslider-plans .flex-control-thumbs {
    display: none;
    margin-top: 50px;
}

.flexslider-plans .flex-control-thumbs li {
    width: 12%;
    margin: 0 5px;
}

.flexslider-plans .flex-control-thumbs img {
    border: 1px solid #ddd;
}

.flexslider-plans .flex-control-thumbs img:hover,
.flexslider-plans .flex-control-thumbs .flex-active {
    border-color: #e60000;
}

.flexslider-plans .info {
    /*width: 50%;*/
    margin: 30px auto 0;
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 16px;
    text-align: center;
}

.flexslider-plans .price {
    margin-bottom: 20px;
}

.flexslider-plans .value,
.flexslider-plans .period {
    display: block;
}

.flexslider-plans .value {
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-size: 76px;
    line-height: 1;
    color: #e60000;
}

.flexslider-plans .value sup {
    font-size: 30%;
}

@media screen and (min-width: 767px) {
    .flexslider-plans-nav-wrapper {
        visibility: visible;
        height: auto;
    }

    .flexslider-plans {
        padding: 0 60px;
        text-align: left;
        min-height: 250px;
    }

    .flexslider-plans .flex-direction-nav {
        top: 60px;
    }

    .flexslider-plans .flex-control-thumbs {
        display: block;
    }
}

/**
 * General sequence sliders
 * For more info check http://www.sequencejs.com/developers/documentation/
 */

.sequence {
    position: relative; /* required */
}

.sequence-canvas { /* required */
     height: 100%;
     width: 100%;
     padding: 0;
     list-style: outside none;
}

.sequence-canvas > li { /* required */
     position: absolute;
     width: 100%;
     height: 100%;
     z-index: 1;
     list-style: outside none;
}

.sequence-canvas li > * {  /* required */
    position: absolute;
}

.video-sequence-next,
.video-sequence-prev {
    position: absolute;
    top: 50%;
    z-index: 100;
    margin-top: -45px;
}

.video-sequence-prev {
    left: -50px;
}

.video-sequence-next {
    right: -50px;
}

.sequence-next,
.sequence-prev {
   display: block;
   width: 40px;
   height: 90px;
   background-image: url('../../../../../css/images/4g/4g-sprite.png');
   background-repeat: no-repeat;
}

.sequence-next-white {
   background-position: -110px 4px;
}

.sequence-next-white:hover {
   background-position: -36px 4px;
   text-decoration: none;
}

.sequence-prev-white {
   background-position: -73px 4px;
}

.sequence-prev-white:hover {
   background-position: 0 4px;
   text-decoration: none;
}

.sequence-controls {
    position: absolute;
}

.sequence-pagination {
    overflow: hidden;
    padding: 0;
}

.sequence-pagination > li {
    float: left;
    list-style: outside none;
}

@media only screen and (min-width: 767px) {
    .video-sequence {
        margin: 0 30px;
    }
}

@media only screen and (min-width: 1200px) {
    .video-sequence-prev {
        left: -80px;
    }

    .video-sequence-next {
        right: -80px;
    }
}

/*
   Pie Chart Progress
   ========================================================================== */

.charts-container {
    text-align: center;
}

.chart-wrapper {
    display: inline-block;
    margin-bottom: 20px;
}

.chart-title {
    margin-bottom: 20px;
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-size: 18px;
    color: #e60000;
}

.chart-wrapper .percentage {
    color: #9a2ca5;
    display: table-cell;
    font-family: "VodafoneLight",Arial,sans-serif;
    font-size: 22px;
    line-height: 1;
    text-align: center;
    vertical-align: middle;
}

.chart-wrapper .percentage .data {
    font-size: 32px;
}

.chart-wrapper .percentage .text {
    font-size: 20px;
}

.easyPiechart {
    position: relative;
}

.easyPiechart canvas {
    position: absolute;
    top: 0;
    left: 0;
}

.radial-progress {
    margin: 0 20px;
    width: 160px;
    height: 160px;
    background-color: #ffffff;
    border-radius: 50%;
    position: relative;
}
.radial-progress .blank-circle {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    border: 2px #00b0c8 solid;
    position: absolute;
}
.radial-progress .circle .mask,
.radial-progress .circle .fill,
.radial-progress .circle .shadow {
    width: 160px;
    height: 160px;
    position: absolute;
    border-radius: 50%;
}
.radial-progress .circle .mask,
.radial-progress .circle .fill {
    -webkit-backface-visibility: hidden;
    transition: -webkit-transform 1s;
    transition: -ms-transform 1s;
    transition: transform 1s;
    border-radius: 50%;
}
.radial-progress .circle .mask {
    clip: rect(0px, 160px, 160px, 80px);
}
.radial-progress .circle .mask .fill {
    clip: rect(0px, 80px, 160px, 0px);
    background-color: #9a2ca5;
}
.radial-progress .inset {
    width: 150px;
    height: 150px;
    position: absolute;
    display: table;
    margin-left: 5px;
    margin-top: 5px;
    background-color: #ffffff;
    border-radius: 50%;
}
.radial-progress .inset .percentage {
    padding-right: 5px;
}
.radial-progress .percentage .text {
    font-size: 20px;
}
.radial-progress[data-progress="0"] .circle .mask.full,
.radial-progress[data-progress="0"] .circle .fill {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}
.radial-progress[data-progress="0"] .circle .fill.fix {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}
.radial-progress[data-progress="1"] .circle .mask.full,
.radial-progress[data-progress="1"] .circle .fill {
    -webkit-transform: rotate(1.8deg);
    -ms-transform: rotate(1.8deg);
    transform: rotate(1.8deg);
}
.radial-progress[data-progress="1"] .circle .fill.fix {
    -webkit-transform: rotate(3.6deg);
    -ms-transform: rotate(3.6deg);
    transform: rotate(3.6deg);
}
.radial-progress[data-progress="2"] .circle .mask.full,
.radial-progress[data-progress="2"] .circle .fill {
    -webkit-transform: rotate(3.6deg);
    -ms-transform: rotate(3.6deg);
    transform: rotate(3.6deg);
}
.radial-progress[data-progress="2"] .circle .fill.fix {
    -webkit-transform: rotate(7.2deg);
    -ms-transform: rotate(7.2deg);
    transform: rotate(7.2deg);
}
.radial-progress[data-progress="3"] .circle .mask.full,
.radial-progress[data-progress="3"] .circle .fill {
    -webkit-transform: rotate(5.4deg);
    -ms-transform: rotate(5.4deg);
    transform: rotate(5.4deg);
}
.radial-progress[data-progress="3"] .circle .fill.fix {
    -webkit-transform: rotate(10.8deg);
    -ms-transform: rotate(10.8deg);
    transform: rotate(10.8deg);
}
.radial-progress[data-progress="4"] .circle .mask.full,
.radial-progress[data-progress="4"] .circle .fill {
    -webkit-transform: rotate(7.2deg);
    -ms-transform: rotate(7.2deg);
    transform: rotate(7.2deg);
}
.radial-progress[data-progress="4"] .circle .fill.fix {
    -webkit-transform: rotate(14.4deg);
    -ms-transform: rotate(14.4deg);
    transform: rotate(14.4deg);
}
.radial-progress[data-progress="5"] .circle .mask.full,
.radial-progress[data-progress="5"] .circle .fill {
    -webkit-transform: rotate(9deg);
    -ms-transform: rotate(9deg);
    transform: rotate(9deg);
}
.radial-progress[data-progress="5"] .circle .fill.fix {
    -webkit-transform: rotate(18deg);
    -ms-transform: rotate(18deg);
    transform: rotate(18deg);
}
.radial-progress[data-progress="6"] .circle .mask.full,
.radial-progress[data-progress="6"] .circle .fill {
    -webkit-transform: rotate(10.8deg);
    -ms-transform: rotate(10.8deg);
    transform: rotate(10.8deg);
}
.radial-progress[data-progress="6"] .circle .fill.fix {
    -webkit-transform: rotate(21.6deg);
    -ms-transform: rotate(21.6deg);
    transform: rotate(21.6deg);
}
.radial-progress[data-progress="7"] .circle .mask.full,
.radial-progress[data-progress="7"] .circle .fill {
    -webkit-transform: rotate(12.6deg);
    -ms-transform: rotate(12.6deg);
    transform: rotate(12.6deg);
}
.radial-progress[data-progress="7"] .circle .fill.fix {
    -webkit-transform: rotate(25.2deg);
    -ms-transform: rotate(25.2deg);
    transform: rotate(25.2deg);
}
.radial-progress[data-progress="8"] .circle .mask.full,
.radial-progress[data-progress="8"] .circle .fill {
    -webkit-transform: rotate(14.4deg);
    -ms-transform: rotate(14.4deg);
    transform: rotate(14.4deg);
}
.radial-progress[data-progress="8"] .circle .fill.fix {
    -webkit-transform: rotate(28.8deg);
    -ms-transform: rotate(28.8deg);
    transform: rotate(28.8deg);
}
.radial-progress[data-progress="9"] .circle .mask.full,
.radial-progress[data-progress="9"] .circle .fill {
    -webkit-transform: rotate(16.2deg);
    -ms-transform: rotate(16.2deg);
    transform: rotate(16.2deg);
}
.radial-progress[data-progress="9"] .circle .fill.fix {
    -webkit-transform: rotate(32.4deg);
    -ms-transform: rotate(32.4deg);
    transform: rotate(32.4deg);
}
.radial-progress[data-progress="10"] .circle .mask.full,
.radial-progress[data-progress="10"] .circle .fill {
    -webkit-transform: rotate(18deg);
    -ms-transform: rotate(18deg);
    transform: rotate(18deg);
}
.radial-progress[data-progress="10"] .circle .fill.fix {
    -webkit-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg);
}
.radial-progress[data-progress="11"] .circle .mask.full,
.radial-progress[data-progress="11"] .circle .fill {
    -webkit-transform: rotate(19.8deg);
    -ms-transform: rotate(19.8deg);
    transform: rotate(19.8deg);
}
.radial-progress[data-progress="11"] .circle .fill.fix {
    -webkit-transform: rotate(39.6deg);
    -ms-transform: rotate(39.6deg);
    transform: rotate(39.6deg);
}
.radial-progress[data-progress="12"] .circle .mask.full,
.radial-progress[data-progress="12"] .circle .fill {
    -webkit-transform: rotate(21.6deg);
    -ms-transform: rotate(21.6deg);
    transform: rotate(21.6deg);
}
.radial-progress[data-progress="12"] .circle .fill.fix {
    -webkit-transform: rotate(43.2deg);
    -ms-transform: rotate(43.2deg);
    transform: rotate(43.2deg);
}
.radial-progress[data-progress="13"] .circle .mask.full,
.radial-progress[data-progress="13"] .circle .fill {
    -webkit-transform: rotate(23.400000000000002deg);
    -ms-transform: rotate(23.400000000000002deg);
    transform: rotate(23.400000000000002deg);
}
.radial-progress[data-progress="13"] .circle .fill.fix {
    -webkit-transform: rotate(46.800000000000004deg);
    -ms-transform: rotate(46.800000000000004deg);
    transform: rotate(46.800000000000004deg);
}
.radial-progress[data-progress="14"] .circle .mask.full,
.radial-progress[data-progress="14"] .circle .fill {
    -webkit-transform: rotate(25.2deg);
    -ms-transform: rotate(25.2deg);
    transform: rotate(25.2deg);
}
.radial-progress[data-progress="14"] .circle .fill.fix {
    -webkit-transform: rotate(50.4deg);
    -ms-transform: rotate(50.4deg);
    transform: rotate(50.4deg);
}
.radial-progress[data-progress="15"] .circle .mask.full,
.radial-progress[data-progress="15"] .circle .fill {
    -webkit-transform: rotate(27deg);
    -ms-transform: rotate(27deg);
    transform: rotate(27deg);
}
.radial-progress[data-progress="15"] .circle .fill.fix {
    -webkit-transform: rotate(54deg);
    -ms-transform: rotate(54deg);
    transform: rotate(54deg);
}
.radial-progress[data-progress="16"] .circle .mask.full,
.radial-progress[data-progress="16"] .circle .fill {
    -webkit-transform: rotate(28.8deg);
    -ms-transform: rotate(28.8deg);
    transform: rotate(28.8deg);
}
.radial-progress[data-progress="16"] .circle .fill.fix {
    -webkit-transform: rotate(57.6deg);
    -ms-transform: rotate(57.6deg);
    transform: rotate(57.6deg);
}
.radial-progress[data-progress="17"] .circle .mask.full,
.radial-progress[data-progress="17"] .circle .fill {
    -webkit-transform: rotate(30.6deg);
    -ms-transform: rotate(30.6deg);
    transform: rotate(30.6deg);
}
.radial-progress[data-progress="17"] .circle .fill.fix {
    -webkit-transform: rotate(61.2deg);
    -ms-transform: rotate(61.2deg);
    transform: rotate(61.2deg);
}
.radial-progress[data-progress="18"] .circle .mask.full,
.radial-progress[data-progress="18"] .circle .fill {
    -webkit-transform: rotate(32.4deg);
    -ms-transform: rotate(32.4deg);
    transform: rotate(32.4deg);
}
.radial-progress[data-progress="18"] .circle .fill.fix {
    -webkit-transform: rotate(64.8deg);
    -ms-transform: rotate(64.8deg);
    transform: rotate(64.8deg);
}
.radial-progress[data-progress="19"] .circle .mask.full,
.radial-progress[data-progress="19"] .circle .fill {
    -webkit-transform: rotate(34.2deg);
    -ms-transform: rotate(34.2deg);
    transform: rotate(34.2deg);
}
.radial-progress[data-progress="19"] .circle .fill.fix {
    -webkit-transform: rotate(68.4deg);
    -ms-transform: rotate(68.4deg);
    transform: rotate(68.4deg);
}
.radial-progress[data-progress="20"] .circle .mask.full,
.radial-progress[data-progress="20"] .circle .fill {
    -webkit-transform: rotate(36deg);
    -ms-transform: rotate(36deg);
    transform: rotate(36deg);
}
.radial-progress[data-progress="20"] .circle .fill.fix {
    -webkit-transform: rotate(72deg);
    -ms-transform: rotate(72deg);
    transform: rotate(72deg);
}
.radial-progress[data-progress="21"] .circle .mask.full,
.radial-progress[data-progress="21"] .circle .fill {
    -webkit-transform: rotate(37.800000000000004deg);
    -ms-transform: rotate(37.800000000000004deg);
    transform: rotate(37.800000000000004deg);
}
.radial-progress[data-progress="21"] .circle .fill.fix {
    -webkit-transform: rotate(75.60000000000001deg);
    -ms-transform: rotate(75.60000000000001deg);
    transform: rotate(75.60000000000001deg);
}
.radial-progress[data-progress="22"] .circle .mask.full,
.radial-progress[data-progress="22"] .circle .fill {
    -webkit-transform: rotate(39.6deg);
    -ms-transform: rotate(39.6deg);
    transform: rotate(39.6deg);
}
.radial-progress[data-progress="22"] .circle .fill.fix {
    -webkit-transform: rotate(79.2deg);
    -ms-transform: rotate(79.2deg);
    transform: rotate(79.2deg);
}
.radial-progress[data-progress="23"] .circle .mask.full,
.radial-progress[data-progress="23"] .circle .fill {
    -webkit-transform: rotate(41.4deg);
    -ms-transform: rotate(41.4deg);
    transform: rotate(41.4deg);
}
.radial-progress[data-progress="23"] .circle .fill.fix {
    -webkit-transform: rotate(82.8deg);
    -ms-transform: rotate(82.8deg);
    transform: rotate(82.8deg);
}
.radial-progress[data-progress="24"] .circle .mask.full,
.radial-progress[data-progress="24"] .circle .fill {
    -webkit-transform: rotate(43.2deg);
    -ms-transform: rotate(43.2deg);
    transform: rotate(43.2deg);
}
.radial-progress[data-progress="24"] .circle .fill.fix {
    -webkit-transform: rotate(86.4deg);
    -ms-transform: rotate(86.4deg);
    transform: rotate(86.4deg);
}
.radial-progress[data-progress="25"] .circle .mask.full,
.radial-progress[data-progress="25"] .circle .fill {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
.radial-progress[data-progress="25"] .circle .fill.fix {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.radial-progress[data-progress="26"] .circle .mask.full,
.radial-progress[data-progress="26"] .circle .fill {
    -webkit-transform: rotate(46.800000000000004deg);
    -ms-transform: rotate(46.800000000000004deg);
    transform: rotate(46.800000000000004deg);
}
.radial-progress[data-progress="26"] .circle .fill.fix {
    -webkit-transform: rotate(93.60000000000001deg);
    -ms-transform: rotate(93.60000000000001deg);
    transform: rotate(93.60000000000001deg);
}
.radial-progress[data-progress="27"] .circle .mask.full,
.radial-progress[data-progress="27"] .circle .fill {
    -webkit-transform: rotate(48.6deg);
    -ms-transform: rotate(48.6deg);
    transform: rotate(48.6deg);
}
.radial-progress[data-progress="27"] .circle .fill.fix {
    -webkit-transform: rotate(97.2deg);
    -ms-transform: rotate(97.2deg);
    transform: rotate(97.2deg);
}
.radial-progress[data-progress="28"] .circle .mask.full,
.radial-progress[data-progress="28"] .circle .fill {
    -webkit-transform: rotate(50.4deg);
    -ms-transform: rotate(50.4deg);
    transform: rotate(50.4deg);
}
.radial-progress[data-progress="28"] .circle .fill.fix {
    -webkit-transform: rotate(100.8deg);
    -ms-transform: rotate(100.8deg);
    transform: rotate(100.8deg);
}
.radial-progress[data-progress="29"] .circle .mask.full,
.radial-progress[data-progress="29"] .circle .fill {
    -webkit-transform: rotate(52.2deg);
    -ms-transform: rotate(52.2deg);
    transform: rotate(52.2deg);
}
.radial-progress[data-progress="29"] .circle .fill.fix {
    -webkit-transform: rotate(104.4deg);
    -ms-transform: rotate(104.4deg);
    transform: rotate(104.4deg);
}
.radial-progress[data-progress="30"] .circle .mask.full,
.radial-progress[data-progress="30"] .circle .fill {
    -webkit-transform: rotate(54deg);
    -ms-transform: rotate(54deg);
    transform: rotate(54deg);
}
.radial-progress[data-progress="30"] .circle .fill.fix {
    -webkit-transform: rotate(108deg);
    -ms-transform: rotate(108deg);
    transform: rotate(108deg);
}
.radial-progress[data-progress="31"] .circle .mask.full,
.radial-progress[data-progress="31"] .circle .fill {
    -webkit-transform: rotate(55.800000000000004deg);
    -ms-transform: rotate(55.800000000000004deg);
    transform: rotate(55.800000000000004deg);
}
.radial-progress[data-progress="31"] .circle .fill.fix {
    -webkit-transform: rotate(111.60000000000001deg);
    -ms-transform: rotate(111.60000000000001deg);
    transform: rotate(111.60000000000001deg);
}
.radial-progress[data-progress="32"] .circle .mask.full,
.radial-progress[data-progress="32"] .circle .fill {
    -webkit-transform: rotate(57.6deg);
    -ms-transform: rotate(57.6deg);
    transform: rotate(57.6deg);
}
.radial-progress[data-progress="32"] .circle .fill.fix {
    -webkit-transform: rotate(115.2deg);
    -ms-transform: rotate(115.2deg);
    transform: rotate(115.2deg);
}
.radial-progress[data-progress="33"] .circle .mask.full,
.radial-progress[data-progress="33"] .circle .fill {
    -webkit-transform: rotate(59.4deg);
    -ms-transform: rotate(59.4deg);
    transform: rotate(59.4deg);
}
.radial-progress[data-progress="33"] .circle .fill.fix {
    -webkit-transform: rotate(118.8deg);
    -ms-transform: rotate(118.8deg);
    transform: rotate(118.8deg);
}
.radial-progress[data-progress="34"] .circle .mask.full,
.radial-progress[data-progress="34"] .circle .fill {
    -webkit-transform: rotate(61.2deg);
    -ms-transform: rotate(61.2deg);
    transform: rotate(61.2deg);
}
.radial-progress[data-progress="34"] .circle .fill.fix {
    -webkit-transform: rotate(122.4deg);
    -ms-transform: rotate(122.4deg);
    transform: rotate(122.4deg);
}
.radial-progress[data-progress="35"] .circle .mask.full,
.radial-progress[data-progress="35"] .circle .fill {
    -webkit-transform: rotate(63deg);
    -ms-transform: rotate(63deg);
    transform: rotate(63deg);
}
.radial-progress[data-progress="35"] .circle .fill.fix {
    -webkit-transform: rotate(126deg);
    -ms-transform: rotate(126deg);
    transform: rotate(126deg);
}
.radial-progress[data-progress="36"] .circle .mask.full,
.radial-progress[data-progress="36"] .circle .fill {
    -webkit-transform: rotate(64.8deg);
    -ms-transform: rotate(64.8deg);
    transform: rotate(64.8deg);
}
.radial-progress[data-progress="36"] .circle .fill.fix {
    -webkit-transform: rotate(129.6deg);
    -ms-transform: rotate(129.6deg);
    transform: rotate(129.6deg);
}
.radial-progress[data-progress="37"] .circle .mask.full,
.radial-progress[data-progress="37"] .circle .fill {
    -webkit-transform: rotate(66.60000000000001deg);
    -ms-transform: rotate(66.60000000000001deg);
    transform: rotate(66.60000000000001deg);
}
.radial-progress[data-progress="37"] .circle .fill.fix {
    -webkit-transform: rotate(133.20000000000002deg);
    -ms-transform: rotate(133.20000000000002deg);
    transform: rotate(133.20000000000002deg);
}
.radial-progress[data-progress="38"] .circle .mask.full,
.radial-progress[data-progress="38"] .circle .fill {
    -webkit-transform: rotate(68.4deg);
    -ms-transform: rotate(68.4deg);
    transform: rotate(68.4deg);
}
.radial-progress[data-progress="38"] .circle .fill.fix {
    -webkit-transform: rotate(136.8deg);
    -ms-transform: rotate(136.8deg);
    transform: rotate(136.8deg);
}
.radial-progress[data-progress="39"] .circle .mask.full,
.radial-progress[data-progress="39"] .circle .fill {
    -webkit-transform: rotate(70.2deg);
    -ms-transform: rotate(70.2deg);
    transform: rotate(70.2deg);
}
.radial-progress[data-progress="39"] .circle .fill.fix {
    -webkit-transform: rotate(140.4deg);
    -ms-transform: rotate(140.4deg);
    transform: rotate(140.4deg);
}
.radial-progress[data-progress="40"] .circle .mask.full,
.radial-progress[data-progress="40"] .circle .fill {
    -webkit-transform: rotate(72deg);
    -ms-transform: rotate(72deg);
    transform: rotate(72deg);
}
.radial-progress[data-progress="40"] .circle .fill.fix {
    -webkit-transform: rotate(144deg);
    -ms-transform: rotate(144deg);
    transform: rotate(144deg);
}
.radial-progress[data-progress="41"] .circle .mask.full,
.radial-progress[data-progress="41"] .circle .fill {
    -webkit-transform: rotate(73.8deg);
    -ms-transform: rotate(73.8deg);
    transform: rotate(73.8deg);
}
.radial-progress[data-progress="41"] .circle .fill.fix {
    -webkit-transform: rotate(147.6deg);
    -ms-transform: rotate(147.6deg);
    transform: rotate(147.6deg);
}
.radial-progress[data-progress="42"] .circle .mask.full,
.radial-progress[data-progress="42"] .circle .fill {
    -webkit-transform: rotate(75.60000000000001deg);
    -ms-transform: rotate(75.60000000000001deg);
    transform: rotate(75.60000000000001deg);
}
.radial-progress[data-progress="42"] .circle .fill.fix {
    -webkit-transform: rotate(151.20000000000002deg);
    -ms-transform: rotate(151.20000000000002deg);
    transform: rotate(151.20000000000002deg);
}
.radial-progress[data-progress="43"] .circle .mask.full,
.radial-progress[data-progress="43"] .circle .fill {
    -webkit-transform: rotate(77.4deg);
    -ms-transform: rotate(77.4deg);
    transform: rotate(77.4deg);
}
.radial-progress[data-progress="43"] .circle .fill.fix {
    -webkit-transform: rotate(154.8deg);
    -ms-transform: rotate(154.8deg);
    transform: rotate(154.8deg);
}
.radial-progress[data-progress="44"] .circle .mask.full,
.radial-progress[data-progress="44"] .circle .fill {
    -webkit-transform: rotate(79.2deg);
    -ms-transform: rotate(79.2deg);
    transform: rotate(79.2deg);
}
.radial-progress[data-progress="44"] .circle .fill.fix {
    -webkit-transform: rotate(158.4deg);
    -ms-transform: rotate(158.4deg);
    transform: rotate(158.4deg);
}
.radial-progress[data-progress="45"] .circle .mask.full,
.radial-progress[data-progress="45"] .circle .fill {
    -webkit-transform: rotate(81deg);
    -ms-transform: rotate(81deg);
    transform: rotate(81deg);
}
.radial-progress[data-progress="45"] .circle .fill.fix {
    -webkit-transform: rotate(162deg);
    -ms-transform: rotate(162deg);
    transform: rotate(162deg);
}
.radial-progress[data-progress="46"] .circle .mask.full,
.radial-progress[data-progress="46"] .circle .fill {
    -webkit-transform: rotate(82.8deg);
    -ms-transform: rotate(82.8deg);
    transform: rotate(82.8deg);
}
.radial-progress[data-progress="46"] .circle .fill.fix {
    -webkit-transform: rotate(165.6deg);
    -ms-transform: rotate(165.6deg);
    transform: rotate(165.6deg);
}
.radial-progress[data-progress="47"] .circle .mask.full,
.radial-progress[data-progress="47"] .circle .fill {
    -webkit-transform: rotate(84.60000000000001deg);
    -ms-transform: rotate(84.60000000000001deg);
    transform: rotate(84.60000000000001deg);
}
.radial-progress[data-progress="47"] .circle .fill.fix {
    -webkit-transform: rotate(169.20000000000002deg);
    -ms-transform: rotate(169.20000000000002deg);
    transform: rotate(169.20000000000002deg);
}
.radial-progress[data-progress="48"] .circle .mask.full,
.radial-progress[data-progress="48"] .circle .fill {
    -webkit-transform: rotate(86.4deg);
    -ms-transform: rotate(86.4deg);
    transform: rotate(86.4deg);
}
.radial-progress[data-progress="48"] .circle .fill.fix {
    -webkit-transform: rotate(172.8deg);
    -ms-transform: rotate(172.8deg);
    transform: rotate(172.8deg);
}
.radial-progress[data-progress="49"] .circle .mask.full,
.radial-progress[data-progress="49"] .circle .fill {
    -webkit-transform: rotate(88.2deg);
    -ms-transform: rotate(88.2deg);
    transform: rotate(88.2deg);
}
.radial-progress[data-progress="49"] .circle .fill.fix {
    -webkit-transform: rotate(176.4deg);
    -ms-transform: rotate(176.4deg);
    transform: rotate(176.4deg);
}
.radial-progress[data-progress="50"] .circle .mask.full,
.radial-progress[data-progress="50"] .circle .fill {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.radial-progress[data-progress="50"] .circle .fill.fix {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}
.radial-progress[data-progress="51"] .circle .mask.full,
.radial-progress[data-progress="51"] .circle .fill {
    -webkit-transform: rotate(91.8deg);
    -ms-transform: rotate(91.8deg);
    transform: rotate(91.8deg);
}
.radial-progress[data-progress="51"] .circle .fill.fix {
    -webkit-transform: rotate(183.6deg);
    -ms-transform: rotate(183.6deg);
    transform: rotate(183.6deg);
}
.radial-progress[data-progress="52"] .circle .mask.full,
.radial-progress[data-progress="52"] .circle .fill {
    -webkit-transform: rotate(93.60000000000001deg);
    -ms-transform: rotate(93.60000000000001deg);
    transform: rotate(93.60000000000001deg);
}
.radial-progress[data-progress="52"] .circle .fill.fix {
    -webkit-transform: rotate(187.20000000000002deg);
    -ms-transform: rotate(187.20000000000002deg);
    transform: rotate(187.20000000000002deg);
}
.radial-progress[data-progress="53"] .circle .mask.full,
.radial-progress[data-progress="53"] .circle .fill {
    -webkit-transform: rotate(95.4deg);
    -ms-transform: rotate(95.4deg);
    transform: rotate(95.4deg);
}
.radial-progress[data-progress="53"] .circle .fill.fix {
    -webkit-transform: rotate(190.8deg);
    -ms-transform: rotate(190.8deg);
    transform: rotate(190.8deg);
}
.radial-progress[data-progress="54"] .circle .mask.full,
.radial-progress[data-progress="54"] .circle .fill {
    -webkit-transform: rotate(97.2deg);
    -ms-transform: rotate(97.2deg);
    transform: rotate(97.2deg);
}
.radial-progress[data-progress="54"] .circle .fill.fix {
    -webkit-transform: rotate(194.4deg);
    -ms-transform: rotate(194.4deg);
    transform: rotate(194.4deg);
}
.radial-progress[data-progress="55"] .circle .mask.full,
.radial-progress[data-progress="55"] .circle .fill {
    -webkit-transform: rotate(99deg);
    -ms-transform: rotate(99deg);
    transform: rotate(99deg);
}
.radial-progress[data-progress="55"] .circle .fill.fix {
    -webkit-transform: rotate(198deg);
    -ms-transform: rotate(198deg);
    transform: rotate(198deg);
}
.radial-progress[data-progress="56"] .circle .mask.full,
.radial-progress[data-progress="56"] .circle .fill {
    -webkit-transform: rotate(100.8deg);
    -ms-transform: rotate(100.8deg);
    transform: rotate(100.8deg);
}
.radial-progress[data-progress="56"] .circle .fill.fix {
    -webkit-transform: rotate(201.6deg);
    -ms-transform: rotate(201.6deg);
    transform: rotate(201.6deg);
}
.radial-progress[data-progress="57"] .circle .mask.full,
.radial-progress[data-progress="57"] .circle .fill {
    -webkit-transform: rotate(102.60000000000001deg);
    -ms-transform: rotate(102.60000000000001deg);
    transform: rotate(102.60000000000001deg);
}
.radial-progress[data-progress="57"] .circle .fill.fix {
    -webkit-transform: rotate(205.20000000000002deg);
    -ms-transform: rotate(205.20000000000002deg);
    transform: rotate(205.20000000000002deg);
}
.radial-progress[data-progress="58"] .circle .mask.full,
.radial-progress[data-progress="58"] .circle .fill {
    -webkit-transform: rotate(104.4deg);
    -ms-transform: rotate(104.4deg);
    transform: rotate(104.4deg);
}
.radial-progress[data-progress="58"] .circle .fill.fix {
    -webkit-transform: rotate(208.8deg);
    -ms-transform: rotate(208.8deg);
    transform: rotate(208.8deg);
}
.radial-progress[data-progress="59"] .circle .mask.full,
.radial-progress[data-progress="59"] .circle .fill {
    -webkit-transform: rotate(106.2deg);
    -ms-transform: rotate(106.2deg);
    transform: rotate(106.2deg);
}
.radial-progress[data-progress="59"] .circle .fill.fix {
    -webkit-transform: rotate(212.4deg);
    -ms-transform: rotate(212.4deg);
    transform: rotate(212.4deg);
}
.radial-progress[data-progress="60"] .circle .mask.full,
.radial-progress[data-progress="60"] .circle .fill {
    -webkit-transform: rotate(108deg);
    -ms-transform: rotate(108deg);
    transform: rotate(108deg);
}
.radial-progress[data-progress="60"] .circle .fill.fix {
    -webkit-transform: rotate(216deg);
    -ms-transform: rotate(216deg);
    transform: rotate(216deg);
}
.radial-progress[data-progress="61"] .circle .mask.full,
.radial-progress[data-progress="61"] .circle .fill {
    -webkit-transform: rotate(109.8deg);
    -ms-transform: rotate(109.8deg);
    transform: rotate(109.8deg);
}
.radial-progress[data-progress="61"] .circle .fill.fix {
    -webkit-transform: rotate(219.6deg);
    -ms-transform: rotate(219.6deg);
    transform: rotate(219.6deg);
}
.radial-progress[data-progress="62"] .circle .mask.full,
.radial-progress[data-progress="62"] .circle .fill {
    -webkit-transform: rotate(111.60000000000001deg);
    -ms-transform: rotate(111.60000000000001deg);
    transform: rotate(111.60000000000001deg);
}
.radial-progress[data-progress="62"] .circle .fill.fix {
    -webkit-transform: rotate(223.20000000000002deg);
    -ms-transform: rotate(223.20000000000002deg);
    transform: rotate(223.20000000000002deg);
}
.radial-progress[data-progress="63"] .circle .mask.full,
.radial-progress[data-progress="63"] .circle .fill {
    -webkit-transform: rotate(113.4deg);
    -ms-transform: rotate(113.4deg);
    transform: rotate(113.4deg);
}
.radial-progress[data-progress="63"] .circle .fill.fix {
    -webkit-transform: rotate(226.8deg);
    -ms-transform: rotate(226.8deg);
    transform: rotate(226.8deg);
}
.radial-progress[data-progress="64"] .circle .mask.full,
.radial-progress[data-progress="64"] .circle .fill {
    -webkit-transform: rotate(115.2deg);
    -ms-transform: rotate(115.2deg);
    transform: rotate(115.2deg);
}
.radial-progress[data-progress="64"] .circle .fill.fix {
    -webkit-transform: rotate(230.4deg);
    -ms-transform: rotate(230.4deg);
    transform: rotate(230.4deg);
}
.radial-progress[data-progress="65"] .circle .mask.full,
.radial-progress[data-progress="65"] .circle .fill {
    -webkit-transform: rotate(117deg);
    -ms-transform: rotate(117deg);
    transform: rotate(117deg);
}
.radial-progress[data-progress="65"] .circle .fill.fix {
    -webkit-transform: rotate(234deg);
    -ms-transform: rotate(234deg);
    transform: rotate(234deg);
}
.radial-progress[data-progress="66"] .circle .mask.full,
.radial-progress[data-progress="66"] .circle .fill {
    -webkit-transform: rotate(118.8deg);
    -ms-transform: rotate(118.8deg);
    transform: rotate(118.8deg);
}
.radial-progress[data-progress="66"] .circle .fill.fix {
    -webkit-transform: rotate(237.6deg);
    -ms-transform: rotate(237.6deg);
    transform: rotate(237.6deg);
}
.radial-progress[data-progress="67"] .circle .mask.full,
.radial-progress[data-progress="67"] .circle .fill {
    -webkit-transform: rotate(120.60000000000001deg);
    -ms-transform: rotate(120.60000000000001deg);
    transform: rotate(120.60000000000001deg);
}
.radial-progress[data-progress="67"] .circle .fill.fix {
    -webkit-transform: rotate(241.20000000000002deg);
    -ms-transform: rotate(241.20000000000002deg);
    transform: rotate(241.20000000000002deg);
}
.radial-progress[data-progress="68"] .circle .mask.full,
.radial-progress[data-progress="68"] .circle .fill {
    -webkit-transform: rotate(122.4deg);
    -ms-transform: rotate(122.4deg);
    transform: rotate(122.4deg);
}
.radial-progress[data-progress="68"] .circle .fill.fix {
    -webkit-transform: rotate(244.8deg);
    -ms-transform: rotate(244.8deg);
    transform: rotate(244.8deg);
}
.radial-progress[data-progress="69"] .circle .mask.full,
.radial-progress[data-progress="69"] .circle .fill {
    -webkit-transform: rotate(124.2deg);
    -ms-transform: rotate(124.2deg);
    transform: rotate(124.2deg);
}
.radial-progress[data-progress="69"] .circle .fill.fix {
    -webkit-transform: rotate(248.4deg);
    -ms-transform: rotate(248.4deg);
    transform: rotate(248.4deg);
}
.radial-progress[data-progress="70"] .circle .mask.full,
.radial-progress[data-progress="70"] .circle .fill {
    -webkit-transform: rotate(126deg);
    -ms-transform: rotate(126deg);
    transform: rotate(126deg);
}
.radial-progress[data-progress="70"] .circle .fill.fix {
    -webkit-transform: rotate(252deg);
    -ms-transform: rotate(252deg);
    transform: rotate(252deg);
}
.radial-progress[data-progress="71"] .circle .mask.full,
.radial-progress[data-progress="71"] .circle .fill {
    -webkit-transform: rotate(127.8deg);
    -ms-transform: rotate(127.8deg);
    transform: rotate(127.8deg);
}
.radial-progress[data-progress="71"] .circle .fill.fix {
    -webkit-transform: rotate(255.6deg);
    -ms-transform: rotate(255.6deg);
    transform: rotate(255.6deg);
}
.radial-progress[data-progress="72"] .circle .mask.full,
.radial-progress[data-progress="72"] .circle .fill {
    -webkit-transform: rotate(129.6deg);
    -ms-transform: rotate(129.6deg);
    transform: rotate(129.6deg);
}
.radial-progress[data-progress="72"] .circle .fill.fix {
    -webkit-transform: rotate(259.2deg);
    -ms-transform: rotate(259.2deg);
    transform: rotate(259.2deg);
}
.radial-progress[data-progress="73"] .circle .mask.full,
.radial-progress[data-progress="73"] .circle .fill {
    -webkit-transform: rotate(131.4deg);
    -ms-transform: rotate(131.4deg);
    transform: rotate(131.4deg);
}
.radial-progress[data-progress="73"] .circle .fill.fix {
    -webkit-transform: rotate(262.8deg);
    -ms-transform: rotate(262.8deg);
    transform: rotate(262.8deg);
}
.radial-progress[data-progress="74"] .circle .mask.full,
.radial-progress[data-progress="74"] .circle .fill {
    -webkit-transform: rotate(133.20000000000002deg);
    -ms-transform: rotate(133.20000000000002deg);
    transform: rotate(133.20000000000002deg);
}
.radial-progress[data-progress="74"] .circle .fill.fix {
    -webkit-transform: rotate(266.40000000000003deg);
    -ms-transform: rotate(266.40000000000003deg);
    transform: rotate(266.40000000000003deg);
}
.radial-progress[data-progress="75"] .circle .mask.full,
.radial-progress[data-progress="75"] .circle .fill {
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    transform: rotate(135deg);
}
.radial-progress[data-progress="75"] .circle .fill.fix {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
}
.radial-progress[data-progress="76"] .circle .mask.full,
.radial-progress[data-progress="76"] .circle .fill {
    -webkit-transform: rotate(136.8deg);
    -ms-transform: rotate(136.8deg);
    transform: rotate(136.8deg);
}
.radial-progress[data-progress="76"] .circle .fill.fix {
    -webkit-transform: rotate(273.6deg);
    -ms-transform: rotate(273.6deg);
    transform: rotate(273.6deg);
}
.radial-progress[data-progress="77"] .circle .mask.full,
.radial-progress[data-progress="77"] .circle .fill {
    -webkit-transform: rotate(138.6deg);
    -ms-transform: rotate(138.6deg);
    transform: rotate(138.6deg);
}
.radial-progress[data-progress="77"] .circle .fill.fix {
    -webkit-transform: rotate(277.2deg);
    -ms-transform: rotate(277.2deg);
    transform: rotate(277.2deg);
}
.radial-progress[data-progress="78"] .circle .mask.full,
.radial-progress[data-progress="78"] .circle .fill {
    -webkit-transform: rotate(140.4deg);
    -ms-transform: rotate(140.4deg);
    transform: rotate(140.4deg);
}
.radial-progress[data-progress="78"] .circle .fill.fix {
    -webkit-transform: rotate(280.8deg);
    -ms-transform: rotate(280.8deg);
    transform: rotate(280.8deg);
}
.radial-progress[data-progress="79"] .circle .mask.full,
.radial-progress[data-progress="79"] .circle .fill {
    -webkit-transform: rotate(142.20000000000002deg);
    -ms-transform: rotate(142.20000000000002deg);
    transform: rotate(142.20000000000002deg);
}
.radial-progress[data-progress="79"] .circle .fill.fix {
    -webkit-transform: rotate(284.40000000000003deg);
    -ms-transform: rotate(284.40000000000003deg);
    transform: rotate(284.40000000000003deg);
}
.radial-progress[data-progress="80"] .circle .mask.full,
.radial-progress[data-progress="80"] .circle .fill {
    -webkit-transform: rotate(144deg);
    -ms-transform: rotate(144deg);
    transform: rotate(144deg);
}
.radial-progress[data-progress="80"] .circle .fill.fix {
    -webkit-transform: rotate(288deg);
    -ms-transform: rotate(288deg);
    transform: rotate(288deg);
}
.radial-progress[data-progress="81"] .circle .mask.full,
.radial-progress[data-progress="81"] .circle .fill {
    -webkit-transform: rotate(145.8deg);
    -ms-transform: rotate(145.8deg);
    transform: rotate(145.8deg);
}
.radial-progress[data-progress="81"] .circle .fill.fix {
    -webkit-transform: rotate(291.6deg);
    -ms-transform: rotate(291.6deg);
    transform: rotate(291.6deg);
}
.radial-progress[data-progress="82"] .circle .mask.full,
.radial-progress[data-progress="82"] .circle .fill {
    -webkit-transform: rotate(147.6deg);
    -ms-transform: rotate(147.6deg);
    transform: rotate(147.6deg);
}
.radial-progress[data-progress="82"] .circle .fill.fix {
    -webkit-transform: rotate(295.2deg);
    -ms-transform: rotate(295.2deg);
    transform: rotate(295.2deg);
}
.radial-progress[data-progress="83"] .circle .mask.full,
.radial-progress[data-progress="83"] .circle .fill {
    -webkit-transform: rotate(149.4deg);
    -ms-transform: rotate(149.4deg);
    transform: rotate(149.4deg);
}
.radial-progress[data-progress="83"] .circle .fill.fix {
    -webkit-transform: rotate(298.8deg);
    -ms-transform: rotate(298.8deg);
    transform: rotate(298.8deg);
}
.radial-progress[data-progress="84"] .circle .mask.full,
.radial-progress[data-progress="84"] .circle .fill {
    -webkit-transform: rotate(151.20000000000002deg);
    -ms-transform: rotate(151.20000000000002deg);
    transform: rotate(151.20000000000002deg);
}
.radial-progress[data-progress="84"] .circle .fill.fix {
    -webkit-transform: rotate(302.40000000000003deg);
    -ms-transform: rotate(302.40000000000003deg);
    transform: rotate(302.40000000000003deg);
}
.radial-progress[data-progress="85"] .circle .mask.full,
.radial-progress[data-progress="85"] .circle .fill {
    -webkit-transform: rotate(153deg);
    -ms-transform: rotate(153deg);
    transform: rotate(153deg);
}
.radial-progress[data-progress="85"] .circle .fill.fix {
    -webkit-transform: rotate(306deg);
    -ms-transform: rotate(306deg);
    transform: rotate(306deg);
}
.radial-progress[data-progress="86"] .circle .mask.full,
.radial-progress[data-progress="86"] .circle .fill {
    -webkit-transform: rotate(154.8deg);
    -ms-transform: rotate(154.8deg);
    transform: rotate(154.8deg);
}
.radial-progress[data-progress="86"] .circle .fill.fix {
    -webkit-transform: rotate(309.6deg);
    -ms-transform: rotate(309.6deg);
    transform: rotate(309.6deg);
}
.radial-progress[data-progress="87"] .circle .mask.full,
.radial-progress[data-progress="87"] .circle .fill {
    -webkit-transform: rotate(156.6deg);
    -ms-transform: rotate(156.6deg);
    transform: rotate(156.6deg);
}
.radial-progress[data-progress="87"] .circle .fill.fix {
    -webkit-transform: rotate(313.2deg);
    -ms-transform: rotate(313.2deg);
    transform: rotate(313.2deg);
}
.radial-progress[data-progress="88"] .circle .mask.full,
.radial-progress[data-progress="88"] .circle .fill {
    -webkit-transform: rotate(158.4deg);
    -ms-transform: rotate(158.4deg);
    transform: rotate(158.4deg);
}
.radial-progress[data-progress="88"] .circle .fill.fix {
    -webkit-transform: rotate(316.8deg);
    -ms-transform: rotate(316.8deg);
    transform: rotate(316.8deg);
}
.radial-progress[data-progress="89"] .circle .mask.full,
.radial-progress[data-progress="89"] .circle .fill {
    -webkit-transform: rotate(160.20000000000002deg);
    -ms-transform: rotate(160.20000000000002deg);
    transform: rotate(160.20000000000002deg);
}
.radial-progress[data-progress="89"] .circle .fill.fix {
    -webkit-transform: rotate(320.40000000000003deg);
    -ms-transform: rotate(320.40000000000003deg);
    transform: rotate(320.40000000000003deg);
}
.radial-progress[data-progress="90"] .circle .mask.full,
.radial-progress[data-progress="90"] .circle .fill {
    -webkit-transform: rotate(162deg);
    -ms-transform: rotate(162deg);
    transform: rotate(162deg);
}
.radial-progress[data-progress="90"] .circle .fill.fix {
    -webkit-transform: rotate(324deg);
    -ms-transform: rotate(324deg);
    transform: rotate(324deg);
}
.radial-progress[data-progress="91"] .circle .mask.full,
.radial-progress[data-progress="91"] .circle .fill {
    -webkit-transform: rotate(163.8deg);
    -ms-transform: rotate(163.8deg);
    transform: rotate(163.8deg);
}
.radial-progress[data-progress="91"] .circle .fill.fix {
    -webkit-transform: rotate(327.6deg);
    -ms-transform: rotate(327.6deg);
    transform: rotate(327.6deg);
}
.radial-progress[data-progress="92"] .circle .mask.full,
.radial-progress[data-progress="92"] .circle .fill {
    -webkit-transform: rotate(165.6deg);
    -ms-transform: rotate(165.6deg);
    transform: rotate(165.6deg);
}
.radial-progress[data-progress="92"] .circle .fill.fix {
    -webkit-transform: rotate(331.2deg);
    -ms-transform: rotate(331.2deg);
    transform: rotate(331.2deg);
}
.radial-progress[data-progress="93"] .circle .mask.full,
.radial-progress[data-progress="93"] .circle .fill {
    -webkit-transform: rotate(167.4deg);
    -ms-transform: rotate(167.4deg);
    transform: rotate(167.4deg);
}
.radial-progress[data-progress="93"] .circle .fill.fix {
    -webkit-transform: rotate(334.8deg);
    -ms-transform: rotate(334.8deg);
    transform: rotate(334.8deg);
}
.radial-progress[data-progress="94"] .circle .mask.full,
.radial-progress[data-progress="94"] .circle .fill {
    -webkit-transform: rotate(169.20000000000002deg);
    -ms-transform: rotate(169.20000000000002deg);
    transform: rotate(169.20000000000002deg);
}
.radial-progress[data-progress="94"] .circle .fill.fix {
    -webkit-transform: rotate(338.40000000000003deg);
    -ms-transform: rotate(338.40000000000003deg);
    transform: rotate(338.40000000000003deg);
}
.radial-progress[data-progress="95"] .circle .mask.full,
.radial-progress[data-progress="95"] .circle .fill {
    -webkit-transform: rotate(171deg);
    -ms-transform: rotate(171deg);
    transform: rotate(171deg);
}
.radial-progress[data-progress="95"] .circle .fill.fix {
    -webkit-transform: rotate(342deg);
    -ms-transform: rotate(342deg);
    transform: rotate(342deg);
}
.radial-progress[data-progress="96"] .circle .mask.full,
.radial-progress[data-progress="96"] .circle .fill {
    -webkit-transform: rotate(172.8deg);
    -ms-transform: rotate(172.8deg);
    transform: rotate(172.8deg);
}
.radial-progress[data-progress="96"] .circle .fill.fix {
    -webkit-transform: rotate(345.6deg);
    -ms-transform: rotate(345.6deg);
    transform: rotate(345.6deg);
}
.radial-progress[data-progress="97"] .circle .mask.full,
.radial-progress[data-progress="97"] .circle .fill {
    -webkit-transform: rotate(174.6deg);
    -ms-transform: rotate(174.6deg);
    transform: rotate(174.6deg);
}
.radial-progress[data-progress="97"] .circle .fill.fix {
    -webkit-transform: rotate(349.2deg);
    -ms-transform: rotate(349.2deg);
    transform: rotate(349.2deg);
}
.radial-progress[data-progress="98"] .circle .mask.full,
.radial-progress[data-progress="98"] .circle .fill {
    -webkit-transform: rotate(176.4deg);
    -ms-transform: rotate(176.4deg);
    transform: rotate(176.4deg);
}
.radial-progress[data-progress="98"] .circle .fill.fix {
    -webkit-transform: rotate(352.8deg);
    -ms-transform: rotate(352.8deg);
    transform: rotate(352.8deg);
}
.radial-progress[data-progress="99"] .circle .mask.full,
.radial-progress[data-progress="99"] .circle .fill {
    -webkit-transform: rotate(178.20000000000002deg);
    -ms-transform: rotate(178.20000000000002deg);
    transform: rotate(178.20000000000002deg);
}
.radial-progress[data-progress="99"] .circle .fill.fix {
    -webkit-transform: rotate(356.40000000000003deg);
    -ms-transform: rotate(356.40000000000003deg);
    transform: rotate(356.40000000000003deg);
}
.radial-progress[data-progress="100"] .circle .mask.full,
.radial-progress[data-progress="100"] .circle .fill {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}
.radial-progress[data-progress="100"] .circle .fill.fix {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

/*
   Quicklinks
   ========================================================================== */
.ql-nav {
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-weight: bold;
}

.ql-nav-paragraph {
    font-size: 24px;
    margin-bottom: 40px;
}

.consumer-ql-nav {
    margin-bottom: 100px;
}

.ql-nav-hp {
    padding: 0 10px;
}

.ql-link {
    overflow: hidden;
    display: inline-block;
    font-size: 18px;
}

.ql-nav-hp .ql-link {
    position: relative;
    display: block;
    padding: 15px 15px 15px 0;
    border-top: 1px solid #d5d5d5;
    line-height: 30px;
}

.ql-nav-hp li:first-child .ql-link {
    border-top: none;
}

.ql-nav .icon-wrap {
    display: table-cell;
    float: none;
    width: 60px;
    height: auto;
    margin-right: 0;
    padding-right: 5px;
}

.ql-nav-hp .icon-wrap {
    display: inline;
    float: left;
    width: 40px;
    margin-right: 10px;
    padding-right: 0;
}

.ql-nav .ql-text {
    display: table-cell;
    line-height: 52px;
    vertical-align: middle;
}

.ql-nav-hp .ql-text {
    display: inline;
    line-height: 30px;
}

.ql-nav-hp .i-arrow-right-black-lrg {
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -5px;
}

@media only screen and (min-width: 767px) {
    .ql-nav .icon-wrap {
        height: 60px;
    }

    .ql-nav .ql-text {
        line-height: 1.25;
    }

    .ql-nav-hp .icon-wrap,
    .ql-nav-hp .ql-text {
        display: inline;
        float: left;
    }

    .ql-nav-hp .icon-wrap {
        height: auto;
    }

    .ql-nav-hp .ql-text {
        line-height: 30px;
    }
}

@media only screen and (min-width: 992px) {
    /*.ql-nav {
        overflow: hidden;
        max-height: 322px;
    }*/

    .ql-nav-hp .ql-link {
        padding: 8px 12px 8px 0;
        font-size: 15px;
        line-height: 1.45;
    }

    .ql-nav-hp .icon-wrap {
        display: table-cell;
        float: none;
        width: 45px;
        height: 35px;
    }

    .ql-nav-hp .ql-text {
        display: table-cell;
        float: none;
        line-height: 1.45;
    }
}

/*
   Tabs
   ========================================================================== */

.tg-tabs .tg-nav .tg-head img {
    margin: 0 10px;
}

/**
 * Homepage tabs
 */

.tg-tabs-homepage {
    margin-bottom: 0;
}

/**
 * Hover tabs
 */

/* Default */
.tabbed-ui-hover {
    margin-bottom: 30px;
}

.tabbed-ui-nav {
    overflow: hidden;
    margin: 0 -5px 30px;
}

.tabbed-ui-item {
    position: relative;
    float: left;
    margin-bottom: 10px;
}

.tabbed-ui-accessories .tabbed-ui-head .media-body {
    font-size: 10px;
}

.tabbed-ui-head:hover {
    text-decoration: none;
}

.tabbed-ui-body:not(.tabbed-ui-body-default) {
    display: none; /* hide all tab content except the default one */
}

/* Accessories LP tabs (custom made, not in VFGroup library) */
.tabbed-ui-accessories {}

.tabbed-ui-accessories .tabbed-ui-item {
    width: 33.33%;
    padding: 0 5px;
}

.tabbed-ui-accessories .tabbed-ui-head:hover .i-pill,
.tabbed-ui-accessories .tabbed-ui-active .i-pill {
    background-color: #e60000;
    border-color: #e60000;
}

/* Make icons the same dimensions (default size on higher res) */
.tabbed-ui-accessories .i-vfqa {
    width: 50px;
    height: 50px;
    background-size: auto;
}

.tabbed-ui-accessories .i-mobile-phone {
    background-position: -653px -6px;
}

.tabbed-ui-accessories .i-battery {
    background-position: -701px -6px;
}

.tabbed-ui-accessories .i-audio {
    background-position: -749px -5px;
}

.tabbed-ui-accessories .i-car {
    background-position: -810px -5px;
}

.tabbed-ui-accessories .i-smart-phone-acc {
    background-position: -866px -6px;
}

.tabbed-ui-accessories .i-star {
    background-position: -911px -7px;
}

.tabbed-ui-accessories .tabbed-ui-active .i-mobile-phone,
.tabbed-ui-accessories .tabbed-ui-head:hover .i-mobile-phone {
    background-position: -962px -6px;
}

.tabbed-ui-accessories .tabbed-ui-active .i-battery,
.tabbed-ui-accessories .tabbed-ui-head:hover .i-battery {
    background-position: -1009px -6px;
}

.tabbed-ui-accessories .tabbed-ui-active .i-audio,
.tabbed-ui-accessories .tabbed-ui-head:hover .i-audio {
    background-position: -1057px -5px;
}

.tabbed-ui-accessories .tabbed-ui-active .i-car,
.tabbed-ui-accessories .tabbed-ui-head:hover .i-car {
    background-position: -1118px -5px;
}

.tabbed-ui-accessories .tabbed-ui-active .i-smart-phone-acc,
.tabbed-ui-accessories .tabbed-ui-head:hover .i-smart-phone-acc {
    background-position: -1174px -6px;
}

.tabbed-ui-accessories .tabbed-ui-active .i-star,
.tabbed-ui-accessories .tabbed-ui-head:hover .i-star {
    background-position: -1220px -7px;
}

.tabbed-ui-accessories .tabbed-ui-head .media-body {
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight: 700;
}

.tabbed-ui-accessories .media-item .btn-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    cursor: pointer;

    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

@media only screen and (min-width: 767px) {
    .tabbed-ui-accessories .tabbed-ui-item {
        width: 16.66%;
    }

    .tabbed-ui-nav > .tabbed-ui-item + .tabbed-ui-item:before {
        content: "";
        position: absolute;
        top: 8px;
        bottom: 8px;
        left: 0;
        width: 1px;
        border-left: 1px solid #cccccc;
        z-index: 10;
    }

    .tabbed-ui-accessories .tabbed-ui-nav > .tabbed-ui-item + .tabbed-ui-item:before {
        top: 10px;
        bottom: 45px;
    }

    .tabbed-ui-accessories .media-item .btn-overlay {
        display: none;
    }

    .tabbed-ui-accessories .media-item a:hover .btn-overlay {
        display: block;
    }
}

@media only screen and (min-width: 480px) {
    .tabbed-ui-nav {
        overflow: hidden;
        margin: 0 -15px 30px;
    }

    .tabbed-ui-accessories .tabbed-ui-item {
        padding: 0 15px;
    }

    .tabbed-ui-accessories > .tabbed-ui-nav > .tabbed-ui-item + .tabbed-ui-item:before {
        border-color: #e2e2e2;
    }

    .tabbed-ui-accessories .tabbed-ui-head .media-body {
        font-size: 14px;
    }
}

/* Radio tabs */

.tg-tabs .tg-nav.tg-tabs-radio {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.tg-tabs .tg-nav.tg-tabs-radio .tg-item + .tg-item {
    padding-top: 5px;
}

.tg-tabs .tg-nav.tg-tabs-radio .tg-item::before {
    content: none;
}

.tg-tabs .tg-nav.tg-tabs-radio .tg-head {
    display: block;
    border: 0;
    background-color: #f8f8f8;
    font-weight: bold;
    text-align: inherit;
}

.tg-tabs .tg-nav.tg-tabs-radio .tg-head:hover,
.tg-tabs .tg-nav.tg-tabs-radio .tg-head:focus,
.tg-tabs .tg-nav.tg-tabs-radio .tg-head:active {
    text-decoration: none;
}

.tg-tabs .tg-nav.tg-tabs-radio .tg-tab {
    padding: 20px 25px;
}

.tg-tabs .tg-nav.tg-tabs-radio .tg-radio {
    display: block;
    padding-left: 30px;
    background: transparent url('../../css/img/icon/radio-unchecked.png') no-repeat scroll 0 50%;
}

.tg-tabs .tg-nav.tg-tabs-radio .tg-active .tg-radio {
    background-image: url('../../css/img/icon/radio-checked.png');
}

@media only screen and (min-width: 767px) {
    .tg-tabs .tg-nav.tg-tabs-radio .tg-item + .tg-item {
        padding-top: 0;
        padding-left: 5px;
    }
}

/*
   FAQ Toggle - Old design - @TODO new one
   ========================================================================== */

.selectedfaqlist .question li.active .holder {
    border: 3px solid #CCCCCC;
    padding: 20px 15px;
}

.selectedfaqlist .question li .answer {
    display: none;
}

.selectedfaqlist .question li {
    list-style-type: none;
}

.selectedfaqlist .question a {
    color: #000000;
    display: block;
    font-family: Arial,sans-serif;
    font-size: 14px;
    font-weight: bold;
    outline: medium none;
    text-decoration: underline;
}

.selectedfaqlist .question li .holder a {
    background: url("/css/images/common/inactive-faqs-icon2.jpg") no-repeat scroll left top rgba(0, 0, 0, 0);
    list-style: none outside none;
    margin: 0 0 5px;
    outline: medium none;
    overflow: visible;
    padding: 2px 0 2px 35px;
    text-decoration: none;
}

.selectedfaqlist .question li .answer a {
    background: none;
    font-weight: normal;
    text-decoration: underline;
}

.selectedfaqlist .question li.active a {
    background: url("/css/images/common/active-faqs-icon2.jpg") no-repeat scroll left top rgba(0, 0, 0, 0);
    list-style: none outside none;
    margin: 0 0 5px;
    outline: medium none;
    overflow: visible;
    padding: 2px 0 2px 35px;
}

.selectedfaqlist .question li.active .answer a {
    background: none;
    font-weight: normal;
    text-decoration: underline;
}

.selectedfaqlist .question li.active a {
    border-bottom: 1px solid #CCC;
    padding-bottom: 15px;
}

.selectedfaqlist .answer li {
    font-family: Arial,sans-serif;
    font-size: 14px;
    list-style: none outside none;
}

/*
   Carousels
   ========================================================================== */

/* Products Carousel */

.product-browse .sub-title {
    display: block;
    margin-bottom: 15px;
}

.product-browse .cost {
    text-align: center;
}

.product-browse .ca-block .item-image {
    margin: 15px 0;
}

.product-browse .no-color .item-image {
    margin-bottom: 57px;
}

.product-browse .ca-block .embed-responsive-item {
    height: 100%;
    padding: 0;
}

/* Business Postpaid Plans Carousel */

.carousel-business-postpaid {
    margin-bottom: 30px;
}

.carousel-business-postpaid .title,
.carousel-business-postpaid h3 {
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-size: 30px;
    font-weight: 300;
    text-align: center;
    color: #e60000;
}

.carousel-business-postpaid h3 {
    margin-bottom: 5px;
}

.carousel-business-postpaid .price {
    display: block;
    margin-bottom: 15px;
}

.carousel-business-postpaid .ca-block-inner {
    position: relative;
    margin-bottom: 15px;
    padding: 20px;
    background-color: #f3f3f3;
}

.carousel-business-postpaid .price {
    color: #037c99;
    text-align: center;
}

.carousel-business-postpaid .list-icon li {
    margin-bottom: 5px;
}

.carousel-business-postpaid .extras-bonuses {
    margin: 20px 0;
}

.carousel-business-postpaid .extras-bonuses a {
    display: inline-block;
    margin-bottom: 10px;
    font-weight: 700;
}

@media only screen and (min-width: 767px) {
    .carousel-business-postpaid .ca-block-inner {
        margin-bottom: 0;
        padding-bottom: 70px;
    }

    .carousel-business-postpaid .ca-block-inner .btn {
        position: absolute;
        bottom: 20px;
        left: 20px;
        right: 20px;
    }
}

/* Apps Corner Carousel */

.carousel-apps-corner .ca-block-inner {
    margin-bottom: 15px;
    padding: 20px;
    background: #fff;
    box-shadow: 0px 1px 2px rgba(50,50,50,0.75);
}

.carousel-apps-corner h3 {
    margin-bottom: 5px;
    font-size: 16px;
}

.carousel-apps-corner .img-wrapper {
    margin-bottom: 10px;
    text-align: center;
}

.carousel-apps-corner .img-wrapper img {
    display: block;
    height: 90px; /* fixed height needed for carousel block height calculation */
    margin: 0 auto;
    vertical-align: top;
}

.carousel-apps-corner .description {
    /*height: 120px;*/
    margin: 0;
}

.carousel-apps-corner .download {
    margin-top: 10px;
    padding-top: 5px;
    border-top: 1px solid #b1babf;
}

.carousel-apps-corner .download > span {
    font-weight: bold;
    color: #b1babf;
}

.carousel-apps-corner .list-os {
    overflow: hidden;
}

.carousel-apps-corner .list-os li {
    float: left;
    width: 25%;
}

.carousel-apps-corner .list-os a {
    display: block;
}

.carousel-apps-corner .list-os img {
    display: block;
    /*height: 30px;*/
    margin: 0 auto;
    vertical-align: top;
}

@media only screen and (min-width: 767px) {
    .carousel-apps-corner .ca-block {
        width: 150px;
        padding: 0 10px;
    }

    .carousel-apps-corner .ca-block-inner {
        margin-bottom: 0;
        padding: 10px;
    }
}

/* Business Red Plans Carousel */

.carousel-business-red-plans .ca-block-inner {
    margin-bottom: 15px;
    padding: 15px;
    border: 1px solid #dedede;
    background-color: #fff;
}

.carousel-business-red-plans .plan-name {
    margin-bottom: 0;
    background: transparent url('img/round-trapezoid.png') no-repeat center center;
    background-size: contain;
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-size: 30px;
    line-height: 3.2;
    color: #fff;
    text-align: center;
}

.carousel-business-red-plans .plan-name strong {
    font-family: 'VodafoneRegular', Arial, sans-serif;
}

.carousel-business-red-plans .benefits li {
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    align-items: center;

    margin: 0;
    padding: 10px;
    border-bottom: 1px solid #dedede;
}

.carousel-business-red-plans .benefits.no-border li {
    border-bottom: 0;
}

.carousel-business-red-plans .benefits i {
    -webkit-flex-shrink: 0;
    -ms-flex-shrink: 0;
    flex-shrink: 0; /* prevent icon shrinking */
}

.carousel-business-red-plans .description {
    display: inline-block;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto; /* fixes a text overflow problem in IE 10/11 */
    padding-left: 15px;
}

.carousel-business-red-plans .benefit-unavailable i,
.carousel-business-red-plans .benefit-unavailable .description {
    opacity: .5;
}

.carousel-business-red-plans .benefits .tg-tooltip-icon {
    position: static;
    display: inline-block;
}

.carousel-business-red-plans .benefits .tg-tooltip-icon .tg-display {
    position: absolute;
    z-index: 11;
}

.carousel-business-red-plans .benefits .tg-tooltip-icon .tg-body {
    left: 0;
    width: 100%;
}

.business-red-plans-price {
    margin: 35px 0;
    line-height: 1;
    text-align: center;
}

.business-red-plans-price .currency {
    display: inline-block;
    padding-top: 7px;
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-size: 30px;
    color: #e60000;
    vertical-align: top;
}

.business-red-plans-price .value {
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 60px;
    color: #e60000;
}

.business-red-plans-price .period {
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-size: 24px;
}

.carousel-business-red-plans .btn {
    width: 100%;
}

.business-red-btn-group {
    margin: 20px 0;
    text-align: center;
}

@media only screen and (min-width: 767px) {
    .carousel-business-red-plans .plan-name {
        font-size: 20px;
    }

    .business-red-btn-group {
        margin: 30px 0;
    }

    .business-red-btn-group .btn {
        width: 32%;
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media only screen and (min-width: 992px) {
    .carousel-business-red-plans .ca-block-inner {
        margin: 0;
        padding: 20px;
    }

    .carousel-business-red-plans .plan-name {
        font-size: 27px;
    }

    /*.carousel-business-red-plans .benefits li {
        padding: 10px 20px;
    }*/

    .business-red-plans-price {
        margin: 50px 0;
    }
}



/* Consumer Red Plans Carousel */

.carousel-consumer-red-plans .ca-block-inner {
    margin-bottom: 15px;
    padding: 15px 15px 80px;
    border: 1px solid #dedede;
    background-color: #fff;
    overflow: hidden;
    position: relative;
}

.carousel-consumer-red-plans .plan-name {
    margin-bottom: 0;
    /*background: transparent url('img/round-trapezoid.png') no-repeat center center;*/
    /*background-size: contain;*/
    font-family: 'Signika Negative', Arial, sans-serif; 
    font-weight: 700;
    font-size: 32px;
    line-height: 3.2;
    color: #EE0000;
    /*text-align: center;*/
    padding-left: 10px;
    float: left;
}

@media screen and (max-width: 767px) {
    .carousel-consumer-red-plans .plan-name {
        line-height: 2.2;
    }
}

.red-icon {
  text-align: center;
  font-family: 'VodafoneLight', Arial, sans-serif;
  font-size: 19px;
}

.red-price {
  float: right;
  margin-top: 5%;
}

@media screen and (max-width: 767px) {
    .red-price {
        margin-top: 6%;
    }
}

.plan-regular {
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-weight: 300;
}

.under-plans {
    width: 200%;
    margin-left: -50%;
    clear: both;
}

.red-privileges-section {
    text-align: center;
    padding: 40px;
}

.carousel-consumer-red-plans .benefits li {
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    align-items: center;

    margin: 0;
    padding: 10px;
    border-bottom: 1px solid #dedede;
}

.carousel-consumer-red-plans .benefits.no-border li {
    border-bottom: 0;
}

.red-price .best-seller {
    background: #ee0000;
    color: #fff;
    /*position: absolute;*/
    right: 40%;
    text-align: center;
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 20px;
    width: 110px;
    border-radius: 5px;
    position: relative;
}

@media screen and (max-width: 767px) {
    .red-price .best-seller {
        position: absolute;
        top: 0;
    }
}

.carousel-consumer-red-plans .benefits i {
    -webkit-flex-shrink: 0;
    -ms-flex-shrink: 0;
    flex-shrink: 0; /* prevent icon shrinking */
}

.carousel-consumer-red-plans .description {
    display: inline-block;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto; /* fixes a text overflow problem in IE 10/11 */
    padding-left: 15px;
}

.carousel-consumer-red-plans .benefit-unavailable i,
.carousel-consumer-red-plans .benefit-unavailable .description {
    opacity: .5;
}

.carousel-consumer-red-plans .benefits .tg-tooltip-icon {
    position: static;
    display: inline-block;
}

.carousel-consumer-red-plans .benefits .tg-tooltip-icon .tg-display {
    position: absolute;
    z-index: 11;
}

.carousel-consumer-red-plans .benefits .tg-tooltip-icon .tg-body {
    left: 0;
    width: 100%;
}

.consumer-red-plans-price {
    margin: 35px 0;
    line-height: 1;
    text-align: center;
}

.consumer-red-plans-price .currency {
    display: inline-block;
    padding-top: 7px;
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-size: 30px;
    color: #e60000;
    vertical-align: top;
}

.consumer-red-plans-price .value {
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 60px;
    color: #e60000;
}

.consumer-red-plans-price .period {
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-size: 24px;
}

.carousel-consumer-red-plans .btn {
    position: absolute;
    bottom: 15px;
    width: 90%;
    left: 5%;
}

.carousel-consumer-red-plans .btn.ca-load-more {
    position: static;
    margin-left: 5%;
}

.consumer-red-btn-group {
    margin: 20px 0;
    text-align: center;
}

.red-consumer-title {
    font-size: 49px;
    font-family: 'VodafoneRegular', Arial, sans-serif;
    color: #ee0000;
}

@media screen and (max-width: 767px) {
    .red-consumer-title {
        font-size: 36px;
    }
}

.red-consumer p {
    font-size: 24px;
    font-family: 'VodafoneRegular', Arial, sans-serif;
}

@media screen and (max-width: 767px) {
    .red-consumer .grid {
        padding: 5%;

        display: -ms-flexbox;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;

        -ms-flex-align: center;
        -ms-flex-pack: center;

        -webkit-align-items: flex-start;
        align-items: flex-start;

        -webkit-box-align: center;
        -webkit-box-pack: center;

        -webkit-justify-content: center;
        justify-content: center;

        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .red-consumer .col {
        width: 33%;
        padding: 10px 2% 0 2%;
    }

    .red-consumer .red-icon {
        font-size: 15px;
    }
}

@media only screen and (max-device-width : 480px) {
    .red-consumer .col {
        width: 80px !important;
        padding: 10px 2% 0 2%;
    }
}

.choose-red {
    font-size: 36px;
    font-family: 'VodafoneLight', Arial, sans-serif;
    color: #ee0000;
    line-height: 1.0;
    padding: 36px 0;
}

.red-extras {
    color: #ee0000;
    font-size: 30px;
    font-family: 'VodafoneLight', Arial, sans-serif;
    line-height: 3.0;
}

@media only screen and (min-width: 767px) {
    .carousel-consumer-red-plans .plan-name {
        font-size: 20px;
    }

    .consumer-red-btn-group {
        margin: 30px 0;
    }

    .consumer-red-btn-group .btn {
        width: 32%;
        padding-left: 10px;
        padding-right: 10px;
    }

    .red-price {
        margin-top:10%;
    }

    .red-price .best-seller {
        top: 0;
        position: absolute;
    }
}

@media only screen and (min-width: 992px) {
    .carousel-consumer-red-plans .ca-block-inner {
        margin: 0;
        padding: 20px 20px 100px;
    }

    .carousel-consumer-red-plans .plan-name {
        font-size: 27px;
    }

    /*.carousel-consumer-red-plans .benefits li {
        padding: 10px 20px;
    }*/

    .consumer-red-plans-price {
        margin: 50px 0;
    }
}

.red-box {
    height: 300px;
}

/* CONSUMER RED PLANS END */

/*
   Modals / Dialogs
   ========================================================================== */

.modal {
    /*
     * on small res devices the page containing the modals is shown, instead of the modal,
     * so in order to show only the specific modal via JS (hash tag), we need to hide all modals first
     */
    display: none;
}

.modal-header {
    margin-bottom: 20px;
}

/* Business Postpaid Plans Modal */

.modal-business-postpaid {
    padding: 0 20px;
}

.modal-business-postpaid .modal-header {
    overflow: hidden;
    margin-bottom: 50px;
}

.modal-business-postpaid .modal-header h2 {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: middle;
}

.modal-business-postpaid .col-inner {
    margin-bottom: 30px;
    padding: 12px;
    background-color: #f3f3f3;
}

.modal-business-postpaid h3 {
    margin-bottom: 8px;
    font-size: 14px;
    color: #e60000;
}

.modal-business-postpaid p {
    margin: 0;
}

@media only screen and (min-width: 767px) {
    .modal {
        /*
         * on higher res devices, the modal is shown in a lightbox, so there is
         * no need to hide them first
         */
        display: block;
    }

    .modal-header {
        width: 90%;
    }
}

/* BlockUI Modals */

/* @TODO: remove ONLY when old css is removed */

body .blockMsg {
    overflow: visible;
    width: auto;
    max-height: none;
    background: none;
    border: none !important;
    border-radius: 0;
    box-shadow: none;
}

/* END @TODO */

.blockMsg {
    top: 10px;
    right: 10px;
    bottom: 10px;
    left: 10px;
}

.popup {
    overflow: auto; /* scroll content if needed */
    display: none;
    position: relative;
    /*height: 100%;*/
    padding: 15px;
    border-radius: 3px;
    background-color: #fff;
    box-shadow: 0 0 40px 3px #000;
}

.popup-header {
    margin-right: 60px; /* don't overlap the 'close' button */
}

.popup iframe {
    width: 100%;
    height: 370px;
    border: none;
}

body .blockMsg .popup .close {
    position: absolute;
    top: 15px;
    right: 15px;

    /* @TODO: remove ONLY when old css is removed */
    float: none;
    padding: 0;
    background: none;
    text-align: inherit;
}

.popup .close i {
    margin-left: 5px;
}

.popup-body { }

.blockOverlay {
    background-color: rgba(0, 0, 0, .75);
}

@media only screen and (min-width: 767px) {
    body .blockMsg {
        top: 0;
        right: auto;
        left: 50%;
        bottom: auto;

        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
    }

    .popup {
        width: 600px;
        max-height: 500px ;
        margin-top: 50px;
        padding: 25px;
    }

    body .blockMsg .popup .close {
        top: 25px;
        right: 25px;
    }
}

@media only screen and (max-width: 508px) and (min-width: 438px){
    .popup iframe {
        height: 387px;
    }
}

@media only screen and (max-width: 438px) and (min-width: 421px){
    .popup iframe {
        height: 408px;
    }
}

@media only screen and (max-width: 421px) and (min-width: 370px){
    .popup iframe {
        height: 429px;
    }
}

@media only screen and (max-width: 370px) and (min-width: 321px){
    .popup iframe {
        height: 450px;
    }
}


/* Magnific Popup */

.magnific-popup {
    display: block;
    margin: 40px auto;
}

/*
   Toggle
   ========================================================================== */

.mod-toggle .col {
    position: static;
}

@media only screen and (min-width: 767px) {
    /* Flyout on top */
    .tg-flyout-top .tg-body {
        top: auto;
        bottom: 20px;
    }

    .tg-flyout-top > .tg-body:before {
        top: auto;
        bottom: -20px;
        border-color: #999 transparent transparent;
    }

    .tg-flyout-top > .tg-body:after {
        top: auto;
        bottom: -19px;
        border-color: #f4f4f4 transparent transparent;
    }

    .tg-flyout-top .tg-body:after {
        border-top-color: #fff;
        border-bottom-color: transparent;
    }
}

/* Centered arrow */
.tg-flyout-centered > .tg-body:before,
.tg-flyout-centered > .tg-body:after {
    left: 50%;

    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
}

/* Close for Nested Toggles - ex: Tabs with Flayout*/
.tg-close-nested-toggles {
    display: block;
    position: absolute;
    right: 20px;
    top: 20px;
}
/* END Close for Nested Toggles - ex: Tabs with Flayout*/

/*
   Social
   ========================================================================== */

.social-wrapper {
    margin: 20px 0;
}

.sm-share-button {
    display: inline-block;
    /*float: left;*/
    padding: 0px 5px;
    vertical-align: middle;
}

.twitter-share-button {
    display: inline-block;
    vertical-align: middle;
}

/*
   Plans & Extras
   ========================================================================== */

.filter-group {
    text-align: center;
}

.filter-group .btn {
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-size: 22px;
}

.filter-group .btn-em {
    font-family: 'Signika Negative', Arial, sans-serif;
    font-weight:700;
}

.filter-group li:last-child a {
    border: 0;
}

.mobile-filters .btn-em,
.mobile-filters .btn-alt {
    border-width: 0 0 1px 0;
    background: none;
    box-shadow: none;
    font-family: Arial, sans-serif;
    color: #333;
}

.mobile-filters .btn-em {
    font-weight: bold;
}

.filter-item {
    display: block;
    padding: 10px 0;
    border-bottom: 1px solid #c9c9c9;
    font-size: 20px;
    text-align: left;
}

.plans-filters .tg-dropdown .tg-head {
    font-size: 20px;
}

.plans-filters .tg-dropdown .tg-dropdown {
    margin: 0;
    border-bottom: 1px solid #c9c9c9;
}

.plans-filters .tg-dropdown .tg-dropdown .tg-head {
    margin: 0;
    padding: 10px 0;
    border: 0;
    text-align: left;
}

.plans-filters .tg-dropdown .tg-dropdown .tg-body {
    border: 0;
}

.plans-slider-separator {
    position: relative;
    width: 50%;
    height: 1px;
    margin: 0 auto 30px;
    background-color: #e60000;
}

.plans-slider-separator:after {
    content: "";
    position: absolute;
    bottom: -8px;
    left: 50%;
    margin-left: -8px; /* the arrow has a width of 16px (8px + 8px) */
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 8px 0 8px;
    border-color: #e60000 transparent transparent;
}

.extras-intl .description,
.extras-10dhs .description {
    font-size: 20px;
    line-height: 1.2;
}

.extras-intl .details span,
.extras-10dhs .details span {
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
    font-size: 18px;
    color: #e60000;
}

.extras-10dhs {
    text-align: left;
}

@media screen and (min-width: 767px) {
    .filter-group .btn {
        margin-right: 30px;
    }

    .filter-group .btn:last-child {
        margin-right: 0;
    }
}

/* Consumer Page */

.captcha .captchaError.fm-error {
    display: table;
}

.fm-consumer .fm-error-border {
    padding-left: 10px;
    padding-top: 10px;
}

.consumer-title {
    font-family: 'VodafoneLight', Arial, sans-serif;
    margin-bottom: 80px;
}

.fm-radio.fm-consumer.fm-buttonsOnPostpaidOrPrepaid {
    margin-left: 5%;
    margin-right: 5%;
}

@media only screen and (min-width: 767px) {
    .fm-consumer-care input,
    .fm-consumer-care .fm-select,
    .fm-consumer-care textarea {
        width: 355px;
    }

    .btn-sml.consumer-btn {
        padding: 11px 40px 9px;
        font-size: 16px;
    }

    .fm-consumer {
        width: 355px;
    }
}

/*
   Samsung S6
   ========================================================================== */

.vip-title,
.samsung-form-field label {
    color: #717171;
}

.vip-title {

    font-family: 'VodafoneLight' , 'Arial', sans-serif;
    margin-top: 10px;
    font-weight: bold;
    margin-bottom: 30px;
    margin-left: 10px;
}

.samsung-form-field.fm-data input {
    background-color: #1a1a1a;
    border-radius: 0;
    border: none;
    box-shadow: none;
    color:#fff;
}

.vip-left {
    margin-top: 18%;
}

.samsungs6-container {
    background-color: #000;
    color: #fff;
    margin-top: -75px;

}

.samsung-form-field input:focus {
    box-shadow: none;
}

.margin-top-vip {
    margin-top: 60px;
}

@media only screen and (min-width: 767px) {
    .samsung-form-field.fm-data input {
        width: 195px;
        font-size: 20px;
    }

    .samsung-form-field.fm-data label {
        width: 60px;
        text-align: left;
        font-size: 15px;
    }

    .vip-title {
        font-size: 15px;
    }

    .margin-top-vip {
        margin-top: 0;
    }
}

@media only screen and (min-width: 991px) {
    .samsung-form-field.fm-data input {
        width: 285px;
    }

    .vip-title {
        font-size: 20px;
    }
}

.VIPSubmit {
    width: 190px;
    height: 60px;
    background-color: #000;
    padding-left: 3px;
    border: 2px solid #fff;
    color: #fff;
    font-size: 30px;
    font-family: 'VodafoneRegular', Arial, sans-serif;
    margin-right: 15px;
    cursor: pointer;
}

.VIP-submit-btn {
    float: right;
}

@media only screen and (max-width: 767px) {
    .vip-left {
        margin-top: 25%;
    }
}

/*
   Preorder page
   ========================================================================== */

.preorder {
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-size: 16px;
}

.preorder .alert {
    font-family: Arial, sans-serif;
    font-size: 14px;
}

.preorder .info-msg {
    margin-bottom: 20px;
}

.preorder .info-msg h2 {
    font-size: 40px;
    color: #e60000;
}

.preorder .info-msg p {
    margin: 0;
    font-size: 30px;
    line-height: 1.2;
}

.preorder .step-title {
    line-height: 24px;
    margin-bottom: 10px;
    color: #333;
}

.preorder .show-grid {
    padding-top: 50px;
}

.preorder .selection-buttons {
    margin-top: 40px;
}

.preorder .selection-buttons:first-child {
    margin-top: 0;
}

.preorder .step-title {
    margin-bottom: 25px;
}

.preorder .step {
    display: inline-block;
    width: 24px;
    height: 24px;
    padding: 4px;
    border: 1px solid #333;
    border-radius: 50%;
    font-size: 15px;
    line-height: 1;
    vertical-align: middle;
    text-align: center;
    color: #333;
}

.preorder .step-text {
    margin-left: 5px;
    /*font-size: 24px;*/
    vertical-align: middle;
}

.preorder .hide_me {
    position: absolute;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px,1px,1px,1px);
}

.preorder .selection-buttons {
    overflow: hidden;
    margin-bottom: 0;
}

.preorder .selection-disabled,
.preorder .item-disabled {
    opacity: .3;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
}

.preorder .items {
    overflow: hidden;
    margin: 0 -5px;
    padding-top: 1px; /* needed for the selected box with border */
}

.preorder .selection-buttons .item {
    display: inline-block;
    float: left;
    width: 33%; /* 32% for 3 items */
    padding: 0 5px;
}

.preorder .selection-buttons label {
    overflow: hidden;
    padding: 12px 6px;
    text-align: center;
    border: 1px solid #d6d6d6;
    display: block;
    border-radius: 5px;
    overflow: hidden;
    word-wrap: break-word;
    margin: 0;
    font-size: 14px;
    font-weight: normal;
}

.preorder .selection-agreement p {
    font-size: 17px;
}

.preorder .selection-agreement input[type=checkbox] {
    position:absolute;
    z-index:-1000;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height:1px;
    width:1px;
    margin:-1px;
    padding:0;
    border:0;
}

.preorder .selection-agreement input[type=checkbox] + label {
    padding-left:23px;
    display:inline-block;
    line-height:18px;
    background-repeat:no-repeat;
    background-position: 0 0;
    font-size:17px;
    vertical-align:middle;
}

.preorder .selection-agreement input[type=checkbox]:checked + label {
    background-position: 0 -18px;
}

.preorder .selection-agreement label {
    background-image: url('img/checkbox.png');
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 0 none;
    border-radius: 0;
    padding: 0;
}

@media only screen and (max-width: 380px) {
    .preorder .selection-agreement p,
    .preorder .selection-agreement input[type=checkbox] + label {
        font-size: 15px;
    }
}

.preorder .selection-enabled label {
    cursor: pointer;
}

.preorder .selection-enabled label:hover {
    border-color: #333;
}

.preorder .item-disabled label {
    cursor: default;
}

.preorder .item-disabled label:hover {
    border-color: #d6d6d6;
}

.preorder .selection-buttons .item.selected label,
.preorder .selection-buttons .item.selected input[type="radio"]:checked + label {
    margin-top: -1px;
    border-width: 2px;
    border-color: #268be5;
}

.preorder .selection-customer .item {
    margin-bottom: 20px;
}

.preorder .selection-customer .popover {
    display: block;
    position: relative;
    top: 0 !important;
    left: 0 !important;
    z-index: 100;
    max-width: none;
    background-color: #f1f2f3;
    border-color: #e2e2e2;

    -moz-box-shadow: unset;
    -webkit-box-shadow: unset;
    -o-box-shadow: unset;
    box-shadow: unset;

    clear: both;
}

.preorder .selection-customer .popover .arrow {
    border-bottom-color: #e2e2e2;
}

.preorder .selection-customer .popover .arrow:after {
    border-bottom-color: #f1f2f3;
}

.preorder .selection-customer .existing-customer-popover .arrow {
    left: 68px !important;
}

.preorder .selection-customer .new-customer-popover .arrow {
    left: 215px !important;
}

.preorder .selection-customer .popover-content {
    font-family: Arial, sans-serif;
    font-size: 12px;
}

.preorder .selection-customer .popover-content p:last-child {
    margin-bottom: 0;
}

.preorder .slide-image-animate {
    margin-bottom: 30px;
    text-align: center;
}

.preorder .slide-image-animate img {
    max-width: 100%;
}

.preorder .color-icon {
    display: block;
    width: 31px;
    height: 31px;
    margin: 0 auto;
    background: url('img/colors_sprite.png') no-repeat 0 0;
}

.preorder .gold {
    background-position: -26px -5px;
}

.preorder .silver {
    background-position: -60px -5px;
}

.preorder .gray {
    background-position: -94px -5px;
}

.preorder .black {
    background-position: -125px -5px;
}

.preorder .rose {
    background-position: -158px -5px;
}

.preorder .color-text,
.preorder .size-price  {
    display: block;
    margin-top: 8px;
}

.no-stock {
    display: none;
}

.preorder-submit {
    display: inline-block;
    width: auto;
    margin: 30px auto 20px;
    padding: 25px 40px;
    border: 0 none;
    border-radius: 3px;
    background-color: #268be5;
    font-family: 'VodafoneLight';
    font-size: 24px;
    line-height: 1;
    color: #fff;
    cursor: pointer;
}

.preorder-submit:hover {
    text-decoration: none;
}

.preorder .disabled-btn {
    background-color: #f0f0f0;
    color: #ccc;
    cursor: default;
}

.extra-links {
    margin-bottom: 20px;
    text-align: center;
}

.extra-links .tg-modal {
    display: inline-block;
    padding-left: 20px;
    font-size: 14px;
}

.extra-links .tg-modal:first-child {
    padding-left: 0;
}

/*.modal-body ol {
    padding-left: 15px;
}

.modal-body li {
    padding-bottom: 10px;
    font-family: Arial;
    font-size: 13px;
}

.modal-body li:last-child {
    padding-bottom: 0;
}*/

.preorder-login {
    padding: 15px 20px;
}

.preorder-login .tg-modal {
    text-align: center;
}

.preorder-login input[type=text],
.preorder-login input[type=password] {
    font-family: Arial, sans-serif;
}

.preorder-login .preorder-submit {
    margin-top: 10px;
    margin-bottom: 30px;
}

.preorder-agreement label {
    font-size: 14px;
}

@media only screen and (min-width: 767px) {
    .preorder {
        font-size: 20px;
    }

    .preorder .slide-image-animate {
        margin-bottom: 0;
    }
}

@media only screen and (min-width: 992px) {
    .preorder-login {
        padding: 35px 40px;
    }
}

/* Preorder iPhone6S */
.preorder-iphone6s .tg-tabs .tg-tabs-recharge .tg-head,
.preorder-iphone6s .tg-display {
    padding: 20px 10px;
}

.preorder-iphone6s  .tg-tabs .tg-tabs-recharge .tg-head {
    text-align: center;
}

.preorder-iphone6s .slide-image-animate {
    height: 500px;
}

.preorder-iphone6s .selection-buttons .item {
    margin-bottom: 10px;
}

.preorder-iphone6s .selection-model .item,
.preorder-iphone6s .selection-finish .item {
    width: 50%;
}

.preorder-iphone6s .selection-finish .item {
    min-height: 85px;
}

.preorder-iphone6s .selection-storage .item {
    width: 100%;
}

@media only screen and (max-width: 390px) {
    .preorder-iphone6s .slide-image-animate {
        position: relative;
        height: 0;
        padding-bottom: 130%;
    }

    .preorder-iphone6s .slide-image-animate img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }
}

@media only screen and (min-width: 767px) {
    .preorder-iphone6s .tg-tabs .tg-tabs-recharge .tg-item {
        width: 30%;
    }

    .preorder-iphone6s .tg-tabs .tg-tabs-recharge .tg-item.is-active-tab-item {
        width: 70%;
    }

    .preorder-iphone6s .slide-image-animate {
        height: auto;
    }

    .preorder-iphone6s .selection-buttons .items,
    .preorder-iphone6s .selection-buttons .item,
    .preorder-iphone6s .selection-buttons label {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
    }

    .preorder-iphone6s .selection-buttons label {
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column;

        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;

        width: 100%;
    }

    .preorder-iphone6s .selection-buttons .item {
        margin-bottom: 0;
    }

    .preorder-iphone6s .selection-model .item,
    .preorder-iphone6s .selection-finish .item,
    .preorder-iphone6s .selection-storage .item {
        width: 25%;
    }

    .preorder-iphone6s .input-group,
    .preorder-iphone6s input:not([type=submit]) {
        width: 100%;
    }

    .preorder-not-customer .preorder-submit {
        display: inline-block;
    }
}


/*
   Why Vodafone
   ========================================================================== */

.why-vodafone {
    padding-top: 20px;
    border-top: 1px solid #f3f3f3;
}

.why-vodafone .col-inner {
    margin-bottom: 15px;
    padding: 12px;
    background-color: #f3f3f3;
}

.why-vodafone h3 {
    margin-bottom: 8px;
    font-size: 14px;
}

.why-vodafone p {
    margin: 0;
}

@media only screen and (min-width: 767px) {
    .why-vodafone .col-inner {
        margin-bottom: 30px;
    }
}

/*
   Footer
   ========================================================================== */

.mod-footer {
    padding-bottom: 0px;
}

.footer-fixed {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    opacity: 0.8;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 10px 0;
    z-index: 40;
    background-color: #fff;
    font-size: 12px;
}

/* Fix for fixed elements on touch devices on input focus */
.has-touch .footer-fixed {
    position: static;
}

.footer-fixed .copy {
    text-align: center;
}

.footer-icons-wrapper {
    text-align: center;
}

.footer-icon-social {
    padding: 0 5px;
}

.footer-icon-social:hover {
    text-decoration: none;
}

.footer-icon-social img {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    opacity: 0.7;

    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.lt-ie9 .footer-icon-social img {
    max-width: none;
}

.footer-icon-social:hover img {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    opacity: 1;
}

@media only screen and (min-width: 767px) {
    .footer-fixed .copy {
        margin-bottom: 0;
        float: left;
        line-height: 36px;
    }

    .footer-social {
        float: right;
    }

    .footer-social span {
        padding-right: 10px;
        font-weight: bold;
    }

    .footer-icons-wrapper {
        display: inline-block;
    }

    .footer-icon-social {
        padding: 0;
    }
}


/* Prepaid Plans page - PrepaidPlansRed - You Pay| You Get table - START */

.YouPayYouGetTitle {
    margin-bottom: 15px;
}
.YouPayYouGetTitle div {
    color: #333333;
    display: inline;
    font-size: 20px;
    font-weight: bold;
}
.YouPayYouGetTitleCell {
    padding-left:32px;
    padding-right:130px;
}
.YouPayYouGetHeaderList {
    border: 1px solid #D3D3D3;
    width: 100%;
    height: 56px;
    margin-bottom: 10px;
    border-collapse: separate;
    border-spacing: 0 5px;
    /*background: url('../img/backgrounds/backgroundYouPayYouGetNoSelect.jpg') repeat-x; */
}
.YouPayYouGetHeaderList td {
    padding: 0 10px;
    border-left: 1px solid #CCCCCC;
    font-weight: bold;
    text-align: center;
    line-height: 1;
}
.YouPayYouGetHeaderList td:first-child, .YouPayYouGetHeaderList .creditCell {
    border: 0 none;
}
.YouPayYouGetHeaderList .planCell {
    padding: 0 20px;
    border: 0 none;
    text-align: left;
}
.YouPayYouGetHeaderListY {
    width: 650px;
    margin-left: 65px;
}
.YouPayYouGetRow div {
    display: inline;
    font-size: 20px;
    font-weight: normal;
    color: #333333;
    width: 708px;
    height: 65px;
    border-bottom: 1px solid #CCCCCC;
    float:left;
    text-align: center;
    padding-top:20px;
}
.YouPayYouGetRow div p {
    padding-top:10px;
    font-size: 20px;
    font-weight: normal;
    color: #333333;
    margin-bottom: 0px;
}
.YouPayYouGetRow div p.link_inv {
    font-size: 13px;
    font-weight: normal;
    padding: 0;
}
.YouPayYouGetRow .YouPayYouGetPerMonth {
    width: 135px;
}
.YouPayYouGetRow .YouPayYouGetCredit {
    width: 60px;
}
.YouPayYouGetRow .YouPayYouGetMinutes {
    width: 145px;
}
.YouPayYouGetRow .YouPayYouGetData {
    width: 100px;
}
.YouPayYouGetRow .YouPayYouGetValidity {
    width: 125px;
}
.YouPayYouGetRow .YouPayYouGetButton {
    width: 142px;
}
.YouPayYouGetButton .btn {
    padding-left: 8px;
    padding-right: 10px;
}
.YouPayYouGetSmallText {
    display: inline-block;
    font-size: 13px;
    font-weight: normal;
    line-height: 110%;
    width: 100px;
}
.YouPayYouGetSmallTextBoldQR {
    font-size: 14px;
    font-weight: bold;
}
.YouPayYouGetSmallTextBold {
    font-size: 13px;
    font-weight: bold;
    ;
}
.YouPayYouGetBigText {
    font-size: 17px;
    font-weight:bold;
}
.YouPayYouGetAvailable {
    color: #333333;
    font-size: 20px;
    width: 708px;
    border-bottom: 1px solid #CCCCCC;
    margin:40px 0 30px 0;
    float:left;
    padding-bottom: 10px;
    font-weight:bold;
}
.YouPayYouGetWithVodafonePrepaid {
    color: #333333;
    font-size: 13px;
    width: 708px;
    height: 90px;
    margin-top:25px;
    float:left;
}
.YouPayYouGetClear {
    height:10px;
}
.YouPayYouGetTitle {
    margin-bottom: 15px;
}
.TopPrepaisPromo {
    margin-bottom: 15px;
}
.TopPrepaisPromo .plansBenefits {
    float: left;
}
.TopPrepaisPromo .PrepaidSpOffer {
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f2f2f2));
    background: -webkit-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
    background: -o-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
    background: -ms-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
    background: linear-gradient(to bottom, #ffffff 0%, #f2f2f2 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f2f2f2', GradientType=0);
    border: 1px solid #CCCCCC;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
    margin: 0 0 20px 20px;
    padding: 20px 15px 20px 20px;
    width: 310px;
    float: left;
}
.TopPrepaisPromo .PrepaidSpOffer p {
    margin-bottom: 0px;
}
.TopPrepaisPromo .PrepaidSpOffer p b {
    display: block;
    font-size: 15px;
    font-weight: bold;
    line-height: 120%;
    margin-bottom: 0;
    padding-bottom: 4px;
}

/* -- Prepaid Plans New Offer -- */

.prepaidOfferContainer {
    border: 2px solid;
    padding: 20px 20px 5px;
    width:50%;
    margin-bottom: 5%;
}


.prepaid-sim-icon {
    float: left;
    margin-left: 6%;
}

.prepaid-offer-buy {
    float: right;
    margin-bottom: 5%;
    margin-right: 20%;
}

.prepaid-you-get {
    font-family:'VodafoneRegular', Arial, sans-serif;
    font-size: 24px;
    margin-bottom: 0;
}

.no-margin-prepaid {
    margin-bottom: 0;
    margin-top: 0;
}

@media only screen and (max-width: 768px ){
    .prepaid-offer-buy {
        margin-right: 0;
    }
}

.prepaidSimpleRecharge {
    clear: both;
}


/* Mobile Prepaid plans page */

@media only screen and (max-width: 996px) {
    .prepaidSimpleRecharge {
        font-size: 18px;
    }
    .prepaid-you-get {
        font-size: 16px;
    }
    .YouPayYouGetHeaderList {
        width: 80%;
    }

    #prepaidPlans .planHolder .planName {
        width: 55px;
    }

    #prepaidPlans .planHolder .credit{
        width: 30px;
    }

    #prepaidPlans .planHolder .international {
        width: 92px;
    }

    #prepaidPlans .planHolder .data {
        width: 71px;
    }

    #prepaidPlans .planHolder .validity {
        width: 51px;
    }
}

.prepaid-plans .btn:hover {
    color: #fff;
}

.prepaid-plan-title {
    float: left;
    margin: 0;
    padding: 0;
    border-bottom: 0 none;
    line-height: 1.2;
}

.prepaid-plan-title > span {
    display: block;
    font-size: 14px;
}

.prepaid-plan .btn {
    float: right;
    width: auto;
    padding-left: 15px;
    padding-right: 15px;
}

.panel-prepaid {
    margin-bottom: 30px;
    border-top-width: 0;
    border-right-width: 0;
}

.panel-prepaid .info:last-child {
    margin-bottom: 0;
}

.panel-prepaid .value {
    display: block;
    font-weight: bold;
}

/* Prepaid Plans page - PrepaidPlansRed - You Pay| You Get table  - END */

/* Prepaid plans */

.carousel-prepaid .ca-nav-primary {
    left: -70px;
    right: -70px;
}

.carousel-prepaid .ca-block {
    text-align: center;
}

.carousel-prepaid .box {
    padding: 20px 25px;
    border-radius: 0;
    border-color: #dcdcdc;
    box-shadow: none;
}

.carousel-prepaid .plan-title {
    font-size: 14px;
    color: #e60000;
}

.carousel-prepaid .plan-title span {
    display: block;
    font-weight: 400;
    color: #333;
}

.carousel-prepaid .plan-details {
    padding: 15px 0;
    border-top: 1px solid #dcdcdc;
}

.carousel-prepaid .plan-details p {
    margin-bottom: 0;
}

.carousel-prepaid .btn {
    margin-bottom: 30px;
}

.carousel-prepaid .tg-head {
    display: inline-block;
    padding: 7px 10px;
    border-radius: 50%;
    background-color: #eee;
    color: #e60000;
    line-height: 1;
}

.carousel-prepaid .tg-head:hover,
.carousel-prepaid .tg-head:focus,
.carousel-prepaid .tg-head:active {
    text-decoration: none;
}

.carousel-prepaid .tg-body {
    padding: 20px;
    border-color: #dcdcdc;
    border-radius: 0;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.2);
}

.carousel-prepaid .tg-body p {
    margin-bottom: 0;
    font-size: 12px;
}

.carousel-prepaid .tg-close {
    top: 4px;
    right: 8px;
}

.carousel-prepaid .tg-flyout > .tg-body {
    background-color: #fff;
}

.carousel-prepaid .tg-flyout > .tg-body:before {
    border-bottom-color: #dcdcdc;
}

.carousel-prepaid .tg-flyout > .tg-body:after {
    border-bottom-color: #fff;
}

@media only screen and (min-width: 767px) {
    .carousel-prepaid {
        margin-left: 70px;
        margin-right: 70px;
    }

    .carousel-prepaid .ca-block {
        padding-left: 7px;
        padding-right: 7px;
    }

    .carousel-prepaid .tg-body {
        margin-left: -30px;
        margin-right: -30px;
    }

    .carousel-prepaid .tg-flyout > .tg-body:before {
        border-top-color: #dcdcdc;
        border-bottom-color: transparent;
    }

    .carousel-prepaid .tg-flyout > .tg-body:after {
        border-bottom-color: transparent;
    }

    .carousel-prepaid .btn {
        margin-bottom: 0;
    }
}
 .prepaidSimpleRecharge {
    /*margin-bottom: 30px;*/
    margin: 30px 0;
    font-family:'VodafoneRegular', Arial, sans-serif;
    font-size: 36px;
    font-weight: normal;
    line-height: 1;
    color: #e60000;
}
.prepaidFallaPrepaid {
    margin-bottom: 30px;
    font-family:'VodafoneRgRegular', Arial, sans-serif;
    font-size: 36px;
    line-height: 1;
    color: #e60000;
}
.prepaidFallaPrepaid span {
    font-family:'VodafoneLtRegular', Arial, sans-serif;
    font-weight: normal;
    font-size: 30px;
}
#prepaidPlans, #prepaidPlansY {
    margin-bottom: 30px;
    padding-bottom: 10px;
    border-bottom: 1px solid #ccc;
}
#prepaidPlansY {
    margin-left: 65px;
    margin-bottom: 0;
    border: 0 none;
}
#prepaidPlans .planHolder, #prepaidPlansY .planHolder {
    float: left;
    margin-top: 10px;
}
#prepaidPlans .planHolder .title, #prepaidPlansY .planHolder .title {
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}
#prepaidPlans .planHolder .supOption, #prepaidPlansY .planHolder .supOption {
    font-size: 13px;
    text-align: center;
}
#prepaidPlans .planHolder .credit, #prepaidPlansY .planHolder .credit {
    width: 69px;
    text-align: center;
    font-size: 20px;
    display: inline-block;
    margin-top: 20px;
}
#prepaidPlans .planHolder .international {
    width: 90px;
    text-align: center;
    font-size: 20px;
    display: inline-block;
    margin-top: 20px;
}
#prepaidPlansY .planHolder .data {
    display: inline-block;
    font-size: 20px;
    width: 85px;
    text-align: center;
}
#prepaidPlans .planHolder .data {
    display: inline-block;
    font-size: 20px;
    width: 90px;
    text-align: center;
}
#prepaidPlans .planHolder .data span, #prepaidPlansY .planHolder .data span {
    font-size: 16px;
}
#prepaidPlansY .planHolder .validity {
    display: inline-block;
    font-size: 20px;
    width: 90px;
    text-align: center;
}
#prepaidPlans .planHolder .validity {
    display: inline-block;
    font-size: 20px;
    width: 90px;
    text-align: center
}
#prepaidPlans .planHolder .planName, #prepaidPlansY .planHolder .planName {
    display: inline-block;
    width: 105px;
    float: left;
    padding-right: 10px;
}
#prepaidOptions .prepaidOptions label, #prepaidOptionsY .prepaidOptionsY label {
    font-weight: bold;
    margin-left: 10px;
}
#prepaidOptions .prepaidOptions span, #prepaidOptionsY .prepaidOptionsY span {
    margin: 0px;
}
#prepaidOptions .prepaidOptions input, #prepaidOptionsY .prepaidOptionsY input {
    left: -9999px;
    position: absolute;
}
#prepaidOptions .prepaidOptions div, #prepaidOptionsY .prepaidOptionsY div {
    width: 100%;
}
.fallaImgWrapper {
    position: relative;
    margin-bottom: 15px;
}
.prepaidArrow {
    position: absolute;
    bottom: -45px;
    left: 5px;
    width: 40px;
    height: 75px;
    background: transparent url("/cssold/images/common/sprite2.png") no-repeat scroll -419px 0;
}
#youthPrepaid {
    border-bottom: 1px solid #ccc;
    padding: 0 0 10px 30px;
    margin: 10px 0 50px 65px;
}
#youthPrepaid table td {
    vertical-align: middle;
}
#youthPrepaid .price {
    font-size: 18px;
}
#youthPrepaid .value {
    display: inline;
    font-size: 18px;
    font-weight: normal;
    color: #e60000;
}
#youthPrepaid .period {
    font-size: 14px;
    font-style: italic;
}
#youthPrepaid .options {
    font-weight: bold;
    color: #e60000;
}
#youthPrepaid .details {
    font-weight: bold;
}
.yoloImgWrapper {
    text-align: center;
}
.yoloImg {
    display: inline-block;
    width: 33%;
}
.yoloDetails {
    margin: 30px 0 0 30px;
}
.yoloDetails p {
    margin-bottom: 5px;
}
.ui-tooltip.yolo-tooltip, .ui-tooltip.prepaid-tooltip {
    /*color: #333333;*/
    border-radius: 3px;
    /*font: bold 14px "Helvetica Neue", Sans-Serif;*/
    /*text-transform: uppercase;*/
    box-shadow: 0 0 1px #656565;
    width: 302px;
    z-index: 5;
}
.ui-tooltip.prepaid-tooltip .ui-tooltip-content, .ui-tooltip.yolo-tooltip .ui-tooltip-content {
    /*border: 2px solid #ccc;*/
    padding: 26px;
}
.ui-tooltip.prepaid-tooltip, .ui-tooltip.prepaid-tooltip .arrow:after, .ui-tooltip.yolo-tooltip, .ui-tooltip.yolo-tooltip .arrow:after {
    background: white;
    /*border: 1px solid #656565;*/
    border: 2px solid #ccc;
}
.ui-tooltip.prepaid-tooltip .arrow, .ui-tooltip.yolo-tooltip .arrow {
    width: 70px;
    height: 16px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    margin-left: -35px;
    bottom: -16px;
}
.ui-tooltip.prepaid-tooltip .arrow.top, .ui-tooltip.yolo-tooltip .arrow.top {
    top: -16px;
    bottom: auto;
}
.ui-tooltip.prepaid-tooltip .arrow.left, .ui-tooltip.yolo-tooltip .arrow.left {
    left: 20%;
}
.ui-tooltip.prepaid-tooltip .arrow:after, .ui-tooltip.yolo-tooltip .arrow:after {
    content:"";
    position: absolute;
    left: 20px;
    top: -20px;
    width: 25px;
    height: 25px;
    box-shadow: 6px 5px 9px -9px black;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    tranform: rotate(45deg);
}
.ui-tooltip.prepaid-tooltip .arrow.top:after, .ui-tooltip.yolo-tooltip .arrow.top:after {
    bottom: -20px;
    top: auto;
}
#closebtnRed, #closebtnYolo {
    background-color: #FFFFFF;
    position: absolute;
    right: 0;
    top: 0;
    text-align: right;
    padding: 5px 25px 5px 10px;
    background: url("/cssold/images/common/sprite2.png") no-repeat scroll 54px -2551px #FFFFFF;
}
#closebtnRed:hover, #closebtnYolo:hover {
    cursor: pointer;
}
#selectPlanprepaid .selectPlanPrepaidStyle, #prepaidPlansY .SelectPlanYoloStyle {
    width:20px;
    display:block;
    height:20px;
    background: url("/cssold/images/common/sprite2.png") no-repeat scroll -385px 0px #fff;
    margin:30px 10px 0 0;
    float:left;
}
#prepaidOptions .prepaidOptions span.welcomePack, #prepaidOptionsY .prepaidOptionsY span.welcomePack {
    font-weight: normal;
    background: none;
    width: auto;
    float: none;
    display: inline;
}

/* Mobile Prepaid plans page */

@media only screen and (max-width: 996px) {
    .prepaidSimpleRecharge {
        font-size: 18px;
    }
    .prepaid-you-get {
        font-size: 16px;
    }
    .YouPayYouGetHeaderList {
        width: 80%;
    }

    #prepaidPlans .planHolder .planName {
        width: 55px;
    }

    #prepaidPlans .planHolder .credit{
        width: 70px;
    }

    #prepaidPlans .planHolder .international {
        width: 50px;
    }

    #prepaidPlans .planHolder .data {
        width: 71px;
    }

    #prepaidPlans .planHolder .validity {
        width: 51px;
    }
}
/* Prepaid & Yollo dropdown END */


/* Postpaid Plans: Super Saver India */

.postpaid-classic-box-content {
padding: 5px;
background-color: #F4F5D5;
text-align: center;
width:100%;
height: 80px;
}

@media (min-width: 479px) {
    .postpaid-classic-box-content {
    padding: 5px;
    background-color: #F4F5D5;
    text-align: center;
    width:130%;
    height: 80px;
    }
}

.postpaid-classic-txt {
margin: 0;
font-family: Arial, sans-serif;
font-size: 12px;
}

.postpaid-classic {
padding: 5px;
text-align: center;
margin-left: auto;
margin-right: auto;
width:100%;
}

/* Submit your Business */


@media only screen and (min-width: 768px) {
    .business-lmargin {
        margin-left: 26%;
    }
}

/*
   Broadband
   ========================================================================== */

.coverage-speed {
    margin-bottom: 5px;
    padding-bottom: 5px;
    background: transparent url('img/broadband-house.png') no-repeat center / contain;
    font-weight: bold;
    line-height: 1;
    color: #fff;
}

.coverage-speed span {
    display: block;
    font-size: 2em;
}

.coverage-speed-5 {
    font-size: 10px;
    opacity: 0.4;
}

.coverage-speed-5 span {
    padding-top: 20px;
}

.coverage-speed-20 {
    font-size: 12px;
    opacity: 0.6;
}

.coverage-speed-20 span {
    padding-top: 30px;
}

.coverage-speed-50 {
    font-size: 14px;
    opacity: 0.8;
}

.coverage-speed-50 span {
    padding-top: 40px;
}

.coverage-speed-100 {
    font-size: 16px;
}

.coverage-speed-100 span {
    padding-top: 50px;
}

@media only screen and (max-width: 767px) {
    .coverage-speed-20 {
      font-size: 10px;
    }
    .coverage-speed-50 {
      font-size: 11px;
    }
    .coverage-speed-100 {
      font-size: 11px;
    }
}

/*
   OBP
   ========================================================================== */

.obp-login .grid {
    margin-left: -10px;
}

.obp-login .col {
    padding-left: 10px;
}

.obp-login .input-group-addon:first-child {
    display: inline-block;
    width: 3.5em;
}

.obp-login .tg-tooltip {
    -webkit-flex: 0 0 32px;
    -ms-flex: 0 0 32px;
    flex: 0 0 32px;

    min-width: 32px;
    margin: 0;
}

.obp-login .container-alt h2 {
    font-size: 26px;
}

.obp-payment-method {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

.obp-payment-method img {
    display: block;
    margin: 15px auto 35px;
}

.obp-confirmation-review li {
    margin-bottom: 20px;
    font-size: 16px;
}

@media only screen and (min-width: 992px) {
    .obp-login .container-alt h2 {
        font-size: 30px;
    }
}

/* Phantom - Privileges Page */

/*.small-text {
    font-size: 90%;
}*/

.imageLeft {
    float: left;
    margin-right: 20px;
    margin-bottom: 15px;
}

.imageRight {
    float: right;
    margin-left: 20px;
    margin-bottom: 15px;
}

.btnPrivileges {
    clear: both;
}

/*
   Stepper
   ========================================================================== */

/* Vertical */
.stepper-vertical-wrapper {
    margin: 30px 0;
}

.stepper-vertical {
    margin: 0;
    padding: 0;
    list-style: none;
}

.stepper-vertical .step {
    margin-top: 5px;
    border: 1px solid #e9e9e9;
    border-radius: 3px;
    background-color: #f4f4f4;
    box-shadow: 0 1px 2px rgba(50, 50, 50, 0.75);
}

.stepper-vertical .step:first-child {
    margin-top: 0;
}

.stepper-vertical .step-head {
    margin: 0;
    padding: 8px 10px;
    background-color: #fff;
    font: 400 20px/30px "Arial", sans-serif;
}

.stepper-vertical .step.active .step-head {
    margin: 0;
    border: medium none;
    border-radius: 3px 3px 0 0;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
}

.stepper-vertical .step-body {
    display: none;
    padding: 15px;
}

.stepper-vertical .step-body .white-box:last-child {
    margin: 0;
}

.stepper-vertical .step.active .step-body {
    display: block;
}

@media only screen and (min-width: 767px) {
    .stepper-vertical .step-head {
        padding: 8px 20px;
    }

    .stepper-vertical .step-head i {
        margin-right: 10px;
    }

    .stepper-vertical .step {
        margin-top: 10px;
    }
}

/* ==========================================================================
   States
   ========================================================================== */

.is-visible-block {
    display: block !important;
}

.is-visible-inline-block {
    display: inline-block !important;
}

.is-hidden {
    display: none !important;
}

.is-transparent {
    opacity: 0 !important;
    visibility: hidden !important;
}

.is-opaque {
    opacity: 1 !important;
    visibility: visible !important;
}

.is-animated {
    visibility: visible !important;
}

/*
   Product box
   ========================================================================== */

.product-box h3 {
    margin-bottom: 5px;
}

.product-box .item-image {
    margin: 15px 0;
}

.product-box img {
    display: block;
    height: 150px;
    margin: 0 auto;
    padding: 0 0 10px;
    vertical-align: top;
}

.product-box i,
.product-box div {
    margin-bottom: 15px;
}

.product-box .price {
    font: 400 30px/1 "Signika Negative", Arial, sans-serif;
    font-weight:700;
    margin: 2px 0;
}

.product-box .btn {
    width: 100%;
    margin: 0 0 5px;
}

@media only screen and (min-width: 767px) {
    .product-box img {
        padding: 0;
    }
}

/* Business slider */
.btn.requestACallBack {
    position: relative;
    left: 40%;
    top: 4px;
}




/* START Info Sliders */

/* Business Slider */

.business-slider {
    position: fixed;
    top: 15%;
    right: -255px;
    z-index: 900;
}

.business-slider-btn {
    position: absolute;
    top: 20px;
    padding: 10px 15px;
    background-color: #f1f1f1;
    border-radius: 0 0 10px 10px;
    cursor: pointer;

    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);

    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
}

.business-slider-btn h3 {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 0;
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 18px;
    line-height: 29px; /* height of the circle arrow */
    vertical-align: middle;
    color: #e60000;
}

.business-slider-arrow {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.business-slider.open .business-slider-arrow {
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
.business-slider-body {
    width: 255px;
    padding: 10px;
    background: #e0e0e0;
}

.business-slider-body p {
    margin: 10px 0;
    font-family: 'Signika Negative', Arial, sans-serif;
    font-weight:700;
    font-size: 16px;
}

.business-slider-body .btn {
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}

@media only screen and (min-width: 767px) {
    .business-slider {
        right: -360px;
    }

    .business-slider-btn {
        padding: 15px 30px;
    }

    .business-slider-btn h3 {
        margin-right: 15px;
        font-size: 20px;
    }

    .business-slider-body {
        width: 360px;
        padding: 30px;
    }

    .business-slider-body p {
        margin: 20px 0;
        font-size: 18px;
    }
}

@media only screen and (max-height: 359px) {
    .business-slider {
        display: none; /* hide the slider on landscape phones under 360px width */
    }
}

/*
   Decide plan
   ========================================================================== */

.decide-plan .container-alt {
    padding: 35px 15px;
    text-align: center;
}

.decide-plan .grid {
    margin-top: 40px;
    margin-bottom: 40px;
}

.decide-plan .grid .col:last-child::before {
    content: 'or';
    position: absolute;
    top: -25px;
    left: 50%;
    width: 20px;
    height: 20px;
    line-height: 20px;
    padding: 10px;
    border: 1px solid #e3e3e3;
    border-radius: 50%;
    background-color: #f4f4f4;
    box-shadow: 0 0 0 10px rgba(255, 255, 255, 1);
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;

    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

@media only screen and (min-width: 767px) {
    .decide-plan .grid .col:last-child::before {
        top: 50%;
        left: -15px;

        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .decide-plan .container-alt {
        margin-bottom: 0;
        padding: 35px;
    }
}

/*
   My Shopping Cart > Store Locator (mobile page)
   ========================================================================== */
#store-map-message {
    height: 0;
    overflow: hidden;
    visibility: hidden;
}

/* Visiting Doha */

.choose-plan-box {
    width: 250px;
    padding-top: 20px;
}
.center-content {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    font-weight: normal;
}
.purple {
    color: #9c2aa0;
}

.space-bottom {
    margin-bottom: 20px;
}

.doha-banner {
    box-shadow: 0px 0px 0px rgba(0,0,0,0);
    border: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -ms-border-radius: 0px;
    -o-border-radius: 0px;
    border-radius: 0px;
}

.no-border-bottom {
    border-bottom: 0px solid white;
}

.visiting-doha .text-wrap {
    margin: 0 20px;
    padding: 20px 0;
    position: relative;
}

.visiting-doha .text-wrap h2 {
    font: 400 22px/1.158 "VodafoneRegular",Arial,sans-serif;
}

.free {
    position: relative;
    left: 95px;
    top: 40px;
    z-index: 10;
}

.choose-sim {
    width: 130px;
    height: 150px;
    display: table-cell;
    vertical-align: bottom;
}

.visiting-doha-grid {
    position: relative;
}

.visiting-doha-grid .col {
    position: static;
}

.visiting-doha-form input[type=text],
.visiting-doha-form input[type=password] {
    padding: 10px;
}

.visiting-doha-form .fm-combine-select .fm-select {
    width: 30%;
}

.visiting-doha-form fieldset {
    margin-bottom: 0px;
}

.visiting-doha-form .selected {
    border: 2px solid #9c2aa0;
    background-color: #f4f4f4;
}

.hide_input {
    position: absolute;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px,1px,1px,1px);
}

.nano-sim {
    width: 41px;
    height: 51px;
    background-position: -3726px -6px;
    display: block;
    margin: 0 auto;
}

.micro-sim {
    width: 48px;
    height: 60px;
    background-position: -3672px -6px;
    display: block;
    margin: 0 auto;
}

.regular-sim {
    width: 51px;
    height: 80px;
    background-position: -3775px -6px;
    display: block;
    margin: 0 auto;
}

.data-only {
    width: 70px;
    height: 79px;
    background-position: -3901px -7px;
    display: block;
    margin: 0 auto;
}

.talk-and-data {
    width: 59px;
    height: 79px;
    background-position: -3602px -7px;
    display: block;
    margin: 0 auto;
}

.talk-only {
    width: 70px;
    height: 76px;
    background-position: -6966px -10px;
    display: block;
    margin: 0 auto;
}

.free-icon {
    width: 57px;
    height: 56px;
    background-position: -3835px -7px;
    display: block;
    margin: 0 auto;
}

.img-full {
    width: 100%;
}

.order-summary {
    margin-bottom: 30px;
}

.is-order-summary-sticky {
    position: fixed;
}

.is-order-summary-bottom {
    position: absolute;
    bottom: 0;
}

.visiting-doha-form .parsley-errors-list {
    margin-top: 10px !important;
}

@media only screen and (max-width:766px){
    .sim-center {
        margin-left: 25%;
    }
    .doha-banner .txt-wrap {
        border-bottom: 0px solid #fff;
    }
}

@media only screen and (min-width: 767px) {
    .doha-banner {
        margin-top: 30px;
    }
    .choose-plan-box {
        width: 50%;
    }
    .visiting-doha-form .fm-error {
        left: 40%;
    }
    .visiting-doha-form .fm-data label {
        text-align: left;
        padding-left: 2px;
    }
    .doha-banner .wysiwyg {
        background-color: rgba(238,238,238,0.6);
    }
    .visiting-doha-price {
        padding: 10px 10px 0 0;
    }
    .visiting-doha-form .parsley-errors-list {
        margin-left: 240px !important;
    }
    .visiting-doha-form .fm-select .parsley-errors-list,
    .visiting-doha-form .fm-combine-select .parsley-errors-list {
        margin-left: 0 !important;
    }
}

@media only screen and (min-width: 767px) and (max-width: 769px){
    .visiting-doha-form .fm-inline label {
        width: 140px;
        padding-left: 0px;
    }
    .visiting-doha-form .input-sm {
        width: 50%;
    }
    .visiting-doha-form .fm-submit {
        padding-left: 0px;
    }
    .pay-title{
        padding-left: 0px;
    }
    .visiting-doha-form .parsley-errors-list {
        margin-left: 140px !important;
    }
    .doha-banner .wysiwyg {
        width: 56%;
    }
    .visiting-doha-price {
        clear: both;
    }
}
/*
@media only screen and (min-width: 992px) {
    .doha-banner .wysiwyg {
        padding: 20px;
    }
}
*/
@media only screen and (min-width: 1140px) {
    .doha-banner {
        margin-top: 0;
    }
}

/* END Visiting Doha */


/* Video Advice Centre */

.vac-iframe-wrap {
    position: relative;
    height: 0;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
}

.vac-panel {
    margin-top: 30px;
    background-color: #000;
    color: #fff;
}

.vac-panel h3 {
    font-family: 'VodafoneRegular', Arial, sans-serif;
}

.vac-panel .fm-error {
    color: #000;
}

.vac-social {
    margin-top: 10px;
}

.vac-social a {
    display: inline-block;
}

.vac-social-margins {
    margin-top: 10px;
    margin-bottom: 50px;
}

.vac-tg-tabs .embed-responsive {
    margin-bottom: 30px;
}

@media only screen and (min-width: 767px) {
    .vac-grid,
    .vac-col {
        display: -ms-flexbox;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
    }

    .vac-iframe-wrap {
        height: auto;
        padding-bottom: 0;

        -webkit-flex: 1 1 0px;
        -ms-flex: 1 1 0px;
        flex: 1 1 0px;
    }

    .vac-panel {
        display: -ms-flexbox;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;

        -webkit-box-direction: column;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;

        -ms-flex-pack: center;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        justify-content: center;

        -webkit-flex: 1 1 0px;
        -ms-flex: 1 1 0px;
        flex: 1 1 0px;

        margin-top: 0;
        padding-top: 35px;
        padding-bottom: 35px;
    }

    .vac-panel #email,
    .vac-panel .btn {
        width: 100%;
    }

    .vac-social {
        margin-top: 20px;
    }

    .vac-tg-tabs .embed-responsive {
        margin-bottom: 0;
    }

    .vac-gallery .col {
        margin-bottom: 30px;
    }
}

@media only screen and (min-width: 767px) and (max-width: 991px) {
    .vac-panel {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .vac-panel h3 {
        font-size: 18px;
    }

    .vac-social a {
        width: 48px;
    }
}



/*
   Online Recharge
   ========================================================================== */
.i-chat-arrow-down{
    width:29px;
}

.online-recharge .text-wrap h1 {
    margin-bottom: 5px;
    font-size: 28px;
}

.online-recharge .text-wrap h2 {
    font-size: 18px;
}

.online-recharge-number {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;

    -ms-flex-align: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    align-items: center;

    padding: 10px;
    background-color: #f8f8f8;
}

.online-recharge-number label {
    padding: 0;
    white-space: nowrap;
}

.online-recharge-phone-wrap {
    display: -ms-inline-flexbox;
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: inline-flex;

    -ms-flex-align: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    align-items: center;

    -webkit-flex: 1 0 0px;
    -ms-flex: 1 0 0px;
    flex: 1 0 0px;

    margin-top: 0;
}

.online-recharge-number .prefix {
    padding: 0 20px;
    font-size: 22px;
    color: #bbb;
}

.online-recharge .tg-tabs {
    margin-bottom: 120px;
}

.has-touch .online-recharge .tg-tabs {
    margin-bottom: 0;
}

.tg-tabs .tg-tabs-recharge {
    overflow: visible;
    display: table;
    width: 100%;
    margin: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.tg-tabs .tg-tabs-recharge .tg-item {
    position: relative;
    display: table-cell;
    width: 50%;
    margin: 0;
    padding: 10px;
    background-color: #2f2f2f;
    vertical-align: middle;
}

.tg-tabs .tg-tabs-recharge .tg-item.is-active-tab-item {
    background-color: #e60000;
}

.tg-tabs .tg-tabs-recharge .tg-item.is-active-tab-item::after {
    content: '';
    position: absolute;
    bottom: -13px;
    left: 50%;
    margin-left: -11px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 13px 11px 0 11px; /* 22px x 13px triangle */
    border-color: #e60000 transparent transparent transparent;
}

.tg-tabs .tg-tabs-recharge .tg-item::before {
    border: 0;
}

.tg-tabs .tg-tabs-recharge .tg-head {
    /*position: relative;*/
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    background-color: transparent;
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 14px;
    line-height: 1;
    color: #fff;
}

.tg-tabs .tg-tabs-recharge .tg-head .media-body {
    -moz-hyphens: none;
    -ms-hyphens: none;
    -webkit-hyphens: none;
    hyphens: none;
}

.tg-tabs .tg-tabs-recharge .tg-head:hover,
.tg-tabs .tg-tabs-recharge .tg-head:focus,
.tg-tabs .tg-tabs-recharge .tg-head:active {
    text-decoration: none;
}

.js .fm-set-online-recharge div {
    display: block;
    width: auto;
    margin: 0 -5px;
    border: 0;
    box-shadow: none;
}

.tg-tabs .tg-drop.tg-tabs-recharge .tg-active {
    border: 0;
}

.fm-set-online-recharge .fm-set-col {
    display: block;
    float: left;
    padding: 5px;
}

.fm-set-online-recharge.is-active-set .fm-set-col {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.fm-set-online-recharge .fm-set-col {
    width: 33.3333%;

    /* move the columns out of the viewport */
    -webkittransform: translateX(300%);
    transform: translateX(300%);

    -webkit-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
}

.fm-set-online-recharge-internet .fm-set-col {
    /*width: 50%;*/
    padding-left: 3%;
    padding-right: 3%;

   /*  move the columns out of the viewport
    -webkittransform: translateX(200%);
    transform: translateX(200%);

    -webkit-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;*/
}

/* delay next columns */
.fm-set-online-recharge-voice .fm-set-col-2 {
    -webkit-transition-delay: .15s;
    transition-delay: .15s;
}

.fm-set-online-recharge-voice .fm-set-col-3 {
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
}

.fm-set-online-recharge-internet .fm-set-col-2 {
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
}

.fm-set-online-recharge-internet .fm-set-col-3 {
    -webkit-transition-delay: .2s;
    transition-delay: .2s;
}

.fm-set-online-recharge-internet .fm-set-col-4 {
    -webkit-transition-delay: .3s;
    transition-delay: .3s;
}

.js .fm-set-online-recharge .fm-set-wrap {
    display: block;
    /*float: left;*/
    margin-bottom: 10px;
    border: 0;
}

.js .fm-set-online-recharge-voice {
    padding: 0 4%;
}

/*.js .fm-set-online-recharge-voice .fm-set-wrap {
    width: 33.3333%;
}*/

/*.js .fm-set-online-recharge-internet {
    padding: 0 5%;
}*/

.js .fm-set-online-recharge label {
    position: relative;
    display: block;
    padding: 5px;
    border: 1px solid #d3d3d3;
    font-family: 'VodafoneRegular', Arial, sans-serif;
    text-align: center;
    cursor: pointer;
}

/* Responsive circle - width is equal to the top padding (which is relative to the width) */
.js .fm-set-online-recharge-internet label {
    width: 100%;
    height: 0;
    padding: 100% 0 0; /* fallback */
    padding: calc(100% - 2px) 0 0; /* take into account the 1px + 1px border (both sides, even if circle) */
    border-radius: 50%;
    box-shadow: 0 0 2px rgba(0, 0, 0, .25);
}

.js .fm-set-online-recharge-voice label:last-child {
    border-right: 1px solid #d3d3d3; /* right border is removed in VFGroup CSS */
}

/* Responsive circle - width is equal to the top padding (which is relative to the width) */
.js .fm-set-online-recharge-internet .currency-wrap {
    position: absolute;
    top: 50%;
    right: -12%;
    width: 35%;
    height: 0;
    padding: 35% 0 0;
    border-radius: 50%;
    background-color: #9C2AA0;
    color: #fff;

    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.js .fm-set-online-recharge .checked {
    left: auto;
    border-color: transparent;
    background-color: #0f0f0f;
}

.js .fm-set-online-recharge-internet .checked .currency-wrap {
    border: 0;
}

.fm-set-online-recharge .currency {
    display: block;
    font-size: 12px;
    line-height: 1;
}

/*.js .fm-set-online-recharge-internet .currency {
    font-size: 14px;
    line-height: 1;
}*/

.fm-set-online-recharge .price {
    display: block;
    font-size: 20px;
}

.fm-set-online-recharge .intl {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    font-size: 12px;
}

.js .fm-set-online-recharge-internet .price,
.js .fm-set-online-recharge-internet .currency {
    position: absolute;
    top: 50%;
    left: 50%;

    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.js .fm-set-online-recharge-internet .currency {
    font-size: 13px;
    white-space: nowrap;
}

.online-recharge .tg-display {
    padding: 20px 10px;
}

.online-recharge .cards {
    margin-top: 25px;
    margin-left: 4%;
    font-size: 13px;
    font-style: italic;
}

.online-recharge .cards img {
    margin-left: 10px;
}

.belt.obp.obp-login .cards {
    margin-top: 25px;
    margin-left: 4%;
    font-size: 13px;
    font-style: italic;
}

.online-recharge-benefits {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 15px 0;
    background-color: #f8f8f8;
    box-shadow: 0 -1px 2px rgb(136, 136, 136);
}

.has-touch .online-recharge-benefits {
    position: static;
}

.online-recharge-benefits-details .benefit {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;

    -ms-flex-align: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    align-items: center;
}

.online-recharge-benefits-details .benefit-voice {
    height: 100px;
}

/*.online-recharge-benefits-details .benefit-internet {
    height: 100px;
}*/

.online-recharge-benefits-grid {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;

    -ms-flex-align: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    align-items: center;

    width: 100%;
    /*height: 120px;*/
    margin: 0 -5px;
}

.online-recharge-benefits-details {
    width: 65%;
    padding: 0 5px;
}

.online-recharge-benefits-cta {
    width: 35%;
    padding: 0 5px;
}

/*.online-recharge-benefits .benefit-details {
    padding-right: 10px;
}*/

.online-recharge-benefits .benefit-details p {
    margin-bottom: 0;
}

.online-recharge-benefits .benefit-type {
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 22px;
    font-weight: bold;
    line-height: 1;
    vertical-align: middle;
}

.online-recharge-benefits .media-item {
    text-align: center;
}

.online-recharge-benefits .i-pill span {
    width: 25px;
    height: 25px;
    font-family: "VodafoneRegular", Arial, sans-serif;
    font-size: 30px;
    line-height: 25px;
}

.online-recharge-benefits ul.list {
    margin-bottom: 0;
}

.online-recharge-benefits .btn {
    margin-bottom: 0;
    cursor: pointer;
}

@media only screen and (min-width: 480px) {
    .online-recharge-number {
        padding: 20px 25px;
    }

   /* .js .fm-set-online-recharge  {
        padding: 0 15%;
    }*/

    .online-recharge .fm-error {
        display: inline-block;
        margin-left: 167px;
        bottom: -20px;
    }
}

@media only screen and (max-width: 480px) {
    .online-recharge .fm-error{
        display: inline-block;
        margin-left: 151px;
        bottom: -10px;
    }

    .fm-set-online-recharge .price {
        font-size: 16px;
    }
}

@media only screen and (min-width: 640px) {
    .js .fm-set-online-recharge-internet  {
        padding: 0;
    }

    .fm-set-online-recharge-internet .fm-set-col {
        width: 25%;

        /* move the columns out of the viewport */
        -webkittransform: translateX(400%);
        transform: translateX(400%);
    }
}

@media only screen and (max-width: 640px) {
    .js .fm-set-online-recharge-internet .fm-set-col {
        width: 50%;
        padding-left: 10%;
        padding-right: 10%;
    }
}

@media only screen and (max-width: 766px) {

    .online-recharge-phone-wrap input {
        padding: 5px;
    }

    .online-recharge .i-vfqa {
        width: 50px;
        height: 50px;
        background-size: auto 110%;
    }

    .online-recharge .i-credit-recharge {
        background-position: -2190px -2px;
    }

    .online-recharge .i-internet-packs {
        background-position: -2241px -2px;
    }

    .online-recharge-number,
    .online-recharge .tg-tabs {
        margin-left: -10px;
        margin-right: -10px;
    }

    .online-recharge-benefits {
        padding: 10px 0;
    }

    .online-recharge-benefits .media-item {
        margin-bottom: 5px;
    }

    .online-recharge-benefits .i-pill {
        padding: 0;
    }

    .online-recharge-benefits .i-pill span {
        font-size: 22px;
    }

    .online-recharge-benefits .benefit-valability {
        font-size: 12px;
    }

    .online-recharge-benefits .btn {
        padding: 12px 10px;
    }
}

@media only screen and (min-width: 320px) and (max-width: 350px) {
    .topupsecure {
        width: 100%;
    }
}

@media only screen and (min-width: 767px) {
    .online-recharge .fm-error {
        margin-left: 246px;
        bottom: -37px;
    }
    .online-recharge .text-wrap h1 {
        font-size: 40px;
    }

    .online-recharge .text-wrap h2 {
        font-size: 22px;
    }

    .online-recharge .tg-tabs {
        margin-bottom: 170px;
    }

    .has-touch .online-recharge .tg-tabs {
        margin-bottom: 0;
    }

    .tg-tabs .tg-tabs-recharge .tg-item {
        width: 25%;

        -webkit-transition: width .3s ease-in-out;
        transition: width .3s ease-in-out;
    }

    .tg-tabs .tg-tabs-recharge .tg-item.is-active-tab-item {
        width: 75%;
    }

    .online-recharge-number {
        padding: 35px 45px ;
    }

    .online-recharge-number .prefix {
        padding: 0 10px;
        font-size: 40px;
    }

    .online-recharge .tg-display {
        border-width: 0 1px 1px;
        border-style: solid;
        border-color: #e5e5e5;
    }

    .js .fm-set-online-recharge-voice .fm-set-wrap {
        margin-bottom: 20px;
    }

    .js .fm-set-online-recharge-voice  {
        padding: 0 12%;
    }

    .js .fm-set-online-recharge-voice .fm-set-col {
        padding: 10px;
    }

    .js .fm-set-online-recharge-voice label {
        padding-left: 12%;
        padding-right: 12%;
    }

    .fm-set-online-recharge-voice .price {
        position: relative;
        font-size: 40px;
    }

    .fm-set-online-recharge-voice .currency {
        padding: 5px 15% 5px 0;
        border-right: 1px solid #d3d3d3;
        font-size: 16px;
    }

    .js .fm-set-online-recharge-internet  {
        padding: 0 5%;
    }

    .tg-tabs .tg-tabs-recharge .tg-head {
        font-size: 22px;
    }

    .online-recharge-benefits-details .benefit-voice {
        height: 80px;
    }

    .online-recharge-benefits-grid {
        height: 80px;
    }

    .online-recharge-benefits-details {
        width: 75%;
    }

    .online-recharge-benefits-cta {
        width: 25%;
    }

    .online-recharge-benefits .benefit .grid {
        margin-left: -10px;
    }

    .online-recharge-benefits .benefit .col {
        padding-left: 10px;
    }

    .online-recharge-benefits .benefit-details {
        padding-right: 0;
    }

    .online-recharge-benefits .benefit-type {
        font-size: 42px;
        font-weight: normal;
    }

    .online-recharge-benefits .benefit-valability {
        white-space: nowrap;
    }

    .online-recharge-benefits .btn {
        width: 100%;
    }
}

@media only screen and (min-width: 840px) {
    .js .fm-set-online-recharge-internet .fm-set-col {
        padding-left: 3%;
        padding-right: 3%;
    }
}

@media only screen and (min-width: 992px) {
    .js .fm-set-online-recharge-internet  {
        padding: 0 8%;
    }
}

/*@media only screen and (max-width: 783px) {
    .input-group{
        width:202px;
    }
}*/

/* Fi-Tech Project */

.text-center {
    text-align: center;
}

.text-contactme {
    font-size: 90%;
}

.label-left {
    text-align: initial;
}

.fi-tech-form label {
    text-align: left;
}

@media only screen and (max-width: 766px) {
    .fi-tech-video-wrapper {
    }
}

@media only screen and (min-width: 767px) {
    .checkbox-container {
        width: 400px;
        max-width: 600px;
    }
    .fi-tech-data {
        width: 400px;
        max-width: 600px;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }
    .fi-tech-data input {
        width: 400px;
        max-width: 600px;
    }

    .fi-tech-video-container {
        position: relative;
    }

    .fi-tech-video-wrapper {
        position: absolute;
        left: 50%;
        top: 50%;
        width: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
}

/* END Fi-Tech Project */

/* Store Locations */
.search-store-location .fm-select {
    width: 100%;
}

.vertical-align-bottom {
    height: 150px;
    display: table-cell;
    vertical-align: bottom;
}

.store-keys {
    border: none;
}

.storeMapKeys {
    margin-top: 50px;
    margin-bottom: 50px;
    clear: both;
}

.vodafonestores {
    display: none;
}

.vodafoneStoresLabel {
    cursor: pointer;
    float: left;
    margin-right: 10px;
    margin-left:10px;
    font-weight: normal;
}

.vodafoneStoresPleaseChoose {
    font: 700 20px/1.176 "Arial", sans-serif;
}

.storeTimings .days,
.ramadanTimes .days,
.eidTimes .days {
    font-weight: bold;
}

.eidTimes,
.storeAddress .full {
    margin-top: 15px;
}

.store-locator-bubble .image img {
    width:25px;
}
.store-locator-bubble .image {
    float: left;
    margin-left: -5px;
    margin-right: 5px;
    width: 25px;
}
.store-locator-bubble .bubblecontent {
    float: left;
}

.gm-style img {
    max-width: none;
}

@media only screen and (max-width: 768px) {
    #store-map-legend {
        padding: 15px;
    }
}

@media only screen and (max-width: 767px) {
    #store-map-legend table td {
        float: left;
        padding: 10px;
    }
    .vodafoneStoresLabel {
        margin-left: 0px;
    }

    #nearestStores {
        padding: 13px;
    }
    #store-map-legend {
        margin-top: 10px;
    }
}

@media only screen and (min-width: 767px) {
    #nearestStores {
        min-width: 250px;
    }
}
/* END Store Locations */

/* Press Release */

.releaseyears{
    margin-bottom: 30px;
}

.press-years .fm-select{
    width: 100%;
}

@media only screen and (max-width: 768px) {
    .paginator a.p-page {
        display: none;
    }

    .paginator a.p-next {
        text-indent: -9999em;
        display: inline-block;
        background: url("/vf_rwd/assets/local/css/img/icon/pag-arrow-r.png") no-repeat scroll 14px !important;
        border: 0px !important;
        margin-left: 15px !important;
    }

    .paginator a.p-previous {
        text-indent: -9999em;
        display: inline-block;
        background: url("/vf_rwd/assets/local/css/img/icon/pag-arrow-l.png") no-repeat scroll 22px !important;
        border: 0px !important;
        margin-right: 0px !important;
    }

    .paginator span.p-previous {
        text-indent: -9999em;
        display: inline-block;
        background: url("/vf_rwd/assets/local/css/img/icon/pag-arrow-l.png") no-repeat scroll 22px !important;
        border: 0px !important;
        margin-right: 0px !important;
    }

    .paginator span.p-next {
        text-indent: -9999em;
        display: inline-block;
        background: url("/vf_rwd/assets/local/css/img/icon/pag-arrow-r.png") no-repeat scroll 14px !important;
        border: 0px !important;
        margin-left: 15px !important;
    }
}

.nav-aboutus .nav-menu a{
    font-size: 15px;
    padding-bottom: 16px;
    top: 4px;
}

@media only screen and (max-width: 823px) and (min-width: 792px){
    .nav-aboutus .nav-menu a{
        font-size: 14px;
    }
}

@media only screen and (max-width: 792px) and (min-width: 767px){
    .nav-aboutus .nav-menu a{
        font-size: 10px;
        padding-bottom: 22px;
        top: 6px;
    }
}

/* END Press Release */

/* Postpaid and Red Plans */
a.red-text {
    color: #e60000;
    text-decoration: none;
}

.tg-tabs .tg-tabs-red-plans {
    overflow: visible;
    width: 100%;
    margin: 0;
    border: 1px solid #cccccc;
    border-radius: 0;
    box-shadow: none;
}

.tg-tabs .tg-tabs-red-plans .tg-item {
    margin: 0;
}

.tg-tabs .tg-tabs-red-plans .tg-item::before {
    border-left: 1px solid #cccccc;
}

.tg-tabs .tg-tabs-red-plans .tg-head {
    position: relative;
    display: block;
    margin: 0;
    padding: 20px;
    background-color: #fff;
}

.tg-tabs .tg-tabs-red-plans .tg-head:hover,
.tg-tabs .tg-tabs-red-plans .tg-head:focus,
.tg-tabs .tg-tabs-red-plans .tg-head:active {
    text-decoration: none;
}

.tg-tabs .tg-tabs-red-plans .tg-active {
    background-color: #e60000;
    color: #fff;
}

.tg-tabs .tg-tabs-red-plans .media-body {
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 14px;
    line-height: 1;
}

.postpaid-plans .media-item {
    width: 53px;
}

.postpaid-plans .tg-display {
    padding: 30px;
    border-width: 1px;
    border-style: solid;
    border-color: #e5e5e5;
    margin-top: 10px;
}

.postpaid-plans .fixed-height {
    height: 150px;
}
/*
.postpaid-plans .fixed-height.customheight-supersaver-india {
    height: 202px !important;
}

.carousel-business-postpaid h2.custom-supersaver-h {
    height: 100px !important;
}*/

.postpaid-plans .container-alt {
    height: 350px;
}

.carousel-business-postpaid h2 {
    margin-top: 10px;
    margin-bottom: 5px;
}

.benefit-inactive {
    opacity: .2;
}

.postpaid-plans .carousel-business-postpaid li {
    padding: 1px;
}

.box-extras {
    padding: 20px;
    height: 300px;
}

.box-list {
    list-style-type: disc;
    padding-left: 20px;
}

.postpaid-plans .list-lined {
    margin-bottom: 0px;
}

.postpaid-plans .list-lined li {
    min-height: 65px;
    display: flex;
    align-items: center;
}

.separator {
    height: 0px;
    border-top: 1px solid #cccccc;
}

.postpaid-plans .tg-flyout {
    display: inline-block;
    position: static;
}

.postpaid-plans .list-lined {
    position: relative;
}

.postpaid-plans .tg-flyout .tg-display{
    position: absolute;
    width: 100%;
    max-width: 300px;
    left: 10px;
    z-index: 10;
    margin-top: 15px;
    background-color: white;
}

.postpaid-plans .tg-flyout .tg-display:after {
    border-bottom-color: white;
}

.text-vodafone-regular {
    font-family: "VodafoneLight", "VodafoneRegular", Arial, sans-serif;
}

@media only screen and (min-width: 767px) {
    .border-left {
        border-left: 1px solid #cccccc;
    }
    .border-right {
        border-right: 1px solid #cccccc;
    }
    .tg-tabs .tg-tabs-red-plans .tg-item {
        width: 16%;
    }
    .tg-tabs .tg-tabs-red-plans .tg-active::after {
        content: '';
        position: absolute;
        bottom: -10px;
        left: 50%;
        margin-left: -11px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10px 9px 0 9px; /* 18px x 10px triangle */
        border-color: #e60000 transparent transparent transparent;
    }
    .postpaid-plans h1 {
        margin-left: 0px;
    }
}

@media only screen and (max-width: 766px) {
    .moreBenefits {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .postpaid-plans .fixed-height {
        height: 170px;
    }
    .tg-tabs .tg-tabs-red-plans .tg-head {
        min-height: 76px;
    }
    .box-extras {
        height: 360px;
    }
}
/*
@media only screen and (max-width: 800px) {
    .carousel-business-postpaid h2.custom-supersaver-h {
    height: 135px !important;
    }
}*/


/* END Postpaid and Red Plans */

/* Plan suggestion */
.vertical-align-content {
    display: table;
}

.vertical-align-item {
    display: table-cell;
    vertical-align: middle;
}

.boxpad {
    text-align: center;
    padding-left: 30px;
}

.data-offer {
    display: block;
    color: #9834A4;
    font-size: 30px;
    font-weight: bold;
    margin: 20px 0px;
    line-height: 1;
}

.boxradio-toolbar label {
    cursor: pointer;
    height: 250px;
    width: 100%;
    border-radius: 5px;
    padding: 0px 30px;
    overflow: hidden;
}

.boxradio-toolbar input[type="radio"]:checked + label {
    border: 3px solid #9834A4;
    border-radius: 5px;
}

.boxradio-toolbar {
    font-family: Arial, sans-serif;
}

.boxradio-toolbar .tg-accord .tg-active,
.boxradio-toolbar .tg-accord .tg-body {
    background-color: white;
}

@media only screen and (min-width: 766px) {
    #btnshowmob {
        display: none;
    }

    .boxradio-toolbar label {
        background-color: #EFEFEF;
        border: 1px solid #D8D8D8;
    }

    .boxradio-toolbar .tg-accord .tg-head {
        display: none;
    }

    .flip3d .front {
        position: absolute;
        -webkit-transform: perspective(600px) rotateY(0deg);
        transform: perspective(600px) rotateY(0deg);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        transition: -webkit-transform .5s linear 0s;
        transition: transform .5s linear 0s;
        left: 40px;
        top: 100px;
        padding-right: 40px;
    }

    .flip3d .back {
        position: absolute;
        -webkit-transform: perspective(600px) rotateY(180deg);
        transform: perspective(600px) rotateY(180deg);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        transition: -webkit-transform .5s linear 0s;
        transition: transform .5s linear 0s;
        left: 40px;
        top: 70px;
        padding-right: 35px;
    }

    .flip3d:hover .front {
        -webkit-transform: perspective(600px) rotateY(-180deg);
        transform: perspective(600px) rotateY(-180deg);
    }

    .flip3d:hover .back {
        -webkit-transform: perspective(600px) rotateY(0deg);
        transform: perspective(600px) rotateY(0deg);
    }
}

@media only screen and (max-width: 767px) {
    /*.boxradio-toolbar .back {
        display: none;
    }*/

    #btnshowdesk {
        display: none;
    }

    .boxpad {
        padding-left: 15px;
        padding-right: 15px;
        padding-bottom: 10px;
    }

    .boxradio-toolbar label {
        padding: 0px 20px;
    }
}
/* END Plan suggestion */

/*API for the Trade in tool*/

.trade-up .stepper-shopping-wrapper .step {
    color:#B1BABF;
}

.trade-up .stepper-shopping-wrapper p {
    font-size: 25px;
    font-weight: normal;
    font-family: VodafoneRegular;
    font-size: 30px;
}
.trade-up .stepper-shopping-wrapper .stepper-shopping {
    width: auto;
}

.trade-up .step-inner {
    padding: 20px !important;
}

.trade-up-filters,
.trade-up-result,
.trade-up-conditions {
    overflow: hidden;
}

.trade-up-filters .w-33 h3 {
    padding-top: 100px;
    padding-left: 60px;
    font-weight: normal;
    font-family: VodafoneRegular;
}
.trade-up-conditions .w-33 h3 {
    padding-top: 100px;
    padding-left: 60px;
    font-weight: normal;
    font-family: VodafoneRegular;
}

.trade-up-result .w-50 h3 {
    display: none;
    font-weight: normal;
    font-family: VodafoneRegular;
}

.trade-up-filters .w-66,
#question-area .w-66 {
    padding: 39px;
}

.trade-up-filters .fm-inline,
.trade-up-result .w-50 .grid,
.trade-up-conditions form {
    border-left: 1px solid #e3e3e3;
}

.trade-up-filters .field.fm-select {
    width: 100%;
}

.trade-up-filters label {
    width: 100px;
}

.trade-up-filters .fm-required.fm-select {
    width: 350px;
}

.trade-up-conditions .fm-radio .fm-data {
    display: inline-block;
}

.trade-up-conditions .fm-radio .fm-data + .fm-data {
    padding-left: 10px;
}

.trade-up-conditions form {
    padding-left: 50px;
}

.trade-up-result .tradeSL {
    padding: 30px;
}

.trade-up-result .location-image img {
    padding-left: 60px;
}

.trade-up-result .grid {
    padding: 30px;
}

.trade-up-result .result-info {
    padding: 40px;
}

.trade-up-result .w-50 {
    font-size: 16px;
}

.trade-up-result .model {
    font-family: VodafoneRegular;
}

.trade-up-result .cf a {
    padding: 10px;
    text-decoration: underline;
}

.trade-up-conditions,
.trade-up-result {
    display:none;
}

.trade-up .completed {
    color: red !important;
}

.trade-up .avert .device-price {
    font-family: VodafoneRegular;
}

.trade-up .container {
    background-color: #F4F4F4;
}

.trade-up .trade-up-result #request-id {
    display: none;
}

.trade-up .trade-up-result .result-price-p {
        font-size: 14px;
}

.trade-up .utility-btns {
    text-align: center;
}

.trade-up .utility-btns #email-btn {
    display: inline-block;
}

.trade-up #trade-up-email label {
    width: auto;
}

.trade-up #trade-up-email .fm-submit {
    padding-left: 0;
}

.trade-up #trade-up-email .fm-data {
    display: inline-block;
}

.trade-up #filter-area button,
.trade-up #question-area button,
.trade-up #result-area button {
    margin-right: 1px;
    margin-left: 1px;
}

@media only screen and (min-width: 767px) and (max-width: 843px) {
    .trade-up #device-select label {
        width: auto;
    }
}

@media only screen and (max-width: 863px) {
    .trade-up-filters .fm-inline,
    .trade-up-result .w-50 .grid,
    .trade-up-conditions form {
    border-left: none;
    }

    .trade-up-result .tradeSL {
    padding-top: 30px;
    padding-left: 0;
    padding-right: 0;
    }

    .trade-up-result .location-image img {
    padding-left: 0;
    }
}

@media only screen and (max-width: 766px) {
    .trade-up-filters .w-33 h3,
    .trade-up-conditions .w-33 h3,
    .trade-up-result .w-50 h3 {
    padding-top: 0;
    padding-left: 0;
    font-size: 25px;
    }

    .trade-up-filters .fm-inline,
    .trade-up-result .w-50 .grid,
    .trade-up-conditions form {
    border-left: none;
    }

    .trade-up-filters .fm-required.fm-select {
    width: 100%;
    }

    .trade-up-conditions form {
    padding-left: 0;
    }

    .trade-up-result .w-50 h3 {
        display: initial;
    }

    .trade-up-result .result-info {
    padding: 0;
    }

    .trade-up .stepper-shopping-wrapper .i-vfqa-stepper {
    background: none;
    }

    .trade-up .stepper-shopping-wrapper .step-inner p {
    font-size: 100%;
    line-height: 1;
    margin-bottom: 0;
    }

    .trade-up .active,
    .trade-up .completed {
    color: #9437A1 !important;
    }

    .trade-up-result .grid {
    padding: 0;
    }

    .trade-up-result .location-image img {
    padding-left: 0;
    }

    .trade-up button {
        width: auto;
    }

    .trade-up .location-image {
        float: left;
    }

    .trade-up .location-image img {
        padding: 20px;
    }

    .trade-up .location-image {
        float: right;
    }
}

/*END API for the Trade in tool*/
/* Online directory assistant */

@media only screen and (min-width: 767px) {
    .user-search-box {
       width: 350px;
    }
}



/*
   4G+
   ========================================================================== */

.content-4gplus {
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 16px;
    color: #424242;
}

.content-4gplus h2,
.content-4gplus p  {
    line-height: 1;
}

.content-4gplus h2 {
    margin-bottom: 15px;
    font-size: 26px;
}

.content-4gplus .btn-flat {
    width: auto;
    margin-top: 20px;
    padding: 20px 45px;
    font-family: 'VodafoneLight', Arial, sans-serif;
    font-weight: normal;
}

.intro-4gplus {
    position: relative;
    padding-bottom: 135%;
    background: transparent url('../../../../../css/images/4g/bgs/4gplus-overview-intro-bg-768px.jpg') no-repeat center;
    background-size: cover;
}

.intro-4gplus-cta {
    position: absolute;
    top: 55%;
    left: 50%;
    width: 90%;

    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.about-4gplus {
    position: relative;
    padding: 50px 0;
    background-color: #ebebeb;
}

.about-4gplus h2 {
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
}

.dots-4gplus {
    position: absolute;
    width: 45%;
    padding-bottom: 20%;
    background: transparent url('../../../../../css/images/4g/bgs/4gplus-dots-bg.png') no-repeat center;
    background-size: cover;
}

.dots-4gplus-default {
    top: 0;
    right: 0;
}

.dots-4gplus-reversed {
    bottom: 0;
    left: 0;

    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
}

.cell-towers {
    position: relative;
    margin: 10% 0;
    padding-bottom: 60%;
    background: transparent url('../../../../../css/images/4g/cell-towers.png') no-repeat center;
    background-size: auto 100%;
}

.cell-towers-signal-bar {
    background: transparent url("../../../../../css/images/4g/cell-tower-signal-bar-icon.png") no-repeat scroll center;
    background-size: auto 100%;
    position: absolute;
    width: 11%;
    opacity: 0;

    -webkit-animation-name: fadeInOut;
    animation-name: fadeInOut;

    -webkit-animation-duration: 1s;
    animation-duration: 1s;

    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.cell-towers-signal-bar-sm {
    top: -2%;
    left: 40%;
    padding-bottom: 8%;

    -webkit-animation-delay: 0;
    animation-delay: 0;
}

.cell-towers-signal-bar-md {
    top: -9%;
    left: 35%;
    padding-bottom: 18%;

    -webkit-animation-delay: 0;
    animation-delay: .25s;
}

.cell-towers-signal-bar-lg {
    top: -15%;
    left: 29%;
    padding-bottom: 28%;

    -webkit-animation-delay: .5s;
    animation-delay: .5s;
}

.cell-towers-signal-group-reversed .cell-towers-signal-bar {
    -webkit-transform: scale(-1);
    transform: scale(-1);
}

.cell-towers-signal-group-reversed .cell-towers-signal-bar-sm {
    left: 52%;
}

.cell-towers-signal-group-reversed .cell-towers-signal-bar-md {
    left: 57%;
}

.cell-towers-signal-group-reversed .cell-towers-signal-bar-lg {
    left: 63%;
}

.animation-container-about-4gplus {
    padding: 0 5%;
}

.about-4gplus .pin {
    position: relative;
    display: inline-block;
    width: 49%;
    padding-bottom: 58%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 100%;
}

.about-4gplus .white-pin {
    background-image: url('../../../../../css/images/4g/white-pin.png');
}

.about-4gplus .red-pin {
    background-image: url('../../../../../css/images/4g/red-pin.png');
}

.about-4gplus .pin-text {
    position: absolute;
    top: 9%;
    width: 60%;
    left: 50%;
    color: #fff;
    font-size: 1em;
    line-height: 1;
    text-align: center;
    transform: translateX(-50%);
}

.about-4gplus .red-pin .pin-text {
    color: inherit;
}

.about-4gplus .timer {
    display: block;
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
    font-size: 2em;
    line-height: 1;
}

.cta-4gplus {
    position: relative;
    background: transparent url("../../../../../css/images/4g/bgs/4gplus-overview-cta-bg-768px.jpg") no-repeat scroll center;
    background-size: auto 100%;
    padding-bottom: 195%;
}

.cta-img-4gplus {
    position: absolute;
    width: 70%;
    top: 50%;
    left: 50%;

    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.benefits-coverage-4gplus {
    position: relative;
    background: transparent url("../../../../../css/images/4g/bgs/4gplus-overview-benefits-bg.jpg") no-repeat scroll center;
    background-size: auto 100%;
    padding-bottom: 85%;
}

.benefits-coverage-inner-4gplus {
    position: absolute;
    top: 50%;
    left: 50%;
    padding: 0 5%;

    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.benefits-coverage-4gplus h2 {
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
    color: #fff;
}

.benefits-coverage-circle {
    position: relative;
    display: inline-block;
    width: 50%;
    margin-left: 15px;
    padding-bottom: 50%;
    border-radius: 50%;
    background-color: #4b4c4e;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .5);
}

.benefits-coverage-circle-inner {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 4%;
    color: #fff;
    text-align: center;
}

.benefits-coverage-circle + .benefits-coverage-circle {
    margin-left: -30px;
}

.benefits-coverage-circle img {
    width: 50%;
}

.benefits-coverage-signal-icon {
    display: block;
    width: 35%;
    height: 18%;
    margin: 0 auto;
    background: transparent url("../../../../../css/images/4g/signal-icon.png") no-repeat scroll center;
    background-size: 100% auto;
}

.benefits-coverage-circle .timer-wrap {
    display: block;
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
    font-size: 14vw;
    line-height: .75;
}

.benefits-coverage-circle p {
    margin: 0;
    font-size: 4vw;
}

.benefits-capacity-4gplus {
    position: relative;
    background-color: #4b4c4e;
    padding-bottom: 70%;
}

.benefits-capacity-inner-4gplus {
    position: absolute;
    top: 50%;
    left: 50%;

    -webkit-transform: translate(-50%, -70%);
    transform: translate(-50%, -70%);
}

.benefits-capacity-circle {
    position: relative;
    left: 50%;
    width: 40%;
    padding-bottom: 40%;
    border-radius: 50%;
    background-color: #e60000;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .5);
    color: #fff;

    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.benefits-capacity-circle-inner {
    position: absolute;
    width: 100%;
    height: 100%;
}

.benefits-capacity-circle .icon-3g,
.benefits-capacity-circle .icon-4g,
.benefits-capacity-circle .icon-4gplus {
    position: absolute;
    text-align: center;
}

.benefits-capacity-circle .icon-3g,
.benefits-capacity-circle .icon-4g {
    width: 72%;
}

.benefits-capacity-circle .icon-4gplus {
    position: absolute;
    width: 100%;
    text-align: center;
}

.icon-3g {
    top: 50%;
    left: -62%;

    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.icon-4g {
    bottom: -44%;
    left: 50%;

    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}

.icon-4gplus {
    top: 50%;
    right: -85%;

    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.benefits-capacity-circle-content {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 10%;
    text-align: center;
}

.benefits-capacity-circle-content .timer-wrap {
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
    font-size: 22vw;
    line-height: .75;
}

.benefits-capacity-circle-content p {
    margin: 0;
    font-size: 5.75vw;
    line-height: 1;
}

.coverage-map-4gplus {
    position: relative;
    background: transparent url("../../../../../css/images/4g/bgs/4gplus-overview-coverage-bg.jpg") no-repeat scroll center;
    background-size: auto 100%;
    padding-bottom: 210%;
    color: #fff;
}

.coverage-map-inner-4gplus {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    padding: 10% 5%;

    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.coverage-map-4gplus h2 {
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
}

.coverage-map-4gplus h3 {
    font-size: 1.25em;
    font-family: VodafoneRegular, Arial, sans-serif;
}

.qatar-map-4gplus {
    position: relative;
    width: 72%;
    margin: 40px auto;
    padding-bottom: 140%;
    background: transparent url("../../../../../css/images/4g/4gplus-coverage-map.png") no-repeat scroll center;
    background-size: auto 100%;
}

.coverage {
    position: absolute;
    margin: 0 auto;
    font-size: 100%;
    width: 70%;
    padding-bottom: 70%;
}

.coverage__location {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 10;
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
    color: #fff;
    text-shadow: 0 2px 4px rgba(0, 0, 0, .75);

    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.coverage__area {
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    background-color: rgba(230, 0, 0, .25);

    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);

    opacity: 0;

    -webkit-animation-name: fadeInOut;
    animation-name: fadeInOut;

    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;

    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.coverage__area--four {
    width: 15%;
    height: 15%;

    -webkit-animation-delay: 0s;
    animation-delay: 0s;
}

.coverage__area--three {
    width: 35%;
    height: 35%;

    -webkit-animation-delay: .25s;
    animation-delay: .25s;
}

.coverage__area--two {
    width: 55%;
    height: 55%;

    -webkit-animation-delay: .5s;
    animation-delay: .5s;
}

.coverage__area--one {
    width: 75%;
    height: 75%;

    -webkit-animation-delay: .75s;
    animation-delay: .75s;
}

.coverage--fuwayrit {
    top: -3%;
    left: 24%;
}

.coverage--shahaniah {
    top: 27%;
    left: 11%;
}

.coverage--doha {
    top: 34%;
    left: 39%;
}

.coverage--al-wakrah {
    top: 48%;
    left: 52%;
}

.coverage--sealine {
    top: 73%;
    left: 24%;
}

.speeds-4gplus {
    position: relative;
    padding: 40px 0;
    background-color: #eaeaea;
}

.speeds-4gplus h2 {
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
    color: #e60000;
}

.handset {
    margin: 40px 0;
    padding: 0 20%;
}

.handset__img {
    position: relative;
    text-align: center;
}

.handset--standard .handset__img {
    font-size: 1.25em;
}

.handset--4gplus .handset__img {
    font-size: 1.5em;
}

.handset--next-gen .handset__img {
    font-size: 1.75em;
}

.handset__speed {
    position: absolute;
    top: 50%;
    left: 50%;
    color: #fff;
    text-align: center;

    text-shadow: 10px 2px 5px rgba(0, 0, 0, 0.5);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.handset__speed--size {
    display: block;
    margin-bottom: -5px;
    font-size: 2em;
    font-weight: 700;
}

.handset__speed--value {
    font-size: 1.2em;
}

.handset__models {
    margin-top: 10px;
    font-family: "Signika Negative". Arial, sans-serif;
    font-weight:700;
    color: #e60000;
    text-align: center;
}





/*.network-coverage-4gplus {
    padding-top: 70px;
    padding-bottom: 70px;
    background: transparent url('../../../../../css/images/4g/bgs/4G-plus-network-coverage-bg.jpg') no-repeat center;
    background-size: cover;
    color: #fff;
}

.network-coverage-4gplus .percentage {
    position: relative;
    margin-bottom: 50px;
    text-align: center;
}

.network-coverage-4gplus h2 {
    margin-bottom: 30px;
    font-family: 'SignikaNegativeB', Arial, sans-serif;
    font-size: 18px;
}

.network-coverage-4gplus .network-percentage {
    position: absolute;
    top: 50%;
    left: 50%;
    font-family: 'SignikaNegativeB', Arial, sans-serif;
    font-size: 80px;
    color: #fff;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.coverage-map-4gplus {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.coverage-map-4gplus .pin {
    position: absolute;
    z-index: 10;
}

.coverage-map-4gplus .pin1 {
    top: 8%;
    left: 45.5%;
    max-width: 10%;
}

.coverage-map-4gplus .pin2 {
    left: 70.5%;
    top: 30%;
    max-width: 7%;
}

.coverage-map-4gplus .pin3 {
    top: 13%;
    left: 15%;
    max-width: 10%;
}

.coverage-map-4gplus .pin4 {
    left: 32%;
    top: 22.5%;
    max-width: 5%;
}

.coverage-map-4gplus .pin5 {
    left: 61.7%;
    top: 13.5%;
    max-width: 5%;
}

.coverage-map-4gplus .pin6 {
    left: 58%;
    top: 28.4%;
    max-width: 4%;
}

/*.coverage-map-4gplus .pin7 {
    left: 62%;
    top: 35%;
    max-width: 6%;
}*/

.coverage-map-4gplus-wrapper {
    position: relative;
    height: 360px;
    background-position: center center;
    background-size: auto 100%;
    background-image: url('../../../../../css/images/4g/bgs/4G-plus-map.jpg');
    background-repeat: no-repeat;
}

.coverage-map-4gplus-wrapper .coverage-info {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 95%;
    max-width: 700px;
    padding: 5px 10px;
    background-color: rgba(255, 255, 255, .75);
    z-index: 20;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
}

.coverage-map-4gplus-wrapper .coverage-info h2 {
    margin-bottom: 15px;
}

.bottom-menu-4gplus {
    padding: 20px 0;
    background-color: #e60000;
}

.bottom-menu-4gplus li {
    display: inline-block;
}

.bottom-menu-4gplus a {
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
    font-size: 16px;
    color: #fff;
    line-height: 1;
    text-decoration: underline;
}

.bottom-menu-4gplus li + li a {
    margin-left: 10px;
    padding-left: 10px;
    border-left: 1px solid #fff;
}

.compatible-devices-4gplus .col {
    text-align: center;
}

.compatible-devices-4gplus img {
    margin-bottom: 30px;
}

.sequence-coverage-4gplus {
    margin-bottom: 50px;
}

.sequence-coverage-4gplus .sequence-canvas {
    position: relative;
    height: 0;
    padding-bottom: 73%;
}

.sequence-coverage-4gplus .sequence-canvas img {
    box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.2);
}

.sequence-coverage-4gplus .sequence-caption {
    position: absolute;
    bottom: -2%;
    width: 100%;
    padding: 10px;
    background-color: #E60000;
    text-align: center;
    color: #fff;
}

.sequence-coverage-4gplus .sequence-caption p {
    margin-bottom: 0;
    font-family: VodafoneRegular, Arial, sans-serif;
    font-size: 20px;
}

.sequence-next-4gplus,
.sequence-prev-4gplus {
   display: block;
   width: 40px;
   height: 90px;
   background-image: url('../../../../../css/images/4g/4g-sprite.png');
   background-repeat: no-repeat;
}

.sequence-next-4gplus {
   background-position: -36px -84px;
}

.sequence-next-4gplus:hover {
   background-position: -36px 4px;
   text-decoration: none;
}

.sequence-prev-4gplus {
   background-position: 0 -84px;
}

.sequence-prev-4gplus:hover {
   background-position: 0 4px;
   text-decoration: none;
}

.coverage-thumbs-4gplus {
    position: relative;
    bottom: 0;
    z-index: 10;
    width: 100%;
    margin-top: 50px;
}

.coverage-thumbs-4gplus .coverage-pagination-wrapper {
    overflow: hidden;
    width: 100%;
}

.coverage-thumbs-4gplus .coverage-pagination {
    margin: 0;
}

.coverage-thumbs-4gplus .coverage-pagination > li {
    padding: 0 5px;
    text-align: center;
}

.coverage-thumbs-4gplus .coverage-pagination span {
    display: inline-block;
    margin-top: 15px;
    font-family: VodafoneRegular, Arial, sans-serif;
    font-size: 16px;
}

.coverage-thumbs-4gplus .coverage-pagination .current span {
    font-weight: bold;
}

.coverage-thumbs-4gplus .coverage-pagination img {
    opacity: .5;
    cursor: pointer;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
    margin: 0 auto 0;
    border: 4px solid transparent;
}

.coverage-thumbs-4gplus .coverage-pagination img:hover {
    opacity: .75;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.coverage-thumbs-4gplus .coverage-pagination .current img {
    opacity: 1;
    border: 4px solid #E60000;
}

.sequence-next-4gplus,
.sequence-prev-4gplus {
    position: absolute;
    top: 50%;
    margin-top: -63px; /* required for vertical centering */
    z-index: 100;
}

.sequence-next-4gplus {
    right: 0;
}

.sequence-prev-4gplus {
    left: 0;
}

.sequence-device-gallery .sequence-canvas {
    position: relative;
    /* dynamic height */
    height: 0;
    padding-bottom: 50%;

    /* only cause the left and opacity properties to transition */
    -webkit-transition-property: left, opacity;
    -moz-transition-property: left, opacity;
    -ms-transition-property: left, opacity;
    -o-transition-property: left, opacity;
    transition-property: left, opacity;
}

.devices-content-4gplus .device-img {
    opacity: 0;
    left: -15%;
    margin: 0 45px; /* make room for the nav arrows */
    text-align: center;
}

.devices-content-4gplus .animate-in .device-img {
    left: 0;
    opacity: 1;
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -ms-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;

    -webkit-transition-delay: 0.5s;
    -moz-transition-delay: 0.5s;
    -ms-transition-delay: 0.5s;
    -o-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.devices-content-4gplus .animate-out .device-img {
    left: 0;
    opacity: 0;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;

    -webkit-transition-delay: 0.5s;
    -moz-transition-delay: 0.5s;
    -ms-transition-delay: 0.5s;
    -o-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.devices-content-4gplus .device-info {
    opacity: 0;
    bottom: 44%;
    left: 25%;
    margin-bottom: 30px;
}

.devices-content-4gplus .animate-in .device-info {
    left: 40%;
    opacity: 1;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.devices-content-4gplus .animate-out .device-info {
    left: 55%;
    opacity: 0;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.sequence-device-gallery .device-description {
    margin: 3% 0 4%;
    font-size: 20px;
}

.devices-content-4gplus .btn-flat {
    opacity: 0;
    top: 50%;
    left: 50%;
}

.devices-content-4gplus .animate-in .btn-flat {
    left: 40%;
    opacity: 1;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.devices-content-4gplus .animate-out .btn-flat {
    left: 25%;
    opacity: 0;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.devices-sequence-controls {
    top: 50%;
    right: 0;
    margin-top: -90px; /* the whole container is 180px in height (90px each arrow) */
    z-index: 99;
}

.sequence-devices-mobile .sequence-controls {
    top: 50%;
    right: 0;
    width: 100%;
    margin-top: -45px;
    z-index: 99;
}

.sequence-devices-mobile .sequence-next-4gplus,
.sequence-devices-mobile .sequence-prev-4gplus {
    margin-top: 0;
}

.devices-thumbs {
    position: relative;
}

.devices-pagination-wrapper {
    overflow: hidden;
    width: 100%;
    text-align: center;
}

.devices-pagination {
    display: inline-block;
    margin-right: auto;
    margin-left: auto;

    -webkit-transition: transform .3s;
    transition: transform .3s;
}

.devices-pagination-img {
    opacity: .5;
    cursor: pointer;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.devices-pagination-img:hover {
    opacity: .75;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.devices-pagination .current .devices-pagination-img {
    opacity: 1;
}

.devices-thumbs-next,
.devices-thumbs-prev {
    position: absolute;
    top: 50%;
    z-index: 100;
    margin-top: -45px; /* required for vertical centering */
}

.sequence-devices-mobile {
    height: 0;
    padding-bottom: 145%;
}

.devices-mobile-slide {
    position: relative;
    top: 50%;
    width: 100%;
    text-align: center;

    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.video-slide-wrapper {
    top: 0;
    left: 100%;
    width: 100%;
}

.devices-content-4gplus .animate-in .video-slide-wrapper {
    left: 0;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.devices-content-4gplus .animate-out .video-slide-wrapper {
    left: -100%;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.sequence-video-gallery {
    height: 0;
    padding-bottom: 26%;
}

.sequence-video-mobile {
    height: 0;
    padding-bottom: 50%;
}

.sequence-video-mobile .video-sequence-canvas > li {
    overflow: hidden;
    width: calc(100% - 80px); /* take out the margins */
    margin: 0 40px;
}

.sequence-video-gallery .video-wrapper {
    position: relative;
    display: block;
    float: left;
    width: 50%;
    padding: 0 2%;
}

.sequence-video-gallery.one-video .video-wrapper {
    display: inline-block;
    float: none;
}

@media only screen and (min-width: 480px) {
    .sequence-devices-mobile {
        height: 630px;
        padding-bottom: 0;
    }

    /* START Network Campaign Update */

    .animation-container-about-4gplus {
        padding: 0 20%;
    }

    .coverage-map-4gplus {
        padding-bottom: 170%;
    }

    .qatar-map-4gplus {
        width: 67%;
        padding-bottom: 122%;
    }

    /* END Network Campaign Update */
}

@media only screen and (max-width: 766px) {
    .support-content-4gplus .sequence-next-4gplus,
    .support-content-4gplus .sequence-prev-4gplus {
        background-color: rgba(0, 0, 0, .25);
    }

    .support-content-4gplus .sequence-next-4gplus {
        background-position: -109px 4px;
    }

    .support-content-4gplus .sequence-prev-4gplus {
        background-position: -73px 4px;
    }
}

@media only screen and (min-width: 660px) {
    /* START Network Campaign Update */

    .animation-container-about-4gplus {
        padding: 0 25%;
    }

    .about-4gplus .pin-text {
        /*font-size: 1.3em;*/
        font-size: 1.15em;
    }

    .coverage-map-4gplus {
        padding-bottom: 135%;
    }

    .qatar-map-4gplus {
        width: 55%;
        padding-bottom: 100%;
    }

    /* END Network Campaign Update */
}

@media only screen and (min-width: 767px) {
    .content-4gplus {
        font-size: 24px;
    }

    .content-4gplus h2 {
        font-size: 32px;
    }

    /* START Network Campaign Update */

    .intro-4gplus {
        padding-bottom: 38%;
        background-image: url('../../../../../css/images/4g/bgs/4gplus-overview-intro-bg.jpg');
    }

    .intro-4gplus-cta {
        top: 15%;
        right: 8%;
        left: auto;
        width: 40%;

        -webkit-transform: none;
        transform: none;
    }

    .about-4gplus {
        padding: 50px 0 0;
    }

    .cell-towers {
        margin: 10% 0 0;
        padding-bottom: 124%;
    }

    .cell-towers-signal-bar-sm {
        top: -1%;
        left: 35%;
        padding-bottom: 15%;

        -webkit-animation-delay: 0;
        animation-delay: 0;
    }

    .cell-towers-signal-bar-md {
        top: -5%;
        left: 25%;
        padding-bottom: 25%;

        -webkit-animation-delay: 0;
        animation-delay: .25s;
    }

    .cell-towers-signal-bar-lg {
        top: -8%;
        left: 15%;
        padding-bottom: 35%;

        -webkit-animation-delay: .5s;
        animation-delay: .5s;
    }

    .cell-towers-signal-group-reversed .cell-towers-signal-bar-sm {
        left: 60%;
    }

    .cell-towers-signal-group-reversed .cell-towers-signal-bar-md {
        left: 70%;
    }

    .cell-towers-signal-group-reversed .cell-towers-signal-bar-lg {
        left: 80%;
    }

    .animation-container-about-4gplus {
        margin-top: 10%;
        padding: 0;
    }

    .about-4gplus .pin {
        padding-bottom: 45%;
    }

    .about-4gplus .pin-text {
        width: 55%;
        font-size: .75em;
    }

    .cta-4gplus {
        background-image: url("../../../../../css/images/4g/bgs/4gplus-overview-cta-bg.jpg");
        padding-bottom: 57%;
    }

    .cta-img-4gplus {
        width: 50%;
    }

    .benefits-coverage-4gplus {
        padding-bottom: 40%;
    }

    .benefits-coverage-inner-4gplus {
        padding: 0 15px;
    }

    .benefits-coverage-circle .timer-wrap {
        font-size: 11vw;
    }

    .benefits-coverage-circle p {
        font-size: 3.2vw;
    }

    .benefits-capacity-4gplus {
        padding-bottom: 52%;
    }

    .benefits-capacity-circle {
        width: 35%;
        padding-bottom: 35%;
    }

    .benefits-capacity-circle-content .timer-wrap {
        font-size: 19vw;
    }

    .benefits-capacity-circle-content p {
        font-size: 5.2vw;
    }

    .coverage-map-4gplus {
        padding-bottom: 70%;
    }

    .coverage-map-4gplus h2 {
        position: absolute;
        top: 20%;
        width: 30%;
    }

    .coverage-map-4gplus p {
        position: absolute;
        top: 50%;
        left: 25px;
        width: 30%;

        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .coverage-map-4gplus h3 {
        position: absolute;
        top: 50%;
        right: 25px;
        width: 30%;
        font-size: 1em;

        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .qatar-map-4gplus {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 35%;
        margin: 0;
        padding-bottom: 65%;
        font-size: .9em;

        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .handset {
        margin: 0;
        padding: 0;
    }

    .handset--standard .handset__speed--size {
        font-size: 1.35em;
    }

    .handset--4gplus .handset__speed--size {
        font-size: 1.35em;
    }

    .handset--next-gen .handset__speed--size {
        font-size: 1.35em;
    }

    /* END Network Campaign Update */

    .network-coverage-4gplus {
        padding-top: 10%;
        padding-bottom: 10%;
    }

    .network-coverage-4gplus .belt {
        position: relative;
    }

    .network-coverage-4gplus .percentage {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 42%;
        margin-bottom: 0;
        /*font-family: "VodafoneRgBold";
        font-size: 80px;
        color: #fff;*/

        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .network-coverage-4gplus h2 {
        float: left;
        width: 27%;
        margin-bottom: 0;
        font-size: 24px;
    }

    .network-coverage-4gplus p {
        float: right;
        width: 27%;
    }

    .coverage-map-4gplus-wrapper {
        overflow: hidden;
        width: 100%;
        height: 0; /* needed to establish height by padding */
        padding-top: 48%; /* 36% of parent width (section - 100% width) */
    }

    .coverage-map-4gplus-wrapper .coverage-info {
        padding: 0 25px;
    }

    .compatible-devices-4gplus .col {
        text-align: inherit;
    }

    .compatible-devices-4gplus img {
        margin-bottom: 0;
    }

    .sequence-next-4gplus {
        right: -3%;
    }

    .sequence-prev-4gplus {
        left: -3%;
    }

    .devices-content-4gplus .device-img {
        margin: 0;
    }

    .devices-content-4gplus .device-info {
        width: 52%;
    }

    .devices-content-4gplus .device-img {
        max-width: 31%;
    }

    .devices-mobile-slide {
        text-align: inherit;
    }
}

@media only screen and (min-width: 992px) {
    .content-4gplus h2 {
        font-size: 40px;
    }

    /* START Network Campaign Update */

    .benefits-capacity-circle-content .timer-wrap {
        font-size: 5.5em;
    }

    .benefits-capacity-circle-content p {
        font-size: 1.3em;
    }

    .handset__speed--size {
        font-size: 1.5em;
    }

    .coverage {
        font-size: .9em;
    }

    .benefits-coverage-4gplus h2 {
        margin-top: 20px;
        font-size: 2em;
    }

    .benefits-coverage-circle .timer-wrap {
        font-size: 4.5em;
    }

    .benefits-capacity-circle-content {
        padding: 20%;
    }

    .benefits-coverage-circle p {
        font-size: 1.3em;
    }

    .benefits-capacity-circle-content .timer-wrap {
        font-size: 6.5em;
    }

    .benefits-capacity-circle-content p {
        font-size: 1.75em;
    }

    .handset--standard .handset__img {
        font-size: 1em;
    }

    .handset--4gplus .handset__img {
        font-size: 1.25em;
    }

    .handset--next-gen .handset__img {
        font-size: 1.5em;
    }

    /*.cta-4gplus {
        padding: 120px 0;
        background-size: 100% auto;
    }

    .cta-img-4gplus {

    }

    .benefits-coverage-4gplus,
    .benefits-capacity-4gplus  {
        padding: 20px 0;
        background-size: auto;
    }

    .coverage-map-4gplus {
        padding: 10px 0;
        background-size: auto;
    }

    .benefits-coverage-inner-4gplus,
    .benefits-capacity-inner-4gplus,
    .coverage-map-inner-4gplus {
        position: initial;

        -webkit-transform: none;
        transform: none;
    }

    .benefits-capacity-inner-4gplus {
        height: 475px;
    }

    .coverage-map-inner-4gplus {
        height: 650px;
    }*/

    /* END Network Campaign Update */

    .about-4gplus .pin-text {
        font-size: 1em;
    }

    .network-coverage-4gplus h2 {
        font-size: 24px;
    }

    .coverage-map-4gplus-wrapper .coverage-info {
        top: 45%;
        background-color: transparent;

        -webkit-transform: translate(-50%, 0);
        transform: translate(-50%, 0);
    }

    .sequence-next-4gplus {
        right: -4.5%;
    }

    .sequence-prev-4gplus {
        left: -4.5%;
    }

    .sequence-device-gallery .device-description {
        font-size: 24px;
    }
}

@media only screen and (min-width: 1140px) {
    .sequence-next-4gplus {
        right: -10%;
    }

    .sequence-prev-4gplus {
        left: -10%;
    }
}

/* qatar exchange */

.qatarExch h2 {
    border-bottom: 1px solid #CCCCCC;
    font-size: 20px;
    font-weight: bold;
    line-height: 30px;
    margin-bottom: 7px;
}
.qatarExch .data span {
    display: block;
    line-height: 1.2;
}
.qatarExch .trade, .qatarExch .change {
    float: left;
}
.qatarExch .trade {
    min-width: 55%;
    margin-right: 10px;
}
.qatarExch .change {
    min-width: 40%;
}
.qatarExch .trade .value {
    font-size: 24px;
    color: #000;
}
.qatarExch .change .value {
    font-size: 24px;
    color: #999;
}
.qatarExch .data .text {
    font-size: 16px;
    color: #999;
}



/*Homepage Quick Links*/

.qlink-inline-flex.cf {
    margin-bottom: 30px;
}

.qlink-list-icons a:hover,
.qlink-list-icons-b a:hover {
    text-decoration: none;
}

.qlink-media-body {
    font-family: VodafoneRegular;
    font-weight: bold;
}

.qlink-list-icons,
.qlink-list-icons-b {
    float: left;
    text-align: center;
    width: 33.33%;
}
/*.qlink  {
    overflow: hidden;
    margin: 0 -5px 30px;
}*/
/*.tabbed-ui-accessories .tabbed-ui-item {
    width: 33.33%;
    padding: 0 5px;
}*/
.qlink-list-icons .i-vfqa,
.qlink-list-icons-b .i-vfqa {
    width: 98px;
    height: 110px;
    margin-top: 8px;
    background-size: auto;
    -webkit-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
}

.qlink-list-icons .i-vfqa:hover,
.qlink-list-icons-b .i-vfqa:hover {
    -webkit-transform: translateY(-5%);
    -ms-transform: translateY(-5%);
    transform: translateY(-5%);
}

.stepper-vertical li.active h2:hover {
    cursor: pointer;
}

/*icons*/

.qlink-call-hundred {
    background-position: -5422px 0;
}

.qlink-locator {
    background-position: -5554px 0;
}

.qlink-call-one {
    background-position: -5689px 0;
}

.qlink-email {
    background-position: -6336px 0;
}

.qlink-orecharge {
    background-position: -5955px 0;
}

.qlink-bill {
    background-position: -6087px 0;
}

.qlink-rcall-back {
    background-position: -6221px 0;
}

.qlink-my-vodafone-app {
    background-position: -7103px 0px;
}

@media only screen and (min-width: 767px) {
    .qlink-list-icons {
        width: 16.66%;
    }

    .qlink-list-icons-b {
        width: 14.20%;
    }

}

@media only screen and (max-width: 480px) {
    .qlink-list-icons .i-vfqa,
    .qlink-list-icons-b .i-vfqa {
    width: 80px;
    height: 80px;
    background-size: auto 80%;
    }

    .qlink-list-icons .qlink-media-body,
    .qlink-list-icons-b .qlink-media-body {
    font-size: 14px;
    height: 50px !important;
    }

    .qlink-call-hundred {
        background-position: -3462px -0;
    }

    .qlink-locator {
        background-position: -3547px -0;
    }

    .qlink-call-one {
        background-position: -3631px -0;
    }

    .qlink-email {
        background-position: -4046px -0;
    }

    .qlink-orecharge {
        background-position: -3802px -0;
    }

    .qlink-bill {
        background-position: -3886px -0;
    }
    .qlink-rcall-back {
        background-position: -3972px -0;
    }

    .qlink-my-vodafone-app {
        background-position: -4538px -0px;
    }
}

/*END Homepage Quick Links */


/*Star Numbers*/
.stepper-vertical .step-body.hide-height,
.stepper-vertical .hide-height {
    height: 0;
    overflow: hidden;
    padding: 0;
    margin: 0;
}

.sn-choose-number .col.w-33 {
    margin-bottom: 25px;
}

.star-numbers-stepper .grid {
    padding: 30px;
    font-family: VodafoneRegular;
}

.star-label {
    border: 1px solid #D9D9D9;
    text-align: center;
    padding: 0px;
}

.star-numbers-stepper .inner-star-box.sn-box-number {
    padding: 20px;
    color: #E60000;
    font-weight: normal;
    font-size: 30px;
}

.star-numbers-stepper .inner-star-box.sn-box-qr {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    font-weight: normal;
    font-size: 20px;
}

.star-numbers-stepper .inner-star-box.sn-box-price {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    border-left: 1px solid #D9D9D9;
    font-weight: normal;
    font-size: 30px;
}

.sn-box-darkened {
    padding: 0;
}

.sn-box-number {
    border-bottom: 1px solid #D9D9D9;
}

.sn-boxradio-toolbar label {
    cursor: pointer;
    overflow: hidden;
}

.snForm input {
    padding: 10px;
}

/*.sn-boxradio-toolbar input[type="radio"]:checked + label {
    border-color: transparent;
}*/

.sn-boxradio-toolbar input[type="radio"]:checked + label .sn-box-darkened {
    color: white;
    background-color: #848484;
    border: white;
}

.sn-boxradio-toolbar input[type="radio"]:checked + label .sn-box-grayed,
.sn-boxradio-toolbar input[type="radio"]:checked + .sn-box-grayed {
    background-color: #F3F3F3;
}

.star-numbers-stepper .sn-mobile-price {
    display: none;
}

/*form star numbers*/

.sn-enter-details label {
    text-align: left;
}

.sn-select-plan .sn-plan-icon {
    text-align: center;
    padding: 20px;
    font-weight: bold;
}

.sn-select-plan .sn-icon-pad {
    border: 1px solid #D9D9D9;
    border-radius: 5px;
    padding: 5px;
}

.sn-icon-pad p {
    text-align: center;
}

.sn-select-plan input[type="radio"]:checked + label .sn-icon-pad {
    border: 3px solid #E50100;
    border-radius: 0;
}

.sn-select-plan .grid.l-flex-center-lrg,
.sn-select-plan .grid.l-flex-center-lrg .grid {
    padding: 0;
}

.vipStarNumbers .grid ul:first-of-type {
    margin-top: 10px;
}

@media only screen and (min-width: 769px) {
    .snForm .parsley-errors-list {
        margin-left: 270px !important;
    }
    .snForm .fm-select .parsley-errors-list {
        margin-left: 0 !important;
    }
    
    .sn-enter-details label,
    .snForm .fm-submit {
        margin-left: 30px;
    }
    .sn-border-right {
        border-right: 1px solid #cccccc;
    }
}

@media only screen and (max-width: 766px) {

    .star-numbers-stepper.sn-boxradio-toolbar .sn-mobile-nopad{
        padding: 0;
    }

    .star-label {
    height: auto;
    }

    .star-numbers-stepper .sn-mobile-price {
        display: block;
        color: black;
        padding-left: 10px;
    }

    .star-numbers-stepper .col.w-100.sn-box-darkened {
        display: none;
    }

    .star-numbers-stepper .col.w-100.inner-star-box.sn-box-number.sn-box-grayed {
        border: none;
    }

    .star-numbers-stepper .col.w-100.inner-star-box.sn-box-number.sn-box-grayed {
        display: inline-flex;
        font-size: 20px;
    }
}

/* END Star Numbers*/

/* Star Numbers - Numbers */

@media only screen and (max-width: 911px) {
    .star-numbers-stepper .inner-star-box.sn-box-price {
        font-size: 20px;
    }

    .star-numbers-stepper .inner-star-box.sn-box-number {
        font-size: 20px;
    }

    .sn-button {
        margin-left: -20px;
    }

}

/* Star Numbers mobile shop*/

@media only screen and (max-width: 766px) {

    #midsection-wrapper .secondLevel-layout .tableFoot {
        margin-top: 50px;
    }


}

/* END Star Numbers mobile shop*/

/* Support page revamp*/

.faq-nav {
    float: right;
}

.faq-search {
    float: left;
    margin: 15px 0 0;
    margin-bottom: 20px;
}

.SupportLandingPage .tg-head,
.Support-TeaserFAQs .tg-head{
    font-size: 11px !important;
}

.SupportLandingPage .center-content.tg-tab,
.Support-TeaserFAQs .center-content.tg-tab {
    padding: 6px 2px;
}

.SupportLandingPage .breadcrumb-main .sup-red-bread,
.Support-TeaserFAQs .breadcrumb-main .sup-red-bread {
    color: #E60000;
}

.SupportLandingPage .tg-nav.tg-tabs-alt,
.Support-TeaserFAQs .tg-nav.tg-tabs-alt {
    margin-bottom: 0;
}

/*.SupportLandingPage .tg-body.tg-display,
.Support-TeaserFAQs .tg-body.tg-display {
    border-left: 1px solid #CACACA;
    border-right: 1px solid #CACACA;
    border-bottom: 1px solid #CACACA;
}*/

.SupportLandingPage .breadcrumb-main,
.Support-TeaserFAQs .breadcrumb-main {
    font-weight: bold;
    margin-bottom: 20px;
}

.SupportLandingPage .sup-prom-btn,
.Support-TeaserFAQs .sup-prom-btn {
    margin-bottom: 50px
}

.SupportLandingPage .sup-pad-30 {
    padding: 30px;
}

.SupportLandingPage .h3-margin-bottom {
    margin-bottom: 50px;
}

.SupportLandingPage .sup-margin-bottom {
    margin-bottom: 50px;
}

.second-level.TwoCols-Layout {
    font-family: 'VodafoneRegular';
}

.second-level.TwoCols-Layout .sup-nobox {
    box-shadow: none;
    border: none;
    width: 80%;
}

.SupportLandingPage .fm-submit.btn.btn-sml.l-pull-right,
.Support-TeaserFAQs .fm-submit.btn.btn-sml.l-pull-right {
    height: 35px;
    width: 80px;
}

.second-level.TwoCols-Layout .box {
    border-radius: 0;
    box-shadow: none;
    border: 1px solid #CACACA;
}

.second-level.TwoCols-Layout .i-vfqa {
    width: 98px;
    height: 110px;
    margin-top: 8px;
    background-size: auto;
    -webkit-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
}

.second-level.TwoCols-Layout .sup-boxpad h3 {
    height: 50px;
}

.second-level.TwoCols-Layout .sup-info-spacing {
    margin-top: 30px;
    margin-bottom: 40px;
    font-size: 16px;
}

.second-level.TwoCols-Layout .tg-body.tg-display {
    padding: 55px;
}

/*.Support-TeaserFAQs .tg-nav.tg-tabs-alt {
    height: 45px;
}*/

.qlink-media-body {
    text-align: center;
}

.SupportLandingPage .leftpad {
    padding-left: 30px;
}

.SupportLandingPage .sup-boxpad {
    padding: 30px;
}

.second-level.TwoCols-Layout .sup-tabs {
    font-size: 20px;
}

.second-level.TwoCols-Layout .sup-tabs:hover {
    text-decoration: none;
}

.second-level.TwoCols-Layout .boxedLink.boxedLinkFirst {
    border-top: 1px solid #CACACA;
}

.second-level.TwoCols-Layout .boxedLink {
    background-color: #F7F7F7;
    border: 1px solid #CACACA;
    border-top: none;
    color: #666;
    cursor: pointer;
    overflow: hidden;
    width: auto;
    padding: 10px;
    transition-duration: .5s;
    -moz-transition-duration: .5s;
    -webkit-transition-duration: .5s;
    -o-transition-duration: .5s;
}

.second-level.TwoCols-Layout .tileWithLinkList a.tileLinkOverlay {
    text-indent: 0;
    position: relative;
}

.second-level.TwoCols-Layout a.tileLinkOverlay {
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    text-decoration: none;
    top: 0;
    width: 100%;
}

.second-level.TwoCols-Layout a.tileLinkOverlay .tileLinkText {
    color: #000000;
    font-size: 15px;
    font-weight: bold;
}

.second-level.TwoCols-Layout .boxedLink p, .boxedLinkFirst p {
    width: 368px;
    margin: 0;
    padding: 0;
    display: inline;
}

.second-level.TwoCols-Layout .boxedLink i {
    margin-right: 10px;
    margin-top: 2px;
}

.second-level.TwoCols-Layout .padded {
    padding-left: 20px;
    padding-right: 20px;
}

.second-level.TwoCols-Layout .sup-prom-pgph {
    font-size: 18px;
}

.SupportLandingPage .mod.mod-toggle.tg-accord.tg-accord-lrg .tg-item,
.Support-TeaserFAQs .mod.mod-toggle.tg-accord.tg-accord-lrg .tg-item{
    border: 1px solid #CACACA;
    box-shadow: none;
    margin-top: 0;
    border-radius: 0;
}

.SupportLandingPage .mod.mod-toggle.tg-accord.tg-accord-lrg li:not(:last-child),
.Support-TeaserFAQs .mod.mod-toggle.tg-accord.tg-accord-lrg li:not(:last-child){
    border-bottom: 0;
}

.SupportLandingPage .mod.mod-toggle.tg-accord.tg-accord-lrg .tg-head,
.Support-TeaserFAQs .mod.mod-toggle.tg-accord.tg-accord-lrg .tg-head{
    font-size: 12px;
    color: #333333;
    font-weight: bold;
}

.SupportLandingPage .tg-tabs .tg-nav .tg-item,
.Support-TeaserFAQs .tg-tabs .tg-nav .tg-item{
    width: 10%;
}

.SupportLandingPage .fb,
.SupportLandingPage .tw {
padding: 11px 0px 10px 55px;
}

@media only screen and (min-width: 767px) and (max-width: 954px) {

    .SupportLandingPage .social {
    display: inline-flex;
    }

    .SupportLandingPage .fb,
    .SupportLandingPage .tw {
    padding: 30px 0px 10px 55px;
    }
}

@media only screen and (max-width: 480px) {

    .SupportLandingPage .mobile-gather {
        display: initial !important;
    }

}

@media only screen and (min-width: 766px) {
    .SupportLandingPage .mobile-gather {
        padding-left: 70px;
    }

    .SupportLandingPage .qlink-media-icon {
        text-align: center;
    }
}

@media only screen and (max-width: 375px) {
    .second-level.TwoCols-Layout .padded {
    padding: 0;
    }
}

@media only screen and (max-width: 766px) {
    .SupportLandingPage .fb,
    .SupportLandingPage .tw {
    padding: 11px 0px 10px 45px;
    }

    .SupportLandingPage .tg-head,
    .Support-TeaserFAQs .tg-head{
        font-size: 15px !important;
    }

    .second-level.TwoCols-Layout .i-vfqa-resized {
        float: left;
    }

    .SupportLandingPage .tg-tabs .tg-nav .tg-item,
    .Support-TeaserFAQs .tg-tabs .tg-nav .tg-item{
        width: auto;
    }

    .second-level.TwoCols-Layout .sup-mobile-box {
        height: 130px;
    }

    .SupportLandingPage .mobile-gather {
        display: inline-flex;
    }

    .SupportLandingPage .fm-submit.btn.btn-sml,
    .Support-TeaserFAQs .fm-submit.btn.btn-sml {
        float: right;
        position: relative;
        top: 0;
        width: 100% !important;
    }

    .SupportLandingPage .leftpad {
        padding-left: 0;
    }
}

@media only screen and (max-width: 420px) {
    .second-level.TwoCols-Layout .boxedLink.tileWithLinkList {
        width: 220px;
    }
}

/*sprite mobile*/

@media only screen and (max-width: 480px) {

    .SupportLandingPage .qlink-email {
        background-position: -6334px 0;
    }

    .SupportLandingPage .qlink-orecharge {
        background-position: -5953px 0;
    }

    .SupportLandingPage .qlink-bill {
        background-position: -6087px 0;
    }
}

/*tab images*/

.second-level.TwoCols-Layout .i-vfqa-resized {
    width: 38px;
    height: 45px;
    background-size: auto;
    margin-top: 0;
    -webkit-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
}

.sup-tab-main {
    background-position: -6447px -6px;
}

.sup-tab-myvod {
    background-position: -7052px -6px;
}

.sup-tab-plans {
    background-position: -6492px -6px;
}

.sup-tab-data-internet {
    background-position: -6537px -6px;
}

.sup-tab-phones-numbers {
    background-position: -6583px -6px;
}

.sup-tab-other {
    background-position: -6629px -6px;
}

/* END Support page revamp*/

/*
   Promotions
   ========================================================================== */

.promotions {
    margin: 30px 0;
}

.promotion {
    padding: 40px 0;
    border-top: 1px solid #e3e3e3;
}

.promotion-content .btn {
    margin: 20px 0 0;
}

.promotion-img {
    margin: 0 -10px 40px -10px;
}

.promotion-img img {
    width: 100%;
}

@media only screen and (min-width: 767px) {
    .promotion {
        padding: 15px 0;
    }

    .promotion:nth-child(2n+1) {
        -webkit-flex-direction: row-reverse;
            -ms-flex-direction: row-reverse;
                flex-direction: row-reverse;
    }

    .promotion-content,
    .promotion-img {
        width: 50%;
    }

    .promotion-img {
        margin: 0;
    }

    .promotion:nth-child(2n) .promotion-content {
        padding-left: 60px;
    }

    .promotion:nth-child(2n+1) .promotion-content {
        padding-right: 60px;
    }
}


/*
   My Vodafone App
   ========================================================================== */

.mvfa {
    margin-top: -15px;
}

.mvfa-intro {
    margin-bottom: 50px;
    padding: 50px 0;
    background-color: #232323;
}

.mvfa-intro__img {
    position: relative;
    margin-bottom: 50px;
}

.mvfa-intro__img {
    opacity: 0;

    -webkit-transform: translateX(-25%);
            transform: translateX(-25%);

    transition: all .3s ease-in-out;
}

.is-animated .mvfa-intro__img {
    opacity: 1;

    -webkit-transform: translateX(0);
            transform: translateX(0);
}

.mvfa-intro__slide {
    position: absolute;
    left: 0;

    transition: all .3s ease-in-out;
}

.mvfa-intro__slide-1 {
    transition-delay: .5s;
}

.mvfa-intro__slide-2 {
    transition-delay: .75s;
}

.mvfa-intro__slide-3 {
    transition-delay: 1s;
}

.is-animated .mvfa-intro__slide-3 {
    opacity: .9;

    -webkit-transform: translateX(30%) scale(.95);
            transform: translateX(30%) scale(.95);
}

.is-animated .mvfa-intro__slide-2 {
    opacity: .7;

    -webkit-transform: translateX(50%) scale(.9);
            transform: translateX(50%) scale(.9);
}

.is-animated .mvfa-intro__slide-1 {
    opacity: .5;

    -webkit-transform: translateX(70%) scale(.85);
            transform: translateX(70%) scale(.85);
}

.mvfa-spec__content {
    position: relative;
}

.mvfa-intro__content h3 {
    margin-bottom: 5px;
    font-size: 18px;
    color: #dbdbdb;
}

.mvfa-intro__content p {
    font-family: VodafoneRegular, Arial, sans-serif;
    font-size: 18px;
    color: #dbdbdb;
}

.mvfa-switcher {
    margin-top: 50px;
}

.mvfa-switcher .btn-flat {
    padding-left: 55px;
    padding-right: 55px;
    border-width: 2px;
    border-color: #fff;
}

.mvfa-switcher .btn-flat:hover {
    cursor: default;
}

.mvfa-qr {
    overflow: hidden;
    margin-bottom: 50px;
}

.mvfa-qr__block {
    float: left;
    width: 50%;
    padding: 5%;
    border: 1px solid #d8d8d8;
    text-align: center;
}

.mvfa-qr__block + .mvfa-qr__block {
    border-left: 0;
}

.mvfa-qr__badge {
    width: 100%;
    height: 50px;
    margin: 15px auto 0;
}

.mvfa-qr__badge img {
    width: 100%;
}

.mvfa-specs,
.mvfa-videos,
.mvfa-extra {
    margin-bottom: 50px;
}

.mvfa-spec:nth-child(2n+1) {
    -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
}

.mvfa-spec__img {
    text-align: center;

    /* Prevent the image from shrinking */
    -webkit-flex: 0 0 auto;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
}

.mvfa-spec__content h3 {
    font-family: VodafoneRegular, Arial, sans-serif;
}

.mvfa-videos .ca-block-inner {
    margin-bottom: 15px;
}

.mvfa-extra {
    font-size: 16px;
}

@media only screen and (min-width: 400px) {
    .mvfa-qr__badge {
        width: 150px;
    }
}

@media only screen and (min-width: 767px) {
    .mvfa {
        margin-top: 0;
    }

    .mvfa-intro {
        margin-bottom: 80px;
        padding: 60px 0;
    }

    .mvfa-intro__img,
    .mvfa-intro__content {
        width: 50%;
    }

    .mvfa-intro__img {
        margin-bottom: 0;
    }

    .mvfa-intro__content {
        padding-left: 5%;
    }

    .mvfa-qr {
        margin-bottom: 80px;
    }

    .mvfa-specs {
        margin-bottom: 80px;
    }

    .mvfa-spec:nth-child(2n) .mvfa-spec__content {
        padding-left: 50px;
    }

    .mvfa-spec:nth-child(2n+1) .mvfa-spec__content {
        padding-right: 50px;
    }

    .mvfa-videos .mod-carousel {
        margin-left: 60px;
        margin-right: 60px;
    }

    .mvfa-videos .ca-nav-primary {
        left: -60px;
        right: -60px;
    }

    .mvfa-videos .ca-block {
        padding-left: 20px;
        padding-right: 20px;
    }

    .mvfa-videos .ca-block-inner {
        margin-bottom: 0;
    }
}

/* Promotion codes */

table.table-with-borders tr {
  border: 1px solid #b5b5b5;
}

table.table-with-borders td {
  border-left: 1px solid #b5b5b5;
  padding: 35px;
}

@media only screen and (max-width: 766px) {
  table.table-with-borders td {
    padding: 5px;
  }

  #promotionCodesForm .fm-select {
    max-width: 180px;
  }
}

/* Promotion codes END */

/* Vodafone Tuesdays */
.vf-tuesday-section {
    position: relative;
    padding: 50px 0;

    background: #ea1c24; /* Old browsers */
    background: linear-gradient(to bottom,  #ea1c24 80%,#a6141a 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ea1c24', endColorstr='#a6141a',GradientType=0 ); /* IE9 */
    text-shadow: 1px 2px 1px rgba(0, 0, 0, .5);

    color: #fff;
}

.vf-tuesday-section-video {
    padding: 0;
    background: none;
}

.vf-tuesday-section-video .vf-tuesday-title-wrap {
    padding: 50px 0;

    background: #ea1c24; /* Old browsers */
    background: linear-gradient(to bottom,  #ea1c24 80%,#a6141a 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ea1c24', endColorstr='#a6141a',GradientType=0 ); /* IE9 */
    text-shadow: 1px 2px 1px rgba(0, 0, 0, .5);

    color: #fff;
}

.vf-tuesday-title {
    margin-bottom: 12px;
    font-family: 'Signika Negative', Arial, sans-serif;
    font-weight:700;
    font-size: 58.52px;
    line-height: 50.23px;
    color: #fff;
}

.vf-tuesday-section .video-sequence {
    padding-bottom: 56.25%;
}

.vf-tuesday-section .animate-in .video-slide-wrapper {
    left: 0;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.vf-tuesday-section .animate-out .video-slide-wrapper {
    left: -100%;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -ms-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.vf-tuesday-section .video-sequence-prev {
    left: 30px;
}

.vf-tuesday-section .video-sequence-next {
    right: 30px;
}

.vf-tuesday-section .sequence-prev-white:hover {
   background-position: 0 -84px;
}

.vf-tuesday-section .sequence-next-white:hover {
   background-position: -37px -84px;
}

.vf-tuesday-content {
    text-align: center;
}

.vf-tuesday-section .store {
    display: inline-block;
    margin-bottom: 20px;
}

@media only screen and (min-width: 767px) {
    .vf-tuesday-section-video {
        padding: 50px 0;
        background: #ea1c24; /* Old browsers */
        background: linear-gradient(to bottom,  #ea1c24 80%,#a6141a 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ea1c24', endColorstr='#a6141a',GradientType=0 ); /* IE9 */
    }

    .vf-tuesday-section-video .vf-tuesday-title-wrap {
        margin-bottom: 30px;
        padding: 0;
        background: none;
    }

    .vf-tuesday-section .video-sequence {
        padding-bottom: 16.5%;
    }

    .vf-tuesday-section .video-sequence-prev {
        left: -50px;
    }

    .vf-tuesday-section .video-sequence-next {
        right: -50px;
    }

    .vf-tuesday-section .vf-tuesday-content {
        position: relative;
        -webkit-flex: 0 1 auto;
            -ms-flex: 0 1 auto;
                flex: 0 1 auto;
    }

    .vf-tuesday-section-intro .vf-tuesday-content {
        width: 60%;
    }

    .vf-tuesday-section-intro .vf-tuesday-img {
        width: 90%;
        margin-right: -40%;
    }

    .vf-tuesday-section-details .vf-tuesday-content {
        width: 50%;
        margin-left: -160px;
    }

    .vf-tuesday-section-details .vf-tuesday-img {
        width: 80%;
    }
}

@media only screen and (min-width: 1200px) {
    .vf-tuesday-section .video-sequence-prev {
        left: -80px;
    }

    .vf-tuesday-section .video-sequence-next {
        right: -80px;
    }
}

/*
.vf-tuesday-section .container {
    position: relative;
}

.vf-tuesday-section h1 span {
    font-size: 31.76px;
    font-weight: normal;
}

.vf-tuesday-section a,
.vf-tuesday-section a:hover {
    text-decoration: none;
    color: #fff;
}

.vf-tuesday-section .info {
    position: relative;
    z-index: 20;
}

.vf-tuesday-section .img {
    position: absolute;
    z-index: 10;
}

.presentation-section {
    height: 535px;
    padding-top: 155px;
    text-align: center;
}

.presentation-section h2 {
    margin-top: 50px;
    font-family: 'VodafoneExbRegular', Arial, sans-serif;
    font-size: 40.17px;
    line-height: 1;
}

.presentation-section p,
.steps-section p {
    font-family: 'VodafoneLtRegular', Arial, sans-serif;
    font-size: 18px;
    line-height: 1.2;
    color: #fff;
}

.presentation-section-info {
    width: 49%;
}

.presentation-section-img {
    top: -195px;
    left: 30%;
}

.steps-section {
    height: 400px;
}

.steps-section-info {
    float: right;
    width: 53%;
}

.steps-section-img {
    top: -90px;
    left: -1%;
}

.store-icons-wrapper {
    padding: 10px 0;
}

.steps-section h2 {
    margin-left: 16px;
    font-family: 'VodafoneRgRegular', Arial, sans-serif;
    font-size: 48px;
    font-weight: bold;
    line-height: 1;
}

.steps-section ul li {
    font-family: 'VodafoneLtRegular', Arial, sans-serif;
    font-size: 20px;
    line-height: 1.2;
    color: #fff;
}

.steps-section strong {
    font-family: 'VodafoneRgRegular', Arial, sans-serif;
    font-size: 20px;
    font-weight: bold;
    line-height: 1;
}

.steps-section p,
.steps-section .notice {
    margin-left: 20px;
}

.steps-section .notice,
.steps-section .notice strong {
    font-family: Arial, sans-serif;
    font-size: 12px;
}

.yt-ads-section {
    padding: 70px 0 60px;
    text-align: center;
}

.yt-ads-section h3 {
    border: 0 none;
    font-family: 'VodafoneRgRegular', Arial, sans-serif;
    font-size: 30px;
}

.ads-modal #video-wrapper {
    height: 360px;
}

.ads-modal .modal-header,
.ads-modal .modal-body {
    padding: 15px;
}

.ads-modal .modal-header {
    border-bottom: 1px solid #ddd;
}

.vf-tuesday-faq-title {
    margin-top: 50px;
    border: 0 none;
    font-family: 'VodafoneRgRegular', Arial, sans-serif;
    font-size: 20px;
    font-weight: normal;
}

.vf-tuestady-tc {
    display: inline-block;
    padding: 50px 0 30px;
    font-size: 12px;
    font-weight: bold;
    color: #000;
    text-decoration: none;
}
*/
/* Vodafone Tuesdays END */


/* redbox */

.not-likely {
    float: left;
}

.likely {
    text-align: right;
}

.scale-rating {
    max-width: 530px;
}

/* redbox end */


/*search result page*/


.belt-sresults .gsc-tabHeader.gsc-inline-block.gsc-tabhActive,
.belt-sresults .gsc-tabHeader.gsc-tabhInactive.gsc-inline-block,
.belt-sresults .gs-title,
.belt-sresults .gs-bidi-start-align.gs-snippet,
.belt-sresults .gs-bidi-start-align.gs-visibleUrl.gs-visibleUrl-long,
.belt-sresults b {
    font-size: 15px !important;
}

.belt-sresults div.gs-snippet *,
.belt-sresults div.gs-visibleUrl,
.belt-sresults div.gs-title *,
.belt-sresults .gcsc-branding-text,
.belt-sresults .gsc-expansionArea .gsc-cursor {
    font-size: 15px !important;
}



.belt-sresults .gs-bidi-start-align.gs-snippet,
.belt-sresults .gs-title.gsc-table-cell-thumbnail.gsc-thumbnail-left {
    height: auto !important;
}

.belt-sresults td.gsc-thumbnail {
    display: block !important;
}

.belt-sresults .gsc-webResult.gsc-result {
    padding: 0 !important;
}

.belt-sresults .gs-spelling i,
.belt-sresults .gs-spelling .i {
    background-image: none;
}

.belt-sresults .gcsc-branding-img-noclear {
    max-width: none;
}

@media only screen and (max-width: 768px) {
    .belt-sresults td.gsc-thumbnail,
    .belt-sresults td.gs-promotion-image-cell {
    display: none !important;
    }

    .belt-sresults div.gs-snippet *,
    .belt-sresults div.gs-visibleUrl,
    .belt-sresults div.gs-title *,
    .belt-sresults .gcsc-branding-text,
    .belt-sresults .gsc-expansionArea .gsc-cursor {
        font-size: 12px !important;
        word-break: break-all;
    }

    .belt-sresults .gsc-tabHeader.gsc-inline-block.gsc-tabhActive,
    .belt-sresults .gsc-tabHeader.gsc-tabhInactive.gsc-inline-block,
    .belt-sresults .gs-title,
    .belt-sresults .gs-bidi-start-align.gs-snippet,
    .belt-sresults .gs-bidi-start-align.gs-visibleUrl.gs-visibleUrl-long,
    .belt-sresults b {
        font-size: 12px !important;
        word-break: break-all;
    }

    .belt-sresults .gsc-tabHeader.gsc-inline-block.gsc-tabhActive,
    .belt-sresults .gsc-tabHeader.gsc-tabhInactive.gsc-inline-block,
    .belt-sresults .gs-title,
    .belt-sresults .gs-bidi-start-align.gs-snippet,
    .belt-sresults .gs-bidi-start-align.gs-visibleUrl.gs-visibleUrl-long,
    .belt-sresults b {
        font-size: 15px !important;
        word-break: break-all;
    }

    .belt-sresults .gcsc-branding tr,
    .belt-sresults .gcsc-branding .gcsc-branding-text .gcsc-branding-text,
    .belt-sresults .gcsc-branding .gcsc-branding-img-noclear {
        float: left;
    }

}
/*END search result page*/


/* ---------------------
   Business Premium Chat
   --------------------*/

.chatArea iframe {
    height: 440px;
}

.premiumBusinessBody .textBody {
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 20px;
}

.premiumBusinessBody .textHead {
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 36px;
    color: #E72B08;
}

.businessSection {
    margin-top: 35px;
    margin-bottom: 35px;
}

.businessSection img {
    width: 100%;
}

.businessTitle {
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 20px;
}

.businessBody {
    font-family: Arial,sans-serif;
    font-size: 14px;
}

.businessBody,
.businessTitle {
    margin-top: 10px;
    margin-bottom: 10px;
    text-align: center
}

.businessSection #obpCustomerProceed {
    float: none;
    width: 100%;
}

.businessBox {
    padding: 23px;
}

.business-btn {
    width: 100%;
}

.live-chat-text {
    margin-top: 110px;
}

.chatArea {
    background-color: #ededed;
    height: 560px;
}

.businessSection .container {
    padding: 20px;
}

.premiumContact {
    margin-left: 0;
}

.callback-btn {
    margin-top: 20px;
}

.business-obp-padding {
    padding: 55px;
}

.red-band {
    background-color: #e92100;
    color: #fff;
    font-size: 20px;
    height: 50px;
    padding: 12px;
}

.emailHead {
    margin-top: -15px;
    font-family: 'VodafoneRegular', Arial, sans-serif;
    font-size: 36px;
    color: #E72B08;
    margin-bottom: 30px;
}

.textareaBusienss {
    resize: none;
}

@media only screen and (max-width: 768px) {
    .chatArea {
       /*margin: 10px;*/
       height: 700px;
    }
    .chatBox {
        text-align: center;
    }

    .chatArea iframe {
        height: 500px;
    }
}

@media only screen and (max-width: 468px) {
    .chatArea {
        height: auto;
    }
}

@media only screen and (min-width: 767px) {
    .chatArea {
        padding: 60px;
    }
    .premiumBusinessBody .textHead {
        margin-bottom: 30px;
        margin-top: 30px;
    }
}

/* Business Premium Chat Login */

.premiumBusinessBody .teaser {
    margin-bottom: 0;
    border: 0;
}

/*.premiumBusinessLogoLrg {
    display: none;
}*/

@media only screen and (min-width: 767px) {
    .premiumBusinessBody .teaser {
        height: 650px;
    }

    .premiumBusinessBody .ts-full .wysiwyg {
        width: 50%;
        margin: 80px 0 0;
        padding: 30px;
        /*width: 40%;
        margin-left: 25%;
        margin-top: 10%;
        padding: 30px;
        margin-right: 25%;*/
    }

    .premiumBusinessBody .teaser .img-wrap {
        right: auto;
        left: 50%;

        -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
    }

    .premiumBusinessBody .teaser .img-wrap img {
        float: none;
    }

    .premiumBusinessBody h1 {
        margin-left: 0px;
    }
}

/*@media only screen and (min-width: 1140px) {
    .premiumBusinessBody .ts-full .wysiwyg {
        width: 27%;
    }

    .premiumBusinessBody .btn {
        min-width: 150px;
    }

    .premiumBusinessLogo {
        display: none;
    }

    .premiumBusinessLogoLrg {
        visibility: visible;
        display: inline-block;
    }

    .premiumBusinessBody .teaser {
        min-height: 800px;
    }
}*/

/* ---------------------
   Business Premium Chat
   --------------------*/


   /* Support promotions rule */

    .sup-promo-vf-icon-rule {
       width: 30%;
    }

    @media only screen and (max-width: 768px) {
        .sup-promo-vf-icon-rule {
           width: 66%;
        }
    }
   /* END Support promotions rule */

/*
  Smart Banner - Vodafone App Smart Banner plugin
  ========================================================================== */

#smartbanner {
    position: fixed;
    left: 0;
    top: -82px;
    height: 82px;
    width: 100%;
    z-index: 9998;
    padding: 10px 10px 10px 30px;
    /*border-bottom: 1px solid #bbb;*/
    background-color: #2e2e2e;
    -webkit-font-smoothing: antialiased;
    overflow: hidden;
    -ms-text-size-adjust: none;
    -webkit-text-size-adjust: none;
}

#smartbanner.shown {}

#smartbanner .sb-container {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;

    -ms-flex-align: center;
    -ms-flex-pack: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    align-items: center;
    justify-content: center;
}

#smartbanner .sb-close {
    position: absolute;
    left: 5px;
    top: 5px;
    display: block;
    border: 1px solid #fff;
    width: 20px;
    height: 20px;
    font-family: Arial;
    text-align: center;
    color: #fff;
    background: #070707;
    text-decoration: none;
    text-shadow: none;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(50, 50, 50, 0.75);
    -webkit-font-smoothing: subpixel-antialiased;
}

#smartbanner .sb-close span {
    font-size: 22px;
    line-height: 20px;
    text-align: center;
}

#smartbanner .sb-close:active {
    font-size: 13px;
    color: #aaa;
}

#smartbanner .sb-icon {
    /*position: absolute;
    left: 30px;
    top: 10px;*/
    display: block;
    width: 57px;
    height: 57px;
    background-size: cover;
    border-radius: 5px;
}

#smartbanner.no-icon .sb-icon {
    display: none;
}

#smartbanner .sb-info {
    /*position: absolute;
    left: 98px;
    top: 18px;
    width: 44%;*/

    -webkit-box-flex: 1;
    -webkit-flex: 1 1 34%;
        -ms-flex: 1 1 34%;
            flex: 1 1 34%;

    padding: 0 10px;

    font-size: 11px;
    line-height: 1.2em;
    font-weight: bold;
    color: #6a6a6a;
}

#smartbanner.no-icon .sb-info {
    left: 34px;
}

#smartbanner .sb-info strong {
    display: block;
    font-size: 13px;
    line-height: 18px;
    font-family: "Signika Negative", Arial, sans-serif;
    font-weight:700;
    color: #fff;
}

#smartbanner .sb-info > span {
    display: block;
    font-family: Arial, Helvetica, sans-serif;
    color: #ccc;
}

#smartbanner .sb-info em {
    font-style: normal;
    text-transform: uppercase;
}

#smartbanner .sb-button {
    /*position: absolute;
    right: 20px;
    top: 25%;
    bottom: 25%;*/
    min-width: 10%;
    border: 1px solid transparent;
    padding: 10px 20px 11px;
    font-family: Arial, sans-serif;
    font-size: 14px;
    text-align: center;
    font-weight: bold;
    color: #fff;
    background: #9c2aa0;
    text-decoration: none;
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(50, 50, 50, 0.75);
}

#smartbanner .sb-button:focus {
    background: #5e2750;
    text-decoration: none;
    border: 1px solid #999;
    box-shadow: none;
}

/*Device specific styling*/
#smartbanner.ios {}

#smartbanner.android {}