@charset "UTF-8";

/* @mixin box-sizing($box) {
  @include prefixer(box-sizing, $box, webkit moz spec);

  @warn "The box-sizing mixin is deprecated and will be removed in the next major version release. This property can now be used un-prefixed.";
} */

/******************************/

/* CONTROLS */

/******************************/

/*  #1 - Variables */

/*  #1.1 - Typography */

/*  #1.2 - Modular Scale */

/*  #1.3 - Colors */

/*  #1.4 - Susy Grid */

/******************************/

/*  #1 - VARIABLES */

/******************************/

/******************************/

/*  #1.1 - TYPOGRAPHY */

/******************************/

/*  #1.2 - MODULAR SCALE */

/******************************/

/*  #1.3 - OLD COLOURS!!!!    */

/* As per the Digital CI, all the interactive colors are 15% darker than their
        base color. We've used SASS to do this mathematically for us.
        The greys are the exception, as the guide does not stipulate an exact percentage. */

/*********************************/

/*  #1.3 - NEW CI COLOURS!!!!    */

/******************************/

/*  #1.4 - SUSY GRID */

/******************************/

/*  #2 - Mixins */

/*  #2.1 - REM with PX Fallback */

/*  #2.2 - Shorthand for Font Size/Line Height REM/PX Fallback */

/*  #2.3 - Aspect Ratio Pseudo Element */

/*  #2.4 - RESPONSIVE BREAKPOINTS */

/*  #2.5 - SVG with PNG FALLBACK */

/*  #2.6 - ANIMATIONS and KEYFRAMES */

/*  #2.7 - TRANSITIONS */

/*  #2.8 - CROSS-BROWSER OPACITY */

/*  #2.9 - TOOLTIPS  */

/******************************/

/*  #2 - Mixins */

/******************************/

/******************************/

/*  #2.1 - REM with PX Fallback */

/******************************/

/*  #2.2 - Shorthand for Font Size/Line Height REM/PX Fallback */

/******************************/

/*  #2.3 - Aspect Ratio Pseudo Element */

/******************************/

/*  #2.4 - RESPONSIVE BREAKPOINTS */

/******************************/

/*  #2.5 - SVG with PNG FALLBACK  .el { @include background-image('pattern'); } */

/******************************/

/*  #2.6 - ANIMATIONS and KEYFRAMES  .el { @include animation('slide-down 5s 3'); } @include keyframes(slide-down) { blah } */

/******************************/

/*  #2.7 - TRANSITIONS  .el { @include transition(color .3s ease); } */

/******************************/

/*  #2.8 - CROSS-BROWSER OPACITY  .el { @include opacity(0.8); } */

/******************************/

/*  #3 - CLEARFIX MIXIN (taken from https://gist.github.com/mike-henderson/4948107) */

/*
  https://github.com/bfred-it/object-fit-images
  plugin for lazySizes to support object-fit images with bg-img fallback for IE

  This mixin can be used to set the object-fit:
  @include object-fit(contain);
  or object-fit and object-position:
  @include object-fit(cover, top);
*/

/******************************/

/* UTILS */

/******************************/

/******************************/

/*  #3 - Extends i.e body padding */

/******************************/

/******************************/

/* #3.1 - Placeholder Extends */

/******************************/

/* #3.2 - Usable Class Extends */

.clear {
  width: 100%;
  height: 0;
  clear: both;
  display: block;
}

.overlay {
  background: #000000;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: none;
  opacity: 0.6;
}

.base-padding {
  padding: 24px;
  padding: 1.5rem;
}

.centre-image,
.help-tools .item .item-image img {
  margin: auto;
  text-align: center;
  display: block;
  vertical-align: middle;
}

.no-list,
.detail-builder .toggler,
.page-ftth .coverage-map-container .coverage-products ul,
.page-generic-product article .content .description ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.no-padding {
  padding: 0;
}

.no-padding-top {
  padding-top: 0;
}

.no-padding-right {
  padding-right: 0;
}

.no-padding-bottom {
  padding-bottom: 0;
}

.no-padding-left {
  padding-left: 0;
}

.no-margin {
  margin: 0;
}

.no-margin-top {
  margin-top: 0;
}

.no-margin-right {
  margin-right: 0;
}

.no-margin-bottom {
  margin-bottom: 0;
}

.no-margin-left {
  margin-left: 0;
}

/*! normalize.css v3.0.2 | MIT License | git.io/normalize */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Remove default margin.
 */

body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */

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

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

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */

audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/*
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

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

[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */

/**
 * Remove the gray background color from active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */

a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */

/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */

abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */

b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */

dfn {
  font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */

mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove border when inside `a` element in IE 8/9/10.
 */

img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 8/9/10/11.
 */

svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */

/**
 * Address margin not present in IE 8/9 and Safari.
 */

figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */

hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */

pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

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

/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */

/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */

button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */

button {
  overflow: visible;
}

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

button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

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

input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *    (include `-moz` to future-proof).
 */

input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  /* 2 */
  box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

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

legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */

textarea {
  overflow: auto;
}

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

optgroup {
  font-weight: bold;
}

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

/**
 * Remove most spacing between table cells.
 */

table {
  border-collapse: collapse;
  border-spacing: 0;
}

th,
td {
  padding: 0;
}

/* Magnific Popup CSS */

/******************************/

/*  #11 - Dialog */

/******************************/

/******************************/

/*  CORE  */

.mfp-close-btn-in .mfp-close {
  color: #ffffff !important;
  width: 48px;
  width: 3rem;
  height: 48px;
  height: 3rem;
  line-height: 48px;
  line-height: 3rem;
  opacity: 1 !important;
  overflow: hidden;
  text-indent: -200px;
  background-size: 24px;
  background-size: 1.5rem;
  background-repeat: no-repeat;
  background-position: bottom left;
  background-image: url('/today/static/web/img/icons/icon-library/close-grey.svg?9b7629b069b9');
}

.ie10 .mfp-close-btn-in .mfp-close,
.ie11 .mfp-close-btn-in .mfp-close,
.no-svg .mfp-close-btn-in .mfp-close {
  background-repeat: no-repeat;
  background-image: url('/today/static/web/img/icons/icon-library/png/close-grey.png?152109aa46d5');
  background-size: 32px;
}

.popup {
  position: relative;
  background: #ffffff;
  width: auto;
  max-width: 672px;
  max-width: 42rem;
  margin: 0 auto;
  margin-top: 20px;
  margin-top: 1.25rem;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
}

.popup .popup-content {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  padding-left: 32px;
  padding-left: 2rem;
  padding-right: 32px;
  padding-right: 2rem;
  background: #ffffff;
}

.popup .popup-content .title {
  font-size: 46.4px;
  font-size: 2.9rem;
  line-height: 51.2px;
  line-height: 3.2rem;
  font-family: "Telkom123-Regular", sans-serif;
}

.popup .popup-content p {
  color: #000000;
}

.popup .foundry-listing-horizontal {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 24px;
  margin-top: 1.5rem;
}

.popup .foundry-listing-horizontal .item {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  text-align: center;
}

@media (min-width: 48em) {
  .popup .foundry-listing-horizontal .item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .popup .foundry-listing-horizontal .item:nth-child(3n) {
    float: right;
    margin-right: 0;
  }
}

.popup .foundry-listing-horizontal .item img {
  max-width: 50%;
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

@media (min-width: 48em) {
  .popup .foundry-listing-horizontal .item img {
    max-width: 85%;
    padding: 0;
  }
}

.popup .foundry-listing-horizontal .item a {
  font-size: 12.8px;
  font-size: 0.8rem;
  display: block;
  color: #889391;
  text-decoration: none;
  text-align: center;
}

.popup .foundry-listing-horizontal .item a:hover {
  color: #000000;
}

.open-popup-link {
  display: none;
}

.mfp-hide {
  display: block !important;
}

.popup {
  border: 1em solid #cccccc;
}

.popup-head {
  display: none;
}

/******************************/

/*  ENHANCEMENTS  */

.js .open-popup-link {
  display: inline;
}

.js .mfp-hide {
  display: none !important;
}

.js .popup {
  border: 0;
}

.js .popup-head {
  display: block;
}

.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #000000;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden;
}

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 8px;
  box-sizing: border-box;
}

.mfp-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
}

.mfp-align-top .mfp-container:before {
  display: none;
}

.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045;
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto;
}

.mfp-ajax-cur {
  cursor: progress;
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -webkit-zoom-out;
  cursor: zoom-out;
}

.mfp-zoom {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: zoom-in;
}

.mfp-auto-cursor .mfp-content {
  cursor: auto;
}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.mfp-loading.mfp-figure {
  display: none;
}

.mfp-hide {
  display: none !important;
}

.mfp-preloader {
  color: #CCC;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 1044;
}

.mfp-preloader a {
  color: #CCC;
}

.mfp-preloader a:hover {
  color: #FFF;
}

.mfp-s-ready .mfp-preloader {
  display: none;
}

.mfp-s-error .mfp-content {
  display: none;
}

button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  box-shadow: none;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  filter: alpha(opacity=65);
  padding: 0 0 18px 10px;
  color: #FFF;
  font-style: normal;
  font-size: 28px;
  font-family: Arial, Baskerville, monospace;
}

.mfp-close:hover,
.mfp-close:focus {
  opacity: 1;
  filter: alpha(opacity=100);
}

.mfp-close:active {
  top: 1px;
}

.mfp-close-btn-in .mfp-close {
  color: #333;
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: #FFF;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%;
}

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #CCC;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}

.mfp-arrow {
  position: absolute;
  opacity: 0.65;
  filter: alpha(opacity=65);
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent;
}

.mfp-arrow:active {
  margin-top: -54px;
}

.mfp-arrow:hover,
.mfp-arrow:focus {
  opacity: 1;
  filter: alpha(opacity=100);
}

.mfp-arrow:before,
.mfp-arrow:after,
.mfp-arrow .mfp-b,
.mfp-arrow .mfp-a {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 35px;
  margin-left: 35px;
  border: medium inset transparent;
}

.mfp-arrow:after,
.mfp-arrow .mfp-a {
  border-top-width: 13px;
  border-bottom-width: 13px;
  top: 8px;
}

.mfp-arrow:before,
.mfp-arrow .mfp-b {
  border-top-width: 21px;
  border-bottom-width: 21px;
  opacity: 0.7;
}

.mfp-arrow-left {
  left: 0;
}

.mfp-arrow-left:after,
.mfp-arrow-left .mfp-a {
  border-right: 17px solid #FFF;
  margin-left: 31px;
}

.mfp-arrow-left:before,
.mfp-arrow-left .mfp-b {
  margin-left: 25px;
  border-right: 27px solid #3F3F3F;
}

.mfp-arrow-right {
  right: 0;
}

.mfp-arrow-right:after,
.mfp-arrow-right .mfp-a {
  border-left: 17px solid #FFF;
  margin-left: 39px;
}

.mfp-arrow-right:before,
.mfp-arrow-right .mfp-b {
  border-left: 27px solid #3F3F3F;
}

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px;
}

.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 900px;
}

.mfp-iframe-holder .mfp-close {
  top: -40px;
}

.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%;
}

.mfp-iframe-scaler iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #000;
}

/* Main image in popup */

img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto;
}

/* The shadow behind the image */

.mfp-figure {
  line-height: 0;
}

.mfp-figure:after {
  content: '';
  position: absolute;
  left: 0;
  top: 40px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #444;
}

.mfp-figure small {
  color: #BDBDBD;
  display: block;
  font-size: 12px;
  line-height: 14px;
}

.mfp-figure figure {
  margin: 0;
}

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto;
}

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #F3F3F3;
  word-wrap: break-word;
  padding-right: 36px;
}

.mfp-image-holder .mfp-content {
  max-width: 100%;
}

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer;
}

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
       * Remove all paddings around the image on small screen
       */

  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0;
  }

  .mfp-img-mobile img.mfp-img {
    padding: 0;
  }

  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0;
  }

  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px;
  }

  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    box-sizing: border-box;
  }

  .mfp-img-mobile .mfp-bottom-bar:empty {
    padding: 0;
  }

  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px;
  }

  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0;
  }
}

@media all and (max-width: 900px) {
  .mfp-arrow {
    -webkit-transform: scale(0.75);
    transform: scale(0.75);
  }

  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    transform-origin: 0;
  }

  .mfp-arrow-right {
    -webkit-transform-origin: 100%;
    transform-origin: 100%;
  }

  .mfp-container {
    padding-left: 6px;
    padding-right: 6px;
  }
}

.mfp-ie7 .mfp-img {
  padding: 0;
}

.mfp-ie7 .mfp-bottom-bar {
  width: 600px;
  left: 50%;
  margin-left: -300px;
  margin-top: 5px;
  padding-bottom: 5px;
}

.mfp-ie7 .mfp-container {
  padding: 0;
}

.mfp-ie7 .mfp-content {
  padding-top: 44px;
}

.mfp-ie7 .mfp-close {
  top: 0;
  right: 0;
  padding-top: 0;
}

/* Modular Scale: http://modularscale.com/scale/?px1=16&px2=100&ra1=1.618&ra2=0 */

/*
@font-face {
    font-family: "FSAlbertWebRegular";
    src: url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Regular.eot?1d666a136b3b');
    src: url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Regular.eot?&1d666a136b3b#iefix') format("embedded-opentype"),
         url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Regular.woff?9ac1c9ac3927') format("woff"),
         url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Regular.woff2?da98ad066622') format("woff2"),
         url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Regular.ttf?968e86901436') format("truetype"),
         url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Regular.svg?5434b0fc7ac8#FSAlbertWebRegular') format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "FSAlbertWebBold";
    src: url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Bold.eot?8cf3e2f287ed');
    src: url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Bold.eot?&8cf3e2f287ed#iefix') format("embedded-opentype"),
         url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Bold.woff?34a843a63c12') format("woff"),
         url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Bold.woff2?51941ef8b76d') format("woff2"),
         url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Bold.ttf?543b71873c25') format("truetype"),
         url('/today/static/web/fonts/fs-albert/FSAlbertWeb-Bold.svg?9be3e743be5a#FSAlbertWebBold') format("svg");
    font-weight: normal;
    font-style: normal;
}
*/

@font-face {
  font-family: "Telkom123-Regular";
  src: url('/today/static/web/fonts/telkom123/Telkom123-Regular.eot?8741b8991dc3');
  src: url('/today/static/web/fonts/telkom123/Telkom123-Regular.eot?&8741b8991dc3#iefix') format("embedded-opentype"), url('/today/static/web/fonts/telkom123/Telkom123-Regular.woff?f3b9b6dcec88') format("woff"), url('/today/static/web/fonts/telkom123/Telkom123-Regular.ttf?c6ad47d5237f') format("truetype"), url('/today/static/web/fonts/telkom123/Telkom123-Regular.svg?18648ff38c98#Telkom123-Regular') format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Telkom123-Bold";
  src: url('/today/static/web/fonts/telkom123/Telkom123-Bold.eot?22eac8f715f4');
  src: url('/today/static/web/fonts/telkom123/Telkom123-Bold.eot?&22eac8f715f4#iefix') format("embedded-opentype"), url('/today/static/web/fonts/telkom123/Telkom123-Bold.woff?55a8e7588409') format("woff"), url('/today/static/web/fonts/telkom123/Telkom123-Bold.ttf?f477073ba6a3') format("truetype"), url('/today/static/web/fonts/telkom123/Telkom123-Bold.svg?fef6bc5f0717#Telkom123-Bold') format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Telkom123-Italic";
  src: url('/today/static/web/fonts/telkom123/Telkom123-RegularItalic.eot?006526f33dc0');
  src: url('/today/static/web/fonts/telkom123/Telkom123-RegularItalic.eot?&006526f33dc0#iefix') format("embedded-opentype"), url('/today/static/web/fonts/telkom123/Telkom123-RegularItalic.woff?196e2a366527') format("woff"), url('/today/static/web/fonts/telkom123/Telkom123-RegularItalic.ttf?0b61b919cc10') format("truetype"), url('/today/static/web/fonts/telkom123/Telkom123-RegularItalic.svg?b6a87586ef98#Telkom123-RegularItalic') format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Telkom123-Light";
  src: url('/today/static/web/fonts/telkom123/Telkom123-Light.eot?7d66906f7f23');
  src: url('/today/static/web/fonts/telkom123/Telkom123-Light.eot?&7d66906f7f23#iefix') format("embedded-opentype"), url('/today/static/web/fonts/telkom123/Telkom123-Light.woff?e48e433152c8') format("woff"), url('/today/static/web/fonts/telkom123/Telkom123-Light.ttf?4069e4fbefcc') format("truetype"), url('/today/static/web/fonts/telkom123/Telkom123-Light.svg?332cacd28dac#Telkom123-Light') format("svg");
  font-weight: normal;
  font-style: normal;
}

/********************************/

/*  GLOBAL SETTINGS & OVERRIDES */

html {
  font-family: "Telkom123-Regular", sans-serif;
  font-size: 16px;
}

@media (min-width: 20em) {
  html {
    font-size: 14px;
  }
}

@media (min-width: 48em) {
  html {
    font-size: 14px;
  }
}

@media (min-width: 62em) {
  html {
    font-size: 14px;
  }
}

@media (min-width: 75em) {
  html {
    font-size: 14px;
  }
}

@media (min-width: 120em) {
  html {
    font-size: 16px;
  }
}

@media (min-width: 160em) {
  html {
    font-size: 18px;
  }
}

@media (min-width: 210em) {
  html {
    font-size: 26px;
  }
}

html,
body {
  background: #ffffff;
  color: #889391;
}

body {
  overflow-x: hidden;
}

a,
button,
input[type="text"],
input[type="password"],
input[type="submit"],
textarea {
  outline: none;
  -webkit-border-radius: 0px;
  -webkit-appearance: none;
}

canvas,
div,
img {
  outline: none;
}

img {
  max-width: 100%;
}

img[data-sizes="auto"] {
  display: block;
  width: 100%;
  margin: auto;
}

picture img {
  width: 100%;
}

* {
  -webkit-font-smoothing: antialiased;
}

*,
*:before,
*:after {
  box-sizing: border-box;
}

noscript {
  display: none;
}

.hidden {
  display: none;
}

.visible {
  display: block;
}

/* CHARTS */

.ct-chart .ct-label,
.ct-chart .ct-label.ct-vertical,
.ct-chart .ct-label.ct-horizontal {
  font-size: 9.6px;
  font-size: 0.6rem;
  font-weight: bold;
  color: #ffffff;
  fill: #ffffff;
}

.ct-chart .ct-label.ct-vertical,
.ct-chart .ct-label.ct-horizontal {
  color: #d5d5d5;
  fill: #d5d5d5;
}

/********************************/

/*  HOME and GENERAL CONTAINERS */

/* CONTENT */

#content {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

#content {
  *zoom: 1;
}

#content:before,
#content:after {
  content: "";
  display: table;
}

#content:after {
  clear: both;
}

#content:after {
  content: "";
  display: block;
  clear: both;
}

/* LOADER */

.ajax-loader {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 80px;
  padding-top: 5rem;
  padding-bottom: 80px;
  padding-bottom: 5rem;
  position: relative;
}

.ajax-loader {
  *zoom: 1;
}

.ajax-loader:before,
.ajax-loader:after {
  content: "";
  display: table;
}

.ajax-loader:after {
  clear: both;
}

.js-shop-listing-sliders {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

/* ROWS */

.row {
  display: block;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-left: 24px;
  padding-left: 1.5rem;
  padding-right: 24px;
  padding-right: 1.5rem;
  /*@include mq($mq-tablet){
			@include rem-fallback(padding-left, ms(1));
			@include rem-fallback(padding-right, ms(1));
		}

		@include mq($mq-desktop){
			@include rem-fallback(padding-left, ms(1));
			@include rem-fallback(padding-right, ms(1));
		}*/
}

@media (min-width: 48em) {
  .row {
    padding-left: 5%;
    padding-right: 5%;
  }
}

.row .hero {
  padding: 32px;
  padding: 2rem;
}

.row .foundry-listing-horizontal {
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
}

.row .foundry-listing-horizontal h2 {
  margin: 0;
  line-height: 24px;
  line-height: 1.5rem;
}

.row:nth-of-type(2n + 2) {
  background-color: #f7f7f6;
}

.row:nth-of-type(2n + 2) .help-tools .item.on,
.row:nth-of-type(2n + 2) .shop-listing-slider .item.on {
  background-color: #ffffff;
  border: 1px solid #e8e7e7;
  border-bottom: 0;
}

.row:nth-of-type(2n + 2) .help-tools .item.on.deselect,
.row:nth-of-type(2n + 2) .shop-listing-slider .item.on.deselect {
  border-color: #f7f7f6;
  background-color: #f7f7f6;
}

.row:nth-of-type(2n + 2) .item.ghost:after {
  background-color: #f7f7f6;
}

.row.white {
  background-color: #ffffff;
}

.row.white .ghost:after {
  background-color: #ffffff;
}

.row.blue {
  background-color: #005e9b;
}

.row.lightblue {
  background-color: #0072a9;
}

.row.search-help {
  background-color: #0083c2;
}

.row:after {
  content: "";
  clear: both;
  display: block;
}

.highlight {
  background: #f7f7f6;
}

.highlight .help-get .item,
.highlight .shop-listing-slider .item {
  border: 1px solid #f7f7f6;
  border-bottom: 0;
}

.highlight .help-get .item.on,
.highlight .shop-listing-slider .item.on {
  background: #ffffff;
  border-color: #e8e7e7;
}

.highlight .ghost:after {
  background-color: #f7f7f6;
}

.hide-overflow {
  overflow-x: hidden;
}

.clearfix {
  *zoom: 1;
}

.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}

.clearfix:after {
  clear: both;
}

@media (max-width: 48em) {
  .clearfix-small {
    *zoom: 1;
  }

  .clearfix-small:before,
  .clearfix-small:after {
    content: "";
    display: table;
  }

  .clearfix-small:after {
    clear: both;
  }
}

@media (min-width: 48em) and (max-width: 62em) {
  .clearfix-tablet {
    *zoom: 1;
  }

  .clearfix-tablet:before,
  .clearfix-tablet:after {
    content: "";
    display: table;
  }

  .clearfix-tablet:after {
    clear: both;
  }
}

@media (min-width: 62em) and (max-width: 75em) {
  .clearfix-desktop {
    *zoom: 1;
  }

  .clearfix-desktop:before,
  .clearfix-desktop:after {
    content: "";
    display: table;
  }

  .clearfix-desktop:after {
    clear: both;
  }
}

@media (min-width: 75em) {
  .clearfix-large {
    *zoom: 1;
  }

  .clearfix-large:before,
  .clearfix-large:after {
    content: "";
    display: table;
  }

  .clearfix-large:after {
    clear: both;
  }
}

.icon {
  background-position: 50%;
  background-size: 16px;
  background-size: 1rem;
}

.owl-theme .owl-controls .owl-nav div,
.owl-theme .owl-controls .owl-buttons div {
  width: 24px;
  width: 1.5rem;
  height: 48px;
  height: 3rem;
  background: transparent;
  padding: 0;
  margin: 0 !important;
  margin: auto !important;
  display: block;
  position: absolute;
  top: -27% !important;
  bottom: 0 !important;
  overflow: hidden;
  text-indent: -999px;
}

.owl-prev {
  background: url('/today/static/web/img/owl-prev.png?bafd7223c44e') no-repeat !important;
  left: -8px;
  left: -0.5rem;
}

@media (min-width: 48em) {
  .owl-prev {
    left: -20px;
    left: -1.25rem;
  }
}

.owl-next {
  background: url('/today/static/web/img/owl-next.png?7fec08b7980a') no-repeat !important;
  right: -8px;
  right: -0.5rem;
}

@media (min-width: 48em) {
  .owl-next {
    right: -20px;
    right: -1.25rem;
  }
}

.owl-controls {
  margin: 0 !important;
}

@media (min-width: 90.0625em) {
  .hero-wrapper,
  .drawer,
  .shop-listing-slider,
  .page-title,
  .drop-title h1,
  .nav-hero,
  .foundry-listing-unique-selling-point,
  footer nav,
  .wrapper {
    max-width: 90.0625em !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

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

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

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

.no-margin-right {
  margin-right: 0 !important;
}

.no-margin-left {
  margin-left: 0 !important;
}

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

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

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

.no-padding-right {
  padding-right: 0 !important;
}

.no-padding-left {
  padding-left: 0 !important;
}

.iframe-full {
  width: 100%;
  height: 100%;
  border: 0;
}

#outdatedbrowser {
  width: 100%;
  padding: 24px;
  padding: 1.5rem;
  position: relative;
  background: #0083c2;
}

#outdatedbrowser .icon-logo {
  width: 147px;
  height: 45px;
  margin-left: 0;
  background-image: url('/today/static/web/img/logo.png?28f191a25551');
  display: block;
}

#outdatedbrowser .container {
  max-width: 90.0625em !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#outdatedbrowser .icon-close {
  width: 24px;
  width: 1.5rem;
  height: 24px;
  height: 1.5rem;
  position: absolute;
  top: 36px;
  top: 2.25rem;
  bottom: 0;
  right: 24px;
  right: 1.5rem;
  background-size: 24px;
  background-size: 1.5rem;
}

#outdatedbrowser h1 {
  font-size: 92px;
  font-size: 5.75rem;
  line-height: 98.9px;
  line-height: 6.18125rem;
  font-family: "Telkom123-Bold", sans-serif;
  letter-spacing: -1px;
  letter-spacing: -0.0625rem;
  text-transform: uppercase;
  color: #ffffff;
}

#outdatedbrowser h2 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 25.8px;
  line-height: 1.6125rem;
  text-transform: uppercase;
  color: #ffffff;
}

.site-overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  display: none;
  z-index: 999;
  background: #000000;
  opacity: 0.7;
}

/* Atoms */

/******************************/

/*  #7 - Animations */

/******************************/

.animate {
  width: 8em;
  height: 5em;
  margin: 0 1em 0 0;
  display: inline-block;
  position: relative;
  background: #0083c2;
  color: #ffffff;
  text-align: center;
  line-height: 5em;
}

.animate:hover {
  -webkit-animation: spin-me 3s 1;
  animation: spin-me 3s 1;
}

@-webkit-keyframes spin-me {
  from {
    background: #0083c2;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    background: #005e9b;
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes spin-me {
  from {
    background: #0083c2;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    background: #005e9b;
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/******************************/

/*  TRANSITIONS */

.transition {
  width: 8em;
  height: 5em;
  padding: 1em;
  display: inline-block;
  background: #0083c2;
  color: #ffffff;
  text-align: center;
  line-height: 3em;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
}

.transition:hover {
  background: #005e9b;
}

@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes flash {
  from {
    opacity: 1;
  }

  to {
    opacity: 0.5;
  }
}

@keyframes flash {
  from {
    opacity: 1;
  }

  to {
    opacity: 0.5;
  }
}

.Breadcrumb {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 1rem 1.5rem;
  background-color: #005e9b;
  line-height: 0;
}

.Breadcrumb {
  *zoom: 1;
}

.Breadcrumb:before,
.Breadcrumb:after {
  content: "";
  display: table;
}

.Breadcrumb:after {
  clear: both;
}

@media (min-width: 48em) {
  .Breadcrumb {
    padding: 1.5rem 2.25rem;
  }
}

.Breadcrumb-item {
  display: inline-block;
  -webkit-transition: color .3s ease-in-out;
  transition: color .3s ease-in-out;
  color: #8addff;
  font-size: 0.66667rem;
  text-decoration: none;
}

@media (min-width: 48em) {
  .Breadcrumb-item {
    font-size: 1rem;
  }
}

.Breadcrumb-item:hover:not(.is-current) {
  color: #2695cb;
}

.Breadcrumb-item.is-current {
  color: #ffffff;
  cursor: default;
}

.Breadcrumb-item + .Breadcrumb-item {
  position: relative;
  margin-left: -3px;
}

.Breadcrumb-item + .Breadcrumb-item:before {
  display: inline-block;
  width: .5rem;
  height: .5rem;
  margin: 0 0.66667rem;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  content: "";
  vertical-align: middle;
}

@media (min-width: 48em) {
  .Breadcrumb-item + .Breadcrumb-item:before {
    margin: 0 1rem;
  }
}

/******************************/

/*  #8 - Buttons */

/******************************/

a[class*="btn-"],
button[class*="btn-"],
input[class*="btn-"],
span[class*="btn-"],
a[class*="pill-"],
button[class*="pill-"],
input[class*="pill-"],
span[class*="pill-"],
.btn-primary,
.btn-secondary,
.brochure-faqs .content .open-answer {
  padding-top: 9.6px;
  padding-top: 0.6rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-bottom: 11.2px;
  padding-bottom: 0.7rem;
  padding-left: 16px;
  padding-left: 1rem;
  font-size: 11.2px;
  font-size: 0.7rem;
  line-height: 14.4px;
  line-height: 0.9rem;
  display: inline-block;
  font-family: "Telkom123-Bold", sans-serif;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid transparent;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  word-spacing: 1px;
  word-spacing: 0.0625rem;
  letter-spacing: 0.288px;
  letter-spacing: 0.018rem;
}

a[class*="icon-"][class*="btn-"],
button[class*="icon-"][class*="btn-"],
input[class*="icon-"][class*="btn-"],
span[class*="icon-"][class*="btn-"],
a[class*="icon-"][class*="pill-"],
button[class*="icon-"][class*="pill-"],
input[class*="icon-"][class*="pill-"],
span[class*="icon-"][class*="pill-"],
[class*="icon-"].btn-primary,
[class*="icon-"].btn-secondary,
.brochure-faqs .content [class*="icon-"].open-answer {
  background-size: 4.8px;
  background-size: 0.3rem;
}

a[class*="right"][class*="btn-"],
button[class*="right"][class*="btn-"],
input[class*="right"][class*="btn-"],
span[class*="right"][class*="btn-"],
a[class*="right"][class*="pill-"],
button[class*="right"][class*="pill-"],
input[class*="right"][class*="pill-"],
span[class*="right"][class*="pill-"],
[class*="right"].btn-primary,
[class*="right"].btn-secondary,
.brochure-faqs .content [class*="right"].open-answer,
a[class*="down"][class*="btn-"],
button[class*="down"][class*="btn-"],
input[class*="down"][class*="btn-"],
span[class*="down"][class*="btn-"],
a[class*="down"][class*="pill-"],
button[class*="down"][class*="pill-"],
input[class*="down"][class*="pill-"],
span[class*="down"][class*="pill-"],
[class*="down"].btn-primary,
[class*="down"].btn-secondary,
.brochure-faqs .content [class*="down"].open-answer,
a[class*="up"][class*="btn-"],
button[class*="up"][class*="btn-"],
input[class*="up"][class*="btn-"],
span[class*="up"][class*="btn-"],
a[class*="up"][class*="pill-"],
button[class*="up"][class*="pill-"],
input[class*="up"][class*="pill-"],
span[class*="up"][class*="pill-"],
[class*="up"].btn-primary,
[class*="up"].btn-secondary,
.brochure-faqs .content [class*="up"].open-answer {
  padding-right: 35.2px;
  padding-right: 2.2rem;
  background-position-x: 85%;
  background-position-y: center;
  background-position: right 0.8rem center;
  text-align: left;
}

a[class*="left"][class*="btn-"],
button[class*="left"][class*="btn-"],
input[class*="left"][class*="btn-"],
span[class*="left"][class*="btn-"],
a[class*="left"][class*="pill-"],
button[class*="left"][class*="pill-"],
input[class*="left"][class*="pill-"],
span[class*="left"][class*="pill-"],
[class*="left"].btn-primary,
[class*="left"].btn-secondary,
.brochure-faqs .content [class*="left"].open-answer {
  padding-left: 35.2px;
  padding-left: 2.2rem;
  background-position-x: 15%;
  background-position-y: center;
  background-position: left 1rem center;
  text-align: right;
}

a[disabled][class*="btn-"],
button[disabled][class*="btn-"],
input[disabled][class*="btn-"],
span[disabled][class*="btn-"],
a[disabled][class*="pill-"],
button[disabled][class*="pill-"],
input[disabled][class*="pill-"],
span[disabled][class*="pill-"],
[disabled].btn-primary,
[disabled].btn-secondary,
.brochure-faqs .content [disabled].open-answer {
  background-color: #f7f7f7 !important;
  color: #889391 !important;
  border-color: #e8e7e7 !important;
  background-image: none !important;
  opacity: 0.5;
  pointer-events: none;
  cursor: default;
}

a[class*="btn-"]:focus,
button[class*="btn-"]:focus,
input[class*="btn-"]:focus,
span[class*="btn-"]:focus,
a[class*="pill-"]:focus,
button[class*="pill-"]:focus,
input[class*="pill-"]:focus,
span[class*="pill-"]:focus,
.btn-primary:focus,
.btn-secondary:focus,
.brochure-faqs .content .open-answer:focus {
  -webkit-transform: scale(1.02);
  transform: scale(1.02);
}

a[class*="block"],
button[class*="block"],
input[class*="block"],
span[class*="block"] {
  width: 100% !important;
}

a[class*="btn-invert"],
button[class*="btn-invert"],
input[class*="btn-invert"],
span[class*="btn-invert"] {
  margin: 1em 0;
  background-color: transparent;
}

a[class*="btn-invert"]:hover,
button[class*="btn-invert"]:hover,
input[class*="btn-invert"]:hover,
span[class*="btn-invert"]:hover {
  background-color: transparent;
}

a[class*="btn-invert"][disabled],
button[class*="btn-invert"][disabled],
input[class*="btn-invert"][disabled],
span[class*="btn-invert"][disabled] {
  padding-top: 12.8px;
  padding-top: 0.8rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-bottom: 8.64px;
  padding-bottom: 0.54rem;
  padding-left: 16px;
  padding-left: 1rem;
}

a[class*="btn-bordered"],
button[class*="btn-bordered"],
input[class*="btn-bordered"],
span[class*="btn-bordered"] {
  border: 1px solid;
  background-color: transparent;
}

a[class*="btn-bordered"]:hover,
button[class*="btn-bordered"]:hover,
input[class*="btn-bordered"]:hover,
span[class*="btn-bordered"]:hover {
  background-color: transparent;
}

a[class*="pill-"],
button[class*="pill-"],
input[class*="pill-"],
span[class*="pill-"] {
  border-radius: 80px;
  border-radius: 5rem;
  color: #889391;
}

a[class*="pill-"].full,
a[class*="pill-"].full:hover,
a[class*="pill-"].active,
a[class*="pill-"].active:hover,
button[class*="pill-"].full,
button[class*="pill-"].full:hover,
button[class*="pill-"].active,
button[class*="pill-"].active:hover,
input[class*="pill-"].full,
input[class*="pill-"].full:hover,
input[class*="pill-"].active,
input[class*="pill-"].active:hover,
span[class*="pill-"].full,
span[class*="pill-"].full:hover,
span[class*="pill-"].active,
span[class*="pill-"].active:hover {
  color: #ffffff;
}

.btn-white {
  color: #ffffff;
  background-color: #ffffff;
}

.btn-white:hover {
  color: #ffffff;
  background-color: #bfbfbf;
}

.btn-invert-white {
  color: #ffffff;
}

.btn-invert-white:hover {
  color: #bfbfbf;
}

.btn-bordered-white {
  color: #ffffff;
  border-color: #ffffff;
}

.btn-bordered-white:hover {
  color: #bfbfbf;
  border-color: #bfbfbf;
}

.pill-white:hover {
  color: #bfbfbf;
}

.pill-white.active {
  background-color: #ffffff;
}

.pill-white.full {
  background-color: #ffffff;
}

.pill-white.full:hover {
  background-color: #bfbfbf;
}

.btn-blue {
  color: #ffffff;
  background-color: #0083c2;
}

.btn-blue:hover {
  color: #ffffff;
  background-color: #005e9b;
}

.btn-invert-blue {
  color: #0083c2;
}

.btn-invert-blue:hover {
  color: #005e9b;
}

.btn-bordered-blue {
  color: #0083c2;
  border-color: #0083c2;
}

.btn-bordered-blue:hover {
  color: #005e9b;
  border-color: #005e9b;
}

.pill-blue:hover {
  color: #005e9b;
}

.pill-blue.active {
  background-color: #0083c2;
}

.pill-blue.full {
  background-color: #0083c2;
}

.pill-blue.full:hover {
  background-color: #005e9b;
}

.btn-blue-alt {
  color: #ffffff;
  background-color: #0083c2;
}

.btn-blue-alt:hover {
  color: #ffffff;
  background-color: #2695cb;
}

.btn-invert-blue-alt {
  color: #0083c2;
}

.btn-invert-blue-alt:hover {
  color: #2695cb;
}

.btn-bordered-blue-alt {
  color: #0083c2;
  border-color: #0083c2;
}

.btn-bordered-blue-alt:hover {
  color: #2695cb;
  border-color: #2695cb;
}

.pill-blue-alt:hover {
  color: #2695cb;
}

.pill-blue-alt.active {
  background-color: #0083c2;
}

.pill-blue-alt.full {
  background-color: #0083c2;
}

.pill-blue-alt.full:hover {
  background-color: #2695cb;
}

.btn-blue-dark {
  color: #ffffff;
  background-color: #005e9b;
}

.btn-blue-dark:hover {
  color: #ffffff;
  background-color: #006db5;
}

.btn-invert-blue-dark {
  color: #005e9b;
}

.btn-invert-blue-dark:hover {
  color: #006db5;
}

.btn-bordered-blue-dark {
  color: #005e9b;
  border-color: #005e9b;
}

.btn-bordered-blue-dark:hover {
  color: #006db5;
  border-color: #006db5;
}

.pill-blue-dark:hover {
  color: #006db5;
}

.pill-blue-dark.active {
  background-color: #005e9b;
}

.pill-blue-dark.full {
  background-color: #005e9b;
}

.pill-blue-dark.full:hover {
  background-color: #006db5;
}

.btn-pink {
  color: #ffffff;
  background-color: #da1b60;
}

.btn-pink:hover {
  color: #ffffff;
  background-color: #961342;
}

.btn-invert-pink {
  color: #da1b60;
}

.btn-invert-pink:hover {
  color: #961342;
}

.btn-bordered-pink {
  color: #da1b60;
  border-color: #da1b60;
}

.btn-bordered-pink:hover {
  color: #961342;
  border-color: #961342;
}

.pill-pink:hover {
  color: #961342;
}

.pill-pink.active {
  background-color: #da1b60;
}

.pill-pink.full {
  background-color: #da1b60;
}

.pill-pink.full:hover {
  background-color: #961342;
}

.btn-orange {
  color: #ffffff;
  background-color: #f04e23;
}

.btn-orange:hover {
  color: #ffffff;
  background-color: #ba310d;
}

.btn-invert-orange {
  color: #f04e23;
}

.btn-invert-orange:hover {
  color: #ba310d;
}

.btn-bordered-orange {
  color: #f04e23;
  border-color: #f04e23;
}

.btn-bordered-orange:hover {
  color: #ba310d;
  border-color: #ba310d;
}

.pill-orange:hover {
  color: #ba310d;
}

.pill-orange.active {
  background-color: #f04e23;
}

.pill-orange.full {
  background-color: #f04e23;
}

.pill-orange.full:hover {
  background-color: #ba310d;
}

.btn-cyan {
  color: #ffffff;
  background-color: #00d0ff;
}

.btn-cyan:hover {
  color: #ffffff;
  background-color: #007d99;
}

.btn-invert-cyan {
  color: #00d0ff;
}

.btn-invert-cyan:hover {
  color: #007d99;
}

.btn-bordered-cyan {
  color: #00d0ff;
  border-color: #00d0ff;
}

.btn-bordered-cyan:hover {
  color: #007d99;
  border-color: #007d99;
}

.pill-cyan:hover {
  color: #007d99;
}

.pill-cyan.active {
  background-color: #00d0ff;
}

.pill-cyan.full {
  background-color: #00d0ff;
}

.pill-cyan.full:hover {
  background-color: #007d99;
}

.btn-green {
  color: #ffffff;
  background-color: #00a850;
}

.btn-green:hover {
  color: #ffffff;
  background-color: #005c2c;
}

.btn-invert-green {
  color: #00a850;
}

.btn-invert-green:hover {
  color: #005c2c;
}

.btn-bordered-green {
  color: #00a850;
  border-color: #00a850;
}

.btn-bordered-green:hover {
  color: #005c2c;
  border-color: #005c2c;
}

.pill-green:hover {
  color: #005c2c;
}

.pill-green.active {
  background-color: #00a850;
}

.pill-green.full {
  background-color: #00a850;
}

.pill-green.full:hover {
  background-color: #005c2c;
}

.btn-lime {
  color: #ffffff;
  background-color: #bfd730;
}

.btn-lime:hover {
  color: #ffffff;
  background-color: #8a9c1e;
}

.btn-invert-lime {
  color: #bfd730;
}

.btn-invert-lime:hover {
  color: #8a9c1e;
}

.btn-bordered-lime {
  color: #bfd730;
  border-color: #bfd730;
}

.btn-bordered-lime:hover {
  color: #8a9c1e;
  border-color: #8a9c1e;
}

.pill-lime:hover {
  color: #8a9c1e;
}

.pill-lime.active {
  background-color: #bfd730;
}

.pill-lime.full {
  background-color: #bfd730;
}

.pill-lime.full:hover {
  background-color: #8a9c1e;
}

.btn-grey {
  color: #ffffff;
  background-color: #889391;
}

.btn-grey:hover {
  color: #ffffff;
  background-color: #626c6a;
}

.btn-invert-grey {
  color: #889391;
}

.btn-invert-grey:hover {
  color: #626c6a;
}

.btn-bordered-grey {
  color: #889391;
  border-color: #889391;
}

.btn-bordered-grey:hover {
  color: #626c6a;
  border-color: #626c6a;
}

.pill-grey:hover {
  color: #626c6a;
}

.pill-grey.active {
  background-color: #889391;
}

.pill-grey.full {
  background-color: #889391;
}

.pill-grey.full:hover {
  background-color: #626c6a;
}

.btn-grey-light {
  color: #ffffff;
  background-color: #cccccc;
}

.btn-grey-light:hover {
  color: #ffffff;
  background-color: #d5d5d5;
}

.btn-invert-grey-light {
  color: #cccccc;
}

.btn-invert-grey-light:hover {
  color: #d5d5d5;
}

.btn-bordered-grey-light {
  color: #cccccc;
  border-color: #cccccc;
}

.btn-bordered-grey-light:hover {
  color: #d5d5d5;
  border-color: #d5d5d5;
}

.pill-grey-light:hover {
  color: #d5d5d5;
}

.pill-grey-light.active {
  background-color: #cccccc;
}

.pill-grey-light.full {
  background-color: #cccccc;
}

.pill-grey-light.full:hover {
  background-color: #d5d5d5;
}

.btn-black {
  color: #ffffff;
  background-color: #000000;
}

.btn-black:hover {
  color: #ffffff;
  background-color: #777777;
}

.btn-invert-black {
  color: #000000;
}

.btn-invert-black:hover {
  color: #777777;
}

.btn-bordered-black {
  color: #000000;
  border-color: #000000;
}

.btn-bordered-black:hover {
  color: #777777;
  border-color: #777777;
}

.pill-black:hover {
  color: #777777;
}

.pill-black.active {
  background-color: #000000;
}

.pill-black.full {
  background-color: #000000;
}

.pill-black.full:hover {
  background-color: #777777;
}

.btn-ci-blue-dark {
  color: #ffffff;
  background-color: #141B4D;
}

.btn-ci-blue-dark:hover {
  color: #ffffff;
  background-color: #24308a;
}

.btn-invert-ci-blue-dark {
  color: #141B4D;
}

.btn-invert-ci-blue-dark:hover {
  color: #24308a;
}

.btn-bordered-ci-blue-dark {
  color: #141B4D;
  border-color: #141B4D;
}

.btn-bordered-ci-blue-dark:hover {
  color: #24308a;
  border-color: #24308a;
}

.pill-ci-blue-dark:hover {
  color: #24308a;
}

.pill-ci-blue-dark.active {
  background-color: #141B4D;
}

.pill-ci-blue-dark.full {
  background-color: #141B4D;
}

.pill-ci-blue-dark.full:hover {
  background-color: #24308a;
}

.btn-ci-blue-mid {
  color: #ffffff;
  background-color: #0033A0;
}

.btn-ci-blue-mid:hover {
  color: #ffffff;
  background-color: #004bed;
}

.btn-invert-ci-blue-mid {
  color: #0033A0;
}

.btn-invert-ci-blue-mid:hover {
  color: #004bed;
}

.btn-bordered-ci-blue-mid {
  color: #0033A0;
  border-color: #0033A0;
}

.btn-bordered-ci-blue-mid:hover {
  color: #004bed;
  border-color: #004bed;
}

.pill-ci-blue-mid:hover {
  color: #004bed;
}

.pill-ci-blue-mid.active {
  background-color: #0033A0;
}

.pill-ci-blue-mid.full {
  background-color: #0033A0;
}

.pill-ci-blue-mid.full:hover {
  background-color: #004bed;
}

.btn-ci-blue-light {
  color: #ffffff;
  background-color: #5BC2E7;
}

.btn-ci-blue-light:hover {
  color: #ffffff;
  background-color: #9edbf1;
}

.btn-invert-ci-blue-light {
  color: #5BC2E7;
}

.btn-invert-ci-blue-light:hover {
  color: #9edbf1;
}

.btn-bordered-ci-blue-light {
  color: #5BC2E7;
  border-color: #5BC2E7;
}

.btn-bordered-ci-blue-light:hover {
  color: #9edbf1;
  border-color: #9edbf1;
}

.pill-ci-blue-light:hover {
  color: #9edbf1;
}

.pill-ci-blue-light.active {
  background-color: #5BC2E7;
}

.pill-ci-blue-light.full {
  background-color: #5BC2E7;
}

.pill-ci-blue-light.full:hover {
  background-color: #9edbf1;
}

.btn-ci-purple {
  color: #ffffff;
  background-color: #84329B;
}

.btn-ci-purple:hover {
  color: #ffffff;
  background-color: #ae52c7;
}

.btn-invert-ci-purple {
  color: #84329B;
}

.btn-invert-ci-purple:hover {
  color: #ae52c7;
}

.btn-bordered-ci-purple {
  color: #84329B;
  border-color: #84329B;
}

.btn-bordered-ci-purple:hover {
  color: #ae52c7;
  border-color: #ae52c7;
}

.pill-ci-purple:hover {
  color: #ae52c7;
}

.pill-ci-purple.active {
  background-color: #84329B;
}

.pill-ci-purple.full {
  background-color: #84329B;
}

.pill-ci-purple.full:hover {
  background-color: #ae52c7;
}

.btn-ci-teal {
  color: #ffffff;
  background-color: #00B2A9;
}

.btn-ci-teal:hover {
  color: #ffffff;
  background-color: #00fff2;
}

.btn-invert-ci-teal {
  color: #00B2A9;
}

.btn-invert-ci-teal:hover {
  color: #00fff2;
}

.btn-bordered-ci-teal {
  color: #00B2A9;
  border-color: #00B2A9;
}

.btn-bordered-ci-teal:hover {
  color: #00fff2;
  border-color: #00fff2;
}

.pill-ci-teal:hover {
  color: #00fff2;
}

.pill-ci-teal.active {
  background-color: #00B2A9;
}

.pill-ci-teal.full {
  background-color: #00B2A9;
}

.pill-ci-teal.full:hover {
  background-color: #00fff2;
}

.btn-ci-teal-light {
  color: #ffffff;
  background-color: #ADCAB8;
}

.btn-ci-teal-light:hover {
  color: #ffffff;
  background-color: #dbe8e0;
}

.btn-invert-ci-teal-light {
  color: #ADCAB8;
}

.btn-invert-ci-teal-light:hover {
  color: #dbe8e0;
}

.btn-bordered-ci-teal-light {
  color: #ADCAB8;
  border-color: #ADCAB8;
}

.btn-bordered-ci-teal-light:hover {
  color: #dbe8e0;
  border-color: #dbe8e0;
}

.pill-ci-teal-light:hover {
  color: #dbe8e0;
}

.pill-ci-teal-light.active {
  background-color: #ADCAB8;
}

.pill-ci-teal-light.full {
  background-color: #ADCAB8;
}

.pill-ci-teal-light.full:hover {
  background-color: #dbe8e0;
}

.btn-ci-green {
  color: #ffffff;
  background-color: #84BD00;
}

.btn-ci-green:hover {
  color: #ffffff;
  background-color: #b5ff0b;
}

.btn-invert-ci-green {
  color: #84BD00;
}

.btn-invert-ci-green:hover {
  color: #b5ff0b;
}

.btn-bordered-ci-green {
  color: #84BD00;
  border-color: #84BD00;
}

.btn-bordered-ci-green:hover {
  color: #b5ff0b;
  border-color: #b5ff0b;
}

.pill-ci-green:hover {
  color: #b5ff0b;
}

.pill-ci-green.active {
  background-color: #84BD00;
}

.pill-ci-green.full {
  background-color: #84BD00;
}

.pill-ci-green.full:hover {
  background-color: #b5ff0b;
}

.btn-ci-green-dark {
  color: #ffffff;
  background-color: #009639;
}

.btn-ci-green-dark:hover {
  color: #ffffff;
  background-color: #00e356;
}

.btn-invert-ci-green-dark {
  color: #009639;
}

.btn-invert-ci-green-dark:hover {
  color: #00e356;
}

.btn-bordered-ci-green-dark {
  color: #009639;
  border-color: #009639;
}

.btn-bordered-ci-green-dark:hover {
  color: #00e356;
  border-color: #00e356;
}

.pill-ci-green-dark:hover {
  color: #00e356;
}

.pill-ci-green-dark.active {
  background-color: #009639;
}

.pill-ci-green-dark.full {
  background-color: #009639;
}

.pill-ci-green-dark.full:hover {
  background-color: #00e356;
}

.btn-ci-green-light {
  color: #ffffff;
  background-color: #C7E995;
}

.btn-ci-green-light:hover {
  color: #ffffff;
  background-color: #e8f6d4;
}

.btn-invert-ci-green-light {
  color: #C7E995;
}

.btn-invert-ci-green-light:hover {
  color: #e8f6d4;
}

.btn-bordered-ci-green-light {
  color: #C7E995;
  border-color: #C7E995;
}

.btn-bordered-ci-green-light:hover {
  color: #e8f6d4;
  border-color: #e8f6d4;
}

.pill-ci-green-light:hover {
  color: #e8f6d4;
}

.pill-ci-green-light.active {
  background-color: #C7E995;
}

.pill-ci-green-light.full {
  background-color: #C7E995;
}

.pill-ci-green-light.full:hover {
  background-color: #e8f6d4;
}

.btn-ci-yellow {
  color: #ffffff;
  background-color: #FFCD00;
}

.btn-ci-yellow:hover {
  color: #ffffff;
  background-color: #ffdc4d;
}

.btn-invert-ci-yellow {
  color: #FFCD00;
}

.btn-invert-ci-yellow:hover {
  color: #ffdc4d;
}

.btn-bordered-ci-yellow {
  color: #FFCD00;
  border-color: #FFCD00;
}

.btn-bordered-ci-yellow:hover {
  color: #ffdc4d;
  border-color: #ffdc4d;
}

.pill-ci-yellow:hover {
  color: #ffdc4d;
}

.pill-ci-yellow.active {
  background-color: #FFCD00;
}

.pill-ci-yellow.full {
  background-color: #FFCD00;
}

.pill-ci-yellow.full:hover {
  background-color: #ffdc4d;
}

.btn-ci-yellow-dark {
  color: #ffffff;
  background-color: #FFC72C;
}

.btn-ci-yellow-dark:hover {
  color: #ffffff;
  background-color: #ffdb79;
}

.btn-invert-ci-yellow-dark {
  color: #FFC72C;
}

.btn-invert-ci-yellow-dark:hover {
  color: #ffdb79;
}

.btn-bordered-ci-yellow-dark {
  color: #FFC72C;
  border-color: #FFC72C;
}

.btn-bordered-ci-yellow-dark:hover {
  color: #ffdb79;
  border-color: #ffdb79;
}

.pill-ci-yellow-dark:hover {
  color: #ffdb79;
}

.pill-ci-yellow-dark.active {
  background-color: #FFC72C;
}

.pill-ci-yellow-dark.full {
  background-color: #FFC72C;
}

.pill-ci-yellow-dark.full:hover {
  background-color: #ffdb79;
}

.btn-ci-gold {
  color: #ffffff;
  background-color: #AC8400;
}

.btn-ci-gold:hover {
  color: #ffffff;
  background-color: #f9bf00;
}

.btn-invert-ci-gold {
  color: #AC8400;
}

.btn-invert-ci-gold:hover {
  color: #f9bf00;
}

.btn-bordered-ci-gold {
  color: #AC8400;
  border-color: #AC8400;
}

.btn-bordered-ci-gold:hover {
  color: #f9bf00;
  border-color: #f9bf00;
}

.pill-ci-gold:hover {
  color: #f9bf00;
}

.pill-ci-gold.active {
  background-color: #AC8400;
}

.pill-ci-gold.full {
  background-color: #AC8400;
}

.pill-ci-gold.full:hover {
  background-color: #f9bf00;
}

.btn-ci-orange {
  color: #ffffff;
  background-color: #DC4405;
}

.btn-ci-orange:hover {
  color: #ffffff;
  background-color: #fa6e33;
}

.btn-invert-ci-orange {
  color: #DC4405;
}

.btn-invert-ci-orange:hover {
  color: #fa6e33;
}

.btn-bordered-ci-orange {
  color: #DC4405;
  border-color: #DC4405;
}

.btn-bordered-ci-orange:hover {
  color: #fa6e33;
  border-color: #fa6e33;
}

.pill-ci-orange:hover {
  color: #fa6e33;
}

.pill-ci-orange.active {
  background-color: #DC4405;
}

.pill-ci-orange.full {
  background-color: #DC4405;
}

.pill-ci-orange.full:hover {
  background-color: #fa6e33;
}

.btn-ci-orange-light {
  color: #ffffff;
  background-color: #DE7C00;
}

.btn-ci-orange-light:hover {
  color: #ffffff;
  background-color: #ffa22c;
}

.btn-invert-ci-orange-light {
  color: #DE7C00;
}

.btn-invert-ci-orange-light:hover {
  color: #ffa22c;
}

.btn-bordered-ci-orange-light {
  color: #DE7C00;
  border-color: #DE7C00;
}

.btn-bordered-ci-orange-light:hover {
  color: #ffa22c;
  border-color: #ffa22c;
}

.pill-ci-orange-light:hover {
  color: #ffa22c;
}

.pill-ci-orange-light.active {
  background-color: #DE7C00;
}

.pill-ci-orange-light.full {
  background-color: #DE7C00;
}

.pill-ci-orange-light.full:hover {
  background-color: #ffa22c;
}

.btn-ci-red {
  color: #ffffff;
  background-color: #CB333B;
}

.btn-ci-red:hover {
  color: #ffffff;
  background-color: #db7075;
}

.btn-invert-ci-red {
  color: #CB333B;
}

.btn-invert-ci-red:hover {
  color: #db7075;
}

.btn-bordered-ci-red {
  color: #CB333B;
  border-color: #CB333B;
}

.btn-bordered-ci-red:hover {
  color: #db7075;
  border-color: #db7075;
}

.pill-ci-red:hover {
  color: #db7075;
}

.pill-ci-red.active {
  background-color: #CB333B;
}

.pill-ci-red.full {
  background-color: #CB333B;
}

.pill-ci-red.full:hover {
  background-color: #db7075;
}

.btn-ci-brown {
  color: #ffffff;
  background-color: #9E652E;
}

.btn-ci-brown:hover {
  color: #ffffff;
  background-color: #cb8b4d;
}

.btn-invert-ci-brown {
  color: #9E652E;
}

.btn-invert-ci-brown:hover {
  color: #cb8b4d;
}

.btn-bordered-ci-brown {
  color: #9E652E;
  border-color: #9E652E;
}

.btn-bordered-ci-brown:hover {
  color: #cb8b4d;
  border-color: #cb8b4d;
}

.pill-ci-brown:hover {
  color: #cb8b4d;
}

.pill-ci-brown.active {
  background-color: #9E652E;
}

.pill-ci-brown.full {
  background-color: #9E652E;
}

.pill-ci-brown.full:hover {
  background-color: #cb8b4d;
}

.btn-ci-brown-dark {
  color: #ffffff;
  background-color: #6B4C4C;
}

.btn-ci-brown-dark:hover {
  color: #ffffff;
  background-color: #976d6d;
}

.btn-invert-ci-brown-dark {
  color: #6B4C4C;
}

.btn-invert-ci-brown-dark:hover {
  color: #976d6d;
}

.btn-bordered-ci-brown-dark {
  color: #6B4C4C;
  border-color: #6B4C4C;
}

.btn-bordered-ci-brown-dark:hover {
  color: #976d6d;
  border-color: #976d6d;
}

.pill-ci-brown-dark:hover {
  color: #976d6d;
}

.pill-ci-brown-dark.active {
  background-color: #6B4C4C;
}

.pill-ci-brown-dark.full {
  background-color: #6B4C4C;
}

.pill-ci-brown-dark.full:hover {
  background-color: #976d6d;
}

.btn-ci-brown-dark-heavy {
  color: #ffffff;
  background-color: #6D4F47;
}

.btn-ci-brown-dark-heavy:hover {
  color: #ffffff;
  background-color: #9b7165;
}

.btn-invert-ci-brown-dark-heavy {
  color: #6D4F47;
}

.btn-invert-ci-brown-dark-heavy:hover {
  color: #9b7165;
}

.btn-bordered-ci-brown-dark-heavy {
  color: #6D4F47;
  border-color: #6D4F47;
}

.btn-bordered-ci-brown-dark-heavy:hover {
  color: #9b7165;
  border-color: #9b7165;
}

.pill-ci-brown-dark-heavy:hover {
  color: #9b7165;
}

.pill-ci-brown-dark-heavy.active {
  background-color: #6D4F47;
}

.pill-ci-brown-dark-heavy.full {
  background-color: #6D4F47;
}

.pill-ci-brown-dark-heavy.full:hover {
  background-color: #9b7165;
}

.btn-ci-metal {
  color: #ffffff;
  background-color: #425563;
}

.btn-ci-metal:hover {
  color: #ffffff;
  background-color: #617c91;
}

.btn-invert-ci-metal {
  color: #425563;
}

.btn-invert-ci-metal:hover {
  color: #617c91;
}

.btn-bordered-ci-metal {
  color: #425563;
  border-color: #425563;
}

.btn-bordered-ci-metal:hover {
  color: #617c91;
  border-color: #617c91;
}

.pill-ci-metal:hover {
  color: #617c91;
}

.pill-ci-metal.active {
  background-color: #425563;
}

.pill-ci-metal.full {
  background-color: #425563;
}

.pill-ci-metal.full:hover {
  background-color: #617c91;
}

.btn-ci-grey {
  color: #ffffff;
  background-color: #A2AAAD;
}

.btn-ci-grey:hover {
  color: #ffffff;
  background-color: #cbcfd1;
}

.btn-invert-ci-grey {
  color: #A2AAAD;
}

.btn-invert-ci-grey:hover {
  color: #cbcfd1;
}

.btn-bordered-ci-grey {
  color: #A2AAAD;
  border-color: #A2AAAD;
}

.btn-bordered-ci-grey:hover {
  color: #cbcfd1;
  border-color: #cbcfd1;
}

.pill-ci-grey:hover {
  color: #cbcfd1;
}

.pill-ci-grey.active {
  background-color: #A2AAAD;
}

.pill-ci-grey.full {
  background-color: #A2AAAD;
}

.pill-ci-grey.full:hover {
  background-color: #cbcfd1;
}

.btn-blue-darkest {
  color: #ffffff;
  background-color: #005e9b;
}

.btn-blue-darkest:hover {
  color: #ffffff;
  background-color: #006db5;
}

.btn-invert-blue-darkest {
  color: #005e9b;
}

.btn-invert-blue-darkest:hover {
  color: #006db5;
}

.btn-bordered-blue-darkest {
  color: #005e9b;
  border-color: #005e9b;
}

.btn-bordered-blue-darkest:hover {
  color: #006db5;
  border-color: #006db5;
}

.pill-blue-darkest:hover {
  color: #006db5;
}

.pill-blue-darkest.active {
  background-color: #005e9b;
}

.pill-blue-darkest.full {
  background-color: #005e9b;
}

.pill-blue-darkest.full:hover {
  background-color: #006db5;
}

.btn-primary {
  color: #ffffff;
  background-color: #0083c2;
  border: 1px solid #0072a9;
  display: block;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
}

.btn-primary:hover {
  color: #ffffff;
  background-color: #2695cb;
}

.btn-primary-pink {
  color: #ffffff;
  background-color: #da1b60;
  border: 1px solid #961342;
}

.btn-primary-pink:hover {
  color: #ffffff;
  background-color: #961342;
}

.btn-secondary {
  color: #0083c2;
  background-color: #f7f7f7;
  border: 1px solid #e8e7e7;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
}

.btn-secondary:hover {
  color: #0083c2;
  background-color: #fdfdfd;
}

[class*="extra-link"] {
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  font-size: 11.2px;
  font-size: 0.7rem;
  text-transform: uppercase;
  text-decoration: none;
}

.extra-link-blue {
  color: #0083c2;
}

.extra-link-grey {
  color: #889391;
}

.extra-link-right {
  float: right;
  color: #0083c2;
}

.btn-newsletter {
  color: #ffffff;
  background-color: #0072a9;
}

.btn-newsletter:hover {
  color: #ffffff;
  background-color: #005e9b;
}

.ie10 .icon-caret-right,
.ie11 .icon-caret-right,
.no-svg .icon-caret-right {
  background-image: url('/today/static/web/img/icons/icon-library/png/caret-right.png?9a664f6cc412');
  background-size: 5px;
}

/******************************/

/*  #9 - Dropdowns */

/******************************/

/******************************/

/*  CORE */

.btn-drop {
  /* THIS IS THE DEFAULT WIDTH, OVERRIDE AS NEEDED */
  position: relative;
}

.btn-drop .btn:hover {
  cursor: pointer;
}

.btn-drop ul {
  background: #ffffff;
  position: absolute;
  top: 33.6px;
  top: 2.1rem;
  left: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  z-index: 1;
  display: block;
}

.btn-drop ul li {
  display: inline;
}

.btn-drop ul a {
  padding-top: 4px;
  padding-top: 0.25rem;
  padding-bottom: 4px;
  padding-bottom: 0.25rem;
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  color: #0083c2;
}

.btn-drop ul a:hover {
  background: #005e9b;
  color: #ffffff;
}

.drop {
  position: relative;
}

.drop a {
  display: block;
  background-size: 11px;
  background-size: 0.6875rem;
  background-position: right center;
  text-decoration: none;
  position: relative;
  z-index: 12;
  padding: 0 1px;
}

.drop.open a {
  background-size: 11px;
  background-size: 0.6875rem;
  background-position: right center;
  z-index: 11;
}

.drop ul {
  list-style: none;
  margin: 0;
  padding: 0;
  padding-top: 48px;
  padding-top: 3rem;
  background: #ffffff;
  border: 1px solid #e8e7e7;
  width: 110%;
  position: absolute;
  top: -14.4px;
  top: -0.9rem;
  left: -5%;
  right: -5%;
  z-index: 1;
  display: none;
  max-height: 160px;
  max-height: 10rem;
  overflow-y: auto;
}

.drop.open ul {
  z-index: 10;
}

.drop li {
  background: #ffffff;
  padding: 0 5%;
  line-height: 32px;
  line-height: 2rem;
}

.drop li:hover {
  cursor: pointer;
  color: #0083c2;
}

.drop li:first-child {
  padding-top: 4px;
  padding-top: 0.25rem;
}

.drop li:last-child {
  padding-bottom: 4px;
  padding-bottom: 0.25rem;
}

.drop > span {
  border-bottom: 1px solid #e8e7e7;
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin-left: -12px;
  margin-right: -11px;
  margin-top: -15px;
  margin-bottom: -16px;
  margin-bottom: -1rem;
}

.drop.open > span {
  background: #ffffff;
  z-index: 11;
  display: block;
}

.field.open {
  border: 1px solid #e8e7e7;
  margin-top: -1px;
}

.field.open .dropdown {
  max-height: 160px;
  max-height: 10rem;
  margin-left: -1px;
  overflow-y: auto;
  display: block;
  background: #ffffff;
}

.field.open .datepickme {
  display: block;
  background: #ffffff;
  margin-left: -1px;
  border-top: 0;
}

.field.open span,
.field.open input,
.field.open a {
  z-index: 11;
  position: relative;
}

.field.open a.droparrow {
  background-size: 8px;
  background-size: 0.5rem;
  background-position: right center;
  z-index: 5;
}

/******************************/

/*  ENHANCEMENTS */

.js .btn-drop ul {
  display: none;
}

/******************************/

/*  #10 - Tooltips */

/******************************/

.helper {
  position: relative;
}

.helper-tip {
  color: #0083c2;
}

.helper-text {
  display: none;
  min-width: 320px;
  min-width: 20rem;
  padding: 22.4px;
  padding: 1.4rem;
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  background: #005e9b;
  color: #ffffff;
  position: relative;
  z-index: 20;
}

@media (min-width: 48em) {
  .helper-text {
    position: absolute;
  }
}

.helper-text p {
  margin: 0;
}

.helper-text:after {
  width: 0;
  height: 0;
  background: #005e9b;
  content: " ";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 15px;
}

@media (min-width: 48em) {
  .helper-text:after {
    width: 18px;
    height: 18px;
  }
}

.helper [class*="icon-"] {
  display: block;
  height: 12.8px;
  height: 0.8rem;
  width: 12.8px;
  width: 0.8rem;
  margin-bottom: 4.8px;
  margin-bottom: 0.3rem;
  background-size: 100%;
  background-size: cover;
  background-position: 50%;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.helper.open [class*="icon-"],
.helper:hover [class*="icon-"] {
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
}

.helper.helper-left .helper-text {
  left: 0;
}

@media (min-width: 48em) {
  .helper.helper-left .helper-text {
    left: 30px;
    position: absolute;
  }
}

.helper.helper-left .helper-text:after {
  left: -8px;
}

.helper.helper-right {
  text-align: left;
  float: right;
}

.helper.helper-right .helper-text {
  right: 30px;
}

.helper.helper-right .helper-text:after {
  right: -8px;
}

.helper.helper-bottom {
  margin-top: 4px;
  margin-top: 0.25rem;
  text-align: center;
  float: none;
}

.helper.helper-bottom .helper-text {
  top: 40px;
  margin: auto;
  left: -50%;
  right: -50%;
}

.helper.helper-bottom .helper-text:after {
  top: -8px;
  left: 0;
  right: 0;
  margin: auto;
}

/******************************/

/*  #11 - Dialog */

/******************************/

/******************************/

/*  CORE  */

.mfp-close-btn-in .mfp-close {
  color: #ffffff !important;
  width: 48px;
  width: 3rem;
  height: 48px;
  height: 3rem;
  line-height: 48px;
  line-height: 3rem;
  opacity: 1 !important;
  overflow: hidden;
  text-indent: -200px;
  background-size: 24px;
  background-size: 1.5rem;
  background-repeat: no-repeat;
  background-position: bottom left;
  background-image: url('/today/static/web/img/icons/icon-library/close-grey.svg?9b7629b069b9');
}

.ie10 .mfp-close-btn-in .mfp-close,
.ie11 .mfp-close-btn-in .mfp-close,
.no-svg .mfp-close-btn-in .mfp-close {
  background-repeat: no-repeat;
  background-image: url('/today/static/web/img/icons/icon-library/png/close-grey.png?152109aa46d5');
  background-size: 32px;
}

.popup {
  position: relative;
  background: #ffffff;
  width: auto;
  max-width: 672px;
  max-width: 42rem;
  margin: 0 auto;
  margin-top: 20px;
  margin-top: 1.25rem;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
}

.popup .popup-content {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  padding-left: 32px;
  padding-left: 2rem;
  padding-right: 32px;
  padding-right: 2rem;
  background: #ffffff;
}

.popup .popup-content .title {
  font-size: 46.4px;
  font-size: 2.9rem;
  line-height: 51.2px;
  line-height: 3.2rem;
  font-family: "Telkom123-Regular", sans-serif;
}

.popup .popup-content p {
  color: #000000;
}

.popup .foundry-listing-horizontal {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 24px;
  margin-top: 1.5rem;
}

.popup .foundry-listing-horizontal .item {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  text-align: center;
}

@media (min-width: 48em) {
  .popup .foundry-listing-horizontal .item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .popup .foundry-listing-horizontal .item:nth-child(3n) {
    float: right;
    margin-right: 0;
  }
}

.popup .foundry-listing-horizontal .item img {
  max-width: 50%;
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

@media (min-width: 48em) {
  .popup .foundry-listing-horizontal .item img {
    max-width: 85%;
    padding: 0;
  }
}

.popup .foundry-listing-horizontal .item a {
  font-size: 12.8px;
  font-size: 0.8rem;
  display: block;
  color: #889391;
  text-decoration: none;
  text-align: center;
}

.popup .foundry-listing-horizontal .item a:hover {
  color: #000000;
}

.open-popup-link {
  display: none;
}

.mfp-hide {
  display: block !important;
}

.popup {
  border: 1em solid #cccccc;
}

.popup-head {
  display: none;
}

/******************************/

/*  ENHANCEMENTS  */

.js .open-popup-link {
  display: inline;
}

.js .mfp-hide {
  display: none !important;
}

.js .popup {
  border: 0;
}

.js .popup-head {
  display: block;
}

/******************************/

/*  #20 - Typography */

/******************************/

html,
body {
  line-height: 1.25;
}

/******************************/

/*  #20.1 - Headings */

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #000000;
  font-family: "Telkom123-Regular", sans-serif;
  font-weight: normal;
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small {
  display: block;
  color: #889391;
  line-height: 1;
}

h1,
.h1 {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
}

h2,
.h2,
.device-support .css-wds-context-scenario-title,
.device-support .css-wds-context-explorer-user-panel-text-name {
  font-size: 32px;
  font-size: 2rem;
  line-height: 34.4px;
  line-height: 2.15rem;
}

h3,
.h3,
.device-support .css-wds-context-explorer-user-component-name {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 25.8px;
  line-height: 1.6125rem;
}

h4,
.h4 {
  font-size: 16px;
  font-size: 1rem;
  line-height: 17.2px;
  line-height: 1.075rem;
}

h5,
.h5 {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 21.5px;
  line-height: 1.34375rem;
  font-family: "Telkom123-Bold", sans-serif;
}

h6,
.h6 {
  font-size: 16px;
  font-size: 1rem;
  line-height: 17.2px;
  line-height: 1.075rem;
  font-family: "Telkom123-Bold", sans-serif;
}

hr {
  border: 0;
  border-top: 1px solid #e8e7e7;
}

/******************************/

/*  #20.2 - Inline Elements */

p,
ol,
ul {
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.list-plus,
.list-plus > ul {
  list-style: none;
  padding-left: 16px;
  padding-left: 1rem;
}

.list-plus li:before,
.list-plus > ul li:before {
  content: "+";
  display: block;
  float: left;
  margin-left: -16px;
  margin-left: -1rem;
  padding-right: 8px;
  padding-right: 0.5rem;
  margin-top: -1.6px;
  margin-top: -0.1rem;
}

a {
  color: #0083c2;
  -webkit-transition: hover 0.5s ease-in-out;
  transition: hover 0.5s ease-in-out;
}

a:hover {
  color: #005e9b;
}

b,
strong {
  font-family: "Telkom123-Bold", sans-serif;
  font-weight: normal;
}

mark {
  background: #2695cb;
  color: #ffffff;
}

small {
  font-size: 70%;
}

blockquote {
  margin: 1rem 0;
  font-style: italic;
  line-height: 24px;
  line-height: 1.5rem;
}

blockquote:before {
  content: "\201C";
}

blockquote:after {
  content: "\201D";
}

.dl-title {
  margin-top: 5.71429%;
}

.dl-title a {
  font-size: 19.2px;
  font-size: 1.2rem;
  color: #889391;
}

dl {
  width: 100%;
}

@media (min-width: 48em) {
  dl {
    display: table;
    table-layout: fixed;
  }
}

dl dt,
dl dd {
  padding-top: 0.81633%;
  padding-bottom: 0.81633%;
}

@media (min-width: 48em) {
  dl dt,
  dl dd {
    display: table-cell;
    vertical-align: top;
  }
}

dl dt {
  color: #0083c2;
}

@media (max-width: 48em) {
  dl dt {
    width: 100%;
  }
}

@media (min-width: 48em) {
  dl dt {
    text-align: right;
    padding-right: 2.85714%;
    border-right: 1px solid #e8e7e7;
  }
}

@media (max-width: 48em) {
  dl dd {
    width: 100%;
    margin: 0;
  }
}

@media (min-width: 48em) {
  dl dd {
    padding-left: 2.85714%;
  }
}

@media (max-width: 48em) {
  dl .dl-row {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 2.85714%;
    padding-bottom: 2.85714%;
    border-bottom: 1px solid #e8e7e7;
  }

  dl .dl-row:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
  }
}

@media (min-width: 48em) {
  dl .dl-row {
    display: table-row;
  }

  dl .dl-row:first-child dt,
  dl .dl-row:first-child dd {
    padding-top: 0;
  }

  dl .dl-row:last-child dt,
  dl .dl-row:last-child dd {
    padding-bottom: 0;
  }
}

/******************************/

/*  #20.3 - Images */

.img-responsive {
  /* This class is to be used on inline images to ensure they become nice and squishy. */
  /* - Chris */
  max-width: 100%;
}

/******************************/

/*  #20.4 - Helpers           */

.text-white {
  color: #ffffff !important;
}

.text-white-bold {
  color: #ffffff !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-blue {
  color: #0083c2 !important;
}

.text-blue-bold {
  color: #0083c2 !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-blue-alt {
  color: #0083c2 !important;
}

.text-blue-alt-bold {
  color: #0083c2 !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-blue-dark {
  color: #005e9b !important;
}

.text-blue-dark-bold {
  color: #005e9b !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-pink {
  color: #da1b60 !important;
}

.text-pink-bold {
  color: #da1b60 !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-orange {
  color: #f04e23 !important;
}

.text-orange-bold {
  color: #f04e23 !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-cyan {
  color: #00d0ff !important;
}

.text-cyan-bold {
  color: #00d0ff !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-green {
  color: #00a850 !important;
}

.text-green-bold {
  color: #00a850 !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-lime {
  color: #bfd730 !important;
}

.text-lime-bold {
  color: #bfd730 !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-grey {
  color: #889391 !important;
}

.text-grey-bold {
  color: #889391 !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-grey-light {
  color: #cccccc !important;
}

.text-grey-light-bold {
  color: #cccccc !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.text-black {
  color: #000000 !important;
}

.text-black-bold {
  color: #000000 !important;
  font-family: "Telkom123-Bold", sans-serif;
}

.block-text {
  display: block;
}

@media (max-width: 48em) {
  .block-text-mobile {
    display: block;
  }
}

@media (min-width: 48em) {
  .block-text-tablet {
    display: block;
  }
}

@media (min-width: 48em) and (max-width: 62em) {
  .block-text-tablet-only {
    display: block;
  }
}

@media (min-width: 62em) {
  .block-text-desktop {
    display: block;
  }
}

@media (min-width: 62em) and (max-width: 75em) {
  .block-text-desktop-only {
    display: block;
  }
}

.align-text-left {
  text-align: left !important;
}

.align-text-right {
  text-align: right !important;
}

.center,
.align-text-center {
  text-align: center !important;
}

.bold {
  font-family: "Telkom123-Bold", sans-serif !important;
}

/******************************/

/*  #22 - Grid */

/******************************/

.grid .columns {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.grid .columns {
  *zoom: 1;
}

.grid .columns:before,
.grid .columns:after {
  content: "";
  display: table;
}

.grid .columns:after {
  clear: both;
}

.grid .columns div {
  margin-top: 24px;
  margin-top: 1.5rem;
  padding: 24px;
  padding: 1.5rem;
}

.grid .columns div i {
  height: 54px;
  height: 3.375rem;
  background: #889391;
  display: block;
}

.grid .columns div:last-child {
  margin-right: 0;
}

.grid .twelve div {
  width: 5.71429%;
  float: left;
  margin-right: 2.85714%;
}

.grid .six div {
  width: 14.28571%;
  float: left;
  margin-right: 2.85714%;
}

.grid .four div {
  width: 22.85714%;
  float: left;
  margin-right: 2.85714%;
}

.grid .three div {
  width: 31.42857%;
  float: left;
  margin-right: 2.85714%;
}

.grid .two div {
  width: 48.57143%;
  float: left;
  margin-right: 2.85714%;
}

.grid .one div {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

/******************************/

/*  #23.1 - Section Subtitle */

/******************************/

.section-subtitle-border {
  /* @extend .section-subtitle; */
  padding-bottom: 9.6px;
  padding-bottom: 0.6rem;
  margin-bottom: 9.6px;
  margin-bottom: 0.6rem;
  border-bottom: 1px solid #e8e7e7;
}

/******************************/

/*  #23.2 - Section Value */

/******************************/

.section-value {
  font-weight: bold;
  font-size: 72px;
  font-size: 4.5rem;
  line-height: 80px;
  line-height: 5rem;
  letter-spacing: -2.4px;
  letter-spacing: -0.15rem;
}

.section-value div {
  float: none;
}

.section-value div div {
  margin-top: -24px;
  margin-top: -1.5rem;
}

@media (min-width: 48em) {
  .section-value div {
    float: right;
  }
}

.section-value sup {
  font-size: 50%;
  top: -29px;
  top: -1.8125rem;
}

.section-value span {
  display: block;
  color: #889391;
  padding-left: 4px;
  padding-left: 0.25rem;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 16px;
  line-height: 1rem;
  text-align: left;
  font-family: "Telkom123-Regular", sans-serif;
  letter-spacing: 0;
}

.section-value.blue {
  color: #0083c2;
}

.section-value.green {
  color: #00a850;
}

.section-value.lime {
  color: #bfd730;
}

.section-value.orange {
  color: #f04e23;
}

.section-value.pink {
  color: #da1b60;
}

/*************************************/

/*  #23.5 - Section Stickers         */

/*************************************/

.section-stickers {
  padding-right: 4px;
  padding-right: 0.25rem;
  padding-left: 16px;
  padding-left: 1rem;
  float: right;
}

.section-stickers img {
  float: left;
  display: block;
  padding-right: 16px;
  padding-right: 1rem;
}

/******************************/

/*  #24 - Bill List */

/******************************/

.bill-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.bill-list li {
  margin-top: 8px;
  margin-top: 0.5rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  background: url('/today/static/web/img/line-dot.gif?67ad01e81017') bottom repeat-x;
  display: block;
}

.bill-list li * {
  background: #ffffff;
}

.bill-list li > :first-child {
  padding-right: 8px;
  padding-right: 0.5rem;
}

.bill-list li > :last-child {
  padding-left: 8px;
  padding-left: 0.5rem;
  float: right;
}

/******************************/

/*  #25 - Icon List */

/******************************/

.icon-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.icon-list li {
  padding-bottom: 16px;
  padding-bottom: 1rem;
  line-height: 16px;
  line-height: 1rem;
}

.icon-list li i {
  float: left;
  padding-top: 1.6px;
  padding-top: 0.1rem;
  padding-right: 16px;
  padding-right: 1rem;
}

.download-link-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.download-link-list li {
  position: relative;
  display: inline-block;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  padding-left: 32px;
  padding-left: 2rem;
  width: 100%;
  line-height: 1;
}

.download-link-list li:last-child {
  margin-bottom: 0;
}

.download-link-list li:before {
  display: block;
  content: "";
  width: 24px;
  width: 1.5rem;
  height: 24px;
  height: 1.5rem;
  margin-right: 16px;
  margin-right: 1rem;
  position: absolute;
  left: 0;
  top: -4px;
  background-size: contain;
  background-position: 50%;
  background-repeat: no-repeat;
}

.download-link-list .pdf:before {
  background-image: url('/today/static/web/img/icons/png/pdf.png?ebc1ca05644d');
}

.list-feature {
  list-style: none;
  margin: 0;
  padding: 0;
}

.list-feature li {
  min-height: 48px;
  min-height: 3rem;
  line-height: 48px;
  line-height: 3rem;
  padding-left: 48px;
  padding-left: 3rem;
  background-size: 35.2px;
  background-size: 2.2rem;
  background-repeat: no-repeat;
  background-position: left center;
}

/******************************/

/*  #29.1 - Breakdown Value */

/******************************/

.breakdown-value {
  padding-bottom: 6.4px;
  padding-bottom: 0.4rem;
}

.breakdown-value span {
  font-size: 28px;
  font-size: 1.75rem;
  font-weight: bold;
}

/******************************/

/*  #26 - Product Slider Items */

/******************************/

.product-slider-item {
  width: 14.28571%;
  float: left;
  margin-right: 2.85714%;
  padding-top: 24px;
  padding-top: 1.5rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  font-size: 12px;
  font-size: 0.75rem;
  text-align: center;
  position: relative;
}

.product-slider-item img {
  display: inline-block;
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
}

.product-slider-item-arrow {
  width: 14.28571%;
  float: left;
  margin-right: 2.85714%;
  padding-top: 24px;
  padding-top: 1.5rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  font-size: 12px;
  font-size: 0.75rem;
  text-align: center;
  position: relative;
  background: #f7f7f7;
}

.product-slider-item-arrow img {
  display: inline-block;
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
}

.product-slider-item-arrow:before {
  width: 48.57143%;
  float: left;
  margin-right: 2.85714%;
  height: 24px;
  height: 1.5rem;
  background: #f7f7f7;
  display: block;
  content: " ";
  position: absolute;
  bottom: -24px;
  bottom: -1.5rem;
  left: 0;
  background: #f7f7f7;
  /* Old browsers */
  /* FF3.6+ */
  background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #f7f7f7), color-stop(50%, #f7f7f7), color-stop(51%, #f7f7f7), color-stop(100%, #f7f7f7));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(11deg, #ffffff 0%, #ffffff 50%, #f7f7f7 51%, #f7f7f7 100%);
  /* Chrome10+,Safari5.1+ */
  /* Opera 11.10+ */
  /* IE10+ */
  background: -webkit-linear-gradient(79deg, #ffffff 0%, #ffffff 50%, #f7f7f7 51%, #f7f7f7 100%);
  background: linear-gradient(11deg, #ffffff 0%, #ffffff 50%, #f7f7f7 51%, #f7f7f7 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$white', endColorstr='$grey-drawer',GradientType=1 );
}

.product-slider-item-arrow:after {
  height: 24px;
  height: 1.5rem;
  background: #f7f7f7;
  display: block;
  content: " ";
  width: 48.57143%;
  float: left;
  margin-right: 2.85714%;
  position: absolute;
  bottom: -24px;
  bottom: -1.5rem;
  right: 0;
  background: #f7f7f7;
  /* Old browsers */
  /* FF3.6+ */
  background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #f7f7f7), color-stop(50%, #f7f7f7), color-stop(51%, #f7f7f7), color-stop(100%, #f7f7f7));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(-11deg, #ffffff 0%, #ffffff 50%, #f7f7f7 51%, #f7f7f7 100%);
  /* Chrome10+,Safari5.1+ */
  /* Opera 11.10+ */
  /* IE10+ */
  background: -webkit-linear-gradient(101deg, #ffffff 0%, #ffffff 50%, #f7f7f7 51%, #f7f7f7 100%);
  background: linear-gradient(-11deg, #ffffff 0%, #ffffff 50%, #f7f7f7 51%, #f7f7f7 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$white', endColorstr='$grey-drawer',GradientType=1 );
}

.brochure-block,
.brochure-block-inverted {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  width: 100%;
  position: relative;
  padding-top: 2.5%;
  padding-bottom: 2.5%;
  /* 1st Level Nodes */
  /* 2nd Level Nodes */
}

@media (min-width: 48em) {
  .brochure-block,
  .brochure-block-inverted {
    display: table;
    table-layout: fixed;
  }
}

.brochure-block-grey {
  background: #f7f7f6;
}

.brochure-block .wrapper > .content,
.brochure-block-inverted .wrapper > .content,
.brochure-block .wrapper > .additional,
.brochure-block-inverted .wrapper > .additional {
  width: 100%;
  display: table;
  padding: 2.25rem 5%;
}

@media (min-width: 290.0625em) {
  .brochure-block .wrapper > .content,
  .brochure-block-inverted .wrapper > .content,
  .brochure-block .wrapper > .additional,
  .brochure-block-inverted .wrapper > .additional {
    padding: 2.25rem inherit;
  }
}

@media (min-width: 48em) {
  .brochure-block .wrapper > .content,
  .brochure-block-inverted .wrapper > .content {
    padding-top: 0;
    padding-bottom: 0;
  }

  .brochure-block .wrapper > .content .focal-point,
  .brochure-block-inverted .wrapper > .content .focal-point {
    padding-right: 5%;
  }
}

.brochure-block .wrapper > .additional,
.brochure-block-inverted .wrapper > .additional {
  background-color: #e8e7e7;
}

.js .brochure-block .wrapper > .additional,
.js .brochure-block-inverted .wrapper > .additional {
  display: none;
}

@media (min-width: 48em) {
  .brochure-block .focal-point,
  .brochure-block-inverted .focal-point,
  .brochure-block .description,
  .brochure-block-inverted .description {
    display: table-cell;
    vertical-align: middle;
    width: 48.57143%;
  }
}

@media (min-width: 48em) and (max-width: 62em) {
  .brochure-block .description,
  .brochure-block-inverted .description {
    padding-top: 5%;
    padding-bottom: 5%;
  }
}

@media (min-width: 62em) {
  .brochure-block .description,
  .brochure-block-inverted .description {
    padding-top: 2.25rem;
    padding-bottom: 2.25rem;
  }
}

.brochure-block .focal-point > *,
.brochure-block-inverted .focal-point > * {
  display: block;
  margin: auto;
  width: 100%;
}

@media (min-width: 48em) {
  .brochure-block-inverted .focal-point {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    padding-right: 0 !important;
    padding-left: 5%;
  }

  .brochure-block-inverted .description {
    padding-right: 5%;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

.brochure-block.grey,
.grey.brochure-block-inverted {
  background-color: #f7f7f7;
}

.brochure-block h1,
.brochure-block-inverted h1 {
  color: #0083c2;
}

/* Because .focal-point and .description are display: table-cell, using SUSY's
    pull and push mixins will not work. Therefore, I used CSS 2d transforms to create the effect of a z-layout. (Works IE 9 and up) */

.z-layout {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .z-layout .brochure-block:nth-child(even) .focal-point,
  .z-layout .brochure-block-inverted:nth-child(even) .focal-point {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    padding-right: 0;
    padding-left: 5%;
  }

  .z-layout .brochure-block:nth-child(even) .description,
  .z-layout .brochure-block-inverted:nth-child(even) .description {
    padding-right: 5%;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

@media (min-width: 48em) {
  .z-layout-odd .brochure-block:nth-child(odd) .focal-point,
  .z-layout-odd .brochure-block-inverted:nth-child(odd) .focal-point {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    padding-right: 0;
    padding-left: 5%;
  }

  .z-layout-odd .brochure-block:nth-child(odd) .description,
  .z-layout-odd .brochure-block-inverted:nth-child(odd) .description {
    padding-right: 5%;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

[class*="brochure-selling-points"] {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  display: table;
  overflow-y: hidden;
  overflow-x: scroll;
}

@media (min-width: 48em) {
  [class*="brochure-selling-points"] {
    table-layout: fixed;
  }
}

[class*="brochure-selling-points"] .item {
  display: block;
  padding: 0 0.75rem;
}

[class*="brochure-selling-points"] .item .focal-point {
  margin-bottom: 1.5rem;
}

[class*="brochure-selling-points"] .item .focal-point img {
  display: block;
  margin: auto;
}

@media (max-width: 48em) {
  [class*="brochure-selling-points"] .item .focal-point img {
    max-width: 200px;
    max-width: 12.5rem;
    height: auto;
  }
}

[class*="brochure-selling-points"] .item .description {
  text-align: center;
}

@media (max-width: 48em) {
  [class*="brochure-selling-points"] .item {
    margin: 1.5rem 0;
  }

  [class*="brochure-selling-points"] .item:first-of-type {
    margin-top: 0;
  }

  [class*="brochure-selling-points"] .item:last-of-type {
    margin-bottom: 0;
  }
}

@media (min-width: 48em) {
  [class*="brochure-selling-points"] .item {
    display: table-cell;
    width: 25%;
  }

  [class*="brochure-selling-points"] .item .focal-point,
  [class*="brochure-selling-points"] .item .description {
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
  }
}

[class*="brochure-selling-points"] a.item {
  color: #889391;
  text-decoration: none;
}

[class*="brochure-selling-points"] a.item .focal-point {
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

[class*="brochure-selling-points"] a.item:hover {
  color: #0083c2;
}

[class*="brochure-selling-points"] a.item:hover .focal-point {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

[class*="brochure-selling-points"] + [class*="btn"] {
  margin-top: 1.5rem;
}

[class*="brochure-selling-points"] + [class*="brochure-selling-points"] {
  margin-top: 5%;
}

/* Molecules */

/* To keep this as extensible as possible, the animation and transition
should be handled on a case-by-case basis. This is just the functional structure. 

EG: See _help-talk.scss */

.interactive-icon {
  position: relative;
}

.interactive-icon .default,
.interactive-icon .active {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-size: 100%;
  background-size: contain;
  background-position: 50%;
}

.interactive-icon .default {
  opacity: 1;
}

.interactive-icon .active {
  opacity: 1;
}

.loader-container {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: transparent;
}

.loader-container .spinnerbox {
  margin: auto;
  width: 50%;
  min-width: 225px;
  height: 88px;
  height: 5.5rem;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.csstransforms3d .loader-container .spinner {
  border-color: #0083c2;
  border-top-color: transparent;
  border-style: solid;
  border-width: 5px;
  border-width: 0.3125rem;
  border-radius: 50%;
  width: 50px;
  width: 3.125rem;
  height: 50px;
  height: 3.125rem;
  margin: auto;
  -webkit-animation: spin 0.8s linear infinite;
  animation: spin 0.8s linear infinite;
}

.loader-container .counter {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  -webkit-transform: translate3d(0, 74%, 0);
  transform: translate3d(0, 74%, 0);
  -webkit-animation: flash 0.8s linear infinite;
  animation: flash 0.8s linear infinite;
  font-size: 12.8px;
  font-size: 0.8rem;
  line-height: 21.6px;
  line-height: 1.35rem;
}

.loader-container .description {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 25.8px;
  line-height: 1.6125rem;
}

.loader-container .counter,
.loader-container .description {
  color: #0083c2;
  text-align: center;
}

.loader-container .description,
.loader-container .buttons {
  padding-top: 1rem;
}

.loader-container .button-unit {
  max-width: 300px;
  margin: 0 auto;
}

.loader-container.inverted .spinner {
  border-left-color: #ffffff;
  border-right-color: #ffffff;
  border-bottom-color: #ffffff;
}

.loader-container.inverted .counter,
.loader-container.inverted .description {
  color: #ffffff;
}

/******************************/

/*  #12 - Navigation */

/******************************/

.nav-secondary {
  list-style: none;
  margin: 0;
  padding: 0;
}

.nav-secondary li {
  padding-right: 36px;
  padding-right: 2.25rem;
  display: inline-block;
}

.nav-secondary li a {
  font-size: 17.6px;
  font-size: 1.1rem;
  color: #889391;
  text-decoration: none;
}

.nav-secondary li a:hover {
  color: #0083c2;
}

.nav-secondary li .active {
  color: #0083c2;
}

.nav-hero {
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
  z-index: 50;
  overflow: hidden;
  margin-top: 32px;
  margin-top: 2rem;
  margin-bottom: 48px;
  margin-bottom: 3rem;
  position: relative;
  text-align: center;
}

.nav-hero li {
  display: inline-block;
  overflow: hidden;
}

.nav-hero a {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 20px;
  line-height: 1.25rem;
  padding: 16px;
  padding: 1rem;
  padding-top: 11.2px;
  padding-top: 0.7rem;
  padding-bottom: 17.6px;
  padding-bottom: 1.1rem;
  border-radius: 24px;
  border-radius: 1.5rem;
  color: #000000;
  text-decoration: none;
  position: relative;
  display: block;
  letter-spacing: -1px;
  /*
			&:after {
				@include rem-fallback(width, ms(0) * 2.75);
				@include rem-fallback(height, ms(0) * 2.75);
				background: $white;
				content: " ";
				position: absolute;
				@include rem-fallback(bottom, -(ms(0) * 4.5));
				left: 0;
				right: 0;
				margin: 0 auto;
			    	opacity: 0;
			    	transform: rotate(45deg); // Fallback
			    	transform: rotate(45deg) translate3d(50%, 50%, 0);
			}
*/
}

.nav-hero a,
.nav-hero a:after,
.nav-hero a * {
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

.nav-hero a img {
  width: 32px;
  width: 2rem;
  margin-right: 12px;
  margin-right: 0.75rem;
  float: left;
  margin-top: -2px;
  margin-bottom: -8px;
}

.nav-hero a.active {
  font-family: "Telkom123-Regular", sans-serif;
  background-color: #0083c2;
  color: #ffffff;
}

.nav-hero a.active:hover {
  background-color: #005e9b;
}

.nav-hero a.active:after,
.nav-hero a:hover:after {
  opacity: 1;
  -webkit-transform: rotate(45deg) translate3d(0, 0, 0);
  transform: rotate(45deg) translate3d(0, 0, 0);
}

.search-help .nav-hero a {
  color: #0083c2;
}

.search-help .nav-hero a.active {
  background-color: #0083c2;
  color: #ffffff;
}

.search-help .nav-hero a.active:hover {
  background-color: #005e9b;
}

/******************************/

/*  #13 - Forms */

/******************************/

/******************************/

/*  INPUT (Text, password, etc) */

.field {
  display: table;
  width: 100%;
  margin-bottom: 4px;
  margin-bottom: 0.25rem;
  border-bottom: 1px solid #e8e7e7;
  position: relative;
}

.field li.required > label,
.field div.required > label {
  padding: 0;
  background-image: none;
}

.field > input,
.field > label,
.field > .label {
  display: table-cell;
  vertical-align: middle;
}

.field > label,
.field > .label {
  width: 30%;
  font-size: 9.6px;
  font-size: 0.6rem;
  padding: 0;
  padding-top: 11.2px;
  padding-top: 0.7rem;
  padding-bottom: 11.2px;
  padding-bottom: 0.7rem;
  padding-right: 1%;
  text-transform: uppercase;
  text-align: right;
  white-space: nowrap;
}

.field input:not([type="submit"]) {
  width: 100%;
  padding: 11.2px;
  padding: 0.7rem;
  border: 0;
  background-color: transparent;
  font-size: 16px;
  font-size: 1rem;
  color: #000000;
}

.field input:not([type="submit"])::-webkit-input-placeholder {
  color: #c6cac9;
}

.field input:not([type="submit"]):-moz-placeholder {
  color: #c6cac9;
}

.field input:not([type="submit"])::-moz-placeholder {
  color: #c6cac9;
}

.field input:not([type="submit"]):-ms-input-placeholder {
  color: #c6cac9;
}

.field input:not([type="submit"]):active,
.field input:not([type="submit"]):focus {
  color: #000000;
  outline: none;
}

@media (min-width: 48em) {
  .field.centered {
    margin: 0 auto;
    max-width: 57.14286%;
  }
}

.field.valid-box,
.field.error-box {
  -webkit-transition: background-color 1s ease;
  transition: background-color 1s ease;
}

.field.valid-box > input,
.field.valid-box > label,
.field.valid-box .label,
.field.error-box > input,
.field.error-box > label,
.field.error-box .label {
  color: #ffffff;
  background-size: 24px;
  background-size: 1.5rem;
  background-position: 95% center;
  background-position: right 1.5rem center;
}

.field.valid-box > input:focus,
.field.valid-box > label:focus,
.field.valid-box .label:focus,
.field.error-box > input:focus,
.field.error-box > label:focus,
.field.error-box .label:focus {
  color: #ffffff;
}

.field.valid-box > input,
.field.error-box > input {
  padding-right: 64px;
  padding-right: 4rem;
}

.field.valid-box {
  background-color: #bfd730;
}

.field.valid-box input:-webkit-autofill,
.field.valid-box input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 50px #bfd730 inset;
  -webkit-text-fill-color: #ffffff;
  background-image: inherit;
}

.field.valid-box input ::-webkit-input-placeholder {
  color: #ebf2bd;
}

.field.valid-box input :-moz-placeholder {
  color: #ebf2bd;
}

.field.valid-box input ::-moz-placeholder {
  color: #ebf2bd;
}

.field.valid-box input :-ms-input-placeholder {
  color: #ebf2bd;
}

.field.error-box {
  background-color: #da1b60;
}

.field.error-box input:-webkit-autofill,
.field.error-box input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 50px #da1b60 inset;
  -webkit-text-fill-color: #ffffff;
  background-image: inherit;
}

.field.error-box input ::-webkit-input-placeholder {
  color: #f4a9c4;
}

.field.error-box input :-moz-placeholder {
  color: #f4a9c4;
}

.field.error-box input ::-moz-placeholder {
  color: #f4a9c4;
}

.field.error-box input :-ms-input-placeholder {
  color: #f4a9c4;
}

.field .errorlist {
  background-color: #ffffff;
  padding-left: 30%;
  display: table-caption;
  caption-side: bottom;
  vertical-align: middle;
}

.field .errorlist .error {
  display: table-cell;
  vertical-align: middle;
  padding-top: 0px;
  padding-top: 0rem;
  padding-right: 0px;
  padding-right: 0rem;
  padding-bottom: 0px;
  padding-bottom: 0rem;
  padding-left: 11.2px;
  padding-left: 0.7rem;
  border: 0;
  color: #da1b60;
}

.row.white .errorlist {
  background-color: #cccccc;
}

.field .helptext.invalid {
  padding-left: 37%;
  color: #da1b60;
}

.field a.droparrow {
  width: 9px;
  height: 5px;
  padding: 5px;
  top: 16px;
  top: 1rem;
  right: 20.8px;
  right: 1.3rem;
  position: absolute;
  background-size: 8px;
  background-size: 0.5rem;
  background-position: right center;
}

.field ul.dropdown,
.field .datepickme {
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
  padding-top: 0;
  border: 1px solid #e8e7e7;
  position: absolute;
  top: -5px;
  left: 0;
  z-index: 2;
  display: none;
}

.field ul.dropdown li,
.field .datepickme li {
  padding: 0 0 0 31%;
  padding-top: 4px;
  padding-top: 0.25rem;
  padding-bottom: 4px;
  padding-bottom: 0.25rem;
  background: #ffffff;
}

.field ul.dropdown li:hover,
.field .datepickme li:hover {
  cursor: pointer;
  color: #000000;
}

.field .dp-popup {
  width: 100%;
  background: #ffffff;
  font-family: "Telkom123-Regular", sans-serif;
  padding: 0;
  border-top: 1px solid #e8e7e7;
}

.field .dp-popup h2 {
  margin: 0 !important;
  font-size: 16px;
  font-size: 1rem;
}

.field .dp-popup table.jCalendar {
  width: 100%;
  border-spacing: 1px;
  border: 0;
  background: #ffffff;
}

.field .dp-popup table.jCalendar th {
  background: #ffffff;
  text-transform: uppercase;
  padding: 5px;
  color: #889391;
}

.field .dp-popup table.jCalendar td {
  padding: 10px 5px;
  background: #f7f7f7;
}

.field .dp-popup table.jCalendar td.today,
.field .dp-popup table.jCalendar td.selected,
.field .dp-popup table.jCalendar td.selected:hover {
  background: #0083c2;
  color: #ffffff;
}

.field .dp-popup table.jCalendar td.disabled,
.field .dp-popup table.jCalendar td.disabled.dp-hover {
  background: #e8e7e7;
  color: #889391;
}

.field.dob label {
  position: absolute;
  top: 4.8px;
  top: 0.3rem;
  left: 0;
}

.field.dob input {
  padding-left: 35%;
}

.field.dob label.error {
  position: relative;
}

.no-border {
  border: 0;
}

/******************************/

/*  CHECKBOXES */

.switch-label {
  display: inline-block;
  height: 1rem;
  margin: auto 0;
  top: 0;
  bottom: 0;
  right: 6rem;
  position: absolute;
}

.switch {
  height: 2.5rem;
  display: inline-block;
  margin: 0 0.5rem 0 0;
  position: relative;
}

.switch label {
  min-height: 0;
}

.switch .toggler {
  position: absolute;
  margin-left: -9999px;
  visibility: hidden;
}

.switch .toggler + label {
  display: block;
  position: relative;
  cursor: pointer;
  outline: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.switch input.toggle + label {
  padding: 0.5rem;
  width: 5rem;
  height: 2.5rem;
  border-radius: 5rem;
  -webkit-transition: background-color 0.4s;
  transition: background-color 0.4s;
}

.switch input.toggle + label:before,
.switch input.toggle + label:after {
  display: block;
  position: absolute;
  content: "";
}

.switch input.toggle + label:before {
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #cccccc;
  border-radius: 2.5rem;
  -webkit-transition: background-color 0.4s;
  transition: background-color 0.4s;
}

.switch input.toggle + label:after {
  top: 0.5rem;
  right: 0.5rem;
  bottom: 0.5rem;
  width: 1.5rem;
  background-color: #ffffff;
  border-radius: 1.5rem;
  -webkit-transition: margin 0.4s, background-color 0.4s;
  transition: margin 0.4s, background-color 0.4s;
}

.switch input.toggle:checked + label {
  background-color: #ffffff;
}

.switch input.toggle:checked + label:after {
  margin-right: 2.5rem;
  background-color: #ffffff;
}

.switch input.toggle:checked + label:before {
  background-color: #0083c2;
}

.switch input.check + label {
  padding: 0.5rem;
  width: 2.5rem;
  height: 2.5rem;
  -webkit-transition: background-color 0.4s;
  transition: background-color 0.4s;
}

.switch input.check + label:before,
.switch input.check + label:after {
  display: block;
  position: absolute;
  content: "";
}

.switch input.check + label:before {
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #cccccc;
  -webkit-transition: background-color 0.4s;
  transition: background-color 0.4s;
}

.switch input.check + label:after {
  top: 0.5rem;
  right: 0.5rem;
  bottom: 0.5rem;
  left: 0.5rem;
  width: 1.5rem;
  -webkit-transition: margin 0.4s, background-color 0.4s;
  transition: margin 0.4s, background-color 0.4s;
}

.switch input.check:checked + label {
  background-color: #ffffff;
}

.switch input.check:checked + label:after {
  background-image: url('/today/static/web/img/icons/icon-library/png/check.png?ae9890d0dad8');
  background-size: 1.5rem;
  background-position: 50%;
  background-repeat: no-repeat;
}

.svg .switch input.check:checked + label:after {
  background-image: url('/today/static/web/img/icons/icon-library/check.svg?b40856fb6737');
}

.switch input.check:checked + label:before {
  background-color: #0083c2;
}

.switch input.radio + label {
  padding: 0.2rem;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 1.5rem;
  -webkit-transition: background-color 0.4s;
  transition: background-color 0.4s;
}

.switch input.radio + label:before,
.switch input.radio + label:after {
  display: block;
  position: absolute;
  content: "";
}

.switch input.radio + label:before {
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #cccccc;
  border-radius: 1.5rem;
  -webkit-transition: background-color 0.4s;
  transition: background-color 0.4s;
}

.switch input.radio + label:after {
  top: 0.4rem;
  right: 0.39rem;
  bottom: 0.4rem;
  width: 0.7rem;
  background-color: #ffffff;
  border-radius: 1.5rem;
  -webkit-transition: margin 0.4s, background-color 0.4s;
  transition: margin 0.4s, background-color 0.4s;
}

.switch input.radio:checked + label {
  background-color: #ffffff;
}

.switch input.radio:checked + label:after {
  background-color: #ffffff;
}

.switch input.radio:checked + label:before {
  background-color: #0083c2;
}

.switch-text label {
  padding-left: 36px;
  padding-left: 2.25rem;
  padding: 0;
  line-height: 32px;
  line-height: 2rem;
  display: block;
  color: #889391;
}

.switch-text label:hover {
  cursor: pointer;
}

.switch-text label div {
  display: inline-block;
  background: #f7f7f7;
  border: 1px solid #e8e7e7;
  padding: 1px;
  border-radius: 36px;
  border-radius: 2.25rem;
}

.switch-text label div i {
  float: left;
  text-transform: uppercase;
  font-style: normal;
  font-size: 12.8px;
  font-size: 0.8rem;
  padding-left: 12px;
  padding-left: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem;
  border-radius: 36px;
  border-radius: 2.25rem;
  line-height: 28px;
  line-height: 1.75rem;
  display: inline-block;
  color: #889391;
}

.switch-text label div i.no {
  color: #ffffff;
  background: #0083c2;
}

.switch-text input + label:before {
  width: 18px;
  width: 1.125rem;
  height: 18px;
  height: 1.125rem;
  border-radius: 18px;
  border-radius: 1.125rem;
  display: block;
  position: absolute;
  top: -5px;
  bottom: 0;
  left: 0;
  margin: auto;
  content: "";
  border: 1px solid #e8e7e7;
  display: none;
}

.switch-text input:checked + label {
  color: #0083c2;
  border-color: #0083c2;
}

.switch-text input:checked + label:before,
.switch-text input:checked + label span {
  background: #0083c2;
  color: #e8e7e7;
  border-color: #0083c2;
}

.switch-text input:checked + label div .yes {
  background: #0083c2;
  color: #ffffff;
}

.switch-text input:checked + label div .no {
  background: transparent;
  color: #889391;
}

.switch-text input {
  display: none;
}

/******************************/

/*  CUSTOM NUMBER INPUT       */

.custom-number {
  font-family: "Telkom123-Bold", sans-serif;
}

.custom-number .cn-minus,
.custom-number .cn-plus {
  width: 40px;
  width: 2.5rem;
  height: 32px;
  height: 2rem;
  line-height: 24px;
  line-height: 1.5rem;
  font-size: 19.2px;
  font-size: 1.2rem;
  border: 1px solid #e8e7e7;
  float: left;
  color: #889391;
  text-align: center;
  background: #ffffff;
  display: block;
}

.custom-number .cn-minus:hover,
.custom-number .cn-plus:hover {
  cursor: pointer;
}

.custom-number .cn-minus {
  border-radius: 32px 0 0 32px;
}

.custom-number .cn-plus {
  border-radius: 0 32px 32px 0;
}

.custom-number .cn-value {
  width: 80px;
  width: 5rem;
  height: 32px;
  height: 2rem;
  line-height: 32px;
  line-height: 2rem;
  font-size: 14.4px;
  font-size: 0.9rem;
  white-space: nowrap;
  float: left;
  display: block;
  background: #0083c2;
  color: #ffffff;
  text-align: center;
  border: 0;
}

.custom-number .cn-field {
  display: none;
}

.js .custom-number .cn-input {
  display: none;
}

.js .custom-number .cn-field {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: inline-block;
}

.js .custom-number .cn-field {
  *zoom: 1;
}

.js .custom-number .cn-field:before,
.js .custom-number .cn-field:after {
  content: "";
  display: table;
}

.js .custom-number .cn-field:after {
  clear: both;
}

/******************************/

/*  CUSTOM SELECT INPUT       */

.SumoSelect {
  display: block;
  position: relative;
  outline: none;
  z-index: 101;
}

.SumoSelect select {
  position: absolute;
  top: 8px;
  right: 0;
  width: 100%;
  z-index: 1;
  opacity: 0;
  display: block !important;
}

@media (min-width: 48em) {
  .SumoSelect select {
    z-index: -1;
  }
}

.SumoSelect.disabled {
  opacity: 0.5;
  cursor: default;
}

.SumoSelect .SelectBox {
  margin: 0;
  position: relative;
  border: 1px solid #e8e7e7;
  padding: 0.6rem 1rem 0.7rem 1rem;
  line-height: 1.6rem;
  width: 100%;
}

[class*="blue"] .SumoSelect .SelectBox {
  background-color: #005e9b;
  border: 1px solid #ffffff;
}

[class*="blue"] .SumoSelect .SelectBox span {
  color: #ffffff;
}

[class*="grey"] .SumoSelect .SelectBox span {
  color: #0083c2;
}

.SumoSelect .SelectBox span {
  display: block;
  padding-right: 30px;
  text-overflow: ellipsis;
  overflow: hidden;
  cursor: default;
  color: #000000;
}

.SumoSelect .SelectBox label {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 3rem;
}

.SumoSelect .SelectBox label:hover {
  cursor: pointer;
}

.SumoSelect .SelectBox i {
  display: block;
  width: 100%;
  height: 100%;
  background-size: 0.5rem;
  background-repeat: no-repeat;
  background-position: 50%;
  background-image: url('/today/static/web/img/icons/icon-library/png/caret-down-black.png?6cc88ca51ef3');
}

.svg .SumoSelect .SelectBox i {
  background-image: url('/today/static/web/img/icons/icon-library/caret-down-black.svg?25017f7967ea');
}

[class*="blue"] .SumoSelect .SelectBox i {
  background-image: url('/today/static/web/img/icons/icon-library/png/caret-down.png?dda7b1769bfa');
}

.svg [class*="blue"] .SumoSelect .SelectBox i {
  background-image: url('/today/static/web/img/icons/icon-library/caret-down.svg?a01661d2bf76');
}

[class*="grey"] .SumoSelect .SelectBox i {
  background-image: url('/today/static/web/img/icons/icon-library/png/caret-down-blue.png?f101d33cc7c4');
}

.svg [class*="grey"] .SumoSelect .SelectBox i {
  background-image: url('/today/static/web/img/icons/icon-library/caret-down-blue.svg?f08977712122');
}

.SumoSelect.open .optWrapper {
  visibility: visible;
  opacity: 1;
  z-index: 101;
}

.SumoSelect.open .search-txt {
  z-index: 100;
  opacity: 1;
  visibility: visible;
  background-color: #ffffff;
}

.SumoSelect .search-txt {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -100;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.SumoSelect .optWrapper {
  top: 0;
  width: 100%;
  position: absolute;
  left: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all .25s ease;
  transition: all .25s ease;
  border: 1px solid #e8e7e7;
  padding-top: 40.8px;
  padding-top: 2.55rem;
}

.SumoSelect .optWrapper .no-match {
  background-color: #f7f7f7;
  padding: 0.5rem 1rem;
  margin: 0;
}

.SumoSelect .optWrapper ul {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 240px;
  max-height: 15rem;
  overflow-y: auto;
}

.SumoSelect .optWrapper li {
  background-color: #f7f7f7;
  padding: 0.5rem 1rem;
}

.SumoSelect .optWrapper li:first-child {
  padding-top: 1rem;
}

.SumoSelect .optWrapper li:last-child {
  padding-bottom: 1rem;
}

.SumoSelect .optWrapper li:hover {
  cursor: pointer;
}

.SumoSelect .optWrapper li:hover label {
  color: #0083c2;
}

.SumoSelect .optWrapper li:hover label:hover {
  cursor: pointer;
}

.SumoSelect .optWrapper li.disabled {
  display: none;
  pointer-events: none;
}

.SumoSelect .optWrapper li.disabled label {
  opacity: 0.5;
  cursor: default;
}

.SumoSelect .optWrapper .selected label,
.SumoSelect .optWrapper .sel label {
  color: #005e9b;
}

[class*="blue"] .SumoSelect .optWrapper {
  border: 1px solid #ffffff;
}

[class*="blue"] .SumoSelect .optWrapper .selected label,
[class*="blue"] .SumoSelect .optWrapper .sel label {
  color: #00d0ff;
}

[class*="blue"] .SumoSelect .optWrapper li {
  background-color: #005e9b;
}

[class*="blue"] .SumoSelect .optWrapper li label {
  color: #ffffff;
}

[class*="blue"] .SumoSelect .optWrapper li:hover {
  cursor: pointer;
}

[class*="blue"] .SumoSelect .optWrapper li:hover label {
  cursor: pointer;
  color: #00d0ff;
}

label + .SumoSelect {
  position: static;
}

label + .SumoSelect .SelectBox {
  border: 0 !important;
}

label + .SumoSelect .options li {
  padding-left: 35%;
}

/******************************/

/*  COLOR CHOOSER RADIO GROUP      */

.color-chooser {
  list-style: none;
  margin: 0;
  padding: 0;
}

.color-chooser .option {
  display: inline-block;
}

.color-chooser .option > * {
  -webkit-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
}

.color-chooser .option + .option {
  margin-left: 0.5rem;
}

.color-chooser label {
  text-indent: -9999px;
  overflow: hidden;
  display: block;
  border-style: solid;
  border-color: #889391;
  border-width: 1.6px;
  border-width: 0.1rem;
  border-radius: 50%;
  width: 1.5rem;
  height: 1.5rem;
  cursor: pointer;
}

.color-chooser label:hover {
  border-color: #0083c2;
}

.color-chooser input {
  display: none;
}

.color-chooser input:checked + label {
  border-color: #0083c2;
}

/******************************/

/*  CUSTOM SELECT INPUT       */

.builder-grouping .SumoSelect .SelectBox {
  border: 0;
}

.builder-grouping .SumoSelect {
  position: static;
}

.builder-grouping .SumoSelect li {
  padding: 0;
  padding-left: 35%;
  padding-top: 6.4px;
  padding-top: 0.4rem;
  padding-bottom: 6.4px;
  padding-bottom: 0.4rem;
  line-height: 20px;
  line-height: 1.25rem;
}

.builder-grouping .SumoSelect li label {
  width: 100%;
  padding: 0;
  text-transform: none;
  line-height: 20px;
  line-height: 1.25rem;
  font-size: 16px;
  font-size: 1rem;
}

.blue .field .SumoSelect .SelectBox {
  border: 0;
}

.blue .field .SumoSelect {
  position: static;
}

.blue .field .SumoSelect li {
  padding: 0;
  padding-left: 35%;
  padding-top: 6.4px;
  padding-top: 0.4rem;
  padding-bottom: 6.4px;
  padding-bottom: 0.4rem;
  line-height: 20px;
  line-height: 1.25rem;
}

.blue .field .SumoSelect li label {
  width: 100%;
  padding: 0;
  text-transform: none;
  line-height: 20px;
  line-height: 1.25rem;
  font-size: 16px;
  font-size: 1rem;
}

.blue .field .optWrapper {
  padding-top: 44px;
  padding-top: 2.75rem;
}

.blue .field.centered li {
  padding-left: 16px;
  padding-left: 1rem;
}

.grey .field,
.grey .field .SumoSelect .SelectBox {
  border: 0;
}

.grey .field .SumoSelect {
  position: static;
}

.grey .field .SumoSelect p.SelectBox {
  margin: 0;
  margin-top: 6.4px;
  margin-top: 0.4rem;
}

.grey .field .SumoSelect li {
  padding: 0;
  padding-left: 16px;
  padding-left: 1rem;
  padding-top: 6.4px;
  padding-top: 0.4rem;
  padding-bottom: 6.4px;
  padding-bottom: 0.4rem;
  line-height: 20px;
  line-height: 1.25rem;
  background: #ffffff;
  text-align: left;
}

.grey .field .SumoSelect li:first-child {
  border-top: 1px solid #e8e7e7;
  padding-top: 12px;
  padding-top: 0.75rem;
}

.grey .field .SumoSelect li:last-child {
  padding-bottom: 12px;
  padding-bottom: 0.75rem;
}

.grey .field .SumoSelect li label {
  width: 100%;
  padding: 0;
  text-transform: none;
  line-height: 20px;
  line-height: 1.25rem;
  font-size: 16px;
  font-size: 1rem;
  text-align: left;
}

.grey .field .optWrapper {
  padding-top: 44px;
  padding-top: 2.75rem;
}

.grey .field.centered li {
  padding-left: 16px;
  padding-left: 1rem;
}

/******************************/

/*  #13 - Forms */

/******************************/

/******************************/

/*  SEARCH + AUTOFILL */

.search,
.autofill {
  display: inline-block;
  border: 1px solid #889391;
}

.search input,
.autofill input {
  width: 15em;
  padding: 0.6em 1em;
  background-color: transparent;
  border: 0;
}

.search .search-btn,
.autofill .search-btn {
  width: 1em;
  border: 0;
  background-color: transparent;
  float: right;
  margin: 0.6em 1em 0 0;
  padding: 0;
  text-indent: -9999px;
  overflow: hidden;
  color: #889391;
  background-size: contain;
  background-position: 50%;
}

.autofill {
  background-color: #ffffff;
  border-color: #0083c2;
  position: relative;
}

.autofill input {
  color: #0083c2;
}

.autofill input::-webkit-input-placeholder {
  color: #0083c2;
  opacity: 1;
}

.autofill input:-moz-placeholder {
  color: #0083c2;
  opacity: 1;
}

.autofill input::-moz-placeholder {
  color: #0083c2;
  opacity: 1;
}

.autofill input:-ms-input-placeholder {
  color: #0083c2;
  opacity: 1;
}

.autofill input:active,
.autofill input:focus {
  color: #0083c2;
}

.autofill ul {
  width: 100%;
  margin: 1px 0 0 0;
  padding: 0;
  list-style: none;
  position: absolute;
  background: #ffffff;
  z-index: 1;
  display: none;
}

.autofill ul li {
  padding: 0.5em 1em;
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  color: #0083c2;
}

.autofill ul li:hover {
  background: #005e9b;
  color: #ffffff;
  cursor: pointer;
}

/******************************/

/*  #13 - Forms */

/******************************/

/******************************/

/*  INPAGE SEARCH             */

.search-inpage {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.search-inpage .inpage {
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
  display: block;
  border-bottom: 1px solid #e8e7e7;
}

.search-inpage .inpage input {
  width: 75%;
  border: 0;
  background: 0;
  font-size: 16px;
  font-size: 1rem;
  color: #000000;
}

.search-inpage .inpage input::-webkit-input-placeholder {
  color: #000000;
  opacity: 1;
}

.search-inpage .inpage input:-moz-placeholder {
  color: #000000;
  opacity: 1;
}

.search-inpage .inpage input::-moz-placeholder {
  color: #000000;
  opacity: 1;
}

.search-inpage .inpage input:-ms-input-placeholder {
  color: #000000;
  opacity: 1;
}

.search-inpage .inpage .search-btn {
  width: 24px;
  width: 1.5rem;
  float: right;
  border: 0;
  background-color: transparent;
  overflow: hidden;
  padding: 0;
  text-indent: -9999px;
  overflow: hidden;
  color: #000000;
  background-size: contain;
  background-position: 50%;
}

.search-inpage.white {
  width: 100%;
  margin: 1rem auto;
  float: none;
}

@media (min-width: 30em) {
  .search-inpage.white {
    width: 60%;
  }
}

.search-inpage.white input {
  color: #ffffff;
}

.search-inpage.white input::-webkit-input-placeholder {
  color: #ffffff;
}

.search-inpage.white input:-moz-placeholder {
  color: #ffffff;
}

.search-inpage.white input::-moz-placeholder {
  color: #ffffff;
}

.search-inpage.white input:-ms-input-placeholder {
  color: #ffffff;
}

.search-inpage.white .search-btn {
  color: #ffffff;
}

.country-table {
  border-collapse: collapse;
  margin: 1rem auto;
  margin-bottom: 3rem;
}

.country-table td,
.country-table th {
  border: 1px solid #0072a9;
  padding: 0 0.25em 0.25em 0.25em;
  font-size: 1.75rem;
  line-height: 1em;
}

.country-table th {
  color: #84BD00;
  text-align: center;
  padding: 0;
  padding-bottom: 1rem;
  font-family: "Telkom123-Light", sans-serif;
  font-size: 1.5rem;
}

.country-table th:first-child,
.country-table th:last-child {
  display: none;
}

@media (min-width: 30em) {
  .country-table th {
    text-align: left;
  }

  .country-table th:first-child,
  .country-table th:last-child {
    display: table-cell;
  }
}

.country-table td:first-child,
.country-table td:last-child {
  color: #84BD00;
  font-family: "Telkom123-Light", sans-serif;
  font-size: 1rem;
  width: 36%;
}

.country-table td:first-child {
  text-align: right;
  padding-right: 1rem;
  display: none;
}

@media (min-width: 30em) {
  .country-table td:first-child {
    display: table-cell;
  }
}

.country-table td:last-child {
  text-align: left;
  text-transform: uppercase;
  padding-left: 1rem;
  display: none;
}

@media (min-width: 30em) {
  .country-table td:last-child {
    display: table-cell;
  }
}

.country-table td:not(:first-child):not(:last-child) {
  background-color: #005e9b;
  color: #ffffff;
  text-align: center;
  width: 2.25rem;
}

.country-table td:not(:first-child):not(:last-child).decimal-cell {
  width: 1rem;
  padding: 0 0 0.25em 0;
}

.country-table tr:first-child th {
  border-top: 0;
}

.country-table tr:last-child td {
  border-bottom: 0;
}

.country-table tr td:first-child,
.country-table tr th:first-child {
  border-left: 0;
}

.country-table tr td:last-child,
.country-table tr th:last-child {
  border-right: 0;
}

.country-table tr.country-table-smart-desc {
  display: table-row;
}

@media (min-width: 30em) {
  .country-table tr.country-table-smart-desc {
    display: none;
  }
}

.country-table tr.country-table-smart-desc td {
  color: #84BD00 !important;
  font-family: Telkom123-Light;
  padding: 0.5em;
  font-size: 1rem;
}

#roaming-nocoverage-msg-container {
  display: none;
  color: #84BD00;
  font-family: "Telkom123-Light", sans-serif;
  text-align: center;
  margin: 1rem auto;
}

#roaming-nocoverage-msg-container.active {
  display: block;
}

#roaming-nocoverage-msg-container p {
  margin: 0;
  padding: 1.5rem 0;
}

#roaming-country-table {
  display: none;
}

#roaming-country-table.active {
  margin: 0 auto;
  display: table;
}

/******************************/

/*  #13 - Forms */

/******************************/

/******************************/

/*  SLIDER (overwrite the vendor styling) */

.irs {
  height: 64px;
  height: 4rem;
}

.irs * {
  -webkit-transition: background 0.5s, -webkit-transform 0.5s;
  transition: background 0.5s, -webkit-transform 0.5s;
  transition: background 0.5s, transform 0.5s;
  transition: background 0.5s, transform 0.5s, -webkit-transform 0.5s;
  -webkit-transform-style: ease-in-out;
  transform-style: ease-in-out;
}

.irs .irs-line {
  height: 16px;
  height: 1rem;
  background: #e8e7e7;
  border: 0;
  top: 32px;
  top: 2rem;
  border-radius: 16px;
  border-radius: 1rem;
}

.irs .irs-line span {
  height: 16px;
  height: 1rem;
  border: 0;
}

.irs .irs-bar-edge {
  width: 16px;
  width: 1rem;
  height: 16px;
  height: 1rem;
  top: 32px;
  top: 2rem;
  border: 0;
  background: #0083c2;
}

.irs .irs-bar {
  height: 16px;
  height: 1rem;
  top: 32px;
  top: 2rem;
  border: 0;
  background: #0083c2;
}

.irs .irs-slider {
  width: 32px;
  width: 2rem;
  height: 32px;
  height: 2rem;
  top: 24px;
  top: 1.5rem;
  box-shadow: 0 0 0;
  border: 0;
  background: #0083c2;
}

.irs .irs-slider:hover {
  background: #005e9b;
  -webkit-transform-style: ease-in-out;
  transform-style: ease-in-out;
  cursor: pointer;
}

.irs .irs-grid {
  top: 48px;
  top: 3rem;
}

.irs .irs-grid .irs-grid-text.on {
  font-family: "Telkom123-Bold", sans-serif;
  color: #889391;
}

.irs .irs-from,
.irs .irs-to,
.irs .irs-single {
  background: #0083c2;
}

.range .pills {
  display: none;
  background-color: #e8e7e7;
  float: left;
  height: 36px;
  height: 2.25rem;
  border-radius: 36px;
  border-radius: 2.25rem;
  padding: 4px;
  width: auto;
  position: absolute;
  top: -56px;
  top: -3.5rem;
  display: table !important;
  table-layout: fixed;
  left: 48%;
  -webkit-transform: translateX(-52%);
  transform: translateX(-52%);
}

.range .pills:after {
  background-color: #e8e7e7;
  content: "";
  width: 10px;
  height: 10px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  bottom: -5px;
  left: 6px;
  right: 0;
  margin: auto;
}

@media (min-width: 48em) {
  .range .pills {
    top: -7.2px;
    top: -0.45rem;
  }

  .range .pills:after {
    display: none;
  }
}

.range .pills ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: table-row;
}

.range .pills ul li {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

.range .pills ul li.on a {
  background-color: #0083c2;
  color: #ffffff;
}

.range .pills ul a {
  padding-left: 12px;
  padding-left: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem;
  border-radius: 36px;
  border-radius: 2.25rem;
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: bold;
  line-height: 30.4px;
  line-height: 1.9rem;
  font-size: 12px;
  font-size: 0.75rem;
  color: #889391;
}

/******************************/

/*  #13 - Forms */

/******************************/

/******************************/

/*  FORM MESSAGES */

.message {
  width: 100%;
  float: left;
  padding: 24px;
  padding: 1.5rem;
  padding-left: 5%;
  padding-right: 5%;
  display: block;
  background: #0083c2;
  font-family: "Telkom123-Bold", sans-serif;
  color: #ffffff;
  position: relative;
  z-index: 11111;
}

.message a {
  color: #ffffff;
  text-decoration: none;
}

.message a[class*="-close"] {
  display: block;
  height: 12.8px;
  height: 0.8rem;
  width: 12.8px;
  width: 0.8rem;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 24px;
  right: 1.5rem;
  margin: auto 0;
  background-size: contain;
  background-position: 50%;
  background-repeat: no-repeat;
}

.message:before {
  display: block;
  clear: both;
  content: "";
}

.message:after {
  display: block;
  clear: both;
  content: "";
}

.message.error {
  background: #da1b60;
}

.message.success {
  background: #00a850;
}

.message-large,
.message-large-info,
.message-large-success,
.message-large-error {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding: 5%;
  text-align: center;
}

.message-large-info h2 {
  color: #0083c2;
}

.message-large-success h2 {
  color: #bfd730;
}

.message-large-error h2 {
  color: #da1b60;
}

/******************************/

/*  #14 - Step Bar */

/******************************/

.stepbar > li.is-complete,
.step2 .stepbar > li[data-step='1'],
.step3 .stepbar > li[data-step='1'],
.step3 .stepbar > li[data-step='2'],
.step4 .stepbar > li[data-step='1'],
.step4 .stepbar > li[data-step='2'],
.step4 .stepbar > li[data-step='3'],
.step5 .stepbar > li[data-step='1'],
.step5 .stepbar > li[data-step='2'],
.step5 .stepbar > li[data-step='3'],
.step5 .stepbar > li[data-step='4'] {
  color: #889391;
}

.stepbar > li.is-complete:before,
.step2 .stepbar > li[data-step='1']:before,
.step3 .stepbar > li[data-step='1']:before,
.step3 .stepbar > li[data-step='2']:before,
.step4 .stepbar > li[data-step='1']:before,
.step4 .stepbar > li[data-step='2']:before,
.step4 .stepbar > li[data-step='3']:before,
.step5 .stepbar > li[data-step='1']:before,
.step5 .stepbar > li[data-step='2']:before,
.step5 .stepbar > li[data-step='3']:before,
.step5 .stepbar > li[data-step='4']:before,
.stepbar > li.is-complete:after,
.step2 .stepbar > li[data-step='1']:after,
.step3 .stepbar > li[data-step='1']:after,
.step3 .stepbar > li[data-step='2']:after,
.step4 .stepbar > li[data-step='1']:after,
.step4 .stepbar > li[data-step='2']:after,
.step4 .stepbar > li[data-step='3']:after,
.step5 .stepbar > li[data-step='1']:after,
.step5 .stepbar > li[data-step='2']:after,
.step5 .stepbar > li[data-step='3']:after,
.step5 .stepbar > li[data-step='4']:after {
  color: #ffffff;
  background: #0072a9;
}

.stepbar > li.is-active,
.step1 .stepbar > li[data-step='1'],
.step2 .stepbar > li[data-step='2'],
.step3 .stepbar > li[data-step='3'],
.step4 .stepbar > li[data-step='4'],
.step5 .stepbar > li[data-step='5'] {
  color: #0072a9;
}

.stepbar > li.is-active:before,
.step1 .stepbar > li[data-step='1']:before,
.step2 .stepbar > li[data-step='2']:before,
.step3 .stepbar > li[data-step='3']:before,
.step4 .stepbar > li[data-step='4']:before,
.step5 .stepbar > li[data-step='5']:before,
.stepbar > li.is-active:after,
.step1 .stepbar > li[data-step='1']:after,
.step2 .stepbar > li[data-step='2']:after,
.step3 .stepbar > li[data-step='3']:after,
.step4 .stepbar > li[data-step='4']:after,
.step5 .stepbar > li[data-step='5']:after {
  color: #ffffff;
}

.stepbar > li.is-active:before,
.step1 .stepbar > li[data-step='1']:before,
.step2 .stepbar > li[data-step='2']:before,
.step3 .stepbar > li[data-step='3']:before,
.step4 .stepbar > li[data-step='4']:before,
.step5 .stepbar > li[data-step='5']:before {
  background: #0072a9;
}

.stepbar > li.is-active:after,
.step1 .stepbar > li[data-step='1']:after,
.step2 .stepbar > li[data-step='2']:after,
.step3 .stepbar > li[data-step='3']:after,
.step4 .stepbar > li[data-step='4']:after,
.step5 .stepbar > li[data-step='5']:after {
  background: #889391;
}

.stepbar {
  list-style: none;
  width: 110%;
  margin: 0 -5%;
  padding: 0;
  display: table;
  table-layout: fixed;
  color: #889391;
}

@media (min-width: 48em) {
  .stepbar {
    width: 122%;
    margin: 0 -11%;
    margin-bottom: 24px;
    margin-bottom: 1.5rem;
  }
}

.stepbar > li {
  position: relative;
  display: table-cell;
  vertical-align: top;
  text-align: center;
  font-size: 12.8px;
  font-size: 0.8rem;
  line-height: 14.4px;
  line-height: 0.9rem;
}

.stepbar > li:before {
  color: #ffffff;
  content: attr(data-step);
  display: block;
  margin: 0 auto;
  background: #889391;
  width: 28px;
  width: 1.75rem;
  height: 28px;
  height: 1.75rem;
  font-size: 16px;
  font-size: 1rem;
  margin-bottom: 4px;
  margin-bottom: 0.25rem;
  padding: 7px;
  padding: 0.4375rem;
  text-align: center;
  line-height: 0.7;
  border-radius: 100%;
  position: relative;
  z-index: 100;
  font-family: "Telkom123-Bold", sans-serif;
  overflow: hidden;
}

.stepbar > li:after {
  content: '';
  position: absolute;
  display: block;
  background: #889391;
  width: 100%;
  height: 1px;
  top: 0.8125rem;
  left: 50%;
  z-index: 0;
}

.stepbar > li:last-child:after {
  display: none;
}

.stepbar > li .break {
  display: block;
}

.stepbar > li b {
  display: none;
}

@media (min-width: 48em) {
  .stepbar > li b {
    display: block;
  }
}

/* mixin*/

.stepbar.ci-blue-dark > li.is-complete {
  color: #889391;
}

.stepbar.ci-blue-dark > li.is-complete:before,
.stepbar.ci-blue-dark > li.is-complete:after {
  color: #ffffff;
  background: #141B4D;
}

.stepbar.ci-blue-dark > li.is-active {
  color: #889391;
}

.stepbar.ci-blue-dark > li.is-active:before {
  background: #141B4D;
}

.stepbar.ci-blue-mid > li.is-complete {
  color: #889391;
}

.stepbar.ci-blue-mid > li.is-complete:before,
.stepbar.ci-blue-mid > li.is-complete:after {
  color: #ffffff;
  background: #0033A0;
}

.stepbar.ci-blue-mid > li.is-active {
  color: #889391;
}

.stepbar.ci-blue-mid > li.is-active:before {
  background: #0033A0;
}

.stepbar.ci-blue-light > li.is-complete {
  color: #889391;
}

.stepbar.ci-blue-light > li.is-complete:before,
.stepbar.ci-blue-light > li.is-complete:after {
  color: #ffffff;
  background: #5BC2E7;
}

.stepbar.ci-blue-light > li.is-active {
  color: #889391;
}

.stepbar.ci-blue-light > li.is-active:before {
  background: #5BC2E7;
}

.stepbar.ci-purple > li.is-complete {
  color: #889391;
}

.stepbar.ci-purple > li.is-complete:before,
.stepbar.ci-purple > li.is-complete:after {
  color: #ffffff;
  background: #84329B;
}

.stepbar.ci-purple > li.is-active {
  color: #889391;
}

.stepbar.ci-purple > li.is-active:before {
  background: #84329B;
}

.stepbar.ci-teal > li.is-complete {
  color: #889391;
}

.stepbar.ci-teal > li.is-complete:before,
.stepbar.ci-teal > li.is-complete:after {
  color: #ffffff;
  background: #00B2A9;
}

.stepbar.ci-teal > li.is-active {
  color: #889391;
}

.stepbar.ci-teal > li.is-active:before {
  background: #00B2A9;
}

.stepbar.ci-teal-light > li.is-complete {
  color: #889391;
}

.stepbar.ci-teal-light > li.is-complete:before,
.stepbar.ci-teal-light > li.is-complete:after {
  color: #ffffff;
  background: #ADCAB8;
}

.stepbar.ci-teal-light > li.is-active {
  color: #889391;
}

.stepbar.ci-teal-light > li.is-active:before {
  background: #ADCAB8;
}

.stepbar.ci-green > li.is-complete {
  color: #889391;
}

.stepbar.ci-green > li.is-complete:before,
.stepbar.ci-green > li.is-complete:after {
  color: #ffffff;
  background: #84BD00;
}

.stepbar.ci-green > li.is-active {
  color: #889391;
}

.stepbar.ci-green > li.is-active:before {
  background: #84BD00;
}

.stepbar.ci-green-dark > li.is-complete {
  color: #889391;
}

.stepbar.ci-green-dark > li.is-complete:before,
.stepbar.ci-green-dark > li.is-complete:after {
  color: #ffffff;
  background: #009639;
}

.stepbar.ci-green-dark > li.is-active {
  color: #889391;
}

.stepbar.ci-green-dark > li.is-active:before {
  background: #009639;
}

.stepbar.ci-green-light > li.is-complete {
  color: #889391;
}

.stepbar.ci-green-light > li.is-complete:before,
.stepbar.ci-green-light > li.is-complete:after {
  color: #ffffff;
  background: #C7E995;
}

.stepbar.ci-green-light > li.is-active {
  color: #889391;
}

.stepbar.ci-green-light > li.is-active:before {
  background: #C7E995;
}

.stepbar.ci-yellow > li.is-complete {
  color: #889391;
}

.stepbar.ci-yellow > li.is-complete:before,
.stepbar.ci-yellow > li.is-complete:after {
  color: #ffffff;
  background: #FFCD00;
}

.stepbar.ci-yellow > li.is-active {
  color: #889391;
}

.stepbar.ci-yellow > li.is-active:before {
  background: #FFCD00;
}

.stepbar.ci-yellow-dark > li.is-complete {
  color: #889391;
}

.stepbar.ci-yellow-dark > li.is-complete:before,
.stepbar.ci-yellow-dark > li.is-complete:after {
  color: #ffffff;
  background: #FFC72C;
}

.stepbar.ci-yellow-dark > li.is-active {
  color: #889391;
}

.stepbar.ci-yellow-dark > li.is-active:before {
  background: #FFC72C;
}

.stepbar.ci-gold > li.is-complete {
  color: #889391;
}

.stepbar.ci-gold > li.is-complete:before,
.stepbar.ci-gold > li.is-complete:after {
  color: #ffffff;
  background: #AC8400;
}

.stepbar.ci-gold > li.is-active {
  color: #889391;
}

.stepbar.ci-gold > li.is-active:before {
  background: #AC8400;
}

.stepbar.ci-orange > li.is-complete {
  color: #889391;
}

.stepbar.ci-orange > li.is-complete:before,
.stepbar.ci-orange > li.is-complete:after {
  color: #ffffff;
  background: #DC4405;
}

.stepbar.ci-orange > li.is-active {
  color: #889391;
}

.stepbar.ci-orange > li.is-active:before {
  background: #DC4405;
}

.stepbar.ci-orange-light > li.is-complete {
  color: #889391;
}

.stepbar.ci-orange-light > li.is-complete:before,
.stepbar.ci-orange-light > li.is-complete:after {
  color: #ffffff;
  background: #DE7C00;
}

.stepbar.ci-orange-light > li.is-active {
  color: #889391;
}

.stepbar.ci-orange-light > li.is-active:before {
  background: #DE7C00;
}

.stepbar.ci-red > li.is-complete {
  color: #889391;
}

.stepbar.ci-red > li.is-complete:before,
.stepbar.ci-red > li.is-complete:after {
  color: #ffffff;
  background: #CB333B;
}

.stepbar.ci-red > li.is-active {
  color: #889391;
}

.stepbar.ci-red > li.is-active:before {
  background: #CB333B;
}

.stepbar.ci-brown > li.is-complete {
  color: #889391;
}

.stepbar.ci-brown > li.is-complete:before,
.stepbar.ci-brown > li.is-complete:after {
  color: #ffffff;
  background: #9E652E;
}

.stepbar.ci-brown > li.is-active {
  color: #889391;
}

.stepbar.ci-brown > li.is-active:before {
  background: #9E652E;
}

.stepbar.ci-brown-dark > li.is-complete {
  color: #889391;
}

.stepbar.ci-brown-dark > li.is-complete:before,
.stepbar.ci-brown-dark > li.is-complete:after {
  color: #ffffff;
  background: #6B4C4C;
}

.stepbar.ci-brown-dark > li.is-active {
  color: #889391;
}

.stepbar.ci-brown-dark > li.is-active:before {
  background: #6B4C4C;
}

.stepbar.ci-brown-dark-heavy > li.is-complete {
  color: #889391;
}

.stepbar.ci-brown-dark-heavy > li.is-complete:before,
.stepbar.ci-brown-dark-heavy > li.is-complete:after {
  color: #ffffff;
  background: #6D4F47;
}

.stepbar.ci-brown-dark-heavy > li.is-active {
  color: #889391;
}

.stepbar.ci-brown-dark-heavy > li.is-active:before {
  background: #6D4F47;
}

.stepbar.ci-metal > li.is-complete {
  color: #889391;
}

.stepbar.ci-metal > li.is-complete:before,
.stepbar.ci-metal > li.is-complete:after {
  color: #ffffff;
  background: #425563;
}

.stepbar.ci-metal > li.is-active {
  color: #889391;
}

.stepbar.ci-metal > li.is-active:before {
  background: #425563;
}

.stepbar.ci-grey > li.is-complete {
  color: #889391;
}

.stepbar.ci-grey > li.is-complete:before,
.stepbar.ci-grey > li.is-complete:after {
  color: #ffffff;
  background: #A2AAAD;
}

.stepbar.ci-grey > li.is-active {
  color: #889391;
}

.stepbar.ci-grey > li.is-active:before {
  background: #A2AAAD;
}

.stepbar.blue-darkest > li.is-complete {
  color: #889391;
}

.stepbar.blue-darkest > li.is-complete:before,
.stepbar.blue-darkest > li.is-complete:after {
  color: #ffffff;
  background: #005e9b;
}

.stepbar.blue-darkest > li.is-active {
  color: #889391;
}

.stepbar.blue-darkest > li.is-active:before {
  background: #005e9b;
}

/**
 * Needed for IE8
 */

.progress__last:after {
  display: none !important;
}

span.image {
  display: block;
  position: absolute;
  top: -130%;
  left: 35%;
  width: 35.2px;
  width: 10rem;
  height: 35.2px;
  height: 10em;
  background-repeat: no-repeat;
  background-color: transparent;
  background-size: 100%;
}

span.image.voice-fixed {
  background-image: url('/today/static/web/img/icons/icon-library/png/voiceit-fixedline-blue.png?e8049d154855');
}

span.image.voice-pbx {
  background-image: url('/today/static/web/img/icons/icon-library/png/voiceit-pbx-blue.png?3d7041dc9740');
}

span.image.employee-browsing {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-search-blue.png?df18a978c1b9');
}

span.image.employee-emails {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-email-blue.png?aacb068e3e73');
}

span.image.employee-voip {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-voipcalls-blue.png?411758b55db2');
}

span.image.employee-video {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-videoconf-blue.png?093a0ab11542');
}

.stepbar.with-icons {
  width: 110%;
  margin: 0 -5%;
  margin-top: 40px;
  margin-top: 2.5rem;
  margin-bottom: 40px;
  margin-bottom: 2.5rem;
  padding-top: 144px;
  padding-top: 9rem;
}

@media (max-width: 48em) {
  .stepbar.with-icons {
    width: 100%;
    margin: 0 auto;
    margin-top: 32px;
    margin-top: 2rem;
    margin-bottom: 32px;
    margin-bottom: 2rem;
    padding-top: 0;
  }
}

.stepbar.with-icons > li {
  font-size: 16px;
  font-size: 1rem;
  line-height: 20px;
  line-height: 1.25rem;
}

@media (max-width: 48em) {
  .stepbar.with-icons > li {
    display: list-item;
  }
}

@media (max-width: 48em) {
  .stepbar.with-icons > li:before {
    color: #ffffff;
    content: attr(data-step);
    display: block;
    margin: 0 auto;
    background: #005e9b;
    width: 28px;
    width: 1.75rem;
    height: 28px;
    height: 1.75rem;
    font-size: 16px;
    font-size: 1rem;
    margin-bottom: 4px;
    margin-bottom: 1.5rem;
    padding: 4px;
    padding: 0.4375rem;
    text-align: center;
    line-height: 0.75;
    border-radius: 100%;
    position: static;
    /* position: relative; */
    z-index: 1000;
    font-family: "Telkom123-Bold", sans-serif;
    overflow: hidden;
    /* float: left; */
    /* clear: both; */
    left: 15%;
  }
}

@media (max-width: 48em) {
  .stepbar.with-icons > li:after {
    display: none;
  }
}

.stepbar.with-icons > li strong {
  font-size: 24px;
  font-size: 1.5rem;
}

.stepbar.with-icons > li p {
  font-size: 14px;
  font-family: "Telkom123-Light", sans-serif;
  padding: 0 25%;
}

@media (max-width: 20em) {
  .stepbar.with-icons > li p {
    padding: 0 5%;
  }
}

.stepbar.with-icons .stepbar-icons {
  margin: 0 auto;
  display: block;
  height: 144px;
  height: 9rem;
  position: absolute;
  top: -144px;
  top: -9rem;
  width: 100%;
  background-position: center;
  background-size: 96px;
  background-size: 6rem;
}

@media (max-width: 48em) {
  .stepbar.with-icons .stepbar-icons {
    position: static;
  }
}

.progress {
  height: 19.2px;
  height: 1.2rem;
  background: #cccccc;
}

.progress-bar {
  height: 100%;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  background: #666666;
}

.progress-bar.blue {
  background: #0083c2;
}

.progress-bar.green {
  background: #00a850;
}

.progress-bar.lime {
  background: #bfd730;
}

.progress-bar.pink {
  background: #da1b60;
}

/******************************/

/*  #15 - Tabs */

/******************************/

/******************************/

/*  CORE  */

[role="tab"].active {
  color: #005e9b;
}

[role="tabpanel"] {
  display: none;
}

[role="tabpanel"].active {
  display: block;
}

.js .collapse .content.close {
  display: none;
}

/******************************/

/*  #16 - Pagination */

/******************************/

.pagination {
  display: block;
  text-align: center;
  margin: 0 auto;
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  font-family: "Telkom123-Bold", sans-serif;
  color: #ffffff;
}

.pagination ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: inline-block;
  text-align: center;
}

.pagination li {
  float: left;
  color: #2695cb;
  margin: 0;
}

@media only screen and (min-width: 48em) {
  .pagination li {
    margin-left: 4px;
    margin-left: 0.25rem;
    margin-right: 4px;
    margin-right: 0.25rem;
  }
}

@media only screen and (min-width: 62em) {
  .pagination li {
    margin-left: 4px;
    margin-left: 0.25rem;
    margin-right: 4px;
    margin-right: 0.25rem;
  }
}

.pagination a {
  padding-left: 12.8px;
  padding-left: 0.8rem;
  padding-right: 12.8px;
  padding-right: 0.8rem;
  line-height: 34px;
  line-height: 2.125rem;
  font-size: 13px;
  font-size: 0.8125rem;
  margin: 0 1px;
  display: block;
  text-decoration: none;
  color: #889391;
  background-position: 50%;
}

.pagination a:hover {
  color: #889391;
}

.pagination a.page-left,
.pagination a.page-right {
  height: 34px;
  height: 2.125rem;
  background-size: 4.8px;
  background-size: 0.3rem;
}

.pagination li.on a {
  background-color: #0083c2;
  color: #ffffff;
}

.pagination span {
  padding-top: 8px;
  padding-top: 0.5rem;
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
  color: #889391;
}

/******************************/

/*  #19 - Blocks */

/******************************/

/******************************/

/*  BLOCKS (frequently used on Homepage and listings) */

.foundry-listing-unique-selling-point {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 32px;
  padding-bottom: 2rem;
}

@media (min-width: 48em) {
  .foundry-listing-unique-selling-point {
    padding-top: 48px;
    padding-top: 3rem;
    padding-bottom: 48px;
    padding-bottom: 3rem;
  }
}

.foundry-listing-unique-selling-point .item {
  display: table-row;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
}

.foundry-listing-unique-selling-point .item > a {
  text-decoration: none;
  display: block;
}

@media (min-width: 48em) {
  .foundry-listing-unique-selling-point .item {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .foundry-listing-unique-selling-point .item:nth-child(2n) {
    margin-right: 0;
  }
}

@media (min-width: 62em) {
  .foundry-listing-unique-selling-point .item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
    margin-top: 0;
    margin-bottom: 0;
  }

  .foundry-listing-unique-selling-point .item:nth-child(2n) {
    margin-right: 2.85714%;
  }

  .foundry-listing-unique-selling-point .item:nth-child(3n) {
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .foundry-listing-unique-selling-point .item {
    width: 14.28571%;
    float: left;
    margin-right: 2.85714%;
    margin-top: 0;
    margin-bottom: 0;
  }

  .foundry-listing-unique-selling-point .item:nth-child(2n) {
    margin-right: 2.85714%;
  }

  .foundry-listing-unique-selling-point .item:nth-child(3n) {
    margin-right: 2.85714%;
  }

  .foundry-listing-unique-selling-point .item:last-child {
    margin-right: 0;
  }
}

.foundry-listing-unique-selling-point .item .image {
  width: 30%;
  display: table-cell;
  position: relative;
  top: 0;
  left: 0;
}

@media (min-width: 48em) {
  .foundry-listing-unique-selling-point .item .image {
    width: 100%;
    float: none;
    display: block;
    margin: 0;
    height: 128px;
    height: 8rem;
    overflow: hidden;
  }
}

.foundry-listing-unique-selling-point .item .image img {
  display: block;
  max-width: 85%;
  max-height: 128px;
  max-height: 8rem;
  position: relative;
}

@media (min-width: 48em) {
  .foundry-listing-unique-selling-point .item .image img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
  }
}

.foundry-listing-unique-selling-point .item .text {
  width: 75%;
  display: table-cell;
  vertical-align: middle;
  text-align: left;
}

@media (min-width: 48em) {
  .foundry-listing-unique-selling-point .item .text {
    width: 100%;
    display: block;
    text-align: center;
  }
}

@media (min-width: 62em) {
  .foundry-listing-unique-selling-point .item .text {
    text-align: left;
  }
}

.foundry-listing-unique-selling-point .item h2 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 25.8px;
  line-height: 1.6125rem;
  color: #000000;
  letter-spacing: -1px;
  margin: 0;
  padding-top: 0;
}

@media (min-width: 48em) {
  .foundry-listing-unique-selling-point .item h2 {
    font-size: 24px;
    font-size: 1.5rem;
    line-height: 25.8px;
    line-height: 1.6125rem;
    margin-left: 0;
    margin-top: 16px;
    margin-top: 1rem;
    margin-bottom: 16px;
    margin-bottom: 1rem;
    padding-top: 16px;
    padding-top: 1rem;
  }
}

@media (min-width: 62em) {
  .foundry-listing-unique-selling-point .item h2 {
    padding-left: 32px;
    padding-left: 2rem;
  }
}

.foundry-listing-unique-selling-point .item h2 b {
  display: block;
}

.foundry-listing-unique-selling-point .item h2 br {
  display: none;
}

@media (min-width: 48em) {
  .foundry-listing-unique-selling-point .item h2 br {
    display: block;
  }
}

.foundry-listing-unique-selling-point .item h3 {
  display: none;
}

.foundry-listing-unique-selling-point .item .btn-secondary {
  display: block;
  margin-bottom: 0;
  border: 1px solid #e8e7e7;
}

.foundry-listing-unique-selling-point:after {
  content: "";
  display: block;
  clear: both;
}

.item-shop {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  text-align: center;
}

.item-shop img {
  max-width: 50%;
  min-width: 30%;
  display: block;
  margin: 0 auto;
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.item-shop p {
  margin: 0;
}

@media (min-width: 48em) {
  .item-shop {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media (min-width: 62em) {
  .item-shop {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }
}

/***************************************/

/*  #20 - HEADING INTERACTIVE          */

/***************************************/

.heading-interactive {
  display: table;
}

.heading-interactive-title,
.heading-interactive-action {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
  padding-top: 0;
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

.heading-interactive-title,
.heading-interactive-action {
  *zoom: 1;
}

.heading-interactive-title:before,
.heading-interactive-title:after,
.heading-interactive-action:before,
.heading-interactive-action:after {
  content: "";
  display: table;
}

.heading-interactive-title:after,
.heading-interactive-action:after {
  clear: both;
}

@media (min-width: 48em) {
  .heading-interactive-title,
  .heading-interactive-action {
    display: table-cell;
    vertical-align: middle;
  }
}

@media (min-width: 62em) {
  .heading-interactive-title,
  .heading-interactive-action {
    display: table-cell;
    vertical-align: middle;
  }
}

.heading-interactive-title {
  letter-spacing: -1px;
  padding-right: 24px;
  padding-right: 1.5rem;
}

@media (max-width: 48em) {
  .heading-interactive-title {
    padding-bottom: 25.6px;
    padding-bottom: 1.6rem;
  }
}

.heading-interactive-action {
  text-align: right;
}

.heading-interactive .switch-label {
  right: 48px;
  right: 3rem;
}

.heading-interactive .switch {
  margin: 0;
  margin-top: 3.2px;
  margin-top: 0.2rem;
  height: 22.4px;
  height: 1.4rem;
}

.heading-interactive .switch.margin-left {
  margin-left: 48px;
  margin-left: 3rem;
}

.heading-interactive .switch input.toggle + label {
  width: 41.6px;
  width: 2.6rem;
  height: 22.4px;
  height: 1.4rem;
  padding: 2.4px;
  padding: 0.15rem;
  border-radius: 22.4px;
  border-radius: 1.4rem;
}

.heading-interactive .switch input.toggle + label:before {
  border-radius: 22.4px;
  border-radius: 1.4rem;
}

.heading-interactive .switch input.toggle + label:after {
  width: 12.8px;
  width: 0.8rem;
  top: 4.8px;
  top: 0.3rem;
  right: 4.8px;
  right: 0.3rem;
  bottom: 4.8px;
  bottom: 0.3rem;
  border-radius: 12.8px;
  border-radius: 0.8rem;
}

.heading-interactive .switch input.toggle:checked + label:after {
  margin-right: 19.2px;
  margin-right: 1.2rem;
}

.heading-drawer {
  display: table;
  width: 100%;
}

.heading-drawer-group {
  display: table-cell;
  vertical-align: middle;
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

.heading-drawer-action {
  padding-top: 16px;
  padding-top: 1rem;
  vertical-align: top;
  text-align: right;
}

.heading-drawer-title {
  margin: 0;
  color: #889391;
}

.heading-drawer-subtitle {
  margin-top: 4px;
  margin-top: 0.25rem;
}

.heading-interactive-filter {
  display: block;
  /* .compare {
            float: left;
            position: relative;
            z-index: 1;
            margin-top: 1px;
            margin-bottom: 1px;
        } */
}

.heading-interactive-filter .heading-interactive-title {
  padding-bottom: 0;
  white-space: nowrap;
}

@media (min-width: 48em) {
  .heading-interactive-filter .heading-interactive-title {
    padding-bottom: 25.6px;
    padding-bottom: 1.6rem;
  }
}

.heading-interactive-filter .heading-interactive-action {
  width: 100%;
  text-align: left;
}

.heading-interactive-filter .pills {
  float: left;
  margin-right: 24px;
  margin-right: 1.5rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

@media (min-width: 48em) {
  .heading-interactive-filter .pills {
    margin-bottom: 0;
  }
}

@media (min-width: 62em) {
  .heading-interactive-filter .pills {
    margin-bottom: 0;
  }
}

.heading-interactive-filter .pills ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: block;
  border-radius: 24px;
  border-radius: 1.5rem;
  border: 1px solid #e8e7e7;
}

.heading-interactive-filter .pills ul li {
  display: inline-block;
  line-height: 1;
  padding: 4px;
  padding: 0.25rem;
}

.heading-interactive-filter .pills ul li.on a {
  background-color: #0083c2;
  color: #ffffff;
}

.heading-interactive-filter .pills ul li.on a:hover {
  background-color: #005e9b;
}

.heading-interactive-filter .pills ul a {
  padding-top: 10.4px;
  padding-top: 0.65rem;
  padding-bottom: 12.8px;
  padding-bottom: 0.8rem;
  padding-left: 12px;
  padding-left: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem;
  border-radius: 24px;
  border-radius: 1.5rem;
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  line-height: inherit;
  font-size: 12px;
  font-size: 0.75rem;
  color: #889391;
}

.heading-interactive-filter .pills ul a:hover {
  color: #0083c2;
}

.heading-interactive-filter .filter {
  float: left;
  line-height: 40px;
  line-height: 2.5rem;
  margin-right: 24px;
  margin-right: 1.5rem;
  position: relative;
}

.heading-interactive-filter .compare {
  float: right;
  line-height: 40px;
  line-height: 2.5rem;
  margin-right: 0;
  position: relative;
}

.heading-interactive-filter .filter-btn {
  font-size: 12px;
  font-size: 0.75rem;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: bold;
  color: #889391;
  z-index: 10;
  position: relative;
}

.heading-interactive-filter .filter-btn.on {
  width: 180px;
  width: 11.25rem;
  position: absolute;
  margin-top: 1px;
  display: block;
  background-color: #ffffff;
}

@media (min-width: 48em) {
  .heading-interactive-filter .filter-btn.on {
    width: 64px;
    width: 4rem;
    position: relative;
    background: transparent;
    margin-top: 0;
    display: inline-block;
  }
}

.heading-interactive-filter .filter-btn,
.heading-interactive-filter .compare-btn,
.heading-interactive-filter .compare a,
.heading-interactive-filter .compare-cancel a {
  -webkit-transition: 0.5s;
  transition: 0.5s;
  font-weight: normal !important;
  font-family: "Telkom123-Regular", sans-serif !important;
}

.heading-interactive-filter .filter-btn:hover,
.heading-interactive-filter .compare-btn:hover,
.heading-interactive-filter .compare a:hover,
.heading-interactive-filter .compare-cancel a:hover {
  color: #0083c2;
}

.heading-interactive-filter .filter-options {
  min-width: 208px;
  min-width: 13rem;
  height: 208px;
  height: 13rem;
  overflow-y: scroll;
  padding: 16px;
  padding: 1rem;
  border: 1px solid #e8e7e7;
  background: #ffffff;
  position: absolute;
  z-index: 9;
  top: 0;
  left: -16px;
  left: -1rem;
  display: none;
}

@media (min-width: 48em) {
  .heading-interactive-filter .filter-options {
    height: auto;
    overflow: auto;
    min-width: 432px;
    min-width: 27rem;
  }
}

.heading-interactive-filter .filter-options ul {
  margin: 0;
  padding: 0;
  padding-top: 32px;
  padding-top: 2rem;
  list-style: none;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .heading-interactive-filter .filter-options ul {
    width: 44.28571%;
    float: left;
    margin-right: 2.85714%;
  }
}

.heading-interactive-filter .filter-options ul span {
  float: right;
  border: 1px solid #e8e7e7;
  text-align: center;
  min-width: 32px;
  min-width: 2rem;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 20px;
  line-height: 1.25rem;
  margin-top: 10.4px;
  margin-top: 0.65rem;
  padding-left: 8px;
  padding-left: 0.5rem;
  padding-right: 8px;
  padding-right: 0.5rem;
  border-radius: 20px;
  border-radius: 1.25rem;
}

@media (min-width: 48em) {
  .heading-interactive-filter .filter-options ul:last-child {
    float: right;
    margin-right: 0;
  }
}

.heading-interactive-filter .filter-options ul:last-child {
  float: right;
  margin-right: 0;
}

.heading-interactive-filter .filter-options li {
  position: relative;
}

.heading-interactive-filter .filter-options input {
  display: none;
}

.heading-interactive-filter .filter-options label {
  margin-left: 24px;
  margin-left: 1.5rem;
  cursor: pointer;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.heading-interactive-filter .filter-options label *,
.heading-interactive-filter .filter-options label:before,
.heading-interactive-filter .filter-options label:after {
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.heading-interactive-filter .filter-options label:hover {
  color: #0083c2;
}

.heading-interactive-filter .filter-options label:hover *,
.heading-interactive-filter .filter-options label:hover:before,
.heading-interactive-filter .filter-options label:hover:after {
  color: #0083c2;
  border-color: #0083c2;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.heading-interactive-filter .filter-options input + label {
  width: 18px;
  width: 1.125rem;
  height: 18px;
  height: 1.125rem;
}

.heading-interactive-filter .filter-options input + label:before,
.heading-interactive-filter .filter-options input + label:after {
  width: 18px;
  width: 1.125rem;
  height: 18px;
  height: 1.125rem;
  border-radius: 18px;
  border-radius: 1.125rem;
  display: block;
  position: absolute;
  left: 0;
  content: "";
}

.heading-interactive-filter .filter-options input + label:before {
  top: 12px;
  top: 0.75rem;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #ffffff;
  border: 1px solid #e8e7e7;
  -webkit-transition: background 0.4s;
  transition: background 0.4s;
}

.heading-interactive-filter .filter-options input + label:after {
  width: 18px;
  width: 1.125rem;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  -webkit-transition: margin 0.4s, background 0.4s;
  transition: margin 0.4s, background 0.4s;
}

.heading-interactive-filter .filter-options input:checked + label {
  background-color: #ffffff;
}

.heading-interactive-filter .filter-options input:checked + label span {
  background: #0083c2;
  color: #ffffff;
  border: 1px solid #005e9b;
}

.heading-interactive-filter .filter-options input:checked + label:before {
  border: 1px solid #005e9b;
  background-color: #0083c2;
}

.heading-interactive-filter .filter-options .on-promotion label {
  color: #889391;
}

.heading-interactive-filter .filter-options .on-promotion input + label:before {
  border: 1px solid #da1b60;
}

.heading-interactive-filter .filter-options .on-promotion input:checked + label:before {
  border: 1px solid #da1b60;
  background-color: #da1b60;
}

.heading-interactive-filter .filter-options .on-promotion input + label span {
  border: 1px solid #da1b60;
}

.heading-interactive-filter .filter-options .on-promotion input:checked + label span {
  background: #da1b60;
  border: 1px solid #da1b60;
}

.heading-interactive-filter .compare-btn,
.heading-interactive-filter .compare-cancel a {
  display: inline-block;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 40px;
  line-height: 2.5rem;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: bold;
  color: #889391;
  position: relative;
  z-index: 3;
}

.heading-interactive-filter .compare-flip {
  display: none;
}

.heading-interactive-filter .compare-flip div {
  float: right;
}

.heading-interactive-filter .compare-flip .compare-proceed a {
  margin: 0;
  margin-top: 3px;
  margin-left: 24px;
  margin-left: 1.5rem;
  display: none;
}

.heading-interactive-filter .compare-flip .compare-proceed [class*="btn"]:hover {
  color: #ffffff;
}

.heading-interactive-filter .all-or-none {
  clear: both;
  margin-bottom: -8px;
  margin-bottom: -0.5rem;
  text-align: right;
}

.heading-interactive-filter .all-or-none a {
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 40px;
  line-height: 2.5rem;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: normal;
  color: #889391;
}

.heading-interactive-filter .all-or-none a:hover {
  color: #0083c2;
}

/******************************/

/*  #23.3 - Section Unit */

/******************************/

.section-unit {
  margin-bottom: 4.74074px;
  margin-bottom: 0.2963rem;
}

.section-unit .section-subtitle-border {
  margin-bottom: 3.79259px;
  margin-bottom: 0.23704rem;
}

/******************************/

/*  #23.4 - Section Sub Unit */

/******************************/

.section-subunit .blue {
  color: #0083c2;
}

.section-subunit .green {
  color: #00a850;
}

.section-subunit .lime {
  color: #bfd730;
}

.section-subunit .orange {
  color: #f04e23;
}

.section-subunit .pink {
  color: #da1b60;
}

/******************************/

/*  #29.2 - Breakdown Unit */

/******************************/

.breakdown-unit {
  padding-bottom: 6.4px;
  padding-bottom: 0.4rem;
}

/******************************/

/*  #30 - Button Unit */

/******************************/

.button-unit {
  padding-top: 16px;
  padding-top: 1rem;
}

.button-unit .button {
  float: left;
}

.button-unit .button .btn {
  display: block;
  margin-right: 5.28px;
  margin-right: 0.33rem;
  margin-left: 5.28px;
  margin-left: 0.33rem;
}

.button-unit.two .button {
  width: 50%;
}

.button-unit.two .button .btn {
  margin-right: 8px;
  margin-right: 0.5rem;
  margin-left: 8px;
  margin-left: 0.5rem;
}

.button-unit.two .button:first-child .btn {
  margin-left: 0;
  margin-right: 8px;
  margin-right: 0.5rem;
}

.button-unit.two .button:last-child .btn {
  margin-right: 0;
  margin-left: 8px;
  margin-left: 0.5rem;
}

.button-unit.three .button {
  width: 33.3333%;
}

.button-unit.three .button .btn {
  margin-right: 5.28px;
  margin-right: 0.33rem;
  margin-left: 5.28px;
  margin-left: 0.33rem;
}

.button-unit.three .button:first-child .btn {
  margin-left: 0;
  margin-right: 10.56px;
  margin-right: 0.66rem;
}

.button-unit.three .button:last-child .btn {
  margin-right: 0;
  margin-left: 10.56px;
  margin-left: 0.66rem;
}

.button-unit.vertical .button {
  width: 100%;
  float: none;
}

.button-unit.vertical .button .btn {
  margin: 0;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
}

.button-unit.vertical .button:last-child .btn {
  margin-bottom: 0;
}

[class*="pill-group"] {
  background-color: #f7f7f7;
  padding: 5px;
}

[class*="pill-group"][class*="equal"] {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

[class*="pill-group"][class*="centered"] {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

[class*="pill-group"][class*="centered"] {
  *zoom: 1;
}

[class*="pill-group"][class*="centered"]:before,
[class*="pill-group"][class*="centered"]:after {
  content: "";
  display: table;
}

[class*="pill-group"][class*="centered"]:after {
  clear: both;
}

[class*="grey"] [class*="pill-group"] {
  background-color: #ffffff;
}

[class*="pill-group"][class*="transparent"] {
  background-color: transparent;
}

[class*="pill-group"][class*="transparent"][class*="grey-bordered"] {
  border: 1px solid #cccccc;
}

[class*="pill-group"][class*="transparent"][class*="white-bordered"] {
  border: 1px solid #ffffff;
}

@media (max-width: 48em) {
  [class*="pill-group"] {
    border-radius: 24px;
    border-radius: 1.5rem;
  }

  [class*="pill-group"] [class*="pill-"] {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
    text-align: center;
  }
}

@media (min-width: 48em) {
  [class*="pill-group"] {
    border-radius: 80px;
    border-radius: 5rem;
    display: table;
    table-layout: fixed;
  }

  [class*="pill-group"] .pill-row {
    display: table-row;
  }

  [class*="pill-group"] [class*='pill-'] {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
  }
}

/***************************************/

/*  #33 - Choices                      */

/***************************************/

.choices {
  padding-top: 16px;
  padding-top: 1rem;
}

@media (min-width: 48em) {
  .choices {
    padding-top: 0;
  }
}

.choices .options {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.choices .options {
  *zoom: 1;
}

.choices .options:before,
.choices .options:after {
  content: "";
  display: table;
}

.choices .options:after {
  clear: both;
}

.choices .option {
  position: relative;
  width: 48.57143%;
  float: left;
  margin-right: 2.85714%;
  min-height: 224px;
  min-height: 14rem;
  text-align: center;
}

@media (max-width: 48em) {
  .choices .option:nth-child(2n+2) {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 48em) {
  .choices .option {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
    min-height: 240px;
    min-height: 15rem;
  }
}

@media (min-width: 48em) and (max-width: 75em) {
  .choices .option:nth-child(3n+3) {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .choices .option {
    width: 14.28571%;
    float: left;
    margin-right: 2.85714%;
    min-height: 240px;
    min-height: 15rem;
  }

  .choices .option:nth-child(6n+6) {
    float: right;
    margin-right: 0;
  }
}

.choices .option .pick,
.choices .option input + label {
  position: relative;
}

.choices .option input {
  margin-top: -16px;
  margin-top: -1rem;
  padding: 24px;
  padding: 1.5rem;
  display: none;
}

.choices .option input + label {
  display: block;
  cursor: pointer;
}

.choices .option input + label * {
  -webkit-transition: 0.5s;
  transition: 0.5s;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.choices .option input + label img {
  opacity: 0.25;
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
  pointer-events: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
}

.choices .option input + label .indicator,
.choices .option input + label .icon {
  pointer-events: none;
}

@media (min-width: 62em) {
  .choices .option input + label:hover img {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.choices .option input:checked + label img {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

.indicator {
  position: absolute;
  width: 38px;
  width: 2.375rem;
  height: 38px;
  height: 2.375rem;
  bottom: -4px;
  bottom: -0.25rem;
  right: 25%;
  cursor: pointer;
}

.indicator > div {
  width: 38px;
  width: 2.375rem;
  height: 38px;
  height: 2.375rem;
  background-size: 100%;
  background-size: contain;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.pick input + label * {
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
}

.pick input + label .indicator .icon-product-add,
.pick input + label .indicator .icon-product-added {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.pick input + label .indicator .icon-product-add {
  z-index: 1;
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
}

.pick input + label .indicator .icon-product-added {
  z-index: 0;
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.pick input:checked + label .indicator .icon-product-add {
  z-index: 0;
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.pick input:checked + label .indicator .icon-product-added {
  z-index: 1;
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
}

.pick + .custom-number {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -44px;
  bottom: -2.75rem;
}

.choices-carousel .option {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

/******************************/

/*  #37 - Search Filter       */

/******************************/

.search-filter {
  margin-top: 0;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
}

@media only screen and (min-width: 48em) {
  .search-filter {
    margin-top: 48px;
    margin-top: 3rem;
  }
}

@media only screen and (min-width: 62em) {
  .search-filter {
    margin-top: 48px;
    margin-top: 3rem;
  }
}

.search-filter a {
  display: inline-block;
  margin-right: 16px;
  margin-right: 1rem;
  text-decoration: none;
  color: #889391;
}

@media only screen and (min-width: 48em) {
  .search-filter a {
    margin-right: 24px;
    margin-right: 1.5rem;
  }
}

@media only screen and (min-width: 62em) {
  .search-filter a {
    margin-right: 24px;
    margin-right: 1.5rem;
  }
}

.search-filter a i {
  font-style: normal;
}

.search-filter a span {
  min-width: 40px;
  min-width: 2.5rem;
  min-height: 16px;
  min-height: 1rem;
  border-radius: 32px;
  border-radius: 2rem;
  line-height: 24px;
  line-height: 1.5rem;
  margin-top: 3px;
  margin-top: 0.1875rem;
  margin-left: 4px;
  margin-left: 0.25rem;
  font-size: 13px;
  font-size: 0.8125rem;
  border: 1px solid #e8e7e7;
  display: inline-block;
  text-align: center;
}

@media only screen and (min-width: 48em) {
  .search-filter a span {
    margin-left: 8px;
    margin-left: 0.5rem;
  }
}

@media only screen and (min-width: 62em) {
  .search-filter a span {
    margin-left: 8px;
    margin-left: 0.5rem;
  }
}

.search-filter a.on {
  color: #0083c2;
}

.search-filter a.on span {
  background: #0083c2;
  color: #ffffff;
  border: 1px solid #005e9b;
}

.search-filter a:last-child {
  margin-right: 0;
}

/******************************/

/*  #37 - Search Result       */

/******************************/

.search-result {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
  max-width: 112%;
  border-top: 1px solid #e8e7e7;
  padding-top: 36px;
  padding-top: 2.25rem;
  padding-bottom: 36px;
  padding-bottom: 2.25rem;
  margin-left: -6%;
  margin-right: -6%;
  padding-left: 6%;
  padding-right: 6%;
  -webkit-transition: background-color 0.1s ease;
  transition: background-color 0.1s ease;
  position: relative;
  z-index: 1;
}

.search-result {
  *zoom: 1;
}

.search-result:before,
.search-result:after {
  content: "";
  display: table;
}

.search-result:after {
  clear: both;
}

.search-result:hover {
  border-color: #ffffff;
  background-color: #ffffff;
  z-index: 2;
}

.search-result h2 a {
  color: #000000;
  text-decoration: none;
}

.search-result h2 a:hover {
  color: #0083c2;
}

.search-result .image {
  width: 31.42857%;
  float: left;
  margin-right: 2.85714%;
}

.search-result .image img {
  max-width: 80%;
  margin: 0 auto;
  display: block;
}

@media (min-width: 48em) {
  .search-result .image {
    width: 14.28571%;
    float: left;
    margin-right: 2.85714%;
  }
}

.search-result .description {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: right;
  margin-right: 0;
}

@media (min-width: 48em) {
  .search-result .description {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
    float: right;
    margin-right: 0;
  }
}

.search-result .description a {
  text-decoration: none;
}

.search-result h2,
.search-result p {
  -webkit-transition: color 0.3s ease;
  transition: color 0.3s ease;
}

.search-result h2 {
  margin-top: 0;
}

@media (min-width: 48em) {
  .search-result h2 {
    margin-top: 16px;
    margin-top: 1rem;
  }
}

.search-result p {
  color: #889391;
  text-decoration: none;
}

.compare-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #f7f7f6;
  display: none;
  z-index: 50;
}

.compare-overlay .page-title h1 {
  width: 70%;
}

.compare-table {
  width: 100%;
  margin-top: 48px;
  margin-top: 3rem;
  margin-bottom: 48px;
  margin-bottom: 3rem;
  text-align: left;
  table-layout: fixed;
}

.compare-table td {
  vertical-align: top;
  padding-top: 0px;
  padding-top: 0rem;
  padding-right: 24px;
  padding-right: 1.5rem;
  padding-bottom: 0px;
  padding-bottom: 0rem;
  padding-left: 24px;
  padding-left: 1.5rem;
}

.compare-table td:first-child {
  padding-left: 0;
}

.compare-table td:last-child {
  padding-right: 0;
}

.compare-table img {
  display: block;
  margin: 0 auto;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
}

.compare-table h1 {
  font-family: "Telkom123-Bold", sans-serif;
  color: #0083c2;
  margin: 0;
}

@media (max-width: 48em) {
  .compare-table h1 {
    font-size: 170%;
    line-height: 1.1;
  }
}

@media (max-width: 48em) {
  .compare-table h2 {
    font-size: 150%;
    line-height: 1.1;
  }
}

.compare-table p {
  line-height: 20px;
  line-height: 1.25rem;
}

.slider-select {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.slider-select .SumoSelect {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .slider-select .SumoSelect {
    display: none;
  }
}

.slider-select .ss-slider {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  position: relative;
  display: table;
  table-layout: fixed;
  list-style: none;
  padding: 0;
  margin: 0;
}

@media (max-width: 48em) {
  .slider-select .ss-slider {
    display: none;
  }
}

.slider-select .ss-slider > li {
  display: table-cell;
  position: relative;
  vertical-align: top;
  text-align: center;
}

.slider-select .ss-slider > li:after {
  content: '';
  position: absolute;
  display: block;
  background: #dddddd;
  width: 100%;
  height: 5.6px;
  height: 0.35rem;
  margin-left: 2.66667px;
  margin-left: 0.16667rem;
  top: 17.6px;
  top: 1.1rem;
  left: 50%;
  z-index: 0;
}

.slider-select .ss-slider > li:last-child:after {
  display: none;
}

.slider-select .ss-slider > li > a {
  display: block;
  padding: 0 1rem;
  color: #dddddd;
  font-family: "Telkom123-Bold", sans-serif;
  line-height: 1;
  text-decoration: none;
  background: none;
  border: none;
  width: 100%;
}

.slider-select .ss-slider > li > a:before {
  -webkit-transition: 0.5s;
  transition: 0.5s;
  content: '';
  display: block;
  margin: 0 auto;
  border: 5px solid #dddddd;
  background-color: #dddddd;
  width: 40px;
  width: 2.5rem;
  height: 40px;
  height: 2.5rem;
  font-size: 16px;
  font-size: 1rem;
  margin-bottom: 4px;
  margin-bottom: 0.25rem;
  padding: 7px;
  padding: 0.4375rem;
  text-align: center;
  line-height: 1;
  border-radius: 100%;
  position: relative;
  z-index: 1000;
  font-family: "Telkom123-Bold", sans-serif;
}

.slider-select .ss-slider > li > a:hover:before {
  background-color: #0083c2;
}

.slider-select .ss-slider > .active > a {
  color: #666666;
}

.slider-select .ss-slider > .active > a:before {
  background-color: #0083c2;
}

.slider-select .ss-slider > .active .pill-holder {
  display: table;
}

.slider-select .ss-slider > .active .pill-holder + a {
  pointer-events: none;
}

.slider-select .pill-holder {
  display: none;
  table-layout: fixed;
  width: 100%;
  max-width: 192px;
  max-width: 12rem;
  height: 40px;
  height: 2.5rem;
  margin: 0 auto;
  top: 0;
  left: 0;
  right: 0;
  position: absolute;
  z-index: 2000;
  border: 5px solid #e8e7e7;
  background-color: #e8e7e7;
  border-radius: 25px;
}

.slider-select .pill-holder a {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  height: 100%;
  border-radius: 25px;
  text-decoration: none;
  color: #0083c2;
}

.slider-select .pill-holder .active {
  background-color: #0083c2;
  color: #ffffff;
}

[class*="promo-tile"]:not(.promo-tile-grid) {
  padding: 2.85714%;
  background: #ffffff;
  border: #e8e7e7;
  position: relative;
}

[class*="promo-tile"]:not(.promo-tile-grid) .price-ranges {
  margin-bottom: 2.85714%;
  width: 100%;
}

[class*="promo-tile"]:not(.promo-tile-grid) .counter {
  text-align: center;
  border-radius: 400px;
  border-radius: 25rem;
  padding: 8px;
  padding: 0.5rem;
  width: 88px;
  width: 5.5rem;
  height: 88px;
  height: 5.5rem;
  position: absolute;
  right: -16px;
  right: -1rem;
  top: -16px;
  top: -1rem;
  z-index: 2;
  box-shadow: -3px 3px 0px #f7f7f7;
  color: #ffffff;
}

[class*="promo-tile"]:not(.promo-tile-grid) .promo-location {
  margin-top: 0;
  margin-bottom: 2.85714%;
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
}

[class*="promo-tile"]:not(.promo-tile-grid) .promo-location small {
  margin-top: 8px;
  margin-top: 0.5rem;
}

[class*="promo-tile"]:not(.promo-tile-grid) .promo-location,
[class*="promo-tile"]:not(.promo-tile-grid) .price {
  font-family: "Telkom123-Bold", sans-serif;
}

[class*="promo-tile"]:not(.promo-tile-grid) .price {
  font-size: 32px;
  font-size: 2rem;
  line-height: 34.4px;
  line-height: 2.15rem;
  margin: 0;
}

[class*="promo-tile"]:not(.promo-tile-grid) .price small {
  font-size: 50%;
}

[class*="promo-tile"]:not(.promo-tile-grid) .price-ranges {
  margin-bottom: 2.85714%;
  margin-left: -16px;
  margin-left: -1rem;
  display: table;
  table-row: fixed;
}

[class*="promo-tile"]:not(.promo-tile-grid) .price-ranges .item {
  display: table-cell;
  padding: 0;
  padding-left: 16px;
  padding-left: 1rem;
  border-left: 1px solid #e8e7e7;
  border-right: 1px solid #e8e7e7;
}

[class*="promo-tile"]:not(.promo-tile-grid) .price-ranges .item:first-child {
  border-left: 0;
}

[class*="promo-tile"]:not(.promo-tile-grid) .price-ranges .item:last-child {
  border-right: 0;
}

[class*="promo-tile"]:not(.promo-tile-grid) .price-ranges .focal-point,
[class*="promo-tile"]:not(.promo-tile-grid) .price-ranges .description {
  margin: 0;
  max-width: 100%;
  padding-right: 16px;
  padding-right: 1rem;
}

[class*="promo-tile"]:not(.promo-tile-grid) .price-ranges .description {
  text-align: left;
  color: #0083c2;
}

[class*="promo-tile"]:not(.promo-tile-grid) .unavailable * {
  color: #cccccc !important;
}

[class*="promo-tile"]:not(.promo-tile-grid).entry-open .counter .count {
  font-size: 40px;
  font-size: 2.5rem;
  font-family: "Telkom123-Bold", sans-serif;
  line-height: 0.7;
  margin-top: 14.4px;
  margin-top: 0.9rem;
  margin-left: -2px;
  margin-left: -0.125rem;
}

[class*="promo-tile"]:not(.promo-tile-grid).entry-open .counter .description {
  font-size: 90%;
}

[class*="promo-tile"]:not(.promo-tile-grid).entry-closed .counter .description {
  font-family: "Telkom123-Bold", sans-serif;
  font-size: 25.6px;
  font-size: 1.6rem;
  line-height: 0.95;
  margin-top: 12px;
  margin-top: 0.75rem;
  margin-left: -2.496px;
  margin-left: -0.156rem;
}

[class*="promo-tile"]:not(.promo-tile-grid).entry-closed .unavailable * {
  text-decoration: line-through;
}

[class*="promo-tile"]:not(.promo-tile-grid) > [class*="btn-"] {
  margin-top: 0;
}

.promo-tile-white .counter {
  background-color: #ffffff;
}

.promo-tile-white .price,
.promo-tile-white .promo-location {
  color: #ffffff;
}

.promo-tile-white .price small,
.promo-tile-white .promo-location small {
  color: #ffffff;
}

.promo-tile-white .promo-location {
  color: #000000;
}

.promo-tile-blue .counter {
  background-color: #0083c2;
}

.promo-tile-blue .price,
.promo-tile-blue .promo-location {
  color: #0083c2;
}

.promo-tile-blue .price small,
.promo-tile-blue .promo-location small {
  color: #0083c2;
}

.promo-tile-blue .promo-location {
  color: #000000;
}

.promo-tile-blue-alt .counter {
  background-color: #0083c2;
}

.promo-tile-blue-alt .price,
.promo-tile-blue-alt .promo-location {
  color: #0083c2;
}

.promo-tile-blue-alt .price small,
.promo-tile-blue-alt .promo-location small {
  color: #0083c2;
}

.promo-tile-blue-alt .promo-location {
  color: #000000;
}

.promo-tile-blue-dark .counter {
  background-color: #005e9b;
}

.promo-tile-blue-dark .price,
.promo-tile-blue-dark .promo-location {
  color: #005e9b;
}

.promo-tile-blue-dark .price small,
.promo-tile-blue-dark .promo-location small {
  color: #005e9b;
}

.promo-tile-blue-dark .promo-location {
  color: #000000;
}

.promo-tile-pink .counter {
  background-color: #da1b60;
}

.promo-tile-pink .price,
.promo-tile-pink .promo-location {
  color: #da1b60;
}

.promo-tile-pink .price small,
.promo-tile-pink .promo-location small {
  color: #da1b60;
}

.promo-tile-pink .promo-location {
  color: #000000;
}

.promo-tile-orange .counter {
  background-color: #f04e23;
}

.promo-tile-orange .price,
.promo-tile-orange .promo-location {
  color: #f04e23;
}

.promo-tile-orange .price small,
.promo-tile-orange .promo-location small {
  color: #f04e23;
}

.promo-tile-orange .promo-location {
  color: #000000;
}

.promo-tile-cyan .counter {
  background-color: #00d0ff;
}

.promo-tile-cyan .price,
.promo-tile-cyan .promo-location {
  color: #00d0ff;
}

.promo-tile-cyan .price small,
.promo-tile-cyan .promo-location small {
  color: #00d0ff;
}

.promo-tile-cyan .promo-location {
  color: #000000;
}

.promo-tile-green .counter {
  background-color: #00a850;
}

.promo-tile-green .price,
.promo-tile-green .promo-location {
  color: #00a850;
}

.promo-tile-green .price small,
.promo-tile-green .promo-location small {
  color: #00a850;
}

.promo-tile-green .promo-location {
  color: #000000;
}

.promo-tile-lime .counter {
  background-color: #bfd730;
}

.promo-tile-lime .price,
.promo-tile-lime .promo-location {
  color: #bfd730;
}

.promo-tile-lime .price small,
.promo-tile-lime .promo-location small {
  color: #bfd730;
}

.promo-tile-lime .promo-location {
  color: #000000;
}

.promo-tile-grey .counter {
  background-color: #889391;
}

.promo-tile-grey .price,
.promo-tile-grey .promo-location {
  color: #889391;
}

.promo-tile-grey .price small,
.promo-tile-grey .promo-location small {
  color: #889391;
}

.promo-tile-grey .promo-location {
  color: #000000;
}

.promo-tile-grey-light .counter {
  background-color: #cccccc;
}

.promo-tile-grey-light .price,
.promo-tile-grey-light .promo-location {
  color: #cccccc;
}

.promo-tile-grey-light .price small,
.promo-tile-grey-light .promo-location small {
  color: #cccccc;
}

.promo-tile-grey-light .promo-location {
  color: #000000;
}

.promo-tile-black .counter {
  background-color: #000000;
}

.promo-tile-black .price,
.promo-tile-black .promo-location {
  color: #000000;
}

.promo-tile-black .price small,
.promo-tile-black .promo-location small {
  color: #000000;
}

.promo-tile-black .promo-location {
  color: #000000;
}

.autocomplete-suggestions {
  padding-top: 32px;
  padding-top: 2rem;
  margin-top: -30.4px;
  margin-top: -1.9rem;
  background-size: 8px;
  background: url('/today/static/web/img/icons/icon-library/png/caret-down.png?dda7b1769bfa') no-repeat 192px 11px;
  border: 1px solid #ffffff;
}

.autocomplete-suggestions .autocomplete-suggestion {
  padding: 8px;
  padding: 0.5rem;
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
  background-color: #0083c2;
  color: #ffffff;
}

.autocomplete-suggestions .autocomplete-suggestion:hover {
  cursor: pointer;
}

.autocomplete-suggestions .autocomplete-suggestion strong {
  font-family: "Telkom123-Bold", sans-serif;
}

.search-inpage.white .autocomplete-suggestions {
  background: none;
  border: none;
  border-top: 1px solid #e8e7e7;
  padding: 0;
  margin: 0;
  margin-top: 0.5rem;
}

.search-inpage.white .autocomplete-suggestions .autocomplete-suggestion {
  background-color: #0083c2;
  color: #ffffff;
}

.search-inpage.white .autocomplete-suggestions .autocomplete-suggestion:hover {
  cursor: pointer;
}

.search-inpage.white .autocomplete-suggestions .autocomplete-suggestion.autocomplete-selected {
  background-color: #0072A9;
}

.search-inpage.white .autocomplete-suggestions .autocomplete-suggestion strong {
  font-family: "Telkom123-Bold", sans-serif;
}

.search-inpage .inpage input {
  width: 90%;
}

.brochure-row-grey.card-video-grid {
  padding: 1%;
}

.brochure-row-grey.card-video-grid .card-video {
  width: 100%;
  margin-bottom: 1%;
}

.brochure-row-grey.card-video-grid .card-video:nth-child(3n) {
  margin-bottom: 0;
}

@media (min-width: 48em) {
  .brochure-row-grey.card-video-grid .card-video {
    width: 32.666666667%;
    margin-right: 1%;
    margin-bottom: 0;
    float: left;
  }

  .brochure-row-grey.card-video-grid .card-video:nth-child(3n) {
    margin-right: 0;
  }
}

.card-video {
  position: relative;
  min-height: 180px;
}

.card-video .clickable {
  position: absolute;
  display: block;
  cursor: pointer;
  width: 100%;
  height: 100%;
  z-index: 101;
}

.card-video .center-icon {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 10%;
  height: 10%;
  margin: auto;
  min-width: 32px;
  min-width: 2rem;
  min-height: 32px;
  min-height: 2rem;
  max-width: 48px;
  max-width: 3rem;
  max-height: 48px;
  max-height: 3rem;
}

.card-video .foreground {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 100;
}

.card-video .foreground .center-icon.icon-circle-play {
  width: 64px;
  width: 4rem;
  height: 64px;
  height: 4rem;
  background-size: 100% 100%;
  opacity: .5;
}

.card-video .foreground .content {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  margin: 16px;
  margin: 1rem;
  overflow: hidden;
}

@media (min-width: 75em) {
  .card-video .foreground .content {
    margin: 24px;
    margin: 1.5rem;
  }
}

@media (min-width: 120em) {
  .card-video .foreground .content {
    margin: 32px;
    margin: 2rem;
  }
}

.card-video .foreground .category {
  color: #ffffff;
  font-family: "Telkom123-Bold", sans-serif;
  text-transform: uppercase;
  font-size: 11.2px;
  font-size: 0.7rem;
  margin-bottom: 1.6px;
  margin-bottom: 0.1rem;
}

@media (min-width: 75em) {
  .card-video .foreground .category {
    font-size: 16px;
    font-size: 1rem;
    margin-bottom: 4.8px;
    margin-bottom: 0.3rem;
  }
}

@media (min-width: 120em) {
  .card-video .foreground .category {
    font-size: 19.2px;
    font-size: 1.2rem;
    margin-bottom: 6.4px;
    margin-bottom: 0.4rem;
  }
}

.card-video .foreground .title {
  margin-bottom: 0;
  color: #ffffff;
  font-family: "Telkom123-Light", sans-serif;
  overflow: hidden;
  padding-bottom: 6.4px;
  padding-bottom: 0.4rem;
  max-height: 51.2px;
  max-height: 3.2rem;
  font-size: 19.2px;
  font-size: 1.2rem;
  line-height: 22.4px;
  line-height: 1.4rem;
}

@media (min-width: 62em) {
  .card-video .foreground .title {
    width: 75%;
  }
}

@media (min-width: 75em) {
  .card-video .foreground .title {
    width: 77%;
    max-height: 56px;
    max-height: 3.5rem;
    font-size: 24px;
    font-size: 1.5rem;
    line-height: 25.6px;
    line-height: 1.6rem;
  }
}

@media (min-width: 120em) {
  .card-video .foreground .title {
    width: 75%;
    max-height: 75.2px;
    max-height: 4.7rem;
    font-size: 32px;
    font-size: 2rem;
    line-height: 34.4px;
    line-height: 2.15rem;
  }
}

.card-video .foreground.light {
  color: #0083c2;
}

.card-video .background {
  position: relative;
  min-height: 180px;
  padding-bottom: 56.25%;
  overflow: hidden;
}

.card-video .background img {
  display: block;
  position: absolute;
  left: 50%;
  width: 100%;
  min-width: 320px;
  margin: auto;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.brochure-row-white.card-cta-grid,
.card-cta-grid.brochure-row {
  padding: 0;
}

@media (min-width: 48em) {
  .brochure-row-white.card-cta-grid,
  .card-cta-grid.brochure-row {
    padding: 1%;
  }
}

.brochure-row-white.card-cta-grid .card-cta-blue,
.card-cta-grid.brochure-row .card-cta-blue {
  background-color: #0083c2;
}

.brochure-row-white.card-cta-grid .brochure-block.card-cta-blue,
.card-cta-grid.brochure-row .brochure-block.card-cta-blue,
.brochure-row-white.card-cta-grid .card-cta-blue.brochure-block-inverted,
.card-cta-grid.brochure-row .card-cta-blue.brochure-block-inverted,
.brochure-row-white.card-cta-grid .brochure-block.card-cta,
.card-cta-grid.brochure-row .brochure-block.card-cta,
.brochure-row-white.card-cta-grid .card-cta.brochure-block-inverted,
.card-cta-grid.brochure-row .card-cta.brochure-block-inverted {
  width: 100%;
  margin-bottom: 1%;
  padding: 0;
}

@media (min-width: 48em) {
  .brochure-row-white.card-cta-grid .brochure-block.card-cta-blue.two-columns,
  .card-cta-grid.brochure-row .brochure-block.card-cta-blue.two-columns,
  .brochure-row-white.card-cta-grid .card-cta-blue.two-columns.brochure-block-inverted,
  .card-cta-grid.brochure-row .card-cta-blue.two-columns.brochure-block-inverted,
  .brochure-row-white.card-cta-grid .brochure-block.card-cta.two-columns,
  .card-cta-grid.brochure-row .brochure-block.card-cta.two-columns,
  .brochure-row-white.card-cta-grid .card-cta.two-columns.brochure-block-inverted,
  .card-cta-grid.brochure-row .card-cta.two-columns.brochure-block-inverted {
    width: 49.5%;
    margin-right: 1%;
    margin-bottom: 1%;
    float: left;
  }

  .brochure-row-white.card-cta-grid .brochure-block.card-cta-blue.two-columns:nth-child(2n),
  .card-cta-grid.brochure-row .brochure-block.card-cta-blue.two-columns:nth-child(2n),
  .brochure-row-white.card-cta-grid .card-cta-blue.two-columns.brochure-block-inverted:nth-child(2n),
  .card-cta-grid.brochure-row .card-cta-blue.two-columns.brochure-block-inverted:nth-child(2n),
  .brochure-row-white.card-cta-grid .brochure-block.card-cta.two-columns:nth-child(2n),
  .card-cta-grid.brochure-row .brochure-block.card-cta.two-columns:nth-child(2n),
  .brochure-row-white.card-cta-grid .card-cta.two-columns.brochure-block-inverted:nth-child(2n),
  .card-cta-grid.brochure-row .card-cta.two-columns.brochure-block-inverted:nth-child(2n) {
    margin-right: 0;
  }
}

.brochure-row-white.card-cta-grid h2,
.card-cta-grid.brochure-row h2 {
  color: #ffffff;
}

.brochure-row-white.card-cta-grid p,
.card-cta-grid.brochure-row p {
  color: #ffffff;
}

.brochure-row-white.card-cta-grid .brochure-row-grey p,
.card-cta-grid.brochure-row .brochure-row-grey p {
  color: inherit;
}

.brochure-block.card-cta-blue,
.card-cta-blue.brochure-block-inverted,
.brochure-block.card-cta,
.card-cta.brochure-block-inverted {
  width: 50%;
  padding: 0;
}

.brochure-block.card-cta-blue .content,
.card-cta-blue.brochure-block-inverted .content,
.brochure-block.card-cta .content,
.card-cta.brochure-block-inverted .content {
  position: relative;
}

.brochure-block.card-cta-blue .content .description,
.card-cta-blue.brochure-block-inverted .content .description,
.brochure-block.card-cta .content .description,
.card-cta.brochure-block-inverted .content .description {
  position: relative;
  padding-right: 0;
  z-index: 100;
}

@media (min-width: 48em) {
  .brochure-block.card-cta-blue .content .description,
  .card-cta-blue.brochure-block-inverted .content .description,
  .brochure-block.card-cta .content .description,
  .card-cta.brochure-block-inverted .content .description {
    width: 22em;
    max-width: 100%;
  }
}

.brochure-block.card-cta-blue .content .description.full h2,
.card-cta-blue.brochure-block-inverted .content .description.full h2,
.brochure-block.card-cta-blue .content .description.full p,
.card-cta-blue.brochure-block-inverted .content .description.full p,
.brochure-block.card-cta .content .description.full h2,
.card-cta.brochure-block-inverted .content .description.full h2,
.brochure-block.card-cta .content .description.full p,
.card-cta.brochure-block-inverted .content .description.full p {
  text-shadow: 0px 0px 4px #102e41;
}

.brochure-block.card-cta-blue .content .focal-point.bottom,
.card-cta-blue.brochure-block-inverted .content .focal-point.bottom,
.brochure-block.card-cta .content .focal-point.bottom,
.card-cta.brochure-block-inverted .content .focal-point.bottom {
  padding-top: 16px;
  padding-top: 1rem;
  vertical-align: bottom;
}

.brochure-block.card-cta-blue .content .focal-point.middle,
.card-cta-blue.brochure-block-inverted .content .focal-point.middle,
.brochure-block.card-cta .content .focal-point.middle,
.card-cta.brochure-block-inverted .content .focal-point.middle {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  vertical-align: middle;
}

@media (min-width: 48em) {
  .brochure-block.card-cta-blue .content .focal-point.middle,
  .card-cta-blue.brochure-block-inverted .content .focal-point.middle,
  .brochure-block.card-cta .content .focal-point.middle,
  .card-cta.brochure-block-inverted .content .focal-point.middle {
    width: auto;
    padding-right: 0;
    padding-left: 5%;
  }
}

@media (min-width: 48em) {
  .brochure-block.card-cta-blue .content .focal-point.middle img,
  .card-cta-blue.brochure-block-inverted .content .focal-point.middle img,
  .brochure-block.card-cta .content .focal-point.middle img,
  .card-cta.brochure-block-inverted .content .focal-point.middle img {
    max-height: 210px;
    width: 0;
  }
}

@media (min-width: 62em) {
  .brochure-block.card-cta-blue .content .focal-point.middle img,
  .card-cta-blue.brochure-block-inverted .content .focal-point.middle img,
  .brochure-block.card-cta .content .focal-point.middle img,
  .card-cta.brochure-block-inverted .content .focal-point.middle img {
    max-height: 210px;
    width: 100%;
  }
}

.brochure-block.card-cta-blue .content .focal-point.full,
.card-cta-blue.brochure-block-inverted .content .focal-point.full,
.brochure-block.card-cta .content .focal-point.full,
.card-cta.brochure-block-inverted .content .focal-point.full {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  overflow: hidden;
}

.brochure-block.card-cta-blue .content .focal-point.full img,
.card-cta-blue.brochure-block-inverted .content .focal-point.full img,
.brochure-block.card-cta .content .focal-point.full img,
.card-cta.brochure-block-inverted .content .focal-point.full img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  max-width: none;
  height: 100%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  -o-object-fit: cover;
  object-fit: cover;
  font-family: "object-fit: cover";
}

@media (min-width: 90em) {
  .brochure-block.card-cta-blue .content .focal-point.full img,
  .card-cta-blue.brochure-block-inverted .content .focal-point.full img,
  .brochure-block.card-cta .content .focal-point.full img,
  .card-cta.brochure-block-inverted .content .focal-point.full img {
    width: 100%;
    height: auto;
  }
}

.videoWrapper {
  position: relative;
  max-width: 1000px;
  height: 0;
  max-height: 600px;
  margin: 60px auto 0;
  padding-top: 25px;
  padding-bottom: 56.25%;
}

.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-width: 1000px;
  height: 100%;
  max-height: 600px;
}

.brochure-selling-items {
  height: 200px;
  display: block;
}

.brochure-selling-items .brochure-selling-items-title {
  margin-bottom: 16px;
  margin-bottom: 1rem;
  color: #000000;
  font-size: 28px;
  font-size: 1.75rem;
  text-align: center;
  min-height: 60px;
}

.brochure-selling-items .brochure-selling-points.hotfix-items .item {
  width: 10%;
}

@media (max-width: 62em) {
  .brochure-selling-items .brochure-selling-points.hotfix-items .item {
    display: block;
    width: 50%;
    float: left;
  }
}

@media (max-width: 48em) {
  .brochure-selling-items .brochure-selling-points.hotfix-items .item {
    display: block;
    width: 100%;
  }
}

.brochure-selling-items .brochure-selling-points .item {
  display: table-cell;
  width: 20%;
}

.brochure-selling-items .brochure-selling-points .item .description {
  position: relative;
}

@media (min-width: 48em) {
  .brochure-selling-items .brochure-selling-points .item .description {
    padding-bottom: 16px;
    padding-bottom: 1rem;
  }
}

.brochure-selling-items .brochure-selling-points .item .links {
  position: relative;
  width: 100%;
}

@media (min-width: 48em) {
  .brochure-selling-items .brochure-selling-points .item .links {
    position: absolute;
    bottom: 0px;
  }
}

@media (max-width: 62em) {
  .brochure-selling-items .brochure-selling-points .item {
    display: block;
    width: 50%;
    float: left;
  }
}

@media (max-width: 48em) {
  .brochure-selling-items .brochure-selling-points .item {
    display: block;
    width: 100%;
  }
}

.brochure-selling-items .brochure-selling-points .item a {
  width: 100%;
}

.brochure-selling-items .brochure-selling-points .item a:first-child {
  margin-top: 28px;
  margin-top: 1.75rem;
}

.has-glass-nav {
  position: relative;
}

.has-glass-nav .hero.carousel .owl-controls {
  display: none !important;
}

@media (min-width: 48em) {
  .has-glass-nav .hero.carousel .owl-controls {
    display: block;
    position: absolute;
    bottom: 9rem;
  }
}

.glass-hero .background img {
  -o-object-position: 50% 50% !important;
  object-position: 50% 50% !important;
}

.glass-tabs {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 144px;
  height: 9rem;
  clear: both;
  border-top: 1px solid #889391;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 3;
  overflow-x: auto;
  overflow-y: hidden;
}

.glass-tabs .glass-tabs-items {
  display: table;
  position: relative;
  width: 100%;
  height: 100%;
  table-layout: fixed;
  vertical-align: middle;
  margin-left: 16px;
  margin-left: 1rem;
  margin-right: 16px;
  margin-right: 1rem;
}

@media (max-width: 48em) {
  .glass-tabs .glass-tabs-items {
    min-width: 500px;
    overflow-x: scroll;
    overflow-y: hidden;
  }
}

@media (min-width: 48em) {
  .glass-tabs .glass-tabs-items {
    max-width: 95%;
  }
}

@media (min-width: 75em) {
  .glass-tabs .glass-tabs-items {
    max-width: 82em;
    margin-right: auto;
    margin-left: auto;
  }
}

.glass-tabs .glass-tabs-title {
  display: table-cell;
  position: relative;
  -webkit-transition: color .3s;
  transition: color .3s;
  color: #889391;
  font-size: 28.8px;
  font-size: 1.8rem;
  text-align: center;
  cursor: pointer;
  vertical-align: middle;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-decoration: none;
}

.glass-tabs .glass-tabs-title.active,
.glass-tabs .glass-tabs-title:hover {
  color: #ffffff;
}

.glass-tabs .glass-tabs-title:after {
  position: absolute;
  top: 152px;
  top: 9.5rem;
  left: 50%;
  width: 40px;
  width: 2.5rem;
  height: 40px;
  height: 2.5rem;
  -webkit-transform: translateX(-50%) rotate(45deg);
  transform: translateX(-50%) rotate(45deg);
  -webkit-transition: top .3s;
  transition: top .3s;
  background-color: #ffffff;
  content: "";
}

.glass-tabs .glass-tabs-title.active:after {
  top: 124.8px;
  top: 7.8rem;
}

@media (max-width: 48em) {
  .glass-tabs .glass-tabs-title {
    min-width: 200px;
    font-size: 24px;
    font-size: 1.5rem;
  }
}

.glass-tabs-section {
  display: none;
  width: 100%;
  height: 500px;
}

.glass-tabs-section h1 {
  font-size: 36px;
  font-size: 2.25rem;
  margin-top: 64px;
  margin-top: 4rem;
}

.glass-tabs-section .glass-tabs-subheading {
  font-size: 24px;
  font-size: 1.5rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

@media (max-width: 48em) {
  .glass-tabs-section .glass-tabs-subheading {
    font-size: 16px;
    font-size: 1rem;
    padding-right: 16px;
    padding-right: 1rem;
    padding-left: 16px;
    padding-left: 1rem;
  }
}

.glass-tabs-section.active {
  display: block;
}

.glass-tabs-section .glass-tabs-section-p {
  font-size: 24px;
  font-size: 1.5rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
  text-align: left;
}

@media (max-width: 48em) {
  .glass-tabs-section .glass-tabs-section-p {
    font-size: 16px;
    font-size: 1rem;
    padding-right: 16px;
    padding-right: 1rem;
    padding-left: 16px;
    padding-left: 1rem;
  }
}

/* Organisms */

/******************************/

/*  #4 - Masthead */

/******************************/

.masthead {
  padding-top: 10.4px;
  padding-top: 0.65rem;
  padding-bottom: 12px;
  padding-bottom: 0.75rem;
  padding-left: 24px;
  padding-left: 1.5rem;
  padding-right: 24px;
  padding-right: 1.5rem;
  background: #ffffff;
  font-size: 13.6px;
  font-size: 0.85rem;
  font-family: "Telkom123-Bold", sans-serif;
  position: relative;
  z-index: 1000;
}

.masthead a {
  display: inline;
  padding-top: 0px;
  padding-top: 0rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-bottom: 0px;
  padding-bottom: 0rem;
  padding-left: 0px;
  padding-left: 0rem;
  color: #0083c2;
  text-decoration: none;
  opacity: 0.4;
  position: relative;
}

.masthead .on {
  opacity: 1;
}

.masthead .on:after {
  content: "";
  width: 16px;
  width: 1rem;
  height: 16px;
  height: 1rem;
  position: absolute;
  bottom: -24px;
  bottom: -1.5rem;
  left: 0;
  right: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  margin: auto;
  background-color: #0083c2;
}

/******************************/

/*  #5 - Header */

/******************************/

header {
  position: relative;
  z-index: 1000;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-right: 0;
  padding-left: 24px;
  padding-left: 1.5rem;
}

header [class*="icon-"] {
  background-position: 50%;
  background-size: cover;
}

header .logo {
  width: 100px;
  width: 6.25rem;
  height: 67px;
  height: 4.1875rem;
  float: left;
  background-size: 100%;
  margin-left: 0;
}

@media (min-width: 48em) {
  header .logo {
    width: 115px;
    width: 7.1875rem;
  }
}

header .logo img {
  margin-top: 20px;
  margin-top: 1.25rem;
}

@media (min-width: 48em) {
  header .logo img {
    margin-top: 18.4px;
    margin-top: 1.15rem;
  }
}

header nav {
  float: right;
  padding-right: 68px;
  padding-right: 4.25rem;
}

header nav a {
  font-family: "Telkom123-Bold", sans-serif;
  color: #ffffff;
  text-decoration: none;
}

header nav a:hover {
  color: #ffffff;
}

header nav a:hover span {
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  opacity: 0.8;
}

.social {
  background-color: #0083c2;
  margin-top: 24px;
  margin-top: 1.5rem;
  margin-left: -24px;
  margin-left: -1.5rem;
  margin-right: -24px;
  margin-right: -1.5rem;
  margin-bottom: -24px;
  margin-bottom: -1.5rem;
  padding-left: 24px;
  padding-left: 1.5rem;
  padding-right: 24px;
  padding-right: 1.5rem;
  height: 88px;
  height: 5.5rem;
}

@media (min-width: 48em) {
  .social {
    height: 83.2px;
    height: 5.2rem;
  }
}

.social a {
  width: 16.6%;
  height: 59.2px;
  height: 3.7rem;
  background-position: center !important;
  float: left;
}

.social a:hover {
  background-color: #0083c2;
}

.social .icon-help-chat-white {
  background-size: 75%;
}

.social .icon-facebook {
  background-size: 37%;
}

.social .icon-twitter {
  background-size: 65%;
}

.social .icon-google {
  background-size: 53%;
}

.social .icon-linkedin {
  background-size: 53%;
}

.social .icon-youtube {
  background-size: 53%;
}

.social:after {
  content: "";
  clear: both;
  display: block;
}

.site-search,
.sub-menu {
  float: left;
  position: relative;
  display: none;
}

@media only screen and (min-width: 48em) {
  .site-search,
  .sub-menu {
    display: inline-block;
  }
}

@media only screen and (min-width: 62em) {
  .site-search,
  .sub-menu {
    display: inline-block;
  }
}

.site-search.open > a,
.sub-menu.open > a {
  background-color: #005e9b;
  color: #ffffff;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}

.site-search > a,
.sub-menu > a {
  padding-left: 16px;
  padding-left: 1rem;
  display: inline-block;
  line-height: 67.2px;
  line-height: 4.2rem;
}

@media only screen and (min-width: 48em) {
  .site-search > a,
  .sub-menu > a {
    line-height: 68px;
    line-height: 4.25rem;
  }
}

.ie10 .site-search > a .icon-caret-down,
.ie11 .site-search > a .icon-caret-down,
.no-svg .site-search > a .icon-caret-down,
.ie10
    .sub-menu > a .icon-caret-down,
.ie11
    .sub-menu > a .icon-caret-down,
.no-svg
    .sub-menu > a .icon-caret-down {
  background-image: url('/today/static/web/img/icons/icon-library/png/caret-down.png?dda7b1769bfa');
  background-size: 8px;
}

.site-search .icon-caret-down,
.site-search .icon-profile,
.sub-menu .icon-caret-down,
.sub-menu .icon-profile {
  padding-right: 24px;
  padding-right: 1.5rem;
  background-position: center right;
  background-size: 0.7rem;
}

@media only screen and (min-width: 48em) {
  .site-search .icon-caret-down,
  .site-search .icon-profile,
  .sub-menu .icon-caret-down,
  .sub-menu .icon-profile {
    padding-right: 35.2px;
    padding-right: 2.2rem;
    background-position: right 0.65rem center;
  }
}

.site-search h3,
.sub-menu h3 {
  margin: 0;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  display: block;
  font-family: "Telkom123-Regular", sans-serif;
  font-size: 20.8px;
  font-size: 1.3rem;
  line-height: 28.8px;
  line-height: 1.8rem;
  letter-spacing: -1px;
  color: #ffffff;
}

.site-search p,
.sub-menu p {
  color: #ffffff;
  margin: 0;
  line-height: 16px;
  line-height: 1rem;
  margin-top: 4px;
  margin-top: 0.25rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
}

.site-search .sub-drop,
.sub-menu .sub-drop {
  display: none;
  position: absolute;
  right: 0;
  top: 67px;
  top: 4.1875rem;
  background-color: #005e9b;
  padding: 24px;
  padding: 1.5rem;
  padding-top: 19.2px;
  padding-top: 1.2rem;
  padding-bottom: 19.2px;
  padding-bottom: 1.2rem;
}

.site-search .sub-drop a:hover,
.sub-menu .sub-drop a:hover {
  opacity: 0.8;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}

.site-search .sub-drop li,
.sub-menu .sub-drop li {
  min-width: 169.6px;
  min-width: 10.6rem;
}

.site-search ul,
.sub-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.site-search ul li a,
.sub-menu ul li a {
  padding-top: 5.6px;
  padding-top: 0.35rem;
  padding-bottom: 5.6px;
  padding-bottom: 0.35rem;
  display: block;
  font-size: 30px;
  font-size: 1.875rem;
  line-height: 36px;
  line-height: 2.25rem;
}

.sub-drop {
  display: none;
  position: absolute;
  right: 0;
  top: 67px;
  top: 4.1875rem;
  background: #005e9b;
  padding: 24px;
  padding: 1.5rem;
  padding-top: 19.2px;
  padding-top: 1.2rem;
  padding-bottom: 19.2px;
  padding-bottom: 1.2rem;
}

.sub-drop ul {
  min-width: 154px;
  min-width: 9.625rem;
}

@media only screen and (min-width: 48em) {
  .sub-drop ul {
    min-width: 308.8px;
    min-width: 19.3rem;
  }
}

.sub-drop li {
  min-width: 169.6px;
  min-width: 10.6rem;
}

.sub-drop li a {
  padding-left: 56px;
  padding-left: 3.5rem;
  background-size: 3rem;
  background-position: left center;
  background-repeat: no-repeat;
}

.sub-drop li a:hover {
  opacity: 0.8;
}

.sub-drop img {
  height: 35.2px;
  height: 2.2rem;
  margin: 0 auto;
  display: block;
}

.sub-drop .social a {
  padding-left: 0;
  background-position: center;
}

.sub-drop-my-telkom ul {
  min-width: 154px;
  min-width: 9.625rem;
}

@media only screen and (min-width: 48em) {
  .sub-drop-my-telkom ul {
    min-width: 648px;
    min-width: 40.5rem;
  }
}

.sub-drop-my-telkom ul li {
  display: inline-block;
  min-width: 0 !important;
}

.sub-drop-my-telkom ul li:first-child {
  width: 45%;
}

.sub-drop-my-telkom ul li:last-child {
  width: 45%;
  float: right;
}

.sub-drop-my-telkom ul li.divider {
  width: 1px;
  height: 81%;
  background: #0083c2;
  margin: 0 auto;
  position: absolute;
  top: 13.6px;
  top: 0.85rem;
  bottom: 12px;
  bottom: 0.75rem;
  left: 0;
  right: 0;
}

.sub-drop-my-telkom ul li a {
  padding-top: 13.6px;
  padding-top: 0.85rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-bottom: 14.08px;
  padding-bottom: 0.88rem;
  padding-left: 16px;
  padding-left: 1rem;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 12px;
  line-height: 0.75rem;
}

.shop .sub-drop li {
  min-width: 169.6px;
  min-width: 10.6rem;
}

.help .sub-drop li {
  min-width: 265.6px;
  min-width: 16.6rem;
}

.site-search {
  display: block;
}

.site-search > a {
  padding-left: 32px;
  padding-left: 2rem;
  padding-right: 32px;
  padding-right: 2rem;
  height: 67px;
  height: 4.1875rem;
  display: block;
}

.site-search > a:hover {
  background-color: #0083c2;
  opacity: 0.8;
}

.site-search.open > a {
  background-color: #0083c2;
}

.site-search .icon-search {
  background-size: 20px;
  background-size: 1.25rem;
}

.site-search .icon-search:hover {
  background-color: #0083c2;
}

.site-search .icon-search.open {
  display: none;
}

@media only screen and (min-width: 48em) {
  .site-search .icon-search.open {
    display: inline-block;
  }
}

.site-search .sub-drop {
  padding: 0;
  min-width: 288px;
  min-width: 18rem;
  top: 67px;
  top: 4.1875rem;
  right: 0;
  background-color: #0083c2;
}

@media only screen and (min-width: 48em) {
  .site-search .sub-drop {
    top: 1.6px;
    top: 0.1rem;
    min-width: 384px;
    min-width: 24rem;
    padding: 0;
  }
}

.site-search .sub-drop a.icon-close {
  width: 16px;
  width: 1rem;
  height: 16px;
  height: 1rem;
  margin: 24px;
  margin: 1.5rem;
  margin-top: 24px;
  margin-top: 1.5rem;
  float: left;
}

.site-search .sub-drop a.icon-close:hover {
  background-color: #0083c2;
}

.site-search .sub-drop input {
  width: 148px;
  width: 9.25rem;
  margin-top: 18.4px;
  margin-top: 1.15rem;
  padding-bottom: 4px;
  padding-bottom: 0.25rem;
  padding-left: 16px;
  padding-left: 1rem;
  float: left;
  border: 0;
  background-color: #0083c2;
  color: #ffffff;
  border-bottom: 1px solid #ffffff;
}

.site-search .sub-drop input::-webkit-input-placeholder {
  color: #ffffff;
}

.site-search .sub-drop input:-moz-placeholder {
  color: #ffffff;
}

.site-search .sub-drop input::-moz-placeholder {
  color: #ffffff;
}

.site-search .sub-drop input:-ms-input-placeholder {
  color: #ffffff;
}

@media only screen and (min-width: 48em) {
  .site-search .sub-drop input {
    width: 244px;
    width: 15.25rem;
  }
}

.site-search .sub-drop button {
  border: 0;
  background-color: #0083c2;
  float: right;
  width: 64px;
  width: 4rem;
  height: 63px;
  height: 3.9375rem;
  background-size: 20px;
  background-size: 1.25rem;
}

.burger {
  width: 68px;
  width: 4.25rem;
  height: 100%;
  float: right;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  text-align: center;
  vertical-align: middle;
}

.burger > a {
  height: 100%;
  display: block;
  line-height: 67px;
  line-height: 4.1875rem;
}

.burger > a:hover {
  opacity: 0.8;
}

.burger .icon-burger {
  background-size: 19.2px;
  background-size: 1.2rem;
}

.burger .sub-drop-burger,
.burger .sub-drop {
  left: auto;
  right: 0;
  text-align: left;
  overflow: hidden;
}

.burger .sub-drop-burger ul,
.burger .sub-drop ul {
  width: 275.2px;
  width: 17.2rem;
  padding-left: 0;
}

.burger .sub-drop-burger ul a,
.burger .sub-drop ul a {
  padding-left: 0 !important;
}

.burger .sub-drop-burger {
  padding-bottom: 0;
}

.cloned .sub-menu {
  display: block;
  float: none;
}

.cloned .sub-menu > a {
  display: block;
  padding: 0;
  padding-top: 5.6px;
  padding-top: 0.35rem;
  padding-bottom: 5.6px;
  padding-bottom: 0.35rem;
  font-size: 30px;
  font-size: 1.875rem;
  line-height: 36px;
  line-height: 2.25rem;
  background-size: 1rem;
}

.cloned .sub-menu .sub-drop {
  top: 56px;
  top: 3.5rem;
  left: 0;
  margin-left: 120%;
  width: 100%;
  padding: 0;
}

.cloned .sub-menu .sub-drop .back {
  width: 100%;
  clear: both;
  font-size: 30px;
  font-size: 1.875rem;
  line-height: 36px;
  line-height: 2.25rem;
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  padding-left: 16px;
  padding-left: 1rem;
  display: block;
  background-size: 0.5rem;
  background-position: left center;
}

.sub-menu.open .sub-drop {
  display: none;
}

@media (min-width: 48em) {
  .sub-menu.open .sub-drop {
    display: block;
  }
}

.sub-menu.open .cloned {
  display: block;
}

@media (min-width: 48em) {
  .sub-menu.open .cloned {
    display: none;
  }
}

.cloned .sub-drop-shop li a,
.cloned .sub-drop-help li a {
  padding-left: 55px !important;
}

.cloned .sub-drop-my-telkom .divider {
  display: none;
}

.cloned .sub-drop-my-telkom ul li {
  width: 100%;
}

.cloned .sub-drop-my-telkom ul li a {
  display: block;
  padding-left: 16px !important;
}

.cloned .sub-drop-my-telkom br {
  display: none;
}

/******************************/

/*  #5.2 - Theme */

header [role="menuitem"],
#main-menu [role="menuitem"] {
  font-size: 0.66667rem;
}

header,
#main-menu {
  background-color: #0083c2;
}

header [role="menuitem"],
#main-menu [role="menuitem"],
.section-title,
.menu-title {
  color: #ffffff;
}

.burger {
  background-color: #005e9b;
  color: #ffffff;
}

.burger:hover {
  background-color: #005e9b;
  color: #ffffff;
}

/******************************/

/*  #6 - Footer */

/******************************/

/******************************/

/*  CORE (common elements) */

footer {
  padding: 24px;
  padding: 1.5rem;
  line-height: 24px;
  line-height: 1.5rem;
  background-color: #0083c2;
}

@media (min-width: 48em) {
  footer {
    padding: 48px;
    padding: 3rem;
  }
}

@media (min-width: 62em) {
  footer {
    padding: 48px;
    padding: 3rem;
  }
}

footer ul {
  width: 100%;
  float: left;
  list-style: none;
  margin: 0;
  padding: 0;
}

footer nav > [role="menubar"] > li {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

footer nav > [role="menubar"] > li:last-child {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-right: 0;
}

@media (min-width: 75em) {
  footer nav > [role="menubar"] > li:last-child {
    width: 35.71429%;
    float: left;
    margin-right: 2.85714%;
    margin-right: 0;
  }
}

@media (min-width: 48em) and (max-width: 75em) {
  footer nav > [role="menubar"] > li {
    width: 17.71429%;
    float: left;
    margin-right: 2.85714%;
    margin-bottom: 8px;
    margin-bottom: 0.5rem;
  }

  footer nav > [role="menubar"] > li:nth-child(3),
  footer nav > [role="menubar"] > li:last-child {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  footer nav > [role="menubar"] > li {
    width: 10%;
    float: left;
    margin-right: 2.85714%;
  }
}

footer li {
  float: none;
  padding: 0;
}

footer h5 {
  color: #ffffff;
}

footer a {
  display: block;
  color: #ffffff;
  text-decoration: none;
  line-height: 24px;
  line-height: 1.5rem;
}

footer a .fa-plus,
footer a .fa-minus {
  float: right;
  display: none;
  margin-top: 1.6px;
  margin-top: 0.1rem;
  margin-left: 16px;
  margin-left: 1rem;
}

@media (min-width: 48em) {
  footer a .fa-plus,
  footer a .fa-minus {
    display: none;
  }
}

@media (min-width: 62em) {
  footer a .fa-plus,
  footer a .fa-minus {
    display: none;
  }
}

footer a:hover {
  color: #ffffff;
  opacity: 0.8;
}

footer .sub-title {
  margin: 0;
}

footer .sub-title a {
  background-position: right center;
  background-size: 1rem;
}

@media (min-width: 48em) {
  footer .sub-title a {
    background-image: none;
  }
}

footer .sub-title a:hover {
  cursor: default;
  opacity: 1;
}

footer .sub-menu {
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  padding: 0;
}

@media (min-width: 48em) {
  footer .sub-menu {
    display: block !important;
  }
}

footer .sub-menu i {
  width: 20px;
  width: 1.25rem;
}

footer .sub-menu li {
  padding-top: 3.2px;
  padding-top: 0.2rem;
  padding-bottom: 3.2px;
  padding-bottom: 0.2rem;
  line-height: 19.2px;
  line-height: 1.2rem;
}

footer form {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 32px;
  padding-bottom: 2rem;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

footer form {
  *zoom: 1;
}

footer form:before,
footer form:after {
  content: "";
  display: table;
}

footer form:after {
  clear: both;
}

footer form input {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: left;
  border: 1px solid #2695cb;
  padding: 5.76px;
  padding: 0.36rem;
  padding-left: 12px;
  padding-left: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  background: 0;
  color: #ffffff;
}

footer form input::-webkit-input-placeholder {
  color: #ffffff;
}

footer form input:-moz-placeholder {
  color: #ffffff;
}

footer form input::-moz-placeholder {
  color: #ffffff;
}

footer form input:-ms-input-placeholder {
  color: #ffffff;
}

footer form button {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: right;
  margin-right: 0;
  text-align: left;
}

@media (min-width: 48em) {
  footer form input {
    width: 82.85714%;
    float: left;
    margin-right: 2.85714%;
  }

  footer form button {
    width: 14.28571%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  footer form input {
    width: 65.71429%;
    float: left;
    margin-right: 2.85714%;
  }

  footer form button {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

footer form .errorlist {
  padding-bottom: 16px;
  padding-bottom: 1rem;
  font-size: 12px;
  font-size: 0.75rem;
  color: #ffffff;
}

@media (min-width: 48em) {
  footer form .errorlist {
    position: absolute;
    padding-bottom: 0;
    bottom: 12px;
    bottom: 0.75rem;
    left: 16px;
    left: 1rem;
  }
}

footer .icon-logo {
  width: 89px;
  width: 5.5625rem;
  height: 24px;
  height: 1.5rem;
  margin-top: 10.66667px;
  margin-top: 0.66667rem;
  display: inline-block;
  background-size: contain;
  background-position: 50%;
}

footer .link-ios,
footer .link-android {
  display: none;
}

footer small {
  text-align: right;
  display: block;
  padding-top: 16px;
  padding-top: 1rem;
  color: #ffffff;
  font-size: 10.66667px;
  font-size: 0.66667rem;
  line-height: 16px;
  line-height: 1rem;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

footer small a {
  display: inline;
}

footer small a:hover {
  color: #d9d9d9;
}

footer .social-menu a {
  padding-left: 24px;
  padding-left: 1.5rem;
  background-position: left center;
  background-size: 0.9rem;
}

footer .social-menu .icon-help-chat-white {
  background-size: 20.8px;
  background-size: 1.3rem;
}

footer .social-menu .icon-facebook {
  background-size: 11.2px;
  background-size: 0.7rem;
}

.back-to-top {
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  padding: 1.5rem;
  width: 2.25rem;
  height: 2.25rem;
  opacity: 0;
  background-color: #005e9b;
  -webkit-transition: 1s;
  transition: 1s;
  text-indent: -99999px;
  visibility: hidden;
  background-size: 1rem;
  background-position: 50%;
}

.back-to-top.visible {
  visibility: visible;
  opacity: 0.8;
}

/******************************/

/*  ENHANCEMENTS */

.js footer a .fa-plus,
.js footer a .fa-minus {
  display: inline-block;
  font-size: 80%;
  margin-top: 3.2px;
  margin-top: 0.2rem;
}

@media only screen and (min-width: 48em) {
  .js footer a .fa-plus,
  .js footer a .fa-minus {
    display: none;
  }
}

@media only screen and (min-width: 62em) {
  .js footer a .fa-plus,
  .js footer a .fa-minus {
    display: none;
  }
}

/******************************/

/*  #27 - Product Slider */

/******************************/

.product-slider {
  padding: 16px;
  padding: 1rem;
}

.product-slider div:last-of-type {
  margin-right: 0;
}

.product-slider:after {
  content: "";
  clear: both;
  display: block;
}

/***************************************/

/*  #30 - Drawer                       */

/***************************************/

.drawer {
  margin-bottom: 48px;
  margin-bottom: 3rem;
  margin-top: -35.2px;
  margin-top: -2.2rem;
  z-index: 1;
  border: 1px solid #e8e7e7;
}

.drawer:after {
  content: "";
  display: block;
  clear: both;
}

.row.white .shop-listing-slider .item,
.row .shop-listing-slider .item {
  border: 1px solid #ffffff;
  border-bottom: 0;
}

.row:nth-of-type(2n) .shop-listing-slider .item {
  border: 1px solid #f7f7f6;
  border-bottom: 0;
}

.drawer-grey,
.row.white .drawer,
.drawer,
.shop-wizard-filtered .items .item .item-drawer {
  background: #f7f7f6;
}

.drawer-grey .bill-list li *,
.row.white .drawer .bill-list li *,
.drawer .bill-list li *,
.shop-wizard-filtered .items .item .item-drawer .bill-list li * {
  background: #f7f7f6;
}

.drawer-grey .detail-builder .switch,
.drawer .detail-builder .switch,
.shop-wizard-filtered .items .item .item-drawer .detail-builder .switch,
.drawer-grey .detail-builder .switch input.check + label:before,
.drawer .detail-builder .switch input.check + label:before,
.shop-wizard-filtered .items .item .item-drawer .detail-builder .switch input.check + label:before,
.drawer-grey .detail-builder .switch input.check:checked + label,
.drawer .detail-builder .switch input.check:checked + label,
.shop-wizard-filtered .items .item .item-drawer .detail-builder .switch input.check:checked + label {
  background-color: #f7f7f6;
}

.drawer-white,
.row:nth-of-type(2n + 2) .drawer,
.help-get .item.on .item-drawer,
.device-support .items .item.on .item-drawer {
  background: #ffffff;
}

.drawer-white .bill-list li *,
.row:nth-of-type(2n + 2) .drawer .bill-list li *,
.help-get .item.on .item-drawer .bill-list li *,
.device-support .items .item.on .item-drawer .bill-list li * {
  background: #ffffff;
}

.drawer-white .field.open .dropdown,
.row:nth-of-type(2n + 2) .drawer .field.open .dropdown,
.help-get .item.on .item-drawer .field.open .dropdown,
.device-support .items .item.on .item-drawer .field.open .dropdown,
.drawer-white .field ul.dropdown li,
.row:nth-of-type(2n + 2) .drawer .field ul.dropdown li,
.help-get .item.on .item-drawer .field ul.dropdown li,
.device-support .items .item.on .item-drawer .field ul.dropdown li,
.drawer-white .field .datepickme li,
.row:nth-of-type(2n + 2) .drawer .field .datepickme li,
.help-get .item.on .item-drawer .field .datepickme li,
.device-support .items .item.on .item-drawer .field .datepickme li {
  background: #f7f7f6;
}

.drawer-white .detail-builder .switch,
.row:nth-of-type(2n + 2) .drawer .detail-builder .switch,
.help-get .item.on .item-drawer .detail-builder .switch,
.device-support .items .item.on .item-drawer .detail-builder .switch,
.drawer-white .detail-builder .switch input.check + label:before,
.row:nth-of-type(2n + 2) .drawer .detail-builder .switch input.check + label:before,
.help-get .item.on .item-drawer .detail-builder .switch input.check + label:before,
.device-support .items .item.on .item-drawer .detail-builder .switch input.check + label:before,
.drawer-white .detail-builder .switch input.check:checked + label,
.row:nth-of-type(2n + 2) .drawer .detail-builder .switch input.check:checked + label,
.help-get .item.on .item-drawer .detail-builder .switch input.check:checked + label,
.device-support .items .item.on .item-drawer .detail-builder .switch input.check:checked + label {
  background-color: #ffffff;
}

/***************************************/

/*  #30 - Section Drawer Accounts Edit */

/***************************************/

.accounts-edit .groups:after {
  content: "";
  clear: both;
  display: block;
}

.accounts-edit .group {
  width: 31.42857%;
  float: left;
  margin-right: 2.85714%;
  padding: 16px;
  padding: 1rem;
}

.accounts-edit .group:last-child {
  margin-right: 0;
}

.accounts-edit .buttons {
  width: 31.42857%;
  float: left;
  margin-left: 34.28571%;
  margin-right: -100%;
  text-align: center;
}

.accounts-edit:after {
  content: "";
  clear: both;
  display: block;
}

/***************************************/

/*  #33 - Page Header          */

/***************************************/

.page-title {
  position: relative;
  background-color: inherit;
  z-index: 50;
}

.page-title h1 {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 32px;
  margin-top: 2rem;
  margin-bottom: 38.4px;
  margin-bottom: 2.4rem;
  line-height: 40px;
  line-height: 2.5rem;
}

@media only screen and (min-width: 48em) {
  .page-title h1 {
    width: 74.28571%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media only screen and (min-width: 62em) {
  .page-title h1 {
    width: 74.28571%;
    float: left;
    margin-right: 2.85714%;
  }
}

.page-title h2 {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-right: 0;
  margin-top: 0;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  color: #889391;
}

@media only screen and (min-width: 48em) {
  .page-title h2 {
    margin-top: -24px;
    margin-top: -1.5rem;
    margin-bottom: 36px;
    margin-bottom: 2.25rem;
  }
}

@media only screen and (min-width: 62em) {
  .page-title h2 {
    margin-top: -24px;
    margin-top: -1.5rem;
    margin-bottom: 36px;
    margin-bottom: 2.25rem;
  }
}

.page-title .search-inpage {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
  margin-right: 0;
  position: relative;
  right: auto;
}

@media only screen and (min-width: 48em) {
  .page-title .search-inpage {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
    margin-top: 44px;
    margin-top: 2.75rem;
    position: absolute;
    right: 0;
  }
}

@media only screen and (min-width: 62em) {
  .page-title .search-inpage {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
    margin-top: 44px;
    margin-top: 2.75rem;
    position: absolute;
    right: 0;
  }
}

.page-title .search-inpage .inpage input {
  width: 80%;
}

.page-title a[class*="close"] {
  width: 30px;
  width: 1.875rem;
  height: 30px;
  height: 1.875rem;
  margin-top: 44px;
  margin-top: 2.75rem;
  float: right;
  background-size: cover;
}

.page-title:after {
  content: "";
  display: block;
  clear: both;
}

/***************************************/

/*  #33 - Drawer Title          */

/***************************************/

.drawer-title {
  padding: 24px;
  padding: 1.5rem;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  position: relative;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.drawer-title {
  *zoom: 1;
}

.drawer-title:before,
.drawer-title:after {
  content: "";
  display: table;
}

.drawer-title:after {
  clear: both;
}

.drawer-title.is_stuck {
  z-index: 10001;
  background-color: #0083c2;
}

.drawer-title.is_stuck * {
  color: #ffffff;
}

.drawer-title .close {
  color: #889391;
  position: absolute;
  top: 0;
  right: 0;
  margin-top: 32px;
  margin-top: 2rem;
  margin-right: 32px;
  margin-right: 2rem;
  display: block;
  width: 24px;
  width: 1.5rem;
  height: 24px;
  height: 1.5rem;
  background-size: cover;
}

.drawer-title .title {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  letter-spacing: -1px;
}

.drawer-title .title .secondary {
  font-family: "Telkom123-Regular", sans-serif;
}

.drawer-title .details {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 16px;
  padding-top: 1rem;
}

@media (max-width: 48em) {
  .drawer-title .details .section-value {
    margin-top: 0;
    font-size: 48px;
    font-size: 3rem;
    line-height: 51.6px;
    line-height: 3.225rem;
  }

  .drawer-title .details .section-value sup {
    top: -17.6px;
    top: -1.1rem;
  }
}

@media (min-width: 48em) {
  .drawer-title .title {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    min-height: 80px;
    min-height: 5rem;
  }

  .drawer-title .details {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
    text-align: right;
    padding-top: 0;
  }
}

@media (min-width: 62em) {
  .drawer-title .title {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .drawer-title .details {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

.drawer-title .section-value {
  margin-top: 24px;
  margin-top: 1.5rem;
}

@media (min-width: 48em) {
  .drawer-title .section-value {
    margin-top: 0;
  }
}

.drawer-title h1 {
  font-family: "Telkom123-Bold", sans-serif;
  margin: 0;
  color: #0083c2;
}

.drawer-title h1 br {
  display: none;
}

@media only screen and (min-width: 48em) {
  .drawer-title h1 br {
    display: inline;
  }
}

@media only screen and (min-width: 62em) {
  .drawer-title h1 br {
    display: inline;
  }
}

.drawer-title p {
  font-weight: bold;
  font-size: 12px;
  font-size: 0.75rem;
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-bottom: 0;
}

.drawer-title .helper {
  display: inline;
  font-size: 16px;
  font-size: 1rem;
  line-height: 24px;
  line-height: 1.5rem;
}

.drawer-title .helper > a {
  display: inline-block;
}

.drawer-title .helper .helper-text {
  top: 0;
  font-family: "Telkom123-Regular", sans-serif;
  margin-top: 16px;
  margin-top: 1rem;
}

@media (min-width: 48em) {
  .drawer-title .helper .helper-text {
    top: -21px;
    margin-top: 0;
  }
}

/***************************************/

/*  #33 - Shop Detail Builder          */

/***************************************/

.detail-builder {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-right: 0;
}

.detail-builder {
  *zoom: 1;
}

.detail-builder:before,
.detail-builder:after {
  content: "";
  display: table;
}

.detail-builder:after {
  clear: both;
}

.detail-builder h3 {
  color: #889391;
}

.detail-builder h3:first-of-type {
  margin-bottom: 0;
}

.detail-builder .builder-grouping {
  position: relative;
  padding: 24px;
  padding: 1.5rem;
  border-top: 1px solid #e8e7e7;
}

.detail-builder .builder-grouping .detail-sidebar {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .detail-builder .builder-grouping .detail-sidebar {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media (min-width: 75em) {
  .detail-builder .builder-grouping .detail-sidebar {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

.detail-builder .builder-grouping .range,
.detail-builder .builder-grouping .choices {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.detail-builder .builder-grouping .detail-sidebar + .range,
.detail-builder .builder-grouping .detail-sidebar + .choices {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .detail-builder .builder-grouping .detail-sidebar + .range,
  .detail-builder .builder-grouping .detail-sidebar + .choices {
    width: 65.71429%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .detail-builder .builder-grouping .detail-sidebar + .range,
  .detail-builder .builder-grouping .detail-sidebar + .choices {
    width: 74.28571%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

.detail-builder .builder-grouping h2 {
  margin-top: 0;
  letter-spacing: -1px;
}

@media (min-width: 48em) {
  .detail-builder .builder-grouping h2 {
    margin-top: 16px;
    margin-top: 1rem;
    margin-bottom: 32px;
    margin-bottom: 2rem;
  }
}

.detail-builder .builder-grouping:after {
  content: "";
  display: block;
  clear: both;
}

.detail-builder .builder-grouping .button-unit {
  padding: 0;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .detail-builder .builder-grouping .button-unit {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

.detail-builder .builder-grouping .button-unit .btn-primary,
.detail-builder .builder-grouping .button-unit .btn-primary-pink {
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.detail-builder .builder-grouping .button-unit a {
  display: block;
}

.detail-builder .builder-grouping .slider-select .SumoSelect {
  width: 100%;
  position: relative;
  background-color: #e8e7e7;
}

@media (min-width: 48em) {
  .detail-builder .builder-grouping .slider-select .SumoSelect {
    width: 50%;
  }
}

.detail-builder .builder-grouping .slider-select .SumoSelect .optWrapper ul li {
  padding-left: 16px;
  padding-left: 1rem;
}

.detail-builder .builder-grouping .slider-select .SumoSelect .optWrapper ul li.selected {
  background-color: #0083c2;
}

.detail-builder .builder-grouping .slider-select .SumoSelect .optWrapper ul li.selected label {
  color: #ffffff;
}

.detail-builder .step-details,
.detail-builder .order-form {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.detail-builder .step-details,
.detail-builder .order-form {
  *zoom: 1;
}

.detail-builder .step-details:before,
.detail-builder .step-details:after,
.detail-builder .order-form:before,
.detail-builder .order-form:after {
  content: "";
  display: table;
}

.detail-builder .step-details:after,
.detail-builder .order-form:after {
  clear: both;
}

.detail-builder .step-item,
.detail-builder .form-group {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .detail-builder .step-item,
  .detail-builder .form-group {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    padding-top: 0;
  }
}

@media (min-width: 48em) and (max-width: 75em) {
  .detail-builder .step-item:nth-of-type(2n+2),
  .detail-builder .form-group:nth-of-type(2n+2) {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .detail-builder .step-item,
  .detail-builder .form-group {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }

  .detail-builder .step-item:nth-of-type(4n+4),
  .detail-builder .form-group:nth-of-type(4n+4) {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .detail-builder .call-me-back .form-group {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .detail-builder .call-me-back .form-group:nth-of-type(3n+3),
  .detail-builder .call-me-back .form-group:nth-of-type(3) {
    float: right;
    margin-right: 0;
  }
}

.detail-builder .call-me-back .form-group .message-error .errorlist {
  margin-top: 16px;
  margin-top: 1rem;
  padding: 16px;
  padding: 1rem;
  background: #da1b60;
  color: #ffffff;
}

@media (max-width: 48em) {
  .detail-builder .step5 .order-image {
    padding-bottom: 16px;
    padding-bottom: 1rem;
  }
}

@media (min-width: 48em) {
  .detail-builder .step5 .order-image {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media (min-width: 48em) and (max-width: 62em) {
  .detail-builder .step5 .order-summary {
    width: 74.28571%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 62em) {
  .detail-builder .step5 .order-summary {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media (min-width: 48em) {
  .detail-builder .step5 .order-terms {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.detail-builder .choices .option p {
  margin-bottom: 0;
}

.detail-builder .choices .option img {
  max-width: 65%;
  display: block;
  text-align: center;
  margin: auto;
}

.detail-builder .choices .option .no-image {
  max-width: 100%;
  min-height: 155.2px;
  min-height: 9.7rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
  -webkit-transition: 0.5s;
  transition: 0.5s;
  background-position: center;
  background-size: 40%;
}

.detail-builder .choices .option-bundle {
  margin-top: 12px;
  margin-top: 0.75rem;
  position: relative;
}

@media (min-width: 48em) {
  .detail-builder .choices .option-bundle {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
  }
}

.detail-builder .choices .option-bundle .SumoSelect {
  border: 1px solid #e8e7e7;
}

.detail-builder .choices .option-bundle .SumoSelect .SelectBox span {
  color: #889391;
}

.detail-builder .choices .option-bundle .SumoSelect ul {
  background: #ffffff;
}

.detail-builder .choices .option-bundle .SumoSelect li {
  padding-left: 0;
}

.detail-builder .choices p {
  font-size: 14.4px;
  font-size: 0.9rem;
  line-height: 19.2px;
  line-height: 1.2rem;
}

.detail-builder .choices .helper [class*="icon-"] {
  margin: 0 auto;
  margin-top: 12px;
  margin-top: 0.75rem;
}

.detail-builder .choices .helper-text {
  text-align: left;
  width: 272px;
  width: 17rem;
  min-width: 272px;
  min-width: 17rem;
}

.detail-builder .switch {
  height: 22px;
  height: 1.375rem;
  padding-right: 6.4px;
  padding-right: 0.4rem;
  margin: 0;
  float: left;
  background: #ffffff;
}

.detail-builder .switch input.check + label {
  width: 22px;
  width: 1.375rem;
  height: 22px;
  height: 1.375rem;
  padding: 0;
}

.detail-builder .switch input.check + label:before {
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: #ffffff;
  border: 1px solid #e8e7e7;
}

.detail-builder .switch input.check + label:after {
  width: 22px;
  width: 1.375rem;
  height: 24px;
  height: 1.5rem;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  padding-left: 3.2px;
  padding-left: 0.2rem;
}

.detail-builder .switch input.check:checked + label {
  background-color: #ffffff;
}

.detail-builder .switch input.check:checked + label:after {
  background-image: url('/today/static/web/img/icons/icon-library/png/check-blue.png?ecef87a8c36d');
  background-size: 80%;
  background-position: 50%;
  background-repeat: no-repeat;
}

.svg .detail-builder .switch input.check:checked + label:after {
  background-image: url('/today/static/web/img/icons/icon-library/check-blue.svg?9d3616326ccf');
}

.detail-builder .order-steps h3 {
  margin-top: 24px;
  margin-top: 1.5rem;
  margin-bottom: 12px;
  margin-bottom: 0.75rem;
}

.detail-builder .order-steps h2 {
  padding-top: 16px;
  padding-top: 1rem;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
}

@media (min-width: 48em) {
  .detail-builder .order-steps h2 {
    padding-top: 0;
  }
}

.detail-builder .order-steps .order-image img {
  max-width: 75%;
  display: block;
  margin: 0 auto;
}

.detail-builder .order-steps .bill-list,
.detail-builder .order-steps .order-terms {
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
}

.detail-builder .order-steps .bill-item .switch {
  margin-right: 16px;
  margin-right: 1rem;
  float: left;
}

.detail-builder .order-steps .bill-item .switch input.toggler {
  position: absolute;
}

.detail-builder .order-steps .bill-item .switch input.check + label:after {
  height: 16px;
  height: 1rem;
}

.detail-builder .order-form h3 {
  margin-top: 8px;
  margin-top: 0.5rem;
}

.detail-builder .order-form .opt-in {
  padding-top: 16px;
  padding-top: 1rem;
  padding-left: 8px;
  padding-left: 0.5rem;
  color: #889391;
}

.detail-builder .order-form .opt-in input.toggler {
  position: absolute;
}

.detail-builder .order-form .switch {
  margin-right: 16px;
  margin-right: 1rem;
  float: left;
}

.detail-builder .order-form .switch input.check + label:after {
  height: 16px;
  height: 1rem;
}

.detail-builder .step-item .opt-in {
  padding-top: 16px;
  padding-top: 1rem;
  padding-left: 8px;
  padding-left: 0.5rem;
}

.detail-builder .step-item .switch {
  margin-right: 16px;
  margin-right: 1rem;
  float: left;
}

.detail-builder .step-item .switch input.check + label:after {
  height: 16px;
  height: 1rem;
}

.detail-builder .step-item .opt-in {
  padding-top: 0;
}

.detail-builder .step-item .errorlist {
  color: #da1b60;
  padding-top: 16px;
  padding-top: 1rem;
}

.detail-builder .other-banks {
  display: none;
}

.detail-builder .order-terms > p {
  font-size: 12px;
  font-size: 0.75rem;
}

.detail-builder .order-terms .opt-in {
  padding-top: 16px;
  padding-top: 1rem;
  padding-left: 8px;
  padding-left: 0.5rem;
}

.detail-builder .order-terms .opt-in input.toggler {
  position: absolute;
}

.detail-builder .order-terms .switch {
  margin-right: 16px;
  margin-right: 1rem;
  float: left;
}

.detail-builder .order-terms .switch input.check + label:after {
  height: 16px;
  height: 1rem;
}

.detail-builder .order-terms .errorlist {
  margin-top: 80px;
  margin-top: 5rem;
  padding: 16px;
  padding: 1rem;
  background: #da1b60;
  color: #ffffff;
  clear: both;
}

.detail-builder .order-buttons {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 24px;
  padding-top: 1.5rem;
  margin-right: 0;
}

@media (min-width: 48em) {
  .detail-builder .order-buttons {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

.detail-builder .order-buttons .button-back {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.detail-builder .order-buttons .button-back a {
  display: block;
  text-align: right;
}

.detail-builder .order-buttons .button-call-back {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.detail-builder .order-buttons .button-call-back a {
  display: block;
}

.detail-builder .order-buttons .button-cancel {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-left: 16px;
  padding-left: 1rem;
}

.detail-builder .order-buttons .button-cancel a {
  margin: 0;
  display: block;
}

.detail-builder .order-buttons .button-continue {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  display: block;
  float: right;
  margin-right: 0;
}

.detail-builder .order-buttons .button-continue a {
  display: block;
}

.detail-builder .order-buttons .button-continue [type="submit"] {
  width: 100%;
  display: block;
}

.detail-builder .order-buttons .button-call {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  display: block;
  float: right;
  margin-right: 0;
}

.detail-builder .order-buttons .button-call a {
  display: block;
}

.detail-builder .detail-content {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-right: 0;
}

.detail-builder .detail-content > h2 {
  margin: 0;
}

@media (min-width: 48em) {
  .detail-builder .detail-content {
    width: 74.28571%;
    float: left;
    margin-right: 2.85714%;
    padding-left: 24px;
    padding-left: 1.5rem;
    margin-right: 0;
  }
}

.detail-builder .confirmation {
  width: 100%;
  min-height: 288px;
  min-height: 18rem;
  display: table;
}

.detail-builder .confirmation .confirmation-message {
  width: 100%;
  padding-right: 0;
  display: table-cell;
  vertical-align: middle;
  background-image: url('/today/static/web/img/thumbs_up_arm.png?b913b6203f48');
  background-size: 314px 207px;
  background-repeat: no-repeat;
  padding-bottom: 272px;
  padding-bottom: 17rem;
  background-position: bottom;
}

@media (min-width: 48em) {
  .detail-builder .confirmation .confirmation-message {
    background-position: right center;
    padding-right: 50%;
    padding-bottom: 0;
  }
}

.detail-builder .confirmation h1 {
  margin: 0;
  color: #0083c2;
}

.detail-builder .confirmation h2 {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
  margin: 0;
}

.detail-builder .confirmation h5 {
  margin-top: 32px;
  margin-top: 2rem;
}

.detail-builder .detail-sidebar h2:first-child {
  margin-top: 0;
}

.detail-builder .detail-sidebar p {
  margin-top: 0;
}

.detail-builder .detail-sidebar .small-links a {
  float: left;
  margin: 0;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  color: #889391;
}

.detail-builder .detail-sidebar .small-links a:hover {
  color: #0083c2;
}

.detail-builder .detail-sidebar .small-links .extra-link-right {
  float: right;
}

.detail-builder .detail-sidebar .small-links:after {
  content: "";
  display: block;
  clear: both;
}

.detail-builder .sidebar-value {
  padding-bottom: 4px;
  padding-bottom: 0.25rem;
}

.detail-builder .sidebar-value span {
  font-weight: bold;
  color: #0083c2;
}

.detail-builder .irs-with-grid {
  height: 56px;
  height: 3.5rem;
  margin-bottom: 48px;
  margin-bottom: 3rem;
}

.detail-builder .irs .irs-slider {
  width: 29.6px;
  width: 1.85rem;
  height: 29.6px;
  height: 1.85rem;
  border-radius: 29.6px;
  border-radius: 1.85rem;
  top: 20.96px;
  top: 1.31rem;
  border: 3px solid #e8e7e7;
  z-index: 3;
}

.detail-builder .irs .irs-slider:hover {
  cursor: pointer;
}

.detail-builder .irs .irs-line,
.detail-builder .irs .irs-line span,
.detail-builder .irs .irs-bar,
.detail-builder .irs .irs-bar-edge {
  height: 6px;
  height: 0.375rem;
}

.detail-builder .irs .irs-line,
.detail-builder .irs .irs-bar,
.detail-builder .irs .irs-bar-edge {
  top: 17.6px;
  top: 1.1rem;
  height: 37.44px;
  height: 2.34rem;
  background: transparent url('/today/static/web/img/track.png?bddbc6fecd7b') repeat-x center !important;
  background-size: 50%;
}

.detail-builder .irs .irs-line {
  z-index: 2;
}

.detail-builder .irs .irs-bar,
.detail-builder .irs .irs-bar-edge {
  z-index: 3;
}

.detail-builder .irs .irs-bar-edge {
  display: none;
}

.detail-builder .irs .irs-grid-pol {
  width: 37.44px;
  width: 2.34rem;
  height: 37.44px;
  height: 2.34rem;
  border-radius: 40px;
  border-radius: 2.5rem;
  margin-left: -17.92px;
  margin-left: -1.12rem;
  margin-top: -30.4px;
  margin-top: -1.9rem;
  background: #e8e7e7;
  opacity: 1;
  z-index: 1;
  display: none;
}

.detail-builder .irs .irs-grid-pol:hover {
  cursor: pointer;
}

.detail-builder .irs .irs-grid-text {
  font-size: 13.12px;
  font-size: 0.82rem;
  line-height: 16px;
  line-height: 1rem;
  font-family: "Telkom123-Bold", sans-serif;
  color: #cccccc;
  top: 12px;
  white-space: normal;
  width: 75px;
}

.detail-builder .choices-carousel + .shop-wizard-product {
  margin-top: 36px;
  margin-top: 2.25rem;
}

.detail-builder .extra-unit {
  width: 100%;
  display: block;
  clear: both;
}

.detail-builder .extra-unit * {
  display: inline-block;
  margin-right: 24px;
  margin-right: 1.5rem;
  padding-bottom: 0;
  margin-bottom: 0;
}

.detail-builder .extra-unit a:hover {
  color: #0083c2;
}

.detail-builder .extra-unit span:hover {
  color: #889391;
}

.detail-builder .extra-unit .pdfdownload {
  padding-right: 0;
}

.detail-builder .toggler {
  position: relative;
}

.detail-builder .toggler label {
  padding: 0;
  line-height: 32px;
  line-height: 2rem;
  display: block;
  color: #889391;
}

.detail-builder .toggler label:hover {
  cursor: pointer;
}

.detail-builder .toggler label div {
  display: inline-block;
  background: #ffffff;
  border: 1px solid #e8e7e7;
  padding: 1px;
  border-radius: 36px;
  border-radius: 2.25rem;
}

.detail-builder .toggler label div i {
  float: left;
  text-transform: uppercase;
  font-style: normal;
  font-size: 12.8px;
  font-size: 0.8rem;
  padding-left: 12px;
  padding-left: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem;
  border-radius: 36px;
  border-radius: 2.25rem;
  line-height: 28px;
  line-height: 1.75rem;
  display: inline-block;
  color: #889391;
}

.detail-builder .toggler label div i.months24 {
  color: #ffffff;
  background: #0083c2;
}

.detail-builder .toggler input:checked + label div .months24 {
  background: #ffffff;
  color: #889391;
}

.detail-builder .toggler input:checked + label div .months36 {
  background: #0083c2;
  color: #ffffff;
}

.detail-builder .toggler input {
  display: none;
}

.detail-builder .toggler label:before,
.detail-builder .toggler label:after {
  display: none;
}

/***************************************/

/*  #33 - Shop Detail Text/Table       */

/***************************************/

.text-table {
  width: 74.28571%;
  float: left;
  margin-right: 2.85714%;
  padding: 16px;
  padding: 1rem;
  margin-right: 0;
}

.text-table .extra-link-blue {
  float: right;
  margin-top: 8px;
  margin-top: 0.5rem;
}

.text-table table {
  width: 100%;
}

.text-table table tr {
  border-bottom: 1px solid #e8e7e7;
}

.text-table table tr:last-child {
  border: 0;
}

.text-table table th,
.text-table table td {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  text-align: left;
  vertical-align: middle;
}

.text-table table th {
  width: 40%;
}

/***************************************/

/*  #33 - Shop Bespoke                 */

/***************************************/

.shop-bespoke {
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
}

.shop-bespoke .drawer-title {
  padding-left: 0;
  padding-right: 0;
}

.shop-bespoke .builder-grouping {
  padding-left: 6%;
  padding-right: 6%;
  margin-left: -6%;
  margin-right: -6%;
}

.shop-bespoke .choices .option img {
  opacity: 1 !important;
}

.shop-bespoke:after {
  content: "";
  clear: both;
  display: block;
}

/***************************************/

/*  #33 - Call Back                    */

/***************************************/

.call-back {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-bottom: 48px;
  padding-bottom: 3rem;
  padding-left: 24px;
  padding-left: 1.5rem;
  padding-right: 24px;
  padding-right: 1.5rem;
  background: #005e9b;
}

@media (min-width: 48em) {
  .call-back {
    padding-left: 5%;
    padding-right: 5%;
  }
}

.call-back h1 {
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
  color: #ffffff;
}

.call-back .form-group,
.call-back .buttons {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.call-back .field {
  border-color: #4687b2;
}

.call-back .label {
  color: #ffffff;
}

.call-back input[type="text"],
.call-back input[type="password"] {
  color: #ffffff;
}

.call-back input[type="text"]:active,
.call-back input[type="password"]:active {
  color: #ffffff;
}

.call-back input[type="text"]:focus,
.call-back input[type="password"]:focus {
  color: #ffffff;
}

.call-back input[type="text"]::-webkit-input-placeholder,
.call-back input[type="password"]::-webkit-input-placeholder {
  color: #2695cb;
}

.call-back input[type="text"]:-moz-placeholder,
.call-back input[type="password"]:-moz-placeholder {
  color: #2695cb;
}

.call-back input[type="text"]::-moz-placeholder,
.call-back input[type="password"]::-moz-placeholder {
  color: #2695cb;
}

.call-back input[type="text"]:-ms-input-placeholder,
.call-back input[type="password"]:-ms-input-placeholder {
  color: #2695cb;
}

.call-back:after {
  content: "";
  clear: both;
  display: block;
}

.call-back .buttons .btn-pink {
  border: 1px solid #743a7c;
}

@media (min-width: 48em) {
  .call-back .field {
    margin-right: 24px;
    margin-right: 1.5rem;
  }

  .call-back .form-group {
    width: 35.71429%;
    float: left;
    margin-right: 2.85714%;
  }

  .call-back .buttons {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .call-back .form-group {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

.call-back-icon {
  width: 90%;
  min-height: 320px;
  min-height: 20rem;
  display: block;
  margin: 5%;
  background-position: center center;
}

@media (min-width: 48em) {
  .call-back-icon {
    width: 40%;
    float: left;
  }
}

.call-back-explore {
  width: 100% !important;
  display: block !important;
  float: none !important;
}

@media (min-width: 48em) {
  .call-back-explore {
    width: 50% !important;
    float: right !important;
  }
}

.call-back-explore .call-back-container .form-group {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: left;
}

@media (min-width: 48em) {
  .call-back-explore .call-back-container .form-group {
    width: 44.28571%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media (min-width: 62em) {
  .call-back-explore .call-back-container .form-group:nth-of-type(2) {
    float: right;
    margin-right: 0;
  }
}

.call-back-explore .call-back-container .field input {
  color: #ffffff;
}

.call-back-explore .call-back-container .field input::-webkit-input-placeholder {
  color: #2695cb;
}

.call-back-explore .call-back-container .field input:-moz-placeholder {
  color: #2695cb;
}

.call-back-explore .call-back-container .field input::-moz-placeholder {
  color: #2695cb;
}

.call-back-explore .call-back-container .field input:-ms-input-placeholder {
  color: #2695cb;
}

.call-back-explore .call-back-container .field > label {
  color: #ffffff;
}

.call-back-explore .buttons {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

.call-back-explore .buttons {
  *zoom: 1;
}

.call-back-explore .buttons:before,
.call-back-explore .buttons:after {
  content: "";
  display: table;
}

.call-back-explore .buttons:after {
  clear: both;
}

.call-back-explore .buttons .button {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .call-back-explore .buttons .button {
    width: 44.28571%;
    float: left;
    margin-right: 2.85714%;
  }
}

/***************************************/

/*  #34 - Shop Listing Slider          */

/***************************************/

.shop-listing-slider {
  position: relative;
  padding-top: 33.216px;
  padding-top: 2.076rem;
  padding-right: 0px;
  padding-right: 0rem;
  padding-bottom: 33.216px;
  padding-bottom: 2.076rem;
  padding-left: 0px;
  padding-left: 0rem;
  /*h2 {
            @include rem-fallback(line-height, ms(1) * 0.8);
        }*/
}

.shop-listing-slider .items:after {
  content: "";
  display: block;
  clear: both;
}

.no-js .shop-listing-slider .items {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.no-js .shop-listing-slider .items {
  *zoom: 1;
}

.no-js .shop-listing-slider .items:before,
.no-js .shop-listing-slider .items:after {
  content: "";
  display: table;
}

.no-js .shop-listing-slider .items:after {
  clear: both;
}

.shop-listing-slider .item {
  width: 100%;
  display: block;
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-right: 0px;
  padding-right: 0rem;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
  padding-left: 0px;
  padding-left: 0rem;
  padding-bottom: 0;
  text-align: center;
  position: relative;
  z-index: 2;
  border-bottom: 0;
}

@media (max-width: 48em) {
  .no-js .shop-listing-slider .item {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .no-js .shop-listing-slider .item:nth-of-type(2n + 2) {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 48em) and (max-width: 62em) {
  .no-js .shop-listing-slider .item {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }

  .no-js .shop-listing-slider .item:nth-of-type(4n + 4) {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 62em) {
  .no-js .shop-listing-slider .item {
    width: 17.71429%;
    float: left;
    margin-right: 2.85714%;
  }

  .no-js .shop-listing-slider .item:nth-of-type(5n + 5) {
    float: right;
    margin-right: 0;
  }
}

.shop-listing-slider .item a {
  width: 100%;
  float: left;
  display: block;
  text-align: center;
  text-decoration: none;
  color: #889391;
}

.shop-listing-slider .item img {
  max-height: 75%;
  width: 100%;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

@media (min-width: 48em) {
  .shop-listing-slider .item img {
    max-width: 55%;
    height: auto;
  }
}

.shop-listing-slider .item p {
  margin: 0;
  padding-top: 0px;
  padding-top: 0rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-bottom: 0px;
  padding-bottom: 0rem;
  padding-left: 16px;
  padding-left: 1rem;
  font-size: 28px;
  font-size: 1.75rem;
  line-height: 36px;
  line-height: 2.25rem;
  min-height: 105.6px;
  min-height: 6.6rem;
  font-family: "Telkom123-Light", sans-serif;
  letter-spacing: -2px;
}

.shop-listing-slider .item.on {
  background: #f7f7f6;
  border: 1px solid #e8e7e7;
  border-bottom: 0;
  padding-bottom: 59.2px;
  padding-bottom: 3.7rem;
}

.shop-listing-slider .item.deselect {
  background: transparent;
  border-color: transparent;
}

.shop-listing-slider .item:after {
  content: "";
  display: block;
  clear: both;
}

.shop-listing-slider .item:last-child {
  margin-right: 0;
}

.shop-listing-slider .no-image {
  max-width: 100%;
  min-height: 184px;
  min-height: 11.5rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  background-position: top;
  background-size: 32%;
}

.shop-listing-slider .pick {
  position: relative;
  min-height: 224px;
  min-height: 14rem;
}

@media (min-width: 75em) {
  .shop-listing-slider .pick {
    min-height: 256px;
    min-height: 16rem;
  }
}

.shop-listing-slider .pick input {
  display: none;
  margin-top: -16px;
  margin-top: -1rem;
  padding: 24px;
  padding: 1.5rem;
}

.shop-listing-slider .pick input + label {
  display: block;
  position: relative;
  height: 100%;
  width: 100%;
  -webkit-transition: background 0.4s;
  transition: background 0.4s;
}

.shop-listing-slider .pick .indicator {
  bottom: 0;
  left: 50%;
  display: none;
}

.shop-listing-slider .pick input + label {
  cursor: pointer;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
}

.shop-listing-slider .pick input + label .indicator {
  pointer-events: none;
}

.shop-listing-slider .pick input + label .indicator .icon-product-add {
  opacity: 1;
}

.shop-listing-slider .pick input + label .indicator .icon-product-added {
  opacity: 0;
}

.shop-listing-slider .pick.to-compare img {
  opacity: 0.25;
  pointer-events: none;
}

.shop-listing-slider .pick input:checked + label img {
  opacity: 1;
}

.shop-listing-slider .pick input:checked + label .indicator .icon-product-add {
  opacity: 0;
}

.shop-listing-slider .pick input:checked + label .indicator .icon-product-added {
  opacity: 1;
}

/***************************************/

/*  #35 - Shop Wizard Sidebar          */

/***************************************/

.shop-wizard-sidebar {
  background: #f7f7f6;
  padding-top: 48px;
  padding-top: 3rem;
  padding-bottom: 48px;
  padding-bottom: 3rem;
  padding-left: 5.5%;
  padding-right: 4%;
  position: relative;
}

.shop-wizard-sidebar h2:first-child {
  color: #0083c2;
  margin-top: 0;
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.shop-wizard-sidebar h3 {
  color: #0083c2;
}

.shop-wizard-sidebar p {
  color: #ffffff;
  margin-top: 12px;
  margin-top: 0.75rem;
  margin-bottom: 12px;
  margin-bottom: 0.75rem;
}

.shop-wizard-sidebar ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.shop-wizard-sidebar li {
  height: 36px;
  height: 2.25rem;
  position: relative;
  color: #e8e7e7;
}

.shop-wizard-sidebar li span {
  min-width: 40px;
  min-width: 2.5rem;
  min-height: 16px;
  min-height: 1rem;
  border-radius: 32px;
  border-radius: 2rem;
  line-height: 24px;
  line-height: 1.5rem;
  margin-top: 3px;
  margin-top: 0.1875rem;
  float: right;
  text-align: center;
  border: 1px solid #e8e7e7;
}

.shop-wizard-sidebar label {
  padding-left: 36px;
  padding-left: 2.25rem;
  line-height: 32px;
  line-height: 2rem;
  display: block;
  color: #889391;
}

.shop-wizard-sidebar label:hover {
  cursor: pointer;
}

.shop-wizard-sidebar label div {
  display: inline-block;
  background: #f7f7f7;
  border: 1px solid #e8e7e7;
  padding: 1px;
  border-radius: 36px;
  border-radius: 2.25rem;
}

.shop-wizard-sidebar label div i {
  float: left;
  text-transform: uppercase;
  font-style: normal;
  font-size: 12.8px;
  font-size: 0.8rem;
  padding-left: 12px;
  padding-left: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem;
  border-radius: 36px;
  border-radius: 2.25rem;
  line-height: 28px;
  line-height: 1.75rem;
  display: inline-block;
  color: #889391;
}

.shop-wizard-sidebar label div i.no {
  color: #ffffff;
  background: #0083c2;
}

.shop-wizard-sidebar input + label:before {
  width: 18px;
  width: 1.125rem;
  height: 18px;
  height: 1.125rem;
  border-radius: 18px;
  border-radius: 1.125rem;
  display: block;
  position: absolute;
  top: -5px;
  bottom: 0;
  left: 0;
  margin: auto;
  content: "";
  border: 1px solid #e8e7e7;
}

.shop-wizard-sidebar input:checked + label {
  color: #0083c2;
  border-color: #0083c2;
}

.shop-wizard-sidebar input:checked + label:before,
.shop-wizard-sidebar input:checked + label span {
  background: #0083c2;
  color: #e8e7e7;
  border-color: #0083c2;
}

.shop-wizard-sidebar input:checked + label div .yes {
  background: #0083c2;
  color: #ffffff;
}

.shop-wizard-sidebar input:checked + label div .no {
  background: transparent;
  color: #889391;
}

.shop-wizard-sidebar input {
  display: none;
}

.shop-wizard-sidebar .toggler label {
  padding: 0;
}

.shop-wizard-sidebar .toggler label:before,
.shop-wizard-sidebar .toggler label:after,
.shop-wizard-sidebar .toggler span {
  display: none;
}

.shop-wizard-sidebar .radios {
  background: #ffffff;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  display: inline-block;
  padding: 1px;
  border: 1px solid #e8e7e7;
  border-radius: 36px;
  border-radius: 2.25rem;
}

.shop-wizard-sidebar .radios li {
  float: left;
  height: 31.2px;
  height: 1.95rem;
}

.shop-wizard-sidebar .radios li label {
  text-transform: uppercase;
  font-style: normal;
  font-size: 12.8px;
  font-size: 0.8rem;
  padding-left: 12px;
  padding-left: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem;
  border-radius: 36px;
  border-radius: 2.25rem;
  line-height: 28.8px;
  line-height: 1.8rem;
}

.shop-wizard-sidebar .radios li input + label {
  border: 1px solid #ffffff;
}

.shop-wizard-sidebar .radios li input:checked + label {
  background: #0083c2;
  border: 1px solid #0083c2;
  color: #ffffff;
}

.shop-wizard-sidebar .radios:after {
  content: "";
  clear: both;
  display: block;
}

.shop-wizard-sidebar .radio-list input + label:before {
  width: 24px;
  width: 1.5rem;
  height: 24px;
  height: 1.5rem;
  border: 0;
  border-radius: 0;
  background-size: 100%;
  background-repeat: no-repeat;
  background-color: transparent;
}

.shop-wizard-sidebar .radio-list .playing-games-wizard label:before,
.shop-wizard-sidebar .radio-list .playing-games-wizard-home label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-games.png?23c69fb44c57');
}

.shop-wizard-sidebar .radio-list .playing-games-wizard input:checked + label:before,
.shop-wizard-sidebar .radio-list .playing-games-wizard-home input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-games-blue.png?c55b55990f40');
}

.shop-wizard-sidebar .radio-list .chatting-people-wizard label:before,
.shop-wizard-sidebar .radio-list .chatting-people-wizard-home label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-chatting.png?e72a59c08ccb');
}

.shop-wizard-sidebar .radio-list .chatting-people-wizard input:checked + label:before,
.shop-wizard-sidebar .radio-list .chatting-people-wizard-home input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-chatting-blue.png?07b788f02123');
}

.shop-wizard-sidebar .radio-list .emails label:before,
.shop-wizard-sidebar .radio-list .checking-emails-wizard label:before,
.shop-wizard-sidebar .radio-list .checking-emails-wizard-home label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-email.png?b9dc92b8ede7');
}

.shop-wizard-sidebar .radio-list .emails input:checked + label:before,
.shop-wizard-sidebar .radio-list .checking-emails-wizard input:checked + label:before,
.shop-wizard-sidebar .radio-list .checking-emails-wizard-home input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-email-blue.png?2b332e6bfbe8');
}

.shop-wizard-sidebar .radio-list .listening-music-wizard label:before,
.shop-wizard-sidebar .radio-list .listening-music-wizard-home label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-music.png?b4854f3fbd16');
}

.shop-wizard-sidebar .radio-list .listening-music-wizard input:checked + label:before,
.shop-wizard-sidebar .radio-list .listening-music-wizard-home input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-music-blue.png?0d3a931875e9');
}

.shop-wizard-sidebar .radio-list .audio-and-video-streaming label:before,
.shop-wizard-sidebar .radio-list .watching-videos-wizard label:before,
.shop-wizard-sidebar .radio-list .watching-videos-wizard-home label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-videos.png?6608f44a7ad2');
}

.shop-wizard-sidebar .radio-list .audio-and-video-streaming input:checked + label:before,
.shop-wizard-sidebar .radio-list .watching-videos-wizard input:checked + label:before,
.shop-wizard-sidebar .radio-list .watching-videos-wizard-home input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-videos-blue.png?1d8d561da978');
}

.shop-wizard-sidebar .radio-list .social-networking label:before,
.shop-wizard-sidebar .radio-list .social-media-wizard label:before,
.shop-wizard-sidebar .radio-list .social-media-wizard-home label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-social.png?56dfc2a76d85');
}

.shop-wizard-sidebar .radio-list .social-networking input:checked + label:before,
.shop-wizard-sidebar .radio-list .social-media-wizard input:checked + label:before,
.shop-wizard-sidebar .radio-list .social-media-wizard-home input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-social-blue.png?be599bd29b59');
}

.shop-wizard-sidebar .radio-list .general-browsing label:before,
.shop-wizard-sidebar .radio-list .browsing-searching-wizard label:before,
.shop-wizard-sidebar .radio-list .browsing-searching-wizard-home label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-browsing.png?625209ce2af7');
}

.shop-wizard-sidebar .radio-list .general-browsing input:checked + label:before,
.shop-wizard-sidebar .radio-list .browsing-searching-wizard input:checked + label:before,
.shop-wizard-sidebar .radio-list .browsing-searching-wizard-home input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-browsing-blue.png?fb0079e54224');
}

.shop-wizard-sidebar .radio-list .transferring-large-files label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-file-transfer.png?d94e4523c468');
}

.shop-wizard-sidebar .radio-list .transferring-large-files input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-file-transfer-blue.png?7f088eb1902d');
}

.shop-wizard-sidebar .radio-list .cloud-services label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-cloud.png?f2c7307ee6fd');
}

.shop-wizard-sidebar .radio-list .cloud-services input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-file-transfer-blue.png?7f088eb1902d');
}

.shop-wizard-sidebar .radio-list .video-conferencing label:before,
.shop-wizard-sidebar .radio-list .voip-calls label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-voip.png?ab44b6f2c1d0');
}

.shop-wizard-sidebar .radio-list .video-conferencing input:checked + label:before,
.shop-wizard-sidebar .radio-list .voip-calls input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/wizard-voip-blue.png?70fe4a8e1097');
}

.shop-wizard-sidebar .image-group li {
  width: 20%;
  float: left;
  position: relative;
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.shop-wizard-sidebar .image-group li label:before {
  width: 35.2px;
  width: 2.2rem;
  height: 35.2px;
  height: 2.2rem;
  margin: 0 auto;
  border: 0;
  background-color: transparent;
  background-size: 120%;
  background-position: center center;
  border-radius: 0;
}

.shop-wizard-sidebar .image-group li input:checked + label:before {
  background-color: transparent;
}

.shop-wizard-sidebar .image-group li:hover > .helper .helper-text {
  min-width: 288px;
  min-width: 18rem;
  text-align: left;
  display: block;
}

.shop-wizard-sidebar .image-group li:hover > .helper .helper-text:after {
  display: none;
}

.shop-wizard-sidebar .image-group li:hover:after {
  width: 0;
  height: 0;
  background: #005e9b;
  content: " ";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  left: 6px;
  right: 0;
  bottom: -25px;
  z-index: 19;
}

@media (min-width: 48em) {
  .shop-wizard-sidebar .image-group li:hover:after {
    width: 18px;
    height: 18px;
  }
}

.shop-wizard-sidebar .image-group .voice-fixed label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/voiceit-fixedline.png?91a740432127');
}

.shop-wizard-sidebar .image-group .voice-fixed input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/voiceit-fixedline-blue.png?e8049d154855');
}

.shop-wizard-sidebar .image-group .voice-pbx label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/voiceit-pbx.png?a9d72e6c003c');
}

.shop-wizard-sidebar .image-group .voice-pbx input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/voiceit-pbx-blue.png?3d7041dc9740');
}

.shop-wizard-sidebar .image-group .employee-browsing label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-search.png?b99a7b3155a3');
}

.shop-wizard-sidebar .image-group .employee-browsing input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-search-blue.png?df18a978c1b9');
}

.shop-wizard-sidebar .image-group .employee-emails label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-email.png?c324ff387d10');
}

.shop-wizard-sidebar .image-group .employee-emails input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-email-blue.png?aacb068e3e73');
}

.shop-wizard-sidebar .image-group .employee-voip label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-voipcalls.png?50c758cf6a6b');
}

.shop-wizard-sidebar .image-group .employee-voip input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-voipcalls-blue.png?411758b55db2');
}

.shop-wizard-sidebar .image-group .employee-video label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-videoconf.png?34ff57db0090');
}

.shop-wizard-sidebar .image-group .employee-video input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-videoconf-blue.png?093a0ab11542');
}

.shop-wizard-sidebar .image-group .employee-cloud label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-cloudservices.png?c373bf8404f2');
}

.shop-wizard-sidebar .image-group .employee-cloud input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-cloudservices-blue.png?8db3ee9b3659');
}

.shop-wizard-sidebar .image-group .employee-streaming label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-streaming.png?0de4b9a0f76c');
}

.shop-wizard-sidebar .image-group .employee-streaming input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-streaming-blue.png?de2931733a0f');
}

.shop-wizard-sidebar .image-group .employee-backups label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-backup.png?b4a6f446948f');
}

.shop-wizard-sidebar .image-group .employee-backups input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-backup-blue.png?bdb6a501d1fa');
}

.shop-wizard-sidebar .image-group .employee-transfers label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-filetransfer.png?14b45d03f63a');
}

.shop-wizard-sidebar .image-group .employee-transfers input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-filetransfer-blue.png?ac926a6ce779');
}

.shop-wizard-sidebar .image-group .employee-social label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-social.png?f4f3db3d4f28');
}

.shop-wizard-sidebar .image-group .employee-social input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/data-social-blue.png?655be22429b2');
}

.shop-wizard-sidebar .image-group .services-pcs label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-pc.png?464aa4c8d600');
}

.shop-wizard-sidebar .image-group .services-pcs input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-pc-blue.png?bd3af09d100a');
}

.shop-wizard-sidebar .image-group .services-pcs label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-pc.png?464aa4c8d600');
}

.shop-wizard-sidebar .image-group .services-pcs input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-pc-blue.png?bd3af09d100a');
}

.shop-wizard-sidebar .image-group .services-laptops label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-laptop.png?4ebba31ee0c8');
}

.shop-wizard-sidebar .image-group .services-laptops input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-laptop-blue.png?857eaf2f6667');
}

.shop-wizard-sidebar .image-group .services-monitors label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-monitors.png?0c36ee7afc34');
}

.shop-wizard-sidebar .image-group .services-monitors input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-monitors-blue.png?a6f32e7831d4');
}

.shop-wizard-sidebar .image-group .services-printers label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-printer.png?82a007429d7a');
}

.shop-wizard-sidebar .image-group .services-printers input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-printer-blue.png?b07aabf70aa0');
}

.shop-wizard-sidebar .image-group .services-hosting label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-hosting.png?5139afac4344');
}

.shop-wizard-sidebar .image-group .services-hosting input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-hosting-blue.png?dd4e013c1f08');
}

.shop-wizard-sidebar .image-group .services-dedicated label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-dedicatedservers.png?437dab407ef1');
}

.shop-wizard-sidebar .image-group .services-dedicated input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-dedicatedservers-blue.png?3282f055d2c3');
}

.shop-wizard-sidebar .image-group .services-virtual label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-virtualservers.png?51c62b103bdd');
}

.shop-wizard-sidebar .image-group .services-virtual input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-virtualservers-blue.png?f0300771fe00');
}

.shop-wizard-sidebar .image-group .services-storage label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-storage.png?4a46fe20d371');
}

.shop-wizard-sidebar .image-group .services-storage input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-storage-blue.png?4dba165dc29e');
}

.shop-wizard-sidebar .image-group .services-backup label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-backup.png?4d89c0f0f220');
}

.shop-wizard-sidebar .image-group .services-backup input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-backup-blue.png?4c9f9b36a222');
}

.shop-wizard-sidebar .image-group .services-lan label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-lan.png?fea172b42967');
}

.shop-wizard-sidebar .image-group .services-lan input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-lan-blue.png?cd16b4458673');
}

.shop-wizard-sidebar .image-group .services-email label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-email.png?6f5aa172a690');
}

.shop-wizard-sidebar .image-group .services-email input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-email-blue.png?ab0fc97f5157');
}

.shop-wizard-sidebar .image-group .services-security label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-security.png?ad99ddadda23');
}

.shop-wizard-sidebar .image-group .services-security input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-security-blue.png?223d9d40400a');
}

.shop-wizard-sidebar .image-group .services-software label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-businessoftware.png?d85ab6b0447a');
}

.shop-wizard-sidebar .image-group .services-software input:checked + label:before {
  background-image: url('/today/static/web/img/icons/icon-library/png/itservices-businessoftware-blue.png?ec2a9f69cef8');
}

.shop-wizard-sidebar .image-group:after {
  content: "";
  clear: both;
  display: block;
}

.shop-wizard-sidebar .check-coverage {
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.shop-wizard-sidebar .check-coverage .field {
  position: relative;
}

.shop-wizard-sidebar .check-coverage .field input {
  width: 100%;
  float: left;
  display: block;
  color: #0083c2;
  position: relative;
}

.shop-wizard-sidebar .check-coverage .field input ::-webkit-input-placeholder {
  color: #889391;
}

.shop-wizard-sidebar .check-coverage .field input :-moz-placeholder {
  color: #889391;
}

.shop-wizard-sidebar .check-coverage .field input ::-moz-placeholder {
  color: #889391;
}

.shop-wizard-sidebar .check-coverage .field input :-ms-input-placeholder {
  color: #889391;
}

.shop-wizard-sidebar .check-coverage .field button {
  width: 20%;
  height: 32px;
  height: 2rem;
  float: left;
  background: #f7f7f6;
  border: 0;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  z-index: i;
}

.shop-wizard-sidebar .check-coverage .field button i {
  width: 24px;
  width: 1.5rem;
  height: 32px;
  height: 2rem;
  float: right;
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-right: 16px;
  margin-right: 1rem;
  display: block;
  background-size: 100%;
}

.shop-wizard-sidebar .check-coverage .mapcontainer {
  height: 0;
  position: relative;
  overflow: hidden;
}

.shop-wizard-sidebar .check-coverage .map {
  height: 244px;
  height: 15.25rem;
  margin-top: 16px;
  margin-top: 1rem;
}

.shop-wizard-sidebar .check-coverage .maploader {
  width: 100%;
  display: none;
  height: 80px;
  height: 5rem;
  text-align: center;
  position: relative;
}

.shop-wizard-sidebar .check-coverage .result {
  display: none;
  background: #0083c2;
  padding: 16px;
  padding: 1rem;
  padding-top: 4px;
  padding-top: 0.25rem;
}

.shop-wizard-sidebar .check-coverage .result input + label:before,
.shop-wizard-sidebar .check-coverage .result input + label {
  color: #005e9b;
  border-color: #005e9b;
}

.shop-wizard-sidebar .check-coverage .result input:checked + label:before,
.shop-wizard-sidebar .check-coverage .result input:checked + label {
  color: #ffffff;
  border-color: #ffffff;
}

.shop-wizard-sidebar .check-coverage .result input:checked + label:before {
  background: #ffffff;
}

.shop-wizard-sidebar .check-coverage .result h4 {
  color: #00d0ff;
  text-transform: uppercase;
  font-family: "Telkom123-Bold", sans-serif;
  font-size: 12px;
  font-size: 0.75rem;
}

.shop-wizard-sidebar .check-coverage .result .no-results {
  display: none;
}

.shop-wizard-sidebar .slider-grey .irs-with-grid {
  height: 56px;
  height: 3.5rem;
  margin-bottom: 48px;
  margin-bottom: 3rem;
  margin-top: -16px;
  margin-top: -1rem;
}

.shop-wizard-sidebar .slider-grey .irs .irs-slider {
  width: 29.6px;
  width: 1.85rem;
  height: 29.6px;
  height: 1.85rem;
  border-radius: 29.6px;
  border-radius: 1.85rem;
  top: 19.36px;
  top: 1.21rem;
  margin-left: -1.6px;
  margin-left: -0.1rem;
  border: 3px solid #e8e7e7;
  z-index: 3;
}

.shop-wizard-sidebar .slider-grey .irs .irs-slider:hover {
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
}

.shop-wizard-sidebar .slider-grey .irs .irs-line,
.shop-wizard-sidebar .slider-grey .irs .irs-line span,
.shop-wizard-sidebar .slider-grey .irs .irs-bar,
.shop-wizard-sidebar .slider-grey .irs .irs-bar-edge {
  height: 6px;
  height: 0.375rem;
}

.shop-wizard-sidebar .slider-grey .irs .irs-line,
.shop-wizard-sidebar .slider-grey .irs .irs-bar,
.shop-wizard-sidebar .slider-grey .irs .irs-bar-edge {
  top: 17.6px;
  top: 1.1rem;
  height: 32.8px;
  height: 2.05rem;
  background: transparent url('/today/static/web/img/track.png?bddbc6fecd7b') repeat-x center !important;
  background-size: 50%;
}

.shop-wizard-sidebar .slider-grey .irs .irs-line {
  z-index: 2;
  border-radius: 29.6px;
  border-radius: 1.85rem;
}

.shop-wizard-sidebar .slider-grey .irs .irs-bar,
.shop-wizard-sidebar .slider-grey .irs .irs-bar-edge {
  z-index: 3;
}

.shop-wizard-sidebar .slider-grey .irs .irs-bar-edge {
  display: none;
}

.shop-wizard-sidebar .slider-grey .irs .irs-grid-pol {
  width: 32px;
  width: 2rem;
  height: 32px;
  height: 2rem;
  border-radius: 40px;
  border-radius: 2.5rem;
  margin-left: -17.92px;
  margin-left: -1.12rem;
  margin-top: -30.4px;
  margin-top: -1.9rem;
  background: #e8e7e7;
  opacity: 1;
  z-index: 1;
  display: none;
}

.shop-wizard-sidebar .slider-grey .irs .irs-grid-pol:hover {
  cursor: pointer;
}

.shop-wizard-sidebar .slider-grey .irs .irs-grid-text {
  font-size: 13.12px;
  font-size: 0.82rem;
  line-height: 16px;
  line-height: 1rem;
  font-family: "Telkom123-Bold", sans-serif;
  color: #889391;
  top: 12px;
  visibility: visible !important;
}

.shop-wizard-sidebar .slider-normal {
  margin-bottom: 48px;
  margin-bottom: 3rem;
}

.shop-wizard-sidebar .slider-normal .irs-with-grid {
  height: 56px;
  height: 3.5rem;
  margin-top: -32px;
  margin-top: -2rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.shop-wizard-sidebar .slider-normal .irs .irs-slider {
  width: 26.4px;
  width: 1.65rem;
  height: 26.4px;
  height: 1.65rem;
  border-radius: 26.4px;
  border-radius: 1.65rem;
  background: #0083c2;
}

.shop-wizard-sidebar .slider-normal .irs .irs-line-left,
.shop-wizard-sidebar .slider-normal .irs .irs-line-mid,
.shop-wizard-sidebar .slider-normal .irs .irs-line-right {
  background: #e8e7e7;
}

.shop-wizard-sidebar .slider-normal .irs .irs-bar {
  background: #005e9b;
}

.shop-wizard-sidebar .slider-normal .irs .irs-line,
.shop-wizard-sidebar .slider-normal .irs .irs-line span,
.shop-wizard-sidebar .slider-normal .irs .irs-bar,
.shop-wizard-sidebar .slider-normal .irs .irs-bar-edge {
  height: 6px;
  height: 0.375rem;
}

.shop-wizard-sidebar .slider-normal .irs .irs-line,
.shop-wizard-sidebar .slider-normal .irs .irs-bar,
.shop-wizard-sidebar .slider-normal .irs .irs-bar-edge {
  top: 33.6px;
  top: 2.1rem;
}

.shop-wizard-sidebar .slider-normal .irs .irs-grid-pol {
  display: none;
}

.shop-wizard-sidebar .slider-normal .irs .irs-grid-text {
  font-size: 13.12px;
  font-size: 0.82rem;
  font-family: "Telkom123-Bold", sans-serif;
  color: #889391;
}

.shop-wizard-sidebar .message-enterprise {
  padding: 16px;
  padding: 1rem;
  padding-top: 8px;
  padding-top: 0.5rem;
  background: #005e9b;
  position: absolute;
  left: 80px;
  left: 5rem;
  right: 60px;
  right: 3.75rem;
  top: 0;
  z-index: 4;
  display: none;
}

.shop-wizard-sidebar .message-enterprise h3 {
  color: #ffffff;
}

.shop-wizard-sidebar .message-enterprise p {
  color: #00d0ff;
}

.shop-wizard-sidebar .message-enterprise .field label {
  display: table-cell;
  padding-left: 0;
  line-height: 16px;
  line-height: 1rem;
  color: #ffffff;
}

.shop-wizard-sidebar .message-enterprise .field input[type="text"],
.shop-wizard-sidebar .message-enterprise .field input[type="tel"],
.shop-wizard-sidebar .message-enterprise .field input[type="email"] {
  display: table-cell;
  color: #ffffff;
}

.shop-wizard-sidebar .message-enterprise .field input[type="text"]::-webkit-input-placeholder,
.shop-wizard-sidebar .message-enterprise .field input[type="tel"]::-webkit-input-placeholder,
.shop-wizard-sidebar .message-enterprise .field input[type="email"]::-webkit-input-placeholder {
  color: #0083c2;
}

.shop-wizard-sidebar .message-enterprise .field input[type="text"]:-moz-placeholder,
.shop-wizard-sidebar .message-enterprise .field input[type="tel"]:-moz-placeholder,
.shop-wizard-sidebar .message-enterprise .field input[type="email"]:-moz-placeholder {
  color: #0083c2;
}

.shop-wizard-sidebar .message-enterprise .field input[type="text"]::-moz-placeholder,
.shop-wizard-sidebar .message-enterprise .field input[type="tel"]::-moz-placeholder,
.shop-wizard-sidebar .message-enterprise .field input[type="email"]::-moz-placeholder {
  color: #0083c2;
}

.shop-wizard-sidebar .message-enterprise .field input[type="text"]:-ms-input-placeholder,
.shop-wizard-sidebar .message-enterprise .field input[type="tel"]:-ms-input-placeholder,
.shop-wizard-sidebar .message-enterprise .field input[type="email"]:-ms-input-placeholder {
  color: #0083c2;
}

.shop-wizard-sidebar .message-enterprise .buttons {
  margin-top: 16px;
  margin-top: 1rem;
}

.shop-wizard-sidebar .message-enterprise .btn-primary {
  width: 100%;
  display: block;
}

.shop-wizard-sidebar .message-enterprise:after {
  width: 16px;
  width: 1rem;
  height: 16px;
  height: 1rem;
  background: #005e9b;
  content: "";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: -7px;
  right: 8px;
  z-index: 19;
}

.shop-wizard-sidebar .separator-or {
  text-align: center;
  margin-top: 56px;
  margin-top: 3.5rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 38.7px;
  line-height: 2.41875rem;
  color: #0083c2;
}

.shop-wizard-sidebar .btn-restart {
  display: none;
}

/***************************************/

/*  #35 - Shop Wizard Product          */

/***************************************/

.shop-wizard-product {
  padding: 0;
  padding-right: 5.5%;
  margin-right: 0;
}

.shop-wizard-product h2 {
  margin: 0;
}

@media (min-width: 48em) {
  .shop-wizard-product h2 {
    margin: 0;
    margin-bottom: 16px;
    margin-bottom: 1rem;
  }
}

.shop-wizard-product .product-image {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding: 24px;
  padding: 1.5rem;
  padding-left: 0;
  padding-right: 0;
  margin-right: 0;
  text-align: center;
}

@media (min-width: 62em) {
  .shop-wizard-product .product-image {
    width: 40%;
    float: left;
    margin-right: 2.85714%;
    margin-right: inherit;
  }
}

.shop-wizard-product .product-image img {
  max-width: 250px;
}

.shop-wizard-product .product-image .no-image {
  max-width: 100%;
  min-height: 240px;
  min-height: 15rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
  -webkit-transition: 0.5s;
  transition: 0.5s;
  background-position: center;
  background-size: 30%;
}

.shop-wizard-product .product-details {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin: 0;
  padding: 0;
}

@media (min-width: 62em) {
  .shop-wizard-product .product-details {
    width: 57.14286%;
    float: left;
    margin-right: 2.85714%;
    margin-right: 0;
    padding: 24px;
    padding: 1.5rem;
    padding-right: 0;
  }
}

.shop-wizard-product .product-details h1 {
  font-weight: bold;
  color: #0083c2;
  margin: 0;
}

.shop-wizard-product .product-details h2:first-of-type {
  color: #0083c2;
  margin-bottom: 12px;
  margin-bottom: 0.75rem;
}

.shop-wizard-product .product-details .section-value {
  margin-bottom: 4px;
  margin-bottom: 0.25rem;
}

/***************************************************/

/*  #35 - Shop Wizard Other Recommended Products   */

/***************************************************/

.shop-wizard-other {
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-right: 5.5%;
  padding-left: 5%;
  margin-right: 0;
}

.shop-wizard-other .items {
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
}

.shop-wizard-other .items {
  *zoom: 1;
}

.shop-wizard-other .items:before,
.shop-wizard-other .items:after {
  content: "";
  display: table;
}

.shop-wizard-other .items:after {
  clear: both;
}

.shop-wizard-other .item {
  width: 48.57143%;
  float: left;
  margin-right: 2.85714%;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
  min-height: 320px;
  min-height: 20rem;
  text-align: center;
}

@media (max-width: 48em) {
  .shop-wizard-other .item:nth-child(2n+2) {
    margin-right: 0;
  }

  .shop-wizard-other .item img {
    max-width: 65%;
  }
}

@media (min-width: 48em) and (max-width: 62em) {
  .shop-wizard-other .item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .shop-wizard-other .item:nth-child(3n+3) {
    margin-right: 0;
  }
}

@media (min-width: 62em) and (max-width: 75em) {
  .shop-wizard-other .item {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }

  .shop-wizard-other .item:nth-child(4n+4) {
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .shop-wizard-other .item {
    width: 14.28571%;
    float: left;
    margin-right: 2.85714%;
  }

  .shop-wizard-other .item:nth-child(6n+6) {
    margin-right: 0;
  }
}

.shop-wizard-other .item .no-image {
  max-width: 100%;
  min-height: 149.28px;
  min-height: 9.33rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
  -webkit-transition: 0.5s;
  transition: 0.5s;
  background-position: center;
  background-size: 35%;
}

.shop-wizard-other .item p {
  line-height: 16px;
  line-height: 1rem;
  display: block;
}

.shop-wizard-other .item > a {
  display: block;
  font-size: 12.8px;
  font-size: 0.8rem;
  text-decoration: none;
  color: #889391;
}

@media (max-width: 48em) {
  .shop-wizard-business-other .item:nth-child(2n+2) {
    float: left;
    margin-right: 0;
  }
}

@media (min-width: 48em) and (max-width: 62em) {
  .shop-wizard-business-other .item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .shop-wizard-business-other .item:nth-child(3n+3) {
    float: left;
    margin-right: 0;
  }
}

@media (min-width: 62em) and (max-width: 75em) {
  .shop-wizard-business-other .item {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }

  .shop-wizard-business-other .item:nth-child(4n+4) {
    float: left;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .shop-wizard-business-other .item {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }

  .shop-wizard-business-other .item:nth-child(4n+4) {
    float: left;
    margin-right: 0;
  }
}

.shop-wizard-business-other .item img {
  max-width: 75%;
}

.shop-wizard-business-other .item p {
  line-height: 20px;
  line-height: 1.25rem;
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
}

.shop-wizard-business-other .item a {
  font-size: 16px;
  font-size: 1rem;
}

/*****************************************/

/*  #35 - Shop Wizard Filtered           */

/*****************************************/

.shop-wizard-filtered {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

.shop-wizard-filtered .items {
  *zoom: 1;
}

.shop-wizard-filtered .items:before,
.shop-wizard-filtered .items:after {
  content: "";
  display: table;
}

.shop-wizard-filtered .items:after {
  clear: both;
}

.shop-wizard-filtered .items .item {
  width: 48.57143%;
  float: left;
  margin-right: 2.85714%;
  padding: 24px;
  padding: 1.5rem;
  border: 1px solid #ffffff;
  border-bottom: 0;
  z-index: 100;
}

.shop-wizard-filtered .items .item:nth-child(2n+2) {
  float: right;
  margin-right: 0;
}

@media (min-width: 62em) {
  .shop-wizard-filtered .items .item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .shop-wizard-filtered .items .item:nth-child(2n+2) {
    float: left;
    margin-right: 2.85714%;
  }

  .shop-wizard-filtered .items .item:nth-child(3n+3) {
    float: right;
    margin-right: 0;
  }
}

.shop-wizard-filtered .items .item .item-content > .image {
  max-height: 176px;
  max-height: 11rem;
}

.shop-wizard-filtered .items .item .item-content > .image img {
  height: 160px;
  height: 10rem;
}

.shop-wizard-filtered .items .item .item-content > img {
  max-width: 60%;
}

.shop-wizard-filtered .items .item .item-content > h3 {
  min-height: 56px;
  min-height: 3.5rem;
  color: #889391;
}

.shop-wizard-filtered .items .item .item-content > p {
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
  line-height: 19.2px;
  line-height: 1.2rem;
  min-height: 64px;
  min-height: 4rem;
}

.shop-wizard-filtered .items .item .item-content > p:last-of-type {
  margin-top: 0;
}

.shop-wizard-filtered .items .item .item-content > p:last-of-type a {
  max-width: 128px;
  max-width: 8rem;
  display: block;
  margin: 0 auto;
  padding-top: 4.8px;
  padding-top: 0.3rem;
  padding-bottom: 6.4px;
  padding-bottom: 0.4rem;
}

.shop-wizard-filtered .items .item.on {
  border-color: #e8e7e7;
  background: #f7f7f6;
  z-index: 101;
  position: relative;
}

.shop-wizard-filtered .items .item.on .item-content {
  margin: -24px;
  margin: -1.5rem;
  margin-top: 0;
  padding: 24px;
  padding: 1.5rem;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
  padding-top: 0;
  z-index: 105;
  background: #f7f7f6;
  position: relative;
}

.shop-wizard-filtered .items .item .item-drawer {
  margin-top: 0;
  border: 1px solid #e8e7e7;
  position: absolute;
  top: 0;
  bottom: auto;
  left: -1px;
  right: 0;
  display: none;
  z-index: 101;
  text-align: left;
}

.shop-wizard-filtered .buttons {
  padding-top: 24px;
  padding-top: 1.5rem;
  border-top: 1px solid #e8e7e7;
}

.shop-wizard-filtered .buttons {
  *zoom: 1;
}

.shop-wizard-filtered .buttons:before,
.shop-wizard-filtered .buttons:after {
  content: "";
  display: table;
}

.shop-wizard-filtered .buttons:after {
  clear: both;
}

.shop-wizard-filtered .buttons .button-unit {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 62em) {
  .shop-wizard-filtered .buttons .button-unit {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }
}

.shop-wizard-filtered .buttons .button a {
  display: block;
}

.shop-wizard-filtered .drawer {
  max-width: 100% !important;
  margin-top: -27.68px;
  margin-top: -1.73rem;
}

.shop-wizard-filtered .show-sidebar {
  width: 100%;
  height: 40px;
  height: 2.5rem;
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  background: #f7f7f6;
  border-bottom: 1px solid #e8e7e7;
}

@media (min-width: 48em) {
  .shop-wizard-filtered .show-sidebar {
    width: 3%;
    height: 100%;
    background: 0;
    border: 0;
    padding-top: 48px;
    padding-top: 3rem;
  }
}

.shop-wizard-filtered .show-sidebar span {
  width: 100%;
  height: 40px;
  height: 2.5rem;
  display: block;
  background-size: 16px 29px;
  background-position: center;
  display: none;
}

.shop-wizard-filtered .show-sidebar span.icon-wizard-arrow {
  background-size: 16px 29px;
  display: none;
}

@media (min-width: 48em) {
  .shop-wizard-filtered .show-sidebar span.icon-wizard-arrow {
    display: block;
  }
}

.shop-wizard-filtered .show-sidebar span.icon-caret-down-blue {
  background-size: 29px 16px;
  display: block;
}

@media (min-width: 48em) {
  .shop-wizard-filtered .show-sidebar span.icon-caret-down-blue {
    display: none;
  }
}

/***************************************/

/*  #36 - Get Help                     */

/***************************************/

.search-help .nav-hero li a:after {
  background-color: #0083c2;
}

.search-help h1 {
  color: #ffffff;
}

.search-help .search-inpage {
  border: 0;
  padding-top: 48px;
  padding-top: 3rem;
  padding-bottom: 42px;
  padding-bottom: 2.625rem;
}

.search-help .search-inpage .inpage {
  border-color: #2695cb;
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
}

.search-help .search-inpage .inpage input {
  font-size: 24px;
  font-size: 1.5rem;
  color: #ffffff;
}

.search-help .search-inpage .inpage input::-webkit-input-placeholder {
  color: #ffffff;
  opacity: 1;
}

.search-help .search-inpage .inpage input:-moz-placeholder {
  color: #ffffff;
  opacity: 1;
}

.search-help .search-inpage .inpage input::-moz-placeholder {
  color: #ffffff;
  opacity: 1;
}

.search-help .search-inpage .inpage input:-ms-input-placeholder {
  color: #ffffff;
  opacity: 1;
}

@media only screen and (min-width: 48em) {
  .search-help .search-inpage .inpage input {
    font-size: 40px;
    font-size: 2.5rem;
  }
}

@media only screen and (min-width: 62em) {
  .search-help .search-inpage .inpage input {
    font-size: 40px;
    font-size: 2.5rem;
  }
}

.search-help .search-inpage .inpage .search-btn {
  width: 48px;
  width: 3rem;
  font-size: 24px;
  font-size: 1.5rem;
  margin-top: 4px;
  margin-top: 0.25rem;
  color: #ffffff;
}

.search-help .search-inpage .inpage .search-btn:after {
  color: #ffffff;
}

@media only screen and (min-width: 48em) {
  .search-help .search-inpage .inpage .search-btn {
    font-size: 36px;
    font-size: 2.25rem;
  }
}

@media only screen and (min-width: 62em) {
  .search-help .search-inpage .inpage .search-btn {
    font-size: 36px;
    font-size: 2.25rem;
  }
}

.help-get {
  position: relative;
  padding-top: 48px;
  padding-top: 3rem;
  padding-bottom: 48px;
  padding-bottom: 3rem;
}

.help-get .heading-interactive-title {
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

.help-get h2 {
  margin: 0;
  line-height: 19.2px;
  line-height: 1.2rem;
}

.help-get h3 {
  font-size: 22px;
  font-size: 1.375rem;
  line-height: 28px;
  line-height: 1.75rem;
  margin-bottom: 0;
}

.help-get .button-unit.vertical {
  padding-top: 0;
}

.help-get .js-hidden-content {
  border: 1px solid #e8e7e7;
  background: #ffffff;
  color: #0083c2;
  padding: 16px;
  padding: 1rem;
}

.help-get .detail-builder .builder-grouping:first-child {
  border: 0;
}

.help-get .items {
  position: relative;
}

.help-get .item {
  z-index: 100;
}

.help-get .item:hover img {
  -webkit-transform: scale(1) !important;
  transform: scale(1) !important;
}

.help-get .item.on {
  z-index: 101;
  position: relative;
}

.help-get .item.on .item-content {
  margin: -24px;
  margin: -1.5rem;
  margin-top: 0;
  padding: 24px;
  padding: 1.5rem;
  padding-bottom: 80px;
  padding-bottom: 5rem;
  padding-top: 0;
  z-index: 105;
  background: #ffffff;
  position: relative;
}

.help-get .item.on .item-drawer {
  margin-top: 0;
  border: 1px solid #e8e7e7;
  position: absolute;
  top: 0;
  bottom: auto;
  left: -1px;
  right: 0;
  display: none;
  z-index: 101;
}

.help-get .item.on .item-drawer .drop > span {
  margin-top: 10.656px;
  margin-top: 0.666rem;
}

.help-question {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  width: 112%;
  padding: 16px;
  padding: 1rem;
  padding-bottom: 0;
  margin-left: -24px;
  margin-left: -1.5rem;
  margin-right: -24px;
  margin-right: -1.5rem;
  border-top: 1px solid #e8e7e7;
}

.help-question p {
  margin: 0;
}

.help-question a {
  text-decoration: none;
}

/***************************************/

/*  #36 - Help Sidebar                 */

/***************************************/

.help-sidebar {
  padding: 0;
  padding-top: 16px;
  padding-top: 1rem;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .help-sidebar {
    padding: 24px;
    padding: 1.5rem;
    padding-left: 0;
    padding-right: 0;
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media (min-width: 62em) {
  .help-sidebar {
    padding: 24px;
    padding: 1.5rem;
    padding-left: 0;
    padding-right: 0;
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

.help-sidebar p.label {
  font-family: "Telkom123-Bold", sans-serif;
  font-size: 12.8px;
  font-size: 0.8rem;
  text-transform: uppercase;
}

.help-sidebar h2 {
  border-bottom: 1px solid #e8e7e7;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  z-index: 2;
  position: relative;
}

.help-sidebar h2 a {
  background-size: 12.8px;
  background-size: 0.8rem;
  background-position: right center;
  display: block;
  text-decoration: none;
}

.help-sidebar .sidebar-drop {
  position: relative;
}

.help-sidebar .sidebar-drop ul {
  width: 100%;
  position: absolute;
  left: 0;
  top: -16px;
  top: -1rem;
  display: none;
  z-index: 1;
  border: 1px solid #e8e7e7;
  padding-top: 60px;
  padding-top: 3.75rem;
  background: #ffffff;
}

.help-sidebar .sidebar-drop ul li {
  height: auto;
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-top: 8px;
  padding-top: 0.5rem;
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
}

.help-sidebar .sidebar-drop ul li:first-child {
  padding-top: 16px;
  padding-top: 1rem;
}

.help-sidebar .sidebar-drop ul li:last-child {
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

.help-sidebar .sidebar-drop ul li:hover {
  color: #0083c2;
  display: block;
}

.help-sidebar .sidebar-drop ul a {
  display: block;
  text-decoration: none;
  color: #889391;
}

.help-sidebar .sidebar-drop ul a:hover {
  color: #0083c2;
}

.help-sidebar .sidebar-drop.open {
  margin-left: -16px;
  margin-left: -1rem;
  margin-right: -16px;
  margin-right: -1rem;
}

.help-sidebar .sidebar-drop.open h2 {
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
}

.help-sidebar .sidebar-drop.open ul {
  display: block;
}

.help-sidebar ul {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin: 0;
  padding: 0;
  list-style: none;
}

.help-sidebar ul {
  *zoom: 1;
}

.help-sidebar ul:before,
.help-sidebar ul:after {
  content: "";
  display: table;
}

.help-sidebar ul:after {
  clear: both;
}

.help-sidebar li {
  font-size: 20px;
  font-size: 1.25rem;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin: 2.5% 0;
}

.help-sidebar li span {
  min-width: 40px;
  min-width: 2.5rem;
  min-height: 16px;
  min-height: 1rem;
  margin-top: 3px;
  margin-top: 0.1875rem;
  border-radius: 32px;
  border-radius: 2rem;
  line-height: 24px;
  line-height: 1.5rem;
  font-size: 16px;
  font-size: 1rem;
  float: right;
  text-align: center;
  border: 1px solid #e8e7e7;
}

.help-sidebar label {
  padding-left: 36px;
  padding-left: 2.25rem;
  display: block;
  position: relative;
}

.help-sidebar label:hover {
  cursor: pointer;
}

.help-sidebar label div {
  display: inline-block;
  background: #f7f7f7;
  border: 1px solid #e8e7e7;
  padding: 1px;
  border-radius: 36px;
  border-radius: 2.25rem;
}

.help-sidebar label div i {
  float: left;
  text-transform: uppercase;
  font-style: normal;
  font-size: 12.8px;
  font-size: 0.8rem;
  padding-left: 12px;
  padding-left: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem;
  border-radius: 36px;
  border-radius: 2.25rem;
  line-height: 28px;
  line-height: 1.75rem;
  display: inline-block;
  color: #889391;
}

.help-sidebar label div i.no {
  color: #ffffff;
  background: #0083c2;
}

.help-sidebar input + label:before {
  width: 18px;
  width: 1.125rem;
  height: 18px;
  height: 1.125rem;
  border-radius: 18px;
  border-radius: 1.125rem;
  display: block;
  position: absolute;
  top: 3px;
  bottom: 0;
  left: 0;
  content: "";
  border: 1px solid #e8e7e7;
}

.help-sidebar input:checked + label {
  color: #0083c2;
}

.help-sidebar input:checked + label:before,
.help-sidebar input:checked + label span {
  background: #0083c2;
  color: #ffffff;
}

.help-sidebar input:checked + label div .yes {
  background: #0083c2;
  color: #ffffff;
}

.help-sidebar input:checked + label div .no {
  background: transparent;
  color: #889391;
}

.help-sidebar li input {
  display: none;
}

.help-sidebar .search-inpage {
  position: relative;
  margin-top: 24px;
  margin-top: 1.5rem;
}

.help-sidebar .search-inpage input,
.help-sidebar .search-inpage .search-btn {
  font-size: 20px;
  font-size: 1.25rem;
  color: #0083c2;
}

.help-sidebar .search-inpage input::-webkit-input-placeholder,
.help-sidebar .search-inpage .search-btn::-webkit-input-placeholder {
  color: #0083c2;
  opacity: 1;
}

.help-sidebar .search-inpage input:-moz-placeholder,
.help-sidebar .search-inpage .search-btn:-moz-placeholder {
  color: #0083c2;
  opacity: 1;
}

.help-sidebar .search-inpage input::-moz-placeholder,
.help-sidebar .search-inpage .search-btn::-moz-placeholder {
  color: #0083c2;
  opacity: 1;
}

.help-sidebar .search-inpage input:-ms-input-placeholder,
.help-sidebar .search-inpage .search-btn:-ms-input-placeholder {
  color: #0083c2;
  opacity: 1;
}

.help-sidebar .search-inpage .search-btn:after {
  color: #0083c2;
}

/***************************************/

/*  #36 - Help FAQs                    */

/***************************************/

.help-faqs {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding: 0;
  padding-top: 16px;
  padding-top: 1rem;
  margin-right: 0;
}

@media (min-width: 48em) {
  .help-faqs {
    width: 65.71429%;
    float: left;
    margin-right: 2.85714%;
    padding: 24px;
    padding: 1.5rem;
    padding-top: 128px;
    padding-top: 8rem;
    padding-left: 0;
    padding-right: 0;
    margin-right: 0;
  }
}

@media (min-width: 62em) {
  .help-faqs {
    width: 74.28571%;
    float: left;
    margin-right: 2.85714%;
    padding: 24px;
    padding: 1.5rem;
    padding-top: 128px;
    padding-top: 8rem;
    padding-left: 0;
    padding-right: 0;
    margin-right: 0;
  }
}

.faq-group {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
}

.faq-group .foundry-listing {
  padding: 0;
}

.faq-group .foundry-listing .title {
  font-size: 32px;
  font-size: 2rem;
  line-height: 34.4px;
  line-height: 2.15rem;
}

.faq-group .foundry-listing .items {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.faq-group .foundry-listing .items {
  *zoom: 1;
}

.faq-group .foundry-listing .items:before,
.faq-group .foundry-listing .items:after {
  content: "";
  display: table;
}

.faq-group .foundry-listing .items:after {
  clear: both;
}

.faq-group .foundry-listing .item {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .faq-group .foundry-listing .item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .faq-group .foundry-listing .item:nth-child(3n + 3) {
    float: right;
    margin-right: 0;
  }
}

.faq-group .foundry-listing .item h3 {
  line-height: 32px;
  line-height: 2rem;
}

.faq-group .foundry-listing .item img {
  max-width: 70%;
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  margin: 0 auto;
  display: block;
}

.faq {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding: 0;
}

.faq:last-child .faq-content {
  border: 0;
}

.faq-content {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e8e7e7;
}

.faq-content > a {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 21.5px;
  line-height: 1.34375rem;
  font-family: "Telkom123-Bold", sans-serif;
  margin: 0;
  display: block;
  padding-right: 24px;
  padding-right: 1.5rem;
  background-size: 11px;
  background-size: 0.6875rem;
  background-position: right center;
  text-decoration: none;
  color: #0083c2;
  font-family: "Telkom123-Regular", sans-serif;
}

.faq-content p:last-of-type {
  margin-bottom: 0;
}

.faq-content .faq-text > div {
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.faq-content table {
  width: 100%;
}

.faq-content table tr {
  border-bottom: 1px solid #e8e7e7;
}

.faq-content table tr:last-child {
  border: 0;
}

.faq-content table th,
.faq-content table td {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  text-align: left;
  vertical-align: middle;
}

.faq-content table th {
  width: 40%;
}

.btn-invert-blue.description-toggler {
  margin: 0;
}

.get-started {
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
}

.get-started img {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  margin: 0 auto;
  display: block;
}

.get-started .btn-invert-blue {
  padding: 0;
  margin: 0;
}

.get-started:last-child {
  float: right;
  margin-right: 0;
}

/***************************************/

/*  #36 - Help Tools                   */

/***************************************/

.help-tools {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 24px;
  margin-top: 1.5rem;
  padding-bottom: 48px;
  padding-bottom: 3rem;
}

.help-tools .items {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.help-tools .item {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding: 24px;
  padding: 1.5rem;
  min-height: 364.32px;
  min-height: 22.77rem;
}

@media (min-width: 48em) {
  .help-tools .item {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .help-tools .item:nth-child(2n) {
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .help-tools .item {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
    min-height: 364.32px;
    min-height: 22.77rem;
  }

  .help-tools .item:nth-child(2n) {
    margin-right: 2.85714%;
  }

  .help-tools .item:nth-child(4n) {
    margin-right: 0;
  }
}

.help-tools .item .item-image {
  text-align: center;
}

.help-tools .item .item-content p {
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  line-height: 20px;
  line-height: 1.25rem;
}

.help-tools .item .item-content .btn-secondary {
  border: 1px solid #e8e7e7;
}

.help-tools .item .item-content .drop a {
  margin-top: -3.2px;
  margin-top: -0.2rem;
  margin-bottom: 4.8px;
  margin-bottom: 0.3rem;
}

.help-tools .item .item-content .drop > span {
  margin-top: 10.656px;
  margin-top: 0.666rem;
}

.help-tools .item .item-drawer .drawer-title .title {
  min-height: 0;
}

.help-tools .item a[disabled] {
  background-image: url('/today/static/web/img/icons/icon-library/png/caret-right-grey.png?10eee834b848');
}

.help-tools.owl-theme .owl-controls .owl-buttons .owl-prev,
.help-tools.owl-theme .owl-controls .owl-buttons .owl-next {
  top: -3% !important;
  bottom: -3% !important;
  margin-top: auto !important;
  margin-bottom: auto !important;
}

.help-tools:after {
  content: "";
  display: block;
  clear: both;
}

.help-tools .ghost {
  position: relative;
}

.help-tools .ghost:after {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1000;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  content: "";
  display: block;
}

/***************************************/

/*  #36 - Help Guides                  */

/***************************************/

.help-guides {
  padding: 24px;
  padding: 1.5rem;
  border-top: 1px solid #e8e7e7;
}

.help-guides h2 {
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  line-height: 28px;
  line-height: 1.75rem;
}

.help-guides .field {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  border-bottom: 1px solid #e8e7e7 !important;
}

@media only screen and (min-width: 48em) {
  .help-guides .field {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media only screen and (min-width: 62em) {
  .help-guides .field {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

.help-guides .field li a {
  color: #889391;
}

.help-guides .help-pdfs {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-bottom: 36px;
  padding-bottom: 2.25rem;
  padding-right: 0;
}

@media only screen and (min-width: 48em) {
  .help-guides .help-pdfs {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    padding-right: 24px;
    padding-right: 1.5rem;
  }
}

@media only screen and (min-width: 62em) {
  .help-guides .help-pdfs {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    padding-right: 24px;
    padding-right: 1.5rem;
  }
}

.help-guides .help-pdfs h2 {
  margin-top: 24px;
  margin-top: 1.5rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  color: #0083c2;
}

.help-guides .help-pdfs .pdf {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin: 0;
  margin-top: 16px;
  margin-top: 1rem;
  line-height: 21.6px;
  line-height: 1.35rem;
}

.help-guides .help-pdfs .pdf .btn-secondary {
  display: block;
  float: none;
  margin: 0;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  border: 1px solid #e8e7e7;
}

@media only screen and (min-width: 48em) {
  .help-guides .help-pdfs .pdf .btn-secondary {
    display: inline-block;
    float: right;
    margin-left: 16px;
    margin-left: 1rem;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 62em) {
  .help-guides .help-pdfs .pdf .btn-secondary {
    display: inline-block;
    float: right;
    margin-left: 16px;
    margin-left: 1rem;
    margin-bottom: 0;
  }
}

.help-guides .help-pdfs.full {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media only screen and (min-width: 48em) {
  .help-guides .help-pdfs.full {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

@media only screen and (min-width: 62em) {
  .help-guides .help-pdfs.full {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.help-guides .help-pdfs.full .pdf {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media only screen and (min-width: 48em) {
  .help-guides .help-pdfs.full .pdf {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media only screen and (min-width: 62em) {
  .help-guides .help-pdfs.full .pdf {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }
}

.help-guides .help-pdfs.full .pdf:nth-of-type(2n) {
  margin-right: 0;
}

.help-guides .help-videos {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 0;
  padding-bottom: 36px;
  padding-bottom: 2.25rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  padding-left: 0;
  margin-right: 0;
}

.help-guides .help-videos h2 {
  margin-top: 24px;
  margin-top: 1.5rem;
  color: #0083c2;
}

@media only screen and (min-width: 48em) {
  .help-guides .help-videos {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    padding-top: 36px;
    padding-top: 2.25rem;
    padding-left: 24px;
    padding-left: 1.5rem;
    margin-right: 0;
  }
}

.help-guides .help-videos .video {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin: 0;
  margin-top: 16px;
  margin-top: 1rem;
}

.help-guides .help-videos .video img {
  float: left;
  margin-right: 24px;
  margin-right: 1.5rem;
}

.help-guides .help-videos .video p {
  margin-top: 0;
  margin-bottom: 6px;
  margin-bottom: 0.375rem;
  line-height: 18.4px;
  line-height: 1.15rem;
}

.help-guides .help-videos .video .btn-secondary {
  margin: 0;
}

.help-guides:after {
  content: "";
  display: block;
  clear: both;
}

/***************************************/

/*  #36 - Help WiFi                  */

/***************************************/

.help-wifi-slider {
  padding: 24px;
  padding: 1.5rem;
  border-top: 1px solid #e8e7e7;
  overflow: hidden;
}

.help-wifi-slider .slide {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  display: none;
  position: relative;
  display: table;
}

@media (min-width: 48em) {
  .help-wifi-slider .slide {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }
}

.help-wifi-slider .slide img {
  display: block;
  max-width: 100%;
}

.help-wifi-slider .slide .slide > a span {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}

.help-wifi-slider .slide .prev {
  width: 14.28571%;
  float: left;
  margin-right: 2.85714%;
  display: table-cell;
  float: none;
  background: url('/today/static/web/img/owl-prev.png?bafd7223c44e') left center no-repeat;
  opacity: 0.5;
}

.help-wifi-slider .slide .prev span {
  left: 0;
}

.help-wifi-slider .slide .next {
  width: 14.28571%;
  float: left;
  margin-right: 2.85714%;
  float: right;
  margin-right: 0;
  display: table-cell;
  float: none;
  background: url('/today/static/web/img/owl-next.png?7fec08b7980a') right center no-repeat;
  opacity: 0.5;
}

.help-wifi-slider .slide .next span {
  right: 0;
}

.help-wifi-slider .slide .prev:hover,
.help-wifi-slider .slide .next:hover {
  opacity: 1;
}

.help-wifi-slider .slide .track {
  width: 65.71429%;
  float: left;
  margin-right: 2.85714%;
  text-align: center;
  overflow: hidden;
  display: table-cell;
  float: none;
}

.help-wifi-slider .slide .track div {
  width: 100%;
  float: left;
  display: none;
}

.help-wifi-slider .slide .track div:first-child {
  display: block;
}

.help-wifi-slider .steps {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .help-wifi-slider .steps {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

.help-wifi-slider .steps ul {
  list-style: none;
  margin: 0;
  padding: 0;
  padding-top: 6%;
}

.help-wifi-slider .steps ul li {
  margin-bottom: 16px;
  margin-bottom: 1rem;
  line-height: 28.432px;
  line-height: 1.777rem;
}

.help-wifi-slider .steps ul li span {
  width: 28.432px;
  width: 1.777rem;
  margin-right: 16px;
  margin-right: 1rem;
  float: left;
  border-radius: 16px;
  border-radius: 1rem;
  text-align: center;
  border: 1px solid #e8e7e7;
}

.help-wifi-slider .steps ul li.on {
  font-family: "Telkom123-Bold", sans-serif;
}

.help-wifi-slider .steps ul li.on span {
  background: #0083c2;
  border-color: #0083c2;
  color: #ffffff;
}

.help-wifi-slider .steps .on {
  color: #0083c2;
}

.help-wifi-slider:after {
  content: "";
  display: block;
  clear: both;
}

/***************************************/

/*  #36 - Help - Talk To Us            */

/***************************************/

.help-talk {
  padding-top: 48px;
  padding-top: 3rem;
}

@media (min-width: 62em) {
  .help-talk {
    background-image: url('/today/static/web/img/help/talk-people.png?b0b0e394bbe1');
    background-repeat: no-repeat;
    background-position: 93% bottom;
    background-size: 416px;
    background-size: 26rem;
  }
}

.help-talk h2 {
  margin-top: 0;
}

.help-talk .items {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
  display: table;
}

@media (min-width: 62em) {
  .help-talk .items {
    width: 65.71429%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media (min-width: 75em) {
  .help-talk .items {
    width: 82.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

.help-talk .item {
  width: 48.57143%;
  float: left;
  padding: 24px;
  padding: 1.5rem;
  padding-right: 0;
  display: table-cell;
  color: #0083c2;
  text-decoration: none;
  text-align: center;
  vertical-align: middle;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-property: color, -webkit-transform;
  transition-property: color, -webkit-transform;
  transition-property: color, transform;
  transition-property: color, transform, -webkit-transform;
}

@media (min-width: 75em) {
  .help-talk .item {
    width: 18.57143%;
    float: left;
  }
}

.help-talk .item .interactive-icon {
  height: 121.5px;
  height: 7.59375rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
}

.help-talk .item .interactive-icon,
.help-talk .item .interactive-icon * {
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: opacity, transform;
  transition-property: opacity, transform, -webkit-transform;
}

.help-talk .item:hover,
.help-talk .item.active {
  color: #0083c2;
}

.help-talk .item:hover .interactive-icon,
.help-talk .item.active .interactive-icon {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.help-talk .item:hover .interactive-icon .default,
.help-talk .item.active .interactive-icon .default {
  opacity: 1;
}

.help-talk .item:hover .interactive-icon .active,
.help-talk .item.active .interactive-icon .active {
  opacity: 1;
}

.help-talk:after {
  content: "";
  display: block;
  clear: both;
}

/******************************/

/* roaming-form */

/******************************/

.roaming-builder {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-right: 0;
}

.roaming-builder {
  *zoom: 1;
}

.roaming-builder:before,
.roaming-builder:after {
  content: "";
  display: table;
}

.roaming-builder:after {
  clear: both;
}

.roaming-builder h3 {
  color: #889391;
}

.roaming-builder h3:first-of-type {
  margin-bottom: 0;
}

.roaming-builder .center-buttons {
  padding-top: 24px;
  padding-top: 1.5rem;
  text-align: center;
}

.roaming-builder .roaming-form {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.roaming-builder .roaming-form {
  *zoom: 1;
}

.roaming-builder .roaming-form:before,
.roaming-builder .roaming-form:after {
  content: "";
  display: table;
}

.roaming-builder .roaming-form:after {
  clear: both;
}

.roaming-builder .form-group {
  width: 100%;
  float: none;
  margin: 0 auto;
}

@media (min-width: 48em) {
  .roaming-builder .form-group {
    width: 48.57143%;
    padding-top: 0;
    float: none;
  }
}

@media (min-width: 48em) and (max-width: 75em) {
  .roaming-builder .form-group:nth-of-type(2n+2) {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .roaming-builder .form-group {
    width: 48.57143%;
    padding-top: 0;
    float: none;
  }
}

.roaming-builder .field > label,
.roaming-builder .field > .label {
  white-space: normal;
}

@media (min-width: 48em) {
  .roaming-builder .field > label,
  .roaming-builder .field > .label {
    width: 20%;
  }
}

.roaming-builder label + .SumoSelect .options li {
  padding-left: 22%;
}

.page-help-roaming .title-center {
  margin-top: 32px;
  margin-top: 2rem;
  text-align: center;
  color: #0083c2;
}

.page-help-roaming .nav-hero a {
  display: inline-block;
}

.page-help-roaming .instruction-message {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

@media (min-width: 48em) {
  .page-help-roaming .instruction-message {
    width: 48.57143%;
  }
}

.page-help-roaming .activation-title,
.page-help-roaming .activation-desc {
  width: 100%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 48em) {
  .page-help-roaming .activation-title,
  .page-help-roaming .activation-desc {
    width: 48.57143%;
  }
}

.page-help-roaming .subtitle-small {
  text-align: center;
  color: #ffffff;
}

.page-help-roaming .subtitle-small br {
  display: none;
}

@media (min-width: 48em) {
  .page-help-roaming .subtitle-small br {
    display: block;
  }
}

.page-help-roaming .search-inpage .inpage input {
  font-size: 32px;
  font-size: 2rem;
}

.page-help-roaming .search-inpage .autocomplete-suggestions {
  width: 54% !important;
}

.page-help-roaming .search-inpage .autocomplete-suggestions .autocomplete-suggestion:hover {
  background-color: #00d0ff;
}

.page-help-roaming .search-btn {
  width: 56px;
  width: 3.5rem;
  height: 32px;
  height: 2rem;
  margin-top: 8px;
  margin-top: 0.5rem;
}

.page-help-roaming .notification {
  text-align: center;
  color: #A2AAAD;
}

.page-help-roaming .notification.hidden {
  display: none;
}

/******************************/

/* roaming-faqs */

/******************************/

.international-roaming-faqs-terms .pill-group-centered-transparent-grey-bordered {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.international-roaming-faqs-terms a[class*="pill-"] {
  font-size: 1rem;
  font-family: "Telkom123-Light", sans-serif;
  line-height: 1.25rem;
}

.international-roaming-faqs-terms .content .term-block {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .international-roaming-faqs-terms .content .term-block {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .international-roaming-faqs-terms .content .term-block.last {
    float: right;
    margin-right: 0;
  }
}

/******************************/

/* roaming-faqs */

/******************************/

.international-roaming-setup .title-setup,
.international-roaming-setup .desc-setup,
.international-roaming-setup .title-download {
  text-align: center;
  color: #ffffff;
}

.international-roaming-setup a,
.international-roaming-setup a:hover {
  color: inherit;
}

.international-roaming-setup .desc-download {
  text-align: center;
  color: #A2AAAD;
}

.international-roaming-setup .stepbar.with-icons {
  margin: 0 -5%;
}

@media (max-width: 48em) {
  .international-roaming-setup .stepbar.with-icons {
    margin: 0 auto;
  }
}

.international-roaming-setup .stepbar.with-icons > li:before {
  width: 32px;
  width: 2rem;
  height: 32px;
  height: 2rem;
  font-size: 16px;
  font-size: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  padding: 0px;
  padding: 0rem;
  text-align: center;
  line-height: 1.75;
}

.international-roaming-setup .stepbar.with-icons > li:after {
  height: 4px;
  height: 0.25rem;
  margin-left: 2.66667px;
  margin-left: 0.16667rem;
  top: 14.8px;
  top: 0.925rem;
}

.international-roaming-setup .stepbar.with-icons > li.is-complete {
  color: #ffffff;
}

.international-roaming-setup .stepbar.with-icons p strong {
  font-size: 14px;
}

.international-roaming-setup .pill-group-centered-transparent-white-bordered {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.international-roaming-setup [class*="pill-group"] a[class*="icon-roaming"] {
  width: 56px;
  width: 3.5rem;
  height: 33.6px;
  height: 2.1rem;
  background-size: 56px;
  background-size: 3.5rem;
  background-repeat: no-repeat;
  background-position: center;
}

.international-roaming-setup [class*="pill-group"] {
  display: table;
  border-radius: 32px;
  border-radius: 2rem;
}

.international-roaming-setup .icon-roaming-apple-white.active {
  background-image: url('/today/static/web/img/icons/icon-library/png/roaming-apple.png?5d445f73c95d');
}

.international-roaming-setup .icon-roaming-android-white.active {
  background-image: url('/today/static/web/img/icons/icon-library/png/roaming-android.png?27b7380747b7');
}

.international-roaming-setup .icon-roaming-blackberry-white.active {
  background-image: url('/today/static/web/img/icons/icon-library/png/roaming-blackberry.png?bcd23a3a68f1');
}

.international-roaming-setup .icon-roaming-windows-white.active {
  background-image: url('/today/static/web/img/icons/icon-library/png/roaming-windows.png?8c789f632fd2');
}

.international-roaming-setup .content .term-block {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .international-roaming-setup .content .term-block {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .international-roaming-setup .content .term-block.last {
    float: right;
    margin-right: 0;
  }
}

.international-roaming-setup .sim-toolkit .no-sim-toolkit-desc {
  display: block;
}

.international-roaming-setup .sim-toolkit .sim-toolkit-guide-panel {
  display: none;
}

.international-roaming-setup .sim-toolkit.active .sim-toolkit-guide-panel {
  display: block;
}

.international-roaming-setup .sim-toolkit.active .no-sim-toolkit-desc {
  display: none;
}

/******************************/

/*  #37 - Search Results      */

/******************************/

.search-results {
  padding-bottom: 60px;
  padding-bottom: 3.75rem;
}

.search-results .search-result:first-of-type {
  border: 0;
}

/***************************************/

/*  #38 - Chat with an Agent          */

/***************************************/

.chat-cta {
  display: none;
  z-index: 10000;
  position: fixed;
  bottom: 5%;
  left: 5%;
}

.chat-cta .chat-avatar {
  width: 70px;
  width: 4.375rem;
  height: 76px;
  height: 4.75rem;
  background-size: cover;
  float: left;
}

@media (min-width: 48em) {
  .chat-cta .chat-avatar {
    height: 60px;
    height: 3.75rem;
  }
}

@media (min-width: 62em) {
  .chat-cta .chat-avatar {
    height: 60px;
    height: 3.75rem;
  }
}

.chat-cta .chat-tooltip {
  padding: 16px;
  padding: 1rem;
  padding-right: 48px;
  padding-right: 3rem;
  margin-top: 3.2px;
  margin-top: 0.2rem;
  margin-left: 96px;
  margin-left: 6rem;
  background: #005e9b;
  color: #ffffff;
  position: relative;
  max-width: 70%;
  cursor: pointer;
}

@media (min-width: 48em) {
  .chat-cta .chat-tooltip {
    margin-left: 16px;
    margin-left: 1rem;
    float: left;
    max-width: 100%;
  }
}

@media (min-width: 62em) {
  .chat-cta .chat-tooltip {
    margin-left: 16px;
    margin-left: 1rem;
    float: left;
    max-width: 100%;
  }
}

.chat-cta .chat-tooltip p {
  margin: 0;
  line-height: 22px;
  line-height: 1.375rem;
}

.chat-cta .chat-tooltip p strong {
  line-height: 22px;
  line-height: 1.375rem;
}

.chat-cta .chat-tooltip .close {
  width: 16px;
  width: 1rem;
  height: 16px;
  height: 1rem;
  background: url('/today/static/web/img/chat-close.png?fbb734c04faf') center no-repeat;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 16px;
  right: 1rem;
  margin: auto;
}

.chat-cta .chat-tooltip:after {
  width: 16px;
  width: 1rem;
  height: 16px;
  height: 1rem;
  background: #005e9b;
  content: "";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  left: -8px;
  left: -0.5rem;
}

.move-left {
  left: -120%;
}

.chat-content {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: none;
  margin: 0 auto;
  padding-top: 16px;
  padding-top: 1rem;
  background-size: 13%;
  background-position-x: center;
  background-position-y: top;
  min-height: 125px;
}

@media (min-width: 48em) {
  .chat-content {
    width: 65.71429%;
    float: left;
    margin-right: 2.85714%;
    float: none;
    margin: 0 auto;
    padding-top: 0;
  }
}

.chat-content .icon-nav-close {
  width: 16px;
  width: 1rem;
  height: 16px;
  height: 1rem;
  background-size: cover;
  position: absolute;
  top: 16px;
  top: 1rem;
  right: 16px;
  right: 1rem;
  margin: auto;
}

.chat-content > .icon-close {
  position: absolute;
  background-size: contain;
  background-position: 50%;
  width: 24px;
  width: 1.5rem;
  height: 24px;
  height: 1.5rem;
  right: 36px;
  right: 2.25rem;
  top: 36px;
  top: 2.25rem;
}

.chat-content .call-category {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  position: relative;
}

@media (min-width: 48em) {
  .chat-content .call-category {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    float: none;
    margin: 0 auto;
  }
}

.chat-content .call-group {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  text-align: center;
}

.chat-content .call-group > div {
  display: none;
}

.chat-content .call-group > div:first-child {
  display: block;
}

.chat-content .huge {
  border: 0;
  text-align: center;
}

.chat-content .huge .SelectBox {
  width: auto;
  margin: 0 auto;
  display: inline-block;
}

.chat-content .huge .SelectBox span {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
}

.chat-content .huge .SelectBox i {
  background-size: 16px;
  background-size: 1rem;
}

.chat-content .huge .optWrapper {
  text-align: left;
  padding-top: 51.2px;
  padding-top: 3.2rem;
}

.chat-content .hotlines {
  text-align: center;
}

.chat-content .number[href*="tel"] {
  color: #ffffff;
  font-family: "Telkom123-Bold", sans-serif;
  display: inline-block;
  text-decoration: none;
  font-size: 80px;
  font-size: 5rem;
  padding-left: 32px;
  padding-left: 2rem;
  padding-right: 32px;
  padding-right: 2rem;
  margin-top: 24px;
  margin-top: 1.5rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  margin-left: auto;
  margin-right: auto;
  line-height: 1;
}

.chat-content .number[href*="tel"] small {
  display: block;
  font-size: 16px;
  font-size: 1rem;
  line-height: 24px;
  line-height: 1.5rem;
  font-family: "Telkom123-Regular", sans-serif;
  text-align: center;
}

.chat-content .free {
  color: #2695cb;
  margin: 0;
}

.js .chat-form {
  display: none;
}

.chat-form {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 54px;
  padding-top: 3.375rem;
  padding-bottom: 54px;
  padding-bottom: 3.375rem;
  position: relative;
  background: #005e9b;
  margin-right: 0;
  width: 111.52%;
  padding-left: 5%;
  padding-right: 5%;
  margin-left: -6%;
  margin-right: -6%;
}

.chat-form h2 {
  margin-top: 0;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  color: #ffffff;
  text-align: center;
}

.chat-form h2 small {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 25.8px;
  line-height: 1.6125rem;
  margin: 0;
  color: inherit;
}

.chat-form label {
  color: #ffffff;
}

.chat-form .label {
  color: #ffffff;
  white-space: inherit;
}

.chat-form input[type="text"],
.chat-form input[type="password"],
.chat-form input[type="email"],
.chat-form input[type="number"],
.chat-form input[type="tel"] {
  color: #ffffff;
}

.chat-form input[type="text"]:active,
.chat-form input[type="password"]:active,
.chat-form input[type="email"]:active,
.chat-form input[type="number"]:active,
.chat-form input[type="tel"]:active {
  color: #ffffff;
}

.chat-form input[type="text"]:focus,
.chat-form input[type="password"]:focus,
.chat-form input[type="email"]:focus,
.chat-form input[type="number"]:focus,
.chat-form input[type="tel"]:focus {
  color: #ffffff;
}

.chat-form input[type="text"]::-webkit-input-placeholder,
.chat-form input[type="password"]::-webkit-input-placeholder,
.chat-form input[type="email"]::-webkit-input-placeholder,
.chat-form input[type="number"]::-webkit-input-placeholder,
.chat-form input[type="tel"]::-webkit-input-placeholder {
  color: #2695cb;
}

.chat-form input[type="text"]:-moz-placeholder,
.chat-form input[type="password"]:-moz-placeholder,
.chat-form input[type="email"]:-moz-placeholder,
.chat-form input[type="number"]:-moz-placeholder,
.chat-form input[type="tel"]:-moz-placeholder {
  color: #2695cb;
}

.chat-form input[type="text"]::-moz-placeholder,
.chat-form input[type="password"]::-moz-placeholder,
.chat-form input[type="email"]::-moz-placeholder,
.chat-form input[type="number"]::-moz-placeholder,
.chat-form input[type="tel"]::-moz-placeholder {
  color: #2695cb;
}

.chat-form input[type="text"]:-ms-input-placeholder,
.chat-form input[type="password"]:-ms-input-placeholder,
.chat-form input[type="email"]:-ms-input-placeholder,
.chat-form input[type="number"]:-ms-input-placeholder,
.chat-form input[type="tel"]:-ms-input-placeholder {
  color: #2695cb;
}

.chat-form .field {
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.chat-form .field p.SelectBox {
  border-bottom: 1px solid #ffffff !important;
}

.chat-form .field ul.dropdown li {
  background: #005e9b;
  color: #ffffff;
}

.chat-form .field ul.dropdown li:hover {
  color: #2695cb;
}

.chat-form .date {
  color: #00d0ff;
  padding-right: 16px;
  padding-right: 1rem;
}

.chat-form .person {
  font-family: "Telkom123-Bold", sans-serif;
}

.chat-form .form-row {
  color: #ffffff;
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.chat-form .form-row .field {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 16px;
  margin-top: 1rem;
}

@media (min-width: 48em) {
  .chat-form .form-row .field {
    width: 74.28571%;
    float: left;
    margin-right: 2.85714%;
  }
}

.chat-form .form-row .field input {
  padding-left: 0;
  padding-top: 0;
  margin: 0;
}

.chat-form .form-row:after {
  content: "";
  clear: both;
  display: block;
}

.chat-form .form-group {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .chat-form .form-group {
    width: 44.28571%;
    float: left;
    margin-right: 2.85714%;
  }

  .chat-form .form-group:nth-of-type(2n) {
    float: right;
    margin-right: 0;
  }
}

.chat-form .form-group.full {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.chat-form .form-group.full .label {
  width: 30%;
}

@media (min-width: 48em) {
  .chat-form .form-group.full .label {
    width: 14%;
  }
}

.chat-form .form-group .required .errorlist {
  display: block;
  padding: 2px 0;
  margin-bottom: -21px;
}

.chat-form .form-group .button-unit {
  padding-top: 8px;
  padding-top: 0.5rem;
}

.chat-form .form-group .button-unit .btn-primary,
.chat-form .form-group .button-unit .btn-pink {
  display: block;
}

.chat-form .form-group .button-unit button {
  width: 100%;
  display: block;
}

@media (min-width: 75em) {
  .chat-form .form-group .button-unit.ask {
    padding-top: 57.6px;
    padding-top: 3.6rem;
  }
}

.chat-form .buttons {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 16px;
  margin-top: 1rem;
}

@media (min-width: 48em) {
  .chat-form .buttons {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    float: none;
    margin: 0 auto;
  }
}

.chat-form .buttons .btn-primary,
.chat-form .buttons .btn-pink {
  width: 100%;
  margin: 0;
  display: block;
}

.chat-form .notice {
  margin-top: 32px;
  margin-top: 2rem;
  padding: 24px;
  padding: 1.5rem;
  padding-left: 5%;
  padding-right: 5%;
  background: #da1b60;
  color: #ffffff;
  font-family: "Telkom123-Bold", sans-serif;
  display: none;
}

.chat-form:after {
  content: "";
  clear: both;
  display: block;
}

.call-back-explore .buttons {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  text-align: left;
}

.no-js #coverage {
  display: none;
}

.js .standalone-chat-form {
  display: block;
}

.standalone-chat-form .icon-close {
  display: none;
}

/***************************************/

/*  #36 - Content Toggler              */

/***************************************/

.content-toggler {
  margin: 1rem 2rem;
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  margin-left: 32px;
  margin-left: 2rem;
  margin-right: 32px;
  margin-right: 2rem;
}

.content-toggler .btn {
  display: block;
}

@media (min-width: 48em) {
  .content-toggler .btn {
    display: inline-block;
  }
}

@media (min-width: 48em) {
  .content-toggler .btn-group .btn {
    margin-top: 4px;
    margin-top: 0.25rem;
  }
}

.content-toggler .content-toggler-selector {
  padding: 0;
  padding-top: 16px;
  padding-top: 1rem;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .content-toggler .content-toggler-selector {
    padding: 24px;
    padding: 1.5rem;
    padding-left: 0;
    padding-right: 0;
  }
}

@media (min-width: 62em) {
  .content-toggler .content-toggler-selector {
    padding: 24px;
    padding: 1.5rem;
    padding-left: 0;
    padding-right: 0;
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

.content-toggler .content-toggler-selector p.label {
  font-family: "Telkom123-Bold", sans-serif;
  font-size: 12.8px;
  font-size: 0.8rem;
  text-transform: uppercase;
}

.content-toggler .content-toggler-selector h2 {
  border-bottom: 1px solid #e8e7e7;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  z-index: 2;
  position: relative;
}

.content-toggler .content-toggler-selector h2 a {
  background-size: 12.8px;
  background-size: 0.8rem;
  background-position: right center;
  display: block;
  text-decoration: none;
}

.content-toggler .content-toggler-selector ul {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin: 0;
  padding: 0;
  list-style: none;
}

.content-toggler .content-toggler-selector ul {
  *zoom: 1;
}

.content-toggler .content-toggler-selector ul:before,
.content-toggler .content-toggler-selector ul:after {
  content: "";
  display: table;
}

.content-toggler .content-toggler-selector ul:after {
  clear: both;
}

.content-toggler .content-toggler-selector li {
  font-size: 20px;
  font-size: 1.25rem;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin: 2.5% 0;
}

.content-toggler .content-toggler-selector li .content-toggler-icon {
  min-width: 40px;
  min-width: 2.5rem;
  min-height: 16px;
  min-height: 1rem;
  margin-top: 3px;
  margin-top: 0.1875rem;
  border-radius: 32px;
  border-radius: 2rem;
  line-height: 24px;
  line-height: 1.5rem;
  font-size: 16px;
  font-size: 1rem;
  float: right;
  text-align: center;
  display: none;
}

.content-toggler .content-toggler-selector label {
  padding-left: 36px;
  padding-left: 2.25rem;
  display: block;
  position: relative;
}

.content-toggler .content-toggler-selector label:hover {
  cursor: pointer;
}

.content-toggler .content-toggler-selector label div {
  display: inline-block;
  background: #f7f7f7;
  border: 1px solid #e8e7e7;
  padding: 1px;
  border-radius: 36px;
  border-radius: 2.25rem;
}

.content-toggler .content-toggler-selector label div i {
  float: left;
  text-transform: uppercase;
  font-style: normal;
  font-size: 12.8px;
  font-size: 0.8rem;
  padding-left: 12px;
  padding-left: 0.75rem;
  padding-right: 12px;
  padding-right: 0.75rem;
  border-radius: 36px;
  border-radius: 2.25rem;
  line-height: 28px;
  line-height: 1.75rem;
  display: inline-block;
  color: #889391;
}

.content-toggler .content-toggler-selector label div i.no {
  color: #ffffff;
  background: #0083c2;
}

.content-toggler .content-toggler-selector input + label:before {
  width: 18px;
  width: 1.125rem;
  height: 18px;
  height: 1.125rem;
  border-radius: 18px;
  border-radius: 1.125rem;
  display: block;
  position: absolute;
  top: 3px;
  bottom: 0;
  left: 0;
  content: "";
  border: 1px solid #e8e7e7;
}

.content-toggler .content-toggler-selector input:checked + label {
  color: #0083c2;
}

.content-toggler .content-toggler-selector input:checked + label:before,
.content-toggler .content-toggler-selector input:checked + label span {
  background: #0083c2;
  color: #ffffff;
}

.content-toggler .content-toggler-selector input:checked + label .content-toggler-icon {
  display: inline-block;
  background: url('/today/static/web/img/icons/icon-library/png/wizard-arrow.png?ba6bd827d8ac');
  background-size: auto 100%;
  border: 0;
  width: 22.4px;
  width: 1.4rem;
  height: 20.8px;
  height: 1.3rem;
  background-repeat: no-repeat;
}

.content-toggler .content-toggler-selector input:checked + label div .yes {
  background: #0083c2;
  color: #ffffff;
}

.content-toggler .content-toggler-selector input:checked + label div .no {
  background: transparent;
  color: #889391;
}

.content-toggler .content-toggler-selector li input {
  display: none;
}

.content-toggler .content-toggler-content {
  width: 65.71429%;
  float: left;
  margin-right: 2.85714%;
  display: inline-block;
}

@media (max-width: 62em) {
  .content-toggler .content-toggler-content {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.content-toggler .content-toggler-content .content-toggler-section {
  display: none;
}

.content-toggler .content-toggler-content .content-toggler-section.active {
  display: block;
}

/* @mixin box-sizing($box) {
  @include prefixer(box-sizing, $box, webkit moz spec);

  @warn "The box-sizing mixin is deprecated and will be removed in the next major version release. This property can now be used un-prefixed.";
} */

/******************************/

/*  #21 - Hero */

/******************************/

/*** Hero Variables ***
    ============================================== */

/* ============================================ / Hero Variables */

/*** Hero Structure ***
    ============================================== */

.foundry-listing-promo {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.hero-new {
  width: 100%;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  overflow: hidden;
  position: relative;
  background-color: #006fad;
  color: #ffffff;
  /*** Lines ========================= */
  /* ========================= /Lines */
  /*** Line Position ========================= */
  /* ========================= /Line Position */
  /*** Shop Dropdown ========================= */
  /* ========================= /Shop Dropdown */
  /*** Promo Block ========================= */
  /* ========================= /Promo Block */
}

.hero-new .wrapper {
  position: relative;
}

.hero-new .foreground {
  padding: 20px;
  padding: 1.25rem;
  position: relative;
  z-index: 5;
  pointer-events: none;
}

@media (min-width: 48em) {
  .hero-new .foreground {
    padding: 40px;
    padding: 2.5rem;
  }
}

@media (min-width: 75em) {
  .hero-new .foreground {
    padding-left: 160px;
    padding-left: 10rem;
    padding-right: 160px;
    padding-right: 10rem;
  }
}

.hero-new [class*="line-x"],
.hero-new [class*="line-y"] {
  position: absolute;
  background-color: #ffffff;
}

.hero-new [class*="line-x"] {
  height: 4px;
}

.hero-new [class*="line-x"][class*="-outer"] {
  width: 5000px;
}

.hero-new [class*="line-y"] {
  width: 4px;
}

.hero-new [class*="line-y"][class*="-outer"] {
  height: 5000px;
}

.hero-new [class*="lines-"] {
  position: absolute;
  /* @include rem-fallback(top, -($hero-border-width));
                 @include rem-fallback(right, -($hero-border-width));
                 @include rem-fallback(bottom, -($hero-border-width));
                 @include rem-fallback(left, -($hero-border-width)); */
  top: -4px;
  right: -4px;
  bottom: -4px;
  left: -4px;
}

.hero-new [class*="lines-"][class*="-top-"][class*="-right"] {
  /* @include rem-fallback(border-left-width, $hero-border-notch-width);
                         @include rem-fallback(border-bottom-width, $hero-border-notch-width); */
  border-left-width: 12px;
  border-bottom-width: 12px;
}

.hero-new [class*="lines-"][class*="-top-"][class*="-right"] [class*="line-x"] {
  top: 0;
}

.hero-new [class*="lines-"][class*="-top-"][class*="-right"] [class*="line-x"][class*="-inner"] {
  left: 0;
  width: calc(100% - 28px);
}

.hero-new [class*="lines-"][class*="-top-"][class*="-right"] [class*="line-x"][class*="-outer"] {
  right: 0;
}

.hero-new [class*="lines-"][class*="-top-"][class*="-right"] [class*="line-y"] {
  bottom: 0;
}

.hero-new [class*="lines-"][class*="-top-"][class*="-right"] [class*="line-y"][class*="-inner"] {
  right: 0;
  height: calc(100% - 28px);
}

.hero-new [class*="lines-"][class*="-top-"][class*="-right"] [class*="line-y"][class*="-outer"] {
  right: 0;
  top: 0;
}

.no-csstransforms .hero-new [class*="lines-"][class*="-top-"][class*="-right"] .line-x-outer {
  left: 4984px;
}

.no-csstransforms .hero-new [class*="lines-"][class*="-top-"][class*="-right"] .line-y-outer {
  top: -4984px;
}

.csstransforms .hero-new [class*="lines-"][class*="-top-"][class*="-right"] .line-x-outer {
  -webkit-transform: translateX(4984px);
  transform: translateX(4984px);
}

.csstransforms .hero-new [class*="lines-"][class*="-top-"][class*="-right"] .line-y-outer {
  -webkit-transform: translateY(-4984px);
  transform: translateY(-4984px);
}

.csstransforms3d .hero-new [class*="lines-"][class*="-top-"][class*="-right"] .line-x-outer {
  -webkit-transform: translate3d(4984px, 0, 0);
  transform: translate3d(4984px, 0, 0);
}

.csstransforms3d .hero-new [class*="lines-"][class*="-top-"][class*="-right"] .line-y-outer {
  -webkit-transform: translate3d(0, -4984px, 0);
  transform: translate3d(0, -4984px, 0);
}

.hero-new [class*="lines-"][class*="-top-"][class*="-left"] [class*="line-x"] {
  top: 0;
}

.hero-new [class*="lines-"][class*="-top-"][class*="-left"] [class*="line-x"][class*="-inner"] {
  right: 0;
  width: calc(100% - 28px);
}

.hero-new [class*="lines-"][class*="-top-"][class*="-left"] [class*="line-x"][class*="-outer"] {
  left: 0;
}

.hero-new [class*="lines-"][class*="-top-"][class*="-left"] [class*="line-y"] {
  bottom: 0;
}

.hero-new [class*="lines-"][class*="-top-"][class*="-left"] [class*="line-y"][class*="-inner"] {
  left: 0;
  height: calc(100% - 28px);
}

.hero-new [class*="lines-"][class*="-top-"][class*="-left"] [class*="line-y"][class*="-outer"] {
  top: 0;
}

.no-csstransforms .hero-new [class*="lines-"][class*="-top-"][class*="-left"] .line-x-outer {
  left: -4984px;
}

.no-csstransforms .hero-new [class*="lines-"][class*="-top-"][class*="-left"] .line-y-outer {
  top: -4984px;
}

.csstransforms .hero-new [class*="lines-"][class*="-top-"][class*="-left"] .line-x-outer {
  -webkit-transform: translateX(-4984px);
  transform: translateX(-4984px);
}

.csstransforms .hero-new [class*="lines-"][class*="-top-"][class*="-left"] .line-y-outer {
  -webkit-transform: translateY(-4984px);
  transform: translateY(-4984px);
}

.csstransforms3d .hero-new [class*="lines-"][class*="-top-"][class*="-left"] .line-x-outer {
  -webkit-transform: translate3d(-4984px, 0, 0);
  transform: translate3d(-4984px, 0, 0);
}

.csstransforms3d .hero-new [class*="lines-"][class*="-top-"][class*="-left"] .line-y-outer {
  -webkit-transform: translate3d(0, -4984px, 0);
  transform: translate3d(0, -4984px, 0);
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] {
  right: -4px;
  /* @include rem-fallback(border-left-width, $hero-border-notch-width);
                         @include rem-fallback(border-top-width, $hero-border-notch-width); */
  border-left-width: 12px;
  border-top-width: 12px;
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] [class*="line-x"] {
  bottom: 0;
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] [class*="line-x"][class*="-inner"] {
  left: 0;
  width: calc(100% - 28px);
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] [class*="line-x"][class*="-outer"] {
  right: 0;
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] [class*="line-y"] {
  right: 0;
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] [class*="line-y"][class*="-inner"] {
  top: 0;
  height: calc(100% - 28px);
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] [class*="line-y"][class*="-outer"] {
  bottom: 0;
  right: 0;
}

.no-csstransforms .hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] .line-x-outer {
  right: 4984px;
}

.no-csstransforms .hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] .line-y-outer {
  bottom: 4984px;
}

.csstransforms .hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] .line-x-outer {
  -webkit-transform: translateX(4984px);
  transform: translateX(4984px);
}

.csstransforms .hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] .line-y-outer {
  -webkit-transform: translateY(4984px);
  transform: translateY(4984px);
}

.csstransforms3d .hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] .line-x-outer {
  -webkit-transform: translate3d(4984px, 0, 0);
  transform: translate3d(4984px, 0, 0);
}

.csstransforms3d .hero-new [class*="lines-"][class*="-bottom-"][class*="-right"] .line-y-outer {
  -webkit-transform: translate3d(0, 4984px, 0);
  transform: translate3d(0, 4984px, 0);
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] {
  left: -4px;
  /*  @include rem-fallback(border-right-width, $hero-border-notch-width);
                        @include rem-fallback(border-top-width, $hero-border-notch-width); */
  border-right-width: 12px;
  border-top-width: 12px;
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] .line-x,
.hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] .line-y {
  bottom: 0;
  left: 0;
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] [class*="line-x"] {
  bottom: 0;
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] [class*="line-x"][class*="-inner"] {
  right: 0;
  width: calc(100% - 28px);
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] [class*="line-x"][class*="-outer"] {
  left: 0;
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] [class*="line-y"] {
  left: 0;
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] [class*="line-y"][class*="-inner"] {
  top: 0;
  height: calc(100% - 28px);
}

.hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] [class*="line-y"][class*="-outer"] {
  bottom: 0;
}

.no-csstransforms .hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] .line-x-outer {
  left: -4984px;
}

.no-csstransforms .hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] .line-y-outer {
  bottom: 4984px;
}

.csstransforms .hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] .line-x-outer {
  -webkit-transform: translateX(-4984px);
  transform: translateX(-4984px);
}

.csstransforms .hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] .line-y-outer {
  -webkit-transform: translateY(4984px);
  transform: translateY(4984px);
}

.csstransforms3d .hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] .line-x-outer {
  -webkit-transform: translate3d(-4984px, 0, 0);
  transform: translate3d(-4984px, 0, 0);
}

.csstransforms3d .hero-new [class*="lines-"][class*="-bottom-"][class*="-left"] .line-y-outer {
  -webkit-transform: translate3d(0, 4984px, 0);
  transform: translate3d(0, 4984px, 0);
}

.hero-new[data-line-position] .lines-top-left,
.hero-new[data-line-position] .lines-top-right,
.hero-new[data-line-position] .lines-bottom-left,
.hero-new[data-line-position] .lines-bottom-right,
.hero-new[data-line-position] .none {
  display: none;
}

.hero-new[data-line-position="top-right"] .line-block {
  border-top-color: transparent !important;
  border-right-color: transparent !important;
}

.hero-new[data-line-position="top-right"] .lines-top-right {
  display: block;
}

.hero-new[data-line-position="top-left"] .line-block {
  border-top-color: transparent !important;
  border-left-color: transparent !important;
}

.hero-new[data-line-position="top-left"] .lines-top-left {
  display: block;
}

.hero-new[data-line-position="bottom-right"] .line-block {
  border-bottom-color: transparent !important;
  border-right-color: transparent !important;
}

.hero-new[data-line-position="bottom-right"] .lines-bottom-right {
  display: block;
}

.hero-new[data-line-position="bottom-left"] .line-block {
  border-bottom-color: transparent !important;
  border-left-color: transparent !important;
}

.hero-new[data-line-position="bottom-left"] .lines-bottom-left {
  display: block;
}

.hero-new .shop-dropdown {
  font-size: 68px;
  font-size: 4.25rem;
  line-height: 73.1px;
  line-height: 4.56875rem;
}

.hero-new .shop-dropdown .SumoSelect {
  float: left;
  cursor: pointer;
}

.hero-new .shop-dropdown .SumoSelect .SelectBox {
  position: relative;
  display: inline-block;
  border: 0;
  padding: 0;
  line-height: inherit;
  font-family: "Telkom123-Bold", sans-serif;
  cursor: pointer;
}

.hero-new .shop-dropdown .SumoSelect .SelectBox * {
  color: #ffffff;
}

.hero-new .shop-dropdown .SumoSelect .SelectBox span,
.hero-new .shop-dropdown .SumoSelect .SelectBox label {
  display: inline-block;
}

.hero-new .shop-dropdown .SumoSelect .SelectBox span {
  padding: 0;
}

.hero-new .shop-dropdown .SumoSelect .SelectBox label {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%) translateX(2rem);
  transform: translateY(-50%) translateX(2rem);
  -webkit-transform: translate3d(2rem, -50%, 0);
  transform: translate3d(2rem, -50%, 0);
  width: 24px;
  width: 1.5rem;
  height: 12px;
  height: 0.75rem;
}

.hero-new .shop-dropdown .SumoSelect .SelectBox i {
  height: 0;
  width: 0;
  border-left: 0.75rem solid transparent;
  border-right: 0.75rem solid transparent;
  border-top: 0.75rem solid #ffffff;
  background-image: none;
}

.hero-new .shop-dropdown .SumoSelect .optWrapper {
  padding-top: 0;
  border: 0;
  border-style: solid;
  border-top-color: #ffffff;
  border-top-width: 64px;
  border-top-width: 4rem;
  padding-top: 128px;
  padding-top: 8rem;
  margin-top: 68px;
  margin-top: 4.25rem;
  width: 288px;
  width: 18rem;
}

.hero-new .shop-dropdown .SumoSelect .optWrapper label {
  font-size: 68px;
  font-size: 4.25rem;
  line-height: 73.1px;
  line-height: 4.56875rem;
  font-family: "Telkom123-Bold", sans-serif;
}

.hero-new .shop-dropdown .SumoSelect .optWrapper ul {
  overflow-y: visible;
  max-height: auto;
}

.hero-new .shop-dropdown .SumoSelect .optWrapper li {
  background-color: #ffffff;
  background-color: rgba(255, 255, 255, 0.98);
  color: #99cde7;
}

.hero-new .shop-dropdown .SumoSelect .optWrapper li.selected {
  color: #0083c2;
}

.hero-new .shop-dropdown .secondary {
  line-height: 0.87;
  float: left;
}

.hero-new .promo-block {
  /*** Content Block ========================= */
  /* ========================= /Content Block */
  /*** Focal Point ========================= */
  /* ========================= /Focal Point */
}

@media (min-width: 62em) {
  .hero-new .promo-block {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    position: relative;
    min-height: 363.2px;
    min-height: 22.7rem;
  }

  .hero-new .promo-block::after {
    clear: both;
    content: "";
    display: table;
  }

  .firefox .hero-new .promo-block {
    height: 1px;
  }
}

.hero-new .promo-block .content {
  pointer-events: auto;
}

.hero-new .promo-block .content .line-block {
  padding: 21.76px;
  padding: 1.36rem;
  border-color: #ffffff;
  border-style: solid;
  background-color: #006fad;
  border-width: 4px;
  position: relative;
}

@media (min-width: 48em) {
  .hero-new .promo-block .content .line-block {
    padding: 27.2px;
    padding: 1.7rem;
    padding-bottom: 11.2px;
    padding-bottom: 0.7rem;
  }
}

.hero-new .promo-block .content .text {
  position: relative;
  z-index: 5;
}

.hero-new .promo-block .content .text *:last-child {
  margin-bottom: 0;
}

.hero-new .promo-block .content .text .title {
  margin-top: -12px;
  margin-top: -0.75rem;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 25.8px;
  line-height: 1.6125rem;
  font-family: "Telkom123-Bold", sans-serif;
  color: #ffffff;
}

.hero-new .promo-block .content .text .title .secondary {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 38.7px;
  line-height: 2.41875rem;
  font-family: "Telkom123-Regular", sans-serif;
}

@media (min-width: 48em) {
  .hero-new .promo-block .content .text .title {
    font-size: 46.4px;
    font-size: 2.9rem;
    line-height: 51.2px;
    line-height: 3.2rem;
  }

  .hero-new .promo-block .content .text .title .secondary {
    font-size: 46.4px;
    font-size: 2.9rem;
    line-height: 51.2px;
    line-height: 3.2rem;
  }
}

.hero-new .promo-block .content .text p,
.hero-new .promo-block .content .text li {
  font-size: 120%;
  line-height: 130%;
  color: #ffffff;
}

.hero-new .promo-block .content .text p small,
.hero-new .promo-block .content .text li small {
  font-size: 50%;
}

.hero-new .promo-block .content .text > p {
  display: none;
}

@media (min-width: 48em) {
  .hero-new .promo-block .content .text > p {
    display: block;
  }
}

.hero-new .promo-block .content .text .usp-list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 16px;
  padding: 1rem;
  border: 1px solid #00d0ff;
  display: none;
}

.hero-new .promo-block .content .text .usp-list::after {
  clear: both;
  content: "";
  display: table;
}

@media (min-width: 48em) {
  .hero-new .promo-block .content .text .usp-list {
    display: block;
  }
}

.hero-new .promo-block .content .text .usp-list li {
  display: inline-block;
}

.hero-new .promo-block .content .text .usp-list li:before {
  content: '+';
  color: #00d0ff;
  padding-right: 8px;
  padding-right: 0.5rem;
  padding-left: 12.8px;
  padding-left: 0.8rem;
  line-height: 1.5;
}

.hero-new .promo-block .content .text .deal-showcase {
  margin-top: 32px;
  margin-top: 2rem;
  margin-bottom: 0;
}

.hero-new .promo-block .content .text .section-value {
  font-size: 48px;
  font-size: 3rem;
  line-height: 32px;
  line-height: 2rem;
  margin-top: -24px;
  margin-top: -1.5rem;
  font-family: "Telkom123-Bold", sans-serif;
  font-weight: 400;
}

.hero-new .promo-block .content .text .section-value span {
  display: inline;
  color: #ffffff;
  font-size: 20%;
}

.hero-new .promo-block .content .text .section-value sup {
  top: -18.4px;
  top: -1.15rem;
}

@media (min-width: 48em) {
  .hero-new .promo-block .content .text .section-value {
    font-size: 64px;
    font-size: 4rem;
    line-height: 64px;
    line-height: 4rem;
  }

  .hero-new .promo-block .content .text .section-value sup {
    top: -24px;
    top: -1.5rem;
  }
}

@media (min-width: 75em) {
  .hero-new .promo-block .content .text .section-value sup {
    top: -24px;
    top: -1.5rem;
  }
}

.hero-new .promo-block .content .text .btn-group {
  margin-top: 16px;
  margin-top: 1rem;
}

@media (max-width: 48em) {
  .hero-new .promo-block .content .text .btn-group > .btn {
    width: 50%;
    float: left;
    display: block;
    font-size: 8.96px;
    font-size: 0.56rem;
  }
}

@media (min-width: 48em) {
  .hero-new .promo-block .content .text .btn-group {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .hero-new .promo-block .content .text .btn-group::after {
    clear: both;
    content: "";
    display: table;
  }

  .hero-new .promo-block .content .text .btn-group > .btn {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    margin-bottom: 16px;
    margin-bottom: 1rem;
  }

  .hero-new .promo-block .content .text .btn-group > .btn:nth-child(2n) {
    float: right;
    margin-right: 0;
  }
}

.hero-new .promo-block .content .text .btn-group:after {
  width: 100%;
  content: "";
  clear: both;
  display: block;
}

.hero-new .promo-block .content .text .badge {
  width: 115px;
  width: 7.1875rem;
}

@media (max-width: 31.25em) {
  .hero-new .promo-block .content .text .badge {
    position: absolute;
    top: -48px;
    top: -3rem;
    right: -104px;
    right: -6.5rem;
  }
}

@media (min-width: 31.25em) {
  .hero-new .promo-block .content .text .badge {
    float: right;
    margin-top: 16px;
    margin-top: 1rem;
  }
}

.hero-new .promo-block .content .SumoSelect {
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
}

.hero-new .promo-block .content .SumoSelect .SelectBox {
  border: none;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 36px;
  line-height: 2.25rem;
  padding: 0;
  cursor: pointer;
  font-family: "Telkom123-Bold", sans-serif;
}

.hero-new .promo-block .content .SumoSelect .SelectBox * {
  cursor: pointer;
}

.hero-new .promo-block .content .SumoSelect .SelectBox span,
.hero-new .promo-block .content .SumoSelect .SelectBox label {
  display: inline-block;
  color: #00d0ff;
}

.hero-new .promo-block .content .SumoSelect .SelectBox span {
  padding: 0;
}

.hero-new .promo-block .content .SumoSelect .SelectBox label {
  position: relative;
  width: 24px;
  width: 1.5rem;
  height: 24px;
  height: 1.5rem;
}

.hero-new .promo-block .content .SumoSelect .SelectBox label i {
  height: 0;
  width: 0;
  border-left: 0.375rem solid transparent;
  border-right: 0.375rem solid transparent;
  border-top: 0.375rem solid #00d0ff;
  background: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}

.hero-new .promo-block .content .SumoSelect .optWrapper {
  border: none;
  width: auto;
}

.hero-new .promo-block .content .SumoSelect .optWrapper li {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 38.7px;
  line-height: 2.41875rem;
}

.hero-new .promo-block .content .SumoSelect .optWrapper li label {
  color: #66b5da;
}

.hero-new .promo-block .content .SumoSelect .optWrapper li label:hover {
  color: #0083c2;
}

.hero-new .promo-block .content .SumoSelect .optWrapper li.selected label {
  color: #005e9b;
}

.hero-new .promo-block .content .SumoSelect .optWrapper li:last-child {
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
}

.hero-new .promo-block .focal-point a {
  width: 100%;
  min-height: 363.2px;
  min-height: 22.7rem;
  display: block;
}

.hero-new .promo-block .focal-point img {
  display: block;
  margin: 0 auto;
  max-height: 379.2px;
  max-height: 23.7rem;
}

@media (max-width: 62em) {
  .hero-new .promo-block .focal-point {
    padding-bottom: 27.2px;
    padding-bottom: 1.7rem;
  }

  .hero-new .promo-block .focal-point img {
    max-width: 60%;
    margin: 0 auto;
  }
}

@media (min-width: 62em) {
  .hero-new .promo-block .focal-point {
    position: relative;
    z-index: 5;
  }

  .hero-new .promo-block .focal-point img {
    pointer-events: none;
  }
}

@media (min-width: 62em) and (max-width: 62em) {
  .hero-new .promo-block .focal-point img {
    max-width: inherit;
  }
}

/*** ============================================ /Hero Structure ***/

/*** Variations ***
    ============================================== */

.hero-new {
  /*
            &[data-layout*="has-nav"] {
                .content {
                    .line-block {
                        @include rem-fallback(margin-bottom, 5.5rem);

                        @include breakpoint($bp-tablet) {
                            @include rem-fallback(margin-bottom, 3.5rem);
                        }

                        @include breakpoint($bp-desktop) {
                            @include rem-fallback(margin-bottom, 7.5rem);
                        }
                    }
                }
            }
*/
}

@media (max-width: 62em) {
  .hero-new[data-layout*="image-bleed"] .foreground {
    padding-top: 0;
  }

  .hero-new[data-layout*="image-bleed"] .foreground .focal-point {
    padding-bottom: 0;
  }
}

@media (min-width: 62em) {
  .hero-new[data-layout*="image-bleed"] .foreground {
    padding-top: 0;
    padding-bottom: 0;
  }

  .hero-new[data-layout*="image-bleed"] .foreground .focal-point {
    position: relative;
  }

  .hero-new[data-layout*="image-bleed"] .foreground .focal-point img {
    width: auto;
    height: 102%;
    position: absolute;
    bottom: 0;
    max-width: inherit;
    max-height: 100%;
    left: 0;
    right: 0;
  }

  .hero-new[data-layout*="image-bleed"] .foreground .line-block {
    margin-top: 40px;
    margin-top: 2.5rem;
    margin-bottom: 40px;
    margin-bottom: 2.5rem;
  }
}

@media (min-width: 62em) {
  .hero-new[data-layout*="image-bleed"][data-layout*="not-hero"] .focal-point img {
    right: 27.2px;
    right: 1.7rem;
  }
}

@media (min-width: 62em) {
  .hero-new[data-layout*="image-bleed"][data-layout*="image-right"] .focal-point img {
    left: 27.2px;
    left: 1.7rem;
  }
}

@media (min-width: 62em) {
  .hero-new[data-layout*="centered"] .promo-block {
    display: table;
    table-layout: fixed;
  }

  .hero-new[data-layout*="centered"] .promo-block .promo-row {
    display: table-row;
  }
}

@media (min-width: 62em) {
  .hero-new[data-layout*="centered"] .focal-point,
  .hero-new[data-layout*="centered"] .focal-point + .content {
    display: table-cell;
    vertical-align: middle;
    width: 50%;
  }
}

@media (min-width: 62em) {
  .hero-new[data-layout*="centered"] .focal-point + .content {
    margin-top: 40px;
    margin-top: 2.5rem;
    margin-bottom: 40px;
    margin-bottom: 2.5rem;
  }
}

@media (max-width: 62em) {
  .hero-new[data-layout*="centered"][data-layout*="image-right"] .focal-point {
    padding-right: 13.6px;
    padding-right: 0.85rem;
  }
}

@media (min-width: 62em) {
  .hero-new[data-layout*="centered"][data-layout*="image-right"] .focal-point {
    padding-left: 27.2px;
    padding-left: 1.7rem;
  }

  .csstransforms .hero-new[data-layout*="centered"][data-layout*="image-right"] .focal-point {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }

  .csstransforms3d .hero-new[data-layout*="centered"][data-layout*="image-right"] .focal-point {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@media (min-width: 62em) {
  .csstransforms .hero-new[data-layout*="centered"][data-layout*="image-right"] .focal-point + .content {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }

  .csstransforms3d .hero-new[data-layout*="centered"][data-layout*="image-right"] .focal-point + .content {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@media (max-width: 62em) {
  .hero-new[data-layout*="centered"][data-layout*="image-left"] .focal-point {
    padding-left: 13.6px;
    padding-left: 0.85rem;
  }
}

@media (min-width: 62em) {
  .hero-new[data-layout*="centered"][data-layout*="image-left"] .focal-point {
    padding-right: 27.2px;
    padding-right: 1.7rem;
  }
}

.hero-new[data-layout*="not-hero"] {
  background-color: transparent;
}

.hero-new[data-layout*="not-hero"] .promo-block .focal-point img {
  max-height: none;
}

.hero-new[data-layout*="not-hero"] .promo-block .content .line-block {
  background-color: transparent;
  border-style: none;
}

.hero-new[data-layout*="not-hero"] .promo-block .content .line-block .text h1.title {
  color: #0083c2;
}

.hero-new[data-layout*="not-hero"] .promo-block .content .line-block .text p {
  color: #889391;
  display: block;
}

.hero-new[data-layout*="background-image"] .foreground {
  width: 70%;
  min-height: 224px;
  min-height: 14rem;
}

@media (min-width: 48em) {
  .hero-new[data-layout*="background-image"] .foreground {
    width: 50%;
  }
}

@media (min-width: 62em) {
  .hero-new[data-layout*="background-image"] .foreground {
    width: 100%;
    float: left;
  }
}

@media (max-width: 62em) {
  .hero-new[data-layout*="background-image"][data-layout*="focus-bottom"] .foreground {
    padding-bottom: 320px;
    padding-bottom: 20rem;
  }
}

@media (max-width: 62em) {
  .hero-new[data-layout*="background-image"][data-layout*="focus-top"] .foreground {
    padding-top: 320px;
    padding-top: 20rem;
  }
}

.hero-new[data-layout*="background-image"] .background {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
}

.hero-new[data-layout*="background-image"] .background .video {
  display: none;
}

.hero-new[data-layout*="background-image"] .background iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.hero-new[data-layout*="background-image"] .background picture {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.hero-new[data-layout*="background-image"] .background picture img {
  width: 105%;
  max-width: inherit;
  position: absolute;
}

.objectfit .hero-new[data-layout*="background-image"] .background picture img {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: 0% 83%;
  object-position: 0% 83%;
}

.csstransforms .hero-new[data-layout*="background-image"] .background picture img {
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.hero-new[data-layout*="background-image"] .focal-point {
  padding: 0;
}

.hero-new[data-layout*="background-image"] .content [class*="lines-"] {
  border-color: transparent;
}

.hero-new[data-layout*="background-image"] .content .line-block {
  background-color: transparent;
}

.hero-new[data-layout*="color-invert"] {
  background-color: #f7f7f7;
}

.hero-new[data-layout*="color-invert"] .content [class*="lines-"] {
  border-color: transparent;
}

.hero-new[data-layout*="color-invert"] .content [class*="lines-"] [class*="line-"] {
  background-color: #0083c2;
}

.hero-new[data-layout*="color-invert"] .content .line-block {
  border-color: #0083c2;
  background-color: transparent;
}

.hero-new[data-layout*="color-invert"] .content .text .title,
.hero-new[data-layout*="color-invert"] .content .text p,
.hero-new[data-layout*="color-invert"] .content .text .usp-list li,
.hero-new[data-layout*="color-invert"] .content .text .section-value,
.hero-new[data-layout*="color-invert"] .content .text .section-value span {
  color: #0083c2;
}

.hero-new[data-layout*="no-cta"] .content .btn-group {
  display: none;
}

.hero-new[data-layout*="cta-only"] {
  background-color: transparent;
}

.hero-new[data-layout*="cta-only"] .foreground {
  padding: 2.5% 5%;
}

.hero-new[data-layout*="cta-only"] .promo-block {
  min-height: 0;
}

.hero-new[data-layout*="cta-only"] .promo-block .line-block {
  border: 0;
  background-color: transparent;
  padding: 0;
}

.hero-new[data-layout*="cta-only"] .promo-block .line-block [class*="lines-"] {
  display: none;
}

.hero-new[data-layout*="cta-only"] .promo-block .line-block .text h1.title {
  color: #0083c2;
  letter-spacing: -1px;
  font-size: 32px;
  font-size: 2rem;
  line-height: 34.4px;
  line-height: 2.15rem;
  margin-top: 0;
  font-family: "Telkom123-Regular", sans-serif;
  font-weight: normal;
}

.hero-new[data-layout*="cta-only"] .promo-block .line-block .text .btn-group > .btn {
  width: auto;
  float: none;
}

.hero-new.center-content .wrapper,
.hero-new.center-content .promo-block {
  height: 100%;
}

/* ============================================ / Variations */

/*** Carousel Hero ========================= */

.hero.carousel {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.hero.carousel::after {
  clear: both;
  content: "";
  display: table;
}

.hero.carousel .owl-item {
  overflow: hidden;
}

.hero.carousel .owl-item .item {
  position: relative;
}

.hero.carousel .owl-wrapper-outer {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.hero.carousel .owl-controls {
  width: 100%;
  background-color: transparent;
  position: absolute;
}

.hero.carousel .owl-controls .owl-page span {
  background: #005e9b !important;
  border: 2px solid #ffffff;
  width: 20px !important;
  height: 20px !important;
  margin: 1rem 0.5rem !important;
}

@media (max-width: 48em) {
  .hero.carousel .owl-controls .owl-page span {
    width: 30px !important;
    height: 30px !important;
    margin: 1rem 1.2rem !important;
  }
}

@media (min-width: 48em) {
  .hero.carousel .owl-controls {
    margin: 0;
    left: 0;
    bottom: 0;
    right: 0;
  }
}

.hero.carousel .simulate-banner {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000;
}

.hero.carousel .simulate-banner img {
  width: 100%;
  height: auto !important;
  -o-object-fit: none !important;
  object-fit: none !important;
}

/* ========================= / .parent .child */

/* ============================================ /HERO NEW CI */

/* ============================================
*** Scroll Button ***
============================================== */

.sub-hero-controls {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  position: relative;
}

#scroll-to-main {
  display: none;
  height: 0;
  visibility: none;
}

@media (min-width: 48em) {
  .js #scroll-to-main {
    float: left;
    visibility: hidden;
    display: block;
    width: 3.375rem;
    height: 3.375rem;
    text-indent: -9999px;
    position: absolute;
    opacity: 0;
    -webkit-transition-property: height, opacity;
    transition-property: height, opacity;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    background-size: 100%;
    background-size: cover;
    background-position: 50% 53.5%;
    z-index: 999;
  }

  .js #scroll-to-main.inside {
    top: -4.875rem;
    right: 1.5rem;
    background-color: #005e9b;
    background-size: 1rem;
  }

  .js #scroll-to-main.outside {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0 auto;
    background-image: url('/today/static/web/img/scroll-down-arrow.png?366df576f285');
    background-repeat: no-repeat;
    background-size: 32px;
    background-size: 2rem;
  }

  .js #scroll-to-main.visible {
    visibility: visible;
    opacity: 0.8;
  }
}

/* ============================================ / Scroll Button */

#first-hero {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

#first-hero::after {
  clear: both;
  content: "";
  display: table;
}

.promo-tile-grid {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-top: 5.71429%;
}

.promo-tile-grid > [class*="promo-tile-"] {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 3.5rem;
}

@media (min-width: 48em) and (max-width: 62em) {
  .promo-tile-grid > [class*="promo-tile-"] {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .promo-tile-grid > [class*="promo-tile-"]:nth-child(2n) {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 62em) {
  .promo-tile-grid > [class*="promo-tile-"] {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .promo-tile-grid > [class*="promo-tile-"]:nth-child(3n) {
    float: right;
    margin-right: 0;
  }
}

.BrochureTabs {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.BrochureTabs::after {
  clear: both;
  content: "";
  display: table;
}

.BrochureTabs-tabBar {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.BrochureTabs-tabBar::after {
  clear: both;
  content: "";
  display: table;
}

.BrochureTabs-tabBar,
.BrochureTabs-panel {
  max-width: 90.0625em !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.BrochureTabs-tabItem {
  display: block;
  float: left;
  width: 50%;
  padding: 1.5rem;
  text-decoration: none;
  color: #cccccc;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.BrochureTabs-tabItem[aria-selected="true"] {
  background-color: #f7f7f7;
  color: #666666;
}

.BrochureTabs-tabItem:hover {
  color: #666666;
}

.BrochureTabs-tabItem img {
  display: block;
  width: 2.25rem;
  margin: 0 auto 1rem;
}

@media (min-width: 48em) {
  .BrochureTabs-tabItem {
    display: inline-block;
    float: none;
    width: 19%;
    width: calc(20% - 3px);
    text-align: center;
  }

  .BrochureTabs-tabItem img {
    width: 5.0625rem;
  }
}

.BrochureTabs-panelGroup {
  padding: 3.375rem 2%;
  background-color: #f7f7f7;
}

.BrochureTabs-title {
  color: #666666;
  text-align: center;
  text-decoration: none;
}

.BrochureTabs-panel {
  color: #666666;
}

.BrochureTabs-cta {
  display: block;
  margin: 0 auto;
}

.TeaserList {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: justify;
}

.TeaserList::after {
  clear: both;
  content: "";
  display: table;
}

.TeaserList:after {
  display: inline-block;
  width: 100%;
  content: "";
}

.TeaserList-item {
  display: inline-block;
  width: 48.57143%;
  padding: 1.5rem 0;
  text-align: center;
  vertical-align: top;
}

@media (min-width: 48em) {
  .TeaserList-item {
    width: 22.85714%;
  }
}

@media (min-width: 62em) {
  .TeaserList-item {
    width: 14.28571%;
  }
}

.TeaserList-link {
  display: block;
  color: #666666;
  text-decoration: none;
}

.TeaserList-link:hover {
  color: #666666;
}

.TeaserList-link:hover .TeaserList-thumbnail {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

.TeaserList-thumbnail[class] {
  display: block;
  width: 100%;
  margin-bottom: 1.5rem;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.Concertina {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.Concertina::after {
  clear: both;
  content: "";
  display: table;
}

.Concertina-item + .Concertina-item {
  margin-top: 1.5rem;
}

.Concertina-tab {
  position: relative;
  display: block;
  margin-bottom: 1rem;
  padding-right: 1.5em;
  color: #0083c2;
  font-size: 1.15rem;
  text-decoration: none;
}

.Concertina-tab[aria-selected="true"] .Concertina-tabIcon {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

@media (min-width: 48em) {
  .Concertina-tab--width10 {
    max-width: 10%;
  }

  .Concertina-tab--width20 {
    max-width: 20%;
  }

  .Concertina-tab--width30 {
    max-width: 30%;
  }

  .Concertina-tab--width40 {
    max-width: 40%;
  }

  .Concertina-tab--width50 {
    max-width: 50%;
  }
}

.Concertina-tabIcon {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  display: block;
  width: 0;
  height: 0;
  margin: auto 0;
  border-style: solid;
  border-width: 0.375em;
  border-color: transparent transparent transparent #0083c2;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.Concertina-panel {
  display: block;
  max-height: 100em;
  overflow: hidden;
  opacity: 1;
  visibility: visible;
  -webkit-transition: visibility 0s ease, max-height .5s ease, opacity .5s ease;
  transition: visibility 0s ease, max-height .5s ease, opacity .5s ease;
}

.Concertina-panel[aria-hidden="true"] {
  max-height: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition-delay: .5s, 0s, 0s;
  transition-delay: .5s, 0s, 0s;
}

/* Templates */

/***************************************/

/* #39.1 - Shop Wizard */

/***************************************/

.shop-wizard {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  padding: 0;
  background-color: #f7f7f6;
}

.shop-wizard::after {
  clear: both;
  content: "";
  display: table;
}

@media (min-width: 48em) {
  .shop-wizard .shop-wizard-content,
  .shop-wizard .shop-wizard-sidebar {
    display: table-cell;
    float: none;
    vertical-align: top;
  }
}

.shop-wizard-content {
  padding: 0 5%;
  padding-top: 48px;
  padding-top: 3rem;
  background-color: #ffffff;
}

.shop-wizard-content h2 {
  margin-top: 0;
}

.row.lightblue .call-back {
  padding-top: 5%;
  padding-bottom: 5%;
  background-color: #0072a9;
}

.wizard-explore {
  position: relative;
  padding-top: 32px;
  padding-top: 2rem;
}

@media (min-width: 48em) {
  .wizard-explore {
    padding-top: 0;
  }
}

.wizard-explore .show-sidebar {
  display: block;
}

.wizard-explore .shop-wizard-sidebar {
  display: none;
}

@media (min-width: 48em) {
  .wizard-explore .shop-wizard-sidebar {
    width: 3%;
    margin-right: -1px;
    padding: 0;
    display: block;
  }

  .wizard-explore .shop-wizard-sidebar * {
    display: none;
  }
}

@media (min-width: 48em) {
  .wizard-explore .shop-wizard-content {
    width: 97%;
    float: right;
    border-left: 1px solid #e8e7e7;
  }
}

.wizard-explore .shop-wizard-content .shop-wizard-filtered hr {
  display: none;
}

.wizard-explore .shop-wizard-content .shop-wizard-filtered .items {
  padding-top: 0;
}

.wizard-explore .shop-wizard-content .builder-grouping {
  overflow: visible;
}

.wizard-explore .shop-wizard-content .builder-grouping .product-image img {
  max-width: 60%;
}

.wizard-explore .shop-wizard-content .builder-grouping .custom-number {
  margin-top: 16px;
  margin-top: 1rem;
}

.wizard-explore .shop-wizard-content .builder-grouping .range {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.wizard-explore .shop-wizard-content .builder-grouping .range .irs .irs-grid .irs-grid-text.on {
  color: #0083c2;
  font-size: 16px;
  font-size: 1rem;
  padding: 0;
}

.wizard-explore .shop-wizard-content .builder-grouping .choices {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.wizard-explore .shop-wizard-content .builder-grouping .choices .helper [class*="icon-"] {
  margin: 0 auto;
  margin-top: 12px;
  margin-top: 0.75rem;
}

.wizard-explore .shop-wizard-content .builder-grouping .choices .helper-text {
  text-align: left;
  width: 224px;
  width: 14rem;
  min-width: 224px;
  min-width: 14rem;
}

.wizard-explore .shop-wizard-business-other {
  display: none;
}

@media (min-width: 48em) {
  .shop-wizard-sidebar {
    width: 40%;
    float: left;
  }

  .shop-wizard-content {
    width: 60%;
    float: left;
  }

  .shop-wizard-product,
  .shop-wizard-other {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }
}

@media (min-width: 62em) {
  .shop-wizard-sidebar {
    width: 31%;
    float: left;
  }

  .shop-wizard-content {
    width: 69%;
    float: left;
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .shop-wizard-sidebar {
    width: 27%;
    float: left;
  }

  .shop-wizard-content {
    width: 73%;
    float: left;
    float: right;
    margin-right: 0;
  }

  .shop-wizard-product,
  .shop-wizard-other {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.brochure-page {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.brochure-page .shop-listing-slider .item img {
  width: 128px;
  width: 8rem;
}

@media (min-width: 48em) {
  .brochure-page .shop-listing-slider .item img {
    width: 192px;
    width: 12rem;
  }
}

.brochure-page .brochure-container {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.brochure-page .brochure-block p,
.brochure-page .brochure-block-inverted p {
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  margin-left: 0;
  margin-right: 0;
}

.brochure-page .brochure-block [class*="btn"],
.brochure-page .brochure-block-inverted [class*="btn"] {
  width: 100%;
}

@media (min-width: 48em) {
  .brochure-page .brochure-block [class*="btn"],
  .brochure-page .brochure-block-inverted [class*="btn"] {
    width: 50%;
  }
}

.brochure-page .section-close {
  width: 1rem;
  height: 1rem;
  background-size: contain;
  position: absolute;
  right: 1rem;
  top: 1rem;
  z-index: 5;
}

@media (min-width: 48em) {
  .brochure-page .section-close {
    width: 1.5rem;
    height: 1.5rem;
    top: 2.25rem;
    right: 5%;
  }
}

.brochure-page .brochure-hero-nav {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .brochure-page .brochure-hero-nav {
    margin-top: -60.8px;
    margin-top: -3.8rem;
    position: relative;
  }
}

@media (min-width: 62em) {
  .brochure-page .brochure-hero-nav {
    margin-top: -68px;
    margin-top: -4.25rem;
  }
}

@media (max-width: 290.0625em) {
  .brochure-page .brochure-hero-nav {
    padding: 0 5%;
  }
}

.brochure-page .brochure-map {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 35%;
  min-height: 400px;
  position: relative;
  overflow: hidden;
  margin-bottom: -1px;
}

.brochure-page .brochure-map #map {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.brochure-page .shop-wizard-product {
  padding: 0;
}

.brochure-page .category-togglers {
  margin-top: 24px;
  margin-top: 1.5rem;
}

[class*="brochure-row"] {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  position: relative;
  padding: 2%;
}

[class*="brochure-row"].arrow:after {
  display: block;
  content: '';
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  z-index: 20;
  bottom: -24px;
  bottom: -1.5rem;
  border-left-width: 24px;
  border-left-width: 1.5rem;
  border-right-width: 24px;
  border-right-width: 1.5rem;
  border-top-width: 24px;
  border-top-width: 1.5rem;
  border-left-color: transparent;
  border-right-color: transparent;
  border-top-color: #ffffff;
  border-bottom-color: transparent;
  border-style: solid;
}

@media (min-width: 48em) {
  [class*="brochure-row"].arrow:after {
    bottom: -36px;
    bottom: -2.25rem;
    border-left-width: 36px;
    border-left-width: 2.25rem;
    border-right-width: 36px;
    border-right-width: 2.25rem;
    border-top-width: 36px;
    border-top-width: 2.25rem;
  }
}

[class*="brochure-row"] .title {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
  color: #0083c2;
  margin-top: 0;
  margin-bottom: 5%;
}

[class*="brochure-row"] .title-center {
  color: #0083c2;
}

@media (min-width: 48em) {
  [class*="brochure-row"] .title-center {
    text-align: center;
  }
}

[class*="brochure-row"] .subtitle-big,
[class*="brochure-row"] .subtitle-small {
  margin: 0 auto;
  margin-top: 24px;
  margin-top: 1.5rem;
}

@media (min-width: 48em) {
  [class*="brochure-row"] .subtitle-big,
  [class*="brochure-row"] .subtitle-small {
    width: 74.28571%;
  }
}

[class*="brochure-row"] .subtitle-big b,
[class*="brochure-row"] .subtitle-big strong,
[class*="brochure-row"] .subtitle-small b,
[class*="brochure-row"] .subtitle-small strong {
  color: #0083c2;
}

[class*="brochure-row"] .subtitle-big {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
}

[class*="brochure-row"] .subtitle-small {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 21.5px;
  line-height: 1.34375rem;
  font-family: "Telkom123-Bold", sans-serif;
  font-family: "Telkom123-Regular", sans-serif;
  line-height: 1.6rem;
}

[class*="brochure-row"] .subtitle-small a,
[class*="brochure-row"] .subtitle-small a:hover {
  color: inherit;
}

[class*="brochure-row"] .centered {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

@media (min-width: 48em) {
  [class*="brochure-row"] .centered {
    max-width: 20rem;
  }
}

.brochure-row-white,
.brochure-row {
  background-color: #ffffff;
  color: #889391;
}

.brochure-row-white.arrow:after,
.arrow.brochure-row:after {
  border-top-color: #ffffff;
}

.brochure-row-white h1,
.brochure-row h1,
.brochure-row-white .h1,
.brochure-row .h1,
.brochure-row-white h2,
.brochure-row h2,
.brochure-row-white .h2,
.brochure-row .h2,
.brochure-row-white .device-support .css-wds-context-scenario-title,
.device-support .brochure-row-white .css-wds-context-scenario-title,
.brochure-row .device-support .css-wds-context-scenario-title,
.device-support .brochure-row .css-wds-context-scenario-title,
.brochure-row-white
  .device-support .css-wds-context-explorer-user-panel-text-name,
.device-support .brochure-row-white .css-wds-context-explorer-user-panel-text-name,
.brochure-row
  .device-support .css-wds-context-explorer-user-panel-text-name,
.device-support .brochure-row .css-wds-context-explorer-user-panel-text-name,
.brochure-row-white h3,
.brochure-row h3,
.brochure-row-white .h3,
.brochure-row .h3,
.brochure-row-white .device-support .css-wds-context-explorer-user-component-name,
.device-support .brochure-row-white .css-wds-context-explorer-user-component-name,
.brochure-row .device-support .css-wds-context-explorer-user-component-name,
.device-support .brochure-row .css-wds-context-explorer-user-component-name,
.brochure-row-white h4,
.brochure-row h4,
.brochure-row-white .h4,
.brochure-row .h4,
.brochure-row-white h5,
.brochure-row h5,
.brochure-row-white .h5,
.brochure-row .h5 {
  color: #0083c2;
}

.brochure-row-white p,
.brochure-row p {
  color: #889391;
}

.brochure-row-cyan {
  background-color: #00d0ff;
  color: #ffffff;
}

.brochure-row-cyan.arrow:after {
  border-top-color: #00d0ff;
}

.brochure-row-cyan h1,
.brochure-row-cyan .h1,
.brochure-row-cyan h2,
.brochure-row-cyan .h2,
.brochure-row-cyan .device-support .css-wds-context-scenario-title,
.device-support .brochure-row-cyan .css-wds-context-scenario-title,
.brochure-row-cyan
  .device-support .css-wds-context-explorer-user-panel-text-name,
.device-support .brochure-row-cyan .css-wds-context-explorer-user-panel-text-name,
.brochure-row-cyan h3,
.brochure-row-cyan .h3,
.brochure-row-cyan .device-support .css-wds-context-explorer-user-component-name,
.device-support .brochure-row-cyan .css-wds-context-explorer-user-component-name,
.brochure-row-cyan h4,
.brochure-row-cyan .h4,
.brochure-row-cyan h5,
.brochure-row-cyan .h5 {
  color: #ffffff;
}

.brochure-row-cyan p {
  color: #ffffff;
}

.brochure-row-grey {
  background-color: #f7f7f7;
  color: #889391;
}

.brochure-row-grey.arrow:after {
  border-top-color: #f7f7f7;
}

.brochure-row-grey h1,
.brochure-row-grey .h1,
.brochure-row-grey h2,
.brochure-row-grey .h2,
.brochure-row-grey .device-support .css-wds-context-scenario-title,
.device-support .brochure-row-grey .css-wds-context-scenario-title,
.brochure-row-grey
  .device-support .css-wds-context-explorer-user-panel-text-name,
.device-support .brochure-row-grey .css-wds-context-explorer-user-panel-text-name,
.brochure-row-grey h3,
.brochure-row-grey .h3,
.brochure-row-grey .device-support .css-wds-context-explorer-user-component-name,
.device-support .brochure-row-grey .css-wds-context-explorer-user-component-name,
.brochure-row-grey h4,
.brochure-row-grey .h4,
.brochure-row-grey h5,
.brochure-row-grey .h5 {
  color: #0083c2;
}

.brochure-row-grey p {
  color: #889391;
}

.brochure-row-lime {
  background-color: #bfd730;
  color: #ffffff;
}

.brochure-row-lime.arrow:after {
  border-top-color: #bfd730;
}

.brochure-row-lime h1,
.brochure-row-lime .h1,
.brochure-row-lime h2,
.brochure-row-lime .h2,
.brochure-row-lime .device-support .css-wds-context-scenario-title,
.device-support .brochure-row-lime .css-wds-context-scenario-title,
.brochure-row-lime
  .device-support .css-wds-context-explorer-user-panel-text-name,
.device-support .brochure-row-lime .css-wds-context-explorer-user-panel-text-name,
.brochure-row-lime h3,
.brochure-row-lime .h3,
.brochure-row-lime .device-support .css-wds-context-explorer-user-component-name,
.device-support .brochure-row-lime .css-wds-context-explorer-user-component-name,
.brochure-row-lime h4,
.brochure-row-lime .h4,
.brochure-row-lime h5,
.brochure-row-lime .h5 {
  color: #ffffff;
}

.brochure-row-lime p {
  color: #ffffff;
}

.brochure-row-pink {
  background-color: #da1b60;
  color: #ffffff;
}

.brochure-row-pink.arrow:after {
  border-top-color: #da1b60;
}

.brochure-row-pink h1,
.brochure-row-pink .h1,
.brochure-row-pink h2,
.brochure-row-pink .h2,
.brochure-row-pink .device-support .css-wds-context-scenario-title,
.device-support .brochure-row-pink .css-wds-context-scenario-title,
.brochure-row-pink
  .device-support .css-wds-context-explorer-user-panel-text-name,
.device-support .brochure-row-pink .css-wds-context-explorer-user-panel-text-name,
.brochure-row-pink h3,
.brochure-row-pink .h3,
.brochure-row-pink .device-support .css-wds-context-explorer-user-component-name,
.device-support .brochure-row-pink .css-wds-context-explorer-user-component-name,
.brochure-row-pink h4,
.brochure-row-pink .h4,
.brochure-row-pink h5,
.brochure-row-pink .h5 {
  color: #ffffff;
}

.brochure-row-pink p {
  color: #ffffff;
}

.brochure-row-blue-dark {
  background-color: #005e9b;
  color: #ffffff;
}

.brochure-row-blue-dark.arrow:after {
  border-top-color: #005e9b;
}

.brochure-row-blue-dark h1,
.brochure-row-blue-dark .h1,
.brochure-row-blue-dark h2,
.brochure-row-blue-dark .h2,
.brochure-row-blue-dark .device-support .css-wds-context-scenario-title,
.device-support .brochure-row-blue-dark .css-wds-context-scenario-title,
.brochure-row-blue-dark
  .device-support .css-wds-context-explorer-user-panel-text-name,
.device-support .brochure-row-blue-dark .css-wds-context-explorer-user-panel-text-name,
.brochure-row-blue-dark h3,
.brochure-row-blue-dark .h3,
.brochure-row-blue-dark .device-support .css-wds-context-explorer-user-component-name,
.device-support .brochure-row-blue-dark .css-wds-context-explorer-user-component-name,
.brochure-row-blue-dark h4,
.brochure-row-blue-dark .h4,
.brochure-row-blue-dark h5,
.brochure-row-blue-dark .h5 {
  color: #ffffff;
}

.brochure-row-blue-dark p {
  color: #ffffff;
}

.brochure-row-blue {
  background-color: #0083c2;
  color: #ffffff;
}

.brochure-row-blue.arrow:after {
  border-top-color: #0083c2;
}

.brochure-row-blue h1,
.brochure-row-blue .h1,
.brochure-row-blue h2,
.brochure-row-blue .h2,
.brochure-row-blue .device-support .css-wds-context-scenario-title,
.device-support .brochure-row-blue .css-wds-context-scenario-title,
.brochure-row-blue
  .device-support .css-wds-context-explorer-user-panel-text-name,
.device-support .brochure-row-blue .css-wds-context-explorer-user-panel-text-name,
.brochure-row-blue h3,
.brochure-row-blue .h3,
.brochure-row-blue .device-support .css-wds-context-explorer-user-component-name,
.device-support .brochure-row-blue .css-wds-context-explorer-user-component-name,
.brochure-row-blue h4,
.brochure-row-blue .h4,
.brochure-row-blue h5,
.brochure-row-blue .h5 {
  color: #ffffff;
}

.brochure-row-blue p {
  color: #ffffff;
}

.brochure-row-blue-grey {
  background-color: #102e41;
  color: #ffffff;
}

.brochure-row-blue-grey.arrow:after {
  border-top-color: #102e41;
}

.brochure-row-blue-grey h1,
.brochure-row-blue-grey .h1,
.brochure-row-blue-grey h2,
.brochure-row-blue-grey .h2,
.brochure-row-blue-grey .device-support .css-wds-context-scenario-title,
.device-support .brochure-row-blue-grey .css-wds-context-scenario-title,
.brochure-row-blue-grey
  .device-support .css-wds-context-explorer-user-panel-text-name,
.device-support .brochure-row-blue-grey .css-wds-context-explorer-user-panel-text-name,
.brochure-row-blue-grey h3,
.brochure-row-blue-grey .h3,
.brochure-row-blue-grey .device-support .css-wds-context-explorer-user-component-name,
.device-support .brochure-row-blue-grey .css-wds-context-explorer-user-component-name,
.brochure-row-blue-grey h4,
.brochure-row-blue-grey .h4,
.brochure-row-blue-grey h5,
.brochure-row-blue-grey .h5 {
  color: #ffffff;
}

.brochure-row-blue-grey p {
  color: #ffffff;
}

.search-state {
  display: none;
}

.lead-form,
.lead-form-blue {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  /* Themes */
}

@media (min-width: 48em) {
  .lead-form .wrapper,
  .lead-form-blue .wrapper {
    display: table;
    table-layout: fixed;
    min-height: 500px;
  }
}

@media (min-width: 48em) {
  .lead-form .order-form,
  .lead-form-blue .order-form,
  .lead-form .additional,
  .lead-form-blue .additional {
    width: 50%;
    display: table-cell;
    vertical-align: middle;
    position: relative;
  }
}

.lead-form .order-form,
.lead-form-blue .order-form {
  padding: 5%;
}

@media (min-width: 48em) {
  .lead-form .order-form:first-child,
  .lead-form-blue .order-form:first-child {
    padding-right: 0;
  }

  .lead-form .order-form:last-child,
  .lead-form-blue .order-form:last-child {
    padding-left: 0;
  }
}

@media (min-width: 290.0625em) {
  .lead-form .order-form:first-child,
  .lead-form-blue .order-form:first-child {
    padding-left: 0;
  }

  .lead-form .order-form:last-child,
  .lead-form-blue .order-form:last-child {
    padding-right: 0;
  }
}

.lead-form .additional.people,
.lead-form-blue .additional.people {
  vertical-align: bottom;
}

@media (min-width: 48em) {
  .lead-form .additional.people,
  .lead-form-blue .additional.people {
    background-size: 133%;
    background-repeat: no-repeat;
  }
}

@media (min-width: 62em) {
  .lead-form .additional.people,
  .lead-form-blue .additional.people {
    background-size: contain;
    background-position: bottom;
  }
}

.lead-form .additional.people img,
.lead-form-blue .additional.people img {
  width: 70%;
}

@media (min-width: 48em) {
  .lead-form .additional:first-child,
  .lead-form-blue .additional:first-child {
    padding-left: 5%;
  }
}

@media (min-width: 48em) and (min-width: 48em) {
  .lead-form .additional:first-child.people,
  .lead-form-blue .additional:first-child.people {
    background-position: right 26% bottom;
  }
}

@media (min-width: 48em) {
  .lead-form .additional:last-child,
  .lead-form-blue .additional:last-child {
    padding-right: 5%;
  }
}

@media (min-width: 48em) and (min-width: 48em) {
  .lead-form .additional:last-child.people,
  .lead-form-blue .additional:last-child.people {
    background-position: left 26% bottom;
  }
}

.lead-form .additional img,
.lead-form-blue .additional img {
  display: block;
  margin: auto;
}

.lead-form .padded,
.lead-form-blue .padded {
  padding: 5%;
}

.lead-form .intro,
.lead-form-blue .intro {
  color: #0083c2;
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
  margin-top: 0;
}

@media (min-width: 48em) {
  .lead-form .intro,
  .lead-form-blue .intro {
    width: 74.28571%;
  }
}

@media (min-width: 48em) {
  .lead-form .form-group,
  .lead-form-blue .form-group {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .lead-form .form-group:nth-of-type(2n + 2),
  .lead-form-blue .form-group:nth-of-type(2n + 2) {
    float: right;
    margin-right: 0;
  }
}

.lead-form [class*="btn"],
.lead-form-blue [class*="btn"] {
  margin: 1rem 0 0 0;
  width: 100%;
}

.lead-form-blue {
  background-color: #005e9b;
  color: #ffffff;
}

.lead-form-blue .intro {
  color: #ffffff;
}

.lead-form-blue .field {
  border-color: #ffffff;
}

.lead-form-blue .field label,
.lead-form-blue .field input,
.lead-form-blue .field input:focus,
.lead-form-blue .field input:active {
  color: #ffffff;
}

.lead-form-blue .field input::-webkit-input-placeholder {
  color: #f7f7f7 !important;
}

.lead-form-blue .field input::-moz-placeholder {
  color: #f7f7f7 !important;
}

.lead-form-blue .field input:-moz-placeholder {
  color: #f7f7f7 !important;
}

.lead-form-blue .field input:-ms-input-placeholder {
  color: #f7f7f7 !important;
}

.brochure-button-group .btn.btn-blue,
.brochure-button-group .btn.btn-invert-blue {
  margin: 0;
  display: inline-block;
  width: auto;
}

.brochure-button-group .btn.btn-blue {
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
}

.featured-blog {
  padding: 0;
}

.featured-blog .title small {
  color: #889391;
  margin-bottom: 1rem;
}

@media (min-width: 48em) {
  .featured-blog.hand .focal-point {
    vertical-align: bottom;
  }
}

.featured-blog.hand .focal-point img {
  width: 50%;
  margin-top: 48px;
  margin-top: 3rem;
}

.featured-blog [class*="btn-"] {
  display: block;
  text-align: left;
}

.featured-blog [class*="btn-"].icon-play-blue,
.featured-blog [class*="btn-"].icon-download-blue {
  background-position: left center;
  background-size: 16px;
  background-size: 1rem;
  padding-left: 28px;
  padding-left: 1.75rem;
  margin-top: 8px;
  margin-top: 0.5rem;
}

.ajax-container {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  position: relative;
}

.heading-group-half {
  margin-bottom: 2.25rem;
}

.heading-group-half .title {
  margin-bottom: 1.5rem;
}

@media (min-width: 48em) {
  .heading-group-half {
    width: 48.57143%;
  }
}

.page-big-business .hero-big-business .backdrop {
  background-color: #50667d;
}

.page-big-business .hero-big-business .backdrop picture {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.page-big-business .hero-big-business .backdrop picture img {
  height: 130%;
  width: auto;
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media (max-width: 48em) {
  .page-big-business .hero-big-business .backdrop picture img {
    left: 0;
  }
}

@media (min-width: 48em) {
  .page-big-business .hero-big-business .backdrop picture img {
    height: 175%;
    right: -10%;
  }
}

@media (min-width: 48em) and (orientation: portrait) {
  .page-big-business .hero-big-business .backdrop picture img {
    height: 85%;
    right: -13%;
    top: -14%;
    -webkit-transform: none;
    transform: none;
  }
}

.page-big-business .hero-unified-communications .backdrop {
  background-color: #005e9b;
}

.page-big-business .hero-unified-communications .backdrop picture {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.page-big-business .hero-unified-communications .backdrop picture img {
  height: 100%;
  width: auto;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

@media (max-width: 48em) {
  .page-big-business .hero-unified-communications .backdrop picture img {
    left: 0;
  }
}

.page-big-business .hero-unified-communications .block .title {
  font-size: 49.6px;
  font-size: 3.1rem;
  line-height: 53.32px;
  line-height: 3.3325rem;
}

.page-big-business .hero-unified-communications .block .desc {
  font-size: 19.2px;
  font-size: 1.2rem;
  line-height: 22.4px;
  line-height: 1.4rem;
}

.page-big-business [role="tabpanel"] h6 {
  color: #f04e23;
}

.page-big-business [role="tab"] {
  display: inline-block;
  width: 3.375rem;
  height: 3.375rem;
}

.page-big-business [role="tab"] svg * {
  -webkit-transition: 0.5s;
  transition: 0.5s;
}

.page-big-business [role="tab"].active svg * {
  fill: #f04e23;
}

.page-big-business .collapse .active {
  color: #f04e23;
}

.page-big-business .collapse .content {
  padding: 1rem 0;
}

.page-big-business .collapse .content p:first-child {
  margin-top: 0;
}

.page-big-business .button-unit.two .button {
  width: 48.57143%;
  float: left;
  margin-right: 2.85714%;
}

.page-big-business .button-unit.two .button:nth-child(2n) {
  float: right;
  margin-right: 0;
}

.page-big-business .button-unit.two .btn {
  width: 100%;
  display: block;
}

.brochure-separator {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  position: relative;
  padding-left: 5%;
  padding-right: 5%;
  background-color: #0083c2;
  z-index: 5;
}

.brochure-separator:after {
  display: block;
  content: "";
  width: 0;
  height: 0;
  top: 100%;
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
  border-left: 1.5rem solid transparent;
  border-right: 1.5rem solid transparent;
  border-top: 1.5rem solid #0083c2;
}

@media (min-width: 48em) {
  .brochure-separator:after {
    border-left: 2.25rem solid transparent;
    border-right: 2.25rem solid transparent;
    border-top: 2.25rem solid #0083c2;
  }
}

.brochure-separator-blue {
  background-color: #0083c2;
}

.brochure-separator-blue .search-inpage .inpage {
  border-color: #ffffff;
}

.brochure-separator-blue:after {
  border-color: #ffffff;
}

.brochure-separator-pink {
  background-color: #da1b60;
}

.brochure-separator-pink .search-inpage .inpage {
  border-color: #ffffff;
}

.brochure-separator-pink:after {
  border-color: #ffffff;
}

.brochure-faq-nav {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  display: table;
  table-layout: fixed;
}

.brochure-faq-nav [role="tab"] {
  position: relative;
  display: table-cell;
  border: 1px solid #e8e7e7;
  border-right: 0;
  border-bottom: 0;
  background-color: #ffffff;
  padding: 1.5rem;
  text-decoration: none;
  font-family: "Telkom123-Bold", sans-serif;
  text-align: center;
  vertical-align: middle;
  color: #889391;
}

.brochure-faq-nav [role="tab"]:last-child {
  border-right: 1px solid #e8e7e7;
}

.brochure-faq-nav [role="tab"].active {
  color: #0083c2;
}

.brochure-faq-nav [role="tab"].active:after {
  content: '';
  display: block;
  width: 100%;
  position: absolute;
  height: 1px;
  bottom: -1px;
  left: 0;
  right: 0;
  background-color: #ffffff;
}

.brochure-faqs {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.brochure-faqs .content {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  background-color: #ffffff;
  border: 1px solid #e8e7e7;
  padding: 1.5rem;
}

.brochure-faqs .content::after {
  clear: both;
  content: "";
  display: table;
}

.brochure-faqs .content h4 {
  color: #0083c2;
  font-family: "Telkom123-Bold", sans-serif;
}

@media (min-width: 48em) {
  .brochure-faqs .content .faq-block {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .brochure-faqs .content .faq-block:nth-child(2n + 2) {
    float: right;
    margin-right: 0;
  }
}
.brochure-faqs .content .open-answer {
  color: #0083c2;
  padding: 0;
  margin: 0;
  text-decoration: underline;
}

.brochure-faqs .content .open-answer:hover {
  color: #005e9b;
}

.brochure-faqs .content .open-answer:hover:after:hover {
  color: #005e9b;
}

.brochure-faqs .content .open-answer:before {
  display: block;
  content: "+";
  float: left;
  margin-right: 5px;
}

.brochure-faqs .content .open-answer.active {
  color: #f04e23;
}

.brochure-faqs .content .open-answer.active:before {
  color: #f04e23;
  content: "-";
}

@media (min-width: 48em) {
  .brochure-faqs .content .open-answer {
    display: none;
  }
}

.no-js .brochure-faqs .content .open-answer {
  display: none;
}

@media (max-width: 48em) {
  .js .brochure-faqs .content .answer {
    display: none;
  }
}

@media (min-width: 48em) {
  .js .brochure-faqs .content .answer {
    display: block !important;
  }
}

.brochure-faqs [class*="title"] + .content {
  margin-top: 2.5%;
}

.brochure-block .btn-group,
.brochure-block-inverted .btn-group,
.brochure-block-inverted .btn-group {
  width: 100% !important;
  margin-top: 24px;
  margin-top: 1.5rem;
}

@media (max-width: 48em) {
  .brochure-block .btn-group > .btn,
  .brochure-block-inverted .btn-group > .btn,
  .brochure-block-inverted .btn-group > .btn {
    display: block;
  }
}

@media (min-width: 48em) {
  .brochure-block .btn-group,
  .brochure-block-inverted .btn-group,
  .brochure-block-inverted .btn-group {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .brochure-block .btn-group::after,
  .brochure-block-inverted .btn-group::after,
  .brochure-block-inverted .btn-group::after {
    clear: both;
    content: "";
    display: table;
  }

  .brochure-block .btn-group > .btn,
  .brochure-block-inverted .btn-group > .btn,
  .brochure-block-inverted .btn-group > .btn {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    margin-bottom: 8px;
    margin-bottom: 0.5rem;
  }

  .brochure-block .btn-group > .btn:nth-child(2),
  .brochure-block-inverted .btn-group > .btn:nth-child(2),
  .brochure-block-inverted .btn-group > .btn:nth-child(2) {
    float: right;
    margin-right: 0;
  }
}

.brochure-deals .product-image img {
  max-height: 350px;
  float: right;
}

.brochure-deals h1 {
  text-align: center;
  margin-bottom: 64px;
  margin-bottom: 4rem;
}

.brochure-deals .deals {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

@media (min-width: 48em) {
  .brochure-deals .deals {
    width: 74.28571%;
    float: left;
    margin-right: 2.85714%;
    margin-right: auto;
    float: none;
  }
}

@media (min-width: 75em) {
  .brochure-deals .deals {
    width: 57.14286%;
    float: left;
    margin-right: 2.85714%;
    margin-right: auto;
    float: none;
  }
}

.brochure-deals .deals h3 b {
  font-family: "Telkom123-Bold", sans-serif;
  font-weight: normal;
}

.brochure-deals .deals .deal-image {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.brochure-deals .deals .deal-image img {
  width: 50%;
}

@media (min-width: 48em) {
  .brochure-deals .deals .deal-image img {
    width: 75%;
  }
}

@media (min-width: 48em) {
  .brochure-deals .deals .deal-image {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }
}

.brochure-deals .deals .deal-text {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  text-align: left;
}

.brochure-deals .deals .deal-text h2 {
  color: #0083c2;
  margin: 0;
  line-height: 36.8px;
  line-height: 2.3rem;
}

.brochure-deals .deals .deal-text h2.text-black {
  color: #000000;
}

@media (min-width: 48em) {
  .brochure-deals .deals .deal-text {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

.future-business {
  padding-bottom: 0;
}

.future-business img {
  width: 75%;
}

.future-business .description {
  padding-bottom: 6%;
}

.flatpage {
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
}

.flatpage h3 {
  font-size: 32px;
  font-size: 2rem;
  line-height: 34.4px;
  line-height: 2.15rem;
}

.flatpage h4 {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 25.8px;
  line-height: 1.6125rem;
}

.flatpage table {
  width: 100%;
}

.flatpage table tr {
  border-bottom: 1px solid #e8e7e7;
}

.flatpage table tr:last-child {
  border: 0;
}

.flatpage table th,
.flatpage table td {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  text-align: left;
  vertical-align: middle;
}

.flatpage table th {
  width: 40%;
}

.sitemap {
  padding-left: 5%;
  padding-right: 5%;
  padding-bottom: 36px;
  padding-bottom: 2.25rem;
}

.sitemap:after {
  clear: both;
}

.sitemap > .title {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
  color: #000000;
  margin-top: 36px;
  margin-top: 2.25rem;
  margin-bottom: 36px;
  margin-bottom: 2.25rem;
}

.message-splash .description {
  text-align: left;
}

.message-splash .description h1,
.message-splash .description p {
  color: #0083c2;
}

.message-splash .description h1 {
  font-family: "Telkom123-Bold", sans-serif;
}

@media (min-width: 62em) {
  .message-splash .description h1 {
    font-size: 68px;
    font-size: 4.25rem;
    line-height: 73.1px;
    line-height: 4.56875rem;
    letter-spacing: -3px;
    letter-spacing: -0.1875rem;
  }
}

@media (min-width: 93.75rem) {
  .message-splash .description h1 {
    font-size: 84px;
    font-size: 5.25rem;
    line-height: 90.3px;
    line-height: 5.64375rem;
  }
}

.message-splash .description p {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 31.2px;
  line-height: 1.95rem;
  margin: 1rem 0 1.5rem 0;
}

@media (min-width: 48em) {
  .drawer.rich-text .shop-wizard-product .product-image,
  .drawer.rich-text .shop-wizard-product .product-details {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media (min-width: 48em) {
  .drawer.rich-text .shop-wizard-product .product-image + .product-details,
  .drawer.rich-text .shop-wizard-product .product-details + .product-details {
    float: right;
    margin-right: 0;
  }
}

/* Pages */

.page-ftth .background {
  min-height: inherit;
}

@media (min-width: 48em) and (orientation: portrait) {
  .page-ftth .background {
    padding-top: 35%;
  }
}

.page-ftth .irs .irs-slider {
  background: #f04e23;
}

.page-ftth .irs .irs-bar,
.page-ftth .irs-bar-edge {
  background: #f04e23;
  border-color: #f04e23;
}

.page-ftth .js-irs-0 {
  z-index: 600;
  position: absolute;
  top: 5%;
  left: 5%;
  right: 5%;
}

@media (min-width: 48em) {
  .page-ftth .js-irs-0 {
    top: auto;
    bottom: 20px;
  }
}

.page-ftth .btn.active {
  display: none;
}

#ftth-slider-container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

#ftth-slider-container img {
  max-width: inherit !important;
}

#ftth-slider {
  display: none;
}

.overflow-container {
  overflow: hidden;
  position: relative;
  background-color: #32bfdd;
  height: 100%;
}

.scroll-container {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  overflow-x: hidden;
  overflow-y: hidden;
}

.layer-container {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
}

.full-width {
  width: auto;
  height: 100%;
}

.redraw-fix {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}

.layer-fix {
  position: absolute;
  top: 0;
  left: 0;
}

#design {
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.5;
  z-index: 20;
}

#landscape {
  z-index: 0;
  max-height: 1080px;
  height: 100%;
}

#middleground-home {
  z-index: 3;
  position: absolute;
  width: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

#foreground-home {
  z-index: 6;
  position: absolute;
  width: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

#red-rocket {
  z-index: 2;
  position: absolute;
  bottom: 29%;
  left: 32.2%;
  width: 1.7%;
  -webkit-animation: rocket-launch 12s linear infinite;
  animation: rocket-launch 12s linear infinite;
}

#sign1 {
  z-index: 7;
  position: absolute;
  bottom: 26%;
  left: 36.9%;
  width: 1.1%;
  -webkit-animation: floatsign 5s ease-in-out infinite;
  animation: floatsign 5s ease-in-out infinite;
}

#sign2 {
  z-index: 7;
  position: absolute;
  bottom: 26%;
  left: 41.45%;
  width: 1%;
  -webkit-animation: floatsign 4s ease-in-out infinite;
  animation: floatsign 4s ease-in-out infinite;
}

#sign3 {
  z-index: 7;
  position: absolute;
  bottom: 31.6%;
  left: 37.9%;
  width: 0.8%;
}

#sign4 {
  z-index: 7;
  position: absolute;
  bottom: 22%;
  left: 38.32%;
  width: 0.55%;
  -webkit-animation: floatsign 4.5s ease-in-out infinite;
  animation: floatsign 4.5s ease-in-out infinite;
}

#billboard1 {
  z-index: 7;
  position: absolute;
  bottom: 56%;
  left: 45.65%;
  width: 1.35%;
  -webkit-animation: floatsign 5s ease-in-out infinite;
  animation: floatsign 5s ease-in-out infinite;
}

#billboard2 {
  z-index: 7;
  position: absolute;
  bottom: 62%;
  left: 47.19%;
  width: 2.6%;
  -webkit-animation: floatsign 3s ease-in-out infinite;
  animation: floatsign 3s ease-in-out infinite;
}

#car-green {
  z-index: 4;
  position: absolute;
  bottom: 23.1%;
  left: 46.15%;
  width: 0.95%;
  -webkit-animation: ltrpath 30s infinite linear;
  animation: ltrpath 30s infinite linear;
}

#car-pink {
  z-index: 4;
  position: absolute;
  bottom: 25.7%;
  left: 53.1%;
  width: 1.1%;
  -webkit-animation: rtlpath 30s infinite linear;
  animation: rtlpath 30s infinite linear;
}

#car-blue {
  z-index: 4;
  position: absolute;
  bottom: 23.1%;
  left: 67.69%;
  width: 1.1%;
  -webkit-animation: ltrpath 30s infinite linear;
  animation: ltrpath 30s infinite linear;
}

#car-yellow {
  z-index: 4;
  position: absolute;
  bottom: 25.7%;
  left: 70.6;
  width: 1%;
  -webkit-animation: rtlpath 30s infinite linear;
  animation: rtlpath 30s infinite linear;
}

#car-orange {
  z-index: 4;
  position: absolute;
  bottom: 26.1%;
  left: 75.18%;
  width: 1%;
  -webkit-animation: rtlpath 30s infinite linear;
  animation: rtlpath 30s infinite linear;
}

#train1 {
  z-index: 2;
  position: absolute;
  bottom: 41%;
  left: 69%;
  width: 2.4%;
  -webkit-animation: train1 9s ease-in-out infinite;
  animation: train1 9s ease-in-out infinite;
}

#train2 {
  z-index: 2;
  position: absolute;
  bottom: 45.5%;
  left: 77.5%;
  width: 2.4%;
  -webkit-animation: train2 10s ease-in-out infinite;
  animation: train2 10s ease-in-out infinite;
}

#train-tunnel {
  z-index: 3;
  position: absolute;
  bottom: 45.5%;
  left: 68.75%;
  width: 2.73%;
  height: 4%;
}

#bubble-main {
  z-index: 5;
  position: absolute;
  bottom: 24.1%;
  left: 3%;
  width: 8%;
}

@media only screen and (min-width: 480px) {
  #bubble-main {
    left: 10%;
  }
}

@media only screen and (min-width: 900px) {
  #bubble-main {
    left: 23.4%;
  }
}

#bubble-2 {
  position: absolute;
  bottom: 47.5%;
  left: 34.05%;
  width: 5.5%;
}

#bubble-3 {
  position: absolute;
  bottom: 38%;
  left: 39.3%;
  width: 5.5%;
}

#bubble-4 {
  position: absolute;
  bottom: 38%;
  left: 48.4%;
  width: 5.5%;
}

#bubble-5 {
  position: absolute;
  bottom: 57.3%;
  left: 56.7%;
  width: 5.5%;
}

#bubble-6 {
  position: absolute;
  bottom: 31.2%;
  left: 64.5%;
  width: 5.5%;
}

#bubble-7 {
  position: absolute;
  bottom: 68.15%;
  left: 69.55%;
  width: 5.5%;
}

#bubble-learn-more {
  display: block;
  position: absolute;
  bottom: 50%;
  left: 79.55%;
  width: 5.5%;
  z-index: 60;
}

#bubble-learn-more img {
  width: 100%;
}

.bubble {
  position: absolute;
  z-index: 60;
  width: 3%;
}

@media (max-width: 48em) {
  .bubble {
    -webkit-animation: flickerAnimation 2s infinite alternate none;
    animation: flickerAnimation 2s infinite alternate none;
    -webkit-transition: 1s ease;
    transition: 1s ease;
  }
}

.bubble-expand {
  -webkit-animation: none;
  animation: none;
  -webkit-transform: scale(2.5) translateY(25%);
  transform: scale(2.5) translateY(25%);
  bottom: 50% !important;
  z-index: 70;
}

@media (min-width: 48em) and (orientation: portrait) {
  #ftth-slider-container .overflow-container,
  #ftth-slider-container #landscape {
    min-height: 600px !important;
  }
}

@media (min-width: 62em) {
  #ftth-wizard {
    position: relative;
    margin: initial;
    left: initial;
    right: initial;
    width: 100%;
    height: auto;
  }

  #ftth-wizard .hero-cta {
    padding: 3% 7%;
  }

  #ftth-wizard .hero-section-slider {
    padding-bottom: 3%;
  }
}

@-webkit-keyframes flickerAnimation {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0.3;
  }

  100% {
    opacity: 1;
  }
}

@keyframes flickerAnimation {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0.3;
  }

  100% {
    opacity: 1;
  }
}

@-webkit-keyframes floatsign {
  from {
    -webkit-transform: translate3d(0, 0%, 0);
    transform: translate3d(0, 0%, 0);
  }

  65% {
    -webkit-transform: translate3d(0, 8%, 0);
    transform: translate3d(0, 8%, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0%, 0);
    transform: translate3d(0, 0%, 0);
  }
}

@keyframes floatsign {
  from {
    -webkit-transform: translate3d(0, 0%, 0);
    transform: translate3d(0, 0%, 0);
  }

  65% {
    -webkit-transform: translate3d(0, 8%, 0);
    transform: translate3d(0, 8%, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0%, 0);
    transform: translate3d(0, 0%, 0);
  }
}

@-webkit-keyframes ltrpath {
  0% {
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  100% {
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }
}

@keyframes ltrpath {
  0% {
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  100% {
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }
}

@-webkit-keyframes rtlpath {
  0% {
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  100% {
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }
}

@keyframes rtlpath {
  0% {
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  100% {
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }
}

@-webkit-keyframes train1 {
  0% {
    left: 74%;
  }

  10% {
    left: 74%;
  }

  50% {
    left: 58%;
  }

  60% {
    left: 58%;
  }

  100% {
    left: 74%;
  }
}

@keyframes train1 {
  0% {
    left: 74%;
  }

  10% {
    left: 74%;
  }

  50% {
    left: 58%;
  }

  60% {
    left: 58%;
  }

  100% {
    left: 74%;
  }
}

@-webkit-keyframes train2 {
  0% {
    left: 77.5%;
  }

  10% {
    left: 77.5%;
  }

  50% {
    left: 58.5%;
  }

  60% {
    left: 58.5%;
  }

  100% {
    left: 77.5%;
  }
}

@keyframes train2 {
  0% {
    left: 77.5%;
  }

  10% {
    left: 77.5%;
  }

  50% {
    left: 58.5%;
  }

  60% {
    left: 58.5%;
  }

  100% {
    left: 77.5%;
  }
}

@-webkit-keyframes rocket-launch {
  0% {
    -webkit-transform: translate3d(0, 74%, 0);
    transform: translate3d(0, 74%, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 0%, 0);
    transform: translate3d(0, 0%, 0);
  }

  75.5% {
    -webkit-transform: translateX(-1%);
    transform: translateX(-1%);
  }

  76% {
    -webkit-transform: translateX(1%);
    transform: translateX(1%);
  }

  76.5% {
    -webkit-transform: translateX(-1%);
    transform: translateX(-1%);
  }

  77% {
    -webkit-transform: translateX(1%);
    transform: translateX(1%);
  }

  77.5% {
    -webkit-transform: translateX(-1%);
    transform: translateX(-1%);
  }

  78% {
    -webkit-transform: translateX(1%);
    transform: translateX(1%);
  }

  78.5% {
    -webkit-transform: translateX(-1%);
    transform: translateX(-1%);
  }

  79% {
    -webkit-transform: translateX(1%);
    transform: translateX(1%);
  }

  79.5% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }

  80% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  100% {
    -webkit-transform: translate3d(0, -800%, 0);
    transform: translate3d(0, -800%, 0);
  }
}

@keyframes rocket-launch {
  0% {
    -webkit-transform: translate3d(0, 74%, 0);
    transform: translate3d(0, 74%, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 0%, 0);
    transform: translate3d(0, 0%, 0);
  }

  75.5% {
    -webkit-transform: translateX(-1%);
    transform: translateX(-1%);
  }

  76% {
    -webkit-transform: translateX(1%);
    transform: translateX(1%);
  }

  76.5% {
    -webkit-transform: translateX(-1%);
    transform: translateX(-1%);
  }

  77% {
    -webkit-transform: translateX(1%);
    transform: translateX(1%);
  }

  77.5% {
    -webkit-transform: translateX(-1%);
    transform: translateX(-1%);
  }

  78% {
    -webkit-transform: translateX(1%);
    transform: translateX(1%);
  }

  78.5% {
    -webkit-transform: translateX(-1%);
    transform: translateX(-1%);
  }

  79% {
    -webkit-transform: translateX(1%);
    transform: translateX(1%);
  }

  79.5% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
  }

  80% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  100% {
    -webkit-transform: translate3d(0, -800%, 0);
    transform: translate3d(0, -800%, 0);
  }
}

.brochure-wifi {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.brochure-wifi .hero-wifi {
  background-color: #f7f7f7;
}

.brochure-wifi .hero-wifi .backdrop {
  background-size: 88%;
  background-position: 199% 50%;
}

@media (min-width: 48em) and (orientation: portrait) {
  .brochure-wifi .hero-wifi .backdrop {
    background-size: 60%;
    background-position: 95% 10%;
  }
}

@media (min-width: 62em) {
  .brochure-wifi .hero-wifi .backdrop {
    background-size: 36%;
    background-position: 80% 50%;
  }
}

@media (min-width: 75em) {
  .brochure-wifi .hero-wifi .backdrop {
    background-size: 30%;
  }
}

.brochure-wifi .hero .plain-title {
  max-height: 13rem;
}

.brochure-wifi .hero .plain-title .desc {
  font-size: 1.25rem;
  line-height: 1.45rem;
}

.brochure-wifi .hero .plain-title h1 {
  font-size: 36px;
  line-height: 36px;
}

.brochure-wifi .hero-new img {
  display: block;
}

@media (min-width: 48em) {
  .brochure-wifi .hero .plain-title {
    max-height: 22rem;
  }

  .brochure-wifi .hero .plain-title h1 {
    font-size: 5.25rem;
    line-height: 5.25rem;
  }

  .brochure-wifi .hero .plain-title .desc {
    width: 300px;
    font-size: 1.75rem;
    line-height: 1.95rem;
  }
}

.brochure-wifi .brochure-map {
  border: 20px solid #ffffff;
}

.brochure-wifi #prepaid table {
  width: 90%;
  margin: 30px auto;
}

@media (min-width: 90.0625em) {
  .brochure-wifi #prepaid table {
    width: 100%;
  }
}

.brochure-wifi #prepaid table tr {
  border-bottom: 1px solid #889391;
}

.brochure-wifi #prepaid table tr.no-border {
  border-bottom: none;
}

.brochure-wifi #prepaid table td {
  padding: 10px;
  color: #2695cb;
  text-align: center;
  border-right: 1px solid #889391;
  font-size: 17.5px;
}

.brochure-wifi #prepaid table td.purple {
  color: #da1b5f;
  font-weight: bold;
}

.brochure-wifi #prepaid table td.no-border {
  border-right: none;
}

.brochure-wifi .call-us {
  position: relative;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  background: #005e9b;
  color: #ffffff;
  text-align: center;
}

.brochure-wifi .call-us .title-center {
  margin-bottom: 1.5rem;
}

.brochure-wifi .call-us .big-text {
  font-size: 30px;
}

.brochure-wifi .call-us .big-text img {
  display: inline-block;
  height: 50px;
  width: auto;
  vertical-align: middle;
}

.brochure-wifi .call-us .increased-text {
  color: #ffffff;
  font-size: 19.2px;
  font-size: 1.2rem;
}

.brochure-wifi .call-us h1,
.brochure-wifi .call-us a {
  color: #ffffff;
}

@media (min-width: 48em) {
  .brochure-wifi .big-text {
    font-size: 48px;
  }

  .brochure-wifi .big-text img {
    height: 75px;
  }
}

.brochure-wifi .qualify {
  background: #0083c2;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  position: relative;
}

.brochure-wifi .qualify .do-i-qualify {
  display: none;
}

.brochure-wifi .qualify .do-i-qualify input#id_wifi_contract::-webkit-input-placeholder {
  color: #ffffff;
}

.brochure-wifi .qualify .do-i-qualify input#id_wifi_contract:-moz-placeholder {
  color: #ffffff;
}

.brochure-wifi .qualify .do-i-qualify input#id_wifi_contract::-moz-placeholder {
  color: #ffffff;
}

.brochure-wifi .qualify .do-i-qualify input#id_wifi_contract:-ms-input-placeholder {
  color: #ffffff;
}

.brochure-wifi .qualify .do-i-qualify .field .SumoSelect .SelectBox span {
  font-size: 19.2px;
  font-size: 1.2rem;
}

.brochure-wifi .qualify .do-i-qualify .field .SumoSelect li {
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
}

.brochure-wifi .qualify .do-i-qualify .field .SumoSelect li label {
  font-size: 19.2px;
  font-size: 1.2rem;
}

.brochure-wifi .qualify .do-i-qualify .title-center {
  color: #ffffff;
  margin-bottom: 1rem;
}

.brochure-wifi .qualify .do-i-qualify .form-group,
.brochure-wifi .qualify .do-i-qualify .buttons {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.brochure-wifi .qualify .do-i-qualify .field {
  border-color: #4687b2;
}

.brochure-wifi .qualify .do-i-qualify .field .SelectBox {
  padding: 0.7rem 1rem 0.8rem;
}

.brochure-wifi .qualify .do-i-qualify .field .optWrapper {
  border-color: #0083c2;
}

.brochure-wifi .qualify .do-i-qualify .message-large-success,
.brochure-wifi .qualify .do-i-qualify .message-large-error {
  color: #ffffff;
  padding-bottom: 0;
}

.brochure-wifi .qualify .do-i-qualify .message-large-success h2,
.brochure-wifi .qualify .do-i-qualify .message-large-success p,
.brochure-wifi .qualify .do-i-qualify .message-large-error h2,
.brochure-wifi .qualify .do-i-qualify .message-large-error p {
  color: #ffffff;
}

.brochure-wifi .qualify .do-i-qualify .label {
  color: #ffffff;
}

.brochure-wifi .qualify .do-i-qualify .btn-lime {
  display: block;
}

.brochure-wifi .qualify .do-i-qualify [type="submit"] {
  width: 100%;
}

.brochure-wifi .qualify .do-i-qualify input[type="text"],
.brochure-wifi .qualify .do-i-qualify input[type="password"] {
  color: #ffffff;
}

.brochure-wifi .qualify .do-i-qualify input[type="text"]:active,
.brochure-wifi .qualify .do-i-qualify input[type="password"]:active {
  color: #ffffff;
}

.brochure-wifi .qualify .do-i-qualify input[type="text"]:focus,
.brochure-wifi .qualify .do-i-qualify input[type="password"]:focus {
  color: #ffffff;
}

.brochure-wifi .qualify .do-i-qualify input[type="text"]::-webkit-input-placeholder,
.brochure-wifi .qualify .do-i-qualify input[type="password"]::-webkit-input-placeholder {
  color: #2695cb;
}

.brochure-wifi .qualify .do-i-qualify input[type="text"]:-moz-placeholder,
.brochure-wifi .qualify .do-i-qualify input[type="password"]:-moz-placeholder {
  color: #2695cb;
}

.brochure-wifi .qualify .do-i-qualify input[type="text"]::-moz-placeholder,
.brochure-wifi .qualify .do-i-qualify input[type="password"]::-moz-placeholder {
  color: #2695cb;
}

.brochure-wifi .qualify .do-i-qualify input[type="text"]:-ms-input-placeholder,
.brochure-wifi .qualify .do-i-qualify input[type="password"]:-ms-input-placeholder {
  color: #2695cb;
}

.brochure-wifi .qualify .do-i-qualify:after {
  content: "";
  clear: both;
  display: block;
}

.brochure-wifi .qualify .do-i-qualify .buttons .btn-pink {
  border: 1px solid #743a7c;
}

@media (min-width: 48em) {
  .brochure-wifi .qualify .do-i-qualify .form-group {
    width: 35.71429%;
    float: none;
    margin: 0 auto;
  }
}

.brochure-wifi .qualify .buy-prepaid-wifi {
  padding-top: 24px;
  padding-top: 1.5rem;
  padding-bottom: 48px;
  padding-bottom: 3rem;
}

.brochure-wifi .qualify .buy-prepaid-wifi h1,
.brochure-wifi .qualify .buy-prepaid-wifi p {
  text-align: center;
  color: #ffffff;
}

.brochure-wifi .qualify .buy-prepaid-wifi p a {
  color: #ffffff;
}

.brochure-wifi .qualify .buy-prepaid-wifi .buy-circles {
  width: 90%;
  margin: 20px auto 0;
  text-align: center;
}

.brochure-wifi .qualify .buy-prepaid-wifi .buy-circles img {
  margin: 0 10px;
  width: 86px;
  height: auto;
}

@media (min-width: 48em) {
  .brochure-wifi .qualify .buy-prepaid-wifi .buy-circles {
    width: 464px;
    margin: 30px auto 0;
  }

  .brochure-wifi .qualify .buy-prepaid-wifi .buy-circles img {
    margin: 0 20px;
    width: 172px;
    height: auto;
  }
}

.brochure-wifi .qualify .how-do-i-get-it {
  display: none;
}

.brochure-wifi .qualify .how-do-i-get-it h1 {
  margin-bottom: 40px;
  text-align: center;
  color: #ffffff;
}

.brochure-wifi .qualify .how-do-i-get-it p {
  text-align: center;
  color: #ffffff;
}

.brochure-wifi .qualify .how-do-i-get-it p a {
  color: #ffffff;
}

@media (min-width: 90.0625em) {
  .brochure-wifi .qualify .how-do-i-get-it .brochure-selling-points {
    max-width: 70%;
  }
}

.brochure-wifi #setup {
  padding-left: 0;
  padding-right: 0;
  position: relative;
}

.brochure-wifi .setup-android {
  display: block;
}

.brochure-wifi .setup-ios,
.brochure-wifi .setup-blackberry {
  display: none;
}

@media (max-width: 960px) {
  .brochure-wifi #setup {
    display: none;
    visibility: none;
    height: 0;
    overflow: hidden;
  }
}

.brochure-wifi .wififour-android,
.brochure-wifi .wififour-ios,
.brochure-wifi .wififour-blackberry {
  background-position: 50% 0;
  background-repeat: no-repeat;
}

.brochure-wifi .android-item-solutions div,
.brochure-wifi android-item-network div,
.brochure-wifi .ios-item-solutions div,
.brochure-wifi ios-item-network div,
.brochure-wifi .blackberry-item-solutions div,
.brochure-wifi blackberry-item-network div {
  display: none;
}

.brochure-wifi .new-container {
  width: 960px;
  margin: 0 auto;
  position: relative;
}

.brochure-wifi .new-container,
.brochure-wifi .set-up-device-holder {
  position: relative;
}

.brochure-wifi .set-up-device-holder {
  height: 505px;
}

.brochure-wifi .brochure-wifi .set-up-device-holder .android-holder,
.brochure-wifi .brochure-wifi .set-up-device-holder .ios-holder,
.brochure-wifi .brochure-wifi .set-up-device-holder .blackberry-holder {
  height: 506px;
  width: 100%;
}

.brochure-wifi .set-up-device-holder h2 {
  color: #ffffff;
  margin-top: 0;
  margin-bottom: 0;
  padding: 60px 0 0 490px;
  font-size: 2.25rem;
  line-height: 2.5rem;
}

.brochure-wifi ul.device-nav {
  list-style: none;
  position: absolute;
  top: 132px;
  right: -10px;
}

.brochure-wifi ul.device-nav li {
  float: left;
}

.brochure-wifi ul.device-nav a {
  display: inline-block;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  margin-right: 10px;
  background-size: contain;
}

.brochure-wifi ul.device-nav .ios {
  margin-top: -2px;
}

.brochure-wifi ul.device-nav .blackberry {
  margin-top: 5px;
}

.brochure-wifi .secondary {
  margin: 250px 0 0 490px;
}

.brochure-wifi .open-popup-link {
  display: inline-block;
}

.brochure-wifi .android-item-solutions img {
  position: absolute;
  top: 51px;
  left: 27px;
}

.brochure-wifi .ios-item-solutions img {
  position: absolute;
  top: 50px;
  left: 26px;
}

.brochure-wifi .blackberry-item-solutions img {
  position: absolute;
  top: 51px;
  left: 30px;
}

.brochure-wifi ul.device-navigator {
  position: absolute;
  left: 0;
  z-index: 300;
  padding: 0 0 0 490px;
}

.brochure-wifi ul.device-navigator li {
  list-style: none;
  margin-bottom: 0.5em;
}

.brochure-wifi ul.device-navigator li a {
  color: #ffffff;
  text-decoration: none;
  font-size: 20px;
  opacity: 0.5;
}

.brochure-wifi ul.device-navigator li a span {
  display: inline-block;
  background-color: #bfd730;
  width: 25px;
  height: 25px;
  border-radius: 25px;
  margin-right: 20px;
  text-align: center;
  line-height: 25px;
  font-size: 14px;
}

.brochure-wifi ul.device-navigator li a.active {
  opacity: 1;
}

.brochure-wifi .device-navigator-network,
.brochure-wifi device-navigator-contract {
  display: none;
}

.brochure-wifi p.step-text {
  position: relative;
  top: 180px;
  font-size: 16px;
}

.brochure-wifi .set-up-device-holder p {
  color: #fff;
  font-size: 20px;
  text-align: left;
  padding: 0 20px 0 490px;
}

.brochure-wifi .triangle {
  position: absolute;
  left: calc(50% - 1.5em);
  top: 0;
  z-index: 5;
}

.brochure-wifi .triangle > i {
  position: absolute;
  display: inline-block;
  width: 0;
  height: 0;
  line-height: 0;
  border: 1.5em solid transparent;
  border-top: 1.5em solid #0083c2;
  left: 0;
  top: 0;
}

.brochure-wifi .triangle-white > i {
  border-top: 1.5em solid #ffffff;
}

.brochure-wifi .triangle-map > i {
  border-top: 1.5em solid #e9e6dd;
}

.brochure-wifi #participating .brochure-selling-points {
  padding-top: 16px;
  padding-top: 1rem;
  text-align: center;
}

.brochure-wifi #participating .brochure-selling-points .item .focal-point {
  margin-bottom: 0;
}

.brochure-wifi #participating .increased-text {
  margin-top: 48px;
  margin-top: 3rem;
  margin-bottom: 48px;
  margin-bottom: 3rem;
}

@media (min-width: 48em) {
  .brochure-wifi #participating .brochure-selling-points {
    text-align: inherit;
  }
}

@media (min-width: 48em) and (max-width: 75em) {
  .brochure-wifi #participating .brochure-selling-points .item {
    width: 22.85714%;
    float: left;
  }
}

#secondarypop {
  width: 555px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 150px;
}

#secondarypop .secondary-container {
  position: relative;
  background-color: #ffffff;
}

#secondarypop .secondary-container img.laptop {
  position: absolute;
  left: 127.5px;
  top: -140px;
}

#secondarypop .secondary-container a.close {
  position: absolute;
  right: 0;
  top: -42px;
  width: auto;
  height: auto;
  padding: 1.025rem 1rem 0.9rem 2.2rem;
  font-size: 11.2px;
  font-size: 0.7rem;
  line-height: 9.6px;
  line-height: 0.6rem;
  display: inline-block;
  color: #fff;
  font-family: "FSAlbertWebBold", sans-serif;
  text-transform: uppercase;
  text-decoration: none;
  border: 1px solid transparent;
  background-position: center;
  background-size: 15px;
  background-image: url('/today/static/web/img/icons/icon-library/close.svg?6bc426389c1e');
}

#secondarypop .secondary-container h2 {
  font-family: "Telkom123-Bold", sans-serif;
  padding-top: 122px;
}

#secondarypop .secondary-container h3 {
  padding-bottom: 30px;
}

#secondarypop .secondary-container h2,
#secondarypop .secondary-container h3 {
  text-align: center;
  color: #0083c2;
  padding-left: 20px;
  padding-right: 20px;
}

#secondarypop .secondary-container .secondary-tabs div {
  float: left;
  width: 185px;
  background-color: #f7f7f7;
  color: #889391;
  font-size: 17.5px;
  box-sizing: border-box;
  text-align: center;
  padding: 13px 0;
}

#secondarypop .secondary-container .secondary-tabs div.active {
  background-color: #0083c2;
  color: #ffffff;
}

#secondarypop .secondary-container .secondary-tabs div.tab-win {
  border-left: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
}

#secondarypop .secondary-container .secondary-tabs div.tab-win.active {
  border-left: 1px solid #0083c2;
  border-right: 1px solid #0083c2;
}

#secondarypop .secondary-container #instructions-linux,
#secondarypop .secondary-container #instructions-win {
  display: none;
}

#secondarypop .secondary-container .instructions {
  background-color: #0083c2;
  color: #ffffff;
  padding: 20px 20px 60px;
  clear: left;
}

#secondarypop .secondary-container .instructions h4 {
  color: #ffffff;
  font-family: "Telkom123-Bold", sans-serif;
}

#secondarypop .secondary-container .instructions ol,
#secondarypop .secondary-container .instructions li {
  margin-left: 0;
}

#secondarypop .secondary-container .instructions ol {
  padding-left: 20px;
}

.page-ftth .brochure-hero-nav {
  margin-top: 0;
  margin: auto;
  padding: 48px;
  padding: 3rem;
  text-align: center;
}

@media (min-width: 62em) {
  .page-ftth .brochure-hero-nav [class*="pill"].active:after {
    border-width: 20px;
    border-width: 1.25rem;
  }
}

.page-ftth .brochure-hero-nav li {
  margin: 0;
}

@media (min-width: 48em) {
  .page-ftth .brochure-hero-nav li {
    margin-left: 4px;
    margin-left: 0.25rem;
    margin-right: 4px;
    margin-right: 0.25rem;
  }
}

.page-ftth .brochure-hero-nav a {
  background-color: #ffffff;
  border: 2px solid #cccccc;
  color: #cccccc;
  padding-top: 9.6px;
  padding-top: 0.6rem;
  padding-bottom: 13.6px;
  padding-bottom: 0.85rem;
}

.page-ftth .brochure-hero-nav a:hover {
  background-color: #ffffff;
  border-color: #0083c2;
  color: #0083c2;
}

.page-ftth .brochure-hero-nav a.active {
  background-color: #0083c2;
  padding-top: 10.4px;
  padding-top: 0.65rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  border: 0;
  color: #ffffff;
}

.page-ftth .brochure-hero-nav a.active:hover:after {
  border-top-color: #0083c2 !important;
}

.page-ftth .coverage-map-container {
  background: #f7f7f7;
}

.page-ftth .coverage-map-container .coverage-map {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  position: relative;
}

@media (min-width: 48em) {
  .page-ftth .coverage-map-container .coverage-map {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }
}

.page-ftth .coverage-map-container .coverage-map h1 {
  margin-top: 0;
  font-size: 32px;
  font-size: 2rem;
  line-height: 32px;
  line-height: 2rem;
}

.page-ftth .coverage-map-container .coverage-products {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding: 16px;
  padding: 1rem;
}

@media (min-width: 48em) {
  .page-ftth .coverage-map-container .coverage-products {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
    padding-top: 32px;
    padding-top: 2rem;
  }
}

.page-ftth .coverage-map-container .coverage-products h1,
.page-ftth .coverage-map-container .coverage-products h2 {
  color: #0083c2;
}

.page-ftth .coverage-map-container .coverage-products ul li {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 16px;
  padding-top: 1rem;
}

@media (min-width: 48em) {
  .page-ftth .coverage-map-container .coverage-products ul li {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }
}

@media (min-width: 48em) {
  .page-ftth .coverage-map-container .coverage-products ul li:nth-child(2n) {
    float: right;
    margin-right: 0;
  }
}

.page-ftth .coverage-map-container .coverage-products ul h3 {
  color: #889391;
  font-size: 32px;
  font-size: 2rem;
  line-height: 40px;
  line-height: 2.5rem;
  font-family: "Telkom123-Light", sans-serif;
  letter-spacing: -2px;
}

.page-ftth .coverage-map-container .coverage-products ul a {
  display: block;
  text-decoration: none;
  color: #889391;
}

.page-ftth .coverage-map-container .coverage-products img {
  width: 160px;
  width: 10rem;
  padding-right: 16px;
  padding-right: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  display: block;
  float: left;
}

.page-ftth .coverage-map-container .search-inpage {
  width: 100%;
  z-index: 1;
  background: #0083c2;
  padding: 16px;
  padding: 1rem;
  padding-top: 6.4px;
  padding-top: 0.4rem;
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
}

@media (min-width: 48em) {
  .page-ftth .coverage-map-container .search-inpage {
    width: 288px;
    width: 18rem;
    border-radius: 3px;
    position: absolute;
    top: 32px;
    top: 2rem;
    left: 112px;
    left: 7rem;
  }
}

@media (min-width: 62em) {
  .page-ftth .coverage-map-container .search-inpage {
    width: 352px;
    width: 22rem;
  }
}

.page-ftth .coverage-map-container .search-inpage .inpage {
  border: 0;
  padding: 0;
}

.page-ftth .coverage-map-container .search-inpage input {
  width: 100%;
  color: #ffffff;
}

.page-ftth .coverage-map-container .search-inpage input::-webkit-input-placeholder {
  color: #ffffff;
}

.page-ftth .coverage-map-container .search-inpage input::-moz-placeholder {
  color: #ffffff;
}

.page-ftth .coverage-map-container .search-inpage input:-moz-placeholder {
  color: #ffffff;
}

.page-ftth .coverage-map-container .search-inpage input:-ms-input-placeholder {
  color: #ffffff;
}

.page-ftth .coverage-map-container .search-state {
  width: 100%;
  padding: 16px;
  padding: 1rem;
  background: #0083c2;
  color: #ffffff;
  z-index: 1;
}

@media (min-width: 48em) {
  .page-ftth .coverage-map-container .search-state {
    width: 320px;
    width: 20rem;
    border-radius: 3px;
    position: absolute;
    bottom: 32px;
    bottom: 2rem;
    right: 32px;
    right: 2rem;
  }
}

.page-ftth .coverage-map-container .search-state a {
  color: #ffffff;
  margin: 0;
}

.page-ftth .coverage-map-container .brochure-map {
  min-height: 600px;
}

.page-ftth #futurecrib .lead-form .field,
.page-ftth #futurecrib .lead-form-blue .field {
  background-color: #ffffff;
  border: 0;
  margin-bottom: 2.85714%;
}

.page-ftth #futurecrib .lead-form p.SelectBox,
.page-ftth #futurecrib .lead-form-blue p.SelectBox {
  margin: 0;
}

.page-ftth #futurecrib .lead-form input:not([type="submit"]),
.page-ftth #futurecrib .lead-form-blue input:not([type="submit"]) {
  color: #0083c2;
}

.page-ftth #futurecrib .lead-form input:not([type="submit"])::-webkit-input-placeholder,
.page-ftth #futurecrib .lead-form-blue input:not([type="submit"])::-webkit-input-placeholder {
  color: #0083c2;
}

.page-ftth #futurecrib .lead-form input:not([type="submit"])::-moz-placeholder,
.page-ftth #futurecrib .lead-form-blue input:not([type="submit"])::-moz-placeholder {
  color: #0083c2;
}

.page-ftth #futurecrib .lead-form input:not([type="submit"]):-moz-placeholder,
.page-ftth #futurecrib .lead-form-blue input:not([type="submit"]):-moz-placeholder {
  color: #0083c2;
}

.page-ftth #futurecrib .lead-form input:not([type="submit"]):-ms-input-placeholder,
.page-ftth #futurecrib .lead-form-blue input:not([type="submit"]):-ms-input-placeholder {
  color: #0083c2;
}

.page-ftth #futurecrib .lead-form label,
.page-ftth #futurecrib .lead-form-blue label {
  background-color: #ffffff;
  color: #0083c2;
}

@media (min-width: 48em) {
  .page-ftth #futurecrib .futurecrib-image {
    -webkit-transform: scale(1.2) translateX(-8.5%);
    transform: scale(1.2) translateX(-8.5%);
  }
}

.page-lte-referral .container {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.page-lte-referral .container::after {
  clear: both;
  content: "";
  display: table;
}

@media (min-width: 48em) {
  .page-lte-referral .container {
    width: 48.57143%;
    margin: 0 auto;
  }
}

.page-lte-referral .container .subtitle-small {
  width: 100%;
}

.page-lte-referral .form-simple {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 24px;
  margin-top: 1.5rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
}

.page-lte-referral .form-simple::after {
  clear: both;
  content: "";
  display: table;
}

@media (min-width: 48em) {
  .page-lte-referral .form-simple {
    width: 48.57143%;
  }
}

.page-lte-referral .form-simple .button {
  width: 100%;
}

@media (min-width: 48em) {
  .page-lte-referral .form-simple .button {
    width: 48.57143%;
    margin: 0 auto;
    margin-top: 16px;
    margin-top: 1rem;
  }
}

.page-lte-referral .form-simple .button [type="submit"] {
  width: 100%;
}

.page-lte-referral .lte-dash {
  margin-top: 48px;
  margin-top: 3rem;
}

.page-lte-referral .lte-dash .button-unit.one {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 32px;
  padding-top: 2rem;
}

@media (min-width: 48em) {
  .page-lte-referral .lte-dash .button-unit.one {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
    float: none;
    margin: auto;
  }
}

@media (min-width: 62em) {
  .page-lte-referral .lte-dash .button-unit.one {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
    float: none;
    margin: auto;
  }
}

.page-lte-referral .referees-list {
  padding-top: 16px;
  padding-top: 1rem;
}

.page-lte-referral table {
  width: 100%;
}

.page-lte-referral table td {
  padding: 4px;
  padding: 0.25rem;
}

.page-lte-referral table td:first-child {
  padding-left: 0;
}

.page-lte-referral table tr:first-child td {
  padding-top: 0;
}

.page-lte-referral table tr:last-child td {
  padding-bottom: 0;
}

.page-lte-referral .refer-forms {
  margin-top: 24px;
  margin-top: 1.5rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
}

.page-lte-referral .refer-forms form {
  margin-top: 24px;
  margin-top: 1.5rem;
}

.page-lte-referral .referrees {
  margin-top: 32px;
  margin-top: 2rem;
}

.page-lte-referral .referrees p {
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  text-align: center;
  color: #666666;
}

.page-lte-referral .refer-friend,
.page-lte-referral .friend-status {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 16px;
  margin-top: 1rem;
}

.page-lte-referral .refer-friend::after,
.page-lte-referral .friend-status::after {
  clear: both;
  content: "";
  display: table;
}

.page-lte-referral .refer-friend fieldset,
.page-lte-referral .friend-status fieldset {
  padding: 0;
  border: 0;
}

.page-lte-referral .refer-friend {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .page-lte-referral .refer-friend .field {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
    margin-bottom: 0;
  }

  .page-lte-referral .refer-friend .field:nth-child(3n) {
    margin-right: 0;
  }

  .page-lte-referral .refer-friend .button {
    float: right;
    margin-right: 0;
  }

  .page-lte-referral .refer-friend .button [type="submit"] {
    width: 100%;
  }
}

.page-lte-referral .button-unit {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  margin-top: 16px;
  margin-top: 1rem;
}

.page-lte-referral .button-unit::after {
  clear: both;
  content: "";
  display: table;
}

@media (min-width: 48em) {
  .page-lte-referral .button-unit {
    max-width: 48.57143%;
  }
}

.page-lte-referral .button-unit .button {
  width: 48.57143%;
  float: left;
  margin-right: 2.85714%;
}

.page-lte-referral .button-unit .button:last-child {
  float: right;
  margin-right: 0;
}

.page-lte-referral .button-unit.three .button {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
}

@media (min-width: 48em) {
  .page-lte-referral .button-unit.three .button {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .page-lte-referral .button-unit.three .button:last-child {
    margin-right: 0;
  }
}

@media (min-width: 48em) {
  .page-lte-referral .friend-status {
    display: table;
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.page-lte-referral .friend-status fieldset .field {
  border: 0;
}

@media (max-width: 48em) {
  .page-lte-referral .friend-status fieldset {
    background-color: #ffffff;
    padding: 2.85714%;
  }

  .page-lte-referral .friend-status fieldset .field input,
  .page-lte-referral .friend-status fieldset .status-icon {
    text-align: center;
  }
}

@media (min-width: 48em) {
  .page-lte-referral .friend-status fieldset {
    display: table-row;
  }

  .page-lte-referral .friend-status fieldset .status-icon,
  .page-lte-referral .friend-status fieldset .field,
  .page-lte-referral .friend-status fieldset .button {
    display: table-cell;
    vertical-align: middle;
  }

  .page-lte-referral .friend-status fieldset .status-icon {
    width: 5%;
  }

  .page-lte-referral .friend-status fieldset .field {
    width: 25%;
  }

  .page-lte-referral .friend-status fieldset .field input[readonly] {
    text-align: center;
    color: #ffffff;
    opacity: 0.8;
    font-size: 24px;
    font-size: 1.5rem;
  }

  .page-lte-referral .friend-status fieldset .button {
    width: 15%;
  }

  .page-lte-referral .friend-status fieldset .icon {
    display: block;
    width: 36px;
    width: 2.25rem;
    height: 36px;
    height: 2.25rem;
    background-size: contain;
  }
}

@media (max-width: 48em) {
  .page-lte-referral .friend-status.declined input[readonly] {
    color: #da1b60;
  }
}

@media (min-width: 48em) {
  .page-lte-referral .friend-status.declined {
    opacity: 0.5;
  }
}

.page-lte-referral .friend-status.accepted input[readonly] {
  font-family: "Telkom123-Bold", sans-serif;
}

@media (max-width: 48em) {
  .page-lte-referral .friend-status.accepted input[readonly] {
    color: #00a850;
  }
}

.page-lte-referral .search-help,
.page-lte-referral .search-state {
  padding-top: 48px;
  padding-top: 3rem;
  padding-bottom: 48px;
  padding-bottom: 3rem;
}

.page-lte-referral .search-inpage {
  padding: 0;
}

.page-lte-referral .brochure-map #map {
  width: auto;
  height: auto;
  margin: 24px;
  margin: 1.5rem;
}

.page-lte-referral .lte-referral-invite-forms .message {
  margin-bottom: 2.85714%;
}

.page-lte-referral .terms {
  margin-top: 32px;
  margin-top: 2rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
  font-size: 80%;
  line-height: 16px;
  line-height: 1rem;
  color: #cccccc;
}

.page-lte-referral .terms a {
  color: #0083c2;
}

/***************************************/

/*  #36 - Help Device Support          */

/***************************************/

#wds {
  min-height: 160px;
  min-height: 10rem;
}

.device-search {
  float: none;
  position: relative;
  z-index: 2;
  margin-top: 32px;
  margin-top: 2rem;
  border-bottom: 1px solid #e8e7e7;
}

@media (min-width: 48em) {
  .device-search {
    float: right;
  }
}

.device-search input,
.device-search button {
  border: 0;
}

.device-search input {
  background: 0;
  padding: 12px;
  padding: 0.75rem;
  width: auto;
  color: #000000;
  font-size: 24px;
  font-size: 1.5rem;
}

@media (min-width: 48em) {
  .device-search input {
    width: 400px;
    width: 25rem;
  }
}

.device-search input::-webkit-input-placeholder {
  color: #0083c2;
}

.device-search input:-moz-placeholder {
  color: #0083c2;
}

.device-search input::-moz-placeholder {
  color: #0083c2;
}

.device-search input:-ms-input-placeholder {
  color: #0083c2;
}

.device-search button {
  width: 24px;
  width: 1.5rem;
  height: 24px;
  height: 1.5rem;
  background-color: transparent;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  text-indent: -1000px;
}

.device-support {
  position: relative;
  padding-top: 33.216px;
  padding-top: 2.076rem;
  padding-bottom: 33.216px;
  padding-bottom: 2.076rem;
}

.device-support h2 {
  padding-top: 16px;
  padding-top: 1rem;
  line-height: 19.2px;
  line-height: 1.2rem;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
}

.device-support .items {
  margin-top: 24px;
  margin-top: 1.5rem;
}

.device-support .items .item {
  width: 48.57143%;
  float: left;
  margin-right: 2.85714%;
  min-height: 272px;
  min-height: 17rem;
  text-align: center;
  position: relative;
  z-index: 100;
}

.device-support .items .item:nth-child(2n) {
  float: right;
  margin-right: 0;
}

@media (min-width: 48em) {
  .device-support .items .item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .device-support .items .item:nth-child(2n) {
    margin-right: 2.85714%;
    float: left;
  }

  .device-support .items .item:nth-child(3n) {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 62em) {
  .device-support .items .item {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }

  .device-support .items .item:nth-child(2n) {
    margin-right: 2.85714%;
    float: left;
  }

  .device-support .items .item:nth-child(3n) {
    margin-right: 2.85714%;
    float: left;
  }

  .device-support .items .item:nth-child(4n) {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .device-support .items .item {
    width: 14.28571%;
    float: left;
    margin-right: 2.85714%;
  }

  .device-support .items .item:nth-child(2n) {
    margin-right: 2.85714%;
    float: left;
  }

  .device-support .items .item:nth-child(3n) {
    margin-right: 2.85714%;
    float: left;
  }

  .device-support .items .item:nth-child(4n) {
    margin-right: 2.85714%;
    float: left;
  }

  .device-support .items .item:nth-child(6n) {
    float: right;
    margin-right: 0;
  }
}

.device-support .items .item .item-close {
  width: 32px;
  width: 2rem;
  height: 32px;
  height: 2rem;
  position: absolute;
  right: 0;
  top: 299.2px;
  top: 18.7rem;
  background-size: cover;
  z-index: 106;
  display: none;
  cursor: pointer;
}

.device-support .items .item .item-image {
  padding-top: 24px;
  padding-top: 1.5rem;
  min-height: 192px;
  min-height: 12rem;
}

.device-support .items .item .item-image:hover {
  cursor: pointer;
}

.device-support .items .item .item-image img {
  max-width: 100%;
  max-height: 160px;
  max-height: 10rem;
}

.device-support .items .item .item-content {
  padding-top: 16px;
  padding-top: 1rem;
  line-height: 20px;
  line-height: 1.25rem;
}

.device-support .items .item .item-content:hover {
  cursor: pointer;
}

.device-support .items .item a {
  display: block;
  color: #889391;
  text-decoration: none;
}

.device-support .items .item .item-drawer {
  border: 1px solid #e8e7e7;
  background: #ffffff;
  display: none;
}

.device-support .items .item .item-drawer .drawer-title .primary {
  padding-right: 48px;
  padding-right: 3rem;
}

.device-support .items .item.on {
  z-index: 101;
  position: relative;
  background: #ffffff;
  border: 1px solid #e8e7e7;
  border-bottom: 0;
}

.device-support .items .item.on .item-close {
  display: block;
}

.device-support .items .item.on .item-content {
  margin-top: 0;
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 32px;
  padding-bottom: 2rem;
  z-index: 105;
  background: #ffffff;
  position: relative;
}

.device-support .items .item.on .item-drawer {
  margin-top: -4px;
  margin-top: -0.25rem;
  border: 1px solid #e8e7e7;
  position: relative;
  top: 0;
  bottom: auto;
  left: -1px;
  right: 0;
  z-index: 101;
  display: block;
  text-align: left;
}

.device-support .items:after {
  content: "";
  display: block;
  clear: both;
}

.device-support .drawer-title {
  border-bottom: 1px solid #e8e7e7;
}

.device-support .drawer-title .title {
  min-height: 0;
}

.device-support .drawer-container {
  padding: 24px;
  padding: 1.5rem;
}

.device-support .drawer-container::after {
  clear: both;
  content: "";
  display: table;
}

.device-support .drawer-container h2 {
  padding-top: 0;
}

.device-support .drawer-sidebar {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
}

@media (min-width: 48em) {
  .device-support .drawer-sidebar {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }
}

.device-support .drawer-sidebar select {
  width: 100%;
  padding: 8px;
  padding: 0.5rem;
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  border: 1px solid #e8e7e7;
  color: #000000;
}

.device-support .drawer-sidebar a.btn-primary {
  margin-top: 16px;
  margin-top: 1rem;
  display: block;
  color: #ffffff;
}

.device-support .drawer-content {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: right;
  margin-right: 0;
  padding-bottom: 24px;
  padding-bottom: 1.5rem;
  position: relative;
}

@media (min-width: 48em) {
  .device-support .drawer-content {
    width: 70%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

.device-support .drawer-content img {
  max-width: initial;
}

.device-support .drawer-content article h2 {
  display: none;
}

.device-support .drawer-postloader {
  display: none;
}

.device-support .iframe-contents {
  color: #889391 !important;
}

.device-support .iframe-contents > div > div > h3,
.device-support .iframe-contents > div > div > strong > span,
.device-support .iframe-contents > div > div > span:first-child > strong,
.device-support .iframe-contents > div > div > span:first-child > strong > span,
.device-support .iframe-contents > div > div > p > span:first-child > strong > span,
.device-support .iframe-contents .faq-wds-question,
.device-support .iframe-contents .faq-wds-question h3,
.device-support .iframe-contents .faq-wds-question strong,
.device-support .iframe-contents #tsg-wds-title h3,
.device-support .iframe-contents #tsg-wds-title h3 strong {
  font-size: 32px;
  font-size: 2rem;
  letter-spacing: -1.5px;
  letter-spacing: -0.09375rem;
  font-family: "Telkom123-Regular", sans-serif !important;
  font-weight: normal !important;
  color: #000000 !important;
}

.device-support table {
  width: 100%;
  border: 0;
  background: #ffffff !important;
}

.device-support table tr {
  border-bottom: 1px solid #e8e7e7;
}

.device-support table tr:last-child {
  border: 0;
}

.device-support table th,
.device-support table td {
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  text-align: left;
  vertical-align: middle;
  background: #ffffff !important;
}

.device-support table th {
  font-weight: normal !important;
  color: #000000 !important;
}

.device-support #wds-sim-menu {
  display: none;
}

.device-support #wds-sim-context-orientation-tool {
  width: 100%;
  float: left;
}

@media (min-width: 48em) {
  .device-support #wds-sim-context-orientation-tool {
    width: 48%;
  }
}

.device-support .css-wds-context-scenario-title,
.device-support .css-wds-context-explorer-user-panel-text-name {
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-bottom: 20px;
  margin-bottom: 1.25rem;
  color: #000000;
}

.device-support .css-wds-context-explorer-user-component-name {
  margin-top: 32px;
  margin-top: 2rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  color: #0083c2;
  min-height: 21px;
}

.device-support .css-wds-context-scenario-text,
.device-support .css-wds-context-explorer-user-component-description {
  margin-top: 0;
  margin-bottom: 32px;
  margin-bottom: 2rem;
  min-height: 16px;
  min-height: 1rem;
}

.device-support .css-wds-context-explorer-navigation-panel {
  width: auto;
  border: 0;
  background: transparant !important;
  position: absolute;
  bottom: 32px;
  bottom: 2rem;
  left: 0;
}

.device-support .css-wds-context-explorer-orientation-widget {
  width: auto;
  border: 0;
  background: transparant !important;
}

.device-support .css-wds-context-explorer-orientation-widget tr,
.device-support .css-wds-context-explorer-orientation-widget td,
.device-support .css-wds-context-explorer-orientation-widget th {
  padding: 0;
  border: 0;
}

.device-support .css-wds-context-explorer-margin {
  min-height: 150px;
}

.device-support .css-wds-context-explorer-orien-topleft {
  width: 36px;
  height: 34px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') 0 0 no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-topleft-on {
  width: 36px;
  height: 34px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') 0 -125px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-topright {
  width: 36px;
  height: 34px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -54px 0 no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-topright-on {
  width: 36px;
  height: 34px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -54px -125px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-bottomleft,
.device-support .css-wds-context-explorer-orien-bottomleft-on {
  width: 36px;
  height: 25px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') 0 -53px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-bottomright,
.device-support .css-wds-context-explorer-orien-bottomright-on {
  width: 36px;
  height: 25px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -54px -53px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-top {
  width: 18px;
  height: 34px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -36px 0 no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-top-on {
  width: 18px;
  height: 34px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -36px -125px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-bottom {
  width: 18px;
  height: 25px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -36px -53px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-bottom-on {
  width: 18px;
  height: 25px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -36px -178px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-left {
  width: 36px;
  height: 19px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') 0 -34px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-left-on {
  width: 36px;
  height: 19px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') 0 -160px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-right {
  width: 36px;
  height: 19px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -54px -34px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-right-on {
  width: 36px;
  height: 19px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -54px -160px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-center {
  width: 18px;
  height: 19px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -36px -34px no-repeat;
  display: block;
}

.device-support .css-wds-context-explorer-orien-center-on {
  width: 18px;
  height: 19px;
  background: url('/today/static/web/img/player/arrows.png?bc5dd5c4710e') -36px -159px no-repeat;
  display: block;
}

.device-support .device-simulator #wds-sim-canvas {
  margin-top: 16px;
  margin-top: 1rem;
  margin-bottom: 112px;
  margin-bottom: 7rem;
  float: right;
}

@media (min-width: 48em) {
  .device-support .device-simulator #wds-sim-canvas {
    margin-bottom: 0;
  }
}

.device-support .device-simulator .css-wds-context-scenario-steps {
  position: absolute;
  bottom: 48px;
  bottom: 3rem;
  left: 88px;
  left: 5.5rem;
  color: #000000;
}

.device-support .device-simulator > p {
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.device-support .css-wds-navigation-next {
  width: 32px;
  width: 2rem;
  height: 32px;
  height: 2rem;
  display: block;
  background-color: #0083c2;
  background-image: url('/today/static/web/img/icons/icon-library/caret-right.svg?3be9fd8293bf');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 8px 8px;
  position: absolute;
  bottom: 48px;
  bottom: 3rem;
  left: 40px;
  left: 2.5rem;
}

.no-svg .device-support .css-wds-navigation-next {
  background-image: url('/today/static/web/img/icons/icon-library/png/caret-right.png?9a664f6cc412');
}

.device-support .css-wds-navigation-next-disabled {
  width: 32px;
  width: 2rem;
  height: 32px;
  height: 2rem;
  display: block;
  background-color: #889391;
  background-image: url('/today/static/web/img/icons/icon-library/caret-right.svg?3be9fd8293bf');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 8px 8px;
  position: absolute;
  bottom: 48px;
  bottom: 3rem;
  left: 40px;
  left: 2.5rem;
}

.no-svg .device-support .css-wds-navigation-next-disabled {
  background-image: url('/today/static/web/img/icons/icon-library/png/caret-right.png?9a664f6cc412');
}

.device-support .css-wds-navigation-back {
  width: 32px;
  width: 2rem;
  height: 32px;
  height: 2rem;
  display: block;
  background-color: #0083c2;
  background-image: url('/today/static/web/img/icons/icon-library/caret-left.svg?991bb5631ff3');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 8px 8px;
  position: absolute;
  bottom: 48px;
  bottom: 3rem;
  left: 0;
}

.no-svg .device-support .css-wds-navigation-back {
  background-image: url('/today/static/web/img/icons/icon-library/png/caret-left.png?34546bf66243');
}

.device-support .css-wds-navigation-back-disabled {
  width: 32px;
  width: 2rem;
  height: 32px;
  height: 2rem;
  display: block;
  background-color: #889391;
  background-image: url('/today/static/web/img/icons/icon-library/caret-left.svg?991bb5631ff3');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 8px 8px;
  position: absolute;
  bottom: 48px;
  bottom: 3rem;
  left: 0;
}

.no-svg .device-support .css-wds-navigation-back-disabled {
  background-image: url('/today/static/web/img/icons/icon-library/png/caret-left.png?34546bf66243');
}

.device-support iframe {
  width: 100%;
  height: 360px;
  border: 0;
}

.device-support .device-setup:hover {
  cursor: pointer;
}

.page-generic-product {
  /* OLD PRODUCT PAGE STYLING -- LEAVE INTACT */
  /* SCROLL DOWN TO "ROWS" FOR THE LATEST */
  /* ROWS */
  /* SECTIONS */
  /* COLOURS */
  /* LEGALITIES */
}

.page-generic-product h2 {
  color: #000000;
  letter-spacing: -1px;
  font-family: "Telkom123-Regular", sans-serif;
}

.page-generic-product h2 b,
.page-generic-product h2 strong {
  font-family: "Telkom123-Bold", sans-serif;
}

.page-generic-product p b,
.page-generic-product p strong {
  font-family: "Telkom123-Bold", sans-serif;
}

.page-generic-product .brochure-block,
.page-generic-product .brochure-block-inverted,
.page-generic-product .brochure-block-inverted {
  padding: 0;
}

.page-generic-product .brochure-block .focal-point img,
.page-generic-product .brochure-block-inverted .focal-point img,
.page-generic-product .brochure-block-inverted .focal-point img {
  width: 75%;
}

.page-generic-product .brochure-row-blue-dark {
  padding-top: 0;
  padding-bottom: 0;
}

.page-generic-product .brochure-row-blue-dark .description h1 {
  font-size: 60px;
  font-size: 3.75rem;
  line-height: 64.5px;
  line-height: 4.03125rem;
  font-family: "Telkom123-Bold", sans-serif;
}

.page-generic-product .brochure-row-blue-dark .description p {
  font-size: 20px;
  font-size: 1.25rem;
  color: #ffffff;
  margin-bottom: 0;
  margin-top: 0px;
  margin-top: 0rem;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
}

.page-generic-product .brochure-row-blue-dark .focal-point * {
  width: 75%;
}

.page-generic-product article .content .description ul li {
  padding-top: 8px;
  padding-top: 0.5rem;
  padding-bottom: 8px;
  padding-bottom: 0.5rem;
  padding-left: 32px;
  padding-left: 2rem;
  position: relative;
}

.page-generic-product article .content .description ul li:before {
  position: absolute;
  left: 0;
  margin-top: -2px;
  display: block;
  font-size: 40px;
  font-size: 2.5rem;
  line-height: 24px;
  line-height: 1.5rem;
  font-family: "Telkom123-Bold", sans-serif;
  color: #bfd730;
  content: "\002B";
}

.page-generic-product article .content .description ol {
  padding-left: 31.2px;
  padding-left: 1.95rem;
}

.page-generic-product .icon-generic-tick,
.page-generic-product .icon-generic-plus {
  height: 160px;
  height: 10rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
  display: table;
  background-position: center;
}

@media (min-width: 48em) {
  .page-generic-product .icon-generic-tick,
  .page-generic-product .icon-generic-plus {
    height: 192px;
    height: 12rem;
    margin: auto;
  }
}

@media (min-width: 62em) {
  .page-generic-product .icon-generic-tick,
  .page-generic-product .icon-generic-plus {
    height: 256px;
    height: 16rem;
    margin: auto;
  }
}

@media (min-width: 75em) {
  .page-generic-product .icon-generic-tick,
  .page-generic-product .icon-generic-plus {
    height: 288px;
    height: 18rem;
    margin: auto;
  }
}

.page-generic-product .brochure-row {
  padding: 2.5% 5%;
}

.page-generic-product .listings .foundry-container {
  background-color: #f7f7f6;
}

.page-generic-product .listings .foundry-container:nth-of-type(2n) {
  background-color: #ffffff;
}

.page-generic-product .foundry-listing > h2 {
  padding: 2.5% 5%;
  margin: 0;
  color: #0083c2;
  text-align: center;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing > h2 {
    padding: 0 15%;
  }
}

.page-generic-product .foundry-listing > p {
  padding: 2.5% 5%;
  padding-top: 0;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 29.6px;
  line-height: 1.85rem;
  text-align: center;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing > p {
    padding: 2.5% 10%;
    padding-top: 0;
  }
}

.page-generic-product .foundry-listing-plaintext {
  padding: 2.5% 5%;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 29.6px;
  line-height: 1.85rem;
  text-align: center;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-plaintext {
    padding: 2.5% 15%;
  }
}

.page-generic-product .foundry-listing-lane {
  padding: 2.5% 5%;
}

.page-generic-product .foundry-listing-lane .row {
  padding: 0;
}

.page-generic-product .foundry-listing-lane > p {
  padding-bottom: 0;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-left"],
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-right"],
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] {
  padding: 2.5% 5%;
  background: transparent;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-left"] > div,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-right"] > div,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] > div {
  width: 100%;
  display: block;
  vertical-align: middle;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-left"] > div:last-child,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-right"] > div:last-child,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] > div:last-child {
  margin-right: 0;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-left"] > div,
  .page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-right"] > div,
  .page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] > div {
    width: 50%;
    display: table-cell;
  }
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-left"] .image,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-right"] .image,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] .image {
  text-align: center;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-left"] .image img,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-right"] .image img,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] .image img {
  margin: 0 auto;
  display: inline-block;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-left"] .text h2,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-right"] .text h2,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] .text h2 {
  color: #0083c2;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-left"] .text h2,
  .page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-right"] .text h2,
  .page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] .text h2 {
    margin-top: 0;
  }
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-left"] .text p,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-right"] .text p,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] .text p {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 29.6px;
  line-height: 1.85rem;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-left"]:after,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-right"]:after,
.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"]:after {
  content: "";
  display: block;
  clear: both;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="no-title"] h2 {
  display: none;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="text-right"] .text {
  text-align: left;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-promo .hero-usp[data-layout*="text-right"] .text {
    text-align: right;
  }
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="no-pad-top"] {
  padding-top: 0;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="no-pad-bottom"] {
  padding-bottom: 0;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="background-grey"] {
  background: #f7f7f6;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="background-blue"] {
  background: #f7f7f6;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="background-blue"] .text * {
  color: #ffffff;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] > div {
  width: 100%;
  display: block;
  text-align: center;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] .image {
  padding-top: 16px;
  padding-top: 1rem;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] .text {
  padding: 0 5%;
}

.page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] .text h2 {
  color: #0083c2;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] .text h2 {
    margin-top: 0;
  }
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-promo .hero-usp[data-layout*="image-centered"] .text {
    padding: 0 15%;
  }
}

.page-generic-product .foundry-listing-horizontal {
  padding: 2.5% 5%;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-horizontal {
    table-layout: fixed;
    height: 100%;
  }
}

.page-generic-product .foundry-listing-horizontal > .title {
  font-size: 32px;
  font-size: 2rem;
  line-height: 40px;
  line-height: 2.5rem;
  margin-bottom: 16px;
  margin-bottom: 1rem;
  color: #0083c2;
  text-align: center;
}

.page-generic-product .foundry-listing-horizontal .items {
  margin: 0 auto;
  text-align: center;
  display: block;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-horizontal .items {
    display: table-row;
  }
}

.page-generic-product .foundry-listing-horizontal .items .item {
  width: 100%;
  display: block;
  float: left;
  padding: 16px;
  padding: 1rem;
}

@media (min-width: 62em) {
  .page-generic-product .foundry-listing-horizontal .items .item {
    height: 100%;
    width: 19%;
    float: none;
    display: table-cell;
  }
}

.page-generic-product .foundry-listing-horizontal .items .item h2 {
  color: #0083c2;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 25.8px;
  line-height: 1.6125rem;
  letter-spacing: -1px;
}

.page-generic-product .foundry-listing-picker {
  padding: 2.5% 5%;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-picker {
    height: 100%;
  }
}

.page-generic-product .foundry-listing-picker > h2 {
  padding-bottom: 3%;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-picker > h2 {
    height: 100%;
  }
}

.page-generic-product .foundry-listing-picker .items {
  margin: 0 auto;
  margin-top: 16px;
  margin-top: 1rem;
  text-align: center;
  display: block;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-picker .items {
    display: table;
    table-layout: fixed;
  }
}

.page-generic-product .foundry-listing-picker .items .item {
  width: 100%;
  display: block;
  float: left;
  text-align: left;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-picker .items .item {
    width: 50%;
  }
}

@media (min-width: 62em) {
  .page-generic-product .foundry-listing-picker .items .item {
    width: 33.333%;
  }
}

@media (min-width: 75em) {
  .page-generic-product .foundry-listing-picker .items .item {
    height: 100%;
    width: 1%;
    float: none;
    display: table-cell;
  }
}

.page-generic-product .foundry-listing-picker .items .item .inner {
  position: relative;
  padding: 16px;
  padding: 1rem;
  padding-bottom: 48px;
  padding-bottom: 3rem;
  box-sizing: content-box;
}

@media (min-width: 75em) {
  .page-generic-product .foundry-listing-picker .items .item .inner {
    height: 100%;
  }
}

.page-generic-product .foundry-listing-picker .items .item .tag {
  position: absolute;
  width: 64px;
  width: 4rem;
  height: 64px;
  height: 4rem;
  top: -32px;
  top: -2rem;
  left: -32px;
  left: -2rem;
  border-radius: 64px;
  border-radius: 4rem;
}

.page-generic-product .foundry-listing-picker .items .item .tag .label {
  width: 57.6px;
  width: 3.6rem;
  height: 57.6px;
  height: 3.6rem;
  padding-top: 6.4px;
  padding-top: 0.4rem;
  margin-top: 3.2px;
  margin-top: 0.2rem;
  margin-left: 3.2px;
  margin-left: 0.2rem;
  color: #ffffff;
  text-transform: uppercase;
  font-family: "Telkom123-Bold", sans-serif;
  text-align: center;
  font-size: 12px;
  font-size: 0.75rem;
  border: 2px solid #ffffff;
  border-radius: 57.6px;
  border-radius: 3.6rem;
}

.page-generic-product .foundry-listing-picker .items .item .image {
  text-align: center;
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.page-generic-product .foundry-listing-picker .items .item .image img {
  max-width: 192px;
  max-width: 12rem;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-picker .items .item .image img {
    max-width: 160px;
    max-width: 10rem;
  }
}

.page-generic-product .foundry-listing-picker .items .item h2 {
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 24px;
  line-height: 1.5rem;
  color: #0083c2;
}

.page-generic-product .foundry-listing-picker .items .item h2 span {
  font-family: "Telkom123-Bold", sans-serif;
}

.page-generic-product .foundry-listing-picker .items .item .price {
  font-family: "Telkom123-Bold", sans-serif;
  color: #0083c2;
  display: inline-block;
  font-size: 40px;
  font-size: 2.5rem;
  line-height: 32px;
  line-height: 2rem;
  letter-spacing: -1px;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-picker .items .item .price {
    font-size: 36px;
    font-size: 2.25rem;
    line-height: 36px;
    line-height: 2.25rem;
  }
}

.page-generic-product .foundry-listing-picker .items .item .price span {
  display: block;
  font-size: 12.8px;
  font-size: 0.8rem;
  font-family: "Telkom123-Regular", sans-serif;
  text-transform: uppercase;
  color: #0083c2;
  letter-spacing: 0;
}

.page-generic-product .foundry-listing-picker .items .item .price sup {
  font-size: 50%;
  top: -1rem;
}

.page-generic-product .foundry-listing-picker .items .item .includes {
  display: block;
  font-size: 12.8px;
  font-size: 0.8rem;
  font-family: "Telkom123-Regular", sans-serif;
  text-transform: uppercase;
  color: #0083c2;
  letter-spacing: 0;
}

.page-generic-product .foundry-listing-picker .items .item ul {
  margin: 16px;
  margin: 1rem;
  padding: 0;
}

.page-generic-product .foundry-listing-picker .items .item .btn {
  display: block;
}

@media (min-width: 75em) {
  .page-generic-product .foundry-listing-picker .items .item .btn {
    position: absolute;
    bottom: 16px;
    bottom: 1rem;
    left: 16px;
    left: 1rem;
    right: 16px;
    right: 1rem;
  }
}

.page-generic-product .foundry-listing-picker .items .item-product {
  width: 50%;
}

@media (min-width: 48em) {
  .page-generic-product .foundry-listing-picker .items .item-product {
    width: 33%;
  }
}

.page-generic-product .foundry-listing-picker .items .item-product .btn {
  display: inline-block;
}

.page-generic-product .foundry-listing-picker .items .inner {
  border: 2px solid transparent;
}

.page-generic-product .foundry-listing-picker .items .highlighted {
  background: transparent;
}

.page-generic-product .foundry-listing-collapsable {
  padding: 2.5% 5%;
}

.page-generic-product .foundry-listing-collapsable > h2 {
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

.page-generic-product .foundry-listing-collapsable .items {
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

.page-generic-product .foundry-listing-collapsable .items .item {
  margin-top: 32px;
  margin-top: 2rem;
}

.page-generic-product .foundry-listing-collapsable .items .item a {
  text-decoration: none;
  position: relative;
  padding-right: 20px;
  padding-right: 1.25rem;
  font-size: 24px;
  font-size: 1.5rem;
}

.page-generic-product .foundry-listing-collapsable .items .item a span {
  width: 6.4px;
  width: 0.4rem;
  height: 35.2px;
  height: 2.2rem;
  position: absolute;
  margin: auto;
  right: 0;
  background-position: center;
  background-size: 6.4px;
  background-size: 0.4rem;
}

.page-generic-product .foundry-listing-collapsable .items .item .collapse {
  display: none;
}

.page-generic-product [data-layout-base-colour*="ci-blue-dark"] .item .highlighted {
  border-color: #141B4D;
}

.page-generic-product [data-layout-base-colour*="ci-blue-dark"] .item .highlighted .tag {
  background-color: #141B4D;
}

.page-generic-product [data-layout-base-colour*="ci-blue-mid"] .item .highlighted {
  border-color: #0033A0;
}

.page-generic-product [data-layout-base-colour*="ci-blue-mid"] .item .highlighted .tag {
  background-color: #0033A0;
}

.page-generic-product [data-layout-base-colour*="ci-blue-light"] .item .highlighted {
  border-color: #5BC2E7;
}

.page-generic-product [data-layout-base-colour*="ci-blue-light"] .item .highlighted .tag {
  background-color: #5BC2E7;
}

.page-generic-product [data-layout-base-colour*="ci-purple"] .item .highlighted {
  border-color: #84329B;
}

.page-generic-product [data-layout-base-colour*="ci-purple"] .item .highlighted .tag {
  background-color: #84329B;
}

.page-generic-product [data-layout-base-colour*="ci-teal"] .item .highlighted {
  border-color: #00B2A9;
}

.page-generic-product [data-layout-base-colour*="ci-teal"] .item .highlighted .tag {
  background-color: #00B2A9;
}

.page-generic-product [data-layout-base-colour*="ci-teal-light"] .item .highlighted {
  border-color: #ADCAB8;
}

.page-generic-product [data-layout-base-colour*="ci-teal-light"] .item .highlighted .tag {
  background-color: #ADCAB8;
}

.page-generic-product [data-layout-base-colour*="ci-green"] .item .highlighted {
  border-color: #84BD00;
}

.page-generic-product [data-layout-base-colour*="ci-green"] .item .highlighted .tag {
  background-color: #84BD00;
}

.page-generic-product [data-layout-base-colour*="ci-green-dark"] .item .highlighted {
  border-color: #009639;
}

.page-generic-product [data-layout-base-colour*="ci-green-dark"] .item .highlighted .tag {
  background-color: #009639;
}

.page-generic-product [data-layout-base-colour*="ci-green-light"] .item .highlighted {
  border-color: #C7E995;
}

.page-generic-product [data-layout-base-colour*="ci-green-light"] .item .highlighted .tag {
  background-color: #C7E995;
}

.page-generic-product [data-layout-base-colour*="ci-yellow"] .item .highlighted {
  border-color: #FFCD00;
}

.page-generic-product [data-layout-base-colour*="ci-yellow"] .item .highlighted .tag {
  background-color: #FFCD00;
}

.page-generic-product [data-layout-base-colour*="ci-yellow-dark"] .item .highlighted {
  border-color: #FFC72C;
}

.page-generic-product [data-layout-base-colour*="ci-yellow-dark"] .item .highlighted .tag {
  background-color: #FFC72C;
}

.page-generic-product [data-layout-base-colour*="ci-gold"] .item .highlighted {
  border-color: #AC8400;
}

.page-generic-product [data-layout-base-colour*="ci-gold"] .item .highlighted .tag {
  background-color: #AC8400;
}

.page-generic-product [data-layout-base-colour*="ci-orange"] .item .highlighted {
  border-color: #DC4405;
}

.page-generic-product [data-layout-base-colour*="ci-orange"] .item .highlighted .tag {
  background-color: #DC4405;
}

.page-generic-product [data-layout-base-colour*="ci-orange-light"] .item .highlighted {
  border-color: #DE7C00;
}

.page-generic-product [data-layout-base-colour*="ci-orange-light"] .item .highlighted .tag {
  background-color: #DE7C00;
}

.page-generic-product [data-layout-base-colour*="ci-red"] .item .highlighted {
  border-color: #CB333B;
}

.page-generic-product [data-layout-base-colour*="ci-red"] .item .highlighted .tag {
  background-color: #CB333B;
}

.page-generic-product [data-layout-base-colour*="ci-brown"] .item .highlighted {
  border-color: #9E652E;
}

.page-generic-product [data-layout-base-colour*="ci-brown"] .item .highlighted .tag {
  background-color: #9E652E;
}

.page-generic-product [data-layout-base-colour*="ci-brown-dark"] .item .highlighted {
  border-color: #6B4C4C;
}

.page-generic-product [data-layout-base-colour*="ci-brown-dark"] .item .highlighted .tag {
  background-color: #6B4C4C;
}

.page-generic-product [data-layout-base-colour*="ci-brown-dark-heavy"] .item .highlighted {
  border-color: #6D4F47;
}

.page-generic-product [data-layout-base-colour*="ci-brown-dark-heavy"] .item .highlighted .tag {
  background-color: #6D4F47;
}

.page-generic-product [data-layout-base-colour*="ci-metal"] .item .highlighted {
  border-color: #425563;
}

.page-generic-product [data-layout-base-colour*="ci-metal"] .item .highlighted .tag {
  background-color: #425563;
}

.page-generic-product [data-layout-base-colour*="ci-grey"] .item .highlighted {
  border-color: #A2AAAD;
}

.page-generic-product [data-layout-base-colour*="ci-grey"] .item .highlighted .tag {
  background-color: #A2AAAD;
}

.page-generic-product [data-layout-base-colour*="blue-darkest"] .item .highlighted {
  border-color: #005e9b;
}

.page-generic-product [data-layout-base-colour*="blue-darkest"] .item .highlighted .tag {
  background-color: #005e9b;
}

.page-generic-product .listings .foundry-listing-colour-blue {
  background: #0083c2 !important;
}

.page-generic-product .listings .foundry-listing-colour-blue * {
  color: #ffffff;
}

.page-generic-product .listings .foundry-listing-colour-blue > p,
.page-generic-product .listings .foundry-listing-colour-blue > h2,
.page-generic-product .listings .foundry-listing-colour-blue .title,
.page-generic-product .listings .foundry-listing-colour-blue .items .item h2,
.page-generic-product .listings .foundry-listing-colour-blue .items .item p {
  color: #ffffff;
}

.page-generic-product .listings .foundry-listing-colour-white {
  background-color: #ffffff;
}

.page-generic-product .listings .foundry-listing-colour-white .hero-new,
.page-generic-product .listings .foundry-listing-colour-white .promo-block .content .line-block {
  background-color: #ffffff;
}

.page-generic-product .listings .foundry-listing-colour-grey {
  background-color: #f7f7f6 !important;
}

.page-generic-product .listings .foundry-listing-colour-grey .hero-new,
.page-generic-product .listings .foundry-listing-colour-grey .promo-block .content .line-block {
  background-color: #f7f7f6 !important;
}

.page-generic-product .section-legalities h2 {
  margin-top: 0;
}

.page-generic-product .section-legalities p {
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 29.6px;
  line-height: 1.85rem;
}

.page-generic-product .section-legalities br {
  display: none;
}

@media (min-width: 48em) {
  .page-generic-product .section-legalities br {
    display: block;
  }
}

.page-generic-product .button-unit .button {
  float: none;
}

@media (min-width: 48em) {
  .page-generic-product .button-unit .button {
    float: left;
  }
}

.videoembed-detail .object-header {
  padding-top: 5%;
  padding-left: 5%;
  padding-right: 5%;
  padding-bottom: 32px;
  padding-bottom: 2rem;
  clear: both;
}

.videoembed-detail .object-header .title {
  color: #0083c2;
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

.videoembed-detail .object-header .date {
  margin-bottom: 16px;
  margin-bottom: 1rem;
  color: #cccccc;
}

.videoembed-detail .videoembed-detail-inclusion {
  margin-left: 5%;
  margin-right: 5%;
  padding-top: 32px;
  padding-top: 2rem;
  border-top: 1px solid #e8e7e7;
}

.videoembed-detail .videoembed-detail-inclusion img {
  float: left;
  margin-right: 32px;
  margin-right: 2rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.videoembed-detail .videoembed-detail-inclusion .content p:first-of-type {
  margin-top: 0;
}

.videoembed-detail .object-footer {
  padding-bottom: 5%;
  padding-left: 5%;
  padding-right: 5%;
  margin-top: 16px;
  margin-top: 1rem;
  text-align: right;
}

.videoembed-detail .object-footer .sharing > div {
  display: inline-block;
  margin-left: 8px;
  margin-left: 0.5rem;
}

.videoembed-detail .object-footer .sharing img {
  display: none;
}

.videoembed-detail .object-footer .sharing a {
  width: 40px;
  width: 2.5rem;
  height: 40px;
  height: 2.5rem;
  display: inline-block;
  background-color: #0083c2;
  background-position: center center;
  background-size: 46%;
  background-repeat: no-repeat;
  overflow: hidden;
  text-indent: -1000px;
  font-size: 0;
  line-height: 0;
}

.videoembed-detail .object-footer .sharing a:hover {
  background-color: #005e9b;
}

.videoembed-detail .object-footer .sharing .facebook a {
  background-image: url('/today/static/web/img/icons/icon-library/png/facebook.png?a4ce8087a47b');
  background-size: 34%;
}

.videoembed-detail .object-footer .sharing .twitter a {
  background-image: url('/today/static/web/img/icons/icon-library/png/twitter.png?7035a0dd41c4');
}

.videoembed-detail .object-footer .sharing .google a {
  background-image: url('/today/static/web/img/icons/icon-library/png/google+.png?ce353da632c0');
}

.campaign-detail .object-header,
.campaign-detail .object-footer {
  display: none;
}

.page-generic-campaign .text-center {
  text-align: center;
}

.page-generic-campaign .brochure-row-grey.brochure-deals {
  padding: 2.5% 5%;
}

.page-generic-campaign .campaign-form {
  padding-top: 16px;
  padding-top: 1rem;
  padding-left: 0;
  padding-right: 0;
}

@media (min-width: 48em) {
  .page-generic-campaign .campaign-form {
    padding-left: 10%;
    padding-right: 10%;
  }
}

.page-generic-campaign .form-buttons {
  text-align: center;
  padding-top: 16px;
  padding-top: 1rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

.page-generic-campaign .form-buttons .btn {
  width: 100%;
  display: block;
}

@media (min-width: 48em) {
  .page-generic-campaign .form-buttons .btn {
    width: auto;
    display: inline-block;
  }
}

.page-generic-campaign .foundry-listing-lane .shop-listing-slider .heading-interactive-filter {
  display: none !important;
}

.page-smbs .hero .title {
  font-size: 51.2px;
  font-size: 3.2rem;
  line-height: 48px;
  line-height: 3rem;
}

.page-smbs #ict-solution .focal-point {
  position: relative;
}

.page-smbs #ict-solution #cog-large,
.page-smbs #ict-solution #cog-small {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.page-smbs #ict-solution #cog-large {
  height: 25%;
  -webkit-animation: cog-large 10s linear infinite;
  animation: cog-large 10s linear infinite;
}

@-webkit-keyframes cog-large {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes cog-large {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.page-smbs #ict-solution #cog-small {
  height: 12.5%;
  -webkit-animation: cog-small 10s linear infinite;
  animation: cog-small 10s linear infinite;
}

@-webkit-keyframes cog-small {
  from {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }

  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes cog-small {
  from {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }

  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

.page-smbs #business-experience {
  vertical-align: top;
}

.page-smbs #business-experience .focal-point {
  text-align: center;
}

.page-smbs #business-experience #dots-wrapper {
  display: inline-block;
  position: relative;
}

.page-smbs #business-experience #dots {
  position: absolute;
  text-align: center;
  right: 4.5%;
  width: 25%;
}

@media (max-width: 48em) {
  .page-smbs #business-experience #dots {
    top: 20.5%;
  }
}

@media (min-width: 48em) {
  .page-smbs #business-experience #dots {
    top: 22.5%;
  }
}

.page-smbs #business-experience #dots .dot {
  height: 0;
  width: 0;
  border-style: solid;
  border-color: #ffffff;
  border-width: 4px;
  border-width: 0.25rem;
  border-radius: 50%;
  display: inline-block;
  margin: 0 4%;
}

@media (min-width: 48em) {
  .page-smbs #business-experience #dots .dot {
    border-width: 4.992px;
    border-width: 0.312rem;
  }
}

.page-smbs #business-experience #dots .dot:nth-child(1) {
  -webkit-animation: dot1 1.8s ease-in-out infinite;
  animation: dot1 1.8s ease-in-out infinite;
}

@-webkit-keyframes dot1 {
  0% {
    opacity: 0;
  }

  25% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

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

  25% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

.page-smbs #business-experience #dots .dot:nth-child(2) {
  -webkit-animation: dot2 1.8s ease-in-out infinite;
  animation: dot2 1.8s ease-in-out infinite;
}

@-webkit-keyframes dot2 {
  0% {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

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

  50% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

.page-smbs #business-experience #dots .dot:nth-child(3) {
  -webkit-animation: dot3 1.8s ease-in-out infinite;
  animation: dot3 1.8s ease-in-out infinite;
}

@-webkit-keyframes dot3 {
  0% {
    opacity: 0;
  }

  75% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

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

  75% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

.page-smbs #networking-opportunities {
  vertical-align: top;
}

.page-smbs #networking-opportunities .focal-point {
  text-align: center;
}

.page-smbs #networking-opportunities .focal-point #world-wrapper {
  display: inline-block;
  position: relative;
}

.page-smbs #networking-opportunities .focal-point #world {
  background-color: #ffcd00;
  -webkit-animation: lightbulb-glow 1s ease-in-out infinite;
  animation: lightbulb-glow 1s ease-in-out infinite;
}

@-webkit-keyframes lightbulb-glow {
  0% {
    background-color: #ffcd00;
  }

  50% {
    background-color: #ffe680;
  }

  100% {
    background-color: #ffcd00;
  }
}

@keyframes lightbulb-glow {
  0% {
    background-color: #ffcd00;
  }

  50% {
    background-color: #ffe680;
  }

  100% {
    background-color: #ffcd00;
  }
}

.page-smbs #networking-opportunities .focal-point #world-cog-large,
.page-smbs #networking-opportunities .focal-point #world-cog-small {
  position: absolute;
}

.page-smbs #networking-opportunities .focal-point #world-cog-large {
  height: 4.5%;
  bottom: 12.9%;
  right: 49%;
  -webkit-animation: world-cog-large 10s linear infinite;
  animation: world-cog-large 10s linear infinite;
}

@-webkit-keyframes world-cog-large {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes world-cog-large {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.page-smbs #networking-opportunities .focal-point #world-cog-small {
  height: 3%;
  bottom: 16.5%;
  right: 48%;
  -webkit-animation: world-cog-small 10s linear infinite;
  animation: world-cog-small 10s linear infinite;
}

@-webkit-keyframes world-cog-small {
  from {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }

  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes world-cog-small {
  from {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }

  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

.page-flla .item .description h2,
.page-flla .item .description h2 b {
  color: #889391;
}

.page-idols .activation {
  background-image: url('/today/static/web/img/promo/brochure-pages/idols/bg.png?8579bdbc326f');
  background-repeat: no-repeat;
  background-size: cover;
}

.page-idols .brochure-selling-points h3 {
  margin-bottom: 32px;
  margin-bottom: 2rem;
  color: #889391;
  text-align: center;
  font-family: "Telkom123-Bold", sans-serif;
  font-weight: normal;
}

.page-idols .brochure-selling-points .description p {
  color: #0083c2;
  margin-top: 12px;
  margin-top: 0.75rem;
  margin-bottom: 12px;
  margin-bottom: 0.75rem;
}

.page-idols .brochure-selling-points .description p b {
  font-family: "Telkom123-Bold", sans-serif;
}

.page-idols .sponsors img {
  height: 96px;
  height: 6rem;
}

.page-carrier-billing .hero-new .promo-block .focal-point img {
  max-width: 404px;
  max-width: 25.25rem;
}

.page-carrier-billing [class*="pill-"] img {
  width: 32px;
  width: 2rem;
  margin-right: 12px;
  margin-right: 0.75rem;
  float: left;
  margin-top: -2px;
  margin-bottom: -8px;
}

.page-carrier-billing .apps {
  text-align: center;
}

.page-carrier-billing .apps .item img {
  max-width: 100px;
}

.page-carrier-billing .step-visuals {
  padding-top: 0;
  padding-bottom: 0;
}

.page-carrier-billing [class*="pill-"].cta {
  text-transform: none;
  margin: 0 auto;
  font-size: 20px;
  font-size: 1.25rem;
  margin-top: 48px;
  margin-top: 3rem;
  font-family: "Telkom123-Regular", sans-serif;
  padding: 20px;
  padding: 1.25rem;
  padding-left: 32px;
  padding-left: 2rem;
  padding-right: 32px;
  padding-right: 2rem;
}

.page-carrier-billing .steps {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-top: 5%;
  padding-bottom: 5%;
}

@media (min-width: 48em) {
  .page-carrier-billing .steps {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }
}

.page-carrier-billing .steps .subtitle-big {
  margin: 0;
  margin-bottom: 24px;
  margin-bottom: 1.5rem;
  text-align: left;
}

.page-carrier-billing .steps .subheading {
  text-transform: uppercase;
  font-family: "Telkom123-Bold", sans-serif;
  font-size: 12.8px;
  font-size: 0.8rem;
  line-height: 16px;
  line-height: 1rem;
}

.page-carrier-billing .steps .SumoSelect {
  width: 100%;
}

@media (min-width: 62em) {
  .page-carrier-billing .steps .SumoSelect {
    width: 87%;
  }
}

@media (min-width: 75em) {
  .page-carrier-billing .steps .SumoSelect {
    width: 75%;
  }
}

.page-carrier-billing .steps .SumoSelect .SelectBox {
  border-top: 0;
  border-left: 0;
  border-right: 0;
  font-size: 24px;
  font-size: 1.5rem;
  line-height: 35.2px;
  line-height: 2.2rem;
}

.page-carrier-billing .steps .SumoSelect .SelectBox i {
  background-size: 0.8rem;
}

.page-carrier-billing .steps .SumoSelect .SelectBox label {
  z-index: 1003;
  display: block;
}

.page-carrier-billing .steps .SumoSelect select {
  top: 0;
  bottom: 0;
  height: 100%;
  z-index: 1004;
}

.page-carrier-billing .step-group {
  width: 100%;
  display: none;
  margin-top: 32px;
  margin-top: 2rem;
}

@media (min-width: 62em) {
  .page-carrier-billing .step-group {
    width: 87%;
  }
}

@media (min-width: 75em) {
  .page-carrier-billing .step-group {
    width: 75%;
  }
}

.page-carrier-billing .step-group:first-child {
  display: block;
}

.page-carrier-billing .step-group ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.page-carrier-billing .step-group li {
  margin-bottom: 16px;
  margin-bottom: 1rem;
  line-height: 30.4px;
  line-height: 1.9rem;
  position: relative;
  padding-left: 48px;
  padding-left: 3rem;
}

.page-carrier-billing .step-group li::after {
  clear: both;
  content: "";
  display: table;
}

.page-carrier-billing .step-group li span {
  position: absolute;
  width: 32px;
  width: 2rem;
  height: 32px;
  height: 2rem;
  line-height: 29.6px;
  line-height: 1.85rem;
  border-radius: 32px;
  border-radius: 2rem;
  background-color: #e8e7e7;
  color: #ffffff;
  text-align: center;
  display: inline-block;
  left: 0;
}

.page-carrier-billing .step-group li:hover {
  cursor: pointer;
}

.page-carrier-billing .google .SelectBox span,
.page-carrier-billing .google .step-group li.on {
  color: #00a850;
}

.page-carrier-billing .google .SelectBox span span,
.page-carrier-billing .google .step-group li.on span {
  background-color: #00a850;
}

.page-carrier-billing .samsung .SelectBox span,
.page-carrier-billing .samsung .step-group li.on {
  color: #bfd730;
}

.page-carrier-billing .samsung .SelectBox span span,
.page-carrier-billing .samsung .step-group li.on span {
  background-color: #bfd730;
}

.page-carrier-billing .blackberry .SelectBox span,
.page-carrier-billing .blackberry .step-group li.on {
  color: #0083c2;
}

.page-carrier-billing .blackberry .SelectBox span span,
.page-carrier-billing .blackberry .step-group li.on span {
  background-color: #0083c2;
}

.page-carrier-billing .visuals {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-right: 0;
  padding-top: 5%;
  text-align: center;
}

@media (min-width: 48em) {
  .page-carrier-billing .visuals {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    margin-right: 0;
  }
}

.page-carrier-billing .visuals img {
  max-height: 580px;
  max-height: 36.25rem;
}

.page-carrier-billing .faq-collapse .title-center:hover {
  cursor: pointer;
}

.page-carrier-billing .faq-collapse .title-center span {
  width: 16px;
  width: 1rem;
  height: 28px;
  height: 1.75rem;
  margin-left: 8px;
  margin-left: 0.5rem;
  background-size: 16px;
  background-size: 1rem;
  background-position: right center;
  display: inline-block;
}

.page-carrier-billing .faq-collapse .brochure-faqs {
  display: none;
}

.page-carrier-billing .centered-buttons {
  margin-top: 40px;
  text-align: center;
}

.page-carrier-billing .community-link {
  margin-right: 10px;
  background-color: #44c7ee;
  color: #ffffff;
  text-decoration: none;
}

.page-carrier-billing .terms-link {
  margin-left: 10px;
  background-color: #005e9b;
  color: #ffffff;
  text-decoration: none;
}

.page-carrier-billing .Settings-cta {
  margin-top: 32px;
  margin-top: 2rem;
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.tko-home .foundry-navbar {
  width: 100%;
  float: left;
  padding: 0 5%;
  margin-top: 16px;
  margin-top: 1rem;
  position: relative;
}

@media (min-width: 48em) {
  .tko-home .foundry-navbar {
    margin-top: -68px;
    margin-top: -4.25rem;
  }
}

.tko-home .foundry-navbar .items .item {
  display: block;
  margin-right: 16px;
  margin-right: 1rem;
  margin-top: 8px;
  margin-top: 0.5rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  border-radius: 80px;
  border-radius: 5rem;
}

@media (min-width: 48em) {
  .tko-home .foundry-navbar .items .item {
    display: inline-block;
    margin-bottom: 0;
  }
}

.tko-home .foundry-navbar .items .item a {
  color: #ffffff;
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 25px;
  line-height: 1.5625rem;
  text-decoration: none;
  display: block;
  text-align: center;
  min-width: 128px;
  min-width: 8rem;
  padding-top: 10.4px;
  padding-top: 0.65rem;
  padding-right: 24px;
  padding-right: 1.5rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
  padding-left: 24px;
  padding-left: 1.5rem;
  font-family: "Telkom123-Regular", sans-serif;
  text-transform: none;
  border-radius: 80px;
  border-radius: 5rem;
  position: relative;
}

.tko-home .foundry-navbar .items .item.btn-active a:after {
  display: block;
  content: "";
  width: 0;
  height: 0;
  border-left: 1.5rem solid transparent;
  border-right: 1.5rem solid transparent;
  border-top: 1.5rem solid transparent;
  top: 100%;
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
}

.tko-home .foundry-navbar .items .item.btn-blue.btn-active a:after {
  border-top-color: #0083c2;
}

.tko-home .foundry-navbar .items .item.btn-green.btn-active a:after {
  border-top-color: #00a850;
}

.tko-home .foundry-navbar .items .item.btn-orange.btn-active a:after {
  border-top-color: #f04e23;
}

.tko-home .foundry-navbar .items .item.btn-green.btn-active a:after {
  border-top-color: #bfd730;
}

.tko-home .foundry-navbar .items .item.btn-pink.btn-active a:after {
  border-top-color: #da1b60;
}

.tko-home .foundry-navbar .items .item.btn-pink.btn-active a:hover:after {
  border-top-color: #961342;
}

.tko-home .foundry-listing-left-right .items .item .left,
.tko-home .foundry-listing-left-right .items .item .right {
  width: 100%;
  padding: 5%;
  display: table;
}

.tko-home .foundry-listing-left-right .items .item .image {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: none;
  text-align: center;
  margin-bottom: 16px;
  margin-bottom: 1rem;
}

@media (min-width: 48em) {
  .tko-home .foundry-listing-left-right .items .item .image {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    float: none;
    margin-right: 0;
    display: table-cell;
    margin-bottom: 0;
  }
}

.tko-home .foundry-listing-left-right .items .item .image img {
  width: 100%;
  display: block;
  border-radius: 3px;
}

@media (min-width: 48em) {
  .tko-home .foundry-listing-left-right .items .item .image img {
    width: auto;
    display: inline-block;
  }
}

.tko-home .foundry-listing-left-right .items .item .text {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: none;
  margin-right: 0;
  vertical-align: middle;
}

@media (min-width: 48em) {
  .tko-home .foundry-listing-left-right .items .item .text {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
    float: none;
    margin-right: 0;
    display: table-cell;
  }
}

.tko-home .foundry-listing-left-right .items .item .text .title,
.tko-home .foundry-listing-left-right .items .item .text .title a {
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
  text-decoration: none;
}

.tko-home .foundry-listing-left-right .items .item .text .date {
  margin-top: 16px;
  margin-top: 1rem;
  color: #cccccc;
}

.tko-home .foundry-listing-left-right .items .item .text .description {
  margin-top: 16px;
  margin-top: 1rem;
}

.tko-home .foundry-listing-left-right .items .item:nth-child(2n) {
  background: #f7f7f6;
}

.post-detail .object-header {
  padding-top: 5%;
  padding-left: 5%;
  padding-right: 5%;
  padding-bottom: 32px;
  padding-bottom: 2rem;
  clear: both;
}

.post-detail .object-header .title {
  color: #0083c2;
  font-size: 36px;
  font-size: 2.25rem;
  line-height: 40px;
  line-height: 2.5rem;
  padding-bottom: 16px;
  padding-bottom: 1rem;
}

.post-detail .object-header .date {
  margin-bottom: 16px;
  margin-bottom: 1rem;
  color: #cccccc;
}

.post-detail .post-detail-inclusion {
  margin-left: 5%;
  margin-right: 5%;
  padding-top: 32px;
  padding-top: 2rem;
  border-top: 1px solid #e8e7e7;
}

.post-detail .post-detail-inclusion .image {
  width: 100%;
  float: none;
  margin-bottom: 32px;
  margin-bottom: 2rem;
  text-align: center;
}

@media (min-width: 48em) {
  .post-detail .post-detail-inclusion .image {
    width: auto;
    float: left;
    margin-right: 32px;
    margin-right: 2rem;
  }
}

.post-detail .post-detail-inclusion .image img {
  border-radius: 3px;
  display: inline-block;
}

.post-detail .post-detail-inclusion .content p:first-of-type {
  margin-top: 0;
}

.post-detail .object-footer {
  padding-bottom: 5%;
  padding-left: 5%;
  padding-right: 5%;
  margin-top: 16px;
  margin-top: 1rem;
  text-align: right;
}

.post-detail .object-footer .sharing > div {
  display: inline-block;
  margin-left: 8px;
  margin-left: 0.5rem;
}

.post-detail .object-footer .sharing img {
  display: none;
}

.post-detail .object-footer .sharing a {
  width: 40px;
  width: 2.5rem;
  height: 40px;
  height: 2.5rem;
  display: inline-block;
  background-color: #0083c2;
  background-position: center center;
  background-size: 46%;
  background-repeat: no-repeat;
  overflow: hidden;
  text-indent: -1000px;
  font-size: 0;
  line-height: 0;
}

.post-detail .object-footer .sharing a:hover {
  background-color: #005e9b;
}

.post-detail .object-footer .sharing .facebook a {
  background-image: url('/today/static/web/img/icons/icon-library/png/facebook.png?a4ce8087a47b');
  background-size: 34%;
}

.post-detail .object-footer .sharing .twitter a {
  background-image: url('/today/static/web/img/icons/icon-library/png/twitter.png?7035a0dd41c4');
}

.post-detail .object-footer .sharing .google a {
  background-image: url('/today/static/web/img/icons/icon-library/png/google+.png?ce353da632c0');
}

.page-ftth.ucm-home strong {
  font-weight: bold;
}

.page-ftth.ucm-home .nav-hero {
  margin-top: 1rem;
  margin-bottom: 2rem;
}

.page-ftth.ucm-home .coverage-map-container {
  background-color: #ffffff;
}

.page-ftth.ucm-home .coverage-map-container .brochure-map {
  min-height: 0;
  padding-top: 0px;
  height: 100%;
}

@media (min-width: 48em) {
  .page-ftth.ucm-home .coverage-map-container .coverage-products .form-group {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .page-ftth.ucm-home .coverage-map-container .coverage-products .form-group:nth-child(2n) {
    float: right;
    margin-right: 0;
  }
}

.page-ftth.ucm-home .coverage-map-container .coverage-products img {
  float: none;
}

.results .title {
  color: #0083c2;
}

.coverage-map-container {
  position: relative;
}

.coverage-map-container .search-holder {
  width: 312px;
  top: 60px;
  left: 10px;
  overflow: hidden;
  border: 10px solid #005e9b;
  border-left: 0px;
  border-bottom: 50px solid #005e9b;
}

.coverage-map-container .search-holder #searchTextField {
  width: 322px;
  height: 40px;
  border: 0px;
  border-left: 10px solid #005e9b;
  background-size: 20px;
  background-size: 1.25rem;
  background-position: 90% 50%;
  padding-right: 24px;
  padding-right: 1.5rem;
}

.coverage-map-container .search-holder #searchTextField::-ms-clear {
  display: none;
}

@media (min-width: 48em) {
  .coverage-map-container .search-holder {
    width: 590px;
    top: 10px;
    left: 116px;
  }

  .coverage-map-container .search-holder #searchTextField {
    width: 600px;
    background-position: 95% 50%;
  }
}

.coverage-map-container .find-a .search-holder {
  border-bottom: 10px solid #005e9b;
}

.coverage-map-container .find-a #map-explore-coverage {
  display: none;
}

.coverage-map-container .coverage-map #map-explore-coverage {
  display: none;
}

.coverage-map-container .coverage-map #map-nav {
  display: none;
}

.coverage-map-container .coverage-map .search-holder {
  width: 310px;
  border-width: 0px;
}

.coverage-map-container .coverage-map .search-holder #searchTextField {
  width: 302px;
  background-color: #0083c2;
  border-left: 0px solid #0083c2;
  color: #fff;
  height: 30px;
}

#coverage-map-search-submit {
  position: absolute;
  right: 0px;
  top: 0px;
  opacity: 0;
  height: 40px;
}

.gm-style div {
  box-sizing: content-box;
}

.coverage-map-wide {
  position: relative;
  height: 100%;
}

.pac-container {
  border: 10px solid #005e9b;
  border-top: 0px;
  box-shadow: 0 0 0 0;
  width: 600px;
}

.pac-container.pac-narrow {
  border: 10px solid #0083c2;
  border-top: 0px;
}

#map-explore-coverage {
  position: absolute;
  left: -600px;
  top: 118px;
  width: 293px;
  padding-right: 0;
  padding-left: 7px;
  z-index: 999;
  border: 1px solid #A2AAAD;
}

@media (min-width: 48em) {
  #map-explore-coverage {
    width: 571px;
  }
}

.find-a #map-explore-coverage {
  display: none;
}

#map-nav {
  position: absolute;
  z-index: 999;
  padding-left: 0px;
  left: -600px;
  top: 0px;
}

#map-nav .pill-blue.full.active {
  background-color: #005e9b;
}

#map-nav .nonmobile-visible {
  display: none;
}

@media (min-width: 48em) {
  #map-nav .nonmobile-visible {
    display: inline;
  }

  #map-nav .mobile-visible {
    display: none;
  }
}

#map-nav li {
  list-style-type: none;
  display: inline;
}

#lte-notice,
#ftth-notice,
#vdsl-notice,
#nf-notice {
  left: -600px;
}

.legend-slider.dynamic-coverage-buttons {
  position: absolute;
  left: -600px;
}

#search-prompt {
  position: absolute;
  left: 10px;
  top: 106px;
  width: 302px;
  z-index: 999;
  padding: 16px;
  padding: 1rem;
  background-color: #005e9b;
  color: #ffffff;
}

#search-prompt .icon-close {
  float: right;
  width: 16px;
  width: 1rem;
  background-size: 16px;
  background-size: 1rem;
}

@media (min-width: 48em) {
  #search-prompt {
    left: 116px;
    top: 56px;
  }
}

.coverage-pills {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (max-width: 48em) {
  .coverage-pills {
    float: right;
    margin-right: 0;
  }
}

@media (min-width: 48em) {
  .coverage-pills {
    width: 14.28571%;
    float: left;
    margin-right: 2.85714%;
  }
}

.coverage-items {
  margin-bottom: 82px;
  margin-bottom: 5.125rem;
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: right;
  margin-right: 0;
}

.coverage-items .owl-wrapper-outer {
  padding-left: 16px;
  padding-left: 1rem;
  padding-right: 16px;
  padding-right: 1rem;
}

.coverage-items .owl-item {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: right;
  margin-right: 0;
  margin-left: 16px;
  margin-left: 1rem;
}

@media (min-width: 48em) {
  .coverage-items {
    width: 82.85714%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }

  .coverage-items .item {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .coverage-items .item:nth-child(2n) {
    float: right;
    margin-right: 0;
  }
}

.coverage-products {
  position: relative;
}

@media (min-width: 48em) {
  .coverage-products {
    height: 100%;
  }
}

.coverage-products h3 {
  color: #889391;
  margin-top: 8px;
  margin-top: 0.5rem;
}

.coverage-products .nav-secondary a {
  margin-right: 8px;
  margin-right: 0.5rem;
  margin-top: 4px;
  margin-top: 0.25rem;
  margin-bottom: 4px;
  margin-bottom: 0.25rem;
  text-align: center;
  background-color: #0083c2;
}

@media (min-width: 48em) {
  .coverage-products .nav-secondary a {
    width: 100%;
    margin-right: 0px;
  }
}

.coverage-products .nav-secondary a:hover {
  background-color: #005e9b;
}

.coverage-products .nav-secondary a.active {
  background-color: #005e9b;
}

.coverage-products .faq-content .title {
  display: none;
}

.coverage-products.faq-page {
  padding: 24px;
  padding: 1.5rem;
}

.preview-heading,
.covered-heading,
.not-covered-heading,
.not-covered,
.shop-further {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  float: right;
  margin-right: 0;
}

.preview-heading .icon-arrow-left-blue,
.covered-heading .icon-arrow-left-blue,
.faq-heading .icon-arrow-left-blue,
#explore-coverage-heading .icon-arrow-left-blue {
  padding-left: 24px;
  padding-left: 1.5rem;
  background-size: 16px;
  background-size: 1rem;
  background-position: left center;
}

.back-to-map {
  cursor: pointer;
  line-height: 20px;
  line-height: 1.25rem;
  float: right;
  background-size: 20px;
  background-size: 1.25rem;
  background-position: right;
  padding-right: 24px;
  padding-right: 1.5rem;
}

.covered-heading.no-deals {
  display: none;
}

.covered.no-deals {
  display: none;
}

.not-covered-heading {
  border-top: 1px solid #A2AAAD;
  cursor: pointer;
  background-color: white;
}

.not-covered-heading .back-to-map {
  display: none;
}

.not-covered-heading.no-deals {
  border-top: 0px;
}

.not-covered-heading.no-deals .coming-soon.icon-arrow-up-blue,
.not-covered-heading.no-deals .coming-soon.icon-arrow-down-blue {
  background: none;
}

.not-covered-heading.no-deals .back-to-map {
  display: block;
}

.not-covered-heading:not(.active) {
  position: absolute;
  bottom: 0;
  right: 0;
  padding-left: 24px;
  padding-right: 24px;
}

.coverage-products .progress {
  border-radius: 2px;
  font-size: 10px;
}

.coverage-products .progress-bar {
  border-radius: 2px 0px 0px 2px;
  overflow: visible;
  padding-left: 16px;
  padding-left: 1rem;
}

.coverage-products .tm3g h3 {
  color: #FFC72C;
}

.coverage-products .tm3g .progress-bar {
  background-color: #FFC72C;
  color: #ffffff;
}

.coverage-products .tm3g .btn-solid {
  background-color: #FFC72C;
  color: #ffffff;
}

.coverage-products .r3g h3 {
  color: #84329B;
}

.coverage-products .r3g .progress-bar {
  background-color: #84329B;
  color: #ffffff;
}

.coverage-products .r3g .btn-solid {
  background-color: #84329B;
  color: #ffffff;
}

.coverage-products .fibre h3 {
  color: #005e9b;
}

.coverage-products .fibre .progress-bar {
  background-color: #005e9b;
  color: #ffffff;
  font-size: 11px;
}

.coverage-products .fibre .btn-solid {
  background-color: #005e9b;
  color: #ffffff;
}

.coverage-products .adsl h3 {
  color: #00B2A9;
}

.coverage-products .adsl .progress-bar {
  background-color: #00B2A9;
  color: #ffffff;
  font-size: 11px;
}

.coverage-products .adsl .btn-solid {
  background-color: #00B2A9;
  color: #ffffff;
}

.coverage-products .vdsl h3 {
  color: #009639;
}

.coverage-products .vdsl .progress-bar {
  background-color: #009639;
  color: #ffffff;
  font-size: 11px;
}

.coverage-products .vdsl .btn-solid {
  background-color: #009639;
  color: #ffffff;
}

.coverage-products .lte h3 {
  color: #da1b60;
}

.coverage-products .lte .progress-bar {
  background-color: #da1b60;
  color: #ffffff;
  font-size: 11px;
}

.coverage-products .lte .btn-solid {
  background-color: #da1b60;
  color: #ffffff;
}

.coverage-products .ltea h3 {
  color: #5BC2E7;
}

.coverage-products .ltea .progress-bar {
  background-color: #5BC2E7;
  color: #ffffff;
  font-size: 11px;
}

.coverage-products .ltea .btn-solid {
  background-color: #5BC2E7;
  color: #ffffff;
}

.shop-further {
  margin-top: 16px;
  margin-top: 1rem;
}

body::after {
  content: "narrow";
  display: none;
}

@media (min-width: 48em) {
  body::after {
    content: "wide";
    display: none;
  }
}

.preview-heading {
  cursor: pointer;
  display: none;
}

.preview-heading.visible {
  display: block;
}

.preview-heading .icon-arrow-up-blue,
.coming-soon.icon-arrow-up-blue,
.coming-soon.icon-arrow-down-blue {
  background-position: right;
  background-size: 24px;
  background-size: 1.5rem;
  padding-right: 24px;
  padding-right: 1.5rem;
}

.page-help-bill .row {
  padding: 2.5% 5%;
}

.page-help-bill .row.no-pad {
  padding-top: 0;
  padding-bottom: 0;
}

.page-help-bill .nav-hero {
  margin-bottom: 32px;
  margin-bottom: 2rem;
}

.page-help-bill .nav-hero li a.ci-orange-light {
  background-color: #DE7C00;
}

.page-help-bill .nav-hero li a.ci-green {
  background-color: #84BD00;
}

.page-help-bill .nav-hero li a.ci-blue-light {
  background-color: #5BC2E7;
}

.page-help-bill .language {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding-bottom: 32px;
  padding-bottom: 2rem;
}

@media (min-width: 48em) {
  .page-help-bill .language {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
    margin: 0 auto;
    float: none;
  }
}

.page-help-bill .language .selector {
  width: 100%;
  float: none;
  margin: 0 auto;
}

@media (min-width: 48em) {
  .page-help-bill .language .selector {
    width: 240px;
    width: 15rem;
  }
}

.page-help-bill .language .selector > p {
  margin: 0;
  text-transform: uppercase;
  font-size: 12px;
  font-size: 0.75rem;
  font-family: "Telkom123-Bold", sans-serif;
}

.page-help-bill .language .selector .SumoSelect .SelectBox {
  border: 0;
  border-bottom: 1px solid #e8e7e7;
  padding: 0;
  padding: 8px;
  padding: 0.5rem;
  padding-top: 0;
  line-height: 35.2px;
  line-height: 2.2rem;
}

.page-help-bill .language .selector .SumoSelect .SelectBox span {
  font-size: 24px;
  font-size: 1.5rem;
  color: #0083c2;
}

.page-help-bill .language .selector .SumoSelect .SelectBox i {
  background-size: 12px;
  background-size: 0.75rem;
}

.page-help-bill .image {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  text-align: center;
}

@media (min-width: 48em) {
  .page-help-bill .image {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }
}

.page-help-bill .image img {
  display: inline-block;
}

@media (min-width: 75em) {
  .page-help-bill .image img {
    max-width: 400px;
    max-width: 25rem;
  }
}

.page-help-bill .text {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .page-help-bill .text {
    width: 65.71429%;
    float: left;
    margin-right: 2.85714%;
    float: right;
    margin-right: 0;
  }
}

.page-help-bill .text h2 {
  color: #0083c2;
}

.page-help-bill .text h3 {
  color: #889391;
}

.page-help-bill .text a.toggler {
  line-height: 40px;
  line-height: 2.5rem;
}

.page-help-bill .text a.toggler span {
  width: 40px;
  width: 2.5rem;
  height: 40px;
  height: 2.5rem;
  line-height: 36.8px;
  line-height: 2.3rem;
  margin-right: 16px;
  margin-right: 1rem;
  margin-bottom: 8px;
  margin-bottom: 0.5rem;
  background-size: cover;
  text-align: center;
  float: left;
  color: #ffffff;
}

.page-help-bill .faq-group {
  display: none;
}

.page-help-bill .faq-group:first-child {
  display: block;
}

.page-help-bill .faq-expand {
  color: #889391;
}

.page-help-bill .faq-expand:hover {
  cursor: pointer;
}

.page-help-bill .faq-text {
  margin-left: 56px;
  margin-left: 3.5rem;
}

.page-help-bill .paging {
  margin-left: 56px;
  margin-left: 3.5rem;
}

.page-help-bill .paging a {
  text-decoration: underline;
}

.page-help-bill .paging a:hover {
  cursor: pointer;
}

.page-help-bill .paging .disabled {
  color: #A2AAAD;
}

.page-help-bill .paging .disabled:hover {
  cursor: default;
}

.crime .title-center br {
  display: none;
}

@media (min-width: 62em) {
  .crime .title-center br {
    display: block;
  }
}

.crime .brochure-block .focal-point img,
.crime .brochure-block-inverted .focal-point img,
.crime .brochure-block-inverted .focal-point img {
  width: 50%;
}

.crime .brochure-selling-points {
  padding-top: 16px;
  padding-top: 1rem;
  padding-left: 2.5%;
  padding-right: 2.5%;
}

.crime .brochure-selling-points .item .focal-point img {
  width: 65%;
}

.crime .brochure-selling-points h3 {
  color: #889391;
}

.crime .brochure-selling-points .description br {
  display: none;
}

@media (min-width: 62em) {
  .crime .brochure-selling-points .description br {
    display: block;
  }
}

.crime .report-form .form-group {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .crime .report-form .form-group {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .crime .report-form .form-group:nth-of-type(3n) {
    float: right;
    margin-right: 0;
  }
}

.crime .report-form .field input {
  color: #ffffff;
}

.crime .report-form .textarea {
  border: 0;
}

.crime .report-form .textarea textarea {
  width: 100%;
  border: 0;
  height: 144px;
  height: 9rem;
  padding: 16px;
  padding: 1rem;
  color: #889391;
}

.cancellation .brochure-block,
.cancellation .brochure-block-inverted {
  display: block;
  margin: 2% 0;
  padding: 0;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  overflow: hidden;
}

.cancellation .brochure-block .cancellation-margin-bottom,
.cancellation .brochure-block-inverted .cancellation-margin-bottom {
  margin-bottom: .5rem;
  color: #889391;
  font-size: 1rem;
  font-weight: bold;
}

.cancellation .brochure-block .form-container,
.cancellation .brochure-block-inverted .form-container {
  padding-top: 4.5rem;
  padding-right: 5%;
  padding-bottom: 2.5rem;
  padding-left: 5%;
}

.cancellation .brochure-block .success-page-cancellation img,
.cancellation .brochure-block-inverted .success-page-cancellation img {
  display: block;
  min-width: 15.625rem;
  margin: 0 auto;
  margin-top: 2.5rem;
}

.cancellation .brochure-block .success-page-cancellation img,
.cancellation .brochure-block-inverted .success-page-cancellation img {
  width: 50%;
  margin-bottom: -2.5rem;
}

.cancellation .brochure-block h1,
.cancellation .brochure-block-inverted h1 {
  margin-top: 0;
  text-align: center;
}

.cancellation .brochure-block .cancellation-header,
.cancellation .brochure-block-inverted .cancellation-header {
  color: #0083c2;
}

.cancellation .brochure-block .download-link,
.cancellation .brochure-block-inverted .download-link {
  color: #ffffff;
}

@media (min-width: 48em) {
  .cancellation .brochure-block .next-submit-btn,
  .cancellation .brochure-block-inverted .next-submit-btn {
    width: 25%;
    float: right;
  }
}

.cancellation .brochure-block .form-content,
.cancellation .brochure-block-inverted .form-content {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 3rem;
  margin-bottom: 2rem;
}

.cancellation .brochure-block .form-content::after,
.cancellation .brochure-block-inverted .form-content::after {
  clear: both;
  content: "";
  display: table;
}

.cancellation .brochure-block .form-group,
.cancellation .brochure-block-inverted .form-group {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .cancellation .brochure-block .form-group,
  .cancellation .brochure-block-inverted .form-group {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .cancellation .brochure-block .form-group:nth-child(2n),
  .cancellation .brochure-block-inverted .form-group:nth-child(2n) {
    float: right;
    margin-right: 0;
  }
}

.cancellation .brochure-block .field ul,
.cancellation .brochure-block-inverted .field ul {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-bottom: 1.5rem;
}

.cancellation .brochure-block .field ul li,
.cancellation .brochure-block-inverted .field ul li {
  width: 100%;
  margin-bottom: .5rem;
  font-size: .75rem;
}

.cancellation .brochure-block .field ul li > label,
.cancellation .brochure-block-inverted .field ul li > label {
  width: 100%;
}

.cancellation .brochure-block .field ul li > label input,
.cancellation .brochure-block-inverted .field ul li > label input {
  width: auto;
  margin-right: .25;
}

.cancellation .brochure-block .field input:not([type="submit"]),
.cancellation .brochure-block-inverted .field input:not([type="submit"]) {
  color: #000000;
  font-size: 1rem;
}

.cancellation .brochure-block .field > label,
.cancellation .brochure-block-inverted .field > label {
  width: 25%;
  text-align: left;
}

.cancellation .brochure-block .field > label.stacked,
.cancellation .brochure-block-inverted .field > label.stacked {
  display: block;
  width: 100%;
  font-size: 1rem;
  text-transform: none;
  white-space: normal;
}

.cancellation .brochure-block .field .SumoSelect .SelectBox,
.cancellation .brochure-block-inverted .field .SumoSelect .SelectBox {
  margin: 0%;
  font-size: .75rem;
}

.cancellation .brochure-block .field .SumoSelect .optWrapper,
.cancellation .brochure-block-inverted .field .SumoSelect .optWrapper {
  right: 0;
  left: auto;
  width: 75%;
}

.cancellation .brochure-block .field .SumoSelect .options li,
.cancellation .brochure-block-inverted .field .SumoSelect .options li {
  margin-bottom: 0;
  padding-left: 3%;
}

.cancellation .brochure-block .valid-box textarea,
.cancellation .brochure-block-inverted .valid-box textarea {
  background-color: transparent;
}

.cancellation .brochure-block textarea,
.cancellation .brochure-block-inverted textarea {
  width: 100%;
  height: 3.125rem;
  padding: .5rem;
  border: 0;
  background-color: #0072a9;
}

.cancellation .brochure-block textarea.icon-check,
.cancellation .brochure-block-inverted textarea.icon-check {
  padding-right: 3.5rem;
  background-position: 99% 50%;
  background-size: 2.5rem;
}

.cancellation .brochure-block .stacked-options ul li,
.cancellation .brochure-block-inverted .stacked-options ul li {
  display: block;
  margin-top: .5rem;
  margin-right: 0;
  font-size: 1rem;
}

.cancellation .brochure-block .stepbar,
.cancellation .brochure-block-inverted .stepbar {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

.cancellation .brochure-block .step1 .stepbar.inverted-blue > li[data-step="1"],
.cancellation .brochure-block-inverted .step1 .stepbar.inverted-blue > li[data-step="1"] {
  color: #ffffff;
}

.cancellation .brochure-block .step1 .stepbar.inverted-blue > li[data-step="1"]:before,
.cancellation .brochure-block-inverted .step1 .stepbar.inverted-blue > li[data-step="1"]:before {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step1 .stepbar.inverted-blue > li[data-step="1"]:after,
.cancellation .brochure-block-inverted .step1 .stepbar.inverted-blue > li[data-step="1"]:after {
  background: #0072a9;
  color: #0083c2;
}

.cancellation .brochure-block .step2 .stepbar.inverted-blue > li[data-step="2"],
.cancellation .brochure-block-inverted .step2 .stepbar.inverted-blue > li[data-step="2"] {
  color: #ffffff;
}

.cancellation .brochure-block .step2 .stepbar.inverted-blue > li[data-step="2"]:before,
.cancellation .brochure-block-inverted .step2 .stepbar.inverted-blue > li[data-step="2"]:before {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step2 .stepbar.inverted-blue > li[data-step="2"]:after,
.cancellation .brochure-block-inverted .step2 .stepbar.inverted-blue > li[data-step="2"]:after {
  background: #0072a9;
  color: #0083c2;
}

.cancellation .brochure-block .step3 .stepbar.inverted-blue > li[data-step="3"],
.cancellation .brochure-block-inverted .step3 .stepbar.inverted-blue > li[data-step="3"] {
  color: #ffffff;
}

.cancellation .brochure-block .step3 .stepbar.inverted-blue > li[data-step="3"]:before,
.cancellation .brochure-block-inverted .step3 .stepbar.inverted-blue > li[data-step="3"]:before {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step3 .stepbar.inverted-blue > li[data-step="3"]:after,
.cancellation .brochure-block-inverted .step3 .stepbar.inverted-blue > li[data-step="3"]:after {
  background: #0072a9;
  color: #0083c2;
}

.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="4"],
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="4"] {
  color: #ffffff;
}

.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="4"]:before,
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="4"]:before {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="4"]:after,
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="4"]:after {
  background: #0072a9;
  color: #0083c2;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="5"],
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="5"] {
  color: #ffffff;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="5"]:before,
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="5"]:before {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="5"]:after,
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="5"]:after {
  background: #0072a9;
  color: #0083c2;
}

.cancellation .brochure-block .step2 .stepbar.inverted-blue > li[data-step="1"],
.cancellation .brochure-block-inverted .step2 .stepbar.inverted-blue > li[data-step="1"] {
  color: #ffffff;
}

.cancellation .brochure-block .step2 .stepbar.inverted-blue > li[data-step="1"]:before,
.cancellation .brochure-block-inverted .step2 .stepbar.inverted-blue > li[data-step="1"]:before,
.cancellation .brochure-block .step2 .stepbar.inverted-blue > li[data-step="1"]:after,
.cancellation .brochure-block-inverted .step2 .stepbar.inverted-blue > li[data-step="1"]:after {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step3 .stepbar.inverted-blue > li[data-step="1"],
.cancellation .brochure-block-inverted .step3 .stepbar.inverted-blue > li[data-step="1"] {
  color: #ffffff;
}

.cancellation .brochure-block .step3 .stepbar.inverted-blue > li[data-step="1"]:before,
.cancellation .brochure-block-inverted .step3 .stepbar.inverted-blue > li[data-step="1"]:before,
.cancellation .brochure-block .step3 .stepbar.inverted-blue > li[data-step="1"]:after,
.cancellation .brochure-block-inverted .step3 .stepbar.inverted-blue > li[data-step="1"]:after {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step3 .stepbar.inverted-blue > li[data-step="2"],
.cancellation .brochure-block-inverted .step3 .stepbar.inverted-blue > li[data-step="2"] {
  color: #ffffff;
}

.cancellation .brochure-block .step3 .stepbar.inverted-blue > li[data-step="2"]:before,
.cancellation .brochure-block-inverted .step3 .stepbar.inverted-blue > li[data-step="2"]:before,
.cancellation .brochure-block .step3 .stepbar.inverted-blue > li[data-step="2"]:after,
.cancellation .brochure-block-inverted .step3 .stepbar.inverted-blue > li[data-step="2"]:after {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="1"],
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="1"] {
  color: #ffffff;
}

.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="1"]:before,
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="1"]:before,
.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="1"]:after,
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="1"]:after {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="2"],
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="2"] {
  color: #ffffff;
}

.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="2"]:before,
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="2"]:before,
.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="2"]:after,
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="2"]:after {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="3"],
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="3"] {
  color: #ffffff;
}

.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="3"]:before,
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="3"]:before,
.cancellation .brochure-block .step4 .stepbar.inverted-blue > li[data-step="3"]:after,
.cancellation .brochure-block-inverted .step4 .stepbar.inverted-blue > li[data-step="3"]:after {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="1"],
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="1"] {
  color: #ffffff;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="1"]:before,
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="1"]:before,
.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="1"]:after,
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="1"]:after {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="2"],
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="2"] {
  color: #ffffff;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="2"]:before,
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="2"]:before,
.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="2"]:after,
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="2"]:after {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="3"],
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="3"] {
  color: #ffffff;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="3"]:before,
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="3"]:before,
.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="3"]:after,
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="3"]:after {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="4"],
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="4"] {
  color: #ffffff;
}

.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="4"]:before,
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="4"]:before,
.cancellation .brochure-block .step5 .stepbar.inverted-blue > li[data-step="4"]:after,
.cancellation .brochure-block-inverted .step5 .stepbar.inverted-blue > li[data-step="4"]:after {
  background: #ffffff;
  color: #0083c2;
}

.cancellation .step-items {
  position: relative;
}

.cancellation .step-item {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  display: inline-block;
  position: relative;
  padding: 1rem;
}

.cancellation .step-item span {
  float: left;
  color: #0083c2;
  font-size: 9.4rem;
}

@media (min-width: 62em) {
  .cancellation .step-item span {
    display: block;
    width: 100%;
  }
}

@media (min-width: 75em) {
  .cancellation .step-item span {
    display: inline-block;
    width: auto;
  }
}

.cancellation .step-item h1 {
  color: #005e9b;
}

@media (min-width: 48em) {
  .cancellation .step-item h1 {
    margin-top: 5.9rem;
  }
}

@media (min-width: 75em) {
  .cancellation .step-item h1 {
    margin-top: 2.9rem;
    margin-left: 6rem;
  }
}

.cancellation .step-item p {
  display: inline-block;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

@media (min-width: 20em) {
  .cancellation .step-item p {
    width: 100%;
    margin-top: 0rem;
  }
}

@media (min-width: 62em) {
  .cancellation .step-item p {
    text-align: left;
  }
}

@media (min-width: 75em) {
  .cancellation .step-item p {
    text-align: center;
  }
}

@media (min-width: 62em) {
  .cancellation .step-item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
    padding: 3rem;
  }
}

.cancellation .step-item a {
  width: 100%;
  max-width: 20rem;
}

.cancellation .step-item:after {
  display: block;
  position: absolute;
  top: 7.625rem;
  right: 0;
  width: 1.875rem;
  height: 1.875rem;
  background: url('/today/static/web/img/icons/icon-library/png/wizard-arrow-grey.png?b9709ff2b3cf');
  background-repeat: no-repeat;
  background-size: auto 100%;
  content: "";
}

@media (min-width: 75em) {
  .cancellation .step-item:after {
    right: -2.5rem;
  }
}

@media (max-width: 62em) {
  .cancellation .step-item:after {
    display: none;
  }
}

.cancellation .step-item:last-child {
  margin-right: 0rem;
}

.cancellation .step-item:last-child:after {
  display: none;
}

.cancellation .title {
  font-size: 1.75rem;
  text-align: center;
}

.cancellation .title br {
  display: none;
}

.cancellation .title-divider {
  margin-top: 2rem;
  margin-bottom: 6rem;
  text-align: center;
}

.cancellation .subtitle-small {
  width: 100%;
}

.cancellation .subtitle-small strong {
  color: #889391;
}

.cancellation .brochure-block .focal-point img,
.cancellation .brochure-block-inverted .focal-point img,
.cancellation .brochure-block-inverted .focal-point img {
  width: 75%;
}

.cancellation .hand .focal-point img {
  width: 50%;
}

@media (min-width: 48em) {
  .cancellation .brochure-block .description,
  .cancellation .brochure-block-inverted .description,
  .cancellation .brochure-block-inverted .description {
    padding-right: 2.25rem;
  }
}

.cancellation .brochure-block .description br,
.cancellation .brochure-block-inverted .description br,
.cancellation .brochure-block-inverted .description br {
  display: none;
}

@media (min-width: 62em) {
  .cancellation .brochure-block .description br,
  .cancellation .brochure-block-inverted .description br,
  .cancellation .brochure-block-inverted .description br {
    display: block;
  }
}

.cancellation .brochure-selling-items {
  display: table;
  padding-top: 1rem;
  padding-right: 2.5%;
  padding-left: 2.5%;
  table-layout: fixed;
}

.cancellation .brochure-selling-items .brochure-selling-points {
  display: table-row;
  float: none;
  table-layout: initial;
}

.cancellation .brochure-selling-items .item {
  padding: 0;
}

.cancellation .brochure-selling-items .inner {
  position: relative;
  height: 100%;
  padding: 0 .75rem;
  padding-bottom: 4.6rem;
  box-sizing: content-box;
}

.cancellation .brochure-selling-items .links {
  right: 0;
  left: 0;
  padding-right: .75rem;
  padding-left: .75rem;
}

.cancellation .brochure-selling-items .links a:first-child:last-child {
  margin-bottom: 2.3rem;
}

.cancellation .brochure-selling-items .item .focal-point img {
  width: 80%;
}

.cancellation .brochure-selling-items h3 {
  color: #889391;
}

.cancellation .brochure-selling-items .description br {
  display: none;
}

@media (min-width: 62em) {
  .cancellation .brochure-selling-items .description br {
    display: block;
  }
}

.cancellation .brochure-selling-items [class*="btn-"] {
  display: block;
  text-align: left;
}

.cancellation .brochure-selling-items [class*="btn-"].icon-play-blue,
.cancellation .brochure-selling-items [class*="btn-"].icon-download-blue {
  padding-left: 1.75rem;
  background-position: left center;
  background-size: 1rem;
}

.cancellation .lead-form,
.cancellation .lead-form-blue {
  padding-top: 0;
  padding-bottom: 0;
}

.cancellation .detail-builder .builder-grouping {
  border-top: 0;
}

.cancellation .button-next {
  width: 100%;
  float: none;
}

@media (min-width: 48em) {
  .cancellation .button-next {
    width: 25%;
    float: right;
  }
}

.cancellation .button-cancel {
  width: 100%;
  float: none;
}

@media (min-width: 48em) {
  .cancellation .button-cancel {
    width: 25%;
    float: left;
  }
}

@media (min-width: 48em) {
  .cancellation .wizard-buttons .btn[class] {
    width: 100%;
  }
}

.Vault {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

.Vault-intro {
  max-width: 43.75rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin: 0;
  padding: 2.25rem 5%;
  color: #000000;
  font-family: "Telkom123-Light", sans-serif;
  font-size: 1rem;
  letter-spacing: 0;
  line-height: 1.2;
  text-align: center;
}

@media (min-width: 48em) {
  .Vault-intro {
    padding: 2.25rem 3.375rem;
    font-size: 1.5rem;
  }
}

.Vault-intro strong {
  display: block;
  margin-bottom: 1.5rem;
  color: #0072a9;
  font-family: "Telkom123-Light", sans-serif;
  font-size: 1.5rem;
}

@media (min-width: 48em) {
  .Vault-intro strong {
    font-size: 2.25rem;
  }
}

.Vault-section {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  border-top: 1px solid #e8e7e7;
  background-color: #f7f7f7;
}

.Vault-plainButton {
  display: block;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
  color: #0083c2;
  text-decoration: none;
}

.Vault-plainButton:after {
  display: inline-block;
  width: .5em;
  height: .5em;
  margin-top: -.4em;
  margin-left: 1.5em;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  border-bottom: 0;
  border-left: 0;
  border-top-width: 2px;
  border-right-width: 2px;
  border-style: solid;
  border-color: #0083c2;
  content: "";
  vertical-align: middle;
}

.Vault-plainButton.is-selected:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.CurrencyValue {
  display: inline-block;
  color: #005e9b;
  text-align: center;
}

.CurrencyValue--inheritColor {
  color: inherit;
}

.CurrencyValue-sum {
  font-family: "Telkom123-Regular", sans-serif;
  font-size: 1em;
}

.CurrencyValue-sum--fontLight {
  font-family: "Telkom123-Light", sans-serif;
}

.CurrencyValue-cents {
  font-size: 60%;
}

.CurrencyValue-secondary {
  display: block;
  font-family: "Telkom123-Light", sans-serif;
  font-size: 35%;
}

.VaultShopListing {
  margin-bottom: 3.375rem;
  margin-left: 0;
  padding-left: 0;
  list-style: none;
  text-align: center;
}

.VaultShopListing-item {
  display: inline-block;
  max-width: 12.5rem;
  text-align: center;
}

.VaultShopListing-item + .VaultShopListing-item {
  margin-left: 11.39062rem;
}

.VaultShopListing-link {
  text-decoration: none;
}

.DealTout {
  display: block;
  margin: 0;
}

.DealTout-graphic {
  display: block;
  width: 100%;
  max-width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.DealTout-graphic--small {
  max-width: 5rem;
}

.DealTout-graphic--medium {
  max-width: 10rem;
}

.DealTout-graphic--large {
  max-width: 20rem;
}

.DealTout-title {
  color: #000000;
  font-size: 1.5rem;
}

.DealTout-title--colorBlue {
  color: #0083c2;
}

@media (min-width: 48em) {
  .DealTout-title {
    font-size: 2.25rem;
  }
}

.DealTout-subtitle {
  color: #000000;
  font-size: 1rem;
}

.DealTout-price {
  margin-top: -.5rem;
  font-size: 1.5rem;
}

@media (min-width: 48em) {
  .DealTout-price {
    font-size: 2.25rem;
  }
}

.DealTout-title,
.DealTout-subtitle,
.DealTout-graphic {
  display: block;
  margin-bottom: 0.44444rem;
}

.DealTout .DealTout-title,
.DealTout .DealTout-subtitle {
  font-family: "Telkom123-Light", sans-serif;
}

/* Partners */

.help-get .help-topics .item span.image {
  position: relative;
  margin: 0 auto;
  left: 0;
  top: 0;
  height: 11em;
  width: auto;
}

.help-community {
  padding-top: 48px;
  padding-top: 3rem;
  padding-bottom: 48px;
  padding-bottom: 3rem;
}

.help-community .item {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  padding: 24px;
  padding: 1.5rem;
  margin-top: 24px;
  margin-top: 1.5rem;
}

@media (min-width: 48em) {
  .help-community .item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .help-community .item:nth-child(3n) {
    float: right;
    margin-right: 0;
  }
}

.help-community .item #latesttopics p a {
  text-decoration: none;
  padding-right: 32px;
  padding-right: 2rem;
  background-position: right 9px;
  background-size: 5.6px;
  background-size: 0.35rem;
}

.help-topic-items .item {
  width: 48.57143%;
  float: left;
  margin-right: 2.85714%;
}

.help-topic-items .item:nth-child(2n) {
  margin-right: 0;
}

@media (min-width: 48em) {
  .help-topic-items .item {
    width: 22.85714%;
    float: left;
    margin-right: 2.85714%;
  }

  .help-topic-items .item:nth-child(2n) {
    margin-right: 2.85714%;
  }

  .help-topic-items .item:nth-child(4n) {
    margin-right: 0;
  }
}

@media (min-width: 62em) {
  .help-topic-items .item {
    width: 14.28571%;
    float: left;
    margin-right: 2.85714%;
  }

  .help-topic-items .item:nth-child(2n) {
    margin-right: 2.85714%;
  }

  .help-topic-items .item:nth-child(4n) {
    margin-right: 2.85714%;
  }

  .help-topic-items .item:nth-child(6n) {
    margin-right: 0;
  }
}

@media (min-width: 75em) {
  .help-topic-items .item {
    width: 10%;
    float: left;
    margin-right: 2.85714%;
  }

  .help-topic-items .item:nth-child(2n) {
    margin-right: 2.85714%;
  }

  .help-topic-items .item:nth-child(4n) {
    margin-right: 2.85714%;
  }

  .help-topic-items .item:nth-child(6n) {
    margin-right: 2.85714%;
  }

  .help-topic-items .item:nth-child(8n) {
    margin-right: 0;
  }
}

.help-topic-items .item span.image,
.help-topic-items .item div.image {
  position: relative;
  margin: 0 auto;
  left: 0;
  top: 0;
  height: 7em;
  width: auto;
}

.help-drawer-items .drawer-item {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 48em) {
  .help-drawer-items .drawer-item {
    width: 48.57143%;
    float: left;
    margin-right: 2.85714%;
  }

  .help-drawer-items .drawer-item:nth-child(2n) {
    margin-right: 0;
  }
}

@media (min-width: 62em) {
  .help-drawer-items .drawer-item {
    width: 31.42857%;
    float: left;
    margin-right: 2.85714%;
  }

  .help-drawer-items .drawer-item:nth-child(2n) {
    margin-right: 2.85714%;
  }

  .help-drawer-items .drawer-item:nth-child(3n) {
    margin-right: 0;
  }
}

.help-drawer-items .drawer-item .help-icon-external {
  padding-bottom: 4px;
  padding-bottom: 0.25rem;
  padding-bottom: 28px;
  padding-bottom: 1.75rem;
  padding-left: 80px;
  padding-left: 5rem;
  background-image: url('/today/static/web/images/icons/extra/external_hyperlinks_white.png?1f5f1ea8c9c3');
  background-position: left top;
  background-size: 64px;
  background-size: 4rem;
  display: block;
}

.help-drawer-items .drawer-item .help-icon-download {
  padding-bottom: 4px;
  padding-bottom: 0.25rem;
  padding-bottom: 28px;
  padding-bottom: 1.75rem;
  padding-left: 80px;
  padding-left: 5rem;
  background-image: url('/today/static/web/images/icons/extra/pdf_white.png?98ad4ceb40d3');
  background-position: left top;
  background-size: 64px;
  background-size: 4rem;
  display: block;
}

.help-drawer-items .drawer-item .help-icon-video {
  padding-bottom: 4px;
  padding-bottom: 0.25rem;
  padding-bottom: 28px;
  padding-bottom: 1.75rem;
  padding-left: 80px;
  padding-left: 5rem;
  background-image: url('/today/static/web/images/icons/extra/self_help_videos_white.png?0ad6669c1d3d');
  background-position: left top;
  background-size: 64px;
  background-size: 4rem;
  display: block;
}

/* Vendor */

/* Ion.RangeSlider
// css version 2.0.3
// © 2013-2014 Denis Ineshin | IonDen.com
// ===================================================================================================================*/

/* =====================================================================================================================
// RangeSlider */

.irs {
  position: relative;
  display: block;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.irs-line {
  position: relative;
  display: block;
  overflow: hidden;
  outline: none !important;
}

.irs-line-left,
.irs-line-mid,
.irs-line-right {
  position: absolute;
  display: block;
  top: 0;
}

.irs-line-left {
  left: 0;
  width: 11%;
}

.irs-line-mid {
  left: 9%;
  width: 82%;
}

.irs-line-right {
  right: 0;
  width: 11%;
}

.irs-bar {
  position: absolute;
  display: block;
  left: 0;
  width: 0;
}

.irs-bar-edge {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
}

.irs-shadow {
  position: absolute;
  display: none;
  left: 0;
  width: 0;
}

.irs-slider {
  position: absolute;
  display: block;
  cursor: default;
  z-index: 1;
}

.irs-slider.type_last {
  z-index: 2;
}

.irs-min {
  position: absolute;
  display: block;
  left: 0;
  cursor: default;
}

.irs-max {
  position: absolute;
  display: block;
  right: 0;
  cursor: default;
}

.irs-from,
.irs-to,
.irs-single {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  cursor: default;
  white-space: nowrap;
}

.irs-grid {
  position: absolute;
  display: none;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 20px;
}

.irs-with-grid .irs-grid {
  display: block;
}

.irs-grid-pol {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 8px;
  background: #000;
}

.irs-grid-pol.small {
  height: 4px;
}

.irs-grid-text {
  position: absolute;
  bottom: 0;
  left: 0;
  white-space: nowrap;
  text-align: center;
  font-size: 9px;
  line-height: 9px;
  padding: 0 3px;
  color: #000;
}

.irs-disable-mask {
  position: absolute;
  display: block;
  top: 0;
  left: -1%;
  width: 102%;
  height: 100%;
  cursor: default;
  background: transparent;
  z-index: 2;
}

.irs-disabled {
  opacity: 0.4;
}

.lt-ie9 .irs-disabled {
  filter: alpha(opacity=40);
}

.irs-hidden-input {
  position: absolute !important;
  display: block !important;
  top: 0 !important;
  left: 0 !important;
  width: 0 !important;
  height: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  outline: none !important;
  z-index: -9999 !important;
  background: none !important;
  border-style: solid !important;
  border-color: transparent !important;
}

/* Ion.RangeSlider, Simple Skin
// css version 2.0.3
// © Denis Ineshin, 2014    https://github.com/IonDen
// © guybowden, 2014        https://github.com/guybowden
// ===================================================================================================================*/

/* =====================================================================================================================
// Skin details */

.irs {
  /*height: 55px;*/
}

.irs-with-grid {
  height: 75px;
}

.irs-line {
  height: 10px;
  top: 33px;
  background: #EEE;
  background: -webkit-linear-gradient(top, #DDD -50%, #FFF 150%);
  background: linear-gradient(to bottom, #DDD -50%, #FFF 150%);
  /* W3C */
  border: 1px solid #CCC;
  border-radius: 16px;
  -moz-border-radius: 16px;
}

.irs-line-left {
  height: 8px;
}

.irs-line-mid {
  height: 8px;
}

.irs-line-right {
  height: 8px;
}

.irs-bar {
  height: 10px;
  top: 33px;
  border-top: 1px solid #428bca;
  border-bottom: 1px solid #428bca;
  background: #428bca;
  background: -webkit-linear-gradient(bottom, #428bca 0%, #7fc3e8 100%);
  background: linear-gradient(to top, #428bca 0%, #7fc3e8 100%);
  /* W3C */
}

.irs-bar-edge {
  height: 10px;
  top: 33px;
  width: 14px;
  border: 1px solid #428bca;
  border-right: 0;
  background: #428bca;
  background: -webkit-linear-gradient(bottom, #428bca 0%, #7fc3e8 100%);
  background: linear-gradient(to top, #428bca 0%, #7fc3e8 100%);
  /* W3C */
  border-radius: 16px 0 0 16px;
  -moz-border-radius: 16px 0 0 16px;
}

.irs-shadow {
  height: 2px;
  top: 38px;
  background: #000;
  opacity: 0.3;
  border-radius: 5px;
  -moz-border-radius: 5px;
}

.lt-ie9 .irs-shadow {
  filter: alpha(opacity=30);
}

.irs-slider {
  top: 25px;
  width: 27px;
  height: 27px;
  border: 1px solid #AAA;
  background: #DDD;
  background: -webkit-linear-gradient(top, white 0%, gainsboro 20%, white 100%);
  background: linear-gradient(to bottom, white 0%, gainsboro 20%, white 100%);
  /* W3C */
  border-radius: 27px;
  -moz-border-radius: 27px;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  cursor: pointer;
}

.irs-slider.state_hover,
.irs-slider:hover {
  background: #FFF;
}

.irs-min,
.irs-max {
  color: #333;
  font-size: 12px;
  line-height: 1.333;
  text-shadow: none;
  top: 0;
  padding: 1px 5px;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  -moz-border-radius: 3px;
}

.lt-ie9 .irs-min,
.lt-ie9 .irs-max {
  background: #ccc;
}

.irs-from,
.irs-to,
.irs-single {
  color: #fff;
  font-size: 14px;
  line-height: 1.333;
  text-shadow: none;
  padding: 1px 5px;
  background: #428bca;
  border-radius: 3px;
  -moz-border-radius: 3px;
}

.lt-ie9 .irs-from,
.lt-ie9 .irs-to,
.lt-ie9 .irs-single {
  background: #999;
}

.irs-grid {
  height: 27px;
}

.irs-grid-pol {
  opacity: 0.5;
  background: #428bca;
}

.irs-grid-pol.small {
  background: #999;
}

.irs-grid-text {
  bottom: 5px;
  color: #99a4ac;
}

/*
 *  Core Owl Carousel CSS File
 *  v1.3.3
 */

/* clearfix */

.owl-carousel .owl-wrapper:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

/* display none until init */

.owl-carousel {
  display: none;
  position: relative;
  width: 100%;
  -ms-touch-action: pan-y;
}

.owl-carousel .owl-wrapper {
  display: none;
  position: relative;
  -webkit-transform: translate3d(0px, 0px, 0px);
}

.owl-carousel .owl-wrapper-outer {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.owl-carousel .owl-wrapper-outer.autoHeight {
  -webkit-transition: height 500ms ease-in-out;
  transition: height 500ms ease-in-out;
}

.owl-carousel .owl-item {
  float: left;
}

.owl-controls .owl-page,
.owl-controls .owl-buttons div {
  cursor: pointer;
}

.owl-controls {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

/* mouse grab icon */

.grabbing {
  /*cursor:url('/today/static/web/css/grabbing.png') 8 8, move;*/
}

/* fix */

.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}

/*
*   Owl Carousel Owl Demo Theme
*   v1.3.3
*/

.owl-theme .owl-controls {
  margin-top: 10px;
  text-align: center;
}

/* Styling Next and Prev buttons */

.owl-theme .owl-controls .owl-nav div,
.owl-theme .owl-controls .owl-buttons div {
  color: #FFF;
  display: inline-block;
  zoom: 1;
  *display: inline;
  /*IE7 life-saver */
  margin: 5px;
  padding: 3px 10px;
  font-size: 12px;
  border-radius: 30px;
  background: #869791;
  filter: Alpha(Opacity=50);
  /*IE7 fix*/
  opacity: 0.5;
}

/* Clickable class fix problem with hover on touch devices */

/* Use it for non-touch hover action */

.owl-theme .owl-controls.clickable .owl-nav div:hover,
.owl-theme .owl-controls.clickable .owl-buttons div:hover {
  filter: Alpha(Opacity=100);
  /*IE7 fix*/
  opacity: 1;
  text-decoration: none;
}

/* Styling Pagination*/

.owl-theme .owl-controls .owl-page {
  display: inline-block;
  zoom: 1;
  *display: inline;
  /*IE7 life-saver */
}

.owl-theme .owl-controls .owl-page span {
  display: block;
  width: 12px;
  height: 12px;
  margin: 5px 7px;
  filter: Alpha(Opacity=50);
  /*IE7 fix*/
  opacity: 0.5;
  border-radius: 20px;
  background: #869791;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span {
  filter: Alpha(Opacity=100);
  /*IE7 fix*/
  opacity: 1;
}

/* If PaginationNumbers is true */

.owl-theme .owl-controls .owl-page span.owl-numbers {
  height: auto;
  width: auto;
  color: #FFF;
  padding: 2px 10px;
  font-size: 12px;
  border-radius: 30px;
}

/* preloading images */

.owl-item.loading {
  min-height: 150px;
  /*background: url('/today/static/web/css/AjaxLoader.gif') no-repeat center center*/
}

/*
 *  Owl Carousel CSS3 Transitions
 *  v1.3.2
 */

.owl-origin {
  -webkit-perspective: 1200px;
  -webkit-perspective-origin-x: 50%;
  -webkit-perspective-origin-y: 50%;
  -moz-perspective: 1200px;
  -moz-perspective-origin-x: 50%;
  -moz-perspective-origin-y: 50%;
  perspective: 1200px;
}

/* fade */

.owl-fade-out {
  z-index: 10;
  -webkit-animation: fadeOut .7s both ease;
  animation: fadeOut .7s both ease;
}

.owl-fade-in {
  -webkit-animation: fadeIn .7s both ease;
  animation: fadeIn .7s both ease;
}

/* backSlide */

.owl-backSlide-out {
  -webkit-animation: backSlideOut 1s both ease;
  animation: backSlideOut 1s both ease;
}

.owl-backSlide-in {
  -webkit-animation: backSlideIn 1s both ease;
  animation: backSlideIn 1s both ease;
}

/* goDown */

.owl-goDown-out {
  -webkit-animation: scaleToFade .7s ease both;
  animation: scaleToFade .7s ease both;
}

.owl-goDown-in {
  -webkit-animation: goDown .6s ease both;
  animation: goDown .6s ease both;
}

/* scaleUp */

.owl-fadeUp-in {
  -webkit-animation: scaleUpFrom .5s ease both;
  animation: scaleUpFrom .5s ease both;
}

.owl-fadeUp-out {
  -webkit-animation: scaleUpTo .5s ease both;
  animation: scaleUpTo .5s ease both;
}

/* Keyframes */

/*empty*/

@-webkit-keyframes empty {
  0% {
    opacity: 1;
  }
}

@keyframes empty {
  0% {
    opacity: 1;
  }
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

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

  100% {
    opacity: 1;
  }
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@-webkit-keyframes backSlideOut {
  25% {
    opacity: .5;
    -webkit-transform: translateZ(-500px);
  }

  75% {
    opacity: .5;
    -webkit-transform: translateZ(-500px) translateX(-200%);
  }

  100% {
    opacity: .5;
    -webkit-transform: translateZ(-500px) translateX(-200%);
  }
}

@keyframes backSlideOut {
  25% {
    opacity: .5;
    -webkit-transform: translateZ(-500px);
    transform: translateZ(-500px);
  }

  75% {
    opacity: .5;
    -webkit-transform: translateZ(-500px) translateX(-200%);
    transform: translateZ(-500px) translateX(-200%);
  }

  100% {
    opacity: .5;
    -webkit-transform: translateZ(-500px) translateX(-200%);
    transform: translateZ(-500px) translateX(-200%);
  }
}

@-webkit-keyframes backSlideIn {
  0%, 25% {
    opacity: .5;
    -webkit-transform: translateZ(-500px) translateX(200%);
  }

  75% {
    opacity: .5;
    -webkit-transform: translateZ(-500px);
  }

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

@keyframes backSlideIn {
  0%, 25% {
    opacity: .5;
    -webkit-transform: translateZ(-500px) translateX(200%);
    transform: translateZ(-500px) translateX(200%);
  }

  75% {
    opacity: .5;
    -webkit-transform: translateZ(-500px);
    transform: translateZ(-500px);
  }

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

@-webkit-keyframes scaleToFade {
  to {
    opacity: 0;
    -webkit-transform: scale(0.8);
  }
}

@keyframes scaleToFade {
  to {
    opacity: 0;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@-webkit-keyframes goDown {
  from {
    -webkit-transform: translateY(-100%);
  }
}

@keyframes goDown {
  from {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }
}

@-webkit-keyframes scaleUpFrom {
  from {
    opacity: 0;
    -webkit-transform: scale(1.5);
  }
}

@keyframes scaleUpFrom {
  from {
    opacity: 0;
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
  }
}

@-webkit-keyframes scaleUpTo {
  to {
    opacity: 0;
    -webkit-transform: scale(1.5);
  }
}

@keyframes scaleUpTo {
  to {
    opacity: 0;
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
  }
}

/****************************************************************/

/*  Ghosting elements                                           */

/*  Indicating when something is disabled                       */

/*  Please note these are mainly overrides, not additions       */

/****************************************************************/

.ghost * {
  color: #889391;
}

.ghost .blue {
  color: #cccccc;
}

.ghost .green {
  color: #cccccc;
}

.ghost .lime {
  color: #cccccc;
}

.ghost .orange {
  color: #cccccc;
}

.ghost .pink {
  color: #cccccc;
}

.ghost a,
.ghost a:hover,
.ghost .btn {
  cursor: default;
  color: #cccccc;
}

.ghost .btn-primary {
  border-color: #cccccc;
  background: #cccccc;
  color: #ffffff;
}

.ghost .btn-primary:hover {
  background: #cccccc;
  color: #ffffff;
}

.ghost .btn-secondary {
  background: #f7f7f7;
}

.ghost .btn-secondary:hover {
  background: #f7f7f7;
}

.ghost [class*="icon-"] {
  background: 0 !important;
}

.ghost:hover {
  cursor: default;
}

.ghost .SelectBox * {
  color: #cccccc !important;
}

.ghost .SelectBox label {
  opacity: 0.25;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  filter: grayscale(100%);
}

.ghost *:hover {
  cursor: default;
}

.ghost:after {
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1000;
  display: block;
  content: "";
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #ffffff;
  opacity: 0.7;
}
table.foundry-page-row {
    width: 100%;
    margin: 0px 0px 4px 0px;
}    
table.foundry-page-row tr {
    height: 100%;
}
td.foundry-page-column {
    height: 100%;
    vertical-align: top;
    padding: 0;
}    
td.foundry-page-column-1 {
    width: 6%;
}    
td.foundry-page-column-2 {
    width: 12%;
}    
td.foundry-page-column-3 {
    width: 18%;
}    
td.foundry-page-column-4 {
    width: 24%;
}    
td.foundry-page-column-5 {
    width: 30%;
}    
td.foundry-page-column-6 {
    width: 36%;
}    
td.foundry-page-column-7 {
    width: 42%;
}    
td.foundry-page-column-8 {
    width: 48%;
}    
td.foundry-page-column-9 {
    width: 54%;
}    
td.foundry-page-column-10 {
    width: 60%;
}    
td.foundry-page-column-11 {
    width: 66%;
}    
td.foundry-page-column-12 {
    width: 72%;
}    
td.foundry-page-column-13 {
    width: 78%;
}    
td.foundry-page-column-14 {
    width: 84%;
}    
td.foundry-page-column-15 {
    width: 90%;
}    
td.foundry-page-column-16 {
    width: 100%;
}    

div.foundry-page-tile {
    padding: 0px;
} 

.object-comments form label {
    display: block;
}
.object-comments form textarea {
}
.object-comments form p.submit {
}

.foundry-comments-messages-navbar { 
    background-color: #000; 
    color: #555; 
    padding: 3px 3px 5px 3px; 
    clear: both;
}
.foundry-comments-messages-navbar a { 
    color: #fff ;
}
.foundry-comments-messages-navbar div.item { 
    display: inline;
    padding: 0 2px ;
}
.foundry-comments-messages-navbar div.active { 
    background-color: #fff;
}
.foundry-comments-messages-navbar div.active a { 
    color: #323232 ;
}

.foundry-comments-pages-navbar { 
    background-color: #000; 
    color: #555; 
    padding: 3px 3px 5px 3px; 
    clear: both;
}
.foundry-comments-pages-navbar a { 
    color: #fff ;
}
.foundry-comments-pages-navbar div.item { 
    display: inline;
    padding: 0 2px ;
}
.foundry-comments-pages-navbar div.active { 
    background-color: #fff;
}
.foundry-comments-pages-navbar div.active a { 
    color: #323232 ;
}

/*

    GalleryView Stylesheet
    
    Use the CSS rules below to modify the look of your gallery.
     
    To create additional rules, use the markup below as a guide to GalleryView's architecture.
*/

/* GALLERY LIST */
/* IMPORTANT - Change '#myGallery' to the ID of your gallery list to prevent a flash of unstyled content */
#myGallery { display: none; }

.gv_galleryWrap { position: relative; background: #d9d9d9; font-size: 10pt;margin: 0 auto; }

/* GALLERY DIV */
.gv_gallery { overflow: hidden; position: relative;}


/*************************************************/
/**   PANEL STYLES                              **/
/*************************************************/

.gv_panelWrap { filter: inherit; position: absolute; overflow: hidden; }

.gv_panel-loading { background: url('/today/static/web/gallery/images/img-loader.gif') 50% 50% no-repeat #aaa; }
.gv_frame-loading { background: url('/today/static/web/gallery/images/img-loader.gif') 50% 50% no-repeat #aaa; }

/* GALLERY PANELS */
.gv_panel { filter: inherit; position: absolute; top: 0; left: 0; overflow: hidden; z-index: 100; }
.gv_panel img { position: absolute; }

.gv_overlay { position: absolute; background: black; color: white; z-index: 200; }
.gv_showOverlay { 
    position: absolute; 
    width: 20px; 
    height: 20px; 
    cursor: pointer;
    z-index: 200;
    /*background: #d9d9d9;*/
    background-image:url('/today/static/web/gallery/images/gallery-info.png?c1ec014237ed');
}
.gv_overlay h4 { color: white; margin: 1em; font-weight: bold; }
.gv_overlay p { color: white; margin: 1em; }

.gv_infobar {
    background: #222;
    padding: 0 0.5em;
    line-height: 1.5em;
    height: 1.5em;
    font-size: 10pt;
    font-weight: bold;
    color: white;
    
    position: absolute;
    bottom: 0;
    right: 0;
    display: none;
    vertical-align: middle;
    z-index: 2000;
    
}


/*************************************************/
/**   FILMSTRIP STYLES                          **/
/*************************************************/

.gv_filmstripWrap { overflow: hidden; position: absolute; }


/* FILMSTRIP */
.gv_filmstrip { margin: 0; padding: 0; position: absolute; top: 0; left: 0; }

/* FILMSTRIP FRAMES (contains both images and captions) */
.gv_frame { 
    cursor: pointer;
    float: left;
    position: relative;
    margin: 0;
    padding: 0;
}

/* WRAPPER FOR FILMSTRIP IMAGES */
.gv_frame .gv_thumbnail { position: relative;overflow: hidden !important; }

/* WRAPPER FOR CURRENT FILMSTRIP IMAGE */
.gv_frame.current .gv_thumbnail {}

/* FRAME IMAGES */
.gv_frame img { border: none; position: absolute; }

/* FRAME CAPTION */
.gv_frame .gv_caption { height: 14px; line-height: 14px; font-size: 10px; text-align: center; color:white; }

/* CURRENT FRAME CAPTION */
.gv_frame.current .gv_caption { }

/* POINTER FOR CURRENT FRAME */
.gv_pointer {
    border-color: black;
}

/* NAVIGATION BUTTONS */
.gv_navWrap {
    text-align: center;
    position: absolute;
}
.gv_navPlay,
.gv_navPause,
.gv_navNext,
.gv_navPrev {
    
    opacity: 0.3;
    -moz-opacity: 0.3;
    -khtml-opacity: 0.3;
    filter:alpha(opacity=30);
    display:-moz-inline-stack;
    display:inline-block;
    zoom:1;
    *display:inline;
    vertical-align: middle;
}
.gv_navPlay:hover,
.gv_navPause:hover,
.gv_navNext:hover,
.gv_navPrev:hover {
    opacity: 0.8;
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    filter:alpha(opacity=80);
}

.gv_panelNavPrev,
.gv_panelNavNext {
    position: absolute;
    display: none;
    opacity: 0.50;
    -moz-opacity: 0.50;
    -khtml-opacity: 0.50;
    filter:alpha(opacity=50);
    z-index: 200;
}

.gv_panelNavPrev:hover,
.gv_panelNavNext:hover {
    opacity: 0.9;
    -moz-opacity: 0.9;
    -khtml-opacity: 0.9;
    filter:alpha(opacity=90);
}

.gv_navPlay {
    height: 30px;
    width: 30px;
    cursor: pointer;
    background: url('/today/static/web/gallery/images/play-big.png') top left no-repeat;
}
.gv_navPause {
    height: 30px;
    width: 30px;
    cursor: pointer;
    background: url('/today/static/web/gallery/images/pause-big.png') top left no-repeat;
}
.gv_navNext {
    height: 20px;
    width: 20px;
    cursor: pointer;
    background: url('/today/static/web/gallery/images/next.png') top left no-repeat;
}
.gv_navPrev {
    height: 20px;
    width: 20px;
    cursor: pointer;
    background: url('/today/static/web/gallery/images/prev.png') top right no-repeat;
}
.gv_panelNavNext {
    height: 20px;
    width: 20px;
    cursor: pointer;
    background: url('/today/static/web/gallery/images/panel-next.png') top left no-repeat;
}
.gv_panelNavPrev {
    height: 20px;
    width: 20px;
    cursor: pointer;
    background: url('/today/static/web/gallery/images/panel-prev.png') top right no-repeat;
}

/* TRANSPARENT BORDER FIX FOR IE6 */
/* NOTE - DO NOT CHANGE THIS RULE */
*html .gv_pointer {
    filter: chroma(color=pink);
}

/*
    AnythingSlider v1.7+ Default (base) theme
    By Chris Coyier: http://css-tricks.com
    with major improvements by Doug Neiner: http://pixelgraphics.us/
    based on work by Remy Sharp: http://jqueryfordesigners.com/
*/

/*****************************
  SET DEFAULT DIMENSIONS HERE
 *****************************/

#slider { width: 600px; height: 378px; list-style: none; overflow-y: auto; overflow-x: hidden; }
.anythingBase { max-width: 32766px; }

/*****************
  SET COLORS HERE
 *****************/

div.anythingSlider.activeSlider .anythingControls ul a.cur { color: #c5c5c5; }
div.anythingSlider.activeSlider .anythingControls ul a { color: #666; line-height: 18px; }

/***********************
  COMMON SLIDER STYLING
 ***********************/

div.anythingSlider { display: block; margin: 0 auto; overflow: visible !important; position: relative; padding: 0; }
div.anythingSlider .anythingWindow { overflow: hidden; position: relative; width: 100%; height: 100%; }
.anythingBase { background: transparent; list-style: none; position: absolute; overflow: visible !important; top: 0; left: 0; margin: 0; padding: 0; }
.anythingBase .panel { display: block; overflow: hidden; float: left; padding: 0; margin: 0; position: relative; }
.anythingBase .panel.vertical { float: none; }
.anythingBase .panel .info { width: 560px; height: 113px; padding: 0 20px; background: url('/today/static/web/images/slider_bg.png?5582b49a9240') repeat; position: absolute; bottom: 40px; left: 0; z-index: 3; }
.anythingBase .panel .info .subtitle { padding: 15px 0 5px 0; font-size: 12px; font-weight: bold; color: #fff; text-transform: uppercase; }
.anythingBase .panel .info .title { padding: 15px 0 0 0; font-size: 22px; font-weight: bold; color: #fff; background: transparent!important; border: 0; margin: 0; padding: 0; }
.anythingBase .panel .info .title a { color: #fff; }
.anythingBase .panel .info .description { padding: 10px 0 0 0; color: #fff; font-size: 12px; }
div.anythingSlider .arrow { bottom: 15px; position: absolute; display: block; left: 0; z-index: 2; }
div.anythingSlider .arrow a { width: 9px; height: 11px; display: block; text-align: center; outline: 0; }
div.anythingSlider .arrow a span { display: block; text-indent: -9999px; }
div.anythingSlider .back { left: 87px; }
div.anythingSlider .back a { background: url('/today/static/web/images/slider_arrow_left.png?ae0ed70b97fd') top no-repeat; }
div.anythingSlider .back a:hover, 
div.anythingSlider .back a.hover { background: url('/today/static/web/images/slider_arrow_left.png?ae0ed70b97fd') bottom no-repeat; }
div.anythingSlider .back.disabled { display: none; } /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */
div.anythingSlider .forward { left: 500px; }
div.anythingSlider .forward a { background: url('/today/static/web/images/slider_arrow_right.png?5b86259d1d15') top no-repeat; }
div.anythingSlider .forward a:hover, 
div.anythingSlider .forward a.hover { background: url('/today/static/web/images/slider_arrow_right.png?5b86259d1d15') bottom no-repeat; }
div.anythingSlider .forward.disabled { display: none; } /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */
div.anythingSlider .anythingControls { width: 600px; height: 40px; position: absolute; bottom: 0; left: 0; z-index: 1; background: #fff; outline: 0; display: none; }
div.anythingSlider .anythingControls ul { width: 95px; margin: 15px auto; padding: 0 0 0 20px; }
div.anythingSlider .anythingControls ul li { width: 10px; height: 10px; float: left; margin: 0 5px 0 0; display: inline; }
div.anythingSlider .anythingControls ul li a { background: url('/today/static/web/images/slider_dots.png?d11c5c005bdf') top no-repeat; }
div.anythingSlider .anythingControls ul li a:hover { background: url('/today/static/web/images/slider_dots.png?d11c5c005bdf') center no-repeat; }
div.anythingSlider .anythingControls ul li a.cur,
div.anythingSlider .anythingControls ul li a.cur:hover { background: url('/today/static/web/images/slider_dots.png?d11c5c005bdf') bottom no-repeat; }
div.anythingSlider .anythingControls ul a { width: 10px; height: 10px; float: left; text-decoration: none; text-align: left; outline: 0; overflow: hidden; text-indent: -100px; }
div.anythingSlider .anythingControls .anythingNavWindow { overflow: hidden; float: left; }
div.anythingSlider.rtl .anythingControls ul a { float: right; } /* reverse order of nav links */
div.anythingSlider.rtl .anythingControls ul { float: left; }    /* move nav link group to left */
div.anythingSlider.rtl .anythingWindow { direction: ltr; unicode-bidi: bidi-override; }
div.anythingSlider .start-stop { padding: 2px 5px; width: 40px; text-align: center; text-decoration: none; float: right; z-index: 100; outline: 0; border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; }
div.anythingSlider .start-stop:hover, div.anythingSlider .start-stop.hover { background-image: none; }
div.anythingSlider, div.anythingSlider .anythingWindow, div.anythingSlider .anythingControls ul a, div.anythingSlider .arrow a, div.anythingSlider .start-stop { transition-duration: 0; -o-transition-duration: 0; -moz-transition-duration: 0; -webkit-transition-duration: 0; }


div.social-buttons a {
    cursor: pointer;
    font: -webkit-small-control;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-decoration: none;
    text-indent: 0px;
    text-shadow: none;
    box-shadow: none;
    font-weight: bold;
    line-height: 45px;
    border-radius: 2px;
    border: none;
    height: 45px;
    width: auto;
    white-space: nowrap;
    font-size: 0.9em;
    display: inline-block;
    margin: 1em;
    padding-right: 8px
}
div.social-buttons a.facebook {
    background-color: #536A97;
    background: -webkit-linear-gradient(top, #536A97, #3D5382);
    background: -moz-linear-gradient(top, #536A97, #3D5382);
    background: -o-linear-gradient(top, #536A97, #3D5382);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#536a97',endColorstr='#4f77a7');
    background-image: -ms-linear-gradient(#536A97, #3D5382);
    color: #fff;
    
}
div.social-buttons a.twitter {
    background-color: #5EAADC;
    background: -webkit-linear-gradient(top, #5EAADC, #4797D3);
    background: -moz-linear-gradient(top, #5EAADC, #4797D3);
    background: -o-linear-gradient(top, #5EAADC, #4797D3);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5EAADC',endColorstr='#4f77a7');
    background-image: -ms-linear-gradient(#5EAADC, #4797D3);
    color: #fff;    
}
div.social-buttons a.google {
    background-color: #D14836;
    background: -webkit-linear-gradient(top, #C53717, #D14836);
    background: -moz-linear-gradient(top, #C53717, #D14836);
    background: -o-linear-gradient(top, #C53717, #D14836);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5eeadc',endColorstr='#D14836');
    background-image: -ms-linear-gradient(#c53717, #D14836);
    color: #fff;    
}
div.social-buttons a span {
    display: inline-block;
    vertical-align: middle;
    margin-left: 7px;
}
div.social-buttons a.facebook span {
    background: url('/today/static/web/images/facebook-connect-button.png?e453b099c1bf') 0 10px no-repeat;
    width: 36px;
    height: 45px;
}
div.social-buttons a.twitter span {
    background: url('/today/static/web/images/twitter-oauth-button.png?44f0c7bf41c1') 0 10px no-repeat;
    width: 36px;
    height: 45px;
}

div.social-buttons a.google span {
    background: url('/today/static/web/images/google-oauth2-button.png?caa32451dfb1') 0 10px no-repeat;
    width: 36px;
    height: 45px;
}

/* */
.prevent-shop-click { width: 100%; height: 100%; position: absolute; z-index: 1000; }
a .item.ghost { position: relative; }