@font-face {
    font-family: 'Open Sans', sans-serif;
    font-family: 'Oswald', sans-serif;
    font-family: 'Kanit', sans-serif;
    font-weight: normal;
}




  .layer-shadow {
    box-shadow:
      0 1px 1px hsl(0deg 0% 0% / 0.075),
      0 2px 2px hsl(0deg 0% 0% / 0.075),
      0 4px 4px hsl(0deg 0% 0% / 0.075),
      0 8px 8px hsl(0deg 0% 0% / 0.075),
      0 16px 16px hsl(0deg 0% 0% / 0.075)
    ;
  }


h3.blue-line > span {
    box-shadow: inset 0 -20px 0 0 #07cef6;
    line-height: 1.3;
}

h3.purple-line > span {
    box-shadow: inset 0 -20px 0 0 #e71ed9;
    line-height: 1.3;
}


.shade {
    text-shadow: -1px -2px 9px rgb(0 0 0 / 34%);
}





.pink {
    color: #ff7fc1;
}

.deep-purple {
    color: #741398;
}



.lime {
    color: #d6f31f;
}

.under
{
    text-decoration: underline;
}

h2 a,
h3 a,
h4 a {
    color: #000
}

h2 a:hover,
h3 a:hover,
h4 a:hover {
    color: #e20074
}

pre {
    background: #ffc;
    padding: 2em 4em
}

pre+pre {
    margin-top: 20px
}

a {
    text-decoration: none;
    cursor: pointer
}

a:hover {
    text-decoration: underline
}

.section-gray-verydark a {
    color: #00A0DE
}

a img {
    border: 0;
    cursor: pointer
}

h1,
h2,
h3,
h4 {
    text-rendering: optimizeLegibility
}

h1 a,
h2 a,
h3 a,
h4 a {
    text-decoration: none !important
}

h1 {
    font: normal 36px/40px 'Oswald', Arial, sans-serif;
    font-size: 2.25rem;
    line-height: 2.5rem;
    text-transform: uppercase;
    margin-bottom: 5px;
    margin-bottom: 1.25rem
}

h2 {
    font: normal 24px/30px 'Oswald', Arial, sans-serif;
    font-size: 1.5rem;
    line-height: 1.875rem;
    text-transform: uppercase;
    margin-bottom: 10px;
    margin-bottom: .625rem
}

h3,
h4,
dt {
    font: normal 100%/20px 'Oswald', Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.25rem;
    text-transform: uppercase;
    margin-bottom: 10px;
    margin-bottom: .625rem
}

p {
    font-size: 0.9375em;
    /* 15px/16=0.875em */
}

.font-100 {
    font-weight: 100!important
}

.font-300 {
    font-weight: 300!important
}

.font-400 {
    font-weight: 400!important
}

.font-500 {
    font-weight: 500!important
}

.font-600 {
    font-weight: 600!important
}
.font-700 {
    font-weight: 600!important
}

.font-900 {
    font-weight: 900!important
}

.narrow {
    letter-spacing: -0.025em !important
}

.bold {
    font-weight: bold !important
}

.normal {
    font-weight: normal !important
}

.indented {
    text-indent: -9999px
}

.xxs {
    font-size: 10px !important;
    line-height: 15px !important;
    line-height: 0.9375rem !important
}

.xs {
    font-size: 12px !important;
    line-height: 20px !important;
    line-height: 1.25rem !important
}

.ss {
    font-size: 14px !important;
    line-height: 20px !important;
    line-height: 1.25rem !important
}

.s {
    font-size: 16px !important;
    line-height: 20px !important;
    line-height: 1.25rem !important
}

.sm {
    font-size: 16px !important;
    line-height: 22px !important;
    line-height: 1.375rem !important
}

.m {
    font-size: 21px !important;
    line-height: 25px !important;
    line-height: 1.5625rem !important
}

.l {
    font-size: 23px !important;
    line-height: 30px !important;
    line-height: 1.875rem !important
}

.mxl {
    font-size: 30px !important;
    line-height: 36px !important;
    line-height: 2.25rem !important
}

.xl {
    font-size: 36px !important;
    line-height: 40px !important;
    line-height: 2.5rem !important
}

.xxl {
    font-size: 48px !important;
    line-height: 50px !important;
    line-height: 3.125rem !important
}

.xxxl {
    font-size: 72px !important;
    line-height: 80px !important;
    line-height: 5rem !important
}

.xxxxl {
    font-size: 96px !important;
    line-height: 152px !important;
    line-height: 7.5rem !important
}

h1 span,
h1 strong {
    font-family: 'Oswald';
    text-transform: uppercase
}

h2 {
    text-transform: uppercase
}

h2.xxs,
h2.xs,
h2.s,
h2.m,
h2.l,
h2.mxl,
h2.xl,
h2.xxl,
h2.xxxl,
h2.xxxxl {
    font-weight: normal
}

h2.mxl,
h2.xl,
h2.xxl,
h2.xxxl,
h2.xxxxl {
    font-family: 'Oswald';
    letter-spacing: 0;
    font-weight: normal;
    text-transform: uppercase
}

h2 span,
h2 strong {
    font-family: 'Oswald', Arial, sans-serif
}

h3,
h4 {
    text-transform: uppercase
}

h3.xxs,
h3.xs,
h3.s,
h3.m,
h3.l,
h3.mxl,
h3.xl,
h3.xxl,
h3.xxxl,
h3.xxxxl,
h4.xxs,
h4.xs,
h4.s,
h4.m,
h4.l,
h4.mxl,
h4.xl,
h4.xxl,
h4.xxxl,
h4.xxxxl {
    font-weight: normal
}

h3.mxl,
h3.xl,
h3.xxl,
h3.xxxl,
h3.xxxxl,
h4.mxl,
h4.xl,
h4.xxl,
h4.xxxl,
h4.xxxxl {
    font-family: 'Oswald';
    letter-spacing: 0;
    font-weight: normal;
    text-transform: uppercase
}

p,
ul,
ol,
dl {
    margin-bottom: 10px;
    margin-bottom: .625rem
}

.htws-2016 ul li {
    list-style-image: url("i/icons/li-style-2016.gif")
}

.htws-2016 .grid ul li {
    list-style-image: none
}

.htws-2016 ul li p {
    margin-bottom: 0
}

div.small-print {
    border-top: 1px solid #d0d0d0;
    margin-top: 20px;
    margin-top: 1.25rem;
    padding-top: 20px;
    padding-top: 1.25rem
}

.small-print,
.small-note,
.caption,
small {
    font: 600 14px/20px 'Open Sans', Arial, sans-serif !important;
    font-size: .875rem;
    line-height: 1.25rem;
    color: #7c7c7c
}

p small {
    display: block
}

p strong {
    font-family: Tele-groteskFet;
    font-weight: normal
}

p em {
    font-family: Tele-groteskHal
}

.uppercase {
    text-transform: uppercase !important
}

.lowercase {
    text-transform: lowercase !important
}

.capitalize {
    text-transform: capitalize !important
}

.nowrap {
    white-space: nowrap
}

.underline {
    text-decoration: underline !important
}

.line-through {
    text-decoration: line-through
}

.line-height-1 {
    line-height: 1 !important
}

.drop-cap {
    float: left;
    margin: 0 .1em 0 0;
    font-size: 2.75em !important;
    line-height: .85em !important;
    height: .81em;
    overflow: hidden
}

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

.full-full {
    width: 100% !important;
    height: 100% !important
}

.width-auto {
    width: auto !important
}

.width-full {
    width: 100% !important
}

.width-half {
    width: 50% !important
}

.min-width-0 {
    min-width: 0 !important
}

.max-width-0 {
    max-width: 0 !important
}

.height-auto {
    height: auto !important
}

.height-full {
    height: 100% !important
}

.height-half {
    height: 50% !important
}

.min-height-0 {
    min-height: 0 !important
}

.max-height-0 {
    max-height: 0 !important
}

.left {
    text-align: left
}

.right {
    text-align: right
}

.vertical-center {
    vertical-align: center
}

.no-border {
    border: none !important
}

.no-shadow {
    box-shadow: none !important
}

.no-background {
    background: none !important
}

.relative {
    position: relative !important
}

.absolute {
    position: absolute !important
}

.fixed {
    position: fixed !important
}

.clear {
    clear: both !important
}

.clear-none {
    clear: none !important
}

.block {
    display: block !important
}

.inline {
    display: inline !important
}

.inline-block {
    display: inline-block !important
}

.table {
    display: table !important
}

.table-cell {
    display: table-cell !important
}

.flex {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: justify;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

@media only screen and (max-width: 768px) {
    .flex {
        display: block
    }
}

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0
}

.clearfix {
    display: inline-block
}

html[xmlns] .clearfix {
    display: block
}

* html .clearfix {
    height: 1%
}

.section-gray+.section-gray {
    border-top: 0 !important
}

.padding-all-rem-0 {
    padding: 0 !important
}

.padding-all-rem-05 {
    padding: 8px !important;
    padding: .5rem !important
}

.padding-all-rem-1 {
    padding: 16px !important;
    padding: 1rem !important
}

.padding-all-rem-15 {
    padding: 20px !important;
    padding: 1.25rem !important
}

.padding-all-rem-2 {
    padding: 32px !important;
    padding: 2rem !important
}

.padding-all-rem-25 {
    padding: 40px !important;
    padding: 2.5rem !important
}

.padding-all-rem-3 {
    padding: 48px !important;
    padding: 3rem !important
}

.padding-all-rem-35 {
    padding: 56px !important;
    padding: 3.5rem !important
}

.padding-all-rem-4 {
    padding: 64px !important;
    padding: 4rem !important
}

.padding-all-rem-45 {
    padding: 72px !important;
    padding: 4.5rem !important
}

.padding-all-rem-5 {
    padding: 80px !important;
    padding: 5rem !important
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .padding-all-rem-05 {
        padding: 6px !important;
        padding: .375rem !important
    }
    .padding-all-rem-1 {
        padding: 12px !important;
        padding: .75rem !important
    }
    .padding-all-rem-15 {
        padding: 18px !important;
        padding: 1.125rem !important
    }
    .padding-all-rem-2 {
        padding: 20px !important;
        padding: 1.25rem !important
    }
    .padding-all-rem-25 {
        padding: 30px !important;
        padding: 1.875rem !important
    }
    .padding-all-rem-3 {
        padding: 36px !important;
        padding: 2.25rem !important
    }
    .padding-all-rem-35 {
        padding: 42px !important;
        padding: 2.625rem !important
    }
    .padding-all-rem-4 {
        padding: 48px !important;
        padding: 3rem !important
    }
    .padding-all-rem-45 {
        padding: 48px !important;
        padding: 3rem !important
    }
    .padding-all-rem-5 {
        padding: 48px !important;
        padding: 3rem !important
    }
}

@media only screen and (max-width: 767px) {
    .padding-all-rem-1 {
        padding: 8px !important;
        padding: .5rem !important
    }
    .padding-all-rem-2 {
        padding: 16px !important;
        padding: 1rem !important
    }
    .padding-all-rem-25 {
        padding: 26.66656px !important;
        padding: 1.66666rem !important
    }
    .padding-all-rem-3 {
        padding: 32px !important;
        padding: 2rem !important
    }
    .padding-all-rem-35 {
        padding: 32px !important;
        padding: 2rem !important
    }
    .padding-all-rem-4 {
        padding: 32px !important;
        padding: 2rem !important
    }
    .padding-all-rem-45 {
        padding: 32px !important;
        padding: 2rem !important
    }
    .padding-all-rem-5 {
        padding: 32px !important;
        padding: 2rem !important
    }
}

.padding-all-0 {
    padding: 0 !important
}

.padding-all-1 {
    padding: 1% !important
}

.padding-all-2 {
    padding: 2% !important
}

.padding-all-3 {
    padding: 3% !important
}

.padding-all-4 {
    padding: 4% !important
}

.padding-all-5 {
    padding: 5% !important
}

.padding-all-6 {
    padding: 6% !important
}

.padding-all-7 {
    padding: 7% !important
}

.padding-all-8 {
    padding: 8% !important
}

.padding-all-9 {
    padding: 9% !important
}

.padding-all-10 {
    padding: 10% !important
}

.padding-all-15 {
    padding: 15% !important
}

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

.padding-top-05 {
    padding-top: 8px !important;
    padding-top: .5rem !important
}

.padding-top-1 {
    padding-top: 16px !important;
    padding-top: 1rem !important
}

.padding-top-15 {
    padding-top: 20px !important;
    padding-top: 1.25rem !important
}

.padding-top-2 {
    padding-top: 32px !important;
    padding-top: 2rem !important
}

.padding-top-25 {
    padding-top: 40px !important;
    padding-top: 2.5rem !important
}

.padding-top-3 {
    padding-top: 48px !important;
    padding-top: 3rem !important
}

.padding-top-35 {
    padding-top: 56px !important;
    padding-top: 3.5rem !important
}

.padding-top-4 {
    padding-top: 64px !important;
    padding-top: 4rem !important
}

.padding-top-45 {
    padding-top: 72px !important;
    padding-top: 4.5rem !important
}

.padding-top-5 {
    padding-top: 80px !important;
    padding-top: 5rem !important
}

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

.padding-bottom-05 {
    padding-bottom: 8px !important;
    padding-bottom: .5rem !important
}

.padding-bottom-1 {
    padding-bottom: 16px !important;
    padding-bottom: 1rem !important
}

.padding-bottom-15 {
    padding-bottom: 20px !important;
    padding-bottom: 1.25rem !important
}

.padding-bottom-2 {
    padding-bottom: 32px !important;
    padding-bottom: 2rem !important
}

.padding-bottom-25 {
    padding-bottom: 40px !important;
    padding-bottom: 2.5rem !important
}

.padding-bottom-3 {
    padding-bottom: 48px !important;
    padding-bottom: 3rem !important
}

.padding-bottom-35 {
    padding-bottom: 56px !important;
    padding-bottom: 3.5rem !important
}

.padding-bottom-4 {
    padding-bottom: 64px !important;
    padding-bottom: 4rem !important
}

.padding-bottom-45 {
    padding-bottom: 72px !important;
    padding-bottom: 4.5rem !important
}

.padding-bottom-5 {
    padding-bottom: 80px !important;
    padding-bottom: 5rem !important
}

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

.padding-right-05 {
    padding-right: 8px !important;
    padding-right: .5rem !important
}

.padding-right-1 {
    padding-right: 16px !important;
    padding-right: 1rem !important
}

.padding-right-15 {
    padding-right: 20px !important;
    padding-right: 1.25rem !important
}

.padding-right-2 {
    padding-right: 32px !important;
    padding-right: 2rem !important
}

.padding-right-25 {
    padding-right: 40px !important;
    padding-right: 2.5rem !important
}

.padding-right-3 {
    padding-right: 48px !important;
    padding-right: 3rem !important
}

.padding-right-35 {
    padding-right: 56px !important;
    padding-right: 3.5rem !important
}

.padding-right-4 {
    padding-right: 64px !important;
    padding-right: 4rem !important
}

.padding-right-45 {
    padding-right: 72px !important;
    padding-right: 4.5rem !important
}

.padding-right-5 {
    padding-right: 80px !important;
    padding-right: 5rem !important
}

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

.padding-left-05 {
    padding-left: 8px !important;
    padding-left: .5rem !important
}

.padding-left-1 {
    padding-left: 16px !important;
    padding-left: 1rem !important
}

.padding-left-15 {
    padding-left: 20px !important;
    padding-left: 1.25rem !important
}

.padding-left-2 {
    padding-left: 32px !important;
    padding-left: 2rem !important
}

.padding-left-25 {
    padding-left: 40px !important;
    padding-left: 2.5rem !important
}

.padding-left-3 {
    padding-left: 48px !important;
    padding-left: 3rem !important
}

.padding-left-35 {
    padding-left: 56px !important;
    padding-left: 3.5rem !important
}

.padding-left-4 {
    padding-left: 64px !important;
    padding-left: 4rem !important
}

.padding-left-45 {
    padding-left: 72px !important;
    padding-left: 4.5rem !important
}

.padding-left-5 {
    padding-left: 80px !important;
    padding-left: 5rem !important
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .padding-top-1 {
        padding-top: 12px !important;
        padding-top: .75rem !important
    }
    .padding-top-2 {
        padding-top: 20px !important;
        padding-top: 1.25rem !important
    }
    .padding-top-25 {
        padding-top: 26.4px !important;
        padding-top: 1.65rem !important
    }
    .padding-top-3 {
        padding-top: 32px !important;
        padding-top: 2rem !important
    }
    .padding-top-4 {
        padding-top: 32px !important;
        padding-top: 2rem !important
    }
    .padding-top-5 {
        padding-top: 32px !important;
        padding-top: 2rem !important
    }
    .padding-bottom-1 {
        padding-bottom: 12px !important;
        padding-bottom: .75rem !important
    }
    .padding-bottom-2 {
        padding-bottom: 20px !important;
        padding-bottom: 1.25rem !important
    }
    .padding-bottom-25 {
        padding-bottom: 26.4px !important;
        padding-bottom: 1.65rem !important
    }
    .padding-bottom-3 {
        padding-bottom: 32px !important;
        padding-bottom: 2rem !important
    }
    .padding-bottom-35 {
        padding-bottom: 32px !important;
        padding-bottom: 2rem !important
    }
    .padding-bottom-4 {
        padding-bottom: 32px !important;
        padding-bottom: 2rem !important
    }
    .padding-bottom-5 {
        padding-bottom: 32px !important;
        padding-bottom: 2rem !important
    }
}

@media only screen and (max-width: 767px) {
    .padding-top-1 {
        padding-top: 8px !important;
        padding-top: .5rem !important
    }
    .padding-top-2 {
        padding-top: 16px !important;
        padding-top: 1rem !important
    }
    .padding-top-25 {
        padding-top: 26.66656px !important;
        padding-top: 1.66666rem !important
    }
    .padding-top-3 {
        padding-top: 32px !important;
        padding-top: 2rem !important
    }
    .padding-top-4 {
        padding-top: 32px !important;
        padding-top: 2rem !important
    }
    .padding-top-5 {
        padding-top: 32px !important;
        padding-top: 2rem !important
    }
    .padding-bottom-1 {
        padding-bottom: 8px !important;
        padding-bottom: .5rem !important
    }
    .padding-bottom-2 {
        padding-bottom: 16px !important;
        padding-bottom: 1rem !important
    }
    .padding-bottom-25 {
        padding-bottom: 26.66666px !important;
        padding-bottom: 1.66667rem !important
    }
    .padding-bottom-3 {
        padding-bottom: 32px !important;
        padding-bottom: 2rem !important
    }
    .padding-bottom-35 {
        padding-bottom: 32px !important;
        padding-bottom: 2rem !important
    }
    .padding-bottom-4 {
        padding-bottom: 32px !important;
        padding-bottom: 2rem !important
    }
    .padding-bottom-5 {
        padding-bottom: 32px !important;
        padding-bottom: 2rem !important
    }
}

.margin-all-rem-0 {
    margin: 0 !important
}

.margin-all-rem-05 {
    margin: 8px !important;
    margin: .5rem !important
}

.margin-all-rem-1 {
    margin: 16px !important;
    margin: 1rem !important
}

.margin-all-rem-15 {
    margin: 20px !important;
    margin: 1.25rem !important
}

.margin-all-rem-2 {
    margin: 32px !important;
    margin: 2rem !important
}

.margin-all-rem-25 {
    margin: 40px !important;
    margin: 2.5rem !important
}

.margin-all-rem-3 {
    margin: 48px !important;
    margin: 3rem !important
}

.margin-all-rem-35 {
    margin: 56px !important;
    margin: 3.5rem !important
}

.margin-all-rem-4 {
    margin: 64px !important;
    margin: 4rem !important
}

.margin-all-rem-45 {
    margin: 72px !important;
    margin: 4.5rem !important
}

.margin-all-rem-5 {
    margin: 80px !important;
    margin: 5rem !important
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .margin-all-rem-1 {
        margin: 12px 0px !important;
        margin: .75rem 0rem !important
    }
    .margin-all-rem-2 {
        margin: 20px 0px !important;
        margin: 1.25rem 0rem !important
    }
    .margin-all-rem-25 {
        margin: 39.9936px 0px !important;
        margin: 2.4996rem 0rem !important
    }
    .margin-all-rem-3 {
        margin: 48px 0px !important;
        margin: 3rem 0rem !important
    }
    .margin-all-rem-35 {
        padding: 32px !important;
        padding: 2rem !important
    }
    .margin-all-rem-4 {
        padding: 32px !important;
        padding: 2rem !important
    }
    .margin-all-rem-45 {
        padding: 32px !important;
        padding: 2rem !important
    }
    .margin-all-rem-5 {
        padding: 32px !important;
        padding: 2rem !important
    }
}

@media only screen and (max-width: 767px) {
    .margin-all-rem-1 {
        margin: 8px !important;
        margin: .5rem !important
    }
    .margin-all-rem-2 {
        margin: 16px !important;
        margin: 1rem !important
    }
    .margin-all-rem-25 {
        margin: 26.66656px !important;
        margin: 1.66666rem !important
    }
    .margin-all-rem-3 {
        margin: 32px !important;
        margin: 2rem !important
    }
    .margin-all-rem-35 {
        padding: 32px !important;
        padding: 2rem !important
    }
    .margin-all-rem-4 {
        padding: 32px !important;
        padding: 2rem !important
    }
    .margin-all-rem-45 {
        padding: 32px !important;
        padding: 2rem !important
    }
    .margin-all-rem-5 {
        padding: 32px !important;
        padding: 2rem !important
    }
}

.margin-all-0 {
    margin: 0 !important
}

.margin-all-1 {
    margin: 1% !important
}

.margin-all-2 {
    margin: 2% !important
}

.margin-all-3 {
    margin: 3% !important
}

.margin-all-4 {
    margin: 4% !important
}

.margin-all-5 {
    margin: 5% !important
}

.margin-all-6 {
    margin: 6% !important
}

.margin-all-7 {
    margin: 7% !important
}

.margin-all-8 {
    margin: 8% !important
}

.margin-all-9 {
    margin: 9% !important
}

.margin-all-10 {
    margin: 10% !important
}

.margin-all-15 {
    margin: 15% !important
}

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

.margin-top-05 {
    margin-top: 8px !important;
    margin-top: .5rem !important
}

.margin-top-1 {
    margin-top: 16px !important;
    margin-top: 1rem !important
}

.margin-top-15 {
    margin-top: 20px !important;
    margin-top: 1.25rem !important
}

.margin-top-2 {
    margin-top: 32px !important;
    margin-top: 2rem !important
}

.margin-top-25 {
    margin-top: 40px !important;
    margin-top: 2.5rem !important
}

.margin-top-3 {
    margin-top: 48px !important;
    margin-top: 3rem !important
}

.margin-top-35 {
    margin-top: 56px !important;
    margin-top: 3.5rem !important
}

.margin-top-4 {
    margin-top: 64px !important;
    margin-top: 4rem !important
}

.margin-top-45 {
    margin-top: 72px !important;
    margin-top: 4.5rem !important
}

.margin-top-5 {
    margin-top: 80px !important;
    margin-top: 5rem !important
}

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

.margin-bottom-05 {
    margin-bottom: 8px !important;
    margin-bottom: .5rem !important
}

.margin-bottom-1 {
    margin-bottom: 16px !important;
    margin-bottom: 1rem !important
}

.margin-bottom-15 {
    margin-bottom: 20px !important;
    margin-bottom: 1.25rem !important
}

.margin-bottom-2 {
    margin-bottom: 32px !important;
    margin-bottom: 2rem !important
}

.margin-bottom-25 {
    margin-bottom: 40px !important;
    margin-bottom: 2.5rem !important
}

.margin-bottom-3 {
    margin-bottom: 48px !important;
    margin-bottom: 3rem !important
}

.margin-bottom-35 {
    margin-bottom: 56px !important;
    margin-bottom: 3.5rem !important
}

.margin-bottom-4 {
    margin-bottom: 64px !important;
    margin-bottom: 4rem !important
}

.margin-bottom-45 {
    margin-bottom: 72px !important;
    margin-bottom: 4.5rem !important
}

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

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

.margin-right-05 {
    margin-right: 8px !important;
    margin-right: .5rem !important
}

.margin-right-1 {
    margin-right: 16px !important;
    margin-right: 1rem !important
}

.margin-right-15 {
    margin-right: 20px !important;
    margin-right: 1.25rem !important
}

.margin-right-2 {
    margin-right: 32px !important;
    margin-right: 2rem !important
}

.margin-right-25 {
    margin-right: 40px !important;
    margin-right: 2.5rem !important
}

.margin-right-3 {
    margin-right: 48px !important;
    margin-right: 3rem !important
}

.margin-right-35 {
    margin-right: 56px !important;
    margin-right: 3.5rem !important
}

.margin-right-4 {
    margin-right: 64px !important;
    margin-right: 4rem !important
}

.margin-right-45 {
    margin-right: 72px !important;
    margin-right: 4.5rem !important
}

.margin-right-5 {
    margin-right: 80px !important;
    margin-right: 5rem !important
}

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

.margin-left-05 {
    margin-left: 8px !important;
    margin-left: .5rem !important
}

.margin-left-1 {
    margin-left: 16px !important;
    margin-left: 1rem !important
}

.margin-left-15 {
    margin-left: 20px !important;
    margin-left: 1.25rem !important
}

.margin-left-2 {
    margin-left: 32px !important;
    margin-left: 2rem !important
}

.margin-left-25 {
    margin-left: 40px !important;
    margin-left: 2.5rem !important
}

.margin-left-3 {
    margin-left: 48px !important;
    margin-left: 3rem !important
}

.margin-left-35 {
    margin-left: 56px !important;
    margin-left: 3.5rem !important
}

.margin-left-4 {
    margin-left: 64px !important;
    margin-left: 4rem !important
}

.margin-left-45 {
    margin-left: 72px !important;
    margin-left: 4.5rem !important
}

.margin-left-5 {
    margin-left: 80px !important;
    margin-left: 5rem !important
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .margin-top-1 {
        margin-top: 12px !important;
        margin-top: .75rem !important
    }
    .margin-top-15 {
        margin-top: 10px !important;
        margin-top: .625rem !important
    }
    .margin-top-2 {
        margin-top: 20px !important;
        margin-top: 1.25rem !important
    }
    .margin-top-25 {
        margin-top: 39.9936px !important;
        margin-top: 2.4996rem !important
    }
    .margin-top-3 {
        margin-top: 48px !important;
        margin-top: 3rem !important
    }
    .margin-bottom-1 {
        margin-bottom: 12px !important;
        margin-bottom: .75rem !important
    }
    .margin-bottom-15 {
        margin-top: 10px !important;
        margin-top: .625rem !important
    }
    .margin-bottom-2 {
        margin-bottom: 20px !important;
        margin-bottom: 1.25rem !important
    }
    .margin-bottom-25 {
        margin-bottom: 39.9936px !important;
        margin-bottom: 2.4996rem !important
    }
    .margin-bottom-3 {
        margin-bottom: 48px !important;
        margin-bottom: 3rem !important
    }
}

@media only screen and (max-width: 767px) {
    .margin-top-1 {
        margin-top: 8px !important;
        margin-top: .5rem !important
    }
    .margin-top-15 {
        margin-top: 10px !important;
        margin-top: .625rem !important
    }
    .margin-top-2 {
        margin-top: 16px !important;
        margin-top: 1rem !important
    }
    .margin-top-25 {
        margin-top: 26.66656px !important;
        margin-top: 1.66666rem !important
    }
    .margin-top-3 {
        margin-top: 32px !important;
        margin-top: 2rem !important
    }
    .margin-bottom-1 {
        margin-bottom: 8px !important;
        margin-bottom: .5rem !important
    }
    .margin-bottom-15 {
        margin-top: 10px !important;
        margin-top: .625rem !important
    }
    .margin-bottom-2 {
        margin-bottom: 16px !important;
        margin-bottom: 1rem !important
    }
    .margin-bottom-25 {
        margin-bottom: 26.66666px !important;
        margin-bottom: 1.66667rem !important
    }
    .margin-bottom-3 {
        margin-bottom: 32px !important;
        margin-bottom: 2rem !important
    }
}

.margin-0-auto {
    margin: 0 auto !important
}

html {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

*,
*:before,
*:after {
    box-sizing: inherit
}

.row {
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
    width: 100%
}

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

.row.collapse>.columns {
    padding-left: 0;
    padding-right: 0
}

.row .row {
    width: auto;
    margin-left: -10px;
    margin-right: -10px
}

.columns {
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
    float: left
}

.columns:last-child:not(:first-child) {
    float: right
}

.columns:last-child:not(:first-child).end {
    float: left
}

@media only screen {
    .small-1 {
        width: 8.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-2 {
        width: 16.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-3 {
        width: 25%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-4 {
        width: 33.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-5 {
        width: 41.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-6 {
        width: 50%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-7 {
        width: 58.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-8 {
        width: 66.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-9 {
        width: 75%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-10 {
        width: 83.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-11 {
        width: 91.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-12 {
        width: 100%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .small-offset-1 {
        margin-left: 8.33333%
    }
    .small-offset-2 {
        margin-left: 16.66667%
    }
    .small-offset-3 {
        margin-left: 25%
    }
    .small-offset-4 {
        margin-left: 33.33333%
    }
    .small-offset-5 {
        margin-left: 41.66667%
    }
    .small-offset-6 {
        margin-left: 50%
    }
    .small-offset-7 {
        margin-left: 58.33333%
    }
    .small-offset-8 {
        margin-left: 66.66667%
    }
    .small-offset-9 {
        margin-left: 75%
    }
    .small-offset-10 {
        margin-left: 83.33333%
    }
    .small-offset-11 {
        margin-left: 91.66667%
    }
    .small-push-1 {
        margin-left: 8.33333%
    }
    .small-pull-1 {
        margin-left: -8.33333%
    }
    .small-push-2 {
        margin-left: 16.66667%
    }
    .small-pull-2 {
        margin-left: -16.66667%
    }
    .small-push-3 {
        margin-left: 25%
    }
    .small-pull-3 {
        margin-left: -25%
    }
    .small-push-4 {
        margin-left: 33.33333%
    }
    .small-pull-4 {
        margin-left: -33.33333%
    }
    .small-push-5 {
        margin-left: 41.66667%
    }
    .small-pull-5 {
        margin-left: -41.66667%
    }
    .small-push-6 {
        margin-left: 50%
    }
    .small-pull-6 {
        margin-left: -50%
    }
    .small-push-7 {
        margin-left: 58.33333%
    }
    .small-pull-7 {
        margin-left: -58.33333%
    }
    .small-push-8 {
        margin-left: 66.66667%
    }
    .small-pull-8 {
        margin-left: -66.66667%
    }
    .small-push-9 {
        margin-left: 75%
    }
    .small-pull-9 {
        margin-left: -75%
    }
    .small-push-10 {
        margin-left: 83.33333%
    }
    .small-pull-10 {
        margin-left: -83.33333%
    }
    .small-push-11 {
        margin-left: 91.66667%
    }
    .small-pull-11 {
        margin-left: -91.66667%
    }
    .small-push-0 {
        margin-left: 0
    }
    .small-pull-0 {
        margin-right: 0
    }
    .small-centered {
        margin-left: auto;
        margin-right: auto;
        float: none
    }
    .column.small-uncentered,
    .columns.small-uncentered {
        float: left;
        margin-left: 0
    }
    .column.small-centered:last-child,
    .columns.small-centered:last-child {
        float: none
    }
    .column.small-uncentered:last-child,
    .columns.small-uncentered:last-child {
        float: left
    }
}

@media only screen and (min-width: 40.063rem) {
    .medium-1 {
        width: 8.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-2 {
        width: 16.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-3 {
        width: 25%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-4 {
        width: 33.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-5 {
        width: 41.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-6 {
        width: 50%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-7 {
        width: 58.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-8 {
        width: 66.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-9 {
        width: 75%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-10 {
        width: 83.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-11 {
        width: 91.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-12 {
        width: 100%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .medium-offset-1 {
        margin-left: 8.33333%
    }
    .medium-offset-2 {
        margin-left: 16.66667%
    }
    .medium-offset-3 {
        margin-left: 25%
    }
    .medium-offset-4 {
        margin-left: 33.33333%
    }
    .medium-offset-5 {
        margin-left: 41.66667%
    }
    .medium-offset-6 {
        margin-left: 50%
    }
    .medium-offset-7 {
        margin-left: 58.33333%
    }
    .medium-offset-8 {
        margin-left: 66.66667%
    }
    .medium-offset-9 {
        margin-left: 75%
    }
    .medium-offset-10 {
        margin-left: 83.33333%
    }
    .medium-offset-11 {
        margin-left: 91.66667%
    }
    .medium-push-1 {
        margin-left: 8.33333%
    }
    .medium-pull-1 {
        margin-left: -8.33333%
    }
    .medium-push-2 {
        margin-left: 16.66667%
    }
    .medium-pull-2 {
        margin-left: -16.66667%
    }
    .medium-push-3 {
        margin-left: 25%
    }
    .medium-pull-3 {
        margin-left: -25%
    }
    .medium-push-4 {
        margin-left: 33.33333%
    }
    .medium-pull-4 {
        margin-left: -33.33333%
    }
    .medium-push-5 {
        margin-left: 41.66667%
    }
    .medium-pull-5 {
        margin-left: -41.66667%
    }
    .medium-push-6 {
        margin-left: 50%
    }
    .medium-pull-6 {
        margin-left: -50%
    }
    .medium-push-7 {
        margin-left: 58.33333%
    }
    .medium-pull-7 {
        margin-left: -58.33333%
    }
    .medium-push-8 {
        margin-left: 66.66667%
    }
    .medium-pull-8 {
        margin-left: -66.66667%
    }
    .medium-push-9 {
        margin-left: 75%
    }
    .medium-pull-9 {
        margin-left: -75%
    }
    .medium-push-10 {
        margin-left: 83.33333%
    }
    .medium-pull-10 {
        margin-left: -83.33333%
    }
    .medium-push-11 {
        margin-left: 91.66667%
    }
    .medium-pull-11 {
        margin-left: -91.66667%
    }
    .medium-push-0 {
        margin-left: 0
    }
    .medium-pull-0 {
        margin-right: 0
    }
    .medium-centered {
        margin-left: auto;
        margin-right: auto;
        float: none
    }
    .column.medium-uncentered,
    .columns.medium-uncentered {
        float: left;
        margin-left: 0
    }
    .column.medium-centered:last-child,
    .columns.medium-centered:last-child {
        float: none
    }
    .column.medium-uncentered:last-child,
    .columns.medium-uncentered:last-child {
        float: left
    }
}

@media only screen and (min-width: 64.063rem) {
    .large-1 {
        width: 8.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-2 {
        width: 16.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-3 {
        width: 25%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-4 {
        width: 33.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-5 {
        width: 41.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-6 {
        width: 50%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-7 {
        width: 58.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-8 {
        width: 66.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-9 {
        width: 75%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-10 {
        width: 83.33333%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-11 {
        width: 91.66667%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-12 {
        width: 100%;
        float: left;
        padding-left: 10px;
        padding-right: 10px
    }
    .large-offset-1 {
        margin-left: 8.33333%
    }
    .large-offset-2 {
        margin-left: 16.66667%
    }
    .large-offset-3 {
        margin-left: 25%
    }
    .large-offset-4 {
        margin-left: 33.33333%
    }
    .large-offset-5 {
        margin-left: 41.66667%
    }
    .large-offset-6 {
        margin-left: 50%
    }
    .large-offset-7 {
        margin-left: 58.33333%
    }
    .large-offset-8 {
        margin-left: 66.66667%
    }
    .large-offset-9 {
        margin-left: 75%
    }
    .large-offset-10 {
        margin-left: 83.33333%
    }
    .large-offset-11 {
        margin-left: 91.66667%
    }
    .large-push-1 {
        margin-left: 8.33333%
    }
    .large-pull-1 {
        margin-left: -8.33333%
    }
    .large-push-2 {
        margin-left: 16.66667%
    }
    .large-pull-2 {
        margin-left: -16.66667%
    }
    .large-push-3 {
        margin-left: 25%
    }
    .large-pull-3 {
        margin-left: -25%
    }
    .large-push-4 {
        margin-left: 33.33333%
    }
    .large-pull-4 {
        margin-left: -33.33333%
    }
    .large-push-5 {
        margin-left: 41.66667%
    }
    .large-pull-5 {
        margin-left: -41.66667%
    }
    .large-push-6 {
        margin-left: 50%
    }
    .large-pull-6 {
        margin-left: -50%
    }
    .large-push-7 {
        margin-left: 58.33333%
    }
    .large-pull-7 {
        margin-left: -58.33333%
    }
    .large-push-8 {
        margin-left: 66.66667%
    }
    .large-pull-8 {
        margin-left: -66.66667%
    }
    .large-push-9 {
        margin-left: 75%
    }
    .large-pull-9 {
        margin-left: -75%
    }
    .large-push-10 {
        margin-left: 83.33333%
    }
    .large-pull-10 {
        margin-left: -83.33333%
    }
    .large-push-11 {
        margin-left: 91.66667%
    }
    .large-pull-11 {
        margin-left: -91.66667%
    }
    .large-push-0 {
        margin-left: 0
    }
    .large-pull-0 {
        margin-right: 0
    }
    .large-centered {
        margin-left: auto;
        margin-right: auto;
        float: none
    }
    .column.large-uncentered,
    .columns.large-uncentered {
        float: left;
        margin-left: 0
    }
    .column.large-centered:last-child,
    .columns.large-centered:last-child {
        float: none
    }
    .column.large-uncentered:last-child,
    .columns.large-uncentered:last-child {
        float: left
    }
}

.vod-collage ul:after,
.list-featured-channels ul:after,
.list-channels ul:after,
.list-faq-shortcuts ul:after,
.fields-pair:after,
.field-inline-validation:after,
.pseudo-form .buttons:after,
.form-inline fieldset:after,
.box-group:after,
.box-group-banners:after,
.layout:after,
.onepager-nav ul:after,
.box-trust-comforting-tiny ul:after,
.header-over-divider:after,
.product-horizontal:after,
.tabs ul:after,
.grid:after,
.prev-next-nav:after,
.content-2014:after,
.key-information:after,
.key-information ul:after,
.section:after,
.section-header:after,
.group-check:after,
.group-radio:after,
.list-activation-steps ol:after {
    content: '';
    display: table;
    clear: both
}

* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box
}

html {
    font: 100%/20px 'Open Sans', Arial, sans-serif;
    color: #333
}

.link-top {
    color: #e20074;
    font-size: .875rem;
    font-size: 14px;
    line-height: 20px;
    text-transform: uppercase;
    letter-spacing: .05em
}

.link-top:hover {
    color: inherit
}

.link-box {
    color: #000
}

.link-box h2,
.link-box h3,
.link-box h4 {
    color: #e20074
}

.section.section-gridless,
.section-gridless {
    padding: 40px 0px;
    padding: 2.5rem 0rem
}

.section-gridless .section-header {
    padding-left: 1em;
    padding-right: 1em
}

.grid {
    width: 100%;
    max-width: 960px;
    margin: 0 auto 0 auto
}

.pipe {
    padding: .5em;
    opacity: 0.5;
    -moz-opacity: 0.5;
    filter: alpha(opacity=50)
}

.right-arrow-html {
    display: inline-block;
    font-size: .5em;
    vertical-align: middle;
    padding: 0 1.25em
}

.text-left {
    text-align: left !important
}

.text-right {
    text-align: right !important
}

.box-item-icon.text-right {
    background-position: 100% 0
}

.or {
    border-top: 1px solid #e5e5e5;
    clear: both;
    margin: 50px 0 10px;
    text-align: center
}

.or span,
.or strong {
    display: block;
    position: relative;
    top: -20px;
    width: 40px;
    height: 40px;
    margin: 0 auto;
    padding: 10px;
    background: #e5e5e5;
    text-transform: lowercase;
    font-weight: bold;
    border: 1px solid #e5e5e5;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    -ms-border-radius: 100px;
    -o-border-radius: 100px;
    border-radius: 100px
}

.section-gray-dark .or {
    border-top: 1px solid #fff
}

.section-gray-dark .or span,
.section-gray-dark .or strong {
    background: #fff
}

.section-magenta .or {
    border-top: 1px solid #fff;
    border-top-color: rgba(255, 255, 255, 0.5)
}

.section-magenta .or span,
.section-magenta .or strong {
    color: #000;
    background: #fff;
    border: 1px solid #fff
}

.price {
    margin-bottom: 1.5em
}

.price h3 {
    line-height: 36px;
    line-height: 2.25rem
}

.price>strong {
    float: left;
    margin-right: .25em;
    color: #e20074
}

.price .price-unit {
    display: block;
    font-size: 1em;
    line-height: 1.5em;
    position: relative;
    top: 3px;
    top: .1875rem;
    color: #e20074
}

.price .price-term {
    display: block;
    color: #333
}

.price .price-term a {
    color: #333;
    border-bottom: 1px solid #a4a4a4
}

.price .price-term a:hover {
    color: #e20074;
    border-bottom-color: rgba(226, 0, 116, 0.25)
}

.box-group-20 .price,
.box-group-25 .price,
.box-group-33 .price,
td .price {
    text-align: center
}

.box-group-20 .price strong,
.box-group-25 .price strong,
.box-group-33 .price strong,
td .price strong {
    display: block;
    float: none;
    margin: 0
}

.circle {
    display: inline-block;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%
}

a.link-tile {
    display: block;
    color: inherit
}

a.link-tile h1 {
    margin: 0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

a.link-tile:hover h1 {
    color: #e20074;
    text-decoration: none
}

a.link-tile:hover p {
    text-decoration: none
}

a.link-tile .device-image {
    padding-bottom: 20px
}

a.link-tile .more-link {
     clear: both;
    margin-top: .75em
}

.hidden {
    display: none
}

.center {
    text-align: center !important
}

.margin-auto {
    margin: auto !important
}

.vtop {
    vertical-align: top
}

.pink {
    color: #ff7fc1 !important;
    font-family: inherit
}

.magenta {
    color: #ff7fc1 !important;
    font-family: inherit
}

.orange {
    color: #ed7004 !important;
    font-family: inherit
}

.white {
    color: #fff !important
}

.black {
    color: #000 !important
}

.blue {
    color: #53baf2 !important
}

.text {
    color: #333 !important
}

.float-left {
    float: left !important
}

.float-right {
    float: right !important
}

.no-float {
    float: none !important
}

.close-button {
    text-align: right
}

.nav li {
    list-style: none
}

.pseudo-sup {
    font-size: .5em;
    line-height: 1.5em;
    margin-left: -.25em;
    text-transform: none;
    vertical-align: top
}

table th {
    text-align: left
}

table th.center {
    text-align: center
}

ul.bullets {
    list-style: disc inside none;
    padding: 0 0 0 1em
}

ul.bullets ul.bullets {
    list-style: circle inside none
}

.prev-next-nav .prev {
    float: left
}

.prev-next-nav .next {
    float: right
}

.prev-next-nav a {
    display: block;
    text-indent: -9999px;
    overflow: hidden;
    background: url(i/icons/arrows-large.png) no-repeat 0 0;
    background-size: 111px 221px
}

.prev a {
    background-position: 10px -75px
}

.next a {
    background-position: right 10px top -75px
}

.prev a:hover {
    background-position: 10px 25px
}

.next a:hover {
    background-position: right 10px top 25px
}

.prev a:active {
    background-position: 10px -175px
}

.next a:active {
    background-position: right 10px top -175px
}

.section p a {
    text-decoration: underline
}

.section p a:hover {
    text-decoration: none
}

.page-header {
    text-align: center
}

.page-header .grid {
    padding: 10px 0 30px;
    padding: 10px 0px 30px;
    padding: .625rem 0rem 1.875rem
}

#modal-content .page-header .grid {
     padding-top: 50px;
    padding-top: 3.124rem
}

.page-header h1 {
    margin: 0
}

.page-header h1+p {
    margin-top: 10px;
    margin-top: .625rem
}

.page-header a:hover,
.page-header a:focus {
    text-decoration: underline
}

.html-modal-programski-paket-sportski .page-header {
    background: url(i/patterns/grass.jpg);
    background: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.1)), url(i/patterns/grass.jpg)
}

.html-modal-programski-paket-sportski .page-header h1,
.html-modal-programski-paket-sportski .page-header .magenta,
.html-modal-programski-paket-sportski .page-header p {
    color: #fff !important
}

.html-modal-programski-paket-sportski .page-header h1 {
    background: -webkit-linear-gradient(#fff, #a4a4a4);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.html-modal-programski-paket-sportski-plus .page-header {
    background: url(i/patterns/grass.jpg);
    background: linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.1)), url(i/patterns/grass.jpg)
}

.html-modal-programski-paket-sportski-plus .page-header h1,
.html-modal-programski-paket-sportski-plus .page-header .magenta,
.html-modal-programski-paket-sportski-plus .page-header p {
    color: #fff !important
}

.html-modal-programski-paket-sportski-plus .page-header h1 {
    background: -webkit-linear-gradient(#fff, #a4a4a4);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.html-modal-programski-paket-max-auto-moto .page-header {
    background: #dd2800;
    background: linear-gradient(#150600, #ff2800)
}

.html-modal-programski-paket-max-auto-moto .page-header h1,
.html-modal-programski-paket-max-auto-moto .page-header .magenta,
.html-modal-programski-paket-max-auto-moto .page-header p {
    color: #fff !important
}

.html-modal-programski-paket-max-auto-moto .page-header h1 {
    background: -webkit-linear-gradient(#fff, #a4a4a4);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #fff;
    position: relative
}

.html-modal-programski-paket-max-auto-moto .page-header h1:after {
    font-weight: bold;
    position: absolute;
    top: 0;
    left: 0;
    background: none;
    z-index: -1;
    content: attr(data-text);
    text-shadow: 6px 6px 9px #000
}

.html-modal-programski-paket-extra .page-header {
    background: url(i/patterns/extra-star.png) repeat-x 50% 50%
}

.html-modal-programski-paket-djecji .page-header {
    background: url(i/patterns/kids.jpg) repeat-x 50% 0
}

.html-modal-programski-paket-djecji .page-header h1 {
    color: #fff
}

.html-modal-programski-paket-hbo .page-header {
    background: #000
}

.html-modal-programski-paket-hbo .page-header h1,
.html-modal-programski-paket-hbo .page-header p {
    color: #fff
}

.html-modal-programski-paket-sportski .close-link,
.html-modal-programski-paket-extra .close-link {
    background-image: url(i/icons/close-fff.png) !important
}

@media (min--moz-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6 / 2),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
    .html-modal-programski-paket-sportski .close-link,
    .html-modal-programski-paket-extra .close-link {
        background-image: url("i/icons/close-fff-@2x.png");
        background-size: 25px 25px
    }
}

.page-header-desc {
    text-align: left
}

.page-header-desc p {
    font-size: 18px;
    font-size: 1.125rem;
    color: #6c6c6c;
    margin: 0
}

.page-header-center {
    text-align: center
}

.page-header-left {
    text-align: left
}

.cta-service-upgrade {
    clear: both;
    padding-top: 20px;
    border-top: 1px solid #e5e5e5
}

.content-2014 {
    overflow: hidden;
    width: 100%
}

.graph {
    width: 100%;
    margin-bottom: 20px
}

.graph-mini {
    width: 30%
}

.graph li {
    list-style: none;
    margin-bottom: 10px
}

.graph .bar {
    height: 30px;
    line-height: 30px;
    width: 100%;
    text-align: right;
    color: #fff;
    background: #e20074
}

.graph .value {
    padding: 0 10px;
    font-weight: bold
}

.graph .unit {
    font-size: 12px;
    font-weight: bold
}

.graph .caption {
    margin: 0
}

.graph .bar-standard {
    background: #d0d0d0
}

.graph .bar-unlimited {
    width: 1000%
}

.graph .bar-tiny {
    position: relative;
    padding: 0;
    color: #e20074
}

.graph .bar-tiny .value {
    position: absolute;
    width: 60px;
    left: 0;
    text-align: right
}

.key-information li {
    list-style: none;
    float: left;
    width: 50%;
    padding: 10px;
    color: #e20074;
    background: #fff;
    border: 1px solid #e20074;
    border-width: 1px 1px 1px 0;
    text-align: center
}

.key-information li:first-child {
    border-left-width: 1px
}


.box-item .key-information ul,
table .key-information ul {
    margin: 0
}

.box-item .key-information li,
table .key-information li {
    width: 100%;
    min-height: 82px;
    border-width: 0 0 1px
}

.box-item .key-information li:first-child,
table .key-information li:first-child {
    border-width: 1px 0
}

.box-item .key-information li:last-child,
table .key-information li:last-child {
    border-width: 0
}

.section-service {
    border-top: 0 !important
}

.section-service .grid {
    border-top: 1px solid #d0d0d0 !important
}

.option-price-activation {
    display: none
}

.section {
    clear: both
}

.section-white+.section-white .grid,
.page-header+.section-white .grid,
.section-gray+.section-gray {
    border-top: 1px solid #d0d0d0
}

.section-service .grid,
.page-header+.section-white .grid {
    position: relative
}

.section:first-child .grid {
    padding-top: 20px
}

.section .grid,
.page-header+.section .grid {
    padding: 40px 0;
    padding: 2.5rem 0
}

.page-header+.section-complex-table .grid:before {
    content: none
}

.page-header+.section-complex-table .grid {
    border: 0;
    padding-top: 0
}

.section-header {
    margin-bottom: 40px;
    margin-bottom: 2.5rem
}

.section-header h1,
.section-header h2,
.section-header h3,
.section-header h4 {
    margin-bottom: 0
}

.section-header p {
    margin-left: auto;
    margin-right: auto
}

.section-header h1+p,
.section-header h2+p,
.section-header h3+p,
.section-header h4+p {
    margin-top: .625rem
}

.section-header .all-link a {
    text-decoration: none;
    text-transform: uppercase
}

.section-header-focus {
    max-width: 37.5em;
    margin-left: auto;
    margin-right: auto;
    text-align: center
}

#quick-actions-existing-customers .section-header {
    border-bottom: 5px solid #fff;
    padding-bottom: 20px
}

#quick-actions-existing-customers .grid {
    padding: 60px 0;
    padding: 3.75rem 0
}

#quick-actions-existing-customers .box-item .actions {
    margin-top: 30px;
    margin-top: 1.875rem
}

.section-pattern-01 {
    background: url(i/patterns/01.png) !important
}

.section-pattern-02 {
    background: url(i/patterns/02.png) !important
}

.section-pattern-03 {
    background: url(i/patterns/03.png) !important
}

.section-pattern-04 {
    background: url(i/patterns/04.png) !important
}

.section-pattern-05 {
    background: url(i/patterns/05.png) !important
}

.section-pattern-06 {
    background: url(i/patterns/06.png) !important
}

.section-pattern-07 {
    background: url(i/patterns/wood.png) !important
}

.section-black h2,
.section-black h2 a {
    color: #ff7fc1
}

.section-no-padding .grid {
    padding: 0
}

.section-cover-image {
    position: relative
}

.section-cover-image+.section-gray,
.section-cover-image+.section-gray-dark,
.section-cover-image+.section-gray-verydark {
    border-top: 1px solid #fff
}

.section-cover-image+.section-magenta,
.section-cover-image+.section-magenta-gradient {
    border-top: 1px solid #b5015c
}

.section-cover-image {
    background-position: 50% 0 !important;
    background-size: cover !important
}

.section-cover-image .grid {
    padding: 0 !important
}

.subsection {
    clear: both;
    margin: 48px 0px 48px;
    margin: 3rem 0rem 3rem;
    padding: 48px 0px 0px;
    padding: 3rem 0rem 0rem
}

.section-header .subsection {
    margin-top: 0
}

.subsection+.subsection {
    margin-top: 48px;
    margin-top: 3rem
}

.subsection .subsection-header {
    text-align: center;
    border-top: 1px solid #d0d0d0
}

.subsection .subsection-header h1,
.subsection .subsection-header h2,
.subsection .subsection-header h3,
.subsection .subsection-header h4 {
    position: relative;
    display: inline-block;
    background: #fff;
    padding: 0 .5em
}

.section-gray .subsection .subsection-header h1,
.section-gray .subsection .subsection-header h2,
.section-gray .subsection .subsection-header h3,
.section-gray .subsection .subsection-header h4 {
    background: #e6e6e6
}

.subsection .subsection-header h1,
.subsection .subsection-header .xl {
    top: -21.28px;
    top: -1.33rem
}

.subsection .subsection-header h2 {
    top: -16px;
    top: -1rem
}

.subsection .subsection-header h3 {
    top: -10.56px;
    top: -.66rem
}

.subsection .subsection-header h4 {
    top: -10.56px;
    top: -.66rem
}

.channels-accordion {
    margin-bottom: 40px;
    background: #fff;
    border: 1px solid #d0d0d0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 0 4px #e6e6e6;
    -moz-box-shadow: 0 0 0 4px #e6e6e6;
    -ms-box-shadow: 0 0 0 4px #e6e6e6;
    -o-box-shadow: 0 0 0 4px #e6e6e6;
    box-shadow: 0 0 0 4px #e6e6e6
}

.channels-accordion+.section-header {
    margin-top: 60px !important
}

.channels-accordion .channels-accordion-inner {
    padding: 20px
}

.section-gray .channels-accordion {
    -webkit-box-shadow: 0 0 0 4px #e5e5e5;
    -moz-box-shadow: 0 0 0 4px #e5e5e5;
    -ms-box-shadow: 0 0 0 4px #e5e5e5;
    -o-box-shadow: 0 0 0 4px #e5e5e5;
    box-shadow: 0 0 0 4px #e5e5e5
}

.channels-accordion .subsection-accordion-single .subsection-header {
    border-bottom: 0;
    padding: 1.5em 20px 0.75em
}

.channels-accordion .subsection-accordion-single .subsection-header h1,
.channels-accordion .subsection-accordion-single .subsection-header h2,
.channels-accordion .subsection-accordion-single .subsection-header h3,
.channels-accordion .subsection-accordion-single .subsection-header h4 {
    font-weight: bold
}

.channels-accordion .subsection-accordion.dimmed {
    background: #e6e6e6
}

.channels-accordion .subsection-accordion .subsection-header {
    text-align: left;
    border-top: 1px solid #d0d0d0
}

.channels-accordion .subsection-accordion .subsection-header h1,
.channels-accordion .subsection-accordion .subsection-header h2,
.channels-accordion .subsection-accordion .subsection-header h3,
.channels-accordion .subsection-accordion .subsection-header h4 {
    margin: 0;
    cursor: pointer
}

.channels-accordion .subsection-accordion .subsection-header h1 a,
.channels-accordion .subsection-accordion .subsection-header h2 a,
.channels-accordion .subsection-accordion .subsection-header h3 a,
.channels-accordion .subsection-accordion .subsection-header h4 a {
    -webkit-transition: color 0.3s ease;
    -moz-transition: color 0.3s ease;
    -ms-transition: color 0.3s ease;
    -o-transition: color 0.3s ease;
    transition: color 0.3s ease
}

.channels-accordion .subsection-accordion .subsection-header h1 .accordion-toggler,
.channels-accordion .subsection-accordion .subsection-header h2 .accordion-toggler,
.channels-accordion .subsection-accordion .subsection-header h3 .accordion-toggler,
.channels-accordion .subsection-accordion .subsection-header h4 .accordion-toggler {
    display: block;
    padding: .75em 40px
}

@media only screen and (max-width: 600px) {
    .channels-accordion .subsection-accordion .subsection-header h1 .accordion-toggler,
    .channels-accordion .subsection-accordion .subsection-header h2 .accordion-toggler,
    .channels-accordion .subsection-accordion .subsection-header h3 .accordion-toggler,
    .channels-accordion .subsection-accordion .subsection-header h4 .accordion-toggler {
        padding: .75em 20px
    }
}

.channels-accordion .subsection-accordion .subsection-header h1 a.accordion-toggler:after,
.channels-accordion .subsection-accordion .subsection-header h2 a.accordion-toggler:after,
.channels-accordion .subsection-accordion .subsection-header h3 a.accordion-toggler:after,
.channels-accordion .subsection-accordion .subsection-header h4 a.accordion-toggler:after {
    float: right;
    content: "+"
}

.channels-accordion .subsection-accordion.open .subsection-header {
    border-bottom: 1px solid #e5e5e5
}

.channels-accordion .subsection-accordion.open .subsection-header h1,
.channels-accordion .subsection-accordion.open .subsection-header h2,
.channels-accordion .subsection-accordion.open .subsection-header h3,
.channels-accordion .subsection-accordion.open .subsection-header h4 {
    font-weight: bold
}

.channels-accordion .subsection-accordion.open .subsection-header h1 a.accordion-toggler:after,
.channels-accordion .subsection-accordion.open .subsection-header h2 a.accordion-toggler:after,
.channels-accordion .subsection-accordion.open .subsection-header h3 a.accordion-toggler:after,
.channels-accordion .subsection-accordion.open .subsection-header h4 a.accordion-toggler:after {
    content: "-"
}

.channels-accordion .subsection-accordion .subsection-header-rich {
    padding: 1.5em
}

.channels-accordion .subsection-accordion .subsection-header-rich:after {
    content: '';
    display: table;
    clear: both
}

.channels-accordion .subsection-accordion .subsection-header-rich h1,
.channels-accordion .subsection-accordion .subsection-header-rich h2,
.channels-accordion .subsection-accordion .subsection-header-rich h3,
.channels-accordion .subsection-accordion .subsection-header-rich h4 {
    float: left;
    width: 33.33333333%;
    line-height: 48px
}

.channels-accordion .subsection-accordion .subsection-header-rich .subsection-header-price {
    float: left;
    width: 33.33333333%
}

.channels-accordion .subsection-accordion .subsection-header-rich .subsection-header-price .price {
    margin: 0
}

.channels-accordion .subsection-accordion .subsection-header-rich .subsection-header-actions {
    float: right;
    padding: .375em 0
}

.channels-accordion .subsection-accordion .subsection-header-rich .subsection-header-actions li {
    list-style: none;
    float: left;
    padding-left: .5em
}

.channels-accordion .subsection-accordion:first-child .subsection-header {
    border-top: 0
}

.channels-accordion .subsection-accordion .subsection-content {
    display: none;
    width: 100%;
    background: #fcfcfc;
    padding: 40px 20px 20px;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    -ms-border-radius: 0 0 4px 4px;
    -o-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    -webkit-box-shadow: inset 0 0 0 1px #fff;
    -moz-box-shadow: inset 0 0 0 1px #fff;
    -ms-box-shadow: inset 0 0 0 1px #fff;
    -o-box-shadow: inset 0 0 0 1px #fff;
    box-shadow: inset 0 0 0 1px #fff
}

.channels-accordion .subsection-accordion .subsection-content .subsection-content-cta-bar {
    margin: 10px 20px 0;
    padding: 20px 0;
    border-top: 1px solid #d0d0d0;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    -ms-border-radius: 0 0 4px 4px;
    -o-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px
}

.channels-accordion .subsection-accordion .subsection-content .subsection-content-cta-bar:after {
    content: '';
    display: table;
    clear: both
}

.channels-accordion .subsection-accordion .subsection-content .subsection-content-cta-bar .price-regular {
    display: block;
    clear: both;
    padding-top: .75em
}

.channels-accordion .subsection-accordion .subsection-content .subsection-content-cta-bar .cta-action {
    padding-top: 7px
}

.channels-accordion .subsection-accordion .subsection-content .subsection-content-cta-bar .cta-action .button+.activate-sms-message {
    clear: both;
    margin-top: 1.5em
}

@media only screen and (max-width: 400px) {
    .channels-accordion .subsection-accordion .subsection-content {
        padding: 20px 0 0
    }
    .channels-accordion .subsection-accordion .subsection-content .cta-action .button {
        width: 100%;
        margin-bottom: 10px
    }
}

@media only screen and (min-width: 1000px) {
    .channels-accordion .subsection-accordion .subsection-content .subsection-content-cta-bar .price {
        float: left;
        width: 50%;
        margin-bottom: 0
    }
    .channels-accordion .subsection-accordion .subsection-content .subsection-content-cta-bar .cta-action {
        float: right;
        width: 50%;
        text-align: right
    }
}

.channels-accordion .subsection-accordion.open .subsection-content {
    display: block !important
}

.channels-accordion .subsection-accordion .subsection-content-columns {
    height: 110px;
    margin-bottom: 10px;
    overflow: hidden;
    border-top: 1px solid #d0d0d0;
    padding: 20px 0 20px 20px;
    -webkit-transition: height 0.3s ease;
    -moz-transition: height 0.3s ease;
    -ms-transition: height 0.3s ease;
    -o-transition: height 0.3s ease;
    transition: height 0.3s ease
}

.channels-accordion .subsection-accordion .subsection-content-columns:after {
    content: '';
    display: table;
    clear: both
}

.channels-accordion .subsection-accordion .subsection-content-columns .subsection-card {
    float: left;
    width: 33.33333333%;
    padding: 0 .75em
}

.channels-accordion .subsection-accordion .subsection-content-columns .subsection-card h2 {
    line-height: 78px
}

.channels-accordion .subsection-accordion .subsection-content-columns .subsection-card a.drop-toggler {
    position: relative;
    padding-left: 30px
}

.channels-accordion .subsection-accordion .subsection-content-columns .subsection-card a.drop-toggler:before {
    position: absolute;
    top: 3px;
    left: 5px;
    content: '';
    padding: 0;
    height: 0;
    width: 0;
    border: 10px solid #4b4b4b;
    border-color: transparent transparent transparent #4b4b4b
}

.channels-accordion .subsection-accordion .subsection-content-columns .subsection-card a.drop-toggler:hover:before {
    border-color: transparent transparent transparent #e20074
}

.channels-accordion .subsection-accordion .subsection-content-columns .list-channels {
    float: left;
    width: 66.66666666%;
    text-align: left
}

.channels-accordion .subsection-accordion .subsection-content-columns .list-channels ul {
    display: inline
}

.channels-accordion .subsection-accordion .subsection-content-columns .list-channels li {
    float: left;
    margin-left: 20px;
    clear: none !important
}

.channels-accordion .subsection-accordion .subsection-content-columns.target {
    height: auto !important
}

.channels-accordion .subsection-accordion .subsection-content-columns.target a.drop-toggler:before {
    top: 9px;
    left: 0;
    border-color: #4b4b4b transparent transparent transparent
}

.channels-accordion .subsection-accordion .subsection-content-columns.target a.drop-toggler:hover:before {
    border-color: #e20074 transparent transparent transparent
}

.channels-accordion .subsection-accordion:first-child .subsection-content-columns {
    border-top: 0
}

.radio-channels,
.fta-channels {
    text-align: center !important;
    padding: 20px !important
}

.activate-sms-message {
    position: relative;
    display: block;
    color: #fff;
    padding: .75em 1.5em;
    margin-bottom: 2.5em;
    background: #e20074;
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    -ms-border-radius: .5em;
    -o-border-radius: .5em;
    border-radius: .5em
}

.activate-sms-message h2,
.activate-sms-message h3,
.activate-sms-message p {
    text-transform: none !important;
    margin: 0 !important
}

.activate-sms-message:before {
    content: '';
    display: block;
    position: absolute;
    top: 100%;
    right: 2em;
    width: 0;
    height: 0;
    border: 10px solid #e20074;
    border-color: #e20074 #fff #fff #e20074
}

.activate-sms-message:after {
    content: '';
    display: block;
    position: absolute;
    top: 150%;
    right: 2em;
    left: 2em;
    height: 10px;
    background-image: -webkit-radial-gradient(#ddd 0, transparent 75%);
    background-image: -moz-radial-gradient(#ddd 0, transparent 75%);
    background-image: -ms-radial-gradient(#ddd 0, transparent 75%);
    background-image: -o-radial-gradient(#ddd 0, transparent 75%);
    background-image: radial-gradient(#ddd 0, transparent 75%)
}

#maxtv-to-go-app {
    border: 1px solid #d0d0d0;
    overflow: auto;
    padding: 24px;
    padding: 1.5rem;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px
}

#maxtv-to-go-app .app-link {
    float: left;
    width: 50%;
    text-align: center
}

#maxtv-to-go-app .app-link img {
    display: block;
    margin: 0 auto;
    margin-bottom: 24px;
    margin-bottom: 1.5rem;
    height: auto;
    width: auto
}

#maxtv-to-go-app .app-link a {
    display: block;
    margin-top: 12px;
    margin-top: .75rem
}

.list-content ul {
    margin: 0px 0px 24px;
    margin: 0rem 0rem 1.5rem
}

.list-content li {
    margin: 0px 0px 12px 16px;
    margin: 0rem 0rem .75rem 1rem
}

.list-content ul li {
    list-style: none
}

.list-content ul li:before {
    content: 'ÔÇô ';
    float: left;
    margin-left: -1em
}

.box-item .list-content li {
    margin-left: 0
}

.box-item .list-content li:before {
    content: ''
}

.list-thumbnail-abstract li {
    list-style: none;
    border-bottom: 1px solid #d0d0d0
}

.list-thumbnail-abstract li img {
    float: left
}

.list-faqs dd {
    max-width: 35em
}

.list-faqs ul {
    margin-bottom: 30px
}

.list-faqs ul li {
    list-style: none
}

.list-faqs ul li dl {
    padding: 15px 0
}

.list-faqs ul li:target {
    padding: 20px 0
}

.list-faqs ul li:target dl {
    border: 2px solid #e20074;
    margin-left: -20px;
    padding-left: 20px;
    background: #fff
}

.list-faqs ul li:target dt {
    color: #e20074
}

.list-faqs li ul li {
    margin-left: 2em
}

.list-faqs li ul li:before {
    content: '\2212';
    float: left;
    margin-left: -1em
}

.list-faq-shortcuts li h3 {
    margin: 0
}

.list-faq-shortcuts li h3 a {
    color: #e20074
}

.list-faq-shortcuts ul {
    border-top: 1px solid #d0d0d0;
    border-bottom: 1px solid #fff
}

.list-faq-shortcuts li li,
.list-faq-shortcuts li.q {
    border-bottom: 1px solid #d0d0d0;
    border-top: 1px solid #fff;
    margin: 0 !important
}

.list-faq-shortcuts a {
    display: block;
    padding: .75em 0;
    color: #000;
    text-decoration: none
}

.list-faq-shortcuts a:hover,
.list-faq-shortcuts a:focus {
    color: #e20074
}

.list-faq-shortcuts li {
    margin-bottom: 30px;
    list-style: none
}

.list-faq-shortcuts li li {
    margin-bottom: .5em
}

.list-terms-of-service li {
    list-style: none;
    margin-left: 2em
}

.list-terms-of-service li:before {
    content: '-';
    float: left;
    margin-left: -1em
}

.list-actions {
    max-width: 350px;
    margin: 20px 0
}

.list-actions-columns {
    max-width: 100%
}

.list-actions ul {
    margin: 0
}

.list-actions li {
    list-style: none
}

.list-actions li+li {
    margin-top: 20px
}

.list-actions li a {
    width: 100%
}

.more-link a,
.list-actions-basic a {
    text-decoration: none !important;
    color: #e20074;
    border-bottom: 1px solid #e20074;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.more-link a:hover,
.more-link a:focus,
.list-actions-basic a:hover,
.list-actions-basic a:focus {
    border-bottom-color: #e5e5e5
}

.section-magenta .more-link a,
.section-magenta .list-actions-basic a {
    color: #fff;
    border-bottom-color: #fff
}

.section-magenta .more-link a:hover,
.section-magenta .more-link a:focus,
.section-magenta .list-actions-basic a:hover,
.section-magenta .list-actions-basic a:focus {
    border-bottom-color: #e20074;
    border-bottom-color: rgba(255, 255, 255, 0.25)
}

.center .list-actions,
.layout-focus .list-actions {
    margin-left: auto;
    margin-right: auto
}

.list-channels ul {
    margin: 0 0 20px;
    padding: 0 15px;
    text-align: center
}

@supports (display: flex) or (display: -webkit-flex) or (display: -ms-flexbox) {
    .list-channels ul {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        -o-justify-content: center;
        justify-content: center;
        flex-wrap: wrap
    }
}

.list-channels li {
    list-style: none;
    display: inline-block;
    float: left;
    width: 10%;
    padding: 0 5px 30px 10px
}

@media only screen and (max-width: 599px) {
    .list-channels li {
        width: 25%
    }
}

@media only screen and (min-width: 600px) and (max-width: 959px) {
    .list-channels li {
        width: 20%
    }
}

@media only screen and (min-width: 960px) {
    .list-channels li {
        width: 10%
    }
}

.list-channels li a,
.list-channels li .channel-thumbnail {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 100%;
    display: block;
    font-size: 11px;
    line-height: 14px;
    color: #e20074;
    background: #fff;
    text-align: center;
    border: 1px solid #d0d0d0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    background: #fff
}

.list-channels .channel-upgrade a,
.list-channels .channel-upgrade .channel-thumbnail {
    border-color: #e20074;
    -webkit-box-shadow: 0 0 0 2px rgba(226, 0, 116, 0.25);
    -moz-box-shadow: 0 0 0 2px rgba(226, 0, 116, 0.25);
    -ms-box-shadow: 0 0 0 2px rgba(226, 0, 116, 0.25);
    -o-box-shadow: 0 0 0 2px rgba(226, 0, 116, 0.25);
    box-shadow: 0 0 0 2px rgba(226, 0, 116, 0.25)
}

.list-channels li a:hover {
    color: #000
}

.list-channels li:hover {
    position: relative;
    -webkit-transform: scale(2);
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -o-transform: scale(2);
    transform: scale(2);
    -webkit-transition: transform 0.2s ease;
    -moz-transition: transform 0.2s ease;
    -ms-transition: transform 0.2s ease;
    -o-transition: transform 0.2s ease;
    transition: transform 0.2s ease;
    z-index: 999
}

.list-channels li img {
    position: absolute;
    top: 10%;
    left: 10%;
    width: 80%;
    height: 80%;
    background: url(/img/maxtv/channel-fallback-bw.png);
    background: #fff;
    background-size: 100% 100%
}

.list-channels li .channel-title {
    background: #7c7c7c none repeat scroll 0 0;
    color: #fff;
    margin: 0.25em 0 0;
    padding: 2px !important;
    width: 100% !important;
    display: none;
    font-size: 0.75em !important;
    -webkit-transition: transform .2s ease;
    -moz-transition: transform .2s ease;
    -ms-transition: transform .2s ease;
    -o-transition: transform .2s ease;
    transition: transform .2s ease;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05)
}

.list-channels li .channel-title .channel-number {
    font: 1em/1 Tele-GroteskFet;
    display: block
}

.list-channels li:hover .channel-title {
    display: block
}

#maxtv-package-cta-bar .price {
    padding-top: 2px;
    margin-bottom: 0
}

#maxtv-package-cta-bar .price>strong.xxxl {
    line-height: 1 !important
}

#maxtv-package-cta-bar .cta-action {
    clear: both;
    padding: 7px 0
}

#maxtv-package-cta-bar .cta-action .button-mega {
    margin-bottom: 0
}

@media only screen and (max-width: 599px) {
    #maxtv-package-cta-bar .price {
        float: left;
        width: 100% !important;
        margin-bottom: 20px
    }
    #maxtv-package-cta-bar .xxxl {
        font-size: 72px !important
    }
    #maxtv-package-cta-bar .cta-action .button-mega {
        width: 100%
    }
}

@media only screen and (min-width: 600px) and (max-width: 699px) {
    #maxtv-package-cta-bar .price,
    #maxtv-package-cta-bar .cta-action {
        width: 350px;
        margin: 0 auto
    }
    #maxtv-package-cta-bar .price {
        margin-bottom: 20px
    }
    #maxtv-package-cta-bar .cta-action .button-mega {
        width: 100%
    }
}

@media only screen and (min-width: 700px) {
    #maxtv-package-cta-bar .price {
        float: left;
        width: 50%;
        margin-bottom: 0
    }
    #maxtv-package-cta-bar .cta-action {
        clear: none;
        float: right;
        width: 50%;
        text-align: right
    }
}

.list-featured-channels ul {
     text-align: center;
    width: 188px;
    margin: 0 auto
}

.list-featured-channels li {
    width: 74px;
    margin: 0 10px 20px;
    border: 1px solid #d0d0d0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    background: #fff
}

.list-featured-channels li a,
.list-featured-channels li .thumbnail {
    display: block;
    padding: 10px;
    font-size: 11px;
    line-height: 14px;
    color: #e20074;
    text-align: center
}

.list-featured-channels li img {
    display: block;
    width: 100%
}

.list-featured-channels li:nth-child(odd) {
    float: left;
    clear: left !important
}

.list-featured-channels li:nth-child(even) {
    float: right
}

.list-browsers li {
    list-style: none;
    float: left;
    width: 20%
}

.list-browsers li a {
    display: block;
    padding: 10px
}

.list-gallery {
    float: left;
    clear: both;
    width: 100%;
    position: relative;
    overflow: hidden;
    margin-bottom: 24px;
    margin-bottom: 1.5rem
}

.list-gallery li {
    list-style: none;
    float: left;
    width: 960px;
    margin: 0;
    overflow: hidden
}

.list-gallery li figcaption {
    text-align: center;
    white-space: normal;
    padding: 24px;
    padding: 1.5rem
}

input[type="radio"]+label span.css-input,
input[type="checkbox"]+label span.css-input {
    display: inline-block;
    width: 24px;
    height: 32px;
    margin: -4px 10px 0 0;
    vertical-align: middle;
    background: url(/webresources/css/i/check-radio-sheet.png) left top no-repeat;
    cursor: pointer
}

input[type="radio"]+label span.css-input {
    background: url(/webresources/css/i/check-radio-sheet.png) -60px 0 no-repeat
}

input[type="checkbox"]+label span.css-input {
    background: url(/webresources/css/i/check-radio-sheet.png) -4px 0 no-repeat
}

input[type="radio"]:checked+label span.css-input {
    background: url(/webresources/css/i/check-radio-sheet.png) -88px 0 no-repeat
}

input[type="checkbox"]:checked+label span.css-input {
    background: url(/webresources/css/i/check-radio-sheet.png) -32px 0 no-repeat
}

.section-service-overview .pseudo-form {
    clear: both
}

.pseudo-form h2 {
    color: #e20074;
    margin-bottom: 0
}

.pseudo-form ul {
    margin-bottom: 0
}

.pseudo-form p {
    margin-bottom: 10px
}

fieldset {
    border: 0
}

fieldset+fieldset {
    clear: both;
    margin-top: 20px;
    border-top: 1px solid #d0d0d0
}

.fields-pair .field-inline:last-child {
    padding-right: 0
}

.field {
    padding: 10px 0
}

.field+.field,
.fields-pair .field {
    padding-top: 0
}

.form-focus .fields-pair .field-inline {
    width: auto !important
}

.field label {
    font-weight: bold;
    padding-bottom: 6px
}

.field label .optional {
    font-weight: normal;
    color: #a4a4a4
}

.field>label {
    display: block
}

label .price-hint {
    display: block
}

label .price-hint.hidden {
    display: none
}

.label-helper {
    font-weight: normal;
    float: right
}

.help-screenshot img {
    width: 100%;
    padding: 1.5em;
    margin-bottom: 1.5em;
    border: 1px solid #d0d0d0
}

.group-check li,
.group-radio li {
    list-style: none;
    padding: 5px 0 0 20px
}

.group-check li label,
.group-radio li label {
    cursor: pointer
}

.field-select-products {
    padding: 0 !important;
    background: #fff
}

.field-select-products .group-radio li,
.field-select-products .group-check li {
    border-top: 1px solid #d0d0d0;
    padding: 0
}

.field-select-products .group-radio li:first-child,
.field-select-products .group-check li:first-child {
    border-top: 0
}

.field-select-products .group-radio li label,
.field-select-products .group-check li label {
    padding: 16px 36px !important;
    border: 4px solid #fff;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.field-select-products .group-radio li label:hover,
.field-select-products .group-check li label:hover {
    border-color: #e6e6e6
}

.field-select-products .group-radio li.li-checked label,
.field-select-products .group-check li.li-checked label {
    border-color: #e20074
}

.input-check,
.input-radio {
    float: left;
    margin: 3px 5px 0 -20px
}

.input-select {
    font-size: 15px;
    line-height: 20px;
    font-family: 'Tele-Grotesk', Arial, sans-serif;
    padding: 5px 5px 5px 10px;
    margin-bottom: 5px;
    border: 1px solid #d0d0d0;
    border-color: #777 #d0d0d0 #ddd;
    width: 100%;
    max-width: 280px;
    height: 36px;
    -webkit-box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #ededed;
    -moz-box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #ededed;
    -o-box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #ededed;
    box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #ededed;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    -ms-transition: all .2s ease;
    transition: all .2s ease
}

.field-error .input-select:not(.noerror) {
    border: 1px solid #d82101;
    -webkit-box-shadow: 0 0 0 2px #d82101, inset 0 1px 1px 1px #ededed;
    -moz-box-shadow: 0 0 0 2px #d82101, inset 0 1px 1px 1px #ededed;
    -o-box-shadow: 0 0 0 2px #d82101, inset 0 1px 1px 1px #ededed;
    box-shadow: 0 0 0 2px #d82101, inset 0 1px 1px 1px #ededed
}

.field.field-error .input-check-error {
    border: 1px solid #d82101;
    -webkit-box-shadow: 0 0 0 2px #d82101, inset 0 1px 1px 1px #ededed;
    -moz-box-shadow: 0 0 0 2px #d82101, inset 0 1px 1px 1px #ededed;
    -o-box-shadow: 0 0 0 2px #d82101, inset 0 1px 1px 1px #ededed;
    box-shadow: 0 0 0 2px #d82101, inset 0 1px 1px 1px #ededed
}

.input-select:focus {
    border: 1px solid #e20074;
    outline: none !important;
    -webkit-box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #ededed;
    -moz-box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #ededed;
    -o-box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #ededed;
    box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #ededed
}

td.cta .label-check,
td.cta .label-radio {
    display: block;
    text-align: center
}

td.cta .input-check,
td.cta .input-radio {
    float: none;
    margin: 0 0 15px
}

.group-check li label,
.group-radio li label {
    display: block;
    font-weight: normal;
    padding: 0 !important
}

.li-checked .li-checked,
.li-checked .li-checked {
    color: #000 !important;
    background: none !important;
    border: 0 !important
}

.advanced-options {
    clear: both;
    margin: 0 20px 20px 0;
    padding: 20px 0 10px 30px;
    color: #000;
    background: #e6e6e6;
    border-top: 5px solid #e5e5e5
}

.advanced-options .advanced-options {
    padding-left: 0;
    margin-bottom: 0
}

.advanced-options h3 {
    margin-top: 0
}

.advanced-options .input-text {
    margin-bottom: 20px
}

.advanced-options li {
    border: 0;
    padding: 0 30px
}

.advanced-options li:first-child {
    border: 0
}

.advanced-options .advanced-options {
    padding-top: 0;
    border: 0
}

.offer-reminder-group {
    padding: .75em 1em .25em;
    border-bottom: 1px solid #d0d0d0
}

.offer-reminder-conditions {
    padding: .75em 1em .25em;
    font-weight: bold;
    color: #e20074
}

.offer-reminder p,
.offer-reminder ul {
    margin-bottom: 10px
}

.offer-reminder li {
    list-style: none;
    padding: 0 0 10px 30px
}

.offer-reminder li:before {
    content: 'ÔÇô';
    float: left;
    margin-left: -1em
}

.field-inline-validation .input-text {
    float: left
}

.availability-check {
    float: left;
    padding: 8px 0 5px 20px
}

.small-note {
    margin: 0
}

.small-note-standalone {
    clear: both;
    margin: 0
}

.small-note-error {
    font-weight: bold;
    color: #D90000
}

.small-note-confirmation {
    font-weight: bold;
    color: #6BB324
}

.small-note-confirmation:before,
.small-note-error:before {
    content: '';
    float: left;
    display: block;
    width: 30px;
    height: 30px;
    background: url(i/icons/exclamation.png) no-repeat;
    background-size: 20px 19px
}

.group-check .small-note-error:before,
.group-radui .small-note-error:before {
    margin-left: -20px
}

.small-note-confirmation:before {
    background: red url(i/icons/checkmark-small.png) no-repeat 50% 50%;
    background-size: 10px 8px
}

input[readonly],
input[readonly]:focus,
.read-only,
.read-only:focus,
.input-text,
textarea {
    font: 14px/20px 'Open Sans', Arial, sans-serif;
    font-weight: 500;
    padding: 5px 10px;
    margin-bottom: 5px;
    border: 1px solid #d0d0d0;   
    -webkit-box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #e5e5e5;
    -moz-box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #e5e5e5;
    -ms-box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #e5e5e5;
    -o-box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #e5e5e5;    
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    border-radius: 7px;
}

.input-increment .input-text {
    float: left
}

.input-increment .input-button {
    cursor: pointer;
    display: block;
    float: left;
    font: bold 36px/1 'Headline', Arial, sans-serif
}

.input-increment .input-button.dec {
    padding-right: 0.5em
}

.input-increment .input-button.inc {
    padding-left: 0.5em
}

.field-error .input-text,
.field-error textarea {
    border: 1px solid #D90000;
    -webkit-box-shadow: 0 0 0 2px #D90000, inset 0 1px 1px 1px #e5e5e5;
    -moz-box-shadow: 0 0 0 2px #D90000, inset 0 1px 1px 1px #e5e5e5;
    -ms-box-shadow: 0 0 0 2px #D90000, inset 0 1px 1px 1px #e5e5e5;
    -o-box-shadow: 0 0 0 2px #D90000, inset 0 1px 1px 1px #e5e5e5;
    box-shadow: 0 0 0 2px #D90000, inset 0 1px 1px 1px #e5e5e5
}

.input-text:focus,
textarea:focus {
    border: 1px solid #e20074;
    outline: none !important;
    -webkit-box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #e5e5e5;
    -moz-box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #e5e5e5;
    -ms-box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #e5e5e5;
    -o-box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #e5e5e5;
    box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #e5e5e5
}

.input-text {
    width: 100%;
    max-width: 280px;
    height: 36px
}

.input-text-200 {
    width: 200px !important
}

.input-text-150 {
    width: 150px !important
}

.input-text-100 {
    width: 100px !important
}

.input-text-75 {
    width: 75px !important
}

.input-text-50 {
    width: 50px !important
}

.input-city,
.input-street {
    min-width: 200px
}

textarea {
    width: 100%
}

input:focus::-webkit-input-placeholder,
input:focus::-moz-placeholder,
input:focus::input-placeholder {
    -webkit-transition: opacity 0.5s 0.5s ease;
    -moz-transition: opacity 0.5s 0.5s ease;
    -ms-transition: opacity 0.5s 0.5s ease;
    -o-transition: opacity 0.5s 0.5s ease;
    transition: opacity 0.5s 0.5s ease;
    opacity: 0
}

::-webkit-inner-spin-button,
::-webkit-outer-spin-button,
input[type="number"] {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    -ms-appearance: none !important;
    -o-appearance: none !important;
    appearance: none !important
}

input[readonly],
input[readonly]:focus,
.read-only,
.read-only:focus {
    background: #e6e6e6
}

.form-alt-actions {
    position: relative;
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid #d0d0d0
}

.form-alt-actions h3 {
    position: relative;
    display: table;
    top: -30px;
    margin: 0 auto;
    padding: 0 10px !important;
    color: #a4a4a4;
    background: #fff;
    text-align: center
}

.form-alt-actions .button {
    margin-bottom: 10px
}

.pseudo-form .buttons {
    padding-top: 10px
}

.buttons .button {
    margin-bottom: 10px
}

.buttons button+button,
.buttons .button+.button,
.button+.button {
    margin-left: 10px
}

.app-store-link img {
    height: 36px;
    width: auto;
    max-width: 1000px
}

.button {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    font: bold 14px 'Open Sans;', Arial, sans-serif;
    line-height: 24px;
    line-height: 1.5rem;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: .05em;
    display: inline-flex;
    vertical-align: bottom;
    align-items: center;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    height: 55px;
    padding: 5px 20px;
    padding: .3125rem 1.25rem;
    color: #3a364f;
    background: #e5e5e5;
    border: 3px solid #d6d5d5;
    text-shadow: 0 1px 0 #fff;
    text-decoration: none !important;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 100px;
    background: #fff;
    background-image: -webkit-linear-gradient(#fff, #fff);
    background-image: -moz-linear-gradient(#fff, #fff);
    background-image: -ms-linear-gradient(#fff, #fff);
    background-image: -o-linear-gradient(#fff, #fff);
    background-image: linear-gradient(#fff, #fff);
    -webkit-transition: all 0.1s ease;
    -moz-transition: all 0.1s ease;
    -ms-transition: all 0.1s ease;
    -o-transition: all 0.1s ease;
    transition: all 0.1s ease
}


/*Button2023
.button {
    font-weight: 700;
    font-size: 1rem;
    line-height: 20px;
    text-transform: uppercase;
    border-radius: 100px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 2px solid rgba(0,0,0,.08);


background: hsla(0,0%,100%,.2);
    -webkit-backdrop-filter: blur(24px);
    backdrop-filter: blur(24px);
    border-color: hsla(0,0%,100%,.4);
    color: #fff;
    overflow: hidden;
}
*/



.button:hover,
.button:focus {
    -webkit-box-shadow: 0 0 0.4em 0.2em rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 0 0.4em 0.2em rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 0 0 0.4em 0.2em rgba(0, 0, 0, 0.05);
    -o-box-shadow: 0 0 0.4em 0.2em rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0.4em 0.2em rgba(0, 0, 0, 0.05)
}

.page-nav a:active,
.button-active,
.button:active {
    -webkit-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2) !important;
    -moz-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2) !important;
    -ms-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2) !important;
    -o-box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2) !important;
    box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.2) !important
}

.button-mini {
    padding: 0 5px;
    font-size: 10px;
    line-height: 19px;
    height: 20px
}

a.button-mini {
    padding: 0 8px
}

.button-primary {
    color: #fff;
    border: 1px solid #b5015c;
    text-shadow: 0 -1px 0 #ce006a;
    background: #ce006a;
    background-image: -webkit-linear-gradient(#fe319b, #e20074);
    background-image: -moz-linear-gradient(#fe319b, #e20074);
    background-image: -ms-linear-gradient(#fe319b, #e20074);
    background-image: -o-linear-gradient(#fe319b, #e20074);
    background-image: linear-gradient(#fe319b, #e20074)
}

.button-primary:hover,
.button-primary:focus {
    -webkit-box-shadow: 0 0 0.4em 0.2em rgba(226, 0, 116, 0.2);
    -moz-box-shadow: 0 0 0.4em 0.2em rgba(226, 0, 116, 0.2);
    -ms-box-shadow: 0 0 0.4em 0.2em rgba(226, 0, 116, 0.2);
    -o-box-shadow: 0 0 0.4em 0.2em rgba(226, 0, 116, 0.2);
    box-shadow: 0 0 0.4em 0.2em rgba(226, 0, 116, 0.2)
}

.button-mega {
    font-size: 21px;
    height: 60px;
    line-height: 50px;
    padding: 5px 30px;
    margin-bottom: 20px
}

.button-mega.button-primary {
    -webkit-animation: pulsate 2s infinite ease;
    -moz-animation: pulsate 2s infinite ease;
    -ms-animation: pulsate 2s infinite ease;
    -o-animation: pulsate 2s infinite ease;
    animation: pulsate 2s infinite ease
}

.button-mega.button-primary:hover,
.button-mega.button-primary:focus {
    -webkit-animation: none;
    -moz-animation: none;
    -ms-animation: none;
    -o-animation: none;
    animation: none
}

.button-disabled {
    color: #a4a4a4 !important;
    background: #e5e5e5 !important;
    border-color: #d0d0d0 !important;
    cursor: default;
    opacity: 0.5;
    filter: Alpha(opacity=50)
}

.button-disabled:hover,
.button-disabled:focus,
.button-disabled:active {
    cursor: default;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important
}

@-webkit-keyframes pulsate {
    0% {
        box-shadow: 0 0 0 0 rgba(226, 0, 116, 0.2)
    }
    50% {
        box-shadow: 0 0 0.4em 0.2em rgba(226, 0, 116, 0.2)
    }
    100% {
        box-shadow: 0 0 0 0 rgba(226, 0, 116, 0.2)
    }
}

@-moz-keyframes pulsate {
    0% {
        box-shadow: 0 0 0 0 rgba(226, 0, 116, 0.2)
    }
    50% {
        box-shadow: 0 0 0.4em 0.2em rgba(226, 0, 116, 0.2)
    }
    100% {
        box-shadow: 0 0 0 0 rgba(226, 0, 116, 0.2)
    }
}

@keyframes pulsate {
    0% {
        box-shadow: 0 0 0 0 rgba(226, 0, 116, 0.2)
    }
    50% {
        box-shadow: 0 0 0.4em 0.2em rgba(226, 0, 116, 0.2)
    }
    100% {
        box-shadow: 0 0 0 0 rgba(226, 0, 116, 0.2)
    }
}

.button-mega+.button-mega {
    margin-left: 1em
}

.button-gray {
    color: #fff;
    border: 1px solid #6c6c6c;
    text-shadow: 0 -1px 0 #000;
    background: #999;
    background-image: -webkit-linear-gradient(#999, #777);
    background-image: -moz-linear-gradient(#999, #777);
    background-image: -ms-linear-gradient(#999, #777);
    background-image: -o-linear-gradient(#999, #777);
    background-image: linear-gradient(#999, #777)
}

.button-gray:hover,
.button-gray:focus {
    -webkit-box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.15);
    -ms-box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.15);
    -o-box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.15)
}

.button-gray-dark {
    color: #fff;
    border: 1px solid #4b4b4b;
    text-shadow: 0 -1px 0 #000;
    background: #777;
    background-image: -webkit-linear-gradient(#777, #333);
    background-image: -moz-linear-gradient(#777, #333);
    background-image: -ms-linear-gradient(#777, #333);
    background-image: -o-linear-gradient(#777, #333);
    background-image: linear-gradient(#777, #333)
}

.button-gray-dark:hover,
.button-gray-dark:focus {
    -webkit-box-shadow: 0 0 4px 2px #a4a4a4;
    -moz-box-shadow: 0 0 4px 2px #a4a4a4;
    -ms-box-shadow: 0 0 4px 2px #a4a4a4;
    -o-box-shadow: 0 0 4px 2px #a4a4a4;
    box-shadow: 0 0 4px 2px #a4a4a4
}

.button-tertiary {
    color: #7c7c7c !important;
    background: #fff !important;
    border-color: #d0d0d0 !important
}

.button-disabled {
    color: #a4a4a4 !important;
    background: #e5e5e5 !important;
    border-color: #d0d0d0 !important
}

.button-disabled:hover,
.button-disabled:focus,
.button-disabled:active {
    cursor: default;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -ms-box-shadow: none !important;
    -o-box-shadow: none !important;
    box-shadow: none !important
}

.box-purple .button,
.section-magenta .button {
    border-color: #fff;
    color: #333
}

.box-purple .button:hover,
.box-purple .button:focus,
.section-magenta .button:hover,
.section-magenta .button:focus {
    border-color: #fff;
    color: #e20074 !important
}

.box-purple .button:active,
.section-magenta .button:active {
    border-color: #e20074
}

.button+.small-note {
    margin-top: 0
}

.button-process:after {
    content: 'ÔľÂ';
    font-size: .75em;
    margin: 0 -.5em 0 .75em
}

.buttons-next .button {
    margin-right: 0 !important;
    margin-left: 10px
}

.form-focus {
    width: 100%;
    margin: 0 auto
}

.form-focus fieldset {
    max-width: 320px;
    margin: 0 auto
}

.form-focus .input-text {
    width: 100%;
    max-width: 100%
}

.form-focus .buttons {
    padding: 5px 0 10px
}

.form-focus button,
.form-focus .button {
    width: 100%
}

.layout-focus .pseudo-form:not(.form-focus) fieldset {
    border: 1px solid #d0d0d0;
    margin-bottom: 30px;
    background: #fff;
    -webkit-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    -moz-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    -ms-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    -o-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025)
}

.layout-focus .pseudo-form:not(.form-focus) fieldset h2 {
    border-bottom: 1px solid #d0d0d0;
    font-size: 100%;
    font-size: 16px;
    font-size: 1rem;
    line-height: 20px;
    line-height: 1.25rem;
    padding: 10px 1rem;
    background: #e6e6e6
}

.layout-focus .pseudo-form:not(.form-focus) fieldset .field {
    padding: .625rem 1rem;
    border-top: 1px solid #d0d0d0
}

.layout-focus .pseudo-form:not(.form-focus) fieldset h2+.field,
.layout-focus .pseudo-form:not(.form-focus) fieldset h2+.fields-pair .field {
    border: 0
}

.layout-focus .pseudo-form:not(.form-focus) fieldset .table-wrapper {
    margin: 0;
    border-bottom: 0
}

.layout-focus .pseudo-form:not(.form-focus) fieldset table {
    margin: 0;
    border-bottom: 0
}

.layout-focus .pseudo-form:not(.form-focus) fieldset .table-wrapper table tr:first-child th,
.layout-focus .pseudo-form:not(.form-focus) fieldset .table-wrapper table tr:first-child td {
    border-top: 0
}

.form-focus .fields-pair .field-inline-city,
.form-focus .fields-pair .field-inline-street {
    width: 70% !important
}

.form-focus .fields-pair .field-inline-zip,
.form-focus .fields-pair .field-inline-house-no {
    width: 30% !important;
    padding-right: 0
}

.form-focus .fields-pair .field-inline-zip .input-text,
.form-focus .fields-pair .field-inline-house-no .input-text {
    width: 100% !important
}

.layout-focus .buttons {
    text-align: center
}

.layout-focus .form-focus .group-check li,
.layout-focus .form-focus .group-radio li {
    border-top: 1px solid #d0d0d0
}

.form-inline label {
    float: left;
    font-weight: bold;
    padding-right: 10px;
    line-height: 34px
}

.form-inline .input-text {
    float: left;
    width: 100%;
    margin: 0 !important
}

.input-text+button,
.input-text+.button {
    margin-left: 2px
}

.form-flex {
    display: block;
    max-width: 450px;
    margin: 0 auto
}

.field-flex {
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    justify-content: left
}

.field-flex .input-text {
    float: left;
    min-width: 270px;
    width: auto !important
}

.field-flex .button {
    float: left;
    width: auto
}

.form-inline .field-phone {
    position: relative;
    padding: 0 119px 0 0
}

.form-inline .field-phone .button {
    position: absolute;
    right: 0;
    top: 0;
    width: 120px
}

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

table th {
    font-weight: normal
}

table td.actions {
    width: 10%
}

table td.actions .button-mini {
    display: inline-block !important
}

table tfoot {
    border-top: 5px solid #e20074
}

.packages-overview>ul::-webkit-scrollbar,
.table-wrapper::-webkit-scrollbar {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px
}

.packages-overview>ul::-webkit-scrollbar-thumb,
.table-wrapper::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    border: 5px solid #e5e5e5;
    background: #e20074
}

.packages-overview>ul::-webkit-scrollbar-track,
.table-wrapper::-webkit-scrollbar-track {
    background: #e5e5e5
}

.section-white ::-webkit-scrollbar-thumb {
    border-color: #fff
}

.section-white ::-webkit-scrollbar-track {
    background: #fff
}

.section-gray ::-webkit-scrollbar-thumb {
    border-color: #e6e6e6
}

.section-gray ::-webkit-scrollbar-track {
    background: #e6e6e6
}

.section-gray-dark ::-webkit-scrollbar-thumb {
    border-color: #e5e5e5
}

.section-gray-dark ::-webkit-scrollbar-track {
    background: #e5e5e5
}

.section-gray-verydark ::-webkit-scrollbar-thumb {
    border-color: #333333
}

.section-gray-verydark ::-webkit-scrollbar-track {
    background: #333333
}

.table-wrapper {
    width: 100%;
    margin-bottom: 20px;
    overflow: auto
}

.table-wrapper table {
    table-layout: fixed;
    min-width: 100%;
    border-bottom: 1px solid #d0d0d0
}

.table-wrapper thead th {
    background-color: #e6e6e6
}

.table-wrapper table th,
.table-wrapper table td {
    border-top: 1px solid #d0d0d0;
    padding: 10px 16px;
    padding: 10px 1rem;
    vertical-align: top
}

.table-wrapper table .y {
    text-transform: uppercase;
    font-size: 20px
}

.table-wrapper table .n {
    text-transform: uppercase;
    color: #fff
}

.table-wrapper table .number {
    white-space: nowrap
}

.table-wrapper table .number,
.table-wrapper table .instalments {
    text-align: right !important
}

.table-wrapper table .nowrap {
    white-space: nowrap
}

.page-header+.table-wrapper table tr:first-child th,
.page-header+.table-wrapper table tr:first-child td {
    border-top: 1px solid #6c6c6c
}

.table-wrapper .title-row h1,
.table-wrapper .title-row h2,
.table-wrapper .title-row h3,
.table-wrapper .title-row h4 {
    color: #e20074;
    font-size: 16px;
    font-size: 1rem;
    line-height: 20px;
    white-space: nowrap;
    margin: 0 !important
}

.table-wrapper th.number {
    text-align: right;
    white-space: normal !important
}

.table-final-price .title-row th {
    border-top: 1px solid #000
}

.table-tiny-properties th {
    width: 33%
}

td.time-frame-condition {
    text-align: left !important
}

.standard-conditions {
    font-weight: normal !important;
    color: #a4a4a4 !important
}

.total-row th,
.total-row td {
    font-weight: bold;
    color: #e20074
}

.total-row th {
    text-transform: uppercase
}

.table-comparison thead th {
    vertical-align: middle
}

.table-comparison tbody th {
    text-align: left;
    width: 28%;
    padding: 0
}

.table-comparison tbody th a,
.table-comparison tbody th span {
    display: block;
    padding: 10px 0
}

.table-comparison tbody th a:hover,
.table-comparison tbody th a:focus {
    color: #333
}

.table-comparison tbody td {
    text-align: center;
    width: 18%
}

.table-comparison-prices-matrix thead th {
    background: none
}

.table-comparison-prices-matrix td,
.table-comparison-prices-matrix th {
    border-left: 1px solid #e5e5e5;
    padding: 10px 7px !important
}

.table-comparison-prices-matrix td:first-child,
.table-comparison-prices-matrix th:first-child {
    border-left: 0
}

.table-comparison-prices-matrix tfoot tr:first-child th,
.table-comparison-prices-matrix tfoot tr:first-child td {
    border-top-color: #d0d0d0
}

.quick-comparison {
    margin-bottom: 20px;
    background: #fff
}

.table-order-specification tr th {
    width: 33%
}

#maxtv-packages-guide {
    max-width: 1200px;
    margin: 0 auto 2em;
    overflow: visible
}

#maxtv-packages-guide .left {
    text-align: left
}

#maxtv-packages-guide thead th {
    background: none
}

#maxtv-packages-guide thead th,
#maxtv-packages-guide tbody th,
#maxtv-packages-guide tbody td {
    vertical-align: middle;
    border: 1px solid #d0d0d0
}

#maxtv-packages-guide thead th,
#maxtv-packages-guide tbody td {
    text-align: center
}

#maxtv-packages-guide .cell-channel-icon {
    padding: 10px 10px
}

#maxtv-packages-guide .cell-channel-icon a {
    display: block;
    padding: 0;
    line-height: 45px;
    vertical-align: middle;
    color: #000;
    white-space: nowrap
}

#maxtv-packages-guide .cell-channel-icon a:hover {
    color: #e20074
}

#maxtv-packages-guide .cell-channel-icon img {
    float: left;
    width: 65px;
    height: 65px;
    margin-right: 20px;
    padding: 10px;
    background: #fff;
    border: 1px solid #d0d0d0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05)
}

#maxtv-packages-guide .cell-channel-icon a:hover img {
    -webkit-transform: scale(3) translateX(33%);
    -moz-transform: scale(3) translateX(33%);
    -ms-transform: scale(3) translateX(33%);
    -o-transform: scale(3) translateX(33%);
    transform: scale(3) translateX(33%);
    -webkit-transition: transform 0.2s ease;
    -moz-transition: transform 0.2s ease;
    -ms-transition: transform 0.2s ease;
    -o-transition: transform 0.2s ease;
    transition: transform 0.2s ease
}

#maxtv-packages-guide .cell-channel-icon a .channel-number {
    display: inline-block;
    margin-right: 1em
}

#maxtv-packages-guide thead th a {
    color: #000
}

#maxtv-packages-guide tbody td a {
    color: #4b4b4b
}

#maxtv-packages-guide tbody td a:hover {
    color: #e20074
}

#maxtv-packages-guide .list-cell-packages ul {
    margin: 0
}

#maxtv-packages-guide .list-cell-packages ul li {
    list-style: none;
    padding: .25em 0
}

#maxtv-packages-guide .list-cell-packages ul li a {
    display: inline-block
}

#maxtv-packages-guide .list-cell-packages-inline li {
    display: inline;
    margin: 0 .5em
}

#maxtv-packages-guide tbody tr:nth-child(odd) {
    background: #e6e6e6
}

.preview-panel {
    margin-bottom: 30px;
    background: #fff;
    -webkit-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    -moz-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    -ms-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    -o-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025)
}

.preview-panel .inner {
    clear: both;
    border: 1px solid #d0d0d0;
    padding: 16px 16px 8px;
    padding: 1rem 1rem .5rem
}

.preview-panel .table-wrapper {
    clear: both;
    margin-bottom: 0
}

.preview-panel table {
    border: 1px solid #d0d0d0
}

.preview-panel table th {
    width: 33%
}

.title-row,
.preview-panel-header {
    padding: 10px 16px;
    padding: 10px 1rem;
    background: #e6e6e6;
    position: relative
}

.preview-panel-header {
    float: none;
    width: 100%;
    border: 1px solid #d0d0d0;
    border-bottom-width: 0
}

.title-row h2,
.preview-panel-header h2 {
    float: none !important;
    color: #e20074;
    font-size: 16px;
    font-size: 1rem;
    line-height: 20px;
    white-space: nowrap;
    margin: 0 !important
}

.title-row .edit-link,
.preview-panel-header .edit-link {
    text-transform: none;
    line-height: 20px;
    line-height: 1.25rem;
    margin-bottom: 0;
    margin-top: -0.625em;
    position: absolute;
    right: 1em;
    top: 50%
}

@media only screen and (max-width: 600px) {
    .title-row .edit-link,
    .preview-panel-header .edit-link {
        margin-top: 0;
        position: static
    }
}

.title-row .edit-link a,
.preview-panel-header .edit-link a {
    font-weight: normal;
    color: #7c7c7c;
    text-decoration: none
}

.title-row .edit-link a:hover,
.title-row .edit-link a:focus,
.preview-panel-header .edit-link a:hover,
.preview-panel-header .edit-link a:focus {
    text-decoration: underline
}

.close-line {
    background: transparent url("https://static.hrvatskitelekom.hr/webresources/css/i/icons/close-magenta.png") no-repeat 0 0;
    background-size: contain;
    cursor: pointer;
    float: left;
    margin: 0.35em 0.25em 0 -0.75em;
    width: 0.5em;
    height: 0.5em
}

table.package-configurator .noborder td,
table.package-configurator .noborder th {
    border-top: none
}

table.package-configurator .heading-row td,
table.package-configurator .heading-row th {
    padding-bottom: 0
}

table.package-configurator .heading-row+tr td,
table.package-configurator .heading-row+tr th {
    padding-top: 4px
}

.preview-panel table.package-configurator th {
    width: 62%
}

table.package-configurator .group-check li,
table.package-configurator .group-radio li {
    padding-top: 0
}

table.package-configurator .total-row th {
    text-transform: none
}

table.package-configurator td.divider:after {
    display: block;
    width: 100%;
    height: 1px;
    content: '';
    background: #d0d0d0
}

#package-price-box {
    position: absolute;
    left: 50%;
    top: 2.5em;
    margin-left: 325px;
    width: 150px;
    padding: 1em;
    text-align: center;
    background: #e20074;
    color: #fff;
    -webkit-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    -moz-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    -o-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025)
}

#package-price-box.fixed {
    position: fixed;
    top: 0.5em
}

#package-price-box p {
    margin: 0
}

#package-price-box a {
    color: #fff !important
}

#package-price-box p.price {
    font-family: HEadline-ult;
    font-size: 36px;
    margin: 0 0 10px
}

#package-price-box p.price:after {
    display: inline-block;
    content: 'kn/mj.';
    font-family: Tele-grotesk;
    font-size: 18px;
    margin: 0 0 0 6px
}

#package-price-box h3 {
    margin: 0 0 10px
}

.magenta-price-box {
    padding: 2em 0 0.5em;
    width: 100%;
    max-width: 960px;
    margin-bottom: 2em;
    text-align: left;
    background: #e20074;
    color: #fff
}

.magenta-price-box.fixed {
    position: fixed;
    top: 0;
    z-index: 9999;
    padding: 1.25em 0.25em 0em
}

.magenta-price-box h3,
.magenta-price-box img,
.magenta-price-box a {
    margin: 0 1.5em;
    float: left
}

.magenta-price-box h3 {
    margin: 0
}

.magenta-price-box img {
    position: relative;
    top: -15px
}

.magenta-price-box p {
    margin: 0;
    display: inline-block
}

.magenta-price-box a {
    color: #fff !important;
    float: right;
    position: relative;
    top: 2px
}

.magenta-price-box p.price {
    font-family: HEadline-ult;
    font-size: 36px;
    margin: 0 0 10px
}

.magenta-price-box p.price:after {
    display: inline-block;
    content: 'kn/mj.';
    font-family: Tele-grotesk;
    font-size: 18px;
    margin: 0 0 0 6px
}

@media only screen and (max-width: 768px) {
    .magenta-price-box {
        padding: 1em;
        margin-bottom: 0;
        text-align: center
    }
    .magenta-price-box h3,
    .magenta-price-box img,
    .magenta-price-box a {
        float: none
    }
    .magenta-price-box a {
        display: block;
        margin: 0 .5em 0
    }
    .magenta-price-box img,
    .magenta-price-box.fixed img {
        width: 10%;
        max-width: 25px !important;
        top: -5px
    }
    .magenta-price-box.fixed a {
        margin: 0 .5em .5em
    }
    .magenta-price-box span.price {
        display: block;
        margin-bottom: 0 !important
    }
}

@media only screen and (max-width: 960px) {
    .magenta-price-box.fixed {
        top: 0;
        left: 0
    }
}

.packages-overview .section-trigger td,
.packages-overview .sec-trigger td {
    padding: 0 !important;
    text-align: left;
    background: #fff
}

.packages-overview .section-trigger td a.active,
.packages-overview .sec-trigger td a.active,
.packages-overview .sec-trigger td a {
    display: block;
    border-bottom: 1px solid #f2f2f2;
    font: normal 16px/1 Headline-ult;
    text-transform: uppercase;
    padding: 10px 20px;
    color: #333;
    position: relative
}

.packages-overview .section-trigger td a.active,
.packages-overview .sec-trigger td a.active {
    border-bottom: none
}

.packages-overview .sec-trigger td a.active:after {
    display: block;
    content: '';
    width: 13px;
    height: 7px;
    position: absolute;
    right: 20px;
    top: 50%;
    margin: -3px 0 0;
    background: transparent url(/webresources/images/design/up-down-13.png) no-repeat 0 0
}

.packages-overview .sec-trigger td a:after {
    background-position: 0 -7px
}

.box-group {
    clear: both
}

p+.box-group,
ol+.box-group,
ul+.box-group {
    margin-top: 40px
}

.box-group-products {
    display: table;
    border: 1px solid #d0d0d0;
    margin-bottom: 20px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px
}

.box-group-products .box-item {
    display: table-cell !important;
    height: 100%;
    width: 33.33333333% !important;
    margin: 0 !important;
    padding: 30px;
    border-left: 1px solid #e5e5e5
}

.list-device-box,
.box-item {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%
}

.box-item-device-simple {
    text-align: center;
    padding-bottom: 60px
}

@media only screen and (max-width: 768px) {
    .box-item-device-simple {
        padding-bottom: 0
    }
}

.box-item-device-simple .device-image {
    padding: 20px 0;
    max-height: 368px
}

.box-item-device-simple .device-image img {
    max-height: 300px
}

.slider {
    overflow: hidden;
    position: relative
}

.slider:before {
    position: absolute;
    display: block;
    content: "";
    z-index: 1;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.slide-left,
.slide-right {
    position: absolute;
    width: 2em;
    z-index: 1;
    height: 2em;
    line-height: 2em;
    background: #e20074;
    top: 50%;
    margin-top: -1em;
    opacity: 0.5
}

.slide-left {
    left: 0
}

.slide-right {
    right: 0
}

.slide-left.active,
.slide-right.active {
    opacity: 1
}

.slider-holder {
    position: relative;
    width: 9999px
}

.slider .box-item-device-simple {
    clear: none !important;
    margin-bottom: 0;
    max-width: 285px
}

.slider .prev,
.slider .go-right {
    position: absolute
}

.box-item {
    margin: 0 0 30px
}

.box-item h1 {
    float: none !important
}

.box-item .box-item-thumbnail {
    margin-bottom: 20px
}

.box-item .box-item-thumbnail img {
    height: 250px;
    width: auto !important;
    min-width: 0
}

.box-group-single-row .box-item {
    margin-bottom: 0
}

.box-item-header h2 {
    text-transform: uppercase;
    font-family: 'Headline'
}

.box-item .figure {
    position: relative;
    padding-top: 56.25%;
    width: 100%;
    max-width: 100%;
    height: 0;
    margin-bottom: 1em
}

.box-item .figure img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.box-item .figure+h3 {
    margin-top: 20px
}

.box-item p+h2,
.box-item p+h3 {
    margin-top: 30px
}

.box-item .overview-links ul {
    margin-bottom: 1.5em
}

.box-item .overview-links li {
    list-style: none;
    margin-bottom: .375em
}

.box-item .overview-links li a {
    text-decoration: none !important;
    color: #e20074;
    border-bottom: 1px solid #e20074
}

.box-item .overview-links li a:hover {
    border-bottom-color: #e5e5e5
}

.box-item-icon {
    padding-top: 70px;
    margin-bottom: 10px !important;
    max-width: 450px;
    background: url(i/icons/default-icon.png) no-repeat 0 20px;
    background-size: 35px 35px
}

.box-item-icon-large {
    padding-top: 140px;
    margin-bottom: 10px !important;
    max-width: 450px;
    background: url(i/icons/default-icon-@2x.png) no-repeat 0 40px;
    background-size: 70px 70px
}

.box-group.top-boxes .box-item {
    border: 1px solid #e20074 !important;
    padding: 1em
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    .box-item-icon {
        background-image: url(i/icons/default-icon-@2x.png)
    }
    .box-item-icon-large {
        background-image: url(i/icons/default-icon-@4x.png)
    }
}

.shortcuts-list li {
    list-style: none
}

.shortcuts-list li:first-child {
    border: 0
}

.shortcuts-list li a {
    display: block;
    padding: 10px 0
}

.shortcuts-list li a:hover,
.shortcuts-list li a:hover strong {
    color: #e20074
}

.shortcuts-list-icons ul {
    float: left;
    width: 100%;
    margin: 0;
    border-left: 1px solid #7c7c7c
}

.shortcuts-list-icons li {
    float: left;
    width: 20%;
    border-right: 1px solid #7c7c7c !important
}

.shortcuts-list-icons li a {
    color: #fff;
    text-align: center;
    font-weight: bold;
    min-height: 190px;
    padding: 140px 20px 20px;
    background: none no-repeat 50% 50%
}

.shortcuts-list-icons li a:hover {
    color: #fff;
    background: #e20074
}

.shortcuts-list-icons li#shortcut-01 a {
    background-image: url(i/icons/shortcut-01.png)
}

.shortcuts-list-icons li#shortcut-02 a {
    background-image: url(i/icons/shortcut-02.png)
}

.shortcuts-list-icons li#shortcut-03 a {
    background-image: url(i/icons/shortcut-03.png)
}

.shortcuts-list-icons li#shortcut-04 a {
    background-image: url(i/icons/shortcut-04.png)
}

.shortcuts-list-icons li#shortcut-05 a {
    background-image: url(i/icons/shortcut-05.png)
}

.list-highlights li {
    list-style: none;
    text-align: center;
    color: #e20074;
    border-bottom: 1px solid rgba(226, 0, 116, 0.25);
    position: relative;
    left: -3000px;
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 24px;
    line-height: 1.5rem;
    padding: .5em 0
}

@media only screen and (min-width: 960px) {
    .list-highlights li {
        font-size: 32px;
        font-size: 2rem;
        line-height: 36px;
        line-height: 2.25rem
    }
}

.list-highlights li:first-child {
    border-top: 1px solid rgba(226, 0, 116, 0.25)
}

.list-highlights li+li {
    left: -2750px
}

.list-highlights li+li+li {
    left: -3000px
}

.list-highlights li+li+li+li {
    left: -3000-250px
}

.list-highlights li+li+li+li+li {
    left: -3000-250-250px
}

.list-highlights li+li+li+li+li+li {
    left: -3000-250-250-250px
}

.list-highlights li+li+li+li+li+li+li {
    left: -3000-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250px
}

.list-highlights li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li+li {
    left: -3000-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250-250px
}

.activate-animation .list-highlights li {
    -webkit-transition: left 1s ease;
    -moz-transition: left 1s ease;
    -ms-transition: left 1s ease;
    -o-transition: left 1s ease;
    transition: left 1s ease;
    left: 0
}

.list-features {
    margin-bottom: 10px
}

.list-features li {
    list-style: none;
    margin-bottom: 10px
}

.list-features li:before {
    content: '+';
    float: left;
    margin-left: -1.5em;
    font-weight: bold;
    color: #e20074
}

.list-features-tiny {
    margin-bottom: 1.5em
}

.list-features-tiny ul {
    border-top: 1px solid #e5e5e5;
    margin: 0;
    padding-top: .75em
}

.list-features-tiny li {
    list-style: none;
    padding: .375em 0
}

.list-features-tabular {
    margin: 0
}

.list-features-tabular li {
    list-style: none;
    padding-top: 10px;
    margin-left: 15px;
    padding-bottom: 10px
}

.section-service .list-features,
.section-story .list-features,
.section-value-feature .list-features {
    padding-left: 1.25em;
    margin-bottom: 20px
}

.section-service .list-features li,
.section-story .list-features li,
.list-features-tabular li,
.section-story .list-actions li {
    font-size: 21px;
    font-size: 18px;
    line-height: 25px
}

.section-scream .list-actions li a,
.section-story .list-actions li a {
    font-weight: bold;
    text-decoration: underline
}

.section-story .list-actions li a:hover,
.section-story .list-actions li a:focus {
    text-decoration: none
}

.more-link-list li {
    list-style: none;
    margin-bottom: 5px
}

.more-link-list li a:not(.button):hover {
    text-decoration: underline
}

.more-link-icons {
    clear: both;
    padding-top: 24px;
    padding-top: 1.5rem
}

.section-gray .more-link-icons {
    background-image: -webkit-linear-gradient(top, #e5e5e5 5px, #e6e6e6 5px);
    background-image: -moz-linear-gradient(top, #e5e5e5 5px, #e6e6e6 5px);
    background-image: -ms-linear-gradient(top, #e5e5e5 5px, #e6e6e6 5px);
    background-image: -o-linear-gradient(top, #e5e5e5 5px, #e6e6e6 5px);
    background-image: linear-gradient(top, #e5e5e5 5px, #e6e6e6 5px)
}

.buttons-list li {
    list-style: none;
    float: left;
    padding: 0 10px 0 0
}

.box-group-20 .list-features li,
.box-group-25 .list-features li,
.box-group-33 .list-features li,
.box-group-20 .list-features-tabular li,
.box-group-25 .list-features-tabular li,
.box-group-33 .list-features-tabular li {
    text-align: center;
    padding-left: 0 !important
}

.box-group-20 .list-features li:before,
.box-group-25 .list-features li:before,
.box-group-33 .list-features li:before,
.box-group-20 .list-features-tabular li:before,
.box-group-25 .list-features-tabular li:before,
.box-group-33 .list-features-tabular li:before {
    content: none
}

.section-tiles {
    padding: 20px 0 0 !important
}

.section-tiles .grid {
    padding: 0 !important
}

.section-tiles .box-item {
    margin-bottom: 20px
}

.section-tiles .box-item a {
    display: block;
    color: #fff
}

.section-tiles .box-item img {
    float: left;
    min-width: 100%;
    margin-bottom: 2px
}

.box-group-banners {
    background: #e6e6e6;
    border-bottom: 2px solid #fff
}

.box-banner {
    float: left;
    width: 100%
}

.box-banner a {
    display: block;
    position: relative;
    padding-top: 56.25%;
    color: #000;
    border-top: 2px solid #fff;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.box-banner a:hover,
.box-banner a:focus {
    color: #e20074
}

.box-banner-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    padding: 1.5em 2em;
    text-align: center
}

.box-banner-content h3 {
    font-weight: normal
}

.section-pinterest {
    padding-bottom: 20px !important
}

.section-pinterest .box-group {
    -webkit-columns: 3;
    -moz-columns: 3;
    -ms-columns: 3;
    -o-columns: 3;
    columns: 3
}

.section-pinterest .box-item {
    float: none !important;
    width: 100% !important;
    margin: 0 0 30px !important;
    -webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    -ms-column-break-inside: avoid;
    -o-column-break-inside: avoid;
    column-break-inside: avoid
}

.ribbon {
    position: relative;
    color: #fff;
    background: #e20074;
    padding: 10px 20px
}

.ribbon h2 {
    font-weight: normal;
    font-family: Headline;
    text-transform: uppercase;
    margin: 0
}

.ribbon p {
    margin: 0
}

.ribbon .button {
    position: absolute;
    top: 15px;
    right: 20px
}

.figure {
    margin-bottom: 10px
}

.figure-tv {
    margin-bottom: 10px
}

.message,
.msg {
    width: 100%;
    max-width: 960px;
    padding: 35px 40px 15px;
    margin: 0 auto 20px;
    border: 2px solid #d0d0d0;
    text-align: left;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px
}

.errorMsg {
    font-size: 21px;
    line-height: 25px;
    margin: 0 auto 15px;
    color: #D90000;
    width: 100%;
    max-width: 960px;
    padding: 35px 40px 15px;
    margin: 0 auto 20px;
    text-align: left;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px
}

.message h1 {
    margin-bottom: 20px;
    margin-bottom: 1.25rem
}

.message h1.xxl {
    margin-bottom: 15px
}

.message p {
    font-size: 21px;
    line-height: 25px;
    margin: 0 auto 15px
}

.message-tiny {
    padding: 10px 20px;
    border-width: 1px
}

.message-tiny p {
    font-size: 14px;
    line-height: 18px;
    margin: 0 auto
}

.message-error {
    color: #D90000;
    border-color: #D90000
}

.message-error h1,
.message-error p,
.message-error li {
    color: #D90000
}

.message-confirmation {
    color: #6BB324;
    border-color: #6BB324
}

.message-confirmation h1,
.message-confirmation p,
.message-confirmation li {
    color: #6BB324
}

.message-thankyou {
    color: #000;
    border-color: #6BB324
}

.message-thankyou h1 {
    color: #6BB324
}

.message-thankyou p {
    max-width: 25em
}

.message-system {
    color: #1063ad;
    border-color: #1063ad
}

.message-system h1,
.message-system p,
.message-system li {
    color: #1063ad
}

.message-info {
    color: #53baf2;
    border-color: #53baf2
}

.message-info h1,
.message-info p,
.message-info li {
    color: #53baf2
}

.message-promo {
    color: #e20074;
    border-color: #e20074
}

.message-promo h1 {
    color: #e20074
}

.message-promo p,
.message-promo li {
    color: #000
}

.layout-focus .message {
    padding-left: 20px;
    padding-right: 20px;
    padding-left: 1.25rem;
    padding-right: 1.25rem
}

.layout-focus .message h1 {
    margin-bottom: 10px;
    margin-bottom: .625rem
}

.page-header .message {
    margin-bottom: 0
}

.error {
    color: #D90000
}

.confirmation {
    color: #6BB324
}

.layout {
    margin: 0 auto
}

.section-story {
    width: 100%
}

.layout-focus .grid {
    max-width: 37.5em !important
}

#layout-empty-cart .grid {
    max-width: 37.5em !important
}

#layout-empty-cart h1 {
    padding-top: 210px;
    margin-left: -37px;
    padding-left: 37px;
    background: url(i/icons/cart-empty.png) no-repeat 10px 30px;
    background-size: 151px 139px
}

#layout-empty-cart .section .grid {
    padding-bottom: 60px;
    padding-bottom: 3.75rem
}

#layout-empty-cart .actions {
    margin-top: 30px !important
}

.section-grass {
    color: #fff;
    background: url(i/patterns/grass.jpg) repeat 0 0;
    background-size: 675px 648px !important
}

.section-grass a {
    color: #fff
}

.section-scream .grid {
    padding: 80px 0 60px
}

.section-scream .box-item {
    padding-bottom: 20px
}

.section-scream .box-item p {
    margin-bottom: 20px
}

.section-scream .box-item p a {
    font-weight: bold;
    text-decoration: none;
    border-bottom: 1px solid #fff;
    padding-bottom: 2px
}

.section-scream .box-item p a:hover {
    border-bottom-color: rgba(255, 255, 255, 0.5);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.section-scream.section-white .box-item p a {
    color: #e20074;
    border-bottom-width: 1px;
    border-bottom-color: #e20074
}

.section-scream.section-white .box-item p a:hover {
    color: #e20074;
    border-bottom-color: #e5e5e5
}

.section-scream.section-gray .box-item p a {
    color: #e20074;
    border-bottom-width: 1px;
    border-bottom-color: #e20074
}

.section-scream.section-gray .box-item p a:hover {
    color: #e20074;
    border-bottom-color: #d0d0d0
}

.section-story:first-child {
    border-top: 0
}

.section-story .figure {
    margin-left: auto;
    margin-right: auto;
    line-height: 0
}

.section-story .section-header {
    margin-bottom: 30px
}

.section-story p {
    max-width: 600px;
    margin: auto;
    font-size: 21px;
    font-size: 18px;
    line-height: 25px;
    text-transform: none
}

.section-story p.center {
    margin-left: auto;
    margin-right: auto
}

.section-story .more-link {
    padding-top: 30px
}

.section-story li {
    list-style: none
}

.section-story .table-wrapper table,
.table-comparison-prices-matrix table {
    border-top: 5px solid #000
}

.section-story ol {
    counter-reset: item;
    font-size: 21px;
    font-size: 18px;
    line-height: 25px;
    margin-bottom: 35px;
    padding-left: 2em
}

.section-story ol li {
    margin-bottom: 10px;
    list-style: none
}

.section-story ol li:before {
    content: counter(item) ". ";
    color: #e20074;
    counter-increment: item;
    font-weight: bold;
    float: left;
    width: 1.5em;
    margin-left: -2em;
    text-align: right
}

.layout-focus .section-header {
    padding: 20px 0 10px;
    border-top: 1px solid #000
}

.layout-focus table {
    width: 100%
}

.onepager-nav {
    position: relative;
    bottom: -140px
}

.onepager-nav ul {
    margin: 0 auto;
    text-align: center
}

.onepager-nav li {
    display: inline-block;
    margin-right: 1px
}

.onepager-nav a {
    display: block;
    position: relative;
    padding: 0;
    width: 40px;
    height: 40px;
    font-size: 16px;
    text-align: center;
    color: #e20074
}

.onepager-nav a:before {
    content: "ÔÇó";
    text-indent: 0 !important;
    font-size: 48px;
    line-height: 40px;
    color: #fff;
    color: rgba(255, 255, 255, 0.5)
}

.onepager-nav a span {
    display: block;
    height: 40px;
    padding: 10px 20px;
    position: absolute;
    top: -10px;
    left: -10px;
    opacity: 0;
    text-align: center;
    white-space: nowrap;
    color: #e20074;
    background: #fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -ms-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
    -webkit-box-shadow: 0 0 0.4em 0.2em rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 0 0.4em 0.2em rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 0 0 0.4em 0.2em rgba(0, 0, 0, 0.05);
    -o-box-shadow: 0 0 0.4em 0.2em rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0.4em 0.2em rgba(0, 0, 0, 0.05)
}

.onepager-nav a span:after {
    position: absolute;
    top: 100%;
    left: 23px;
    content: "";
    display: block;
    width: 0;
    height: 0;
    border: 7px solid #fff;
    border-color: #fff transparent transparent transparent
}

.onepager-nav a:hover span {
    opacity: 1;
    top: -42px;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out
}

.section-white .onepager-nav a:before {
    color: #e5e5e5
}

.section-white .onepager-nav a span {
    color: #fff;
    background: #e20074
}

.section-white .onepager-nav a span:after {
    border-color: #e20074 transparent transparent transparent
}

.section-gray .onepager-nav a:before {
    color: #d0d0d0
}

.section-gray .onepager-nav a span {
    color: #fff;
    background: #e20074
}

.section-gray .onepager-nav a span:after {
    border-color: #e20074 transparent transparent transparent
}

.section-page-nav {
    background: #b5015c;
    width: 100%
}

.section-page-nav.cloned-page-nav {
    background: #4b4b4b;
    -webkit-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.1);
    -ms-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.1)
}

.section-page-nav .grid {
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

.page-nav {
    width: 100%;
    overflow: hidden;
    text-align: center
}

.page-nav ul {
    float: left;
    width: 100%;
    display: inline-block;
    margin: 0 auto !important
}

.page-nav li {
    float: left;
    display: inline;
    margin: 0 !important
}

.page-nav li a {
    display: block;
    font-size: 14px;
    font-size: .875rem;
    line-height: 24px;
    line-height: 1.5rem;
    padding: 20px 20px;
    padding: 1.25rem 1.25rem;
    color: #fff;
    text-decoration: none;
    -webkit-transition: background 0.3s ease;
    -moz-transition: background 0.3s ease;
    -ms-transition: background 0.3s ease;
    -o-transition: background 0.3s ease;
    transition: background 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    background: #b5015c
}

.cloned-page-nav .page-nav li a {
    background: #4b4b4b
}

.page-nav li a:hover,
.page-nav li a:active {
    text-decoration: none;
    background: #e20074
}

.page-nav li:first-child a {
    border-left: 0
}

.page-nav li.current a {
    background: #e20074
}

@supports (display: -webkit-flex) or (display: flex) {
    .page-nav ul {
        display: -webkit-flex;
        display: flex;
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        -o-justify-content: center;
        justify-content: center
    }
    .page-nav li {
        flex-wrap: -webkit-wrap;
        flex-wrap: wrap
    }
}

.dot-nav {
    display: table;
    margin: 0 auto
}

.dot-nav ul  {
    display: inline-block;
    display: table-row
}

.dot-nav li {
    display: inline-block;
    display: table-cell;
    vertical-align: middle
}

.dot-nav li a {
    display: block;
    color: #d0d0d0;
    text-decoration: none !important;
    border: 0;
    -webkit-transition: color 0.3s ease;
    -moz-transition: color 0.3s ease;
    -ms-transition: color 0.3s ease;
    -o-transition: color 0.3s ease;
    transition: color 0.3s ease
}

.dot-nav li a:hover {
    color: #e20074
}

.dot-nav li.current a {
    color: #000
}

.box-service-overview {
    border-top: 5px solid #e20074;
    background: #fff
}

.box-service-overview .highlight {
    text-transform: uppercase;
    line-height: 2.5rem;
    color: #fff;
    background: #e20074
}

.box-service-overview .product-name {
    margin: 20px
}

.box-group-33 .box-service-overview .product-name {
    min-height: 3rem
}

.box-group-20 .box-service-overview .product-name,
.box-group-25 .box-service-overview .product-name {
    min-height: 5.75rem
}

.box-group-20 .box-service-overview .product-name .service,
.box-group-25 .box-service-overview .product-name .service {
    display: block
}

.box-group-20 .box-service-overview .product-name .conjunction,
.box-group-25 .box-service-overview .product-name .conjunction {
    display: none
}

.box-service-overview .product-name h2 {
    margin: 0
}

.box-service-overview .product-name strong {
    display: block
}

.box-service-overview .price {
    border-top: 1px solid #d0d0d0;
    padding: 20px 0 0;
    margin: 0 20px 20px
}

.box-service-overview .price-regular,
.box-service-overview .price-saving {
    font-size: 16px;
    line-height: 20px
}

.box-service-overview .price-regular,
.box-service-overview .key-information,
.box-service-overview .list-features-tabular,
.box-service-overview .list-features,
.box-service-overview .list-actions {
    margin: 0 20px 20px
}

.box-service-overview .price-and-cta,
.box-service-overview .learn-more-box-bottom {
    margin-top: auto
}

.box-service-overview .price-and-cta p {
    display: block !important
}

.box-service-overview .price-and-cta p:last-child {
    margin: 0
}

.box-service-overview .actions {
    clear: both;
    padding: .625rem 0 0
}

.box-service-overview .button {
    margin: 0 auto
}

.box-group-20 .box-service-overview,
.box-group-25 .box-service-overview,
.box-group-33 .box-service-overview {
    text-align: center
}

.learn-more-box-bottom {
    display: block;
    padding: 15px;
    text-align: center;
    text-transform: uppercase;
    border-top: 1px solid #e5e5e5
}

.rounded {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px
}

.shadow {
    -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    -ms-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1)
}

#section-internet-features-overview .box-item-icon {
    background: url(i/icons/internet-features.png) no-repeat 0 20px;
    background-size: 4050px 35px
}

#section-internet-features-overview .icon-wifi {
    background-position: 0 20px
}

#section-internet-features-overview .icon-safety {
    background-position: -450px 20px
}

#section-internet-features-overview .icon-hotspot {
    background-position: -900px 20px
}

#section-internet-features-overview .icon-stats {
    background-position: -1350px 20px
}

#section-internet-features-overview .icon-tech-support {
    background-position: -1800px 20px
}

#section-internet-features-overview .icon-24-7 {
    background-position: -2250px 20px
}

#section-internet-features-overview .icon-mailbox {
    background-position: -2700px 20px
}

#section-internet-features-overview .icon-web-hosting {
    background-position: -3150px 20px
}

#quick-actions-existing-customers .box-item-icon {
    background: url(i/icons/internet-actions-existing-customers.png) no-repeat 0 20px;
    background-size: 4050px 35px
}

#quick-actions-existing-customers .icon-upgrade-internet {
    background-position: 0 20px
}

#quick-actions-existing-customers .icon-cp {
    background-position: -450px 20px
}

#quick-actions-existing-customers .icon-halo {
    background-position: -900px 20px
}

#quick-actions-existing-customers .icon-move {
    background-position: -1350px 20px
}

#internet-service-types .box-item-icon {
    background: url(i/icons/internet-service-types.png) no-repeat 0 20px;
    background-size: 935px 35px
}

#internet-service-types .icon-ultramax-net {
    background-position: 0 20px
}

#internet-service-types .icon-maxadsl {
    background-position: -450px 20px
}

#internet-service-types .icon-maxnet-mini {
    background-position: -900px 20px
}

#internet-security-features .box-item-icon {
    background: url(i/icons/internet-security.png) no-repeat 0 20px;
    background-size: 2000px 35px
}

#internet-security-features .icon-email-protection {
    background-position: 0 20px
}

#internet-security-features .icon-firewall {
    background-position: -450px 20px
}

#internet-security-features .icon-password-protection {
    background-position: -900px 20px
}

#internet-security-features .icon-mac-id {
    background-position: -1350px 20px
}

#home-wifi-devices .box-item-icon {
    background: url(i/icons/home-network.png) no-repeat 0 20px;
    background-size: 2000px 35px
}

#home-wifi-devices .icon-desktop {
    background-position: 0 20px
}

#home-wifi-devices .icon-laptop {
    background-position: -450px 20px
}

#home-wifi-devices .icon-smartphone {
    background-position: -900px 20px
}

#home-wifi-devices .icon-tablet {
    background-position: -1350px 20px
}

.boxes-max-paketi .box-item-icon {
    background: url(i/icons/max-paketi-magenta.png) no-repeat 0 0;
    background-size: 1350px 35px
}

.section-magenta .boxes-max-paketi .box-item-icon {
    background-image: url(i/icons/max-paketi-white.png)
}

.boxes-max-paketi .icon-max-obitelj {
    background-position: 0 10px
}

.boxes-max-paketi .icon-max-3 {
    background-position: -450px 10px
}

.boxes-max-paketi .icon-max-2 {
    background-position: -900px 10px
}

.boxes-internet-fixed-mobile .icon-fixed-internet {
    background-image: url(i/icons/internet-fixed-globe-magenta.png);
    background-size: 97px 70px !important
}

.boxes-internet-fixed-mobile .icon-mobile-internet {
    background-image: url(i/icons/internet-mobile-globe-magenta.png);
    background-size: 84px 70px !important
}

.section-magenta .boxes-internet-fixed-mobile .icon-fixed-internet {
    background-image: url(i/icons/internet-fixed-globe-white.png)
}

.section-magenta .boxes-internet-fixed-mobile .icon-mobile-internet {
    background-image: url(i/icons/internet-mobile-globe-white.png)
}

.boxes-maxtv-types .box-item-icon {
    background: url(i/icons/maxtv-types-magenta.png) no-repeat 0 20px;
    background-size: 1350px 35px
}

.section-magenta .boxes-maxtv-types .box-item-icon {
    background-image: url(i/icons/maxtv-types-white.png)
}

.boxes-maxtv-types .icon-maxtv {
    background-position: 0 10px
}

.boxes-maxtv-types .icon-maxtv-satelite {
    background-position: -450px 10px
}

.boxes-maxtv-types .icon-maxtv-to-go {
    background-position: -900px 10px
}

.boxes-telefon .box-item-icon {
    background: url(i/icons/fixed-line-magenta.png) no-repeat 0 20px;
    background-size: 1350px 35px
}

.section-magenta .boxes-telefon .box-item-icon {
    background-image: url(i/icons/fixed-line-white.png)
}

.boxes-telefon .icon-fiksna-linija {
    background-position: 0 10px
}

.boxes-telefon .icon-call-redirect {
    background-position: -450px 10px
}

.boxes-telefon .icon-phone-privacy {
    background-position: -900px 10px
}

.box-trust-comforting-tiny li {
    width: 100%;
    text-align: left;
    margin: 0
}

.box-trust-comforting-tiny a,
.box-trust-comforting-tiny span {
    display: block;
    font-size: 14px;
    color: #000;
    padding: 3px 20px 3px 40px;
    text-decoration: none;
    text-transform: uppercase;
    background: url(i/icons/sprite-webshop-features-tiny-magenta.png) no-repeat 6px 4px
}

.box-trust-comforting-tiny a {
    color: #e20074
}

.box-trust-comforting-tiny .icon-dodatni-popusti span,
.box-trust-comforting-tiny .icon-dodatni-popusti a {
    background-position: 6px 4px
}

.box-trust-comforting-tiny .icon-besplatna-dostava span,
.box-trust-comforting-tiny .icon-besplatna-dostava a {
    padding-left: 40px;
    background-position: 7px -46px
}

.box-trust-comforting-tiny .icon-chat span,
.box-trust-comforting-tiny .icon-chat a {
    background-position: 7px -96px
}

.box-trust-comforting-tiny .icon-info a {
    background-position: 6px -146px
}

.box-trust-comforting-tiny .icon-why-ht a {
    background-position: 6px -196px
}

.box-trust-comforting-tiny .icon-otkaz span {
    background-position: 6px -246px
}

.box-trust-comforting-tiny .icon-kartice span {
    padding-left: 35px;
    background-position: 6px -294px
}

.box-trust-comforting-tiny .icon-sigurnost span {
    background-position: 6px -346px
}

.icon-amex {
    background: url(i/icons/amex.png) no-repeat 0 0
}

.icon-mastercard-maestro-visa {
    background: url(i/icons/mastercard-maestro-visa.png) no-repeat 0 0
}

.icon-cash {
    background: url(i/icons/cash.png) no-repeat 0 0
}

.icon-diners {
    background: url(i/icons/diners.png) no-repeat 0 0
}

.logotypes .box-item a {
    display: block;
    height: 110px !important;
    text-indent: -9999px;
    overflow: auto
}

.icon-maxtv-to-go-shadow {
    background: url(i/illustrations/maxtv-to-go-shadow.png) no-repeat 50% 100%
}

.icon-maxtv-sport-shadow {
    background: url(i/illustrations/maxtv-sport-shadow.png) no-repeat 50% 100%
}

.icon-4g-plus-shadow {
    background: url(i/illustrations/4g-plus-shadow.png) no-repeat 70% 100%
}

.icon-deezer-shadow {
    background: url(i/illustrations/deezer-shadow.png) no-repeat 50% 100%
}

.icon-liga-prvaka {
    background: url(i/illustrations/lopta-shadow.png) no-repeat 50% 100%
}

.icon-overview-internet,
.icon-overview-maxtv,
.icon-overview-telefon,
.icon-overview-elektricna-energija {
    background: url(i/icons/sprite-fixed-overview.png) no-repeat 0 20px;
    background-size: 1800px 35px
}

.icon-overview-internet {
    background-position: 0 20px
}

.icon-overview-maxtv {
    background-position: -450px 20px
}

.icon-overview-telefon {
    background-position: -900px 20px
}

.icon-overview-elektricna-energija {
    background-position: -1350px 20px
}

.figure-overview {
    margin: 30px auto;
    max-width: 80%
}

#overview-customer-support .section-header {
    float: none !important
}

.header-over-divider {
    clear: both;
    border-top: 1px solid #d0d0d0;
    margin-top: 60px
}

.box-trust-comforting-tiny ul {
    margin: 10px auto
}

.header-over-divider h1 {
    margin: -.5em 0 .5em !important
}

.header-over-divider h1 span {
    background: #fff;
    padding: 0 .5em
}

.section-gray .header-over-divider h1 span {
    background: #e6e6e6 !important
}

#social-networks-links .box-group {
    border-bottom: 1px solid #d0d0d0;
    margin-bottom: 60px
}

#social-networks-links .box-item,
#social-networks-links .box-item h2 {
    margin-bottom: 0
}

#how-to-shop-links {
    position: relative
}

#how-to-shop-links h1 {
    position: relative
}

#how-to-shop-links h2 {
    font-weight: normal
}

#how-to-shop-links .box-group {
    margin-bottom: 60px
}

.icon-sn-M a,
.icon-sn-M a span,
.icon-sn-L a,
.icon-sn-L a span {
    display: block;
    text-align: center;
    background-position: 50% 0;
    background-repeat: no-repeat;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.icon-sn-M a,
.icon-sn-M a span {
    background-position: 0 0
}

.icon-sn-M a,
.icon-sn-L a {
    margin-top: 0;
    padding-bottom: 0
}

.icon-sn-M a span,
.icon-sn-L a span {
    opacity: 0;
    display: block;
    padding-top: 128px;
    text-indent: -9999px;
    overflow: hidden
}

.icon-sn-M a span {
    padding-top: 48px
}

.box-group-50 .box-group-25 .icon-sn-M {
    float: left;
    width: 25% !important;
    clear: none !important;
    margin: 0 !important
}

.icon-sn-M a:hover span,
.icon-sn-L a:hover span {
    opacity: 1
}

.icon-facebook-L a {
    background-image: url(i/sn/facebook-128-inverted.png)
}

.icon-twitter-L a {
    background-image: url(i/sn/twitter-128-inverted.png)
}

.icon-youtube-L a {
    background-image: url(i/sn/youtube-128-inverted.png)
}

.icon-google-L a {
    background-image: url(i/sn/google-plus-128-inverted.png)
}

.icon-facebook-L a:hover span {
    background-image: url(i/sn/facebook-128-inverted-magenta.png)
}

.icon-twitter-L a:hover span {
    background-image: url(i/sn/twitter-128-inverted-magenta.png)
}

.icon-youtube-L a:hover span {
    background-image: url(i/sn/youtube-128-inverted-magenta.png)
}

.icon-google-L a:hover span {
    background-image: url(i/sn/google-plus-128-inverted-magenta.png)
}

.icon-facebook-M a {
    background-image: url(i/sn/facebook-64-inverted.png)
}

.icon-twitter-M a {
    background-image: url(i/sn/twitter-64-inverted.png)
}

.icon-youtube-M a {
    background-image: url(i/sn/youtube-64-inverted.png)
}

.icon-google-M a {
    background-image: url(i/sn/google-plus-64-inverted.png)
}

.icon-facebook-M a:hover span {
    background-image: url(i/sn/facebook-64-inverted-magenta.png)
}

.icon-twitter-M a:hover span {
    background-image: url(i/sn/twitter-64-inverted-magenta.png)
}

.icon-youtube-M a:hover span {
    background-image: url(i/sn/youtube-64-inverted-magenta.png)
}

.icon-google-M a:hover span {
    background-image: url(i/sn/google-plus-64-inverted-magenta.png)
}

#social-networks-tiny {
    margin-top: 30px
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    .icon-sn-L a,
    .icon-sn-L a span {
        background-size: 128px 128px
    }
    .icon-sn-M a,
    .icon-sn-M a span {
        background-size: 64px 64px
    }
    .icon-facebook-L a {
        background-image: url(i/sn/facebook-256-inverted.png)
    }
    .icon-twitter-L a {
        background-image: url(i/sn/twitter-256-inverted.png)
    }
    .icon-youtube-L a {
        background-image: url(i/sn/youtube-256-inverted.png)
    }
    .icon-google-L a {
        background-image: url(i/sn/google-plus-256-inverted.png)
    }
    .icon-facebook-L a:hover span {
        background-image: url(i/sn/facebook-256-inverted-magenta.png)
    }
    .icon-twitter-L a:hover span {
        background-image: url(i/sn/twitter-256-inverted-magenta.png)
    }
    .icon-youtube-L a:hover span {
        background-image: url(i/sn/youtube-256-inverted-magenta.png)
    }
    .icon-google-L a:hover span {
        background-image: url(i/sn/google-plus-256-inverted-magenta.png)
    }
    .icon-facebook-M a {
        background-image: url(i/sn/facebook-128-inverted.png)
    }
    .icon-twitter-M a {
        background-image: url(i/sn/twitter-128-inverted.png)
    }
    .icon-youtube-M a {
        background-image: url(i/sn/youtube-128-inverted.png)
    }
    .icon-google-M a {
        background-image: url(i/sn/google-plus-128-inverted.png)
    }
    .icon-facebook-M a:hover span {
        background-image: url(i/sn/facebook-128-inverted-magenta.png)
    }
    .icon-twitter-M a:hover span {
        background-image: url(i/sn/twitter-128-inverted-magenta.png)
    }
    .icon-youtube-M a:hover span {
        background-image: url(i/sn/youtube-128-inverted-magenta.png)
    }
    .icon-google-M a:hover span {
        background-image: url(i/sn/google-plus-128-inverted-magenta.png)
    }
    .boxes-internet-fixed-mobile .icon-fixed-internet {
        background-image: url(i/icons/internet-fixed-globe-magenta-@2x.png);
        background-size: 97px 70px !important
    }
    .boxes-internet-fixed-mobile .icon-mobile-internet {
        background-image: url(i/icons/internet-mobile-globe-magenta-@2x.png);
        background-size: 84px 70px !important
    }
    .section-magenta .boxes-internet-fixed-mobile .icon-fixed-internet {
        background-image: url(i/icons/internet-fixed-globe-white-@2x.png)
    }
    .section-magenta .boxes-internet-fixed-mobile .icon-mobile-internet {
        background-image: url(i/icons/internet-mobile-globe-white-@2x.png)
    }
    .icon-maxtv-to-go-shadow {
        background-image: url(i/illustrations/maxtv-to-go-shadow-@2x.png);
        background-size: 269px 92px
    }
    .icon-maxtv-sport-shadow {
        background-image: url(i/illustrations/maxtv-sport-shadow-@2x.png);
        background-size: 300px 103px
    }
    .icon-4g-plus-shadow {
        background-image: url(i/illustrations/4g-plus-shadow-@2x.png);
        background-size: 117px 109px
    }
    .icon-deezer-shadow {
        background-image: url(i/illustrations/deezer-shadow-@2x.png);
        background-size: 184px 92px
    }
    .icon-liga-prvaka {
        background-image: url(i/illustrations/lopta-shadow-@2x.png);
        background-size: 92px 109px
    }
}

#section-internet-features-overview p {
    font-size: 15px
}

.message+.section-header {
    padding-top: 20px !important
}

.section+#max-paketi-promo .grid,
.section+#dodatni-kanali .grid {
    position: relative;
    padding-top: 60px
}

.section+#max-paketi-promo .grid:before,
.section+#dodatni-kanali .grid:before {
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -20px;
    content: ' ';
    width: 0;
    height: 0;
    border: 20px solid #fff;
    border-color: #fff transparent transparent transparent
}

.section-magenta+#max-paketi-promo .grid:before {
    border: 20px solid #e20074;
    border-color: #e20074 transparent transparent transparent
}

.section-gray+#max-paketi-promo .grid:before {
    border: 20px solid #e6e6e6;
    border-color: #e6e6e6 transparent transparent transparent
}

.section-gray-dark+#max-paketi-promo .grid:before {
    border: 20px solid #e5e5e5;
    border-color: #e5e5e5 transparent transparent transparent
}

.section-gray-verydark+#max-paketi-promo .grid:before {
    border: 20px solid #333333;
    border-color: #333333 transparent transparent transparent
}

.section-content ul,
.section-content ol {
    margin-bottom: 30px
}

.section-content a {
    font-weight: bold
}

#section-self-care .grid {
    padding-bottom: 300px;
    background: url(/img/self-care/moj-telekom-devices-mini.png) no-repeat 50% 100%;
    background-size: 300px 300px
}

#section-customer-support .grid {
    padding-bottom: 300px;
    background: url(/img/customer-support/customer-support.jpg) no-repeat 50% 100%;
    background-size: 500px 320px
}

#section-self-care .list-actions {
    margin: 0
}

#section-self-care .list-actions .button {
    width: auto
}

.packages-overview {
    margin-bottom: 20px
}

.packages-overview table {
    width: 100%;
    table-layout: fixed
}

.section-white .packages-overview {
    padding: 10px;
    background: #fff;
    border: 1px solid #d0d0d0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.05)
}

.subsection-content .packages-overview {
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    padding: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    margin-top: 1.5em;
    margin-bottom: 0;
    background: none
}

.subsection-content .packages-overview th,
.subsection-content .packages-overview td {
    background: none
}

.packages-overview>ul {
    overflow: auto;
    border-right: 1px solid #e5e5e5
}

.packages-overview .package {
    list-style: none;
    float: left;
    border-left: 1px solid #e5e5e5;
    padding: 0 10px;
    text-align: center
}

.packages-overview .product-images {
    padding: 15px
}

.packages-overview img {
    width: 100%;
    max-width: 180px
}

.packages-overview h3 {
    margin: 0
}

.packages-overview-1-items table {
    min-width: auto;
    width: auto;
    margin-left: auto;
    margin-right: auto
}

.packages-overview-2-items {
    margin-left: auto;
    margin-right: auto
}

.packages-overview-2-items .package,
.packages-overview-2-items td {
    width: 50%
}

.packages-overview-3-items .package,
.packages-overview-3-items td {
    width: 33.33333333%
}

.packages-overview-4-items .package,
.packages-overview-4-items td {
    width: 25%
}

.packages-overview-5-items .package,
.packages-overview-5-items td {
    width: 20%
}

.packages-overview-6-items .package,
.packages-overview-6-items td {
    width: 16.66666666%
}

.packages-overview .cta {
    padding: 10px 10px 0;
    text-align: center
}

.packages-overview .cta .button {
    max-width: 100%;
    margin: 0 auto 10px
}

.promo-offer-overview .cta .button {
    width: 120px !important
}

.packages-overview .cta a {
    display: inline-block;
    margin-bottom: 10px
}

.packages-overview table {
    border-bottom: 0
}

.packages-overview table th,
.packages-overview table td {
    vertical-align: top;
    padding: 10px 20px;
    text-align: center;
    border-left: 10px solid #fff;
    background: #fff
}

.packages-overview.left table th,
.packages-overview.left table td {
    text-align: left
}

.packages-overview .highlights td {
    background: none
}

.packages-overview td.highlight {
    text-transform: uppercase;
    color: #fff;
    background: #e20074
}

.packages-overview table li {
    list-style: none
}

.section-white .packages-overview table th,
.section-white .packages-overview table td {
    border-left: 1px solid #e5e5e5
}

.section-gray .packages-overview table th,
.section-gray .packages-overview table td {
    border-left: 10px solid #e6e6e6
}

.section-gray-dark .packages-overview table th,
.section-gray-dark .packages-overview table td {
    border-left: 10px solid #e5e5e5
}

.section-gray-verydark .packages-overview table th,
.section-gray-verydark .packages-overview table td {
    border-left: 10px solid #333333
}

.packages-overview table th,
.packages-overview table td {
    border-top: 0 !important;
    border-bottom: 0 !important
}

.packages-overview table th:first-child,
.packages-overview table td:first-child {
    border-left: 0
}

.packages-overview .product-names th {
    padding-top: 20px !important
}

.packages-overview table th {
    border-bottom: 1px solid #e5e5e5
}

.packages-overview h2 strong {
    display: block;
    font-size: 32px;
    line-height: 40px
}

@media only screen and (max-width: 599px) {
    .packages-overview-2-items table {
        width: 150%
    }
    .packages-overview-3-items table {
        width: 250%
    }
    .packages-overview-4-items table {
        width: 350%
    }
    .packages-overview-5-items table {
        width: 450%
    }
    .packages-overview-6-items table {
        width: 550%
    }
    .packages-overview-7-items table {
        width: 650%
    }
    .packages-overview-8-items table {
        width: 750%
    }
    .packages-overview-9-items table {
        width: 850%
    }
    .packages-overview-2-items,
    .packages-overview-3-items,
    .packages-overview-4-items,
    .packages-overview-5-items {
        overflow-x: scroll
    }
}

.hero {
    position: relative
}

.hero img {
    float: left
}

.hero .box-purple {
    clear: both;
    width: 100%
}

.box-purple {
    padding: 20px;
    color: #fff;
    background: #e20074
}

.box-purple h1 {
    font-size: 32px;
    line-height: 40px;
    font-size: 2rem;
    line-height: 2.5rem;
    margin: 0
}

.box-purple p {
    font-size: 18px
}

.box-purple h1,
.box-purple p,
.box-purple div {
    position: relative;
    z-index: 100
}

.eye-catcher {
    display: block;
    font: 18px/20px 'Headline', Arial, sans-serif;
    text-transform: uppercase;
    width: 100%;
    padding: 10px 15px
}

.eye-catcher strong {
    font-family: Tele-groteskFet
}

.eye-catcher-yellow {
    color: #000;
    background: #fdd167
}

.eye-catcher-orange {
    color: #000;
    background: #eda95a
}

.eye-catcher-violet {
    color: #fff;
    background: #9f4c97
}

.eye-catcher-lightblue {
    color: #fff;
    background: #64b9e4
}

.eye-catcher-darkblue {
    color: #fff;
    background: #427bab
}

.eye-catcher-petroleum {
    color: #fff;
    background: #408f9a
}

.eye-catcher-green {
    color: #fff;
    background: #babd5a
}

.box-max-package .eye-catcher {
    padding: 10px 20px;
    margin-bottom: 20px
}

.box-product-basic {
    max-width: 100%
}

.box-product-basic .product-image img {
    max-width: 100%
}

.loader {
    text-align: center
}

.loader img {
    margin: 0.75em 0
}

.loader-full-container {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 10000;
    text-align: center;
    display: none
}

.loader-full-container .lightbg {
    width: 100%;
    height: 100%;
    z-index: 10001;
    opacity: 0.85;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
    filter: alpha(opacity=85);
    -moz-opacity: .85;
    -khtml-opacity: 0.85;
    background-color: #fff
}

.loader-full-container .loader-content {
    position: absolute;
    top: 40%;
    left: 50%;
    margin: 0 0 0 -10em;
    width: 20em;
    z-index: 10002;
    text-align: center
}

.loader-full-container .loader-content h3 {
    font: normal 1.625em/1 'Tele-GroteskUlt';
    margin: 0 0 0.25em;
    text-transform: none
}

.loader-full-container .loader-content p {
    font: normal 1.25em/1 'Tele-Grotesk';
    margin: 0 0 1em
}

.product-horizontal {
    clear: both;
    margin-bottom: 2.5rem;
    background: #fff
}

.promo-offer-stacked .product-horizontal {
    margin: 40px 0;
    margin: 2.5rem 0
}

.promo-offer-stacked .product-horizontal:first-child {
    margin-top: 0
}

.product-horizontal .product-image,
.product-horizontal .product-description {
    padding: 30px;
    padding: 1.875rem
}

.product-horizontal .product-image a {
    display: block;
    margin: 0 auto;
    text-align: center
}

.product-description .price-regular {
    clear: both
}

.product-description .actions {
    margin-top: 1.5em
}

.availability-conditions {
    padding-top: .75em
}

.availability-conditions h3 {
    margin: 0
}

.availability-list li {
    list-style: none;
    margin-left: 1em
}

.availability-list li:before {
    content: 'ÔÇô';
    float: left;
    margin-left: -1em
}

.availability-list a {
    text-decoration: underline
}

.availability-list a:hover,
.availability-list a:focus {
    text-decoration: none
}

.promo-offer-overview table {
    border-top: 5px solid #e20074
}

.promo-offer-overview table tr:first-child td {
    padding-top: 40px
}

.promo-offer-overview table tr:last-child td {
    padding-bottom: 30px
}

.promo-offer-overview h3.product-name {
    text-transform: none;
    font-size: 24px;
    line-height: 30px
}

.packages-overview table th:first-child,
.packages-overview table td:first-child {
    border-left: 0
}

.packages-overview .product-names th {
    padding-top: 20px !important
}

.packages-overview .product-names h1 {
    margin-bottom: 0
}

.prices-promo .no-promo {
    vertical-align: middle;
    color: #999
}

.prices-regular h3 {
    margin-bottom: 12px;
    margin-bottom: .75rem
}

.packages-overview table th {
    border-bottom: 1px solid #e5e5e5
}

.packages-overview h2 strong {
    display: block;
    font-size: 32px;
    line-height: 40px
}

.offer-conditions {
    font-size: 14px;
    margin: 0
}

.availability td {
    border-top: 1px solid #e5e5e5
}

.availability-cta td {
    border-top: 5px solid #e20074;
    padding: 20px 0 60px !important
}

.availability-cta td:before {
    display: block;
    position: relative;
    top: -20px;
    margin: 0 auto;
    content: ' ';
    width: 0;
    height: 0;
    border: 20px solid #e20074;
    border-color: #e20074 transparent transparent transparent
}

tr.question td {
    border-top: 10px solid #e5e5e5;
    border-bottom: 10px solid #e5e5e5;
    padding-top: 20px !important
}

.input-phone {
    background-image: url(i/icons/phone.png);
    background-repeat: no-repeat;
    background-position: 8px 50%;
    background-size: 15px 20px;
    padding-left: 30px
}

.html-modal {
    background: #fff
}

#modal-placeholder {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    min-height: 100%;
    z-index: 9
}

.body-modal #modal-placeholder {
    position: static;
    min-height: 0
}

#modal-placeholder .close-link {
    position: fixed;
    top: 0.825em;
    right: 1em;
    width: 60px;
    height: 60px;
    background: url(i/icons/close-new.png) no-repeat 50% 50%;
    background-size: 34px 34px;
    text-indent: -9999px;
    overflow: hidden;
    z-index: 9999
}

#modal-placeholder .close-link:hover,
#modal-placeholder .close-link:focus {
    -webkit-filter: grayscale(1);
    -moz-filter: grayscale(1);
    -o-filter: grayscale(1);
    filter: grayscale(1)
}

#modal-placeholder #backToMain {
    position: absolute;
    top: 2em;
    left: 0;
    text-decoration: underline
}

#modal-content {
    margin: 0 auto
}

.detect-customer-type-modal .customer-type {
    padding: 15px 0
}

.calendar-header {
    position: relative;
    padding: 10px 0;
    margin-bottom: 10px;
    text-align: center;
    border-top: 1px solid #6c6c6c;
    border-bottom: 1px solid #e5e5e5
}

.calendar-header h2 {
    text-transform: uppercase;
    margin: 0
}

.calendar-header p {
    margin-bottom: 0
}

.calendar-header .prev-next-nav a {
    display: block;
    width: 100%;
    height: 100%;
    line-height: 60px;
    padding: 5px
}

.calendar-header .prev {
    position: absolute;
    width: 80px;
    left: 0;
    top: 0;
    bottom: 0
}

.calendar-header .next {
    position: absolute;
    width: 80px;
    right: 0;
    top: 0;
    bottom: 0
}

.calendar a {
    display: block
}

.calendar table th,
.calendar table td {
    padding: 10px 5px
}

.calendar table .monthday {
    padding: 0
}

.calendar table .monthday a,
.calendar table .monthday span {
    display: block;
    padding: 10px 0
}

.calendar table .monthday span {
    color: #d0d0d0
}

.calendar-month td {
    text-align: center;
    width: 14.2857%
}

.calendar-month th,
.calendar-month td {
    border-bottom: 1px solid #fff
}

.calendar-month .today a {
    background: #e5e5e5
}

.calendar-month .active a {
    color: #fff;
    background: #e20074
}

.calendar-month td a:hover {
    color: #fff;
    background: #6c6c6c
}

.calendar-day th,
.calendar-day td {
    border-bottom: 1px solid #e5e5e5
}

.calendar-day th {
    width: 50px
}

.calendar-day td {
    padding-right: 50px;
    background: url(i/icons/locks.png) no-repeat 200% 0;
    background-size: 9px 104px
}

.calendar-day .available td a {
    font-weight: bold;
    text-transform: uppercase;
    color: #000
}

.calendar-day .available td a:hover {
    color: #e20074 !important
}

.calendar-day .taken th {
    color: #d0d0d0
}

.calendar-day .taken td {
    color: #d0d0d0;
    background-position: 95% -31px
}

.calendar-day .selected td {
    color: #000;
    background-position: 95% 14px
}

.tabs ul {
    width: 100%;
    border-bottom: 1px solid #d0d0d0
}

.tabs li.current {
    font-weight: bold
}

.tabs li {
    float: left
}

.tabs li a {
    display: block;
    padding: 1em
}

.tabs-horizontal {
    clear: both;
    margin-top: 40px
}

.tabs-horizontal ul {
    border: 0;
    border-bottom: 1px solid #d0d0d0;
    margin: 0
}

.tabs-horizontal ul:after {
    content: '';
    display: table;
    clear: both
}

.tabs-horizontal li {
    float: left;
    text-align: center;
    vertical-align: center;
    padding-left: 3px;
    overflow: hidden
}

.tabs-horizontal li:first-child {
    padding-left: 0
}

.tabs-horizontal li a {
    display: block;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex: 1 1 0%;
    -moz-flex: 1 1 0%;
    -ms-flex: 1 1 0%;
    -o-flex: 1 1 0%;
    flex: 1 1 0%;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column;
    position: relative;
    width: 100%;
    margin-bottom: -1px;
    color: #000;
    background: #e6e6e6;
    border: 1px solid #d0d0d0;
    border-bottom: 0;
    font-size: 15px;
    font-size: .9375rem;
    text-transform: uppercase;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    -ms-border-radius: 4px 4px 0 0;
    -o-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-box-shadow: inset 0px -10px 5px -5px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0px -10px 5px -5px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: inset 0px -10px 5px -5px rgba(0, 0, 0, 0.05);
    -o-box-shadow: inset 0px -10px 5px -5px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0px -10px 5px -5px rgba(0, 0, 0, 0.05)
}

.tabs-horizontal li a:hover {
    color: #e20074;
    background: #fff
}

.tabs-horizontal li.current {
    overflow: visible !important;
    font-weight: normal
}

.tabs-horizontal li.current a {
    color: #000;
    background: #fff;
    -webkit-box-shadow: inset 0px -4px 0px 0px #fff;
    -moz-box-shadow: inset 0px -4px 0px 0px #fff;
    -ms-box-shadow: inset 0px -4px 0px 0px #fff;
    -o-box-shadow: inset 0px -4px 0px 0px #fff;
    box-shadow: inset 0px -4px 0px 0px #fff
}

.tabs-horizontal li a span {
    display: block;
    margin-bottom: .75em
}

.tabs-horizontal li a img {
    display: block;
    margin-top: auto;
    padding-top: .75em
}

.tabs-horizontal.tabs-horizontal-2 li {
    width: 50%
}

.tabs-horizontal.tabs-horizontal-3 li {
    width: 33.33333333%
}

.tabs-horizontal.tabs-horizontal-4 li {
    width: 25%
}

.tabs-horizontal.tabs-horizontal-5 li {
    width: 20%
}

.tabs-horizontal.tabs-horizontal-6 li {
    width: 16.666666667%
}

.tabs-horizontal.tabs-horizontal-7 li {
    width: 14.285714286%
}

.tabs-horizontal.tabs-horizontal-8 li {
    width: 12.5%
}

@media only screen and (max-width: 599px) {
    .tabs-horizontal li {
        float: none;
        width: 100% !important;
        padding: 0;
        clear: both
    }
}

@media only screen and (min-width: 600px) {
    .tabs-horizontal ul {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        height: 100%
    }
    .tabs-horizontal li {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex: 1 1 0%;
        -moz-flex: 1 1 0%;
        -ms-flex: 1 1 0%;
        -o-flex: 1 1 0%;
        flex: 1 1 0%;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column
    }
}

.tabs-vertical ul {
    max-width: 320px;
    border-right: 1px solid #d0d0d0
}

.tabs-vertical li {
    float: none
}

.tabs-vertical li a {
    border-top: 1px solid #d0d0d0
}

.tabs-group-pricing .tabs-horizontal a {
    padding: 1.5em 1em
}

.tabs-group-pricing img {
    display: block;
    margin: 1em auto .5em;
    width: 114px
}

.tab-content-maxtv-pricing {
    display: flex;
    clear: both;
    background: #fff;
    padding: 20px;
    margin: 0 0 2px;
    border: 0;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    -ms-border-radius: 0 0 4px 4px;
    -o-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px
}

.tab-content-maxtv-pricing:after {
    content: '';
    display: table;
    clear: both
}

.tab-content-maxtv-pricing .tab-content-price {
    float: right !important;
    padding: 10px;
    border: 1px solid #e20074;
    text-align: center
}

.tab-content-maxtv-pricing .tab-content-config {
    float: left !important;
    border: 1px solid #d0d0d0;
    border-right: 0
}

.tab-content-maxtv-pricing .price-primary {
    padding: 1.5em 0 2.4em;
    text-align: center
}

.tab-content-maxtv-pricing .price-primary:after {
    content: '';
    display: table;
    clear: both
}

.tab-content-maxtv-pricing .intro-option {
    padding: 20px
}

.tab-content-maxtv-pricing .price-promo {
    clear: both;
    max-height: 300px;
    opacity: 1;
    margin: 0;
    padding: 1.05em 0 .75em;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease
}

.tab-content-maxtv-pricing .price-promo.hidden-max-height {
    max-height: 0;
    position: relative;
    margin-top: -2em;
    opacity: 0
}

.tab-content-maxtv-pricing .price-installation {
    border-top: 1px solid #d0d0d0;
    padding: 1.05em 0 1.5em
}

.tab-content-maxtv-pricing .contract-duration-basic,
.tab-content-maxtv-pricing .contract-duration,
.tab-content-maxtv-pricing .intro-option,
.tab-content-maxtv-pricing .installation-option,
.tab-content-maxtv-pricing .check-option,
.tab-content-maxtv-pricing .antenski-sustav {
    border-top: 1px solid #d0d0d0;
    float: left;
    width: 100%;
    padding: 20px;
    position: relative
}

.tab-content-maxtv-pricing .contract-duration-basic,
.tab-content-maxtv-pricing .contract-duration,
.tab-content-maxtv-pricing .installation-option,
.tab-content-maxtv-pricing .check-option {
    padding-left: 100px
}

.tab-content-maxtv-pricing .contract-duration-basic {
    border-top: 0
}

.tab-content-maxtv-pricing .installation-options h3 {
    margin-bottom: 0
}

.tab-content-maxtv-pricing .advanced-options {
    border: 0;
    background: none;
    margin-bottom: 0;
    padding-bottom: 0
}

.tab-content-maxtv-pricing .field {
    clear: both;
    padding: 0
}

.tab-content-maxtv-pricing .inline-field {
    float: left !important;
    padding: 0 !important;
    margin-right: 15px
}

.tab-content-maxtv-pricing .field select {
    margin: 10px 0;
    padding: 8px 16px
}

.tab-content-maxtv-pricing .buttons {
    clear: both;
    padding-top: 30px
}

.tab-content-maxtv-pricing .buttons p {
    clear: both;
    margin-top: .75em
}

.tab-content-maxtv-pricing .contract-duration-basic:before,
.tab-content-maxtv-pricing .contract-duration:before,
.tab-content-maxtv-pricing .installation-option:before,
.tab-content-maxtv-pricing .check-option:before {
    display: block;
    font-family: 'Headline-Ult';
    color: #c5c5c5;
    font-size: 78px;
    position: absolute;
    top: 40px;
    left: 37px
}

.tab-content-maxtv-pricing .contract-duration-basic:before {
    content: "1";
    left: 42px
}

.tab-content-maxtv-pricing .contract-duration:before {
    content: "2"
}

.tab-content-maxtv-pricing .installation-option:before {
    content: "3"
}

.tab-content-maxtv-pricing .check-option:before {
    content: "4"
}

@media only screen and (max-width: 768px) {
    .tab-content-maxtv-pricing {
        display: block
    }
    .tab-content-maxtv-pricing .tab-content-price,
    .tab-content-maxtv-pricing .tab-content-config {
        float: none !important;
        width: 100%
    }
    .tab-content-maxtv-pricing .tab-content-config {
        border: 0
    }
}

@media only screen and (min-width: 650px) {
    .tab-content-maxtv-pricing .tab-content-price {
        float: right;
        width: 38%;
        padding: 10px 20px 10px 0
    }
    .tab-content-maxtv-pricing .tab-content-config {
        float: left;
        width: 62%;
        border-left: 1px solid #d0d0d0
    }
    .tab-content-maxtv-pricing .intro-option {
        border-top: 0
    }
    .tab-content-maxtv-pricing .installation-option h3 {
        float: left
    }
    .tab-content-maxtv-pricing .installation-option .help-text {
        float: right
    }
}

@media only screen and (min-width: 800px) {
    .tab-content-maxtv-pricing .tab-content-price {
        float: right;
        width: 38%;
        padding: 20px
    }
}

.tabs-standalone-wrapper {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 0 4px #e6e6e6;
    -moz-box-shadow: 0 0 0 4px #e6e6e6;
    -ms-box-shadow: 0 0 0 4px #e6e6e6;
    -o-box-shadow: 0 0 0 4px #e6e6e6;
    box-shadow: 0 0 0 4px #e6e6e6
}

.tabs-standalone-wrapper .tabs {
    background: #e6e6e6
}

.maxtv-to-go-prices {
    float: left;
    width: 75%
}

.maxtv-to-go-prices .group-radio li {
    float: left;
    min-width: 33.33333333%;
    text-align: center;
    border-left: 1px solid #d0d0d0
}

.maxtv-to-go-prices .group-radio li:first-child {
    border: 0
}

.maxtv-to-go-prices .group-radio .wrapper-radio {
    display: block;
    width: 100%;
    clear: both;
    padding: .75em
}

.maxtv-to-go-prices .group-radio .wrapper-radio .input-radio {
    float: none;
    margin: 0 !important
}

@media only screen and (min-width: 1220px) {
    .maxtv-iptv-3d-header {
        position: relative;
        height: 0;
        padding-top: 33.33333333%;
        padding-top: 600px;
        margin-bottom: 240px
    }
    .maxtv-iptv-3d-header .ambient-image {
        position: absolute;
        top: 0;
        width: 100%;
        height: 100%
    }
    .maxtv-iptv-3d-header .text-box {
        position: absolute;
        left: 50%;
        bottom: 160px;
        width: 480px;
        margin-left: -360px
    }
    .maxtv-iptv-3d-header .button {
        float: left;
        margin-right: 20px;
        -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
        -ms-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
        -o-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1)
    }
    .maxtv-iptv-3d-header .button:hover {
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        -ms-box-shadow: none;
        -o-box-shadow: none;
        box-shadow: none
    }
    .maxtv-iptv-3d-header .device-image {
        position: absolute;
        bottom: -200px;
        left: 50%;
        margin-left: -450px;
        width: 900px
    }
}

@media only screen and (min-width: 1220px) {
    .maxtv-sat-3d-header {
        position: relative;
        height: 0;
        padding-top: 33.33333333%;
        padding-top: 600px;
        margin-bottom: 340px
    }
    .maxtv-sat-3d-header .ambient-image {
        position: absolute;
        top: 0;
        width: 100%;
        height: 100%;
        margin: 0 auto
    }
    .maxtv-sat-3d-header .text-box {
        position: absolute;
        left: 50%;
        bottom: 120px;
        width: 480px;
        margin-left: -380px
    }
    .maxtv-sat-3d-header .button {
        float: left;
        margin-right: 20px;
        -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
        -ms-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
        -o-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1)
    }
    .maxtv-sat-3d-header .button:hover {
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        -ms-box-shadow: none;
        -o-box-shadow: none;
        box-shadow: none
    }
    .maxtv-sat-3d-header .device-image {
        position: absolute;
        bottom: -320px;
        left: 50%;
        margin-left: -450px;
        width: 900px
    }
}

.shortcut-nav li a {
    border-bottom: 1px solid #1063ad
}

.shortcut-nav li a:hover {
    border-bottom-color: #fff
}

.section-gray .shortcut-nav li a:hover {
    border-bottom-color: #e6e6e6
}

.section-gray-dark .shortcut-nav li a:hover {
    border-bottom-color: #e5e5e5
}

.section-gray-verydark .shortcut-nav li a:hover {
    border-bottom-color: #333333
}

.tabs-tags {
    font-size: 14px
}

.tabs-tags:after {
    content: '';
    display: table;
    clear: both
}

.tabs-tags ul {
    float: left;
    width: 100%;
    border-bottom: 0;
    text-align: center;
    margin-bottom: 3em
}

.tabs-tags ul li {
    float: none;
    display: inline-block;
    margin: 0 5px
}

.tabs-tags ul a {
    float: left;
    padding: .575em 1em;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #000;
    background: #eee;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px
}

.tabs-tags ul a:hover {
    color: #fff;
    background: #e20074;
    text-decoration: none
}

.tabs-tags ul .current a {
    color: #fff;
    background: #000
}

.tabs-tags ul .form-inline .input-text {
    float: left;
    width: 150px !important
}

.tabs-tags ul .form-inline .button {
    float: right;
    min-width: 0;
    line-height: 1.25em !important;
    text-shadow: none
}

.tabs-tags ul .form-inline .button:hover {
    text-shadow: none;
    border-color: #e20074 !important
}

.tabs-tags ul .current .form-inline .button {
    border-color: #000
}

.tabs-tags ul .current .form-inline .button:hover {
    background: #e20074;
    border-color: #e20074 !important
}

.videoteque-shelf .section-header {
    position: relative
}

.videoteque-shelf .section-header .jcarousel-prev,
.videoteque-shelf .section-header .jcarousel-next {
    top: -12px
}

@media only screen and (min-width: 600px) {
    .videoteque-shelf .section-header .jcarousel-prev,
    .videoteque-shelf .section-header .jcarousel-next {
        top: -6px
    }
}

.videoteque-shelf .section-header .jcarousel-prev {
    right: 35px
}

@media only screen and (min-width: 600px) {
    .videoteque-shelf .section-header .jcarousel-prev {
        right: auto;
        left: 0
    }
}

.videoteque-shelf .section-header .jcarousel-next {
    right: 0
}

@media only screen and (min-width: 1100px) {
    .videoteque-shelf .section-header .jcarousel-prev {
        top: 130px;
        left: -50px
    }
    .videoteque-shelf .section-header .jcarousel-next {
        top: 130px;
        right: -50px
    }
}

.videoteque-shelf .list-movie-covers {
    float: left;
    clear: both;
    width: 100%;
    position: relative;
    overflow: hidden;
    margin-bottom: 24px;
    margin-bottom: 1.5rem
}

.videoteque-shelf .covers li.the-cover {
    list-style: none;
    float: left;
    display: inline;
    margin: 0
}

.videoteque-shelf .covers li.the-cover a {
    display: block;
    text-align: center;
    text-decoration: none;
    width: 120px;
    padding: 0 10px;
    color: #000
}

.videoteque-shelf .covers li.the-cover a img {
    width: 100%;
    height: 145px;
    -webkit-box-reflect: below 0 -webkit-gradient(linear, left top, left bottom, left, color-stop(0.8, transparent), right)
}

.videoteque-shelf .covers li.the-cover a strong {
    display: block;
    width: 100%;
    height: 40px;
    margin: .75em 0;
    padding: 0 2px;
    overflow: hidden
}

.videoteque-shelf .covers li.the-cover a .genre {
    display: none !important
}

.videoteque-shelf .covers li.the-cover a:hover {
    color: #e20074
}

.videoteque-shelf.videoteque-shelf-full-width {
    padding: 40px 0px;
    padding: 2.5rem 0rem
}

.videoteque-shelf.videoteque-shelf-full-width .section-header {
    padding: 0 1em
}

.videoteque-shelf.videoteque-shelf-full-width li.the-cover {
    float: left;
    width: 33.33333333%
}

.videoteque-shelf.videoteque-shelf-full-width li.the-cover:nth-child(3n+1) {
    clear: both
}

.videoteque-shelf.videoteque-shelf-full-width li.the-cover a {
    width: 100%
}

.videoteque-shelf.videoteque-shelf-full-width li.the-cover a .figure {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 145%;
    overflow: hidden
}

.videoteque-shelf.videoteque-shelf-full-width li.the-cover a img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%
}

@media only screen and (min-width: 600px) and (max-width: 999px) {
    .videoteque-shelf.videoteque-shelf-full-width li.the-cover {
        float: left;
        width: 25%
    }
    .videoteque-shelf.videoteque-shelf-full-width li.the-cover:nth-child(3n+1) {
        clear: none
    }
    .videoteque-shelf.videoteque-shelf-full-width li.the-cover:nth-child(4n+1) {
        clear: both
    }
}

@media only screen and (min-width: 1000px) {
    .videoteque-shelf.videoteque-shelf-full-width li.the-cover {
        float: left;
        width: 14.2%
    }
    .videoteque-shelf.videoteque-shelf-full-width li.the-cover:nth-child(3n+1) {
        clear: none
    }
    .videoteque-shelf.videoteque-shelf-full-width li.the-cover:nth-child(7n+1) {
        clear: both
    }
    .videoteque-shelf.videoteque-shelf-full-width li.the-cover a strong {
        margin: 1.5em 0
    }
}

#product-gallery .section-header {
    text-align: center;
    position: relative
}

#product-gallery .section-header h1 {
    margin: 0
}

#product-gallery .section-header .jcarousel-prev,
#product-gallery .section-header .jcarousel-next {
    top: 0
}

@media only screen and (min-width: 600px) {
    #product-gallery .section-header .jcarousel-prev,
    #product-gallery .section-header .jcarousel-next {
        top: -3px
    }
}

#product-gallery .section-header .jcarousel-prev {
    right: 35px
}

@media only screen and (min-width: 600px) {
    #product-gallery .section-header .jcarousel-prev {
        right: auto;
        left: 0
    }
}

#product-gallery .section-header .jcarousel-next {
    right: 0;
    background-position: -35px 0
}

#product-gallery .section-header .jcarousel-prev.inactive,
#product-gallery .section-header .jcarousel-next.inactive {
    opacity: 0;
    top: -9999px
}

.wrapper-video {
    position: relative;
    height: 0;
    padding-top: 56.25%;
    margin-bottom: 24px;
    margin-bottom: 1.5rem
}

.wrapper-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#device-page #product-description a:not(.button),
#device-page .review-tools a {
    color: #e20074;
    text-decoration: none
}

#device-page .price-best-offer,
#device-page .price-no-contract {
    margin-top: 24px;
    padding: 20px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    border: 1px solid #d0d0d0
}

#device-page .view-360 a {
    color: #7c7c7c;
    font-weight: bold;
    font-size: 16px;
    padding: 0 .5em
}

#device-page .big-360-view,
#device-page .big-360-view * {
    cursor: url(i/cursors/cursor-rotate.png), default !important
}

#device-page .big-360-view #spin-360 {
    margin: 0 auto
}

#device-page .device-attributes {
    position: relative;
    width: 590px;
    height: 320px;
    margin: 0 auto;
    margin-bottom: 48px;
    margin-bottom: 3rem
}

#device-page .device-attributes img {
    display: block;
    opacity: .1
}

#device-page .device-attributes li {
    list-style: none;
    font-size: 24px;
    line-height: 36px
}

#device-page #device-length {
    position: absolute;
    bottom: -80px;
    left: 0;
    width: 100%;
    text-align: center;
    border-top: 1px solid #7c7c7c
}

#device-page #device-length span {
    position: relative;
    top: -20px;
    background: #fff;
    padding: 10px
}

#device-page #device-width {
    position: absolute;
    top: 0;
    right: -17%;
    height: 100%;
    line-height: 320px;
    padding-left: 20px;
    border-left: 1px solid #7c7c7c
}

#device-page #device-width span {
    position: relative;
    margin-left: -60px;
    background: #fff;
    padding: 10px
}

#device-page #device-height {
    position: absolute;
    top: 0;
    left: -20%
}

#device-page #device-resolution {
    position: absolute;
    top: 30%;
    left: 18%;
    width: 400px;
    text-align: center
}

#device-page #device-screen {
    position: absolute;
    top: 50%;
    left: 18%;
    width: 400px;
    text-align: center
}

#device-page .tech-details-list {
    padding-left: 33.3333%
}

#device-page .tech-details-list h2 {
    float: left;
    width: 45%;
    margin: 0px 0px 0px -50%;
    font-size: 16px;
    line-height: 40px
}

#device-page .tech-details-list h2:before {
    content: " ";
    float: none;
    display: block;
    width: 333.333%;
    height: 0px;
    height: 0rem;
    border-top: 1px solid #a4a4a4
}

#device-page .tech-details-list h2+.list-tech-details {
    padding-top: 12px;
    padding-top: .75rem
}

#device-page .list-tech-details {
    padding-bottom: 48px;
    padding-bottom: 3rem
}

#device-page .list-tech-details li {
    list-style: none;
    margin-bottom: 12px;
    margin-bottom: .75rem
}

#device-page .table-tech-details {
    padding-bottom: 48px;
    padding-bottom: 3rem;
    margin: 0
}

#device-page .table-tech-details th {
    width: 33.33333333%;
    padding-left: 0 !important
}

#device-page .table-tech-details table {
    border-bottom: 0;
    margin-bottom: 0
}

#device-page .list-reviews li {
    list-style: none
}

#device-page .a-review {
    border-top: 1px solid #d0d0d0;
    padding: 24px 0px;
    padding: 1.5rem 0rem
}

#device-page .a-review dl {
    padding-left: 33.33333333%
}

#device-page .review-title {
    float: right;
    width: 100%
}

#device-page .review-bars {
    float: left;
    width: 45%;
    margin-left: -50%
}

#device-page .review-meta {
    font-size: 12px;
    margin-bottom: 12px
}

#device-page .review-tools {
    font-size: 12px
}

#device-page .list-graph-bar li {
    list-style: none;
    overflow: auto
}

#device-page .list-graph-bar li .label {
    float: left;
    width: 40%;
    font-size: 14px;
    line-height: 24px
}

#device-page .bar {
    float: left;
    width: 60%;
    height: 4px;
    overflow: hidden;
    margin-top: 11px;
    background: #e5e5e5
}

#device-page .bar .value {
    height: 4px;
    background: #e20074
}

#device-page .bar .value-1 {
    width: 20%
}

#device-page .bar .value-2 {
    width: 40%
}

#device-page .bar .value-3 {
    width: 60%
}

#device-page .bar .value-4 {
    width: 80%
}

#device-page .bar .value-5 {
    width: 100%
}

#device-page #product-description .list-graph-bar .label {
    width: 25%
}

#device-page #product-description .list-graph-bar .bar {
    width: 75%
}

#device-page .box-item-accessory {
    padding: 24px 0px;
    padding: 1.5rem 0rem
}

#device-page .packages-overview-6-items table {
    table-layout: fixed
}

#device-page .product-names strong {
    display: block
}

#device-page .price-promo .price {
    margin: 0
}

#device-page pre {
    display: none
}

.wizard-steps {
    margin-bottom: 10px
}

.wizard-steps ol {
    display: table;
    table-layout: fixed;
    width: 100%
}

.wizard-steps li {
    display: table-cell;
    text-align: center;
    color: #7c7c7c
}

.wizard-steps li a,
.wizard-steps li span {
    display: block;
    padding: 10px 20px;
    font-size: 14px;
    text-transform: uppercase;
    background: url(i/icons/wizard-todo.png) no-repeat 0 50%
}

.wizard-steps li.done {
    border-bottom-color: #e20074
}

.wizard-steps li.done a {
    color: #e20074;
    background: url(i/icons/wizard-done.png) no-repeat 0 50%
}

.wizard-steps li.current {
    border-bottom-color: #e20074
}

.wizard-steps li.current span {
    font-weight: bold;
    color: #e20074;
    background: url(i/icons/wizard-current.png) no-repeat 0 50%
}

.wizard-steps li a,
.wizard-steps li span {
    margin-bottom: -13px;
    padding-bottom: 42px;
    background-position: 50% 100% !important;
    color: #000
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    .wizard-steps li a,
    .wizard-steps li span {
        background-image: url(i/icons/wizard-todo-@2x.png);
        background-size: 500px 22px !important
    }
    .wizard-steps li.done a {
        background-image: url(i/icons/wizard-done-@2x.png)
    }
    .wizard-steps li.current span {
        background-image: url(i/icons/wizard-current-@2x.png)
    }
}

@media (max-width: 767px) {
    #wizard-steps li {
        display: block;
        width: 100%
    }
}

#why-ht-header p br {
    display: none
}

.one-pager-nav a {
    color: #e20074
}

.one-pager-nav a:hover {
    color: #b5015c
}

.one-pager-nav li {
    margin: 0;
    padding: .375em;
    border-bottom: 1px solid #eee
}

@media (max-width: 959px) {
    .one-pager-nav li {
        float: none !important;
        width: 100% !important;
        text-align: left !important
    }
    .section-scream .grid {
        padding: 40px 0 20px
    }
    .section-scream .xxxl {
        font-size: 48px !important;
        line-height: 50px !important
    }
    .section-scream .box-item p a {
        padding-bottom: 0
    }
    #ustedite-uz-max-pakete .box-item {
        float: none !important;
        width: 100% !important;
        margin-left: 0 !important
    }
}

#page-header-maxtv.page-header-maxtv-black {
    color: #fff;
    background: #000;
    border: 0
}

#page-header-maxtv.page-header-maxtv-black .grid {
    padding: 30px 0px;
    padding: 1.875rem 0rem
}

#page-header-maxtv.page-header-maxtv-black h1 {
    width: 182px;
    height: 81px;
    text-indent: -9999px;
    overflow: hidden;
    background: url(i/maxtv-logo-metalic-black.png) no-repeat 0 14px
}

@media (min--moz-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6 / 2),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
    #page-header-maxtv.page-header-maxtv-black h1 {
        background-image: url("i/maxtv-logo-metalic-black-@2x.png");
        background-size: 182px 50px
    }
}

#page-header-maxtv.page-header-maxtv-black-gradient {
    background-image: -webkit-linear-gradient(#000, #333);
    background-image: -moz-linear-gradient(#000, #333);
    background-image: -ms-linear-gradient(#000, #333);
    background-image: -o-linear-gradient(#000, #333);
    background-image: linear-gradient(#000, #333)
}

#page-header-maxtv .page-header-cta {
    margin-top: -3px
}

#page-header-maxtv .page-header-cta .button {
    float: right
}

#page-header-maxtv .page-header-cta p {
    clear: both;
    text-align: right
}

#page-header-rich {
    position: relative
}

#page-header-rich .page-header {
    position: absolute;
    width: 100%;
    z-index: 5;
    color: #fff;
    padding-top: .75em
}

#page-header-rich .page-header .page-header-desc {
    padding-top: 5px;
    text-shadow: 0 2px 10px #000
}

#page-header-rich .page-header .page-header-desc h1 {
    text-transform: none;
    font-family: Tele-Grotesk, Arial, sans-serif
}

#page-header-rich .page-header .button {
    background: #fff;
    border: 1px solid #fff;
    -webkit-box-shadow: 0 2px 10px #000;
    -moz-box-shadow: 0 2px 10px #000;
    -ms-box-shadow: 0 2px 10px #000;
    -o-box-shadow: 0 2px 10px #000;
    box-shadow: 0 2px 10px #000
}

.hero-carousel {
    float: left;
    clear: both;
    width: 100%;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.hero-carousel ul.carousel {
    width: 300% !important
}

.hero-carousel ul.carousel .featured-show {
    width: 33.33333333%;
    z-index: 1;
    margin: 0
}

.hero-carousel .jcarousel-prev,
.hero-carousel .jcarousel-next {
    top: 0;
    bottom: 0;
    height: auto;
    width: 100px;
    z-index: 5000;
    background: url(i/icons/arrows-prev-next-XL-white.png) no-repeat -60px center
}

@media (min--moz-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6 / 2),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
    .hero-carousel .jcarousel-prev,
    .hero-carousel .jcarousel-next {
        background-image: url("i/icons/arrows-prev-next-@2x.png");
        background-size: 70px 45px
    }
}

.hero-carousel .jcarousel-prev {
    left: 0;
    background-position: 20px center
}

.hero-carousel .jcarousel-next {
    right: 0
}

.hero-carousel .featured-show {
    position: relative;
    width: 100%;
    list-style: none
}

.hero-carousel .featured-show img {
    width: 100%;
    display: block
}

.hero-carousel .featured-show .image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    background-image: -webkit-linear-gradient(transparent 50%, #000 100%);
    background-image: -moz-linear-gradient(transparent 50%, #000 100%);
    background-image: -ms-linear-gradient(transparent 50%, #000 100%);
    background-image: -o-linear-gradient(transparent 50%, #000 100%);
    background-image: linear-gradient(transparent 50%, #000 100%)
}

.hero-carousel .featured-show .maxtv-promo-text {
    color: #fff;
    position: absolute;
    top: 66.66666666%;
    width: 100%;
    text-shadow: 0 2px 10px #000
}

.hero-maxtv-collage .promo-row:after {
    content: ' ';
    display: table;
    clear: both
}

.hero-maxtv-collage .promo-box {
    list-style: none
}

@media only screen and (min-width: 600px) {
    .hero-maxtv-collage .promo-box {
        float: left;
        position: relative;
        height: 0;
        background: #e20074;
        overflow: hidden
    }
    .hero-maxtv-collage .promo-box img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease
    }
    .hero-maxtv-collage .promo-box .maxtv-promo-text {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        padding: 20px 40px;
        text-align: center;
        color: #fff;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease
    }
    .hero-maxtv-collage .promo-box.promo-box-L {
        width: 66.66666666%;
        padding-bottom: 28.57143%
    }
    .hero-maxtv-collage .promo-box.promo-box-M {
        width: 33.33333333%;
        padding-bottom: 14.28571%
    }
}

.hero-maxtv-collage .promo-row-2-1 .promo-box-M {
    clear: both
}

.hero-maxtv-collage .promo-row-2-1 .promo-box-L {
    float: right;
    margin-top: -14.28571%
}

#featured-channels .featured-channels-wrapper {
    position: relative
}

#featured-channels .featured-channels-wrapper .jcarousel-prev,
#featured-channels .featured-channels-wrapper .jcarousel-next {
    top: 50%;
    margin-top: -23px
}

#featured-channels .featured-channels-wrapper .jcarousel-prev {
    left: -60px
}

#featured-channels .featured-channels-wrapper .jcarousel-next {
    right: -60px
}

#featured-channels .featured-channels-wrapper:after {
    content: '';
    display: table;
    clear: both
}

#featured-channels .featured-channels {
    float: left;
    clear: both;
    width: 100%;
    position: relative;
    overflow: hidden;
    margin-bottom: 24px;
    margin-bottom: 1.5rem;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px
}

#featured-channels .carousel {
    background: #fff
}

#featured-channels .carousel .featured-channel {
    float: left;
    list-style: none;
    padding: 30px;
    min-height: 100%;
    clear: none !important;
    background: #fff
}

#featured-channels .carousel .featured-channel img {
    width: 100%
}

#featured-channels .channel-thumbnail {
    float: left;
    margin: 10px 20px 10px 0;
    border: 1px solid #d0d0d0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
    background: #fff
}

@media only screen and (min-width: 960px) {
    #featured-channels .channel-thumbnail {
        width: 78px;
        height: 78px
    }
}

#featured-channels .channel-thumbnail a {
    display: block;
    padding: 10px;
    font-size: 11px;
    line-height: 14px;
    color: #e20074;
    text-align: center
}

#featured-channels .channel-abstract {
    padding: 10px 0 0 100px
}

#featured-channels .section-header {
    position: relative
}

.boxes-maxtv-types .box-item {
    width: 33.33333333%;
    margin: 0 !important;
    padding: 0 40px
}

.boxes-maxtv-types-05 .box-item {
    width: 100%;
    margin: 0 !important;
    padding: 0 4% 1.5em
}

@media only screen and (min-width: 760px) {
    .boxes-maxtv-types-05 .box-item {
        float: none;
        display: table-cell !important;
        vertical-align: bottom
    }
}

@media only screen and (min-width: 760px) {
    .boxes-maxtv-types-05 #maxtv-sat-preview-box,
    .boxes-maxtv-types-05 #maxtv-to-go-preview-box {
        width: 30%
    }
    .boxes-maxtv-types-05 #maxtv-iptv-preview-box {
        width: 40%;
        border-left: 1px solid #d0d0d0;
        border-right: 1px solid #d0d0d0
    }
}

.boxes-maxtv-types-05 img {
    margin-bottom: 1.5em !important
}

.boxes-maxtv-types-05 .button {
    width: 100%
}

.boxes-maxtv-types-fallback .box-item {
    width: 100%;
    margin: 0 !important;
    padding: 0 4% 1.5em
}

@media only screen and (min-width: 760px) {
    .boxes-maxtv-types-fallback .box-item {
        float: none;
        display: table-cell !important;
        vertical-align: bottom
    }
}

@media only screen and (min-width: 760px) {
    .boxes-maxtv-types-fallback #maxtv-sat-preview-box,
    .boxes-maxtv-types-fallback #maxtv-to-go-preview-box {
        width: 50%
    }
    .boxes-maxtv-types-fallback #maxtv-sat-preview-box {
        border-right: 1px solid #d0d0d0
    }
    .boxes-maxtv-types-fallback #maxtv-sat-preview-box img {
        padding: 0 3em
    }
}

.boxes-maxtv-types-fallback img {
    margin-bottom: 1.5em !important
}

.boxes-maxtv-types-fallback .button {
    width: 100%
}

.keyhole {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 100%;
    border: 1px solid #a4a4a4;
    overflow: hidden;
    margin-bottom: 3em;
    -webkit-box-shadow: 0 0 0 10px #e6e6e6;
    -moz-box-shadow: 0 0 0 10px #e6e6e6;
    -ms-box-shadow: 0 0 0 10px #e6e6e6;
    -o-box-shadow: 0 0 0 10px #e6e6e6;
    box-shadow: 0 0 0 10px #e6e6e6;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    background: #e20074
}

.box-item:hover .keyhole {
    border-color: #e20074;
    -webkit-box-shadow: 0 0 0 10px rgba(226, 0, 116, 0.1);
    -moz-box-shadow: 0 0 0 10px rgba(226, 0, 116, 0.1);
    -ms-box-shadow: 0 0 0 10px rgba(226, 0, 116, 0.1);
    -o-box-shadow: 0 0 0 10px rgba(226, 0, 116, 0.1);
    box-shadow: 0 0 0 10px rgba(226, 0, 116, 0.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1)
}

.keyhole img {
    position: absolute;
    top: 0;
    left: 0
}

.box-group-columns .box-item {
    width: 100% !important;
    margin: 0
}

.box-group-columns img {
    padding: 20px 0
}

.box-group-columns .box-item-box {
    padding: 1.5em 0;
    border-top: 1px solid #d0d0d0
}

.box-group-columns .box-item-box h2 {
    font-size: 21px
}

.box-group-columns .box-item-box li {
    list-style: none;
    font-size: 1.25em;
    line-height: 1.5
}

.box-group-columns .box-item-box li a {
    color: #000;
    text-decoration: underline
}

.box-group-columns .box-item-box li a:hover {
    text-decoration: none
}

@media only screen and (min-width: 760px) {
    .box-group-columns .box-item {
        width: 33.33333333% !important;
        margin: 0 !important;
        padding-left: 3% !important;
        padding-right: 3% !important
    }
    .box-group-columns .box-central {
        border-left: 1px solid #d0d0d0;
        border-right: 1px solid #d0d0d0
    }
    .box-group-columns .box-left,
    .box-group-columns .box-right {
        padding-top: 100px
    }
    .box-group-columns .box-item-box:first-child {
        border-top: 0
    }
}

.box-group-prices li {
    width: 100% !important;
    margin: 0;
    text-align: center;
    padding: .75em 0;
    border-top: 1px solid #d0d0d0
}

.box-group-prices li:first-child {
    border: 0
}

.box-group-prices h3,
.box-group-prices .price-regular,
.box-group-prices .price-unit,
.box-group-prices .price-promo,
.box-group-prices .buttons {
    display: block;
    width: 100%;
    clear: both
}

.box-group-prices .price-regular {
    padding-bottom: 1.5em
}

.box-group-prices .price-promo {
    padding-bottom: 1.5em
}

.box-group-prices .buttons {
    margin-top: auto
}

@media only screen and (min-width: 600px) {
    .box-group-prices ul {
        float: left;
        width: 100%;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex
    }
    .box-group-prices li {
        list-style: none;
        float: left;
        width: 33.33333333%;
        padding: .75em 1em;
        border: 0;
        border-left: 1px solid #d0d0d0;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        -o-align-items: flex-start;
        align-items: flex-start
    }
    .box-group-prices li:first-child {
        border: 0
    }
}

ul.carousel {
    float: left;
    position: relative;
    width: 20000em
}

ul.carousel li {
    float: left
}

.jcarousel-prev,
.jcarousel-next {
    opacity: 1;
    position: absolute;
    display: block;
    width: 35px;
    height: 45px;
    background: url(i/icons/arrows-prev-next.png);
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    -ms-transition: opacity 0.3s ease;
    -o-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease
}

@media (min--moz-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6 / 2),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
    .jcarousel-prev,
    .jcarousel-next {
        background-image: url("i/icons/arrows-prev-next-@2x.png");
        background-size: 70px 45px
    }
}

.jcarousel-next {
    background-position: -35px 0
}

.jcarousel-prev.inactive,
.jcarousel-next.inactive {
    opacity: 0;
    top: -9999px
}

#preload1 {
    width: 0;
    height: 0;
    background: transparent url(/webResources/images/ostalo/loader.gif) no-repeat -9999px -9999px;
    overflow: hidden
}

#back-to-top-link {
    position: fixed;
    bottom: 0;
    right: 0;
    padding: 20px;
    z-index: 1000
}

#back-to-top-link a {
    display: block;
    width: 50px;
    height: 50px;
    text-indent: -9999px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.5) url(i/icons/arrow-up.png) no-repeat center center;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px
}

@media (min--moz-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6 / 2),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
    #back-to-top-link a {
        background-image: url("i/icons/arrow-up-@2x.png");
        background-size: 45px 40px
    }
}

#back-to-top-link.visible-text a {
    text-indent: 0;
    width: auto;
    color: #444;
    padding: 0 20px 0 60px;
    font-weight: bold;
    text-transform: uppercase;
    line-height: 50px;
    background-position: 5px center
}

.parallax-carousel {
    width: 100%;
    height: 0;
    padding-bottom: 42.85714286%
}

.parallax-carousel .featured-show {
    position: fixed;
    width: 100%;
    height: 100%
}

.non-parallaxed-content {
    background: #fff;
    z-index: 9999
}

#sticky-nav-wraper {
    position: fixed;
    top: 0;
    right: 20px;
    left: 20px;
    z-index: 500
}

.cloned-table-header {
    display: table;
    table-layout: fixed;
    width: 100%;
    max-width: 1200px;
    margin-right: 40px;
    margin: 0 auto;
    background: #fff;
    border-collapse: collapse;
    -webkit-box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.1);
    -ms-box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 0 0 rgba(0, 0, 0, 0.1)
}

.cloned-table-header .left {
    text-align: left
}

.cloned-table-header th {
    border: 1px solid #d0d0d0;
    padding: 10px 16px;
    padding: 10px 1rem
}

.cloned-table-header th:first-child {
    width: 28%
}

.cloned-table-header th a {
    color: #000
}

.facebook-ribbon {
    color: #fff;
    background: #4b6faa
}

.facebook-ribbon .grid {
    background: url(i/sn/facebook-white-ribbon.png) no-repeat 50px 100%;
    padding-left: 200px
}

.facebook-ribbon a {
    color: #fff
}

.facebook-ribbon h1 {
    float: left;
    display: inline;
    padding-right: .25em;
    margin: 0;
    line-height: 40px;
    line-height: 2.5rem
}

.facebook-ribbon p {
    margin: 0 !important
}

@media only screen and (max-width: 600px) {
    .facebook-ribbon .grid {
        background-image: none
    }
}

.maxtv-youtube-wrapper {
    position: relative;
    width: 100%;
    max-width: 870px;
    height: 0;
    padding-top: 64.71264368%;
    margin: 0 auto
}

.maxtv-youtube-wrapper img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.maxtv-youtube-wrapper iframe {
    position: absolute;
    top: 2.841918295%;
    left: 1.83908046%;
    width: 96.32183908%;
    height: 83.8365897%
}

.featured-channels-tiles {
    display: block;
    clear: both
}

.featured-channels-tiles a {
    color: #fff
}

.featured-channels-tiles ul {
    margin-bottom: 1.5em;
    background: #fff
}

.featured-channels-tiles ul:after {
    content: '';
    display: table;
    clear: both
}

.featured-channels-tiles li {
    float: left;
    width: 100%;
    list-style: none
}

.featured-channels-tiles li img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    border: 0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.featured-channels-tiles li .show-caption {
    position: absolute;
    bottom: -100%;
    left: 0;
    width: 100%;
    padding: 20px 40px 0;
    text-align: center;
    color: #fff;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.featured-channels-tiles li .show-caption h2 {
    line-height: 1;
    margin-bottom: .25em
}

.featured-channels-tiles li .show-caption p {
    margin-bottom: 0
}

.featured-channels-tiles li .show-caption p {
    opacity: 0;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.featured-channels-tiles li .inner,
.featured-channels-tiles li .empty-box {
    display: block;
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 50%;
    overflow: hidden;
    color: #fff
}

.featured-channels-tiles li .inner .show-caption h3,
.featured-channels-tiles li .empty-box .show-caption h3 {
    margin-bottom: .75em
}

.featured-channels-tiles li .inner .show-caption .show-links,
.featured-channels-tiles li .empty-box .show-caption .show-links {
    clear: both;
    width: 100%;
    max-width: 300px;
    overflow: auto;
    margin: 1.5em auto 0
}

.featured-channels-tiles li .inner .show-caption a,
.featured-channels-tiles li .empty-box .show-caption a {
    width: 47.5%;
    color: #fff;
    padding: .375em 1em;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    background: rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    font-size: .77777777em;
    text-transform: uppercase;
    letter-spacing: .05em
}

.featured-channels-tiles li .inner .show-caption a:first-child,
.featured-channels-tiles li .empty-box .show-caption a:first-child {
    margin: 0
}

.featured-channels-tiles li .inner .show-caption a:hover,
.featured-channels-tiles li .empty-box .show-caption a:hover {
    background: rgba(0, 0, 0, 0.5)
}

.featured-channels-tiles li .inner:hover img,
.featured-channels-tiles li .empty-box:hover img {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    opacity: 0
}

.featured-channels-tiles li .inner:hover .show-caption,
.featured-channels-tiles li .empty-box:hover .show-caption {
    bottom: 50% !important;
    top: auto;
    -webkit-transform: translateY(50%);
    -moz-transform: translateY(50%);
    -ms-transform: translateY(50%);
    -o-transform: translateY(50%);
    transform: translateY(50%);
    padding-bottom: 20px
}

.featured-channels-tiles li .inner:hover .show-caption p,
.featured-channels-tiles li .empty-box:hover .show-caption p {
    opacity: 1
}

.featured-channels-tiles li .inner:hover .image-overlay,
.featured-channels-tiles li .empty-box:hover .image-overlay {
    background: none !important
}

.featured-channels-tiles li .empty-box {
    display: none
}

.featured-channels-tiles li.all-channels-link .inner {
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .01em;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    background: #000 url(i/icons/arrow-next-XL-white.png) no-repeat 95% 50%
}

.featured-channels-tiles li.all-channels-link .inner:hover {
    background-color: #e20074
}

.featured-channels-tiles li.all-channels-link strong {
    position: absolute;
    width: 100%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    display: block
}

.featured-channels-tiles li.all-channels-link h2 {
    margin: 0
}

.featured-channels-tiles li.all-channels-link-inverted .inner {
    background: #e20074 url(i/icons/arrow-next-XL-white.png) no-repeat 95% 50%
}

.featured-channels-tiles li.all-channels-link-inverted .inner:hover {
    background-color: #000
}

@media only screen and (min-width: 600px) {
    .featured-channels-tiles li {
        width: 50%
    }
}

@media only screen and (min-width: 1000px) {
    .featured-channels-tiles li {
        width: 25%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-4 {
        float: right
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-4 .inner,
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-4 .empty-box {
        padding-bottom: 100%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-4 img {
        width: 200% !important;
        max-width: 1000% !important;
        left: -50%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-5 {
        width: 50%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-9 {
        clear: both
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-11 .inner,
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-11 .empty-box {
        padding-bottom: 100%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-11 img {
        width: 200% !important;
        max-width: 1000% !important;
        left: -50%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-13 {
        margin: 12.5% 0 0 -75%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-14 {
        margin: 12.5% 0 0 -100%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-4 .show-caption,
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-5 .show-caption,
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-11 .show-caption {
        top: auto;
        bottom: 0
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-4 .show-caption h2,
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-5 .show-caption h2,
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-11 .show-caption h2 {
        font-size: 36px;
        line-height: 1em;
        opacity: 1
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-4 .image-overlay,
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-5 .image-overlay,
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-11 .image-overlay {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        background-image: -webkit-linear-gradient(transparent 50%, #000 100%);
        background-image: -moz-linear-gradient(transparent 50%, #000 100%);
        background-image: -ms-linear-gradient(transparent 50%, #000 100%);
        background-image: -o-linear-gradient(transparent 50%, #000 100%);
        background-image: linear-gradient(transparent 50%, #000 100%)
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li.item-16 {
        clear: both
    }
    .featured-channels-tiles.featured-channel-titles-mosaic li .empty-box {
        display: block
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-2 .inner,
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-2 .empty-box {
        padding-bottom: 100%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-2 img {
        width: 200% !important;
        max-width: 1000% !important;
        left: -50%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-5 {
        margin: 12.5% 0 0 -100%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-6 .inner,
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-6 .empty-box {
        padding-bottom: 100%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-6 img {
        width: 200% !important;
        max-width: 1000% !important;
        left: -50%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-8 {
        margin: 12.5% 0 0 -100%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-9 {
        margin: 12.5% 0 0 -75%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-2 .show-caption,
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-6 .show-caption {
        top: auto;
        bottom: 0
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-2 .show-caption h2,
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-6 .show-caption h2 {
        font-size: 36px;
        line-height: 1em;
        opacity: 1
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-2 .image-overlay,
    .featured-channels-tiles.featured-channel-titles-mosaic-iptv li.item-6 .image-overlay {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        background-image: -webkit-linear-gradient(transparent 50%, #000 100%);
        background-image: -moz-linear-gradient(transparent 50%, #000 100%);
        background-image: -ms-linear-gradient(transparent 50%, #000 100%);
        background-image: -o-linear-gradient(transparent 50%, #000 100%);
        background-image: linear-gradient(transparent 50%, #000 100%)
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-sat li.item-2 .inner,
    .featured-channels-tiles.featured-channel-titles-mosaic-sat li.item-2 .empty-box {
        padding-bottom: 100%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-sat li.item-2 img {
        width: 200% !important;
        max-width: 1000% !important;
        left: -50%
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-sat li.item-2 .show-caption {
        top: auto;
        bottom: 0
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-sat li.item-2 .show-caption h2 {
        font-size: 36px;
        line-height: 1em;
        opacity: 1
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-sat li.item-2 .image-overlay {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        background-image: -webkit-linear-gradient(transparent 50%, #000 100%);
        background-image: -moz-linear-gradient(transparent 50%, #000 100%);
        background-image: -ms-linear-gradient(transparent 50%, #000 100%);
        background-image: -o-linear-gradient(transparent 50%, #000 100%);
        background-image: linear-gradient(transparent 50%, #000 100%)
    }
    .featured-channels-tiles.featured-channel-titles-mosaic-sat li.item-5 {
        margin: 12.5% 0 0 -100%
    }
}

#single-banner {
    position: relative
}

#single-banner img {
    display: block
}

#single-banner .image-overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    background-image: -webkit-linear-gradient(transparent 50%, #000 100%);
    background-image: -moz-linear-gradient(transparent 50%, #000 100%);
    background-image: -ms-linear-gradient(transparent 50%, #000 100%);
    background-image: -o-linear-gradient(transparent 50%, #000 100%);
    background-image: linear-gradient(transparent 50%, #000 100%)
}

#single-banner .maxtv-promo-text {
    color: #fff;
    position: absolute;
    bottom: 0;
    padding-bottom: 1.5em;
    width: 100%;
    text-shadow: 0 2px 10px #000
}

@media only screen and (max-width: 768px) {
    #single-banner img {
        max-width: 150% !important
    }
}

#videoteka-pregled-paketa {
    padding-left: 1em;
    padding-right: 1em;
    border-top: 1px solid #d0d0d0
}

.vod-paketi {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    padding: 0 1em
}

.vod-paketi:after {
    content: '';
    display: table;
    clear: both
}

.vod-paket {
    border-top: 1px solid #d0d0d0;
    padding: 2em 0;
    position: relative
}

.vod-paket .vod-collage {
    display: none
}

.vod-paket .vod-desc {
    width: 100%;
    margin: 0 auto;
    padding-bottom: 1.5em;
    clear: both;
    overflow: hidden
}

.vod-paket .vod-desc .logo-wrapper {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 20%;
    margin: 0.5em 0 3em
}

.vod-paket .vod-desc .logo-wrapper img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%
}

.vod-paket .vod-desc .list-features-tiny {
    margin-top: 1.5em
}

.vod-paket .vod-desc .cta {
    margin: auto 0 1em;
    position: absolute;
    bottom: 0
}

@media only screen and (min-width: 600px) and (max-width: 999px) {
    .vod-paket {
        width: 100%;
        clear: both;
        padding: 2em 5%
    }
}

@media only screen and (min-width: 1000px) {
    .vod-paket {
        border-top: 0;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-direction: column;
        -moz-flex-direction: column;
        -ms-flex-direction: column;
        -o-flex-direction: column;
        flex-direction: column;
        -webkit-align-items: flex-start;
        -moz-align-items: flex-start;
        -ms-align-items: flex-start;
        -o-align-items: flex-start;
        align-items: flex-start;
        float: left;
        width: 33%;
        padding: 1.5em 1.25% 2.5em;
        border-left: 1px solid #d0d0d0
    }
    .vod-paket:first-child {
        border-left: 0
    }
}

@media only screen and (min-width: 1400px) {
    .vod-paket .vod-collage {
        display: block;
        width: 100%;
        margin: 0 auto;
        margin-bottom: 3em
    }
    .vod-paket .vod-collage li {
        float: left;
        width: 33.33333333%;
        list-style: none;
        background: #e20074
    }
    .vod-paket .vod-collage img {
        display: block;
        opacity: 1;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease
    }
    .vod-paket .vod-collage a:hover img {
        opacity: .1
    }
    .vod-paket .vod-collage.vod-collage-1 .item-3,
    .vod-paket .vod-collage.vod-collage-1 .item-6 {
        clear: both
    }
    .vod-paket .vod-collage.vod-collage-1 .item-2 {
        margin-left: 33.33333333%
    }
    .vod-paket .vod-collage.vod-collage-1 .item-7 {
        margin-left: 33.33333333%
    }
    .vod-paket .vod-collage.vod-collage-1 .item-4 {
        margin-top: -16.66666666%
    }
    .vod-paket .vod-collage.vod-collage-2 .item-2,
    .vod-paket .vod-collage.vod-collage-2 .item-4 {
        clear: both
    }
    .vod-paket .vod-collage.vod-collage-2 .item-1,
    .vod-paket .vod-collage.vod-collage-2 .item-5 {
        margin-left: 33.33333333%
    }
    .vod-paket .vod-collage.vod-collage-2 .item-2 {
        margin-left: 16.66666666%
    }
    .vod-paket .vod-collage.vod-collage-3 .item-3,
    .vod-paket .vod-collage.vod-collage-3 .item-4 {
        clear: both
    }
    .vod-paket .vod-collage.vod-collage-3 .item-2,
    .vod-paket .vod-collage.vod-collage-3 .item-3,
    .vod-paket .vod-collage.vod-collage-3 .item-5 {
        margin-left: 33.33333333%
    }
    .vod-paket .vod-collage.vod-collage-4 .item-4,
    .vod-paket .vod-collage.vod-collage-4 .item-5 {
        clear: both;
        margin-left: 33.33333333%
    }
    .vod-paket .vod-collage.vod-collage-5 .item-3,
    .vod-paket .vod-collage.vod-collage-5 .item-5 {
        clear: both
    }
    .vod-paket .vod-collage.vod-collage-5 .item-2,
    .vod-paket .vod-collage.vod-collage-5 .item-5 {
        margin-left: 33.33333333%
    }
    .vod-paket .vod-collage.vod-collage-5 .item-3 {
        margin-left: 16.66666666%
    }
}

#kladjenje-sportovi .list-sports {
    margin: 0 0 3em
}

#kladjenje-sportovi .list-sports ul:after {
    content: '';
    display: table;
    clear: both
}

#kladjenje-sportovi .list-sports li {
    list-style: none;
    float: left;
    width: 14.285714286%;
    text-align: center
}

#kladjenje-sportovi .list-sports li img {
    display: block;
    margin: 0 auto 1.5em
}

#kladjenje-opis .supersport-box {
    text-align: right
}

#kladjenje-opis .supersport-img {
    float: right;
    width: 100px;
    margin: 0 0 0 30px
}

#kladjenje-opis .remote-img {
    float: left;
    width: 84px;
    margin: -80px 20px 0 0
}

.ui-how-to .figure {
    margin: 0
}

.ui-how-to .figure img {
    display: block
}

.ui-how-to .caption {
    display: block;
    clear: both;
    padding: 0.75em .25em 0
}

.vod-opis .remote-img {
    display: none
}

@media only screen and (min-width: 1000px) {
    .vod-opis .desc-box {
        padding-right: 28px;
        text-align: right
    }
    .vod-opis .remote-img {
        float: left;
        display: inline;
        margin: -20px 20px 0 -65px
    }
}

.snimalica-opis .figure {
    margin-bottom: 3em
}

.snimalica-opis img {
    display: block;
    margin: 0 auto
}

.snimalica-opis h1,
.snimalica-opis p {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto
}

.button-pickbox {
    color: #fff;
    background: #008ed4;
    background-image: -webkit-linear-gradient(#60b3e2, #2ea0db 50%, #008ed4 50%, #008ed4);
    background-image: -moz-linear-gradient(#60b3e2, #2ea0db 50%, #008ed4 50%, #008ed4);
    background-image: -ms-linear-gradient(#60b3e2, #2ea0db 50%, #008ed4 50%, #008ed4);
    background-image: -o-linear-gradient(#60b3e2, #2ea0db 50%, #008ed4 50%, #008ed4);
    background-image: linear-gradient(#60b3e2, #2ea0db 50%, #008ed4 50%, #008ed4);
    border-color: #008ed4;
    text-shadow: 0 -1px 0 #008ed4
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    #section-internet-features-overview .box-item-icon {
        background-image: url(i/icons/internet-features-@2x.png)
    }
    #quick-actions-existing-customers .box-item-icon {
        background-image: url(i/icons/internet-actions-existing-customers-@2x.png)
    }
    #internet-service-types .box-item-icon {
        background-image: url(i/icons/internet-service-types-@2x.png)
    }
    #internet-security-features .box-item-icon {
        background-image: url(i/icons/internet-security-@2x.png)
    }
    #home-wifi-devices .box-item-icon {
        background-image: url(i/icons/home-network-@2x.png)
    }
    .boxes-max-paketi .box-item-icon {
        background-image: url(i/icons/max-paketi-magenta-@2x.png)
    }
    .section-magenta .boxes-max-paketi .box-item-icon {
        background-image: url(i/icons/max-paketi-white-@2x.png)
    }
    .boxes-telefon .box-item-icon {
        background-image: url(i/icons/fixed-line-magenta-@2x.png)
    }
    .section-magenta .boxes-telefon .box-item-icon {
        background-image: url(i/icons/fixed-line-white-@2x.png)
    }
    .box-trust-comforting .box-item-icon {
        background-image: url(i/icons/trust-comforting-magenta-@2x.png)
    }
    .section-magenta .box-trust-comforting .box-item-icon {
        background-image: url(i/icons/trust-comforting-white-@2x.png)
    }
    .boxes-maxtv-types .box-item-icon {
        background-image: url(i/icons/maxtv-types-magenta-@2x.png)
    }
    .section-magenta .boxes-maxtv-types .box-item-icon {
        background-image: url(i/icons/maxtv-types-white-@2x.png)
    }
    .icon-amex,
    .icon-mastercard-maestro-visa,
    .icon-cash,
    .icon-diners {
        background-size: auto 35px !important
    }
    .icon-amex {
        background-image: url(i/icons/amex-@2x.png) !important
    }
    .icon-mastercard-maestro-visa {
        background-image: url(i/icons/mastercard-maestro-visa-@2x.png) !important
    }
    .icon-cash {
        background-image: url(i/icons/cash-@2x.png) !important
    }
    .icon-diners {
        background-image: url(i/icons/diners-@2x.png) !important
    }
    .prev-next-nav a {
        background-image: url(i/icons/arrows-large-@2x.png)
    }
    .input-phone {
        background-image: url(i/icons/phone-@2x.png)
    }
    .small-note-error:before {
        background-image: url(i/icons/exclamation-@2x.png)
    }
    .small-note-confirmation:before {
        background-image: url(i/icons/checkmark-small-@2x.png)
    }
    .calendar-day td {
        background-image: url(i/icons/locks-@2x.png)
    }
    #modal-placeholder .close-link {
        background-image: url(i/icons/close-aaa-@2x.png)
    }
    #modal-placeholder .close-link:hover,
    #modal-placeholder .close-link:focus {
        background-image: url(i/icons/close-magenta-@2x.png)
    }
    #layout-empty-cart h1 {
        background-image: url(i/icons/cart-empty-@2x.png)
    }
    #section-customer-support .grid {
        background-image: url(/img/customer-support/customer-support-@2x.jpg)
    }
    #section-self-care .grid {
        background-image: url(/img/self-care/moj-telekom-devices-mini-@2x.png)
    }
    #max-paketi-promo-image img {
        width: 200px;
        height: 60px
    }
    .box-trust-comforting-tiny a,
    .box-trust-comforting-tiny span {
        background-image: url(i/icons/sprite-webshop-features-tiny-magenta-@2x.png) !important;
        background-size: 100px 500px
    }
}

.cd-top {
    display: inline-block;
    height: 40px;
    width: 40px;
    z-index: 999;
    position: fixed;
    bottom: 25%;
    right: 20px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: #fff url("//static.hrvatskitelekom.hr/webresources/css/i/icons/arrow-up.png") no-repeat center 50%;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity .3s 0s, visibility 0s .3s;
    -moz-transition: opacity .3s 0s, visibility 0s .3s;
    transition: opacity .3s 0s, visibility 0s .3s
}

.cd-top.cd-is-visible,
.cd-top .cd-top.cd-fade-out,
.cd-top .no-touch .cd-top:hover {
    -webkit-transition: opacity .3s 0s, visibility 0s 0s;
    -moz-transition: opacity .3s 0s, visibility 0s 0s;
    transition: opacity .3s 0s, visibility 0s 0s
}

.cd-top.cd-is-visible {
    visibility: visible;
    opacity: 1
}

.cd-top.cd-fade-out {
    opacity: .8
}

.no-touch .cd-top:hover {
    background-color: #64b9e4;
    opacity: 1
}

.cookies-notification {
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 1000;
    width: 100%;
    background: transparent url(//static.hrvatskitelekom.hr/webresources/images/darkgray90.png) repeat;
    background: rgba(32, 32, 32, 0.9);
    padding: 1.25em 0;
    display: none
}

.cookies-notification .wrapper {
    margin: 0 auto;
    width: 60em
}

.cookies-notification p {
    font: normal 0.9375em/normal Tele-GroteskHal;
    color: #c2c2c2;
    margin: 0
}

.cookies-notification .button-gray {
    float: right;
    margin: 0 0 0 1.5em;
    padding: 7px 10px;
    cursor: pointer
}

.content-overlay {
    width: 40%;
    max-width: 640px;
    background-color: #FFF;
    -moz-box-shadow: 0px 0px 15px black;
    -webkit-box-shadow: 0px 0px 15px black;
    box-shadow: 0px 0px 15px black;
    padding: 16px 20px;
    display: none;
    margin: 10px 0 10px;
    transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out
}

.content-overlay .auto {
    width: auto
}

.content-overlay .close {
    position: absolute;
    width: 25px;
    height: 25px;
    display: block;
    top: -15px;
    right: -15px;
    background-image: url(../images/ui.png);
    background-repeat: no-repeat;
    background-position: 0px -279px
}

.content-overlay .close:hover {
    background-position: -34px -279px
}

@media only screen and (max-width: 768px) {
    .content-overlay {
        width: 80% !important;
        left: 10% !important
    }
}

.overlay {
    margin-top: 10px
}

.overlay .loader {
    position: absolute;
    background-color: #FFF;
    border: 1px solid #bbb;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    padding: 16px 30px 13px 30px;
    display: none
}

.overlay h2 {
    float: none;
    margin-bottom: 15px
}

.overlay h4 {
    margin: 0 0 10px
}

.overlay ul,
.overlay .modal_dialogue_container ul {
    list-style-type: none;
    margin: 0 0 15px;
    float: left
}

.overlay ul li,
.overlay .modal_dialogue_container ul li {
    margin: 0px 0px 3px 0px;
    padding: 0px 0px 0px 10px;
    background-image: url(../images/bullet.jpg);
    background-position: 0px 6px;
    background-repeat: no-repeat;
    font-size: 14px;
    line-height: 18px
}

.overlay .close.default {
    background: transparent url(../images/ui.png) -2px -281px;
    position: absolute;
    right: -15px;
    top: -15px;
    display: block;
    cursor: pointer;
    height: 20px;
    width: 20px;
    z-index: 1
}

.overlay .close.default:hover {
    background-position: -36px -281px
}

.modal_dialogue_container {
    position: absolute;
    background-color: #FFF;
    border: 5px solid #E5E5E5;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    -ms-border-radius: 15px;
    -o-border-radius: 15px;
    border-radius: 15px;
    -webkit-box-shadow: 0 0 15px 0 #000;
    -moz-box-shadow: 0 0 15px 0 #000;
    -ms-box-shadow: 0 0 15px 0 #000;
    -o-box-shadow: 0 0 15px 0 #000;
    box-shadow: 0 0 15px 0 #000;
    padding: 0px 20px 16px 20px;
    display: none;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    -ms-box-sizing: content-box;
    -o-box-sizing: content-box;
    box-sizing: content-box
}

.modal_window_scroll_content {
    float: left
}

.modal_window_scroll_content p {
    float: left
}

.modal_dialogue_640px {
    width: 640px
}

.modal_dialogue_600px {
    width: 600px
}

.modal_dialogue_680px {
    width: 680px
}

.modal_dialogue_300px {
    width: 300px
}

.modal_dialogue_450px {
    width: 450px
}

.modal_dialogue_500px {
    width: 500px
}

.modal_dialogue_800px {
    width: 800px
}

.modal_dialogue_400px {
    width: 400px
}

.modal_dialogue_370px {
    width: 370px
}

.modal_dialogue_auto {
    width: auto
}

.modal_dialogue_container_wide {
    position: absolute;
    width: 640px;
    background-color: #FFF;
    border: 5px solid #E5E5E5;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px;
    -moz-box-shadow: 0px 0px 15px black;
    -webkit-box-shadow: 0px 0px 15px black;
    box-shadow: 0px 0px 15px black;
    padding: 0px 20px 16px 20px;
    display: none
}

.modal_dialogue_title {
    padding: 20px 0px 10px 0px;
    line-height: 28px;
    font-size: 20px;
    font-weight: bold;
    width: 100%;
    float: left;
    display: inline;
    color: #e20074;
    border-bottom: 1px solid #D1D1D1;
    margin: 0px 0px 0px 0px
}

.modal_dialogue_title_no_border {
    padding: 20px 0px 10px 0px;
    line-height: 28px;
    font-size: 20px;
    font-weight: bold;
    width: 100%;
    float: left;
    display: inline;
    color: #e20074;
    margin: 0px 0px 0px 0px
}

.modal_news_subtitle {
    font-size: 14px;
    color: #e20074;
    margin: 15px 0px 0px 0px
}

.modal_dialogue_subtitle {
    float: left;
    width: 100%;
    font-size: 14px;
    color: #666;
    border-bottom: 1px solid #e5e5e5;
    padding: 0px 0px 4px 0px
}

.chatbutton {
    position: fixed;
    right: 1em;
    bottom: 1em;
    z-index: 10
}

@media screen and (max-width: 1340px) {
    .chatbutton {
        right: 0.25em;
        width: 8em
    }
    .chatbutton img {
        width: 100%
    }
}

@media screen and (max-width: 1240px) {
    .chatbutton {
        width: 8%
    }
}

@media screen and (max-width: 1170px) {
    .chatbutton {
        display: none
    }
}

@media screen and (max-width: 1170px) {
    div[name^="lpInviteLayer-"] {
        display: none
    }
}

.nolink-title {
    color: White;
    display: inline-block;
    text-transform: uppercase;
    padding: 7px 0 7px 20px
}

#bi-2015 .grid .no-mobile {
    display: none
}

.additional-sticker.sold-out {
    position: absolute;
    right: 0 !important;
    left: 0 !important;
    top: 50%;
    margin-top: -55px;
    background: transparent url("//static.hrvatskitelekom.hr/webresources/images/rasprodano-zvone.png") no-repeat scroll 0px 0px;
    width: 300px !important;
    height: 112px !important
}

.more {
    display: none;
    margin-top: 2em
}

.go {
    cursor: pointer;
    position: relative;
    text-align: center;
    color: #6b7bbd
}

.htws-2016 .triangle {
    content: "";
    width: 0;
    height: 0;
    margin: 0.5em auto 0;
    border-style: solid;
    border-width: 10px 7.5px 0 7.5px;
    border-color: #6b7bbd transparent transparent transparent
}

.htws-2016 .triangle.upon {
    border-width: 0 7.5px 10px 7.5px;
    border-color: transparent transparent #6b7bbd transparent
}

.top-usp-boxes {
    list-style-type: none;
    margin: 1em 0
}

.top-usp-boxes>li {
    display: table-cell;
    vertical-align: middle;
    border: 1px solid #e20074;
    padding: 0.875em 1.3em
}

.top-usp-boxes.top-usp-boxes-2>li {
    width: 24.25%
}

.top-usp-boxes.top-usp-boxes-3>li {
    width: 32.5%
}

.top-usp-boxes.top-usp-boxes-4>li {
    width: 24.25%
}

.top-usp-boxes.top-usp-boxes-5>li {
    width: 19.2%
}

.top-usp-boxes.top-usp-boxes-6>li {
    width: 15.8%
}

.top-usp-boxes>li.separate {
    border: none;
    padding: 0;
    width: 1%
}

.top-usp-boxes.top-usp-boxes-2>li.separate {
    width: 2%
}

.top-usp-boxes.top-usp-boxes-3>li.separate {
    width: 1.25%
}

.top-usp-boxes.top-usp-boxes-4>li.separate {
    width: 1%
}

.top-usp-boxes.top-usp-boxes-5>li.separate {
    width: 1%
}

.top-usp-boxes.top-usp-boxes-6>li.separate {
    width: 1.04%
}

.top-usp-boxes p {
    font: normal 18px/1.22 Tele-groteskHal;
    text-transform: uppercase;
    margin: 0
}

@media screen and (max-width: 700px) {
    .top-usp-boxes {
        border-top: 1px solid #e20074
    }
    .top-usp-boxes>li {
        display: block;
        border-width: 0 0 1px 0;
        width: 100% !important;
        padding: 0.875em 0
    }
    .top-usp-boxes>li.separate {
        display: none
    }
}

.zebra-table {
    width: 100%;
    margin: 0 0 1em
}

.zebra-table td {
    padding: 0.5em 0.25em;
    font: normal 0.9375em/1.2 Tele-grotesk;
    background: #eee;
    width: 12.5%;
    height: 1.8em
}

.zebra-table tr:nth-child(even) td {
    background: #fff
}

.tarif-pricelist {
    overflow: auto
}

.tarif-pricelist br {
    display: inline
}

.tarif-pricelist table {
    border-top: none;
    background: #fff;
    width: 100%
}

.tarif-pricelist table th,
.tarif-pricelist table td {
    border-left: 5px solid #f2f2f2;
    padding: 16px 10px 8px 10px;
    vertical-align: middle;
    text-align: center
}

.tarif-pricelist table thead td {
    border-bottom: 5px solid #f2f2f2
}

.tarif-pricelist table tbody td {
    padding: 0 10px 32px 10px
}

.tarif-pricelist table tbody tr:first-child td {
    padding-top: 1em
}

.tarif-pricelist table th:first-child,
.tarif-pricelist table td:first-child {
    border-left: 0
}

.triangle-down {
    position: relative
}

.triangle-down:after {
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #ffffff;
    position: absolute;
    content: "";
    z-index: 1;
    top: 100%;
    left: 50%;
    margin-left: -20px
}

.triangle-down.section-gray:after {
    border-top-color: #f2f2f2
}

.triangle-down.section-gray-dark:after {
    border-top-color: #e6e6e6
}

.triangle-down.section-gray-verydark:after {
    border-top-color: #4b4b4b
}

.triangle-down.section-black:after {
    border-top-color: #0b0e3f
}

.triangle-down.section-magenta:after {
    border-top-color: #e20074
}

.triangle-down.section-cyan:after {
    border-top-color: #64b9e4
}

.triangle-down.section-blue:after {
    border-top-color: #16B7FB
}

.triangle-down.section-green:after {
    border-top-color: #b1ba67
}

.triangle-down.section-yellow:after {
    border-top-color: #fdd167
}

.triangle-down.section-orange:after {
    border-top-color: #eda95a
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5
}

#offlinechatbox textarea.text {
    width: 100%;
    padding: 5px 10px;
    font: normal 14px/20px 'Open Sans', Arial, sans-serif;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    color: #4b4b4b
}

#offlinechatbox input.text {
    font: normal 14px/20px 'Tele-groteskfet', Arial, sans-serif;
    padding: 5px 10px 5px 30px;
    margin-bottom: 5px;
    border: 1px solid #d0d0d0;
    border-color: #777 #d0d0d0 #ddd;
    -webkit-box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #ededed;
    -moz-box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #ededed;
    -o-box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #ededed;
    box-shadow: 0 0 0 4px transparent, inset 0 1px 1px 1px #ededed;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    -ms-transition: all .2s ease;
    transition: all .2s ease;
    border-radius: 0;
    width: 100%
}

#offlinechatbox input.text:focus,
#offlinechatbox textarea:focus {
    border: 1px solid #e20074;
    outline: none !important;
    -webkit-box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #ededed;
    -moz-box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #ededed;
    -o-box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #ededed;
    box-shadow: 0 0 4px 2px #ffdeef, inset 0 1px 1px 1px #ededed
}

#offlinechatbox .input-phone {
    background-image: url(https://static.hrvatskitelekom.hr/webresources/css/i/icons/phone.png);
    background-repeat: no-repeat;
    background-position: 8px 50%;
    background-size: 12px 16px;
    padding-left: 30px
}

#offlinechatbox .input-user {
    background-image: url(https://static.hrvatskitelekom.hr/webresources/css/i/icons/user.png);
    background-repeat: no-repeat;
    background-position: 8px 50%;
    background-size: 15px 16px;
    padding-left: 30px
}

#offlinechatbox .input-email {
    background-image: url(https://static.hrvatskitelekom.hr/webresources/css/i/icons/email.png);
    background-repeat: no-repeat;
    background-position: 8px 50%;
    background-size: 17px 11px;
    padding-left: 30px
}

#offlinechatbox .input-radio {
    float: left;
    margin: 3px 5px 0 -20px
}

#offlinechatbox a.button-magenta {
    font: normal 0.875em/2.5 'Tele-groteskfet', Arial, sans-serif;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: .05em;
    width: 100%
}

#offlinechatbox p.uppercase {
    text-transform: uppercase
}

#offlinechatbox .message {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    margin: 0 auto 20px;
    max-width: 960px;
    padding: 35px 20px 15px;
    text-align: left;
    width: 100%;
    text-align: center;
    color: #6bb324
}

#offlinechatbox .message-confirmation {
    color: #6bb324
}

#offlinechatbox div.user-select.biz {
    margin-left: 20px
}

#offlinechatbox div.radio {
    float: left
}

#offlinechatbox input.text.error {
    border-color: red;
    border-width: 2px
}

.t-centers {
    width: 100%;
    border-collapse: collapse;
    margin: 15px 0 0
}

.t-centers thead td {
    color: #333;
    border-bottom: none;
    border-top: none;
    padding: 0 10px
}

.t-centers thead td.table-divide {
    height: 5px
}

.t-centers tbody tr:nth-child(odd) {
    background: #f0f0f0
}

.t-centers tbody th {
    color: #666;
    font-weight: normal;
    text-align: left;
    padding: 6px 8px;
    border-bottom: 1px solid #ccc;
    border-top: 1px solid #ccc;
    width: 50%
}

.t-centers thead th {
    text-align: left;
    padding: 0px 8px
}

.t-centers thead td {
    color: #666;
    padding: 10px;
    text-align: left
}

.t-centers tbody td {
    color: #666;
    padding: 10px;
    border-bottom: 1px solid #ccc;
    text-align: left;
    border-top: 1px solid #ccc
}

.t-centers.solo tbody tr:nth-child(odd) {
    background-color: #fff
}

select.centers-select {
    border: 1px solid #ddd;
    padding: 5px;
    margin: 0 0 0 6px
}

.tooltip-simple {
    display: inline-block;
    font-size: 16px;
    font-size: 1rem;
    position: relative;
    background: transparent url(../images/info-gray.png) no-repeat 0 0;
    width: 24px;
    height: 24px;
    top: 0.25em;
    text-transform: none
}

.tooltip-link {
    display: inline-block;
    position: relative
}

.tooltip-simple>span,
.tooltip-link>span {
    display: none !important;
    text-align: left !important;
    position: absolute;
    text-align: left;
    letter-spacing: 0;
    z-index: 20;
    bottom: 1.5em;
    left: 50%;
    margin-left: -7.5em;
    width: 16em;
    border: 0.25em solid #e5e5e5;
    -moz-border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    border-radius: 0.25rem;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    color: #333;
    font: normal 14px/normal Tele-grotesk !important;
    font: normal 0.875rem/normal Tele-grotesk !important;
    padding: 0.5em 0.75em;
    background: #fff;
    -moz-box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.75);
    -webkit-box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.75);
    box-shadow: 0 0 1em 0 rgba(0, 0, 0, 0.75);
    cursor: default
}

.tooltip-simple:hover span,
.tooltip-link:hover span {
    display: block !important
}

.message-bar {
    float: left;
    display: inline;
    clear: both;
    width: 980px;
    margin: 0 0 27px;
    font-weight: bold;
    font-size: 22px;
    line-height: 27px;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5);
    background: url(i/boxes/silver-box-sides-XXL.png) repeat-y 0 0
}

.message-bar:after {
    content: " ";
    display: block;
    clear: both;
    height: 0;
    font-size: 0;
    visibility: hidden
}

.message-bar .inner {
    background: url(i/boxes/silver-box-bottom-XXL.png) no-repeat 0 100%
}

.message-bar .sides {
    padding: 27px 20px 27px 81px;
    background: url(i/boxes/confirmation-box-top-XXL.png) no-repeat 0 0
}

.message-bar .sides:after {
    content: " ";
    display: block;
    clear: both;
    height: 0;
    font-size: 0;
    visibility: hidden
}

.message-bar a {
    color: #e20074 !important
}

#confirmation {
    background-image: url(i/boxes/green-bar-sides.png)
}

#confirmation .inner {
    background-image: url(i/boxes/green-bar-bottom.png)
}

#confirmation .sides {
    background-image: url(i/boxes/green-bar-top.png)
}

#error .inner {
    background-image: url(i/boxes/red-bar-bottom.png)
}

#error .sides {
    background-image: url(i/boxes/red-bar-top.png)
}

#suspended {
    color: #dd0072;
    text-shadow: 0 1px 0 #fff;
    background-image: url(i/boxes/silver-bar-sides.png)
}

#suspended .inner {
    background-image: url(i/boxes/silver-bar-bottom.png)
}

#suspended .sides {
    background-image: url(i/boxes/silver-bar-top.png)
}

.prednosti-kupnje-alternative {
    position: relative;
    clear: both;
    cursor: pointer;
    height: 6.250em;
    margin: 0 0 1.25em;
    padding-top: 0.5em
}

.prednosti-kupnje-alternative ul {
    margin: 0.7em 0 0;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.prednosti-kupnje-alternative>ul>li {
    width: 16.2%;
    float: left;
    display: inline;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.prednosti-kupnje-alternative>ul>li:first-child {
    width: 35%;
    background: none
}

.prednosti-kupnje-alternative h3 {
    color: #ffffff;
    font: 2.750em/0.909em Headline-ult;
    text-transform: uppercase
}

.prednosti-kupnje-alternative h3 span {
    font-family: Headline
}

.prednosti-kupnje-alternative h4 {
    color: #ffffff;
    font: 1em/1 Tele-groteskHal;
    text-align: center;
    text-transform: uppercase
}

.prednosti-kupnje-alternative img {
    display: block;
    width: 4.688em;
    margin: 0 auto 0.6em auto
}

@media screen and (max-width: 767px) {
    .prednosti-kupnje-alternative>ul>li:first-child {
        display: none
    }
    .prednosti-kupnje-alternative>ul>li {
        width: 25%
    }
    .prednosti-kupnje-alternative>ul>li img {
        width: 50%
    }
}

.pok {
    display: none;
    left: 50%;
    margin-left: -22.875em;
    top: 6em;
    z-index: 99999;
    background-color: #ffffff;
    width: 43.750em;
    border: 1px solid #b3b3b3;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    padding: 1em;
    position: absolute;
    -webkit-box-shadow: 0px 0px 30px 20px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 0px 30px 20px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 0px 30px 20px rgba(50, 50, 50, 0.5)
}

.pok h1 {
    font: 3.250em/1 Headline-ult;
    margin: 0 0 0.3em 0;
    text-transform: uppercase;
    color: #000000
}

.pok .advantage-container {
    border-bottom: 1px solid #b3b3b3;
    padding: 1em 0 0;
    float: left;
    width: 100%
}

.pok .advantage-container.last {
    border-bottom: none
}

.pok .advantage-container.advantage-info {
    border: none
}

.pok .advantage-container img {
    margin: 0 0 1em
}

.pok .advantage-container .icon {
    float: left;
    width: 18%;
    margin: 0 2% 0 0;
    text-align: center
}

.pok .advantage-container .text {
    float: left;
    width: 80%
}

.pok .advantage-container h3 {
    font: 2.000em/1 Headline-ult;
    text-transform: uppercase;
    margin: 0 0 0.5em;
    color: #000000
}

.pok .advantage-container h4 {
    font: 1.25em/1 Headline;
    text-transform: uppercase;
    margin: 0 0 0.75em;
    color: #000000
}

.pok .advantage-container h3+h4 {
    margin-top: -0.75em
}

.pok .advantage-container p {
    color: #666666;
    font: 1.125em/1.25 Tele-grotesk;
    margin: 0 0 1em
}

.pok .advantage-container a {
    color: #11a4ff;
    text-decoration: underline
}

.pok .advantage-container h5 {
    color: #444444;
    font: 1.125em/1 Tele-groteskFet
}

.pok .advantage-container ul {
    margin: 0 0 1em 0;
    padding: 0 0 0 1em
}

.pok .advantage-container ul li {
    color: #666666;
    display: list-item;
    float: none;
    font: 1.125em/1.2 Tele-grotesk;
    margin: 0;
    padding: 0;
    width: auto
}

.pok-close {
    position: absolute;
    top: 0;
    right: 0;
    margin: 1em 1em 0 0;
    padding: 0.30em 0 0;
    display: block;
    width: 1.875em;
    height: 1.575em;
    text-transform: uppercase;
    color: #ffffff;
    background-color: #515151;
    border-radius: 50%;
    text-align: center
}

.pok-close:hover {
    cursor: pointer
}

.pok-arrow-top {
    display: none;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #2f2f2f;
    font-size: 0;
    line-height: 0
}

.pok-min {
    display: none;
    overflow: visible !important;
    width: 21em;
    padding: 1em;
    position: absolute;
    left: 54%;
    top: 8em;
    z-index: 2;
    background-color: #ffffff;
    border: 1px solid #b3b3b3;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 30px 20px rgba(50, 50, 50, 0.5);
    -moz-box-shadow: 0px 0px 30px 20px rgba(50, 50, 50, 0.5);
    box-shadow: 0px 0px 30px 20px rgba(50, 50, 50, 0.5)
}

.pok-min h1 {
    color: #222222;
    font: 1.375em/1 Tele-groteskFet;
    margin: 0 0 0.727em 0
}

.pok-min .advantage-container-min img {
    margin: 0 0 1em 0;
    width: auto
}

.pok-min h5 {
    color: #222222;
    font: 1em/1 Tele-groteskFet;
    margin: 0 0 0.3em 0;
    text-transform: uppercase
}

.pok-min .advantage-container-min ul {
    padding: 0 0 0 2em;
    margin: 0 0 0.5em 0
}

.pok-min .advantage-container-min ul li {
    color: #444444;
    display: list-item;
    float: none;
    font: 1em/1 Tele-grotesk;
    margin: 0;
    padding: 0;
    width: auto
}

.pok-arrow {
    background: url("../images/ostalo/pok-arrow.png") no-repeat right center;
    display: block;
    height: 0.813em;
    width: 1.625em;
    position: absolute;
    top: -0.813em;
    left: 1.3em
}

.pok-trigger {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: transparent url(../images/tooltip_prepaid.png) no-repeat scroll center bottom
}

.pok.split-pok {
    width: 30em;
    margin-left: -16em
}

.pok.split-pok .icon {
    display: none
}

.pok.split-pok .advantage-container .text {
    width: 100%
}

.pok.split-pok p {
    font-size: 1em
}

.pok.split-pok h1 {
    font-size: 2.5em
}

.pok.split-pok h3 {
    font-size: 1.75em
}

.atss {
    position: fixed;
    top: 40%;
    right: 0;
    z-index: 89
}

.atss a img,
.atss div img {
    display: block;
    position: relative
}

.atss div a,
.atss div div {
    white-space: nowrap;
    position: relative;
    display: block;
    width: auto;
    padding: 0;
    margin: 0 0 15px;
    background: none !important;
    cursor: pointer;
    letter-spacing: -0.25px
}

.atss div.service1 a:before,
.atss div.service2 div:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    padding: 30px 15px;
    color: White;
    text-transform: uppercase
}

.atss div.service1 a:before {
    content: "nazovite me";
    left: 0;
    z-index: 0;
    background: #57baef;
    transition: .25s ease-in-out
}

.atss div.service2 div:before {
    content: "chat";
    left: 0;
    z-index: 0;
    background: #bec94f;
    transition: .25s ease-in-out;
    height: 80px
}

.atss div.service1:hover a:before,
.atss div.service2:hover div:before {
    left: -112px;
    transition: .45s ease-in-out;
    text-align: center
}

.atss div.service2:hover div:before {
    left: -85px;
    padding: 30px 25px;
    transition: .25s ease-in-out;
    text-align: center;
    position: absolute
}

@media screen and (max-width: 768px) {
    .atss div.service1 a::before,
    .atss div.service2 div::before {
        display: none
    }
    .atss div a,
    .atss div div {
        width: 45px !important
    }
    .atss a img {
        width: 100%
    }
}

.jingle-section {
    padding: 0 !important
}

.jingle-banner {
    width: 100%
}

.jingle-left,
.jingle-right {
    width: 50%;
    float: left;
    padding-bottom: 18%
}

.jingle-left {
    position: relative;
    float: left;
    background: url("https://static.hrvatskitelekom.hr/webresources/images/jingle-banner/vukovarska-jingle-left.jpg") no-repeat right top;
    background-size: cover
}

.jingle-right {
    position: relative;
    float: right;
    background: url("https://static.hrvatskitelekom.hr/webresources/images/jingle-banner/vukovarska-jingle-right.jpg") no-repeat left top;
    background-size: cover
}

.jingle-title {
    position: absolute;
    top: 50%;
    font-family: "Headline";
    font-size: 3em;
    color: #fff;
    width: 100%;
    max-width: 500px
}

.jingle-title strong {
    font-family: "Headline-ULT"
}

.jingle-left .jingle-title {
    top: 50%;
    right: 5%;
    text-align: right;
    margin-top: -37px
}

.jingle-right .jingle-title {
    top: 50%;
    left: 5%;
    text-align: left
}

@media only screen and (max-width: 960px) {
    .jingle-title {
        font-size: 2em;
        line-height: 1em;
        margin-top: -30px
    }
}

@media only screen and (max-width: 768px) {
    .jingle-right {
        width: 20%
    }
    .jingle-left {
        width: 80%
    }
    .jingle-banner br {
        display: block
    }
}

@media only screen and (max-width: 460px) {
    .jingle-right {
        display: none
    }
    .jingle-left {
        width: 100%
    }
    .jingle-left,
    .jingle-right {
        padding-bottom: 40%
    }
    .jingle-left .jingle-title {
        margin-top: -30px;
        text-align: center;
        right: auto
    }
}

.note-under {
    display: inline;
    position: relative;
    cursor: pointer
}

.note-under:after {
    content: "";
    position: absolute;
    display: block;
    right: -1.25em;
    top: 50%;
    margin: -3.5px 0 0 0;
    width: 13px;
    height: 7px;
    background: transparent url(https://static.hrvatskitelekom.hr/webresources/images/design/up-down-13.png) no-repeat 0 0
}

.note-under.active:after {
    background-position: 0 -7px
}

.mo {
    font-family: Tele-GroteskFet !important;
    color: #e20074 !important;
    white-space: nowrap;
    text-transform: capitalize !important
}

input[type="radio"]+label span.css-input,
input[type="checkbox"]+label span.css-input {
    display: inline-block;
    width: 24px;
    height: 32px;
    margin: -4px 10px 0 0;
    vertical-align: middle;
    background: url(/webresources/css/i/check-radio-sheet.png) left top no-repeat;
    cursor: pointer
}

@media screen and (max-width: 767px) {
    input[type="radio"]+label span.css-input,
    input[type="checkbox"]+label span.css-input {
        display: block;
        margin: 0 auto
    }
}

input[type="radio"]+label span.css-input {
    background: url(/webresources/css/i/check-radio-sheet.png) -60px 0 no-repeat
}

input[type="checkbox"]+label span.css-input {
    background: url(/webresources/css/i/check-radio-sheet.png) -4px 0 no-repeat
}

input[type="radio"]:checked+label span.css-input {
    background: url(/webresources/css/i/check-radio-sheet.png) -88px 0 no-repeat
}

input[type="checkbox"]:checked+label span.css-input {
    background: url(/webresources/css/i/check-radio-sheet.png) -32px 0 no-repeat
}

@media only screen and (max-width: 599px) {
    .section,
    .page-header {
        padding: 0
    }
    .page-header .grid,
    .section .grid,
    .page-header+.section .grid,
    #quick-actions-existing-customers .grid {
        padding: 20px
    }
    img,
    .figure-tv img {
        max-width: 100% !important
    }
    .button {
        width: auto;
        max-width: 350px
    }
    .buttons-next .button {
        margin-left: 0
    }
    .buttons-prev .button,
    .buttons-next .button {
        width: 100%
    }
    .button-mega+.button-mega {
        margin-left: 0
    }
    .learn-more-box-bottom .button {
        width: 100%
    }
    .field-flex .button {
        width: 100%;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px;
        border-radius: 4px
    }
    .button-mega {
        font-size: 14px;
        line-height: 24px;
        height: 36px
    }
    .buttons .button-mega {
        margin-bottom: 20px !important
    }
    .longdesc {
        display: none !important
    }
    br {
        display: none
    }
    .table-wrapper table .number {
        white-space: normal
    }
    .xxs {
        font-size: 10px !important;
        line-height: 15px !important
    }
    .xs {
        font-size: 12px !important;
        line-height: 20px !important
    }

    .sm {
    font-size: 17px !important;
    line-height: 1.38 !important;
}

    p {
    font-weight: 500
}


    h4,
    h3,
    .s,
    .m {
        font-size: 18px !important;
        line-height: 20px !important
    }
    h2,
    .l {
        font-size: 23px !important;
        line-height: 30px !important;
        font-weight: 500;
    }

    h1,
    .xl {
        font-size: 32px !important;
        line-height: 38px !important
    }

    h1,
    .xxxxl {
        font-size: 44px !important;
        line-height: 60px !important
    }

    h3, .mobxl
    {
        font-size: 36px !important;
        line-height: 45px !important
    }

    .xxl,
    .xxxl,
     {
        font-size: 32px !important;
        line-height: 38px !important
    }
    .price .xxl {
        font-size: 2.8125em !important;
        line-height: 1.111em !important
    }
    .drop-cap {
        font-size: 2.833em !important;
        line-height: .911666em !important
    }
    .text-right {
        text-align: left
    }
    .box-item-icon.text-right {
        background-position: 0 0
    }
    .page-header {
        text-align: left;
        padding-top: 0 !important
    }
    .page-header-cta {
        padding-top: 10px
    }
    .page-header-cta .button {
        display: block
    }
    .page-header-cta .button+.button {
        margin-top: 10px
    }
    .section-header {
        padding: 0;
        margin-bottom: 10px !important;
        text-align: left
    }
    .section-story .section-header+ol,
    .section-story .section-header+.list-features {
        margin-top: 0
    }
    .box-item {
        border-right: 0 !important
    }
    .box-item-icon {
        margin-bottom: 40px !important
    }
    .float-left,
    .float-right {
        float: none
    }
    .pipe {
        display: block;
        font-size: 0;
        height: 0;
        line-height: 0;
        overflow: hidden
    }
    .section-content {
        width: 100% !important
    }
    .packages-overview-2-items table {
        width: 150%
    }
    .packages-overview-3-items table {
        width: 250%
    }
    .packages-overview-4-items table {
        width: 350%
    }
    .packages-overview-5-items table {
        width: 450%
    }
    .packages-overview-6-items table {
        width: 550%
    }
    .packages-overview-7-items table {
        width: 650%
    }
    .packages-overview-8-items table {
        width: 750%
    }
    .packages-overview-9-items table {
        width: 850%
    }
    .layout-focus {
        background: #fff
    }
    .form-focus {
        max-width: 400px
    }
    .field-error label:before {
        margin: 0 5px 0 0
    }
    .wizard-steps {
        counter-reset: item;
        margin: 0
    }
    .wizard-steps ol {
        margin: 0
    }
    .wizard-steps li {
        counter-increment: item;
        text-align: left;
        position: absolute;
        left: -9999px
    }
    .wizard-steps li.current {
        position: static;
        left: 0
    }
    .wizard-steps li a,
    .wizard-steps li span {
        display: block;
        margin: 0;
        padding: 0 20px;
        background: none !important
    }
    .wizard-steps li a:before,
    .wizard-steps li span:before {
        content: "Korak " counter(item) " od 5: ";
        color: #000;
        white-space: nowrap
    }
    .offer-reminder li {
        padding-left: 1em
    }
    .advanced-options {
        padding: 15px 0;
        margin-left: 0;
        margin-right: 0;
        background: none
    }
    .advanced-options li {
        padding-right: 0
    }
    .table-comparison thead th {
        height: 180px;
        vertical-align: middle
    }
    .table-comparison thead th span {
        display: block;
        width: 150px;
        text-align: left;
        -webkit-transform: rotate(-90deg);
        -moz-transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
        -o-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }
    #layout-empty-cart h1 {
        margin: 0;
        padding: 0;
        background-position: 0 0;
        padding-top: 170px
    }
    .key-information li {
        display: block;
        width: 100%;
        margin: 0 0 10px
    }
    .key-information li strong {
        font-weight: bold
    }
    .key-information li {
        border-left: 1px solid #e20074
    }
    .key-information .small-note {
        padding-bottom: 10px
    }
    .list-features li,
    .list-features-tabular li {
        font-size: 16px !important;
        line-height: 20px !important
    }
    .list-features li {
        margin-bottom: 10px !important
    }
    #max-paketi-promo-image {
        text-align: left
    }
    .section-story p,
    .section-story li {
        font-size: 16px !important;
        line-height: 20px !important
    }
    .footer_menu>li {
        width: 50%;
        padding-right: 20px;
        padding-bottom: 20px
    }
    .footer_menu>li:nth-child(odd) {
        clear: both
    }
    .message {
        padding: 20px 20px 10px
    }
    .message p {
        font-size: 16px;
        line-height: 20px
    }
    .product-horizontal {
        border: 1px solid #d0d0d0;
        margin: 10px 0 !important
    }
    .product-horizontal .product-image,
    .product-horizontal .product-description {
        max-width: 350px;
        padding: 20px 10px 0;
        margin: 0 auto
    }
    .product-horizontal .product-image img {
        max-width: 200px !important;
        margin: 0 auto
    }
    .product-horizontal .actions .button {
        width: 100%
    }
    .product-horizontal .actions .button+.button {
        margin-top: 10px
    }
    .actions a {
        display: block
    }
    .actions a+a {
        margin-top: 10px
    }
    .field-select-products .box-product-basic .product-image img {
        width: 100%;
        max-width: 300px !important;
        margin-bottom: 10px
    }
    #max-paketi-promo .grid {
        padding-top: 40px
    }
    #max-paketi-promo .grid:before {
        left: 40px
    }
    #section-self-care .button {
        width: 100% !important
    }
    #section-self-care .list-actions li {
        text-align: center
    }
    .table-rwd tr th,
    .table-rwd tr td,
    .table-rwd tr {
        display: block;
        width: 100%
    }
    .table-rwd thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px
    }
    .table-rwd table {
        border-top: 0 !important
    }
    .table-rwd tr {
        border-top: 1px solid #000;
        overflow: auto
    }
    .table-rwd tr th:first-child,
    .table-rwd tr td:first-child {
        border-top: 0
    }
    .table-rwd tfoot tr {
        border-top-color: #e20074;
        overflow: auto
    }
    .table-rwd tr.subrow {
        border: 0
    }
    .table-rwd tr.subrow th:first-child,
    .table-rwd tr.subrow td:first-child {
        border-top: 1px solid #d0d0d0
    }
    .table-rwd td {
        border: none
    }
    .table-rwd td:before {
        content: attr(data-tr);
        display: block
    }
    .table-final-price tbody th,
    .table-final-price tbody td {
        padding-left: 2px;
        padding-right: 2px
    }
    .table-final-price tbody th {
        text-transform: uppercase
    }
    .table-order-specification .instalments,
    .table-final-price .instalments {
        text-align: left !important
    }
    .table-order-specification .instalments,
    .table-final-price .instalments,
    .table-order-specification .number,
    .table-final-price .number {
        float: left;
        width: 50%
    }
    .table-final-price .number[colspan] {
        float: none;
        width: 100%
    }
    .table-order-specification .title-row {
        padding: 0
    }
    .box-service-overview .eye-catcher {
        width: 100%;
        max-width: 1000px !important;
        position: static !important;
        top: auto !important;
        right: auto !important
    }
    .table-rwd-pairs th,
    .table-rwd-pairs td {
        float: left;
        display: inline;
        width: 50%
    }
    .table-rwd-pairs th {
        padding-left: 0 !important
    }
    .table-rwd-pairs th:last-child,
    .table-rwd-pairs td {
        padding-right: 0 !important
    }
    .box-trust-comforting-tiny ul li {
        padding: 0 20px
    }
    .box-trust-comforting-tiny a,
    .box-trust-comforting-tiny span {
        padding-left: 40px !important
    }
    .section-scream .drop-cap {
        display: block
    }
    .section-scream .box-item {
        clear: both;
        margin-top: 20px
    }
    #najbolji-maxtv-sadrzaj h1 br {
        display: block !important
    }
    #why-ht-header h1 br {
        display: block !important
    }
}

@media only screen and (max-width: 599px) and (min-width: 500px) and (max-width: 599px) {
    .box-item {
        float: left;
        width: 47.5% !important;
        margin-left: 5%
    }
    .box-item:first-child,
    .box-item:nth-child(2n+3) {
        border-left: 0;
        clear: both;
        margin-left: 0
    }
}

@media only screen and (min-width: 600px) {
    .shortdesc {
        display: none
    }
    .page-header:after {
        content: '';
        display: table;
        clear: both
    }
    .page-header-desc {
        float: left;
        width: 55%
    }
    .page-header-cta {
        float: right;
        padding-top: 10px;
        text-align: right
    }
    .page-header-cta .button {
        float: left;
        margin: 0 0 10px 5px
    }
    .service-promo {
        float: left;
        width: 45%;
        padding-bottom: 20px
    }
    .service-infographic {
        float: right;
        width: 45%;
        padding-bottom: 20px
    }
    .cta-service-upgrade {
        clear: both;
        text-align: center
    }
    .list-thumbnail-abstract li:after {
        content: '';
        display: table;
        clear: both
    }
    .list-thumbnail-abstract li img {
        float: left;
        width: 100%;
        max-width: 200px;
        margin: 0 10px .2em 0
    }
    .list-thumbnail-abstract li .tarif-option-desc {
        float: left
    }
    .list-thumbnail-abstract li .actions {
        float: right
    }
    .list-device-box,
    .box-item {
        float: left;
        width: 30%;
        margin-left: 5%;
        margin-bottom: 5%
    }
    .box-group-50>.box-item,
    .box-group-25>.box-item,
    .box-group-20>.box-item {
        width: 47.5%
    }
    .box-group-33>.box-item {
        width: 30%
    }
    .box-group>.box-item:first-child,
    .box-group-20>.box-item:nth-child(2n+3),
    .box-group-25>.box-item:nth-child(2n+3),
    .box-group-33>.box-item:nth-child(3n+4),
    .box-group-50>.box-item:nth-child(2n+3) {
        border-left: 0;
        clear: both;
        margin-left: 0
    }
    .box-item-icon {
        margin-bottom: 20px !important
    }
    .icon-empty {
        background: none !important
    }
    .box-group-banners .box-banner {
        width: 50%
    }
    .box-group-banners .box-banner a {
        border-top: 2px solid #fff
    }
    .box-group-banners .box-banner-1,
    .box-group-banners .box-banner-3 {
        clear: left
    }
    .box-group-banners .box-banner-2 a,
    .box-group-banners .box-banner-4 a {
        border-left: 2px solid #fff
    }
    .box-item img {
        width: 100%
    }
    .box-group+.box-group {
        margin-top: 40px
    }
    .box-item-device-simple,
    .multiservice-package,
    .box-group-services {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-pack: justify;
        -webkit-justify-content: space-between;
        justify-content: space-between
    }
    .box-item-device-simple a.link-tile,
    .multiservice-package-subservice,
    .box-service-overview {
        -webkit-flex: 1;
        flex: 1;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column
    }
    .multiservice-package-subservice .list-features {
        margin-bottom: auto
    }
    .box-item-device-simple a.link-tile .prices {
        margin-top: auto
    }
    .box-item-device-simple a.link-tile .device-image:after {
        display: block;
        content: ' ';
        width: 33%;
        height: 5px;
        margin: 30px auto 0;
        background: #000;
        opacity: .1;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        -ms-border-radius: 100%;
        -o-border-radius: 100%;
        border-radius: 100%;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease
    }
    .box-item-device-simple a.link-tile:hover .device-image:after {
        opacity: .025;
        width: 50%;
        height: 10px;
        margin-top: 25px !important
    }
    .link-tile h1 {
        margin-bottom: 0
    }
    .list-features-split {
        padding-left: 0 !important
    }
    .list-features-split li:before {
        content: none
    }
    .list-features-split li.odd {
        float: left;
        width: 45%;
        clear: both
    }
    .list-features-split li.even {
        float: right;
        text-align: right;
        width: 45%
    }
    .list-features-columns,
    .list-actions-columns {
        padding-left: 0 !important;
        -webkit-column-count: 3;
        -moz-column-count: 3;
        -ms-column-count: 3;
        -o-column-count: 3;
        column-count: 3;
        -webkit-column-gap: 30px;
        -moz-column-gap: 30px;
        -ms-column-gap: 30px;
        -o-column-gap: 30px;
        column-gap: 30px
    }
    .list-features-columns li:before {
        content: none
    }
    .cta-option-01 {
        width: 33.33333333% !important
    }
    .cta-option-02 {
        width: 66.66666666% !important
    }
    .layout-focus .page-header .grid {
        padding-top: 40px;
        padding-bottom: 20px
    }
    .layout-focus .section .grid {
        min-width: 560px;
        max-width: 60%;
        margin: 0 auto;
        padding: 40px 0 60px !important
    }
    .fields-pair {
        display: flex;
        width: 100%;
        flex-flow: row;
        align-items: stretch
    }
    .field-inline {
        float: left;
        width: 50%;
        padding-right: 20px
    }
    .box-product-basic {
        max-width: 100%
    }
    .box-product-basic:after {
        content: '';
        display: table;
        clear: both
    }
    .box-product-basic .product-image {
        float: left;
        width: 33.33333333%;
        padding: 0 20px
    }
    .box-product-basic .product-image img {
        width: 100%;
        max-width: 100%
    }
    .box-product-basic .product-desc {
        float: left;
        width: 66.66666666%
    }
    .product-horizontal .product-image {
        float: left;
        width: 35%
    }
    .product-horizontal-alt .product-image {
        float: right
    }
    .product-horizontal .product-image img {
        width: 100%
    }
    .product-horizontal .product-description {
        float: left;
        width: 65%
    }
    .product-horizontal .actions .button+.button {
        margin-top: .625rem
    }
    .title-row h2,
    .preview-panel-header h2 {
        float: left
    }
    .title-row .edit-link,
    .preview-panel-header .edit-link {
        float: right
    }
    .form-focus {
        max-width: 600px
    }
    .form-focus fieldset {
        max-width: 1000px;
        padding: 0 140px;
        padding: 0 8.75rem
    }
    .buttons-prev {
        float: left
    }
    .buttons-next {
        float: right
    }
    .field {
        position: relative
    }
    .footer_menu>li {
        width: 33.33333333%;
        padding-bottom: 20px
    }
    .footer_menu>li:nth-child(4) {
        clear: both
    }
    .box-trust-comforting-tiny ul {
        display: inline-block;
        width: auto;
        margin: 10px auto;
        text-align: center
    }
    .box-trust-comforting-tiny li {
        display: inline-block;
        width: auto;
        margin: 0
    }
    .box-trust-comforting-tiny a,
    .box-trust-comforting-tiny span {
        padding-left: 30px
    }
}

@media only screen and (min-width: 600px) and (min-width: 600px) and (max-width: 959px) {
    .table-comparison thead th {
        height: 180px;
        vertical-align: middle
    }
    .table-comparison thead th span {
        display: block;
        width: 150px;
        text-align: left;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
        filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3)
    }
    #section-self-care .grid {
        padding-bottom: 2.5rem;
        background-position: 100% 100%
    }
    #section-customer-support .grid {
        padding-bottom: 2.5rem;
        background-position: 120% 100%
    }
    #section-self-care .section-content ul {
        padding-right: 300px
    }
    #section-customer-support .section-content ul {
        padding-right: 400px
    }
}

@media only screen and (min-width: 960px) {
    .carousel-item {
        position: relative;
        background: green
    }
    .carousel-item:after {
        content: '';
        display: table;
        clear: both
    }
    .carousel-tabs ul {
        border: 1px solid #d0d0d0;
        border-top: 0;
        -webkit-border-radius: 0 0 4px 4px;
        -moz-border-radius: 0 0 4px 4px;
        -ms-border-radius: 0 0 4px 4px;
        -o-border-radius: 0 0 4px 4px;
        border-radius: 0 0 4px 4px
    }
    .carousel-tabs ul:after {
        content: '';
        display: table;
        clear: both
    }
    .carousel-tabs li {
        list-style: none;
        float: left;
        border-left: 1px solid #d0d0d0
    }
    .carousel-tabs li:first-child {
        border: 0
    }
    .carousel-3-tabs li {
        width: 33.33333333%
    }
    .carousel-4-tabs li {
        width: 25%
    }
    .carousel-tabs li a {
        display: block;
        padding: 20px;
        font-weight: 600;
        font-size: 14px
    }
    .carousel-tabs li a img {
        float: none;
        display: block;
        margin-bottom: 10px
    }
    .section-left-right .figure {
        width: 47.5%;
        background: none
    }
    .section-left-right .section-content {
        width: 47.5%
    }
    .section-left-right .list-features {
        margin-left: 1.5em
    }
    .section-33-66 .figure {
        width: 30%;
        background: none
    }
    .section-33-66 .section-content {
        width: 60%
    }
    .layout-focus .section-header h2 {
        float: left
    }
    .section-header .edit-link {
        float: right;
        text-transform: none;
        padding-top: 5px
    }
    .section-service-overview .section-header {
        float: left;
        width: 100%;
        padding-bottom: 30px;
        margin-bottom: 30px;
        border-bottom: 1px solid #d0d0d0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1)
    }
    .section-service-overview.section-magenta .section-header {
        border-bottom-color: #fff;
        border-bottom-color: rgba(255, 255, 255, 0.75)
    }
    .section-service-overview .box-item {
        margin-bottom: 0
    }
    .section-header-desc {
        float: left;
        width: 65.66666666%
    }
    .section-header-actions {
        float: right;
        width: 31.33333333%;
        margin-left: 3%;
        padding-top: 20px;
        text-align: right
    }
    #overview-customer-support .section-header {
        border-bottom: 0
    }
    .box-group+h1,
    #homepage-newsletter-form {
        margin-top: 60px
    }
    #homepage-newsletter-form {
        padding-left: 34.33333333%;
        background: url(i/illustrations/newsletter-discounts.png) no-repeat 170px 14px
    }
    .section .sub-section {
        border-top: 1px solid #d0d0d0;
        padding-top: 40px
    }
    #why-ht-mega-link a.area-link {
        display: block;
        padding: 40px 0;
        color: #fff;
        text-decoration: none;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease
    }
    #why-ht-mega-link a.area-link p {
        display: inline-block;
        border-bottom: 1px solid #fff
    }
    #why-ht-mega-link a.area-link:hover {
        background: #b5015c
    }
    #why-ht-mega-link a.area-link:hover p {
        border-bottom-color: #b5015c
    }
    #why-ht-mega-link .circle {
        width: 200px;
        height: 200px;
        line-height: 200px !important;
        margin-bottom: 40px;
        color: #e20074;
        background: #fff;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease
    }
    #why-ht-mega-link a:hover .circle {
        color: #b5015c
    }
    #why-ht-header p br {
        display: block
    }
    #hop {
        padding-top: 0
    }
    #hop .grid {
        padding-top: 20px
    }
    #h1-why-ht-hop {
        width: 300px;
        margin: 0 auto
    }
    #h1-why-ht-hop:after {
        content: '';
        display: table;
        clear: both
    }
    #h1-why-ht-hop .h,
    #h1-why-ht-hop .o,
    #h1-why-ht-hop .p {
        float: left;
        width: 33.33333333%
    }
    #h1-why-ht-hop .h,
    #h1-why-ht-hop .p {
        margin-top: 78px
    }
    #h1-why-ht-hop .h {
        text-align: right
    }
    #h1-why-ht-hop .p {
        text-align: left
    }
    #h1-why-ht-hop .o {
        height: 200px;
        width: 90px;
        background: url(i/illustrations/hop.png?v=12345) no-repeat 50% 100%;
        background-size: 70px 128px;
        text-indent: -9999px;
        overflow: hidden
    }
    .section:hover #h1-why-ht-hop .o {
        -webkit-animation: jump_start 0.8s 1, jump 0.85s 3 0.8s, jump_stop 0.85s 1 3.35s;
        -moz-animation: jump_start 0.8s 1, jump 0.85s 3 0.8s, jump_stop 0.85s 1 3.35s;
        -ms-animation: jump_start 0.8s 1, jump 0.85s 3 0.8s, jump_stop 0.85s 1 3.35s;
        -o-animation: jump_start 0.8s 1, jump 0.85s 3 0.8s, jump_stop 0.85s 1 3.35s;
        animation: jump_start 0.8s 1, jump 0.85s 3 0.8s, jump_stop 0.85s 1 3.35s
    }
    @-webkit-keyframes jump_start {
        0% {
            background-position: 50% 100%;
            background-size: 70px 128px
        }
        100% {
            background-position: 50% 100%;
            background-size: 70px 80px
        }
    }
    @keyframes jump_start {
        0% {
            background-position: 50% 100%;
            background-size: 70px 128px
        }
        100% {
            background-position: 50% 100%;
            background-size: 70px 80px
        }
    }
    @-webkit-keyframes jump {
        0% {
            background-position: 50% 100%;
            background-size: 70px 128px
        }
        50% {
            background-position: 50% 2px
        }
        55% {
            background-position: 50% 0
        }
        80% {
            background-position: 50% 100%;
            background-size: 70px 110px
        }
        100% {
            background-position: 50% 100%;
            background-size: 70px 90px
        }
    }
    @keyframes jump {
        0% {
            background-position: 50% 100%;
            background-size: 70px 128px
        }
        50% {
            background-position: 50% 2px
        }
        55% {
            background-position: 50% 0
        }
        80% {
            background-position: 50% 100%;
            background-size: 70px 110px
        }
        100% {
            background-position: 50% 100%;
            background-size: 70px 90px
        }
    }
    @-webkit-keyframes jump_stop {
        0% {
            background-size: 70px 128px
        }
        20% {
            background-size: 70px 150px
        }
        35% {
            background-size: 70px 128px
        }
        50% {
            background-size: 70px 140px
        }
        60% {
            background-size: 70px 128px
        }
        70% {
            background-size: 70px 130px
        }
        80% {
            background-size: 70px 128px
        }
    }
    @keyframes jump_stop {
        0% {
            background-size: 70px 128px
        }
        20% {
            background-size: 70px 150px
        }
        35% {
            background-size: 70px 128px
        }
        50% {
            background-size: 70px 140px
        }
        60% {
            background-size: 70px 128px
        }
        70% {
            background-size: 70px 130px
        }
        80% {
            background-size: 70px 128px
        }
    }
    .icon-sn-M a:hover,
    .icon-sn-L a:hover {
        margin-top: -20px;
        padding-bottom: 20px
    }
    .col-50 {
        float: left;
        width: 50%
    }
    .col-33 {
        float: left;
        width: 33.33333333%
    }
    .col-40 {
        float: left;
        width: 40%
    }
    .col-60 {
        float: left;
        width: 60%
    }
    .col-66 {
        float: left;
        width: 66.66666666%
    }
    .col-right {
        float: right
    }
    .col-left {
        float: left
    }
    #zasto-ht-header-05-b .col-left {
        margin-bottom: -30px !important
    }
    #zasto-ht-header-05-b .col-right {
        padding-top: 90px
    }
    #zasto-ht-header-05-c {
        position: relative
    }
    #zasto-ht-header-05-c-content {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        padding-top: 80px !important;
        text-align: center;
        color: #fff
    }
    #pokrivenost-signalom {
        position: relative
    }
    #pokrivenost-signalom-content {
        position: absolute;
        top: 520px;
        left: 50%;
        width: 480px;
        margin: 0 0 150px
    }
    .box-item-device-simple .device-image {
        padding: 20px 0
    }
    .box-item-device-simple h1 {
        clear: both
    }
    .box-item-device-simple .eye-catcher {
        top: -30px
    }
    .box-item-device-simple a.link-tile {
        -webkit-transition: background 0.3s ease;
        -moz-transition: background 0.3s ease;
        -ms-transition: background 0.3s ease;
        -o-transition: background 0.3s ease;
        transition: background 0.3s ease
    }
    .box-item-device-simple a.link-tile .device-image img {
        position: relative;
        top: 0;
        -webkit-transition: top 0.2s ease;
        -moz-transition: top 0.2s ease;
        -ms-transition: top 0.2s ease;
        -o-transition: top 0.2s ease;
        transition: top 0.2s ease
    }
    .box-item-device-simple a.link-tile:hover .device-image img {
        top: -1em
    }
    .box-item-device-simple-alt a.link-tile .device-image img {
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -ms-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease
    }
    .box-item-device-simple-alt a.link-tile:hover .device-image img {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg)
    }
    .figure-left {
        background: none;
        max-width: 400px;
        float: left;
        margin: 0 40px 10px 0
    }
    .figure-right {
        background: none;
        max-width: 400px;
        float: right;
        margin: 0 0 10px 40px
    }
    .figure-tv {
        position: relative;
        width: 840px;
        height: 490px;
        padding: 25px 25px 94px;
        padding: 20px;
        margin: 0 auto 60px !important;
        background: #000;
        -webkit-box-shadow: 0 0 200px 0 rgba(0, 255, 255, 0.2);
        -moz-box-shadow: 0 0 200px 0 rgba(0, 255, 255, 0.2);
        -ms-box-shadow: 0 0 200px 0 rgba(0, 255, 255, 0.2);
        -o-box-shadow: 0 0 200px 0 rgba(0, 255, 255, 0.2);
        box-shadow: 0 0 200px 0 rgba(0, 255, 255, 0.2);
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px;
        border-radius: 4px
    }
    .figure-tv:after {
        position: relative;
        content: ' ';
        display: block;
        width: 500px;
        height: 20px;
        margin: 0 auto;
        bottom: -30px;
        background: #000;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px;
        border-radius: 4px
    }
    .section-black .figure-tv {
        -webkit-box-shadow: 0 0 200px 10px rgba(255, 255, 255, 0.2);
        -moz-box-shadow: 0 0 200px 10px rgba(255, 255, 255, 0.2);
        -ms-box-shadow: 0 0 200px 10px rgba(255, 255, 255, 0.2);
        -o-box-shadow: 0 0 200px 10px rgba(255, 255, 255, 0.2);
        box-shadow: 0 0 200px 10px rgba(255, 255, 255, 0.2)
    }
    .figure-tv img {
        position: static !important;
        width: 800px;
        height: 450px !important
    }
    .footer_menu>li {
        width: 20%;
        clear: none !important
    }
    .message {
        padding-left: 100px;
        padding-right: 100px;
        text-align: center
    }
    .hero {
        position: relative;
        z-index: 1;
        min-height: 300px
    }
    .hero:after {
        content: '';
        display: table;
        clear: both
    }
    .hero img {
        float: left;
        width: 100%
    }
    .hero h1 {
        text-transform: uppercase;
        line-height: 30px;
        line-height: 1.875rem;
        margin-bottom: 10px;
        margin-bottom: .625rem
    }
    .hero p {
        line-height: 20px;
        line-height: 1.25rem;
        margin: 0 0 20px;
        margin-bottom: 1.25rem
    }
    .hero .buttons {
        margin-bottom: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.5)
    }
    .hero .box-purple {
        position: absolute;
        width: 100%;
        max-width: 320px
    }
    .hero .box-purple-bottom-left {
        bottom: 20px;
        left: 20px
    }
    .hero .box-purple-bottom-right {
        bottom: 20px;
        right: 20px
    }
    .hero .box-purple-top-left {
        top: 20px;
        left: 20px
    }
    .hero .box-purple-top-right {
        top: 20px;
        right: 20px
    }
    .box-purple:after {
        content: '';
        position: absolute;
        z-index: 1;
        display: block;
        width: 110%;
        height: 105%;
        background: rgba(226, 0, 116, 0.5)
    }
    .box-purple:before {
        content: '';
        position: absolute;
        z-index: 1;
        display: block;
        width: 95%;
        height: 110%;
        background: rgba(226, 0, 116, 0.5)
    }
    .box-purple-top-left:after {
        left: 0;
        top: 0
    }
    .box-purple-top-left:before {
        left: 0;
        top: 0
    }
    .box-purple-top-right:after {
        right: 0;
        top: 0
    }
    .box-purple-top-right:before {
        right: 0;
        top: 0
    }
    .box-purple-bottom-left:after {
        left: 0;
        bottom: 0
    }
    .box-purple-bottom-left:before {
        left: 0;
        bottom: 0
    }
    .box-purple-bottom-right:after {
        right: 0;
        bottom: 0
    }
    .box-purple-bottom-right:before {
        right: 0;
        bottom: 0
    }
    .box-purple:after {
        -webkit-animation: flow_box_purple_after 15s infinite;
        -moz-animation: flow_box_purple_after 15s infinite;
        -ms-animation: flow_box_purple_after 15s infinite;
        -o-animation: flow_box_purple_after 15s infinite;
        animation: flow_box_purple_after 15s infinite
    }
    .box-purple:before {
        -webkit-animation: flow_box_purple_before 20s infinite;
        -moz-animation: flow_box_purple_before 20s infinite;
        -ms-animation: flow_box_purple_before 20s infinite;
        -o-animation: flow_box_purple_before 20s infinite;
        animation: flow_box_purple_before 20s infinite
    }
    @-webkit-keyframes flow_box_purple_before {
        0%,
        100% {
            width: 95%;
            height: 110%
        }
        25% {
            width: 110%;
            height: 110%
        }
        50% {
            width: 120%;
            height: 90%
        }
        75% {
            width: 105%;
            height: 95%
        }
    }
    @-moz-keyframes flow_box_purple_before {
        0%,
        100% {
            width: 95%;
            height: 110%
        }
        25% {
            width: 110%;
            height: 110%
        }
        50% {
            width: 110%;
            height: 90%
        }
        75% {
            width: 120%;
            height: 90%
        }
    }
    @-o-keyframes flow_box_purple_before {
        0%,
        100% {
            width: 95%;
            height: 110%
        }
        25% {
            width: 110%;
            height: 110%
        }
        50% {
            width: 110%;
            height: 90%
        }
        75% {
            width: 120%;
            height: 90%
        }
    }
    @keyframes flow_box_purple_before {
        0%,
        100% {
            width: 95%;
            height: 110%
        }
        25% {
            width: 110%;
            height: 110%
        }
        50% {
            width: 110%;
            height: 90%
        }
        75% {
            width: 120%;
            height: 90%
        }
    }
    @-webkit-keyframes flow_box_purple_after {
        0%,
        100% {
            width: 110%;
            height: 105%
        }
        25% {
            width: 115%;
            height: 110%
        }
        50% {
            width: 125%;
            height: 89%
        }
    }
    @-moz-keyframes flow_box_purple_after {
        0%,
        100% {
            width: 110%;
            height: 105%
        }
        25% {
            width: 115%;
            height: 110%
        }
        50% {
            width: 125%;
            height: 89%
        }
    }
    @-o-keyframes flow_box_purple_after {
        0%,
        100% {
            width: 110%;
            height: 105%
        }
        25% {
            width: 115%;
            height: 110%
        }
        50% {
            width: 125%;
            height: 89%
        }
    }
    @keyframes flow_box_purple_after {
        0%,
        100% {
            width: 110%;
            height: 105%
        }
        25% {
            width: 115%;
            height: 110%
        }
        50% {
            width: 125%;
            height: 89%
        }
    }
    .eye-catcher {
        width: 150px;
        position: absolute;
        top: 0;
        left: auto;
        bottom: auto;
        right: 0;
        text-align: left;
        -webkit-transform: rotate(-7.5deg);
        -moz-transform: rotate(-7.5deg);
        -ms-transform: rotate(-7.5deg);
        -o-transform: rotate(-7.5deg);
        transform: rotate(-7.5deg)
    }
    .hero .eye-catcher,
    .hero .eye-catcher-top-right {
        top: 20px;
        right: 20px;
        left: auto;
        bottom: auto
    }
    .hero .eye-catcher-top-left {
        top: 20px;
        left: 20px;
        bottom: auto;
        right: auto
    }
    .hero .eye-catcher-bottom-right {
        top: auto;
        left: auto;
        bottom: 20px;
        right: 20px
    }
    .hero .eye-catcher-bottom-left {
        top: auto;
        right: auto;
        bottom: 20px;
        left: 20px
    }
    .box-max-package .price-saving {
        position: relative
    }
    .box-max-package .eye-catcher {
        top: -120px;
        right: -10px;
        padding: 10px 15px
    }
    .box-item {
        position: relative;
        float: left;
        width: 31.33333333%;
        margin-left: 3%
    }
    .box-group-50>.box-item {
        width: 46.5%;
        margin-left: 6% !important
    }
    .box-group-33>.box-item {
        width: 31.33333333%
    }
    .box-group-25>.box-item {
        width: 22.75%
    }
    .box-group-20>.box-item {
        width: 17.6%
    }
    .box-group .box-item:nth-child(n) {
        clear: none;
        margin-left: 3%
    }
    .box-group>.box-item:first-child,
    .box-group-20>.box-item:nth-child(5n+6),
    .box-group-25>.box-item:nth-child(4n+5),
    .box-group-33>.box-item:nth-child(3n+4),
    .box-group-50>.box-item:nth-child(2n+3) {
        border-left: 0;
        clear: both;
        margin-left: 0 !important
    }
    .section-scream .box-item {
        margin-bottom: 40px
    }
    #home-wifi-devices .box-group {
        padding-left: 330px;
        background: url(i/illustrations/home-wifi-network.png) no-repeat 0 20px
    }
    #home-wifi-devices .box-item {
        padding-right: 2% !important
    }
    .box-group-banners .box-banner {
        width: 25%;
        clear: none
    }
    .box-group-banners .box-banner a {
        border-left: 2px solid #fff
    }
    .box-group-banners .box-banner-1 a {
        border-left: 0
    }
    #section-self-care .grid {
        padding-bottom: 40px;
        padding-bottom: 2.5rem;
        background: url(/img/self-care/moj-telekom-devices-280.png) no-repeat 40px 30px
    }
    #section-customer-support .grid {
        padding-bottom: 40px;
        padding-bottom: 2.5rem;
        background: url(/img/customer-support/customer-support.jpg) no-repeat 100% 100%;
        background-size: 500px 320px
    }
    #section-self-care .section-content {
        padding-left: 40%
    }
    #section-customer-support .section-content {
        padding-right: 40%
    }
}

@media only screen and (min-width: 960px) and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-width: 960px) and (min-resolution: 192dpi) {
    #internet-homepage-header .illustration {
        background-image: url(i/illustrations/internet-globe-@2x.png);
        background-size: 155px 141px
    }
    #kako-kupovati-online-header .illustration {
        background-image: url(i/illustrations/cart-@2x.png);
        background-size: 151px 139px
    }
    #why-ht-header .illustration {
        background-image: url(i/illustrations/why-ht-@2x.png);
        background-size: 110px 141px
    }
    #home-wifi-devices .box-group {
        background-image: url(i/illustrations/home-wifi-network-@2x.png);
        background-size: 280px 350px
    }
    #podrska-chat .grid {
        background: url(i/illustrations/customer-support-280x320-white.png) no-repeat 10% 50%;
        background-size: 140px 160px
    }
    #section-self-care .grid {
        background-image: url(/img/self-care/moj-telekom-devices-280-@2x.png);
        background-size: 280px auto
    }
    #h1-why-ht-hop .o {
        background-image: url(i/illustrations/hop-@2x.png)
    }
}

@media only screen and (min-width: 960px) {
    #dev-links {
        display: block;
        width: 400px;
        position: fixed;
        bottom: 0;
        top: 0;
        left: -390px;
        background: #def7ff;
        border-right: 10px solid #8ce0fc;
        overflow: auto;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
        z-index: 9999
    }
    #dev-links:hover {
        left: 0
    }
    #dev-links li {
        list-style: none;
        font-size: 12px;
        line-height: 20px;
        text-transform: uppercase
    }
    #dev-links li a {
        display: block;
        color: #000;
        padding: 5px 20px
    }
    #dev-links li a:hover {
        background: #fff
    }
    #dev-links li.current a {
        font-weight: bold;
        background: #8ce0fc
    }
    .section-scream {
        background-repeat: no-repeat
    }
    .page-header .illustration {
        position: relative;
        margin: 0 auto -140px;
        width: 220px;
        height: 220px;
        background-color: #fff;
        background-repeat: no-repeat;
        background-position: 50% 50%;
        z-index: 20
    }
    #why-ht-header .illustration {
        position: relative;
        margin: 0 auto -130px;
        height: 180px;
        background-image: url(i/illustrations/why-ht.png)
    }
    #kako-kupovati-online-header .illustration {
        position: relative;
        margin: 0 auto -140px;
        background-image: url(i/illustrations/cart.png)
    }
    #internet-homepage-header .illustration {
        position: relative;
        margin: 0 auto -140px;
        background-image: url(i/illustrations/internet-globe.png)
    }
    #kako-kupovati-online-header+.section .grid,
    #internet-homepage-header+.section .grid {
        padding-top: 120px
    }
    .link-back {
        margin-bottom: 20px
    }
    #internet-svugdje-i-uvijek {
        position: relative
    }
    .box-indented-33 {
        clear: both;
        padding-left: 34.33333333%
    }
    .box-indented-33 .drop-cap {
        margin-left: -50%;
        margin-right: 0 !important;
        width: 47.5%;
        text-align: right
    }
    .illustration-huge {
        background-repeat: no-repeat;
        background-position: 50% 50%;
        background-size: auto 250px;
        height: 250px;
        margin: 3em 0 3em;
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        -o-transition: all 1s ease;
        transition: all 1s ease;
        position: relative;
        top: -128px;
        opacity: 0
    }
    .illustration-huge:before,
    .illustration-huge:after {
        content: ' ';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        height: 256px;
        width: 100%;
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        -o-transition: all 1s ease;
        transition: all 1s ease
    }
    .activate-animation .illustration-huge {
        top: 0;
        opacity: 1
    }
    #overview-mobile-services .illustration-huge {
        background-image: url(i/illustrations/mobile-256-white.png)
    }
    #overview-mobile-services .illustration-huge:after {
        top: 256px;
        background-image: url(i/illustrations/mobile-content-960x256-white.png)
    }
    #overview-mobile-services.activate-animation .illustration-huge:after {
        top: 0
    }
    #overview-max-bundles .illustration-huge {
        height: 140px;
        background-image: url(i/illustrations/max-bundles-960x256-magenta.png);
        top: 0;
        left: -960px
    }
    #overview-max-bundles.activate-animation .illustration-huge {
        left: 0
    }
    #overview-internet-services .illustration-huge {
        background-image: url(i/illustrations/globe-500-magenta.png)
    }
    #overview-internet-services .illustration-huge:after {
        background-image: url(i/illustrations/internet-content-960x256.png)
    }
    #overview-internet-services.activate-animation .illustration-huge:after {
        -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
        transition: none;
        -webkit-animation: illustration_huge_after_scale_wait 1s 1, illustration_huge_after_scale 5s 1;
        -moz-animation: illustration_huge_after_scale_wait 1s 1, illustration_huge_after_scale 5s 1;
        -ms-animation: illustration_huge_after_scale_wait 1s 1, illustration_huge_after_scale 5s 1;
        -o-animation: illustration_huge_after_scale_wait 1s 1, illustration_huge_after_scale 5s 1;
        animation: illustration_huge_after_scale_wait 1s 1, illustration_huge_after_scale 5s 1
    }
    #overview-maxtv .illustration-huge {
        background-image: url(i/illustrations/tv-256x330-magenta.png)
    }
    #overview-maxtv .illustration-huge:after {
        left: 960px;
        background-image: url(i/illustrations/tv-content-960x256.png)
    }
    #overview-maxtv.activate-animation .illustration-huge:after {
        left: 0
    }
    @keyframes illustration_huge_after_scale_wait {
        0%,
        100% {
            opacity: 0
        }
    }
    @keyframes illustration_huge_after_scale {
        0% {
            opacity: 0;
            -webkit-transform: scale(0.85);
            -moz-transform: scale(0.85);
            -ms-transform: scale(0.85);
            -o-transform: scale(0.85);
            transform: scale(0.85)
        }
        100% {
            opacity: 1;
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -ms-transform: scale(1);
            -o-transform: scale(1);
            transform: scale(1)
        }
    }
    #overview-telefon .illustration-huge {
        height: 201px;
        margin-bottom: -40px;
        top: 0;
        background: url(i/illustrations/telefon-content-960x256.png) no-repeat 50% 50%
    }
    #overview-telefon .illustration-huge:before {
        width: 256px;
        left: -500px;
        background: url(i/illustrations/telefon-left-256x256.png) no-repeat 50% 50%
    }
    #overview-telefon .illustration-huge:after {
        width: 256px;
        left: auto;
        right: -500px;
        background: url(i/illustrations/telefon-right-256x256.png) no-repeat 50% 50%
    }
    #overview-telefon.activate-animation .illustration-huge:before {
        left: 0
    }
    #overview-telefon.activate-animation .illustration-huge:after {
        right: 0
    }
    #overview-telefon.activate-animation .illustration-huge {
        -webkit-animation: hover_infinite 3s 1;
        -moz-animation: hover_infinite 3s 1;
        -ms-animation: hover_infinite 3s 1;
        -o-animation: hover_infinite 3s 1;
        animation: hover_infinite 3s 1
    }
    @keyframes hover_infinite {
        0% {
            background-position: -40px 50%
        }
        100% {
            background-position: 0 50%
        }
    }
    #overview-elektricna-energija {
        -webkit-transition: all 1s ease;
        -moz-transition: all 1s ease;
        -ms-transition: all 1s ease;
        -o-transition: all 1s ease;
        transition: all 1s ease
    }
    #overview-elektricna-energija .illustration-huge {
        background-image: url(i/illustrations/elektricna-960x256.png)
    }
    #overview-elektricna-energija.activate-animation {
        background-size: 100% 400px
    }
    #overview-elektricna-energija .illustration-huge:after {
        background-image: url(i/illustrations/elektricna-content-960x256.png)
    }
    #overview-promotivne-akcije .illustration-huge,
    #overview-promotivne-akcije .bkp_illustration-huge {
        background-image: url(i/illustrations/promo-960x256.png)
    }
    #overview-promotivne-akcije .illustration-huge:after {
        opacity: 0;
        top: -256px;
        background-image: url(i/illustrations/promo-content-960x256.png)
    }
    #overview-promotivne-akcije.activate-animation .illustration-huge:after {
        opacity: 1;
        top: 0
    }
    #overview-promotivne-akcije .pseudo-form {
        max-width: 450px;
        margin: 0 auto
    }
    #overview-customer-support .illustration-huge {
        background-image: url(i/illustrations/customer-support-960x256.png)
    }
    #podrska-chat .grid {
        padding-left: 300px;
        background: url(i/illustrations/customer-support-140x160-white.png) no-repeat 10% 50%;
        background-size: 140px 160px
    }
    #homepage-header {
        background: url(i/title-shadow-white-@2x.png) no-repeat 50% 100%;
        background-size: 960px auto
    }
    #why-ht-ultramax-optika {
        color: #000;
        background-color: #000;
        padding-top: 200px;
        background-color: #e6e6e6;
        background-image: url(i/illustrations/speedy-gonzales.png);
        background-repeat: no-repeat;
        background-position: 50% 100px;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease
    }
    #why-ht-ultramax-optika:hover {
        -webkit-animation: speedy_gonzales 0.5s infinite;
        -moz-animation: speedy_gonzales 0.5s infinite;
        -ms-animation: speedy_gonzales 0.5s infinite;
        -o-animation: speedy_gonzales 0.5s infinite;
        animation: speedy_gonzales 0.5s infinite
    }
    @-webkit-keyframes speedy_gonzales {
        0% {
            background-position: -1000px 100px
        }
        100% {
            background-position: 2000px 100px
        }
    }
    @keyframes speedy_gonzales {
        0% {
            background-position: -1000px 100px
        }
        100% {
            background-position: 2000px 100px
        }
    }
}

@media only screen and (max-width: 40rem) {
    .no-small {
        display: none
    }
}

@media only screen and (max-width: 64rem) {
    .no-medium {
        display: none
    }
}

@media only screen and (max-width: 90rem) {
    .no-large {
        display: none
    }
}

.row .page-header {
    margin: 24px 12px;
    margin: 1.5rem .75rem
}

.equal-height {
    height: 100%
}

.equal-height>ul>li {
    margin-bottom: 5px
}

.filterbox {
    padding: 4px;
    padding: .25rem;
    margin: 24px 0px;
    margin: 1.5rem 0rem
}

.filterbox .input-select {
    padding: 4px;
    padding: .25rem;
    text-align: center;
    text-transform: uppercase;
    border: 0;
    -webkit-box-shadow: 0;
    -moz-box-shadow: 0;
    -ms-box-shadow: 0;
    -o-box-shadow: 0;
    box-shadow: 0;
    cursor: pointer
}

.filterbox .input-select:focus {
    background: #4b4b4b;
    color: white
}

.filter-killer button {
    font-size: 16px;
    background: none;
    border: none;
    color: #a4a4a4;
    font-family: Tele-Grotesk;
    padding-right: 20px;
    margin-right: 30px;
    position: relative;
    cursor: pointer
}

.filter-killer button:after {
    display: block;
    position: absolute;
    content: "x";
    right: 0;
    top: -3px;
    font-size: 20px;
    font-family: tele-groteskFet;
    color: #999
}

.button-2016 {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    line-height: 24px;
    line-height: 1.5rem;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    display: inline-block;
    vertical-align: bottom;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
    height: 36px;
    width: 100%;
    max-width: 305px;
    transition: all 0.3s ease 0s;
    padding: 6px 20px;
    padding: .375rem 1.25rem;
    color: #333;
    background: #e5e5e5;
    background: #fff;
    font: normal 18px/1.22 Tele-grotesk;
    text-transform: uppercase;
    margin: 0;
    letter-spacing: -0.25px;
    background-image: -webkit-linear-gradient(15deg, #e5e5e5, #fff);
    background-image: -moz-linear-gradient(15deg, #e5e5e5, #fff);
    background-image: -ms-linear-gradient(15deg, #e5e5e5, #fff);
    background-image: -o-linear-gradient(15deg, #e5e5e5, #fff);
    background-image: linear-gradient(15deg, #e5e5e5, #fff);
    -webkit-transition: all 0.1s ease;
    -moz-transition: all 0.1s ease;
    -ms-transition: all 0.1s ease;
    -o-transition: all 0.1s ease;
    transition: all 0.1s ease
}

.button-2016:hover {
    text-decoration: none;
    -webkit-opacity: .75;
    -moz-opacity: .75;
    -ms-opacity: .75;
    -o-opacity: .75;
    opacity: .75
}

.button-2016.button-2016-magenta {
    color: #fff;
    background-image: -webkit-linear-gradient(15deg, #e20074, #fe319b);
    background-image: -moz-linear-gradient(15deg, #e20074, #fe319b);
    background-image: -ms-linear-gradient(15deg, #e20074, #fe319b);
    background-image: -o-linear-gradient(15deg, #e20074, #fe319b);
    background-image: linear-gradient(15deg, #e20074, #fe319b)
}

.button-2016.button-2016-orange {
    color: #fff;
    background-image: -webkit-linear-gradient(15deg, #ed7004, #fea134);
    background-image: -moz-linear-gradient(15deg, #ed7004, #fea134);
    background-image: -ms-linear-gradient(15deg, #ed7004, #fea134);
    background-image: -o-linear-gradient(15deg, #ed7004, #fea134);
    background-image: linear-gradient(15deg, #ed7004, #fea134)
}

.button-2016.button-2016-border {
    color: #fff;
    background: transparent;
    border: 2px solid #fff;
    padding: .325rem 1.25rem
}

.button-2016.button-2016-border-magenta {
    color: #e20074;
    background: transparent;
    border: 2px solid #e20074;
    padding: .325rem 1.25rem
}

.button-2016.button-2016-border-bw {
    color: #000;
    background: transparent;
    border: 2px solid #000;
    padding: .325rem 1.25rem
}

.button-2016.button-2016-large {
    padding: 10px 4px;
    text-align: center;
    height: 46px;
    max-width: 360px;
    font-size: 20px
}

.button-2016.button-2016-large-short {
    padding: 10px 40px;
    text-align: center;
    height: 46px;
    font-size: 20px;
    width: auto;
    max-width: 100%
}

.button-2016.button-2016-short {
    width: auto;
    max-width: 100%
}

.button-2016.button-2016-continue-right {
    width: 100%;
    max-width: 100%;
    padding: 13px;
    height: auto
}

.button-section {
    margin-top: -37px;
    position: relative;
    padding: 0 1rem 1rem;
    padding: 0 16px 16px;
    width: 100%
}

@media only screen and (max-width: 767px) {
    .button-section {
        margin-top: 0
    }
}

.device-list {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap
}

.device-list .columns {
    margin-bottom: 20px
}

.device-list .device-item {
    position: relative;
    background: #fff;
    height: 100%;
    display: block;
    padding: 24px 16px;
    padding: 1.5rem 1rem
}

.device-list .device-item.unavailable {
    -webkit-opacity: .5;
    -moz-opacity: .5;
    -ms-opacity: .5;
    -o-opacity: .5;
    opacity: .5
}

.device-list .device-item.unavailable .price-tag,
.device-list .device-item.unavailable .discount {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%)
}

.device-list .device-item.unavailable .discount {
    height: 2.5em
}

.device-list .device-item.home {
    padding: 16px 16px 42px 16px;
    padding: 1rem 1rem 2.625rem 1rem;
    background: #e6e6e6;
    width: 100%;
    max-height: 460px
}

.device-list .device-item.home .device-title {
    height: 18px
}

.device-list .device-item.home .price-tag {
    margin-bottom: 10px
}

@media only screen and (max-width: 640px) {
    .device-list .device-item.home {
        max-height: 480px
    }
}

.device-list.row .row {
    margin-left: 0;
    margin-right: 0
}

.device-list .banner-items {
    padding: 0
}

.device-list .banner-items .item {
    background: #427BAB;
    height: 25%;
    margin-bottom: 14px;
    padding: 35px
}

.device-list .banner-items .item p {
    color: #fff
}

.device-list .banner-items .item:last-child {
    margin-bottom: 0
}

.device-list .banner-items.confort-items .confort-ico {
    -webkit-filter: grayscale(100%) invert(100%);
    -moz-filter: grayscale(100%) invert(100%);
    -ms-filter: grayscale(100%) invert(100%);
    -o-filter: grayscale(100%) invert(100%);
    filter: grayscale(100%) invert(100%)
}

.device-list .button-2016 {
    width: 100%;
    max-width: 350px;
    margin-top: 0px;
    margin-top: 0rem
}

.device-list .device-title {
    height: 43.2px;
    height: 2.7rem;
    overflow: hidden;
    font-family: Tele-GroteskUlt
}

.device-list .discount {
    height: 48px;
    height: 3rem;
    overflow: hidden
}

.device-list .dodles {
    position: absolute;
    top: 40%;
    right: 10px
}

.device-list .device-colours {
    list-style-type: none
}

.device-list .device-colours li {
    display: inline-block;
    border: 1px solid #333;
    margin: 0 4px;
    width: 12px;
    height: 12px;
    position: relative;
    z-index: 2
}

.device-list .label-compare {
    cursor: pointer;
    display: block
}

.device-list input {
    margin: -3px 10px 0 0;
    position: relative;
    top: 2px
}

.device-list .device-image {
    position: relative;
    max-height: 380px;
    margin: 0 auto;
    overflow: hidden
}

.device-list .device-image br {
    display: block !important
}

.device-list .device-image img {
    max-height: 230px
}

@media only screen and (max-width: 768px) {
    .device-list .device-image img {
        max-height: 250px
    }
}

.tabbed-list.loco ul.nav {
    display: block
}

.tabbed-list.loco ul.nav li a {
    display: inline-block;
    color: #666;
    padding: 10px;
    width: 100%;
    text-align: center;
    font-size: 1em;
    text-transform: uppercase
}

.tabbed-list.loco .section-white ul.nav li a.current {
    background: #e6e6e6 !important;
    color: #333
}

.tabbed-list.loco .section-gray-dark ul.nav li a.current {
    background: #fff !important;
    color: #333
}

.banner-2016 {
    max-height: 345px;
    overflow: hidden
}

.banner-2016 .full {
    padding-bottom: 22%
}

.banner-2016-home {
    height: 460px;
    overflow: hidden;
    width: 100%
}

.banner-2016-home h1 {
    margin-top: 30px;
    font-size: 38px;
    transition: 1s ease
}

.banner-2016-home:hover h1 {
    margin-top: 0px;
    transition: .3s ease
}

.banner-2016-home .button-2016.button-2016-short {
    opacity: 0;
    transition: .4s ease
}

.banner-2016-home:hover .button-2016.button-2016-short {
    opacity: 1;
    transition: .5s ease .1s
}

@media only screen and (max-width: 1024px) {
    .banner-2016-home h1 {
        font-size: 24px !important;
        line-height: 1.5em !important
    }
}

@media only screen and (max-width: 880px) {
    .banner-2016-home {
        height: auto !important;
        background-size: 100% !important
    }
    .banner-2016-home .button-2016,
    .banner-2016-home h1 {
        display: none
    }
}

@media only screen and (max-width: 460px) {
    .banner-position-1 {
        max-width: 640px
    }
    .banner-position-2 {
        max-width: 640px
    }
    .banner-position-3 {
        max-width: 640px
    }
}

@media only screen and (max-width: 640px) {
    .custom-margin-home {
        margin-top: 10px !important;
        margin-top: .625rem !important
    }
}

.banner-home-custom {
    overflow: hidden;
    margin-bottom: 0 !important
}

.banner-home-custom a {
    text-decoration: none;
    color: #fff
}

.banner-home-custom a:hover {
    text-decoration: underline !important;
    color: #fff
}

.banner-home-custom .section-magenta,
.banner-home-custom .section-blue,
.banner-home-custom .section-lightblue,
.banner-home-custom .section-orange,
.banner-home-custom .section-green,
.banner-home-custom .section-yellow,
.banner-home-custom .section-gray-verydark {
    height: 220px
}

@media only screen and (max-width: 640px) {
    .banner-home-custom br {
        display: none
    }
    .banner-home-custom h3 {
        padding: 0 30px
    }
}

.home-sec-banners .banner-position-1 {
    max-width: 460px
}

.home-sec-banners .banner-position-2 {
    max-width: 660px
}

.home-sec-banners .banner-position-3 {
    max-width: 320px
}

@media only screen and (max-width: 1024px) {
    .home-sec-banners .banner-position-1 {
        max-width: 880px
    }
    .home-sec-banners .banner-position-2 {
        max-width: 880px
    }
    .home-sec-banners .banner-position-3 {
        max-width: 880px
    }
}

@media only screen and (max-width: 880px) {
    .home-sec-banners .banner-position-1 {
        max-width: 880px
    }
    .home-sec-banners .banner-position-2 {
        max-width: 880px
    }
    .home-sec-banners .banner-position-3 {
        max-width: 880px
    }
}

.banner-right-align {
    background-color: #e6e6e6 !important;
    overflow: hidden;
    position: relative;
    width: 100%;
    background-size: cover !important;
    max-height: 460px
}

.banner-right-align h2 {
    z-index: 2;
    transition: all .3s ease
}

@media only screen and (max-width: 640px) {
    .banner-right-align {
        max-height: 260px
    }
}

.banner-right-align .banner-title {
    position: absolute;
    right: 15px;
    top: 15px;
    color: White;
    text-align: right;
    width: 70%
}

.banner-right-align .banner-title.bw {
    color: Black
}

.banner-left-align {
    background-color: #e6e6e6 !important;
    overflow: hidden;
    position: relative;
    width: 100%;
    background-size: cover !important;
    max-height: 460px
}

@media only screen and (max-width: 640px) {
    .banner-left-align {
        margin-bottom: 10px;
        max-height: 260px
    }
}

.banner-left-align .banner-title {
    position: absolute;
    text-transform: uppercase;
    left: 15px;
    top: 15px;
    color: White;
    width: 70%
}

.banner-left-align .banner-title.black {
    color: Black
}

.banner-left-align .banner-title.magenta {
    color: #e20074
}

.section-gray .banner-left-align {
    background-color: #fff !important
}

.gallery .row {
    margin-bottom: 20px
}

.destiny {
    display: block;
    font-family: TeleGrotesk, arial, sans-serif;
    margin-top: 1%;
    position: relative
}

.destiny::before {
    content: "::";
    display: inline;
    font-family: TeleGrotesk, arial, sans-serif;
    letter-spacing: 3px;
    margin-right: 4px;
    position: relative;
    top: -1px
}

.story {
    margin: 0 auto;
    max-width: 640px
}

@media only screen and (max-width: 640px) {
    .story {
        padding: 0 1%
    }
}

.story-l {
    margin: 0 auto;
    max-width: 800px
}

@media only screen and (max-width: 800px) {
    .story-l {
        padding: 0 1%
    }
}

.section-triangle {
    position: relative;
    z-index: 9
}

.section-triangle:before {
    width: 0;
    height: 0;
    border-left: 34px solid transparent;
    border-right: 34px solid transparent;
    border-top: 20px solid #ffffff;
    position: absolute;
    content: "";
    z-index: 1;
    top: 0;
    left: 50%;
    margin-left: -34px
}

@media only screen and (max-width: 768px) {
    .section-triangle:before {
        border: none
    }
}

.section-triangle.section-triangle-gray:before {
    border-top-color: #e6e6e6
}

.section-triangle.section-triangle-graydark:before {
    border-top-color: #e6e6e6
}

.section-triangle.section-triangle-grayverydark:before {
    border-top-color: #4b4b4b
}

.section-triangle.section-triangle-black:before {
    border-top-color: #0b0e3f
}

.section-triangle.section-triangle-magenta:before {
    border-top-color: #823CFA
}

.section-triangle.section-triangle-cyan:before {
    border-top-color: #64b9e4
}

.section-triangle.section-triangle-blue:before {
    border-top-color: #168dfb
}

.section-triangle.section-triangle-green:before {
    border-top-color: #b1ba67
}

.section-triangle.section-triangle-yellow:before {
    border-top-color: #fdd167
}

.section-triangle.section-triangle-orange:before {
    border-top-color: #772098
}

.section-triangle.section-triangle-white:before {
    border-top-color: #fffcec
}

.banner-2016.section-triangle.section-triangle-white.section-triangle-parallax:after {
    display: block;
    content: "";
    padding: 12px;
    background: url(https://static.hrvatskitelekom.hr/webresources/images/antitrokut.png) 50%;
    position: absolute;
    bottom: 0;
    width: 100%
}

@media only screen and (max-width: 880px) {
    .banner-2016.section-triangle.section-triangle-white.section-triangle-parallax:after {
        display: none
    }
}

.list-icons {
    position: relative
}

.list-icons:before {
    content: "";
    display: block;
    position: absolute;
    width: 4.375em;
    height: 4.375em;
    top: -5.5em;
    left: -0.5em;
    background: transparent url(https://static.hrvatskitelekom.hr/webresources/images/icons/ig-speed-black.png) no-repeat 0 0
}

@media only screen and (max-width: 1027px) {
    .list-icons:before {
        top: 0;
        left: auto;
        right: 0
    }
}

.ico-section {
    border-left: 2px solid #e20074;
    padding-bottom: 3rem;
    text-align: left;
    padding-left: 1rem;
    min-height: 150px
}

.egger {
    text-transform: lowercase !important;
    width: 22px;
    height: 22px;
    background: #e20074;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    font-family: Tele-GroteskUlt;
    font-size: 15px;
    margin-left: 5px;
    display: inline-block;
    position: relative
}

.egger:after {
    display: block;
    content: "i";
    position: absolute;
    color: #fff;
    top: -8px;
    left: 8px
}

.egger.bw {
    background: #fff !important
}

.egger.bw:after {
    color: #e20074 !important
}

.smoothie {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.7;
    -webkit-filter: saturate(100%);
    -moz-filter: saturate(100%);
    -ms-filter: saturate(100%);
    -o-filter: saturate(100%);
    filter: saturate(100%);
    z-index: 0
}

.smoothie.smoothie-magenta {
    background-color: #e20074
}

.smoothie.smoothie-white {
    background-color: #fff
}

.smoothie.smoothie-white * {
    color: #333
}

.smoothie.smoothie-black {
    background-color: #000
}

@media only screen and (max-width: 880px) {
    .smoothie {
        width: 100%
    }
}

.msgbox-2016 {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    position: relative
}

.msgbox-2016:before,
.msgbox-2016:after {
    content: " ";
    display: table
}

.msgbox-2016:after {
    clear: both
}

.msgbox-2016.msgbox-2016-green {
    border: 1px solid #00d18a
}

.msgbox-2016.msgbox-2016-red {
    border: 1px solid #c30000
}

.msgbox-2016.msgbox-2016-orange {
    border: 1px solid #ffb400
}

.msgbox-2016 li {
    position: absolute;
    background: transparent url(https://static.hrvatskitelekom.hr/webresources/images/sprite/poruke-ikone-sprite.png) no-repeat 0 0;
    width: 60px;
    height: 60px;
    color: transparent;
    white-space: nowrap;
    display: inline-block;
    background-size: auto;
    top: 50%;
    margin-top: -30px
}

.msgbox-2016 li.r1s1 {
    background-position: 0 0
}

.msgbox-2016 li.r1s2 {
    background-position: -60px 0
}

.msgbox-2016 li.r1s3 {
    background-position: -120px 0
}

@media only screen and (max-width: 880px) {
    .msgbox-2016 li {
        left: 50%;
        margin-left: -30px;
        margin-top: 0;
        position: relative
    }
}

.msgbox-2016 .close {
    position: absolute;
    width: 25px;
    height: 25px;
    display: block;
    top: 10px;
    right: 10px;
    background-image: url(../images/ui.png);
    background-repeat: no-repeat;
    background-position: 0px -279px
}

.border-box-magenta {
    border: 1px solid #e20074;
    width: 100%
}

.border-box-gray {
    border: 1px solid #e6e6e6;
    width: 100%
}

.service-icons {
    list-style-type: none;
    text-align: center;
    width: 100%
}

.service-icons.left {
    text-align: left !important
}

@media only screen and (max-width: 640px) {
    .service-icons {
        text-align: left
    }
}

@media only screen and (min-width: 640px) and (max-width: 991px) {
    .service-icons {
        display: none
    }
}

.service-icons li {
    position: relative;
    background: transparent url(https://static.hrvatskitelekom.hr/webresources/images/sprite/service-icons.png) no-repeat 0 0;
    width: 60px;
    height: 60px;
    margin: 0 15px 0 0;
    color: transparent;
    white-space: nowrap;
    display: inline-block;
    background-size: auto
}

.service-icons li:after {
    content: "+";
    color: #666;
    font-size: 24px;
    font-size: 1.5rem;
    display: block;
    position: absolute;
    width: 15px;
    height: 15px;
    z-index: 999;
    right: -16px;
    top: 50%;
    margin-top: -10px
}

.service-icons li:last-child:after {
    display: none
}

.service-icons li.r1s1 {
    background-position: 0 0
}

.service-icons li.r1s2 {
    background-position: -60px 0
}

.service-icons li.r1s3 {
    background-position: -120px 0
}

.service-icons li.r1s4 {
    background-position: -180px 0
}

.service-icons li.r1s5 {
    background-position: -240px 0
}

.service-icons li.r1s6 {
    background-position: -300px 0
}

.service-icons li.r1s7 {
    background-position: -360px 0
}

.service-icons li.r1s8 {
    background-position: -420px 0
}

.service-icons li.r1s9 {
    background-position: -480px 0
}

.service-icons li.r1s10 {
    background-position: -540px 0
}

.service-icons li.r2s1 {
    background-position: 0 -60px
}

.service-icons li.r2s2 {
    background-position: -60px -60px
}

.service-icons li.r2s3 {
    background-position: -120px -60px
}

.service-icons li.r2s4 {
    background-position: -180px -60px
}

.service-icons li.r2s5 {
    background-position: -240px -60px
}

.service-icons li.r2s6 {
    background-position: -300px -60px
}

.service-icons li.r2s7 {
    background-position: -360px -60px
}

.service-icons li.r2s8 {
    background-position: -420px -60px
}

.service-icons li.r2s9 {
    background-position: -480px -60px
}

.service-icons li.r2s10 {
    background-position: -540px -60px
}

.service-icons li.r3s1 {
    background-position: 0 -120px
}

.service-icons li.r3s2 {
    background-position: -60px -120px
}

.service-icons li.r3s3 {
    background-position: -120px -120px
}

.service-icons li.r3s4 {
    background-position: -180px -120px
}

.service-icons li.r3s5 {
    background-position: -240px -120px
}

.service-icons li.r3s6 {
    background-position: -300px -120px
}

.service-icons li.r3s7 {
    background-position: -360px -120px
}

.service-icons li.r3s8 {
    background-position: -420px -120px
}

.service-icons li.r3s9 {
    background-position: -480px -120px
}

.service-icons li.r3s10 {
    background-position: -540px -120px
}

.service-icons li.r4s1 {
    background-position: 0 -180px
}

.service-icons li.r4s2 {
    background-position: -60px -180px
}

.service-icons li.r4s3 {
    background-position: -120px -180px
}

.service-icons li.r4s4 {
    background-position: -180px -180px
}

.service-icons li.r4s5 {
    background-position: -240px -180px
}

.service-icons li.r4s6 {
    background-position: -300px -180px
}

.service-icons li.r4s7 {
    background-position: -360px -180px
}

.service-icons li.r4s8 {
    background-position: -420px -180px
}

.service-icons li.r4s9 {
    background-position: -480px -180px
}

.service-icons li.r4s10 {
    background-position: -540px -180px
}

.service-icons li.r5s1 {
    background-position: 0 -240px
}

.service-icons li.r5s2 {
    background-position: -60px -240px
}

.service-icons li.r5s3 {
    background-position: -120px -240px
}

.service-icons li.r5s4 {
    background-position: -180px -240px
}

.service-icons li.r5s5 {
    background-position: -240px -240px
}

.service-icons li.r5s6 {
    background-position: -300px -240px
}

.service-icons li.r5s7 {
    background-position: -360px -240px
}

.service-icons li.r5s8 {
    background-position: -420px -240px
}

.service-icons li.r5s9 {
    background-position: -480px -240px
}

.service-icons li.r5s10 {
    background-position: -540px -240px
}

.service-icons li.r6s1 {
    background-position: 0 -300px
}

.service-icons li.r6s2 {
    background-position: -60px -300px
}

.service-icons li.r6s3 {
    background-position: -120px -300px
}

.service-icons li.r6s4 {
    background-position: -180px -300px
}

.service-icons li.r6s5 {
    background-position: -240px -300px
}

.service-icons li.r6s6 {
    background-position: -300px -300px
}

.service-icons li.r6s7 {
    background-position: -360px -300px
}

.service-icons li.r6s8 {
    background-position: -420px -300px
}

.service-icons li.r6s9 {
    background-position: -480px -300px
}

.service-icons li.r6s10 {
    background-position: -540px -300px
}

.service-icons li.r7s1 {
    background-position: 0 -360px
}

.service-icons li.r7s2 {
    background-position: -60px -360px
}

.service-icons li.r7s3 {
    background-position: -120px -360px
}

.service-icons li.r7s4 {
    background-position: -180px -360px
}

.service-icons li.r7s5 {
    background-position: -240px -360px
}

.service-icons li.r7s6 {
    background-position: -300px -360px
}

.service-icons li.r7s7 {
    background-position: -360px -360px
}

.service-icons li.r7s8 {
    background-position: -420px -360px
}

.service-icons li.r7s9 {
    background-position: -480px -360px
}

.service-icons li.r7s10 {
    background-position: -540px -360px
}

.service-icons li.r8s1 {
    background-position: 0 -420px
}

.service-icons li.r8s2 {
    background-position: -60px -420px
}

.service-icons li.r8s3 {
    background-position: -120px -420px
}

.service-icons li.r8s4 {
    background-position: -180px -420px
}

.service-icons li.r8s5 {
    background-position: -240px -420px
}

.service-icons li.r8s6 {
    background-position: -300px -420px
}

.service-icons li.r8s7 {
    background-position: -360px -420px
}

.service-icons li.r8s8 {
    background-position: -420px -420px
}

.service-icons li.r8s9 {
    background-position: -480px -420px
}

.service-icons li.r8s10 {
    background-position: -540px -420px
}

.service-icons li.r9s1 {
    background-position: 0 -480px
}

.service-icons li.r9s2 {
    background-position: -60px -480px
}

.service-icons li.r9s3 {
    background-position: -120px -480px
}

.service-icons li.r9s4 {
    background-position: -180px -480px
}

.service-icons li.r9s5 {
    background-position: -240px -480px
}

.service-icons li.r9s6 {
    background-position: -300px -480px
}

.service-icons li.r9s7 {
    background-position: -360px -480px
}

.service-icons li.r9s8 {
    background-position: -420px -480px
}

.service-icons li.r9s9 {
    background-position: -480px -480px
}

.service-icons li.r9s10 {
    background-position: -540px -480px
}

.service-icons li.r10s1 {
    background-position: 0 -540px
}

.service-icons li.r10s2 {
    background-position: -60px -540px
}

.service-icons li.r10s3 {
    background-position: -120px -540px
}

.service-icons li.r10s4 {
    background-position: -180px -540px
}

.service-icons li.r10s5 {
    background-position: -240px -540px
}

.service-icons li.r10s6 {
    background-position: -300px -540px
}

.service-icons li.r10s7 {
    background-position: -360px -540px
}

.service-icons li.r10s8 {
    background-position: -420px -540px
}

.service-icons li.r10s9 {
    background-position: -480px -540px
}

.service-icons li.r10s10 {
    background-position: -540px -540px
}

.service-icons li.r11s1 {
    background-position: 0 -600px
}

.service-icons li.r11s2 {
    background-position: -60px -600px
}

.service-icons li.r11s3 {
    background-position: -120px -600px
}

.service-icons li.r11s4 {
    background-position: -180px -600px
}

.service-icons li.r11s5 {
    background-position: -240px -600px
}

.service-icons li.r11s6 {
    background-position: -300px -600px
}

.service-icons li.r11s7 {
    background-position: -360px -600px
}

.service-icons li.r11s8 {
    background-position: -420px -600px
}

.service-icons li.r11s9 {
    background-position: -480px -600px
}

.service-icons li.r11s10 {
    background-position: -540px -600px
}

.service-icons li.r12s1 {
    background-position: 0 -660px
}

.service-icons li.r12s2 {
    background-position: -60px -660px
}

.service-icons li.r12s3 {
    background-position: -120px -660px
}

.service-icons li.r12s4 {
    background-position: -180px -660px
}

.service-icons li.r12s5 {
    background-position: -240px -660px
}

.service-icons li.r12s6 {
    background-position: -300px -660px
}

.service-icons li.r12s7 {
    background-position: -360px -660px
}

.service-icons li.r12s8 {
    background-position: -420px -660px
}

.service-icons li.r12s9 {
    background-position: -480px -660px
}

.service-icons li.r12s10 {
    background-position: -540px -660px
}

.service-icons li.r13s1 {
    background-position: 0 -720px
}

.service-icons li.r13s2 {
    background-position: -60px -720px
}

.service-icons li.r13s3 {
    background-position: -120px -720px
}

.service-icons li.r13s4 {
    background-position: -180px -720px
}

.service-icons li.r13s5 {
    background-position: -240px -720px
}

.service-icons li.r13s6 {
    background-position: -300px -720px
}

.service-icons li.r13s7 {
    background-position: -360px -720px
}

.service-icons li.r13s8 {
    background-position: -420px -720px
}

.service-icons li.r13s9 {
    background-position: -480px -720px
}

.service-icons li.r13s10 {
    background-position: -540px -720px
}

.service-icons li.r14s1 {
    background-position: 0 -780px
}

.service-icons li.r14s2 {
    background-position: -60px -780px
}

.service-icons li.r14s3 {
    background-position: -120px -780px
}

.service-icons li.r14s4 {
    background-position: -180px -780px
}

.service-icons li.r14s5 {
    background-position: -240px -780px
}

.service-icons li.r14s6 {
    background-position: -300px -780px
}

.service-icons li.r14s7 {
    background-position: -360px -780px
}

.service-icons li.r14s8 {
    background-position: -420px -780px
}

.service-icons li.r14s9 {
    background-position: -480px -780px
}

.service-icons li.r14s10 {
    background-position: -540px -780px
}

.service-icons li.r15s1 {
    background-position: 0 -840px
}

.service-icons li.r15s2 {
    background-position: -60px -840px
}

.service-icons li.r15s3 {
    background-position: -120px -840px
}

.service-icons li.r15s4 {
    background-position: -180px -840px
}

.service-icons li.r15s5 {
    background-position: -240px -840px
}

.service-icons li.r15s6 {
    background-position: -300px -840px
}

.service-icons li.r15s7 {
    background-position: -360px -840px
}

.service-icons li.r15s8 {
    background-position: -420px -840px
}

.service-icons li.r15s9 {
    background-position: -480px -840px
}

.service-icons li.r15s10 {
    background-position: -540px -840px
}

.service-icons li.r16s1 {
    background-position: 0 -840px
}

.service-icons li.r16s2 {
    background-position: -60px -840px
}

.service-icons li.r16s3 {
    background-position: -120px -840px
}

.service-icons li.r16s4 {
    background-position: -180px -840px
}

.service-icons li.r16s5 {
    background-position: -240px -840px
}

.service-icons li.r16s6 {
    background-position: -300px -840px
}

.service-icons li.r16s7 {
    background-position: -360px -840px
}

.service-icons li.r16s8 {
    background-position: -420px -840px
}

.service-icons li.r16s9 {
    background-position: -480px -840px
}

.service-icons li.r16s10 {
    background-position: -540px -840px
}

.service-icons li.r17s1 {
    background-position: 0 -900px
}

.service-icons li.r17s2 {
    background-position: -60px -900px
}

.service-icons li.r17s3 {
    background-position: -120px -900px
}

.service-icons li.r17s4 {
    background-position: -180px -900px
}

.service-icons li.r17s5 {
    background-position: -240px -900px
}

.service-icons li.r17s6 {
    background-position: -300px -900px
}

.service-icons li.r17s7 {
    background-position: -360px -900px
}

.service-icons li.r17s8 {
    background-position: -420px -900px
}

.service-icons li.r17s9 {
    background-position: -480px -900px
}

.service-icons li.r17s10 {
    background-position: -540px -900px
}

.service-icons li.r18s1 {
    background-position: 0 -960px
}

.service-icons li.r18s2 {
    background-position: -60px -960px
}

.service-icons li.r18s3 {
    background-position: -120px -960px
}

.service-icons li.r18s4 {
    background-position: -180px -960px
}

.service-icons li.r18s5 {
    background-position: -240px -960px
}

.service-icons li.r18s6 {
    background-position: -300px -960px
}

.service-icons li.r18s7 {
    background-position: -360px -960px
}

.service-icons li.r18s8 {
    background-position: -420px -960px
}

.service-icons li.r18s9 {
    background-position: -480px -960px
}

.service-icons li.r18s10 {
    background-position: -540px -960px
}

.service-icons li.r19s1 {
    background-position: 0 -1020px
}

.service-icons li.r19s2 {
    background-position: -60px -1020px
}

.service-icons li.r19s3 {
    background-position: -120px -1020px
}

.service-icons li.r19s4 {
    background-position: -180px -1020px
}

.service-icons li.r19s5 {
    background-position: -240px -1020px
}

.service-icons li.r19s6 {
    background-position: -300px -1020px
}

.service-icons li.r19s7 {
    background-position: -360px -1020px
}

.service-icons li.r19s8 {
    background-position: -420px -1020px
}

.service-icons li.r19s9 {
    background-position: -480px -1020px
}

.service-icons li.r19s10 {
    background-position: -540px -1020px
}

.service-icons li.r20s1 {
    background-position: 0 -1080px
}

.service-icons li.r20s2 {
    background-position: -60px -1080px
}

.service-icons li.r20s3 {
    background-position: -120px -1080px
}

.service-icons li.r20s4 {
    background-position: -180px -1080px
}

.service-icons li.r20s5 {
    background-position: -240px -1080px
}

.service-icons li.r20s6 {
    background-position: -300px -1080px
}

.service-icons li.r20s7 {
    background-position: -360px -1080px
}

.service-icons li.r20s8 {
    background-position: -420px -1080px
}

.service-icons li.r20s9 {
    background-position: -480px -1080px
}

.service-icons li.r20s10 {
    background-position: -540px -1080px
}

.service-icons li.r21s1 {
    background-position: 0 -1140px
}

.service-icons li.r21s2 {
    background-position: -60px -1140px
}

.service-icons li.r21s3 {
    background-position: -120px -1140px
}

.service-icons li.r21s4 {
    background-position: -180px -1140px
}

.service-icons li.r21s5 {
    background-position: -240px -1140px
}

.service-icons li.r21s6 {
    background-position: -300px -1140px
}

.service-icons li.r21s7 {
    background-position: -360px -1140px
}

.service-icons li.r21s8 {
    background-position: -420px -1140px
}

.service-icons li.r21s9 {
    background-position: -480px -1140px
}

.service-icons li.r21s10 {
    background-position: -540px -1140px
}

.poke:before {
    content: "";
    position: absolute;
    height: 40px;
    border-color: transparent;
    border-style: solid;
    border-width: 20px 20px 20px 0;
    transition: all 200ms ease-in-out 0s;
    margin-top: 123px
}

.section-gray .poke:hover:before,
.section-gray-dark .poke:hover:before {
    border-left: 16px solid #e6e6e6
}

.section-white .poke:hover:before {
    border-left: 16px solid #fff
}

.contentbox-section {
    padding: 32px !important;
    padding: 2rem !important
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .contentbox-section {
        padding: 24px !important;
        padding: 1.5rem !important
    }
}

@media only screen and (max-width: 767px) {
    .contentbox-section {
        padding: 16px !important;
        padding: 1rem !important
    }
}

.options-section .options-section-item {
    margin-bottom: 4px;
    margin-bottom: .25rem;
    padding: 16px;
    padding: 1rem
}

.options-section h2 {
    margin-bottom: 0;
    cursor: pointer
}

.options-section .row {
    margin-top: 16px;
    margin-top: 1rem;
    display: none
}

.options-section .options-trigger {
    position: relative
}

.options-section .options-trigger:after {
    content: '\02795';
    display: block;
    width: 15px;
    height: 15px;
    position: absolute;
    font-size: 16px;
    font-size: 1rem;
    right: 8px;
    right: .5rem;
    top: 0
}

.options-section .options-trigger.active:after {
    content: "\2796"
}

.price-tag .price {
    font-size: 36px;
    font-size: 2.25rem;
    text-transform: uppercase;
    margin-bottom: 4px;
    margin-bottom: .25rem;
    font-family: Tele-Grotesk;
    margin-bottom: 0;
    color: #e20074;
    padding-top: 2px;
    letter-spacing: -2px
}

.price-tag .price.crossed {
    color: #999;
    text-decoration: line-through
}

.price-tag .price.crossed .value {
    text-decoration: none !important
}

.price-tag .value {
    font-size: 60%;
    letter-spacing: 0
}

.price-tag .addition {
    font-family: Tele-GroteskHal;
    font-size: 15.9984px;
    font-size: .9999rem;
    text-transform: uppercase
}

.section-yellow {
    background: #ffd329;
    color: #000
}

.section-green {
    background: #dbec27;
    color: rgb(1 24 61 / 90%)
}

.section-white {
    background: #fffcec;
    color: rgb(8 31 63 / 94%)
}

.section-gray {
    background: #e6e6e6;
    color: #000
}

.section-gray-notso-verydark {
    background: #4b4b4b;
    color: #fff
}

.section-gray-verydark {
    background: #4b4b4b;
    color: #fff
}

.section-gray-dark {
    background: #e6e6e6
}

.section-black {
    background: #0b0e3f;
    color: #d6f31f
}

.section-black-light {
    background: #222;
    color: #fff
}

.section-magenta {
    background: #823CFA;
    color: #fff
}

.section-violet {
    background: #9f4c97;
    color: #fff
}

.section-cyan {
    background: #53baf2;
    color: #fff
}

.section-blue {
    background: #168dfb;
    color: #fff
}

.section-lightblue {
    background: #53baf2;
    color: #fff
}

.section-petroleum {
    background: #1bada2;
    color: #fff
}

.section-orange {
    background: #772098;
    color: #fff
}

.section-magenta-gradient {
    background: #e20074;
    background-image: -webkit-linear-gradient(#b5015c, #e20074);
    background-image: -moz-linear-gradient(#b5015c, #e20074);
    background-image: -ms-linear-gradient(#b5015c, #e20074);
    background-image: -o-linear-gradient(#b5015c, #e20074);
    background-image: linear-gradient(#b5015c, #e20074)
}

.section-black-gradient {
    background: #222;
    background-image: -webkit-linear-gradient(#000, #444);
    background-image: -moz-linear-gradient(#000, #444);
    background-image: -ms-linear-gradient(#000, #444);
    background-image: -o-linear-gradient(#000, #444);
    background-image: linear-gradient(#000, #444)
}

.section-gray-gradient {
    background: #222;
    background-image: -webkit-linear-gradient(#d0d0d0, #fff);
    background-image: -moz-linear-gradient(#d0d0d0, #fff);
    background-image: -ms-linear-gradient(#d0d0d0, #fff);
    background-image: -o-linear-gradient(#d0d0d0, #fff);
    background-image: linear-gradient(#d0d0d0, #fff)
}

.section-gray-gradient-radial {
    background: #5a5a5a;
    background-position: 0 50%;
    background-size: 100% 100%;
    background-image: -webkit-radial-gradient(50% 70%, #ddd, #5a5a5a);
    background-image: -moz-radial-gradient(50% 70%, #ddd, #5a5a5a);
    background-image: -ms-radial-gradient(50% 70%, #ddd, #5a5a5a);
    background-image: -o-radial-gradient(50% 70%, #ddd, #5a5a5a);
    background-image: radial-gradient(50% 70%, #ddd, #5a5a5a)
}

.confort-items>li {
    list-style: none !important
}

@media only screen and (max-width: 880px) {
    .confort-items>li {
        margin-bottom: 10px
    }
}

.confort-items .confort-ico {
    background: transparent url(https://static.hrvatskitelekom.hr/webresources/images/sprite/conforting-icons.png) no-repeat 0 0;
    width: 50px;
    height: 46px;
    margin: 0;
    color: transparent;
    white-space: nowrap;
    display: inline-block;
    background-size: auto
}

.confort-items .confort-ico.r1 {
    background-position: 0 0
}

.confort-items .confort-ico.r2 {
    background-position: -50px 0
}

.confort-items .confort-ico.r3 {
    background-position: -100px 0
}

.confort-items .confort-ico.r4 {
    background-position: -150px 0
}

.confort-items.confort-items-footer h2,
.confort-items.confort-items-footer p {
    color: #fff !important
}

.confort-items.confort-items-footer .confort-ico.r1 {
    background-position: 0 -46px
}

.confort-items.confort-items-footer .confort-ico.r2 {
    background-position: -50px -46px
}

.confort-items.confort-items-footer .confort-ico.r3 {
    background-position: -100px -46px
}

.confort-items.confort-items-footer .confort-ico.r4 {
    background-position: -150px -46px
}

@media only screen and (max-width: 880px) {
    .confort-items.confort-items-footer li:first-child {
        text-align: center;
        margin-bottom: 10px
    }
    .confort-items.confort-items-footer .small-6 {
        margin-bottom: 10px
    }
}

.search-field-2016 {
    width: 100%
}

.field.inline-field {
    float: left;
    margin-right: 10px;
    padding: 0 !important
}

.search-suggestions p,
.search-suggestions ul li {
    color: #fff !important
}

.search-suggestions p {
    text-transform: none;
    margin-left: 10px
}

.search-suggestions li,
.search-suggestions a {
    color: #a4a4a4 !important;
    font-size: 14px
}

.search-suggestions>ul>li>ul>li {
    margin-bottom: 5px;
    list-style-image: none
}

.search-suggestions>ul>li>ul>li>a:hover {
    text-decoration: underline
}

.suggestion-terms>ul>li {
    list-style-image: none;
    list-style: none
}

.suggestion-terms>ul>li>ul>li {
    margin-bottom: 5px;
    list-style-image: none;
    list-style: none
}

.suggestion-terms>ul {
    margin-left: -10px
}

.suggestion-terms:before,
.suggestion-terms:after {
    content: " ";
    display: table
}

.suggestion-terms:after {
    clear: both
}

body>form {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 100vh;
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    -o-flex-direction: column;
    flex-direction: column
}

.content-2014.htws-2016 {
    -webkit-flex: 1 0 auto;
    -moz-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    -o-flex: 1 0 auto;
    flex: 1 0 auto
}

footer {
    padding: 0 10px;
    background: #262626;
    color: #a4a4a4 !important
}

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

footer:after {
    clear: both
}

footer li {
    list-style: none;
    margin-bottom: 5px
}

footer a {
    color: #a4a4a4;
    text-decoration: none
}

footer a:hover {
    text-decoration: underline;
    color: #fff
}

footer li.columns {
    width: 18%
}

@media only screen and (max-width: 880px) {
    footer li.columns {
        width: 100%
    }
}

footer li.columns.last {
    width: 25%
}

@media only screen and (max-width: 880px) {
    footer li.columns.last {
        width: 100%;
        margin-top: 15px
    }
}

.footer-2016-social ul li {
    list-style: none;
    margin-right: 10px
}

.footer-2016-social ul li a {
    cursor: pointer;
    display: inline-block;
    height: 24px;
    width: 24px
}

.footer-2016-social ul li a span,
.footer-2016-social a span {
    display: none
}

.footer-2016-social .footer-ico {
    background: transparent url(https://static.hrvatskitelekom.hr/webresources/images/sprite/footer-sprite.png) no-repeat 0 0;
    width: 24px;
    height: 24px;
    margin: 0 12px 0 0;
    color: transparent;
    white-space: nowrap;
    display: block;
    float: left;
    background-size: auto;
    opacity: 0.5
}

.footer-2016-social .footer-ico:hover {
    opacity: 1
}

.footer-2016-social .footer-ico.f1 {
    background-position: 0 0
}

.footer-2016-social .footer-ico.f2 {
    background-position: -24px 0
}

.footer-2016-social .footer-ico.f3 {
    background-position: -48px 0
}

.footer-2016-social .footer-ico.f4 {
    background-position: -72px 0
}

.footer-2016-social .footer-ico.f5 {
    background-position: -96px 0
}

.footer-2016-social img {
    opacity: 0.5;
    margin-top: 15px
}

.footer-2016-social img:hover {
    opacity: 1
}

.tehnicke-table {
    width: 100%
}

.tehnicke-table thead td {
    font: normal 18px/1 Headline-ult;
    text-transform: uppercase;
    padding: 25px 10px 25px 0;
    vertical-align: bottom;
    border-bottom: 1px solid #000
}

.tehnicke-table tbody th,
.tehnicke-table tbody td {
    font-size: 18px;
    padding: 16px 10px 16px 16px;
    border-bottom: 1px solid #e2e3e4
}

.tehnicke-table tbody th {
    width: 30%;
    font-family: Headline;
    text-transform: uppercase;
    font-weight: normal
}

.tehnicke-table thead img {
    margin-bottom: -10px
}

.tehnicke-table.box-item .figure img {
    height: auto
}

.tehnicke-table.section-magenta.tc:after {
    position: relative;
    top: 35px;
    margin-bottom: 35px;
    display: block;
    height: 35px;
    content: ".";
    background: url(//static.hrvatskitelekom.hr/webresources/images/icons/strelica-down.png) no-repeat center top
}

.tehnicke-table.section-magenta.tc .grid {
    padding-bottom: 0
}

@media screen and (max-width: 468px) {
    .tehnicke-table .tehnicke-table thead img {
        height: 20px;
        margin-bottom: -5px
    }
}

@media screen and (max-width: 599px) {
    .tehnicke-table .tehnicke-table thead td {
        font-size: 12px;
        padding: 16px 6px 16px 16px
    }
    .tehnicke-table .tehnicke-table tbody th,
    .tehnicke-table .tehnicke-table tbody td {
        font-size: 13px;
        padding: 12px 8px 12px 12px
    }
    .tehnicke-table .tehnicke-table thead img {
        height: 20px;
        margin-bottom: -3px
    }
    .tehnicke-table .devices-image {
        display: block
    }
}

.footer-2016-copyright {
    text-align: right
}

.footer-2016-copyright img {
    opacity: 0.5
}

.footer-2016-copyright a {
    text-decoration: none
}

.footer-2016-copyright a:hover {
    text-decoration: underline;
    opacity: 1
}

.footer-2016-copyright a:hover img {
    opacity: 1
}

.footer-2016-copyright span.name.xs {
    position: relative;
    top: -7px;
    margin-left: 15px
}

@media only screen and (max-width: 880px) {
    .footer-2016-copyright {
        text-align: left
    }
}

.nletter-box-home {
    height: 220px;
    padding: 53px 22px;
    max-width: 460px
}

.nletter-box-home .nletter-input {
    border: 1px solid #e20074;
    height: 31px;
    margin-right: 15px;
    padding: 0 5px
}

@media only screen and (max-width: 880px) {
    .nletter-box-home .nletter-input {
        width: 100%;
        margin-right: 0;
        margin-bottom: 10px
    }
}

@media only screen and (max-width: 1024px) {
    .nletter-box-home {
        padding: 22px;
        max-width: 880px
    }
}

.conforting-box-home {
    padding: 22px 4px
}

@media only screen and (max-width: 880px) {
    .conforting-box-home {
        padding: 11px 4px
    }
}

.option-bar {
    position: relative
}

.option-bar a {
    color: #4b4b4b
}

.option-bar a:hover p,
.option-bar a:hover h3 {
    color: #007FAF;
    text-decoration: underline
}

.option-bar a:hover .service-icons li.r1s3 {
    background-position: -120px -120px
}

.option-bar a:hover .service-icons li.r4s5 {
    background-position: -240px -300px
}

.option-bar a:hover .service-icons li.r10s9 {
    background-position: -480px -660px
}

.option-bar a:hover .service-icons li.r10s10 {
    background-position: -540px -660px
}

.option-bar a:hover .service-icons li.r4s2 {
    background-position: -60px -300px
}

.option-bar a:hover .service-icons li.r4s6 {
    background-position: -300px -300px
}

.option-bar .service-icons li {
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -30px
}

@media only screen and (max-width: 880px) {
    .option-bar .service-icons li {
        position: relative;
        left: 50%;
        margin-left: -30px;
        margin-top: 0
    }
}

.tarif-pricelist-2016 {
    background-color: #e6e6e6
}

.tarif-pricelist-2016 th,
.tarif-pricelist-2016 td {
    text-align: center;
    vertical-align: top
}

.tarif-pricelist-2016 th {
    color: #222222
}

.tarif-pricelist-2016 td {
    border-left: 1px solid #999;
    padding: 0 5px;
    color: #444444
}

.tarif-pricelist-2016 td:first-child {
    border-left: 0
}

.tarif-pricelist-2016.packages-overview-1-items td,
.tarif-pricelist-2016.packages-overview-1-items th {
    width: 1160px
}

.tarif-pricelist-2016.packages-overview-2-items td,
.tarif-pricelist-2016.packages-overview-2-items th {
    width: 580px
}

.tarif-pricelist-2016.packages-overview-3-items td,
.tarif-pricelist-2016.packages-overview-3-items th {
    width: 386.6px
}

.tarif-pricelist-2016.packages-overview-4-items td,
.tarif-pricelist-2016.packages-overview-4-items th {
    width: 290px
}

.tarif-pricelist-2016.packages-overview-5-items td,
.tarif-pricelist-2016.packages-overview-5-items th {
    width: 232px
}

.tarif-pricelist-2016.packages-overview-6-items td,
.tarif-pricelist-2016.packages-overview-6-items th {
    width: 193.3333px
}

.tarif-pricelist-2016.packages-overview-7-items td,
.tarif-pricelist-2016.packages-overview-7-items th {
    width: 165.71px
}

.tarif-pricelist-2016.packages-overview-8-items td,
.tarif-pricelist-2016.packages-overview-8-items th {
    width: 145px
}

.tarif-pricelist-2016 .mt {
    padding-top: 20%
}

@media only screen and (max-width: 880px) {
    .tarif-pricelist-2016 {
        overflow-x: scroll
    }
}

.tarif-pricelist-2016 .section-trigger td {
    text-align: left
}

.tarif-pricelist-2016 .section-trigger {
    border-top: 0.5rem solid #ffffff;
    text-align: left
}

.tarif-pricelist-2016 .section-trigger h4 a {
    position: relative;
    display: block;
    padding: 5px 0 9px
}

.tarif-pricelist-2016 .section-trigger h4 a:after {
    content: '\2796';
    display: block;
    width: 15px;
    height: 15px;
    position: absolute;
    font-size: 16px;
    font-size: 1rem;
    right: 8px;
    right: .5rem;
    top: 5px
}

.tarif-pricelist-2016 .section-trigger h4 a.active:after {
    content: "\02795"
}

.pseudo-form.osobni-podaci fieldset {
    background: White;
    padding: 15px 40px
}

.pseudo-form.osobni-podaci h2 {
    color: #333;
    margin-bottom: 0;
    background: #e5e5e5;
    position: relative;
    top: -15px;
    left: -40px;
    width: 109%;
    padding: 3px 40px;
    font-size: 16px;
    background: #d0d0d0;
    color: Black;
    text-transform: uppercase;
    font-family: Tele-GroteskFet
}

input[readonly]:focus,
.read-only:focus {
    box-shadow: 0 0 0 2px #e5e5e5, inset 0 1px 1px 1px #ededed !important
}

.option-info-box {
    margin: 18px 0 0 0 !important
}

.section-dark.options-content.cartContainer {
    position: relative !important;
    bottom: auto !important
}

@media only screen and (max-width: 640px) {
    [data-content="trailer"] a.addToBasket {
        min-height: 0 !important
    }
}

@media only screen and (max-width: 768px) {
    div.LPMcontainer.LPMoverlay img.LPMimage {
        max-width: 50% !important;
        right: 0;
        left: auto !important
    }
    div.service2 div.LPMcontainer.LPMoverlay img.LPMimage {
        max-width: 100% !important
    }
}

.ec-circle {
    border-radius: 50%;
    width: 140px;
    height: 140px;
    -webkit-transform: rotate(-7.5deg);
    -moz-transform: rotate(-7.5deg);
    -ms-transform: rotate(-7.5deg);
    -o-transform: rotate(-7.5deg);
    transform: rotate(-7.5deg);
    position: absolute !important;
    z-index: 99
}

.ec-circle p.custom-padding {
    padding-top: 32%;
    padding-left: 12%;
    max-width: 120px
}

div.hwsimo-buttons {
    position: absolute;
    bottom: 0;
    width: 100%
}

div.hwsimo-buttons a.addToBasket {
    position: initial
}

div.hwsimo-buttons a.addToBasket.button-2016 {
    color: #333
}

div.hwsimo-buttons a.addToBasket.button-2016.button-2016-magenta {
    color: #fff
}

div.hwsimo-buttons a.addToBasket:after {
    background: none
}

div.hwsimo-buttons a.addToBasket:hover:after {
    opacity: 0
}

.select-msisdn .grid {
    padding: 1em 0
}

.select-msisdn h2 {
    margin: 0;
    line-height: 36px;
    font-size: 21px
}

.select-msisdn select {
    margin: 0 0 0 8px
}

.option-toggle-container {
    margin: 0 0 1.5em 0
}

.option-list-trigger {
    border: 1px solid #d0d0d0;
    margin: 0;
    font: normal 1.125em/1.5 Tele-grotesk;
    padding: 16px 42px 16px 63px;
    cursor: pointer;
    position: relative;
    background: #fff;
    background: -moz-linear-gradient(top, #fff 0%, #dbdbdb 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #dbdbdb));
    background: -webkit-linear-gradient(top, #fff 0%, #dbdbdb 100%);
    background: -o-linear-gradient(top, #fff 0%, #dbdbdb 100%);
    background: -ms-linear-gradient(top, #fff 0%, #dbdbdb 100%);
    background: linear-gradient(to bottom, #fff 0%, #dbdbdb 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dbdbdb', GradientType=0)
}

.option-list-trigger:after {
    display: block;
    position: Absolute;
    content: '';
    right: 16px;
    top: 50%;
    margin-top: -7px;
    background: transparent url(../images/design/up-down-filters.png) no-repeat center top;
    width: 26px;
    height: 13px
}

.option-list-trigger.active:after {
    background-position: center bottom
}

.option-list-trigger.disabled:after {
    background: none !important
}

.option-list-trigger a {
    font: 1em/1.5 Headline-ult;
    color: #333 !important;
    text-transform: uppercase
}

.option-list-trigger a:hover {
    color: #333 !important
}

.option-toggle-container.option-Besplatne-opcije .option-list-trigger a {
    color: #e20074 !important
}

.option-toggle-container.option-Besplatne-opcije .option-list-trigger a:hover {
    color: #e20074 !important
}

.option-toggle-container .option-list-trigger:before {
    content: "";
    display: block;
    position: absolute;
    width: 23px;
    height: 22px;
    left: 20px;
    top: 50%;
    margin-top: -11px;
    background: url(i/icons/option-icon-magenta-sprite.png) no-repeat center top
}

.option-toggle-container.option-mobilne-opcije-preporucamo-uz-tarifu .option-list-trigger:before {
    background-position: center -22px
}

.option-toggle-container.option-zabava .option-list-trigger:before {
    background-position: center -44px
}

.option-toggle-container.option-internet .option-list-trigger:before {
    background-position: center -66px
}

.option-toggle-container.option-razgovori-i-poruke .option-list-trigger:before {
    background-position: center -88px
}

.option-toggle-container.option-roaming .option-list-trigger:before {
    background-position: center -110px
}

.option-toggle-container.option-ostalo .option-list-trigger:before {
    background-position: center -132px
}

.option-toggle-container.option-Data .option-list-trigger:before {
    background-position: center -132px
}

.option-toggle-container.option-ICT-opcije .option-list-trigger:before {
    background-position: center -154px
}

.option-toggle-container.option-Data-LandingPage-opcije .option-list-trigger:before {
    background-position: center -132px
}

.option-toggle-container.option-Lookout-zastita-bez-naknade .option-list-trigger:before {
    background-position: center -176px
}

.option-list-2015 {
    list-style-type: none;
    margin: 0 0 1.5em
}

.option-list-2015>li {
    display: block;
    background: #fff;
    margin: 0 0 1px;
    padding: 20px;
    border-top: 1px solid #d0d0d0
}

.option-list-2015>li:after {
    display: table;
    content: '';
    clear: both
}

.option-list-2015>li:first-child {
    border: none
}

.option-list-2015 .option-icon {
    float: left;
    width: 16%;
    text-align: center;
    padding-right: 20px
}

.option-list-2015 .option-description {
    float: left;
    width: 54%;
    padding-right: 20px
}

.option-list-2015 .option-price {
    float: left;
    width: 30%;
    text-align: center
}

.option-list-2015 .option-description h4 {
    font: normal 24px/1.25 Tele-groteskfet;
    margin: 0 0 0.375em
}

.option-list-2015 .option-description p {
    font-size: 18px
}

.option-list-2015 .option-price .price {
    font: normal 30px/1.2 Tele-groteskult;
    color: #e20074;
    margin: 0 0 0.5em
}

.option-list-2015 .option-price .price-old {
    color: #333;
    font-family: Tele-grotesk;
    text-decoration: line-through;
    display: inline-block
}

.option-list-2015 .option-price .price+.price {
    display: inline-block;
    margin-left: 0.25em
}

.option-list-2015 .option-price .button {
    min-width: 80%;
    padding: 5px
}

.option-list-2015 .option-price .button+p {
    margin: 0.75em 0 0
}

.option-list-2015.option-page {
    width: 100%;
    list-style-type: none;
    margin: 0 0 2em 0;
    border-top: 1px solid #e20074
}

.option-list-2015.option-page>li {
    background: #fff;
    padding: 0.75em 2%;
    width: 100%;
    border: 1px solid #e20074;
    border-top: 0;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    position: relative;
    margin: 0
}

.option-list-2015.option-page .option-icon,
.option-list-2015.option-page .option-price {
    float: none;
    display: table-cell;
    vertical-align: middle
}

.option-list-2015.option-page .option-price.single-option {
    width: auto;
    text-align: left
}

.option-list-2015.option-page .option-price p.promoText a {
    text-decoration: underline
}

.option-info-box {
    color: #333333;
    padding: 10px 20px 16px 25px;
    margin: -16px 0 0 0;
    position: relative
}

.checkout-container.options .option-info-box {
    border: 1px solid #d0d0d0;
    border-bottom: none
}

.option-info-box p {
    margin: 0
}

.option-info-box p+p {
    margin-top: 0.75em
}

.activate-option-prompt {
    max-width: 700px
}

.activate-option-prompt .button {
    width: auto
}

.option-deactivate-box {
    margin: 1.5em 0 2em
}

ul.option-deactivate-select {
    list-style-type: none;
    float: none;
    display: table;
    margin: 0 0 1em;
    width: 100%
}

.option-deactivate-select li {
    display: table-cell;
    vertical-align: middle;
    width: 27%
}

.option-deactivate-select li.topic {
    text-align: right;
    background: #fff;
    width: 19%;
    font-size: 18px;
    font-family: Tele-groteskfet;
    padding: 0 6px 0 0
}

.option-deactivate-select li.select {
    position: relative;
    border-left: 5px solid #fff;
    background: #f5f5f5;
    text-align: left;
    cursor: pointer;
    padding: 0.5em 3em 0.5em 1em;
    font-size: 1em;
    -webkit-transition: all 250ms;
    -moz-transition: all 250ms;
    -ms-transition: all 250ms;
    -o-transition: all 250ms;
    transition: all 250ms
}

.option-deactivate-select li.select:after {
    position: absolute;
    content: "";
    display: block;
    width: 31px;
    height: 31px;
    right: 1em;
    top: 50%;
    margin-top: -15.5px;
    background: transparent url(https://static.hrvatskitelekom.hr/webresources/images/icons/option-activate-select.png) no-repeat -31px 0
}

.option-deactivate-select li.select:hover {
    background: #ffffff
}

.option-deactivate-select li.select.active {
    color: #fff;
    background: #e20074
}

.option-deactivate-select li.select.active:after {
    background-position: 0 0
}

.message li {
    font-size: 21px;
    line-height: 1.2;
    list-style-position: inside
}

.section-gray-dark .option-toggle-container {
    color: #333333;
    margin: 0 0 0.4em 0;
    border: none
}

.section-gray-dark .option-toggle-container .option-list-trigger:before {
    content: "";
    display: block;
    position: absolute;
    width: 23px;
    height: 22px;
    left: 20px;
    top: 50%;
    margin-top: -11px;
    background: url(i/icons/option-icon-magenta-sprite.png) no-repeat center top
}

.section-gray-dark .option-toggle-container.option-mobilne-opcije-preporucamo-uz-tarifu .option-list-trigger:before {
    background-position: center -22px
}

.section-gray-dark .option-toggle-container.option-zabava .option-list-trigger:before {
    background-position: center -44px
}

.section-gray-dark .option-toggle-container.option-internet .option-list-trigger:before {
    background-position: center -66px
}

.section-gray-dark .option-toggle-container.option-razgovori-i-poruke .option-list-trigger:before {
    background-position: center -88px
}

.section-gray-dark .option-toggle-container.option-roaming .option-list-trigger:before {
    background-position: center -110px
}

.section-gray-dark .option-toggle-container.option-ostalo .option-list-trigger:before {
    background-position: center -132px
}

.section-gray-dark .option-toggle-container.option-Data .option-list-trigger:before {
    background-position: center -132px
}

.section-gray-dark .option-toggle-container.option-ICT-opcije .option-list-trigger:before {
    background-position: center -154px
}

.section-gray-dark .option-toggle-container.option-Data-LandingPage-opcije .option-list-trigger:before {
    background-position: center -132px
}

.section-gray-dark .option-toggle-container.option-Lookout-zastita-bez-naknade .option-list-trigger:before {
    background-position: center -176px
}

.section-gray-dark .option-toggle-container a:not(.button) {
    color: #427bab
}

.section-gray-dark .option-toggle-container a:not(.button):hover {
    color: #427bab !important;
    text-decoration: none
}

.section-gray-dark .option-toggle-container a.button-primary:hover {
    color: #ffffff !important
}

.section-gray-dark .option-toggle-container a.button.disabled:hover {
    color: #333333 !important
}

.section-gray-dark .option-toggle-container a.button-primary.disabled:hover {
    color: #ffffff !important
}

.section-gray-dark .option-list-trigger {
    background: #ffffff;
    padding: 16px 42px 16px 63px;
    font-size: 1.167em;
    border: none
}

.section-gray-dark .option-list-trigger:after {
    background: transparent url(i/icons/up-down-filters.png) no-repeat center top;
    width: 17px;
    height: 10px
}

.section-gray-dark .option-list-trigger.active:after {
    background-position: center bottom
}

.section-gray-dark .option-toggle-container .option-list-trigger a:not(.button) {
    font: 1em/1.5 Headline-ult;
    color: #333 !important;
    text-transform: uppercase
}

.section-gray-dark .option-toggle-container .option-list-trigger a:not(.button):hover {
    color: #333 !important
}

.section-gray-dark .option-list-2015 {
    margin: 0 0 0.4em 0
}

.section-gray-dark .option-list-2015>li {
    margin: 0;
    position: relative;
    margin: 0.5em 0 0.4em 0
}

.section-gray-dark .option-list-2015>li:before {
    content: "";
    display: block;
    position: absolute;
    height: 1px;
    left: 20px;
    right: 20px;
    top: 0;
    background: #d1d3d4
}

.section-gray-dark .option-list-2015 .option-price .price {
    font-size: 24px
}

.section-gray-dark .option-info-box {
    background: #ffffff;
    color: #333333;
    padding: 0 20px 16px 64px;
    margin: -16px 0 0 0;
    position: relative
}

.section-gray-dark .option-info-box p+p {
    margin-top: 0
}

.section-gray-dark .option-list-2015 .option-icon {
    width: 21%
}

.section-gray-dark .option-list-2015 .option-description {
    width: 59%
}

.section-gray-dark .option-list-2015 .option-price {
    width: 20%
}

@media screen and (max-width: 600px) {
    .option-list-2015 .option-icon {
        display: none
    }
    .option-list-2015 .option-description {
        width: 100%;
        padding: 0 0 16px
    }
    .option-list-2015 .option-price {
        width: 100%;
        text-align: left
    }
    .option-list-trigger {
        font-size: 18px !important
    }
}

ul.options {
    list-style-type: none;
    text-align: left
}

ul.options>li {
    border-top: 1px solid #e5e5e5;
    clear: both;
    padding: 2em;
    width: 100%
}

ul.options>li:first-child {
    border: none
}

ul.options>li>ul {
    list-style-type: none;
    display: table;
    width: 100%;
    margin-top: 2.5em;
    padding-top: 2.5em;
    border-top: 1px solid #e5e5e5;
    margin-bottom: 0
}

ul.options>li>ul>li {
    display: table-cell;
    vertical-align: middle
}

ul.options>li>ul>li p a {
    color: #4379ab;
    text-decoration: none
}

ul.options>li>ul>li p a:hover {
    color: #e20074 !important;
    text-decoration: underline
}

ul.options>li>ul>li.icon {
    width: 15%;
    text-align: centar
}

ul.options>li>ul>li.text {
    width: 65%
}

ul.options>li>ul>li.action {
    width: 20%;
    text-align: center
}

ul.options>li>ul>li.action strong {
    display: block;
    margin: 0 0 0.5em 0
}

@media screen and (max-width: 767px) {
    ul.options>li {
        padding: 1em
    }
    ul.options>li>ul>li {
        display: list-item;
        width: 100% !important
    }
    ul.options>li>ul>li.icon {
        text-align: center
    }
    ul.options>li>ul>li.icon img {
        margin-bottom: 1em
    }
}

.product-horizontal-2015 {
    padding: 0 !important
}

.product-horizontal-2015 .product-name {
    background: #eee
}

.product-horizontal-2015 .product-name .grid {
    padding-left: 337px;
    padding-right: 15px
}

.product-horizontal-2015 .product-name h1 {
    font: normal 46px/1 Headline;
    letter-spacing: -0.05em;
    text-transform: uppercase;
    overflow: hidden;
    margin: 0
}

.product-horizontal-2015 .product-name h1 a {
    color: inherit
}

.product-horizontal-2015 .product-name h1+p {
    margin-top: 16px
}

.product-horizontal-2015 .product-image-box {
    float: left;
    width: 300px;
    position: relative;
    top: -110px;
    text-align: center
}

.product-horizontal-2015 .product-image-box .eye-catcher {
    font-size: 30px;
    line-height: 1;
    top: -35px;
    left: -20px;
    position: absolute;
    text-align: left;
    transform: rotate(-7.5deg);
    width: 150px
}

.product-horizontal-2015 .product-image-box .eye-catcher span {
    font-family: Headline-ult
}

.product-horizontal-2015 .product-image-box .addon-image {
    position: absolute;
    bottom: -35px;
    left: -30px
}

.product-horizontal-2015 .product-description-box {
    float: left;
    width: 660px;
    padding-left: 4%
}

.product-horizontal-2015 .product-description-usp {
    float: left;
    text-align: center;
    width: 110px;
    padding: 0 30px 0 0
}

.product-horizontal-2015 .product-usp {
    list-style-type: none
}

.product-horizontal-2015 .product-usp li {
    display: block;
    width: 76px;
    height: 82px;
    border: 1px solid #999;
    padding: 4px;
    font-size: 15px;
    line-height: 1;
    margin: 0 0 16px
}

.product-horizontal-2015 .product-usp li img {
    width: 27px;
    margin: 0 0 4px
}

.product-horizontal-2015 .product-usp li.full img {
    width: auto;
    margin-top: 6px
}

.product-horizontal-2015 .product-usp li em {
    display: block
}

.product-horizontal-2015 .product-usp li a {
    color: inherit;
    display: block
}

.product-horizontal-2015 .product-description-usp .more-link {
    font-size: 12px;
    text-transform: uppercase;
    display: block
}

.product-horizontal-2015 .product-description {
    float: left;
    width: 510px
}

.product-horizontal-2015 .product-description h2 {
    margin: 0
}

.product-horizontal-2015 .product-addon,
.product-horizontal-2015 .product-price {
    margin: 0 0 60px
}

.product-horizontal-2015 .product-description .box-group.credit-card-list {
    min-height: 2.5em;
    max-width: 15em
}

.product-horizontal-2015 .product-description .box-group.credit-card-list .box-item {
    position: relative;
    height: 2.5em;
    width: 2.5em
}

.product-horizontal-2015 .product-description .box-group.credit-card-list .box-item:after {
    position: absolute;
    content: "";
    display: block;
    height: 2.5em;
    width: 2.5em;
    left: 50%;
    margin-left: -1.25em;
    top: 0;
    background: transparent url("https://static.hrvatskitelekom.hr/webresources/images/icons/amex-icon.png") no-repeat center center;
    background-size: 100%
}

.product-horizontal-2015 .product-description .box-group.credit-card-list .box-item.diners:after {
    background-image: url("https://static.hrvatskitelekom.hr/webresources/images/icons/diners-icon.png")
}

.product-horizontal-2015 .product-description .box-group.credit-card-list .box-item.mastercard:after {
    background-image: url("https://static.hrvatskitelekom.hr/webresources/images/icons/mastercard-icon.png")
}

.product-horizontal-2015 .product-description .box-group.credit-card-list .box-item.visa:after {
    background-image: url("https://static.hrvatskitelekom.hr/webresources/images/icons/visa-icon.png")
}

.product-horizontal-2015 .product-description .box-group.credit-card-list .box-item.maestro:after {
    background-image: url("https://static.hrvatskitelekom.hr/webresources/images/icons/maestro-icon.png")
}

.product-horizontal-2015 .product-price .price-single {
    color: #e20074;
    font: normal 72px/1 Headline-ult;
    text-transform: uppercase;
    margin: 0
}

.product-horizontal-2015 .product-price .price-single .price-old {
    color: #333;
    font-family: Headline;
    position: relative;
    display: inline-block
}

.product-horizontal-2015 .product-price .price-single .price-old:after {
    display: block;
    width: 106%;
    height: 0;
    border: 1px solid #333;
    position: Absolute;
    top: 50%;
    left: -3%;
    content: ''
}

.product-horizontal-2015 .product-price p.price-note {
    margin: 4px 0 0
}

.product-horizontal-2015 .com {
    margin-bottom: -80px
}

.ws-usp-2015 {
    list-style-type: none;
    display: table;
    width: 100%;
    min-height: 60px
}

.ws-usp-2015 li {
    display: table-cell;
    width: 20%;
    vertical-align: middle;
    padding-left: 78px;
    padding-right: 50px;
    text-transform: uppercase;
    font: normal 14px/1.15 Headline;
    position: relative
}

.ws-usp-2015 li:before {
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -30px;
    width: 70px;
    height: 60px;
    background: transparent url(/webresources/images/sprite/ws-usp.png) no-repeat 0 0;
    content: ''
}

.ws-usp-2015 li.ws-popust:before {
    background-position: 0 0
}

.ws-usp-2015 li.ws-dostava:before {
    background-position: 0 -60px
}

.ws-usp-2015 li.ws-sigurno:before {
    background-position: 0 -120px
}

.ws-usp-2015 li.ws-kartice:before {
    background-position: 0 -180px
}

.ws-usp-2015 li.ws-dostupno:before {
    background-position: 0 -240px
}

#ytvideo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.video-frame-container {
    margin: 1em 0 0;
    position: relative
}

.video-frame-container .ratio {
    display: block;
    width: 100%;
    height: auto
}

@media screen and (max-width: 960px) {
    .product-horizontal-2015 .product-image-box {
        width: 30%
    }
    .product-horizontal-2015 .product-name .grid {
        padding-left: 34%
    }
    .product-horizontal-2015 .product-description-box {
        width: 70%
    }
    .product-horizontal-2015 .product-description-usp {
        width: 22%;
        padding: 0
    }
    .product-horizontal-2015 .product-description-usp .more-link {
        width: 76px
    }
    .product-horizontal-2015 .product-description {
        float: left;
        width: 78%
    }
    .ws-usp-2015 li {
        vertical-align: top;
        padding: 0 3%;
        text-align: center
    }
    .ws-usp-2015 li:before {
        position: relative;
        top: 0;
        margin: 0 auto 6px
    }
    .product-horizontal-2015 .product-description .box-group.credit-card-list {
        max-width: none
    }
}

@media screen and (max-width: 600px) {
    .product-horizontal-2015 .product-name .grid {
        padding: 20px 20px 60px;
        text-align: center
    }
    .product-horizontal-2015 .product-name h1 {
        font-size: 31px !important;
        line-height: 1 !important;
        overflow: visible;
        height: auto
    }
    .product-horizontal-2015 .product-name h1+p {
        margin-top: 12px
    }
    .product-horizontal-2015 .product-image-box {
        width: 100%;
        top: 0;
        margin: -86px 0 14px
    }
    .product-horizontal-2015 .product-image-box .eye-catcher {
        width: 100%;
        display: block;
        left: 0 !important;
        top: auto !important;
        margin: 1em 0;
        text-align: center;
        transform: none;
        width: 100%;
        position: relative;
        font-size: 1.5em
    }
    .product-horizontal-2015 .product-description-box {
        width: 100%;
        text-align: center
    }
    .product-horizontal-2015 .product-description-usp {
        display: none
    }
    .product-horizontal-2015 .product-description {
        width: 100%
    }
    .product-horizontal-2015 .product-description .button {
        margin: 0 auto
    }
    .product-horizontal-2015 .product-addon,
    .product-horizontal-2015 .product-price {
        margin: 0 0 32px
    }
    .product-horizontal-2015 .product-price p.price-note {
        margin: 4px 0 0
    }
    .product-horizontal-2015 .product-image-box .addon-image {
        bottom: 0;
        left: 0;
        max-width: 40% !important
    }
    .product-horizontal-2015 .product-price .price-single {
        font-size: 50px
    }
    .ws-usp-2015 {
        display: block
    }
    .ws-usp-2015 li {
        display: block;
        width: 100%;
        padding: 7px 0 0 44px;
        height: 30px;
        text-align: left;
        margin: 0 0 10px
    }
    .ws-usp-2015 li:before {
        position: absolute;
        width: 35px;
        height: 30px;
        background-size: 100% auto
    }
    .ws-usp-2015 li.ws-popust:before {
        background-position: 0 0
    }
    .ws-usp-2015 li.ws-dostava:before {
        background-position: 0 -30px
    }
    .ws-usp-2015 li.ws-sigurno:before {
        background-position: 0 -60px
    }
    .ws-usp-2015 li.ws-kartice:before {
        background-position: 0 -90px
    }
    .ws-usp-2015 li.ws-dostupno:before {
        background-position: 0 -120px
    }
    .product-horizontal-2015 .product-description .box-group.credit-card-list {
        max-width: none
    }
    .product-horizontal-2015 .product-description .box-group.credit-card-list .box-item {
        width: 2.5em !important
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-resolution: 240dpi) {
    .ws-usp-2015 li:before {
        background-image: url(/webresources/images/sprite/ws-usp@2x.png);
        background-size: 100% auto
    }
}

h3.no-accesories,
.not-found {
    text-align: center;
    margin: 10px 0 40px 20px;
    font-weight: normal;
    width: 530px;
    background: #f5f5f5;
    padding: 15px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-size: 18px;
    font-family: Tele-Grotesk
}

.filter-list-primary.box-group {
    margin-bottom: 0
}

.filter-list-primary.box-group li.box-item {
    text-align: center;
    cursor: pointer;
    margin: 0 !important;
    font-family: Headline, Arial, sans-serif;
    font-size: 1.25rem;
    line-height: 3.75rem;
    text-transform: uppercase;
    background-color: #f1f1f1;
    -webkit-transition: transform 0.2s ease;
    -moz-transition: transform 0.2s ease;
    -ms-transition: transform 0.2s ease;
    -o-transition: transform 0.2s ease;
    transition: transform 0.2s ease
}

.filter-list-primary.box-group li.box-item:not(:first-child) {
    border-left: 1px solid #ffffff
}

.filter-list-primary.box-group.box-group-33 li.box-item {
    width: 33.3333%
}

.filter-list-primary.box-group.box-group-50 li.box-item {
    width: 50%
}

.filter-list-primary.box-group li.box-item:hover {
    background-color: #e5e5e5
}

.filter-list-primary.box-group li.box-item.selected {
    font-family: 'Headline-Ultra', Arial, sans-serif;
    color: #ffffff;
    background-color: #333333;
    cursor: default
}

.filter-list-secondary.box-group li.box-item {
    margin-bottom: 0
}

.filter-list-tertiary.box-group {
    margin-bottom: 0
}

.filter-list-tertiary.box-group li.box-item {
    margin-bottom: 0
}

.filter-list-tertiary.box-group .input-select:focus {
    background: #f1f1f1;
    border-color: #f1f1f1
}

.device-list .box-item {
    background: #f1f1f1;
    padding: 1.875rem 1.25rem;
    margin-bottom: 3%
}

.device-list .box-item .device-image {
    height: 14.375rem;
    min-height: 14.375rem
}

.device-list .box-item .device-image:after {
    display: block;
    content: ' ';
    width: 33%;
    height: 5px;
    margin: 5px auto 0;
    background: #000;
    opacity: .1;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    -ms-border-radius: 100%;
    -o-border-radius: 100%;
    border-radius: 100%;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.device-list .box-item .device-image:hover:after {
    opacity: .025;
    width: 50%;
    height: 10px;
    margin-top: 10px !important
}

.device-list .box-item .device-image img {
    height: 14.375rem;
    max-height: 14.375rem;
    width: auto;
    top: 0;
    position: relative;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease
}

.device-list .box-item .device-image:hover img {
    top: -0.5em
}

.device-list .box-item .device-color {
    list-style-type: none;
    right: 0;
    top: 2em
}

.device-list .box-item .device-color li {
    width: 14px;
    height: 14px;
    border: 1px solid #bec0c2;
    margin: 0 0 9px 0
}

.device-list .box-item .device-color li:hover {
    cursor: pointer;
    border: 2px solid #bec0c2;
    margin: 0 0 7px -1px;
    height: 16px;
    width: 16px
}

.device-list .box-item .device-color li.selected {
    height: 16px;
    width: 16px;
    border: 2px solid #3a3a3a;
    margin: 0 0 7px -1px
}

.device-list .box-item .device-color li.selected:hover {
    cursor: default
}

.device-list .box-item .device-color li.white {
    background: #ffffff
}

.device-list .box-item .device-color li.gray {
    background: #e4e4e4
}

.device-list .box-item .device-color li.silver {
    background: #a1a1a1
}

.device-list .box-item .device-color li.black {
    background: #000000
}

.device-list .box-item .device-color li.gold {
    background: #b8a71a
}

.device-list .box-item .device-color li.green {
    background: #598177
}

.device-list .box-item .lte {
    background: url("https://static.hrvatskitelekom.hr/webresources/images/icons/icon-4g.png") no-repeat scroll 0 0;
    bottom: 1em;
    right: -0.35em;
    height: 26px;
    width: 26px
}

.device-list .box-item .special-info {
    line-height: 1rem !important;
    height: 2em;
    margin: 0 0 1.5em 0
}

.device-list .box-item .price-unit {
    padding: 0 1.35em 0 0;
    margin: 0
}

.device-list .box-item .price-unit:after {
    position: relative;
    content: "kn";
    position: absolute;
    right: 0;
    top: 0
}

.device-list .box-item .price-unit.additional-price {
    margin-top: 0.5em
}

.device-list .box-item .price-unit.additional-price:before {
    position: relative;
    content: "+";
    position: absolute;
    left: 50%;
    top: -1em;
    margin-left: -0.25em
}

.device-list .box-item .price-term {
    margin-bottom: 1.25rem
}

.device-list .box-item .button {
    margin-bottom: 1.25rem
}

.device-list .box-item.disabled .device-image img {
    opacity: 0.2;
    filter: Alpha(opacity=20)
}

.device-list .box-item.disabled .special-info {
    color: #333333
}

.compare-list.device-list {
    margin-bottom: 0
}

.compare-list.device-list .box-item {
    background: none;
    border-left: 1px solid #d5d5d5;
    margin-bottom: 0
}

.compare-list.device-list .box-item:nth-child(3n-2) {
    border: none
}

.compare-list.device-list .box-item br {
    display: block;
    margin-bottom: 0.5em
}

.section.device-head.fixed {
    background: #ffffff none repeat scroll 0 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999
}

.section.device-head.fixed:after {
    display: block;
    position: absolute;
    left: 0;
    bottom: -30px;
    content: ' ';
    width: 100%;
    height: 30px;
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.2) 0, transparent 100%);
    background-image: -moz-linear-gradient(rgba(0, 0, 0, 0.2) 0, transparent 100%);
    background-image: -ms-linear-gradient(rgba(0, 0, 0, 0.2) 0, transparent 100%);
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0.2) 0, transparent 100%);
    background-image: linear-gradient(rgba(0, 0, 0, 0.2) 0, transparent 100%)
}

.section.device-head.fixed .grid {
    padding-top: 0
}

.section.device-head.fixed .compare-list.device-list .box-item {
    padding: 0.5rem !important
}

.section.device-head.fixed .compare-list.device-list .box-item h2 {
    font-size: 1rem !important
}

.section.device-head.fixed .device-list .box-item .device-image {
    height: 6rem !important;
    margin-bottom: 1em !important;
    min-height: auto
}

.section.device-head.fixed .device-list .box-item .device-image img {
    height: 6rem !important
}

.device-gallery-control {
    float: left;
    width: 100%;
    margin: 0 0 0.3125em;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding-left: 2em;
    text-align: center
}

.device-gallery-control a {
    display: inline-block;
    width: 2em;
    height: 2em;
    background: transparent url(../images/process-icons.png) no-repeat 0 0;
    margin: 0 0.3125em 0 0
}

.device-gallery-control a.gallery-control-foto {
    background-position: 0 0
}

.device-gallery-control a.gallery-control-video {
    background-position: -40px 0
}

.device-gallery-control a.gallery-control-3d {
    background-position: -80px 0
}

.device-gallery-control a.gallery-control-details {
    background-position: -120px 0
}

.device-gallery-control a.gallery-control-promo {
    background-position: -160px 0
}

.device-gallery-control a.gallery-control-foto:hover {
    background-position: 0 -32px
}

.device-gallery-control a.gallery-control-video:hover {
    background-position: -40px -32px
}

.device-gallery-control a.gallery-control-3d:hover {
    background-position: -80px -32px
}

.device-gallery-control a.gallery-control-details:hover {
    background-position: -120px -32px
}

.device-gallery-control a.gallery-control-promo:hover {
    background-position: -160px -32px
}

.device-gallery-control a.gallery-control-foto.active {
    background-position: 0 -64px
}

.device-gallery-control a.gallery-control-video.active {
    background-position: -40px -64px
}

.device-gallery-control a.gallery-control-3d.active {
    background-position: -80px -64px
}

.device-gallery-control a.gallery-control-details.active {
    background-position: -120px -64px
}

.device-gallery-control a.gallery-control-promo.active {
    background-position: -160px -64px
}

.device-details-box {
    float: left;
    width: 100%;
    padding: 1em;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border: 1px solid #ccc;
    -webkit-border-radius: 0.625em;
    -moz-border-radius: 0.625em;
    border-radius: 0.625em;
    position: relative;
    display: none;
    margin: 0 0 1.25em
}

.device-details-box .up-arrow,
.tarif-promo-box .up-arrow {
    display: block;
    width: 1.6875em;
    height: 0.875em;
    position: absolute;
    top: -0.875em;
    left: 10%;
    background: transparent url(../images/details-box-arrow.png) no-repeat 0 0
}

.device-details-box.foto {
    min-height: 34.375em
}

.device-details-box a.close,
.tarif-promo-box a.close {
    display: block;
    width: 1.25em;
    height: 1.25em;
    position: absolute;
    top: 0.375em;
    right: 0.375em;
    background: transparent url(../images/process-icons.png) no-repeat 0 -184px;
    z-index: 2
}

.device-details-box a.close:hover,
.tarif-promo-box a.close:hover {
    background-position: -20px -184px
}

.pikachoose {
    width: 520px;
    margin: 0 auto
}

.pika-thumbs {
    padding: 0 16px;
    height: 75px
}

#pikame.pika-thumbs li {
    overflow: hidden;
    float: left;
    list-style-type: none;
    margin: 0 6px 6px 0;
    cursor: pointer;
    background: 0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px
}

#pikame.pika-thumbs li:hover img {
    border: 2px solid #c6c6c6
}

.pika-thumbs li .clip {
    position: relative;
    height: 100%;
    text-align: center;
    vertical-align: middle;
    overflow: hidden
}

.pika-thumbs li .clip img {
    padding: 3px 3px 0;
    border: 2px solid #d6d6d6
}

.pika-stage,
.pika-textnav {
    width: 500px
}

.pika-stage {
    position: relative;
    padding: 10px 10px 40px 10px;
    text-align: center
}

.pika-stage .caption {
    display: none
}

.pika-stage .caption p {
    display: none
}

.pika-imgnav a {
    display: none
}

.pika-imgnav a.previous {
    display: none
}

.pika-imgnav a.next {
    display: none
}

.pika-imgnav a.play {
    display: none
}

.pika-imgnav a.pause {
    display: none
}

.pika-textnav {
    display: none
}

.pika-textnav a {
    display: none
}

.pika-textnav a.previous {
    display: none
}

.pika-textnav a.next {
    display: none
}

.pika-tooltip {
    display: none
}

.pika-counter {
    display: none
}

.pika-loader {
    display: none
}

.pika-thumbs li {
    width: 105px;
    height: 105px
}

.pikachoose {
    width: 945px;
    margin: 0 auto;
    position: relative
}

.pika-thumbs {
    margin: 10px 0 0 17px;
    width: 365px;
    position: absolute;
    top: 70px;
    right: 30px
}

.pika-thumbs li {
    margin: 5px 5px
}

.fullspecs-half {
    float: left;
    width: 46%;
    margin: 0 2%
}

.topup-2014,
.topup-2014 * {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}

.topup-2014 {
    border: 1px solid #d0d0d0;
    -moz-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    -webkit-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    -o-box-shadow: 0 0 0 5px rgba(0, 0, 0, 0.025);
    margin: 0 0 2.5em;
    display: table;
    width: 100%
}

.topup-2014 .topup-bon-box {
    display: table-cell;
    text-align: center;
    vertical-align: top;
    position: relative
}

.topup-2014 .topup-bon-box.disabled {
    background: #ececec;
    color: #bcbcbc;
    text-shadow: 1px 1px 0 #fff
}

.topup-2014 .topup-bon-box:after {
    display: table;
    content: '';
    clear: both
}

.topup-2014.box-50 .topup-bon-box {
    width: 50%
}

.topup-2014.box-33 .topup-bon-box {
    width: 33.33333333333333%
}

.topup-2014.box-25 .topup-bon-box {
    width: 25%
}

.topup-2014.box-20 .topup-bon-box {
    width: 20%
}

.topup-2014.box-16 .topup-bon-box {
    width: 16.66666666666667%
}

.topup-2014 .topup-bon-box+.topup-bon-box {
    border-left: 1px solid #d0d0d0
}

.topup-2014 .topup-bon-box .topup-top {
    padding: 1em 0 1.25em
}

.topup-2014 .topup-bon-box .topup-bottom {
    border-top: 1px solid #d0d0d0;
    padding: 1em 0
}

.topup-2014 .topup-bon-box label {
    display: block;
    width: 100%;
    cursor: pointer
}

.topup-2014 .topup-bon-box.disabled label {
    cursor: default
}

.topup-2014 .topup-bon-box.checked:after {
    border: 4px solid #e20074;
    position: Absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    content: '';
    display: block
}

.topup-2014 .topup-bon-box.checked .topup-bottom {
    border-top: 1px solid #ec3c97;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ec3c97), color-stop(100%, #e20074));
    background: -moz-linear-gradient(top, #ec3c97 0%, #e20074 100%);
    background: -webkit-linear-gradient(top, #ec3c97 0%, #e20074 100%);
    background: -o-linear-gradient(top, #ec3c97 0%, #e20074 100%);
    background: -ms-linear-gradient(top, #ec3c97 0%, #e20074 100%);
    background: linear-gradient(to bottom, #ec3c97 0%, #e20074 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ec3c97', endColorstr='#e20074', GradientType=0);
    color: #fff
}

.topup-2014 .topup-bon-box .input-radio {
    margin: 0 0 1em;
    cursor: pointer;
    float: none
}

.topup-2014 .topup-bon-box h5 {
    font: normal 0.875em/1 Headline;
    text-transform: uppercase
}

.topup-2014 .topup-bon-box h5 strong {
    font-family: Headline-ult
}

.topup-2014 .topup-bon-box p {
    font-size: 0.875em;
    margin: 0;
    width: 100%
}

.topup-2014 .topup-bon-box p.big {
    font-size: 1.125em;
    margin: 0 0 0.5em
}

.topup-2014 .topup-bon-box p.big strong {
    font-family: Tele-groteskult
}

.topup-2014 .topup-bon-box p.price {
    font-family: Tele-groteskult;
    font-size: 1.75em;
    line-height: 1.3
}

.topup-2014 .topup-bon-box p.price .currency {
    font-family: Tele-grotesk;
    color: inherit;
    font-size: 0.785em;
    margin: 0
}

.topup-2014 .topup-bon-box .topup-bottom p.price {
    font-size: 3.125em;
    line-height: 1
}

.topup-2014 .topup-bon-box .topup-bottom p.price .currency {
    font-size: 0.5em
}

.topup-2014+p.small-note {
    margin-top: -1em
}

.nadoplata .page-header .grid {
    padding-top: 40px;
    padding-bottom: 20px
}

.nadoplata .section-white+.section-white {
    border-top: none
}

.nadoplata .layout-focus .grid.full {
    max-width: 960px !important
}

.nadoplata .layout-focus .grid.full .pseudo-form:not(.form-focus) fieldset .field {
    border-top: none
}

.nadoplata .pseudo-form {
    margin: 0 0 4em
}

.topup-2014.payment .topup-bon-box {
    position: relative
}

.topup-2014.payment .topup-bon-box label {
    padding: 0 0.75em
}

.topup-2014.payment .topup-bon-box .topup-top {
    padding-bottom: 2.5em
}

.topup-2014.payment .topup-bon-box .promo-bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #ffe292;
    border-top: 1px solid #e4b771;
    padding: 0.5em 0
}

.topup-2014.payment .topup-bon-box .promo-bottom p {
    font: normal 0.8125em/1 Headline-ult;
    text-transform: uppercase
}

.sms-poruka .input-text {
    max-width: 100%
}

.sms-poruka label {
    text-align: left
}

.sms-poruka .small-note {
    text-align: right;
    color: #333
}

.nadoplata .table-wrapper tr th {
    width: 80%
}

.nadoplata .layout-focus .section .grid {
    padding-bottom: 10px !important
}

.field .card-icon-list {
    float: none;
    clear: both;
    margin: 1.75em 0 0;
    display: inline-block
}

.field .card-icon-list:after {
    clear: both;
    content: '';
    display: table
}

@media only screen and (max-width: 768px) {
    .wizard-steps li.current {
        width: 100%;
        padding-top: 15PX
    }
    .topup-2014.box-20 .topup-bon-box,
    .topup-2014.box-25 .topup-bon-box {
        display: block;
        width: 100%
    }
}

.main-menu-container {
    position: relative;
    z-index: 2;
    margin: 1.125em 0 0;
    width: 100%;
    max-width: 60em;
    float: left;
    border: 1px solid #d8d8d8;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    border-radius: 0.25rem;
    background: #ffffff;
    background: -moz-linear-gradient(top, #fff 0%, #e5e5e5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #e5e5e5));
    background: -webkit-linear-gradient(top, #fff 0%, #e5e5e5 100%);
    background: -o-linear-gradient(top, #fff 0%, #e5e5e5 100%);
    background: -ms-linear-gradient(top, #fff 0%, #e5e5e5 100%);
    background: linear-gradient(to bottom, #fff 0%, #e5e5e5 100%);
    -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.35);
    -webkit-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.35);
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.35);
    overflow: visible
}

.main-menu-container>ul {
    list-style-type: none;
    float: left
}

.main-menu-container>ul>li {
    display: inline-block;
    float: left
}

.main-menu-container>ul>li>a {
    display: block;
    padding: 0 1.125em;
    font-size: 1.125em;
    line-height: 40px;
    line-height: 2.5rem;
    font-family: Tele-Grotesk;
    color: #666;
    text-shadow: 0 1px 0 #fff;
    position: relative
}

.main-menu-container>ul>li:first-child>a {
    -moz-border-radius: 0.25rem 0 0 0;
    -webkit-border-radius: 0.25rem 0 0 0;
    border-radius: 0.25rem 0 0 0
}

.main-menu-container>ul>li>a:after,
.main-menu-container>ul>li>a:before {
    display: block;
    content: "";
    position: absolute;
    width: 1px;
    height: 40px;
    height: 2.5rem
}

.main-menu-container>ul>li>a:before {
    left: 0;
    bottom: -1px;
    background: #fff
}

.main-menu-container>ul>li>a:after {
    right: 0;
    bottom: -1px;
    background: #bcbcbc;
    background: -moz-linear-gradient(top, #fff 0%, #bcbcbc 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #bcbcbc));
    background: -webkit-linear-gradient(top, #fff 0%, #bcbcbc 100%);
    background: -o-linear-gradient(top, #fff 0%, #bcbcbc 100%);
    background: -ms-linear-gradient(top, #fff 0%, #bcbcbc 100%);
    background: linear-gradient(to bottom, #fff 0%, #bcbcbc 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#bcbcbc', GradientType=0)
}

.main-menu-container>ul>li:first-child>a:before,
.main-menu-container>ul>li.last>a:after,
.main-menu-container>ul>li:hover>a:before,
.main-menu-container>ul>li:hover>a:after {
    display: none
}

.submenu-container {
    position: absolute;
    left: 0;
    width: 100%;
    background: #7c7c7c;
    padding: 0.9375em 0;
    z-index: 10;
    -moz-border-radius: 0 0 0.25rem 0.25rem;
    -webkit-border-radius: 0 0 0.25rem 0.25rem;
    border-radius: 0 0 0.25rem 0.25rem;
    -moz-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.35);
    -webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.35);
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.35);
    display: none
}

.submenu-container.single {
    left: auto;
    width: auto
}

.submenu-section-container {
    list-style-type: none;
    float: left;
    width: 16.66666666666667%
}

.submenu-container.single .submenu-section-container {
    width: 100%;
    min-width: 10em
}

.submenu-section-container:before {
    display: block;
    content: "";
    width: 1px;
    height: 80%;
    position: absolute;
    top: 10%;
    background: #7c7c7c;
    background: -moz-linear-gradient(top, #7c7c7c 0%, #ccc 50%, #7c7c7c 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #7c7c7c), color-stop(50%, #ccc), color-stop(100%, #7c7c7c));
    background: -webkit-linear-gradient(top, #7c7c7c 0%, #ccc 50%, #7c7c7c 100%);
    background: -o-linear-gradient(top, #7c7c7c 0%, #ccc 50%, #7c7c7c 100%);
    background: -ms-linear-gradient(top, #7c7c7c 0%, #ccc 50%, #7c7c7c 100%);
    background: linear-gradient(to bottom, #7c7c7c 0%, #ccc 50%, #7c7c7c 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7c7c7c', endColorstr='#7c7c7c', GradientType=0)
}

.submenu-section-container:first-child:before {
    display: none
}

.submenu-section-container>li>a {
    display: block;
    color: #fff;
    font: normal 0.9375em/1.1 Tele-Grotesk;
    padding: 0.3em 1em
}

.submenu-section-container>li.top>a {
    font-family: Tele-GroteskFet;
    text-transform: uppercase
}

.submenu-section-container>li>a:hover {
    background: #8c8c8c
}

.main-menu-container>ul>li:hover>.submenu-container {
    display: block
}

.main-menu-container>ul>li:hover>a {
    background: #7c7c7c;
    color: #fff;
    text-shadow: none
}

#nogomet-home-bann {
    height: 6.4375em;
    background: #000 url(../images/banners/nogomet_trakica.jpg) no-repeat center top;
    border-bottom: 1px solid #aabccf;
    float: left;
    width: 100%
}

#nogomet-home-bann .grid {
    position: relative;
    z-index: 101
}

#nogomet-home-bann .grid:after {
    content: '';
    display: block;
    width: 3.1875em;
    height: 5.0625em;
    background: transparent url(../images/ostalo/nogomet_trakica_1.png) no-repeat 0 0;
    position: absolute;
    top: 6.4375em;
    left: 50%;
    margin: 0 0 0 155px
}

#nogomet-home-bann h3 {
    font: normal 2.25em/0.9 Headline;
    margin: 0.5em 0 0;
    text-transform: uppercase;
    color: #fff;
    float: left;
    text-shadow: 5px 5px 8px rgba(0, 0, 0, 0.2)
}

#nogomet-home-bann h3 strong {
    font-family: Headline-bold
}

#nogomet-home-bann .button-magenta {
    float: right;
    margin: 1.875em 3.25em 0 0
}

#master-header {
    border-bottom: 1px solid #d0d0d0;
    background: #fff;
    background-image: -webkit-linear-gradient(#fff, #f6f6f6);
    background-image: -moz-linear-gradient(#fff, #f6f6f6);
    background-image: -o-linear-gradient(#fff, #f6f6f6);
    background-image: -ms-linear-gradient(#fff, #f6f6f6);
    background-image: linear-gradient(#fff, #f6f6f6);
    background: #f6f6f6
}

#master-header .grid * {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}

#master-header:after {
    content: '';
    display: table;
    clear: both
}

#master-header.master-header-site-3 {
    margin-bottom: 0
}

#logo {
    float: left;
    width: 24.8%;
    font-size: 1em !important;
    height: 3.75em;
    background: url(../images/t-logo-desktop.png) no-repeat 0 50%;
    margin: 0
}

#logo a {
    display: block;
    height: 3.75em
}

#master-main-nav {
    float: right;
    width: 75.15%;
    margin: 0 -1px 0 0;
    position: relative
}

#master-main-nav .level-1-ul.page-switch {
    width: 66.6%
}

#master-main-nav>ul {
    margin: 0
}

#master-main-nav .level-1-li {
    float: left;
    list-style: none
}

#master-main-nav .level-1-ul.page-switch .level-1-li {
    width: 25%
}

#main-menu-item-ict .level-2-li-icon-device {
    width: 14.28%;
    padding: 0;
    text-align: center
}

#main-menu-item-ict .level-2-li-icon-device a {
    padding: 1.857em 0.7em 0.7em;
    height: 9.642em;
    text-transform: none;
    border-right: 1px solid #6c6c6c
}

#main-menu-item-ict .level-2-li-icon-device a:before {
    content: '';
    height: 52px;
    width: 70px;
    display: block;
    background: transparent url(https://static.hrvatskitelekom.hr/webresources/images/icons/ICT_usluge_dropdown.png) no-repeat 50% 40%;
    background-size: 960px 240px;
    margin: 0 auto 18px
}

#main-menu-item-ict .level-2-li-icon-device:nth-child(-n+7) a {
    border-bottom: 1px solid #6c6c6c
}

#main-menu-item-ict .level-2-li-icon-device:nth-child(7) a,
#main-menu-item-ict .level-2-li-icon-device:nth-child(14) a {
    border-right: 0
}

#main-menu-item-ict #main-nav-icon-item-fiskal a:before {
    background-position: -33px -26px
}

#main-menu-item-ict #main-nav-icon-item-oprema a:before {
    background-position: -170px -26px
}

#main-menu-item-ict #main-nav-icon-item-busapp a:before {
    background-position: -307px -26px
}

#main-menu-item-ict #main-nav-icon-item-infrastructure a:before {
    background-position: -444px -26px
}

#main-menu-item-ict #main-nav-icon-item-internetbus a:before {
    background-position: -581px -26px
}

#main-menu-item-ict #main-nav-icon-item-media a:before {
    background-position: -718px -26px
}

#main-menu-item-ict #main-nav-icon-item-solution a:before {
    background-position: -855px -26px
}

#main-menu-item-ict #main-nav-icon-item-marketplace a:before {
    background-position: -33px -156px
}

#main-menu-item-ict #main-nav-icon-item-academy a:before {
    background-position: -170px -156px
}

#main-menu-item-ict #main-nav-icon-item-partner a:before {
    background-position: -307px -156px
}

#main-menu-item-ict #main-nav-icon-item-support a:before {
    background-position: -444px -156px
}

#main-menu-item-ict #main-nav-icon-item-wholesale a:before {
    background-position: -581px -156px
}

#main-menu-item-ict #main-nav-icon-item-promo a:before {
    background-position: -718px -156px
}

#main-menu-item-ict #main-nav-icon-item-security a:before {
    background-position: -855px -156px
}

#main-menu-item-ict .level-2-li>a {
    text-transform: none !important
}

@media screen and (min-width: 768px) {
    #master-main-nav .page-switch .level-1-li {
        display: block !important
    }
}

#master-main-nav .page-switch .level-1-li:first-child {
    border-left: 1px solid #d0d0d0
}

#master-main-nav .level-1-li>a {
    display: block;
    height: 5em;
    padding: 0.8333333333333333em 1.666666666666667em;
    font-family: Tele-Grotesk;
    line-height: 1.666666666666667;
    color: #e20074;
    font-size: 0.75em;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    text-shadow: 0 1px 0 #fff;
    border-right: 1px solid #d0d0d0;
    border-left: 1px solid #fff;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    -ms-transition: all .2s ease;
    transition: all .2s ease
}

#master-main-nav .level-1-li>a:hover {
    background-color: #fff !important
}

#master-main-nav .icon-link {
    width: 8.33%;
    letter-spacing: -0.05em
}

#master-main-nav .icon-link.double {
    width: 16.7%;
    position: relative
}

#master-main-nav .icon-link.double a.ups {
    letter-spacing: -0.05em;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    color: #333;
    text-indent: 1px;
    text-shadow: none;
    text-align: center;
    padding: 2em 10% 0 35%;
    font: normal 0.75em/1em Tele-GroteskUlt;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis
}

#master-main-nav .icon-link.double a.ups:hover,
#master-main-nav .icon-link.double a.ups.active {
    color: #fff
}

#master-main-nav .icon-link>a {
    text-indent: -9999px;
    position: relative;
    background: url(../images/icons/global-nav-icons-new.png) no-repeat;
    background-size: 430px 241px;
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    -ms-transition: none;
    transition: none
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-resolution: 240dpi) {
    #master-main-nav .icon-link>a {
        background-image: url(../images/icons/global-nav-icons-@2x-new.png) !important
    }
}

#master-main-nav .icon-link:hover>a,
#master-main-nav .icon-link>a:active,
#master-main-nav .icon-link>a.active {
    background-color: #333 !important;
    border-left-color: #333;
    border-right-color: #333
}

#master-main-nav #cart-link>a {
    background-position: 0 0
}

#master-main-nav #cart-link.cart-full>a {
    background-position: 0 -180px
}

#master-main-nav #cart-link>a.active,
#master-main-nav #cart-link>a:active,
#master-main-nav #cart-link:hover>a {
    background-position: 0 -60px
}

#master-main-nav #cart-link.cart-full:hover>a {
    background-position: 0 -120px
}

#master-main-nav #login-link {
    position: relative
}

#master-main-nav #login-link>a {
    background-position: -65px 0
}

#master-main-nav #login-link.user-logged-in>a {
    background-position: -65px -120px
}

#master-main-nav #login-link.user-logged-in-female>a {
    background-position: -180px -120px
}

#master-main-nav #login-link:hover>a,
#master-main-nav #login-link>a:active,
#master-main-nav #login-link>a.active,
#master-main-nav #login-link.user-logged-in:hover>a,
#master-main-nav #login-link.user-logged-in>a:active,
#master-main-nav #login-link.user-logged-in>a.active {
    background-position: -65px -60px
}

#master-main-nav #login-link.user-logged-in-female:hover>a,
#master-main-nav #login-link.user-logged-in-female>a:active,
#master-main-nav #login-link.user-logged-in-female>a.active {
    background-position: -180px -60px
}

#master-main-nav #search-link {
    border-right: 1px solid #fff
}

#master-main-nav #search-link>a {
    background-position: -285px 0
}

#master-main-nav #search-link:hover>a,
#master-main-nav #search-link>a:active,
#master-main-nav #search-link>a.active {
    background-position: -285px -60px
}

#master-main-nav #site-nav-link>a {
    background-position: -345px 0
}

#master-main-nav #site-nav-link:hover>a,
#master-main-nav #site-nav-link>a:active,
#master-main-nav #site-nav-link>a.active {
    background-position: -345px -60px
}

#master-main-nav .notification-badge {
    display: inline-block;
    text-indent: 0;
    text-align: center !important;
    color: #fff;
    background: #e20074;
    min-width: 24px;
    height: 20px;
    line-height: 20px;
    padding: 0 2px 0 3px;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    -o-border-radius: 100px;
    border-radius: 100px;
    font-weight: bold;
    text-shadow: none
}

#master-main-nav #main-nav-link {
    display: none
}

#user-shortcuts:target {
    display: block
}

#user-shortcuts {
    position: absolute;
    z-index: 1000;
    top: 100%;
    right: 0;
    line-height: 20px;
    width: 19em;
    padding: 0.3125em 0;
    color: #fff;
    background: #333;
    -moz-border-radius: 0 0 0.25rem 0.25rem;
    -o-border-radius: 0 0 0.25rem 0.25rem;
    -webkit-border-radius: 0 0 0.25rem 0.25rem;
    border-radius: 0 0 0.25rem 0.25rem;
    -webkit-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25);
    -o-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25);
    box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25)
}

#user-shortcuts .level-2-li {
    font-size: 0.875em
}

#user-shortcuts .level-2-li-divider {
    border-top: 1px solid #6c6c6c
}

#user-shortcuts .level-2-li .notification-badge {
    float: right
}

#user-shortcuts .level-2-li a,
#user-shortcuts .level-2-li>strong {
    display: block;
    padding: 0.357em 1.428em;
    text-decoration: none;
    color: #fff
}

#user-shortcuts .level-2-li a:hover,
#user-shortcuts .level-2-li a:focus {
    color: #fff;
    background: #e20074
}

#user-shortcuts .level-2-li a:hover .notification-badge,
#user-shortcuts .level-2-li a:focus .notification-badge {
    color: #e20074;
    background: #fff
}

#user-shortcuts .level-2-li-welcome {
    padding: 0.357em 1.428em
}

#user-shortcuts .level-2-li-welcome p {
    font-family: Tele-GroteskFet;
    font-size: 1.125em;
    margin: 0
}

#user-shortcuts .level-2-li-welcome p span {
    text-transform: uppercase
}

#user-shortcuts .level-2-li-puce {
    padding: 1.428em
}

#user-shortcuts .level-2-li-puce p {
    font-family: Tele-Grotesk;
    text-align: center;
    font-size: 0.9375em;
    margin: 0.5em 0 0 0
}

#user-shortcuts .level-2-li-puce a.button-magenta {
    text-align: center;
    width: 100%
}

#user-shortcuts .level-2-li-puce a.plainlink {
    display: inline;
    padding: 0;
    margin: 0;
    text-decoration: underline
}

#user-shortcuts .level-2-li-puce a.plainlink:hover {
    background: none;
    text-decoration: none
}

#user-shortcuts .level-2-li-divider>strong {
    margin-top: 0.5em
}

#active-service-options {
    background: #333
}

#active-service-options .level-3-li:after {
    content: '';
    display: table;
    clear: both
}

#active-service-options .label-radio {
    float: left;
    width: 100%;
    padding: 0.357em 6.428em 0.357em 1.428em !important;
    white-space: nowrap;
    overflow: hidden;
    color: #fff;
    cursor: pointer
}

#active-service-options .label-radio .input-radio {
    margin-right: .5em
}

#active-service-options .level-3-li label a {
    display: inline-block;
    padding: 0
}

#active-service-options .level-3-li .info-link {
    float: left;
    width: 5em;
    margin-left: -5em;
    color: #fff;
    text-transform: uppercase;
    text-align: right
}

@media (max-width: 1350px) {
    #active-service-options .level-3-li .info-link {
        display: none
    }
}

#master-main-nav #main-nav-search {
    position: absolute;
    z-index: 1000;
    top: 100%;
    left: 0;
    right: 1px;
    background: #333;
    -moz-border-radius: 0 0 0.25rem 0.25rem;
    -o-border-radius: 0 0 0.25rem 0.25rem;
    -webkit-border-radius: 0 0 0.25rem 0.25rem;
    border-radius: 0 0 0.25rem 0.25rem;
    -webkit-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25);
    -o-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25);
    box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25)
}

#master-main-nav #main-nav-search:target {
    display: block
}

#master-main-nav #main-nav-search fieldset {
    border: 0
}

#master-main-nav #main-nav-search label {
    font-size: 14px;
    display: block;
    display: none;
    padding-bottom: 4px
}

#master-main-nav #main-nav-search .input-text {
    -webkit-appearance: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    float: left;
    border: 0;
    width: 100% !important;
    font: bold 32px/40px Tele-Grotesk, Arial, sans-serif;
    padding: 10px 125px 10px 10px;
    height: 60px;
    width: 100%;
    color: #4b4b4b;
    border: 0;
    color: #fff;
    background: none
}

#master-main-nav #main-nav-search .input-text:focus {
    outline: none
}

#master-main-nav #main-nav-search .input-search {
    -webkit-appearance: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    float: left;
    border: 0;
    width: 100% !important;
    font: bold 32px/40px Tele-Grotesk, Arial, sans-serif;
    padding: 10px 125px 10px 10px;
    height: 60px;
    width: 100%;
    color: #4b4b4b;
    border: 0;
    color: #fff;
    background: none
}

#master-main-nav #main-nav-search .input-search:focus {
    outline: none
}

#master-main-nav #main-nav-search .button-magenta {
    float: left;
    margin: 10px 0 10px -120px;
    height: 40px;
    font: normal 18px/40px Headline-ult, Arial, sans-serif;
    text-transform: uppercase;
    letter-spacing: .05em;
    padding: 0 1.5em
}

#master-main-nav li.current {
    border-left: 0
}

#master-main-nav li.current>a {
    margin-bottom: -1px;
    height: 61px;
    height: 3.8125rem;
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    background-color: #fff !important
}

@media screen and (max-width: 992px) {
    #master-main-nav {
        width: 75% !important
    }
    #master-main-nav .icon-link {
        width: 8.25% !important
    }
    #master-main-nav .icon-link.double {
        width: 16.7% !important;
        position: relative
    }
    #master-main-nav #cart-link>a {
        background-position: 0 0
    }
    #master-main-nav #cart-link:hover>a,
    #master-main-nav #cart-link>a:active,
    #master-main-nav #cart-link>a.active {
        background-position: 0 -60px
    }
    #master-main-nav #search-link>a {
        background-position: -285px 0
    }
    #master-main-nav #search-link:hover>a,
    #master-main-nav #search-link>a:active,
    #master-main-nav #search-link>a.active {
        background-position: -285px -60px
    }
}

@media screen and (max-width: 768px) {
    #master-main-nav {
        float: none;
        width: 100% !important;
        margin: 0
    }
    #master-header .wrapper {
        width: 100%;
        padding: 0
    }
    #logo {
        position: absolute;
        bottom: 0;
        left: 0.625em;
        width: 5em;
        height: 3em;
        z-index: 2
    }
    #logo a {
        height: 3em
    }
    #master-main-nav .page-control {
        width: 13em !important
    }
    #master-main-nav .page-control .level-1-li:first-child {
        border-left: 1px solid #d0d0d0
    }
    #master-main-nav .page-control {
        float: right;
        width: 14em
    }
    #master-main-nav .page-control .level-1-li>a {
        height: 4em
    }
    #master-main-nav .page-switch {
        border-bottom: 1px solid #d0d0d0;
        width: 100% !important
    }
    #master-main-nav .page-switch:after {
        content: '';
        display: table;
        clear: both
    }
    #master-main-nav .page-switch .level-1-li {
        width: 25%;
        display: table !important
    }
    #master-main-nav .page-switch .level-1-li>a {
        height: 48px;
        line-height: 1.4;
        padding: 0 0.25em;
        border-bottom: none;
        display: table-cell;
        vertical-align: middle
    }
    #master-main-nav .page-switch li.current>a {
        margin: 0
    }
    #master-main-nav .page-switch .level-1-li:first-child {
        border-left: none
    }
    #master-main-nav .page-switch .level-1-li:last-child a {
        border-right: none
    }
    #master-main-nav .icon-link.double,
    #master-main-nav .icon-link {
        width: 25% !important
    }
    #master-main-nav .icon-link.double a.ups {
        text-indent: -9999px;
        width: auto;
        text-align: left;
        border-right: 1px solid #d0d0d0
    }
    #master-main-nav .icon-link.double .add-elements {
        display: none
    }
    #master-main-nav #login-link>a {
        background-position: -65px -6px
    }
    #master-main-nav #cart-link>a {
        background-position: -6px -6px
    }
    #master-main-nav #search-link>a {
        background-position: -287px -6px !important
    }
    #master-main-nav #main-nav-search {
        right: 0;
        top: 97px;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0
    }
    #master-main-nav #main-nav-link>a {
        background-position: -347px -6px !important
    }
    #master-main-nav #search-link:hover>a,
    #master-main-nav #search-link>a:active,
    #master-main-nav #search-link>a.active {
        background-position: -287px -66px !important
    }
    #master-main-nav #main-nav-link:hover>a,
    #master-main-nav #main-nav-link>a:active,
    #master-main-nav #main-nav-link>a.active {
        background-position: -347px -66px !important
    }
    #user-shortcuts .level-2-li {
        font-size: 1em;
        border-bottom: 1px solid #6c6c6c
    }
    #user-shortcuts .level-2-li a {
        padding: 0.825em 1.428em
    }
    #user-shortcuts .level-2-li-divider {
        border-bottom: 1px solid #6c6c6c;
        border-top: 0
    }
    #user-shortcuts .level-2-li-puce p {
        font-size: 1em
    }
    #master-main-nav #search-link,
    #master-main-nav #main-nav-link>a {
        border-right: none
    }
    #master-main-nav #main-nav-link {
        display: block
    }
    #master-main-nav #main-nav-link>a {
        background-position: -242px -6px
    }
    #master-main-nav #main-nav-link:hover>a,
    #master-main-nav #main-nav-link>a:active,
    #master-main-nav #main-nav-link>a.active {
        background-position: -242px -66px
    }
    #master-main-nav #cart-link>a {
        background-position: -2px -6px
    }
    #master-main-nav #cart-link.cart-full>a {
        background-position: -2px -186px
    }
    #master-main-nav #cart-link:hover>a {
        background-position: -2px -66px
    }
    #master-main-nav #cart-link.cart-full:hover>a {
        background-position: -2px -126px
    }
    #master-main-nav #login-link>a {
        background-position: -65px -6px
    }
    #master-main-nav #login-link.user-logged-in>a {
        background-position: -65px -126px
    }
    #master-main-nav #login-link.user-logged-in-female>a {
        background-position: -122px -126px
    }
    #master-main-nav #login-link:hover>a,
    #master-main-nav #login-link>a:active,
    #master-main-nav #login-link>a.active,
    #master-main-nav #login-link.user-logged-in:hover>a,
    #master-main-nav #login-link.user-logged-in>a:active,
    #master-main-nav #login-link.user-logged-in>a.active {
        background-position: -65px -66px
    }
    #master-main-nav #login-link.user-logged-in-female:hover>a,
    #master-main-nav #login-link.user-logged-in-female>a:active,
    #master-main-nav #login-link.user-logged-in-female>a.active {
        background-position: -122px -66px
    }
    #master-main-nav #search-link>a {
        background-position: -182px -6px
    }
    #master-main-nav #search-link:hover>a,
    #master-main-nav #search-link>a:active,
    #master-main-nav #search-link>a.active {
        background-position: -182px -66px
    }
    #master-main-nav .page-switch-trigger {
        display: none;
        position: absolute;
        right: 0;
        top: 0;
        background: transparent url(../images/icons/global-nav-icons.png) no-repeat -285px -7px;
        width: 4em;
        height: 2.2em;
        height: 100%;
        cursor: pointer
    }
    #master-main-nav .page-switch-trigger.active {
        background-position: -285px -68px
    }
    #master-main-nav .page-switch .current .page-switch-trigger {
        display: inline-block
    }
    #master-main-nav #login-link {
        position: inherit
    }
    #user-shortcuts {
        left: 0;
        top: 97px;
        line-height: 20px;
        width: auto;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0
    }
    #master-main-nav #main-nav-search {
        right: 0;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0
    }
}

@media only screen and (min-width: 600px) {
    #main-nav-link {
        display: none
    }
}

@media screen and (max-width: 580px) {
    #master-main-nav #main-nav-search .input-text,
    #master-main-nav #main-nav-search .input-search {
        width: 100% !important;
        font-size: 24px;
        padding: 10px
    }
    #master-main-nav #main-nav-search .button-magenta {
        float: none;
        margin: 0 10px 10px
    }
}

@media screen and (max-width: 440px) {
    #master-main-nav .page-switch .level-1-li>a .long {
        display: none
    }
    #master-main-nav .page-switch .level-1-li>a br {
        display: none
    }
}

.neu {
    display: none
}

.nav li {
    list-style: none !important
}

.nav li a {
    text-decoration: none
}

.section-nav-2014 {
    width: 100%;
    margin: 1.25em auto 0;
    position: relative;
    z-index: 500
}

.section-nav-2014 a {
    color: #fff
}

.section-nav-2014 * {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}

.section-nav-2014 .level-1-ul {
    position: relative;
    background: #ffffff;
    background: -moz-linear-gradient(top, #fff 0%, #f6f6f6 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #f6f6f6));
    background: -webkit-linear-gradient(top, #fff 0%, #f6f6f6 100%);
    background: -o-linear-gradient(top, #fff 0%, #f6f6f6 100%);
    background: -ms-linear-gradient(top, #fff 0%, #f6f6f6 100%);
    background: linear-gradient(to bottom, #fff 0%, #f6f6f6 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6', GradientType=0);
    -moz-border-radius: 0.25rem;
    -o-border-radius: 0.25rem;
    -webkit-border-radius: 0.25rem;
    border-radius: 0.25rem
}

.section-nav-2014 .level-1-ul:after {
    content: '';
    display: table;
    clear: both
}

.section-nav-2014 .level-1-li {
    width: 12.5%;
    display: table-cell;
    vertical-align: middle;
    border: 1px solid #d0d0d0;
    border-left: 0
}

.section-nav-2014 .six .level-1-li {
    width: 16.6683%
}

.section-nav-2014 .seven .level-1-li {
    width: 14.28571428571429%
}

.section-nav-2014 .eight .level-1-li {
    width: 12.5%
}

.section-nav-2014 .level-1-li:first-child {
    border-left: 1px solid #d0d0d0
}

.section-nav-2014 .level-2-li {
    float: left
}

.section-nav-2014 .level-1-li>a {
    letter-spacing: -0.05em;
    display: block;
    height: 100%;
    font-size: 0.8125em;
    padding: 0.6923076923076923em 1.538em;
    line-height: 1.538461538461538em;
    text-align: center;
    text-transform: uppercase;
    color: #333;
    position: relative
}

.section-nav-2014 .podrska .level-1-li {
    display: table;
    float: left
}

.section-nav-2014 .podrska .level-1-li>a {
    display: table-cell;
    height: 56px;
    vertical-align: middle;
    line-height: 1.45em
}

.section-nav-2014 .level-1-li:first-child {
    -webkit-border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    -o-border-radius: 4px 0 0 4px;
    border-radius: 4px 0 0 4px
}

.section-nav-2014 .level-1-li-has-children:first-child:hover {
    -webkit-border-radius: 4px 0 0 0;
    -moz-border-radius: 4px 0 0 0;
    -o-border-radius: 4px 0 0 0;
    border-radius: 4px 0 0 0
}

.section-nav-2014 .level-1-li:last-child {
    -webkit-border-radius: 0 4px 4px 0;
    -moz-border-radius: 0 4px 4px 0;
    -o-border-radius: 0 4px 4px 0;
    border-radius: 0 4px 4px 0
}

.section-nav-2014 .level-1-li-has-children:last-child:hover {
    -webkit-border-radius: 0 4px 0 0;
    -moz-border-radius: 0 4px 0 0;
    -o-border-radius: 0 4px 0 0;
    border-radius: 0 4px 0 0
}

.section-nav-2014 .level-1-li.current {
    background: #fff;
    border-bottom-color: #fff
}

.section-nav-2014 .level-1-li:hover {
    background: #E20074;
    border-color: #e20074
}

.section-nav-2014 .level-1-li:hover>a {
    color: #fff
}

.section-nav-2014 .level-2-ul {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    background: #333;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    -o-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
    -webkit-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25);
    -o-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25);
    box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.25)
}

.section-nav-2014 .level-2-ul.single-level {
    width: 18.75em;
    padding: 0.3125em 0 0.625em;
    left: auto;
    right: auto
}

#main-menu-item-promo .level-2-ul {
    right: 0
}

.section-nav-2014 .level-1-li:hover>ul.level-2-ul {
    display: block
}

.section-nav-2014 .level-2-li {
    float: left;
    width: 20%;
    padding: 0.714em 0;
    font-size: 0.875em
}

.section-nav-2014 .level-2-li>a {
    display: block;
    padding: 0.5em 1.428em
}

.section-nav-2014 .level-2-li a:hover {
    color: #e20074;
    color: #fff;
    background: #e20074
}

.section-nav-2014 .level-2-ul.single-level .level-2-li {
    float: none;
    width: 100%;
    padding: 0
}

.section-nav-2014 .level-2-li-divider,
.section-nav-2014 .level-3-li-divider {
    border-top: 1px solid #6c6c6c
}

.section-nav-2014 .level-2-ul-3-subsections .level-2-li {
    width: 33.33333333%
}

.section-nav-2014 .level-2-ul-4-subsections .level-2-li {
    width: 25%
}

.section-nav-2014 .level-2-ul-5-subsections .level-2-li {
    width: 20%
}

.section-nav-2014 .level-2-ul-6-subsections .level-2-li {
    width: 16.66666666%
}

.section-nav-2014 .level-2-ul-7-subsections .level-2-li {
    width: 14.28%
}

.section-nav-2014 .level-3-ul {
    width: 100%
}

.section-nav-2014 .level-3-li {
    width: 100%
}

.section-nav-2014 .level-3-li>a {
    display: block;
    padding: 0.5em 1.428em
}

.section-nav-2014 .level-4-ul {
    display: block;
    display: none
}

.section-nav-2014 .level-4-li a {
    display: block;
    padding: 5px 20px;
    color: #999
}

.section-nav-2014 .level-5-li a {
    display: block;
    padding: 5px 20px 5px 30px;
    color: #6c6c6c
}

@media only screen and (max-width: 768px) {
    .section-nav-2014 {
        margin: 0;
        position: absolute;
        display: none;
        left: 0;
        right: 0;
        top: 0;
        height: auto
    }
    .section-nav-2014.shown {
        display: block
    }
    .section-nav-2014 .level-1-ul {
        background: #f6f6f6;
        filter: none;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0;
        -webkit-box-shadow: 0 16px 16px -5px rgba(0, 0, 0, 0.35);
        -moz-box-shadow: 0 16px 16px -5px rgba(0, 0, 0, 0.35);
        -o-box-shadow: 0 16px 16px -5px rgba(0, 0, 0, 0.35);
        box-shadow: 0 16px 16px -5px rgba(0, 0, 0, 0.35)
    }
    .section-nav-2014 .level-1-li {
        width: 100% !important;
        display: block;
        border: none;
        border-top: 1px solid #d0d0d0;
        position: relative
    }
    .section-nav-2014 .level-1-li:first-child {
        border-top: none;
        border-left: none
    }
    .section-nav-2014 .level-1-li:last-child,
    .section-nav-2014 .level-1-li-has-children:last-child:hover,
    .section-nav-2014 .level-1-li-has-children:first-child:hover,
    .section-nav-2014 .level-1-li:first-child {
        -moz-border-radius: 0;
        -o-border-radius: 0;
        -webkit-border-radius: 0;
        border-radius: 0
    }
    .section-nav-2014 .level-1-li>a {
        font-size: 1.0625em;
        padding: 0.625em 0.5em;
        line-height: 1.3em;
        text-align: left;
        font-family: Tele-groteskhal
    }
    .section-nav-2014 .level-1-li:hover {
        background: none;
        border-color: #d0d0d0
    }
    .section-nav-2014 .level-1-li:hover>a {
        color: #333
    }
    .section-nav-2014 .level-2-ul {
        position: relative;
        top: auto;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        -o-box-shadow: none;
        box-shadow: none;
        padding: 0
    }
    .section-nav-2014 .level-2-ul.single-level {
        width: 100%;
        padding: 0
    }
    .section-nav-2014 .level-2-li {
        float: none;
        width: 100%;
        padding: 0.714em 0;
        font-size: 1.0625em
    }
    .section-nav-2014 .level-2-li>a {
        display: block;
        padding: 0.5em 0.47em
    }
    #main-menu-item-mobile .level-2-li>a,
    #main-menu-item-ict .level-2-li>a {
        font-family: Tele-groteskfet
    }
    .section-nav-2014 .level-2-ul-3-subsections .level-2-li,
    .section-nav-2014 .level-2-ul-4-subsections .level-2-li,
    .section-nav-2014 .level-2-ul-5-subsections .level-2-li,
    .section-nav-2014 .level-2-ul-6-subsections .level-2-li,
    .section-nav-2014 .level-2-ul-7-subsections .level-2-li {
        width: 100%;
        padding: 0
    }
    .section-nav-2014 .level-2-ul.categories-icons:after {
        content: '';
        display: table;
        clear: both
    }
    .section-nav-2014 .level-1-li:hover>ul.level-2-ul {
        display: none
    }
    .section-nav-2014 .level-1-li>.menu-trigger {
        position: absolute;
        display: block;
        width: 3.375em;
        height: 2.75em;
        right: 0;
        top: 0;
        z-index: 2
    }
    .section-nav-2014 .level-1-li>.menu-trigger:before {
        content: '';
        background: transparent url(../images/icons/global-nav-icons.png) no-repeat -295px -3px;
        width: 100%;
        height: 100%;
        display: block
    }
    .section-nav-2014 .level-1-li>.menu-trigger.active:before {
        background-position: -295px -64px
    }
    .section-nav-2014 .podrska .level-1-li {
        display: block
    }
    .section-nav-2014 .podrska .level-1-li>a {
        display: block;
        height: auto
    }
    .section-nav-2014 .level-3-li>a {
        padding: 8px 8px
    }
    .section-nav-2014 .level-2-li-divider,
    .section-nav-2014 .level-3-li-divider {
        border-top: none
    }
    #main-menu-item-mobile .level-3-li-divider,
    #main-menu-item-ict .level-3-li-divider {
        margin: 0;
        width: auto
    }
    #main-menu-item-mobile .level-3-li-divider>a,
    #main-menu-item-ict .level-3-li-divider>a {
        margin: 0
    }
    .section-nav-2014 .level-2-li,
    .section-nav-2014 .level-3-li {
        border-top: 1px solid #6c6c6c
    }
    #main-menu-item-devices .level-2-li-icon-device {
        width: 25%;
        float: left;
        font-size: 0.9375em;
        border: none
    }
    #main-menu-item-devices .level-2-li-icon-device a {
        border-right: 1px solid #6c6c6c !important;
        border-bottom: 1px solid #6c6c6c !important
    }
    #main-menu-item-devices .level-2-li-icon-device:nth-child(4n) a {
        border-right: none !important
    }
    #main-menu-item-devices .level-2-li-icon-device:nth-child(n+13) a {
        border-bottom: none !important
    }
    #main-menu-item-devices {
        display: none
    }
}

#main-menu-item-mobile .level-2-li>a,
#main-menu-item-internet .level-2-li>a,
#main-menu-item-ict .level-2-li>a {
    text-transform: uppercase
}

#main-menu-item-devices .level-2-li-icon-device {
    width: 14.28%;
    padding: 0;
    text-align: center
}

#main-menu-item-devices .level-2-li-icon-device a {
    padding: 1.857em 0.7em 0.7em;
    height: 9.642em;
    text-transform: none;
    border-right: 1px solid #6c6c6c
}

#main-menu-item-devices .level-2-li-icon-device a:before {
    content: '';
    height: 52px;
    width: 70px;
    display: block;
    background: transparent url(../images/icons/mobile-devices.png) no-repeat 50% 40%;
    background-size: 960px 240px;
    margin: 0 auto 18px
}

#main-menu-item-devices .level-2-li-icon-device:nth-child(-n+7) a {
    border-bottom: 1px solid #6c6c6c
}

#main-menu-item-devices .level-2-li-icon-device:nth-child(7) a,
#main-menu-item-devices .level-2-li-icon-device:nth-child(14) a {
    border-right: 0
}

#main-menu-item-devices #main-nav-icon-item-4g a:before {
    background-position: -33px -26px
}

#main-menu-item-devices #main-nav-icon-item-apple a:before {
    background-position: -170px -26px
}

#main-menu-item-devices #main-nav-icon-item-android a:before {
    background-position: -307px -26px
}

#main-menu-item-devices #main-nav-icon-item-blackberry a:before {
    background-position: -444px -26px
}

#main-menu-item-devices #main-nav-icon-item-windows a:before {
    background-position: -581px -26px
}

#main-menu-item-devices #main-nav-icon-item-tablets a:before {
    background-position: -718px -26px
}

#main-menu-item-devices #main-nav-icon-item-standards a:before {
    background-position: -855px -26px
}

#main-menu-item-devices #main-nav-icon-item-prp-phones a:before {
    background-position: -33px -146px
}

#main-menu-item-devices #main-nav-icon-item-coming-soon a:before {
    background-position: -170px -146px
}

#main-menu-item-devices #main-nav-icon-item-sim-only a:before {
    background-position: -307px -146px
}

#main-menu-item-devices #main-nav-icon-item-usb-pop a:before {
    background-position: -444px -146px
}

#main-menu-item-devices #main-nav-icon-item-usb-prp a:before {
    background-position: -581px -146px
}

#main-menu-item-devices #main-nav-icon-item-accessories a:before {
    background-position: -718px -146px
}

#main-menu-item-devices #main-nav-icon-item-everything a:before {
    background-position: -855px -146px
}

#main-menu-item-mobile .level-3-li-divider,
#main-menu-item-ict .level-3-li-divider {
    padding-left: 0;
    padding-right: 0;
    margin: 0 20px;
    width: auto
}

#main-menu-item-mobile .level-3-li-divider>a,
#main-menu-item-ict .level-3-li-divider>a {
    margin-left: -20px;
    margin-right: -20px;
    position: relative
}

#coverage-map a {
    padding-bottom: 140px;
    background-image: url(../images/icons/coverage.png);
    background-repeat: no-repeat;
    background-position: 20px 100%;
    background-size: 100px 120px
}

@media (-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
    #main-menu-item-devices .level-2-li-icon-device a:before {
        background-image: url(../images/icons/mobile-devices-@2x.png) !important
    }
    #coverage-map a {
        background-image: url(../images/icons/coverage-@2x.png) !important
    }
}

#process-header {
    border-bottom: 1px solid #d0d0d0;
    margin-bottom: 24px;
    background: #fff;
    background-image: -webkit-linear-gradient(#fff, #f6f6f6);
    background-image: -moz-linear-gradient(#fff, #f6f6f6);
    background-image: -o-linear-gradient(#fff, #f6f6f6);
    background-image: -ms-linear-gradient(#fff, #f6f6f6);
    background-image: linear-gradient(#fff, #f6f6f6);
    background: #f6f6f6
}

#process-header #logo a {
    text-indent: -999em;
    overflow: hidden
}

#process-header:after {
    display: table;
    content: '';
    clear: both
}

.master-main-nav {
    float: right;
    width: 41.25em;
    margin: 0 -1px 0 0;
    position: relative
}

.master-main-nav>ul {
    margin: 0
}

.master-main-nav .level-1-li {
    float: left;
    list-style: none;
    width: 18.25%
}

.master-main-nav .level-1-li>a {
    display: block;
    height: 5em;
    padding: 0.8333333333333333em 1.666666666666667em;
    font-family: Tele-groteskhal;
    line-height: 1.666666666666667;
    color: #e20074;
    font-size: 0.75em;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    text-shadow: 0 1px 0 #fff;
    border-right: 1px solid #d0d0d0;
    border-left: 1px solid #fff;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    -ms-transition: all .2s ease;
    transition: all .2s ease
}

.master-main-nav .level-1-li>a:hover {
    background-color: #fff !important
}

#process-header .master-main-nav .icon-link {
    width: 60px
}

.master-main-nav .icon-link>a {
    text-indent: -9999px;
    position: relative;
    background: url(/webresources/images/icons/global-nav-icons.png) no-repeat;
    background-size: 359px 241px;
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    -ms-transition: none;
    transition: none
}

iframe[name="google_conversion_frame"] {
    position: fixed;
    left: -999px;
    bottom: -999px
}

.table-wrapper table .change-link {
    margin: 0.75em 0 0;
    font-size: 0.875em;
    float: none
}

.table-wrapper table .change-link a {
    text-decoration: none
}

.table-wrapper table .basket-image {
    float: none;
    margin: 0.625em 0 0
}

.master-main-nav .icon-link:hover>a,
.master-main-nav .icon-link>a:active,
.master-main-nav .icon-link>a.active {
    background-color: #333 !important;
    border-left-color: #333;
    border-right-color: #333
}

#process-header .master-main-nav ul.level-1-ul {
    float: right
}

#process-header .master-main-nav li a {
    line-height: 40px
}

#process-header .master-main-nav .level-1-li:first-child {
    border-left: 1px solid #d0d0d0
}

#header-and-site-nav .section-nav-2014 {
    margin-bottom: 1.25em
}

#header-and-site-nav .wrapper {
    z-index: auto
}

#process-header.open {
    border-top: 1px solid #d0d0d0;
    border-bottom-color: #fff;
    background: #fff
}

#process-header.open #logo {
    opacity: 0
}

#process-header.open .master-main-nav li,
#process-header.open .master-main-nav li a {
    border-color: #fff
}

#process-header.open .master-main-nav .level-1-li:first-child {
    border-color: #fff
}

#process-header,
#process-header #logo {
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    -ms-transition: all .3s ease;
    transition: all .3s ease
}

.master-main-nav #site-nav-process-link>a {
    background-position: -240px 0
}

.master-main-nav #site-nav-process-link>a:hover {
    background-position: -240px -60px
}

.level-3-ul-sub-menu {
    position: absolute;
    display: none;
    width: 275px;
    background: #E20074;
    border-color: #E20074;
    -webkit-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.5);
    -ms-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.5);
    -o-box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.5);
    box-shadow: 0 20px 20px -5px rgba(0, 0, 0, 0.5)
}

@media only screen and (max-width: 770px) {
    .level-3-ul-sub-menu {
        display: none
    }
}

.level-3-ul-sub-menu li {
    display: block;
    width: 100%;
    text-align: left !important;
    margin: 0 !important;
    padding: 5px 0 !important
}

.level-3-ul-sub-menu li:hover {
    background: #CA066A
}

.level-3-ul-sub-menu li:hover a {
    background: transparent !important
}

.level-3-ul-sub-menu li a {
    display: block;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    height: auto !important
}

.level-3-ul-sub-menu li a:before {
    background: transparent !important;
    height: 0px !important;
    width: 0px !important;
    display: inline-block !important;
    vertical-align: top !important;
    margin: 0 0 0 20px !important;
    color: #fff;
    font-size: 14px
}

.level-2-ul.categories-icons li:hover a {
    background: #E20074;
    border-bottom: 0 !important
}

.level-2-ul.categories-icons li:hover .level-3-ul-sub-menu {
    display: block
}

#main-menu-item-ict .level-2-li {
    line-height: normal
}

@media only screen and (max-width: 770px) {
    #main-menu-item-ict .level-2-li-icon-device {
        width: 25%;
        float: left;
        font-size: 0.9375em;
        border: none
    }
    #main-menu-item-ict .level-2-li-icon-device a {
        border-right: 1px solid #6c6c6c !important;
        border-bottom: 1px solid #6c6c6c !important
    }
    #main-menu-item-ict .level-2-li-icon-device:nth-child(4n) a {
        border-right: none !important
    }
    #main-menu-item-ict .level-2-li-icon-device:nth-child(n+13) a {
        border-bottom: none !important
    }
    .level-3-ul-sub-menu {
        display: none
    }
}

header#header-2016 {
    z-index: 99;
    height: 77px
}

@media only screen and (max-width: 880px) {
    header#header-2016 {
        height: 81px
    }
}

footer#footer-2016 {
    z-index: 97
}

.site-title-2016 {
    position: relative;
    z-index: 100;
    margin-bottom: 0;
    float: left;
    font-size: 1em !important;
    height: 2.75em;
    width: 190px;
    background: url(//static.hrvatskitelekom.hr/webresources/images/t-logo-desktop.svg) no-repeat 0 50%;
    margin: 0 15px 0 30px
}

.site-title-2016 a {
    display: block;
    height: 2.75em
}

.site-title-2016 span {
    display: none
}

@media only screen and (max-width: 1250px) {
    .site-title-2016 {
        width: 80px;
        margin: 0 15px
    }
}

@media only screen and (max-width: 940px) {
    .site-title-2016 {
        width: 70px;
        margin: 0 0 0 15px
    }
}

.service-bar>ul>li>a {
    color: #fff;
    text-decoration: none;
    text-transform: uppercase
}

.service-bar>ul {
    width: 100%;
    margin-bottom: 0
}

.service-bar>ul:after {
    content: "";
    display: table;
    clear: both
}

@media only screen and (max-width: 880px) {
    .service-bar>ul {
        border-bottom: 1px dotted #e6e6e6
    }
    .service-bar>ul .short {
        display: none
    }
}

.service-bar ul li {
    list-style: none;
    cursor: pointer
}

.service-bar>ul>li {
    cursor: pointer;
    display: block;
    float: left;
    padding: 6px 1.33%;
    font-size: 16px;
    color: #333;
    height: 32px
}

.service-bar>ul>li>a {
    color: #333
}

.service-bar>ul>li:hover {
    background: #d0d0d0
}

.service-bar>ul>li.active {
    background: #e6e6e6
}

.service-bar>ul>li.active a {
    color: #000
}

.service-bar>ul>li.status-2016.active {
    background-color: #000
}

.service-bar>ul>li.status-2016.active .nav-ico.status {
    background-position: -73px -16px
}

.service-bar>ul>li.basket-2016.active {
    background-color: #000
}

.service-bar>ul>li.basket-2016.active .nav-ico.basket {
    background-position: -24px -16px
}

.service-bar>ul>li.user-2016.active {
    background-color: #000
}

.service-bar>ul>li.user-2016.active .nav-ico.user-girl {
    background-position: -118px -16px
}

.service-bar>ul>li.user-2016.active .nav-ico.user-boy {
    background-position: -96px -16px
}

@media only screen and (max-width: 880px) {
    .service-bar>ul>li {
        font-size: 10px;
        float: left;
        width: 16.6666%;
        padding: 6px 3px;
        text-align: center
    }
}

@media only screen and (max-width: 880px) {
    .service-bar>ul>li#user-profile {
        position: inherit !important
    }
}

.service-bar div.bg-cont {
    position: absolute;
    background: #000;
    right: 0;
    top: 32px;
    width: 21%;
    z-index: 999
}

@media only screen and (max-width: 880px) {
    .service-bar div.bg-cont {
        width: 100%;
        top: auto
    }
}

.service-bar>ul>li>div.bg-cont>ul {
    padding: 10px 0 0
}

.service-bar>ul>li>div.bg-cont>ul>li {
    display: block;
    font-size: 16px;
    text-transform: none !important;
    color: #a4a4a4;
    padding: 5px 20px
}

@media only screen and (max-width: 880px) {
    .service-bar>ul>li>div.bg-cont>ul>li {
        margin: 8px 0px 0px;
        margin: .5rem 0rem 0rem
    }
}

.service-bar>ul>li>div.bg-cont>ul>li.divider {
    border-top: 1px solid #a4a4a4;
    padding-top: 10px;
    margin-top: 10px
}

.service-bar>ul>li>div.bg-cont>ul>li>a {
    color: #a4a4a4
}

.service-bar>ul>li>div.bg-cont>ul>li>h2 {
    margin-bottom: 0
}

.topbar-2016 {
    width: 100%;
    z-index: 1;
    background: #fff;
    color: #ccc
}

.row .row {
    margin-left: 0 !important;
    margin-right: 0 !important
}

.navbar-2016 {
    margin: 0;
    padding: 0
}

.custom-right {
    float: right !important
}

@media only screen and (max-width: 1024px) {
    .custom-right {
        margin-left: 0
    }
}

.section-gray {
    background: #e6e6e6
}

.nav-ico {
    background: transparent url(https://static.hrvatskitelekom.hr/webresources/images/sprite/nav-icons-sprite.svg) no-repeat 0 0;
    width: 24px;
    height: 16px;
    margin: 0;
    color: transparent;
    white-space: nowrap;
    display: inline-block;
    background-size: auto
}

.nav-ico.search {
    background-position: 0 2px
}

.nav-ico.basket {
    background-position: -24px 0
}

.nav-ico.close-nav {
    background-position: -48px 0
}

.nav-ico.arrow {
    background-position: -64px 0
}

.nav-ico.status {
    background-position: -73px 0
}

.nav-ico.user-boy {
    background-position: -96px 0
}

.nav-ico.user-girl {
    background-position: -118px 0
}

.nav-ico:hover.close,
.nav-ico:active.close {
    background-position: -48px -16px
}

.nav-2016 {
    position: relative;
    z-index: 99;
    display: block;
    margin: 0;
    font-family: Tele-Grotesk;
    letter-spacing: -0.25px;
    text-transform: uppercase;
    color: #fff;
    line-height: 16px;
    line-height: 1rem;
    font-size: 12px;
    font-size: .75rem;
    line-height: 21px;
    line-height: 1.3125rem
}

.nav-2016 label {
    display: none
}

.nav-2016 .input-search {
    box-shadow: none;
    float: left;
    border: 0;
    width: 70%;
    font: bold 22px/30px Tele-grotesk, Arial, sans-serif;
    padding: 5px 120px 5px 10px;
    margin-right: 25px;
    height: 37px;
    color: #4b4b4b;
    border: 0;
    color: #fff;
    background: #333
}

.nav-2016 .input-search:focus {
    outline: none
}

.nav-2016 a {
    color: #fff;
    text-decoration: none;
    text-transform: uppercase
}

.nav-2016>div>ul {
    margin: 0 auto;
    max-width: 1140px
}

.nav-2016>div>ul:after {
    content: "";
    display: table;
    clear: both
}

.nav-2016 ul li {
    list-style: none;
    cursor: pointer
}

.nav-2016 a.drop {
    position: relative;
    padding-right: 24px
}

@media only screen and (max-width: 1145px) {
    .nav-2016 a.drop {
        padding-right: 14px
    }
}

@media only screen and (max-width: 880px) {
    .nav-2016 a.drop {
        display: block;
        padding: 14px 10px
    }
}

.nav-2016 a.drop::after {
    content: "\203A";
    font-size: 28px;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
    position: absolute;
    margin-left: 12px
}

@media only screen and (max-width: 880px) {
    .nav-2016 a.drop::after {
        margin-right: 15px;
        right: 0
    }
}

.nav-2016>div>ul>li {
    display: block;
    float: left;
    font-size: 18px;
    color: #000
}

.nav-2016>div>ul>li>a {
    color: #000;
    padding: 12px 15px;
    display: inline-block
}

@media only screen and (max-width: 1024px) {
    .nav-2016>div>ul>li>a {
        padding: 12px 10px
    }
}

.nav-2016>div>ul>li:hover {
    background: #d0d0d0
}

.nav-2016>div>ul>li.active {
    background: #000
}

.nav-2016>div>ul>li.active a {
    color: #fff
}

.nav-2016>div>ul>li.active a.drop::after {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
    margin-left: 5px
}

.nav-2016>div>ul>li.search-2016.active .nav-ico.search {
    background-position: 0 -14px
}

@media only screen and (max-width: 1160px) {
    .nav-2016>div>ul>li {
        font-size: 16px;
        padding: 0 0.5% 0 0
    }
}

@media only screen and (max-width: 940px) {
    .nav-2016>div>ul>li {
        padding: 0 0.1% 0 0
    }
}

@media only screen and (max-width: 880px) {
    .nav-2016>div>ul>li {
        float: none;
        width: 100%;
        border-top: 1px dotted #ccc
    }
}

.nav-2016 div.bg-cont {
    position: absolute;
    background: #000;
    left: 0;
    right: 0;
    top: 100%;
    width: 100%;
    z-index: 0
}

@media only screen and (max-width: 880px) {
    .nav-2016 div.bg-cont {
        position: relative;
        top: auto
    }
}

.nav-2016>div>ul>li>div.bg-cont>ul.row {
    display: none;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    -ms-opacity: 1;
    -o-opacity: 1;
    opacity: 1;
    -webkit-animation: fadeOutFromNone 0.5s ease;
    -moz-animation: fadeOutFromNone 0.5s ease;
    -ms-animation: fadeOutFromNone 0.5s ease;
    -o-animation: fadeOutFromNone 0.5s ease;
    animation: fadeOutFromNone 0.5s ease
}

.nav-2016>div>ul>li.active>div.bg-cont>ul.row:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1600px;
    overflow: hidden;
    display: block;
    top: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: -1;
    cursor: default;
    pointer-events: none;
    -webkit-opacity: .7;
    -moz-opacity: .7;
    -ms-opacity: .7;
    -o-opacity: .7;
    opacity: .7;
    -webkit-animation: fadeInFromNone 0.5s ease;
    -moz-animation: fadeInFromNone 0.5s ease;
    -ms-animation: fadeInFromNone 0.5s ease;
    -o-animation: fadeInFromNone 0.5s ease;
    animation: fadeInFromNone 0.5s ease
}

.nav-2016>div>ul>li>div.bg-cont>ul>li {
    display: block;
    float: left;
    font-size: 16px;
    margin: 32px 0px;
    margin: 2rem 0rem
}

@media only screen and (max-width: 880px) {
    .nav-2016>div>ul>li>div.bg-cont>ul>li {
        margin: 0
    }
}

.nav-2016>div>ul>li>div.bg-cont>ul>li>a {
    display: block;
    margin-right: 15px;
    padding: 3px 15px
}

.nav-2016>div>ul>li>div.bg-cont>ul>li>a:hover {
    text-decoration: underline
}

@media only screen and (max-width: 880px) {
    .nav-2016>div>ul>li>div.bg-cont>ul>li>a {
        margin-right: 0;
        padding: 10px 0 10px 15px
    }
    .nav-2016>div>ul>li>div.bg-cont>ul>li>a:hover,
    .nav-2016>div>ul>li>div.bg-cont>ul>li>a:focus {
        background: #6c6c6c !important
    }
}

.nav-2016>div>ul>li>div.bg-cont>ul>li>ul {
    position: relative;
    top: 0
}

.nav-2016>div>ul>li>div.bg-cont>ul>li>ul>li {
    display: list-item;
    width: 100%;
    font-size: 14px;
    padding-top: 8px;
    padding-top: .5rem
}

@media only screen and (max-width: 880px) {
    .nav-2016>div>ul>li>div.bg-cont>ul>li>ul>li:first-child {
        border-top: 1px dotted #6c6c6c
    }
}

@media only screen and (max-width: 880px) {
    .nav-2016>div>ul>li>div.bg-cont>ul>li>ul>li {
        padding: 10px 0;
        border-bottom: 1px dotted #6c6c6c;
        background: #333
    }
    .nav-2016>div>ul>li>div.bg-cont>ul>li>ul>li:hover,
    .nav-2016>div>ul>li>div.bg-cont>ul>li>ul>li:focus {
        background: #6c6c6c
    }
}

.nav-2016>div>ul>li>div.bg-cont>ul>li>ul>li>a {
    display: block;
    margin-right: 15px;
    padding: 3px 15px;
    color: #a4a4a4
}

.nav-2016>div>ul>li>div.bg-cont>ul>li>ul>li>a:hover {
    text-decoration: underline;
    color: #fff
}

@media only screen and (max-width: 880px) {
    .nav-2016>div>ul>li>div.bg-cont>ul>li>ul>li>a {
        margin-right: 0;
        padding: 3px 0 3px 15px
    }
    .nav-2016>div>ul>li>div.bg-cont>ul>li>ul>li>a:hover,
    .nav-2016>div>ul>li>div.bg-cont>ul>li>ul>li>a:focus {
        background: #6c6c6c !important
    }
}

@media only screen and (max-width: 880px) {
    .nav-2016 {
        width: 100%;
        z-index: 10;
        clear: both;
        font-size: 14.22222px;
        font-size: .88889rem;
        DISPLAY: NONE
    }
    .nav-2016 li {
        width: 100%;
        text-align: left;
        padding: 0
    }
    .nav-2016 li:last-child {
        border-bottom: 1px dotted #6c6c6c
    }
    .nav-2016 li a {
        padding: 16px;
        padding: 1rem
    }
    .nav-2016 li.search-2016 {
        display: none;
        position: absolute;
        top: 0;
        text-align: right;
        right: 55px
    }
    .nav-2016 .section-gray {
        background: #fff
    }
}

.navbar-toggle {
    z-index: 999;
    cursor: pointer;
    position: relative;
    padding: 15.984px;
    padding: .999rem;
    margin: 0;
    border: 0;
    background: transparent;
    float: right;
    display: none
}

@media only screen and (max-width: 880px) {
    .navbar-toggle {
        display: inline-block
    }
}

.navbar-toggle .icon-bar {
    display: block;
    width: 22px;
    margin-bottom: 5px;
    height: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    border-radius: 2px;
    background: #000
}

.navbar-toggle .icon-bar:last-child {
    margin-bottom: 0
}

a.nav2016-close-btn {
    cursor: pointer;
    color: white;
    position: absolute;
    top: 83px;
    right: 1.3%;
    font-size: 20px;
    display: none
}

@media only screen and (max-width: 1280px) {
    a.nav2016-close-btn {
        display: none !important
    }
}

h1.site-title {
    float: left
}

h1.site-title a {
    text-decoration: none;
    display: block
}

@media only screen and (max-width: 880px) {
    h1.site-title {
        padding-top: 16px;
        padding-top: 1rem
    }
}

.fixed {
    position: fixed;
    top: 0;
    z-index: 10
}

@-webkit-keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0
    }
    100% {
        display: block;
        opacity: 0.7
    }
}

@-moz-keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0
    }
    100% {
        display: block;
        opacity: 0.7
    }
}

@-o-keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0
    }
    100% {
        display: block;
        opacity: 0.7
    }
}

@keyframes fadeInFromNone {
    0% {
        display: none;
        opacity: 0
    }
    100% {
        display: block;
        opacity: 0.7
    }
}

.checkout-basket-2016 {
    background: #fff;
    width: 100%
}

.checkout-basket-2016 * {
    box-sizing: border-box
}

.checkout-basket-2016 .data {
    width: 80%
}

.checkout-basket-2016 .none {
    width: 40%
}

.checkout-basket-2016 .price {
    width: 20%
}

.checkout-basket-2016 tr td {
    padding: 10px 25px
}

.checkout-basket-2016 tr th {
    padding: 5px 25px
}

.checkout-basket-2016 tr th {
    background: #d0d0d0;
    color: Black;
    text-transform: uppercase;
    font-family: Tele-GroteskFet
}

.checkout-basket-2016 tr td {
    font-family: Tele-GroteskHal
}

.checkout-basket-2016 tr td:first-child {
    padding-left: 40px !important
}

.checkout-basket-2016 tr td:first-child.under {
    padding-left: 80px !important;
    color: #4b4b4b
}

@media only screen and (max-width: 460px) {
    .checkout-basket-2016 tr td:first-child.under {
        padding-left: 20px !important
    }
}

@media only screen and (max-width: 460px) {
    .checkout-basket-2016 tr td:first-child {
        padding-left: 20px !important
    }
}

.checkout-basket-2016 tr td:last-child {
    text-align: right;
    vertical-align: top;
    font-size: 1.5rem;
    font-size: 24px
}

.checkout-basket-2016 .cur {
    font-size: 60%;
    text-transform: uppercase
}

.checkout-basket-2016 .bb3 {
    border-bottom: 3px solid #e5e5e5
}

.checkout-basket-2016 .bt1 {
    border-top: 1px solid Black
}

.checkout-basket-2016.total {
    position: relative
}

@media only screen and (max-width: 460px) {
    .checkout-basket-2016.total tr:first-child {
        width: 50%;
        float: left;
        display: block
    }
}

@media only screen and (max-width: 460px) {
    .checkout-basket-2016.total tr:last-child {
        width: 50%;
        float: right;
        display: block;
        position: absolute;
        top: 0;
        right: 0
    }
}

.checkout-basket-2016.total td,
.checkout-basket-2016.total th {
    text-align: center !important;
    border-left: 3px solid #e5e5e5
}

@media only screen and (max-width: 460px) {
    .checkout-basket-2016.total td,
    .checkout-basket-2016.total th {
        display: block;
        border-bottom: 3px solid #e5e5e5
    }
}

@media only screen and (max-width: 460px) {
    .checkout-basket-2016.total th {
        padding: 20px 10px;
        text-align: left !important
    }
}

.checkout-basket-2016.total td {
    font-size: 1.5rem;
    font-size: 24px;
    padding: 40px 0
}

.checkout-basket-2016.total td.empty {
    background: #e5e5e5
}

@media only screen and (max-width: 460px) {
    .checkout-basket-2016.total td {
        padding: 18px 20px;
        text-align: right !important
    }
}

.checkout-basket-2016.total td:first-child,
.checkout-basket-2016.total th:first-child {
    text-align: left !important;
    border-left: 0
}

@media only screen and (max-width: 460px) {
    .checkout-basket-2016.total td:first-child,
    .checkout-basket-2016.total th:first-child {
        display: none
    }
}

.checkout-basket-2016.total.sum th {
    background: #e20074;
    color: White
}

.checkout-basket-2016.small tr td p {
    margin-bottom: 0
}

.checkout-basket-2016.small tr td {
    padding: 3px 25px 7px 25px
}

.checkout-basket-2016.small tr td:first-child {
    padding-left: 25px !important
}

.checkout-basket-2016.small tr:first-child td {
    padding-top: 15px
}

.checkout-basket-2016.small tr:last-child td {
    padding-bottom: 15px
}

div#proc[data-content="trailer"] .options-section .options-content {
    height: auto !important
}

div#proc[data-content="trailer"] a.addToBasket {
    white-space: normal;
    padding: 13px 0
}

@media only screen and (max-width: 768px) {
    div#proc[data-content="trailer"] .medium-4 {
        width: 100%;
        margin-bottom: 15px
    }
}

@media only screen and (max-width: 640px) {
    .section-dark.options-content.cartContainer {
        POSITION: FIXED;
        BOTTOM: 50PX;
        Z-INDEX: 99999;
        WIDTH: 100%;
        LEFT: 0
    }
    div#proc[data-content="trailer"] a.addToBasket {
        POSITION: FIXED;
        BOTTOM: 0;
        Z-INDEX: 99999;
        WIDTH: 100%;
        LEFT: 0
    }
}

.e2e-navigator {
    list-style-type: none;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    float: left;
    width: 100%;
    margin: 0.75em 0 1.5em;
    border: 1px solid #d7d7d7;
    background: #ececec;
    -moz-border-radius: 0.25em;
    -webkit-border-radius: 0.25em;
    border-radius: 0.25em;
    -webkit-box-shadow: inset 0px 1px 1px 0px rgba(255, 255, 255, 0.5);
    box-shadow: inset 0px 1px 1px 0px rgba(255, 255, 255, 0.5);
    font-family: Tele-grotesk;
    overflow: hidden
}

.e2e-navigator>li {
    list-style-image: none !important;
    float: left;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    padding: 0.25em 1em 0.25em 2.25em;
    position: relative;
    height: 3.125em;
    color: #737373
}

.e2e-navigator>li.current {
    color: #e20074
}

.e2e-navigator>li.done {
    color: #333
}

.e2e-navigator>li:first-child,
.e2e-navigator .e2e-navigator>li.first {
    padding-left: 0.75em
}

.e2e-navigator>li .nr {
    display: block;
    float: left;
    font: normal 2.625em/1 Tele-grotesk;
    margin: 0 0.125em 0 0
}

.e2e-navigator.six>li .nr {
    font: normal 1.5em/1 Tele-grotesk;
    margin: 0 0.125em 0 0
}

.e2e-navigator>li p {
    font-size: 1em;
    line-height: 1;
    margin: 0.25em 0 0
}

.e2e-navigator>li .back {
    font-size: 0.9375em;
    display: none
}

.e2e-navigator>li.done .back {
    display: block
}

.e2e-navigator>li .arrow {
    overflow: hidden;
    position: absolute;
    z-index: 2;
    width: 1.625em;
    height: 3.125em;
    left: 100%;
    top: 0
}

.e2e-navigator>li .arrow:after {
    background: #ccc;
    border: 1px solid #d7d7d7;
    content: "";
    height: 6.25em;
    width: 6.25em;
    margin: -1.625em 0 0 -6.0625em;
    position: absolute;
    background: #ececec;
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.e2e-navigator>li.current,
.e2e-navigator .e2e-navigator>li.current .arrow:after {
    background: #fff
}

.e2e-navigator>li.done:after {
    display: block;
    content: "";
    height: 1.5625em;
    width: 1.875em;
    background: transparent url(../images/ic_progress_check.png) no-repeat 0 -25px;
    position: absolute;
    right: 0.25em;
    top: 50%;
    margin-top: -0.78125em;
    z-index: 3
}

.e2e-navigator>li.next-set:after,
.e2e-navigator .e2e-navigator>li.previous-set:after {
    display: block;
    width: 26px;
    height: 30px;
    background: transparent url(../images/navigator-icons-device-only.png) no-repeat 0 0;
    content: "";
    position: absolute;
    right: 0.75em;
    top: 50%;
    margin-top: -15px
}

.e2e-navigator>li.previous-set:after {
    width: 40px;
    background-position: 0 -42px
}

.e2e-navigator>li.previous-set {
    padding-right: 3.5em;
    border-right: 1px solid #d7d7d7
}

.e2e-navigator>li.previous-set .arrow {
    display: none
}

.e2e-navigator.two>li {
    width: 50%
}

.e2e-navigator.three>li {
    width: 33.33333333333333%
}

.e2e-navigator.four>li {
    width: 25%
}

.e2e-navigator.five>li {
    width: 20%
}

.e2e-navigator.six>li {
    width: 16.66666666666667%
}

.overlay {
    margin-top: 10px
}

.overlay.loader {
    position: absolute;
    background-color: #FFF;
    border: 1px solid #bbb;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    padding: 16px 30px 13px 30px;
    display: none
}

.overlay h2 {
    float: none;
    margin-bottom: 15px
}

.overlay h4 {
    margin: 0 0 10px
}

.overlay ul,
.modal_dialogue_container ul {
    list-style-type: none;
    margin: 0 0 15px;
    float: left
}

.overlay ul li,
.modal_dialogue_container ul li {
    margin: 0px 0px 3px 0px;
    padding: 0px 0px 0px 10px;
    background-image: url(../images/bullet.jpg);
    background-position: 0px 6px;
    background-repeat: no-repeat;
    font-size: 14px;
    line-height: 18px
}

.overlay .close.default {
    background: transparent url(../images/ui.png) -2px -281px;
    position: absolute;
    right: -15px;
    top: -15px;
    display: block;
    cursor: pointer;
    height: 20px;
    width: 20px;
    z-index: 1
}

.overlay .close.default:hover {
    background-position: -36px -281px
}

.content-overlay {
    width: 640px;
    background-color: #FFF;
    border: 2px solid #E5E5E5;
    -moz-box-shadow: 0px 0px 15px black;
    -webkit-box-shadow: 0px 0px 15px black;
    box-shadow: 0px 0px 15px black;
    padding: 16px 20px;
    display: none;
    margin: 10px 0 10px
}

.content-overlay.auto {
    width: auto
}

.content-overlay .close {
    position: absolute;
    width: 25px;
    height: 25px;
    display: block;
    top: -15px;
    right: -15px;
    background-image: url(../images/ui.png);
    background-repeat: no-repeat;
    background-position: 0px -279px
}

.content-overlay .close:hover {
    background-position: -34px -279px
}

.content-overlay img {
    width: 100%
}

.footer {
    clear: both;
    width: 100%;
    color: #fff;
    background: #333;
    border-top: 5px solid #000;
    padding-left: 20px;
    padding-left: 1.25rem;
    padding-right: 20px;
    padding-right: 1.25rem
}

.footer .grid {
    padding: 1.5em 0
}

.footer a {
    color: #fff;
    text-decoration: underline
}

.footer a:hover,
.footer a:focus {
    color: #fff;
    text-decoration: none
}

#footer-faq {
    background: #e20074;
    text-align: center
}

#footer-faq .grid {
    background: #e20074
}

#footer-faq h1 {
    padding-top: 100px;
    background: url(i/illustrations/customer-support-70x80-white.png) no-repeat 50% 0
}

@media (min--moz-device-pixel-ratio: 1.3),
(-o-min-device-pixel-ratio: 2.6 / 2),
(-webkit-min-device-pixel-ratio: 1.3),
(min-device-pixel-ratio: 1.3),
(min-resolution: 1.3dppx) {
    #footer-faq h1 {
        background-image: url("i/illustrations/customer-support-70x80-white.png");
        background-size: 70px 80px
    }
}

#footer-faq .list-columns-2 ul {
    margin: 0 !important
}

#footer-faq .list-columns-2 li {
    list-style: none;
    padding: .5em 0
}

#footer-kako-kupovati {
    margin-bottom: 20px;
    border-bottom: 1px solid #4b4b4b
}

#footer-kako-kupovati .box-item {
    margin-bottom: 40px
}

#footer-kako-kupovati h2 {
    font-weight: normal;
    margin-bottom: 20px
}

#footer-kako-kupovati li a,
#footer-kako-kupovati p a {
    color: #fff;
    border-bottom: 1px solid #a4a4a4;
    text-decoration: none
}

#footer-kako-kupovati p {
    margin: 0
}

#footer-kako-kupovati li a:hover,
#footer-kako-kupovati p a:hover {
    border-bottom-color: #4b4b4b
}

#footer-social-bar {
    clear: both;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #4b4b4b
}

#footer-social-bar:after {
    content: '';
    display: table;
    clear: both
}

#footer-social {
    float: left
}

#footer-social ul {
    float: left;
    width: 100%
}

#footer-social li {
    float: left;
    list-style: none;
    margin: 12px 2em 0 0
}

#footer-social li.other {
    padding: 0 0 0 2em;
    border-left: 1px solid #666
}

#footer-social li.other-right {
    padding: 0 2em 0 0;
    border-right: 1px solid #666
}

#footer-social a {
    display: block;
    text-indent: -9999px;
    overflow: hidden;
    width: 36px;
    height: 36px;
    background: url(i/sn/sn-footer.png) no-repeat 0 0
}

#footer-link-fb a {
    background-position: 0 0
}

#footer-link-tw a {
    background-position: -36px 0
}

#footer-link-yt a {
    width: 48px;
    background-position: -108px 0
}

#footer-link-gg a {
    background-position: -72px 0
}

#footer-link-li a {
    background-position: -193px 0
}

#footer-link-in a {
    background-position: -156px 0
}

#footer-link-tportal a {
    background-position: -226px 0;
    width: 108px
}

#footer-link-tht a {
    background-position: -337px 0;
    width: 72px
}

#footer-p3 {
    float: right
}

#footer-p3 a {
    text-transform: uppercase;
    display: block;
    padding-right: 70px;
    line-height: 73px;
    height: 73px;
    background: url(/webresources/img/social-networks/footer-P3.png) no-repeat 100% 0;
    background-size: 44px 73px;
    text-indent: -9999px;
    overflow: hidden
}

#footer-socially-devoted {
    float: right
}

#footer-socially-devoted a {
    text-transform: uppercase;
    display: block;
    line-height: 70px;
    height: 70px;
    width: 80px;
    background: url(/webresources/img/social-networks/devoted-sticker@2x.png) no-repeat 100% 0;
    background-position: 20px 10px;
    background-size: 60px 54px;
    text-indent: -9999px;
    overflow: hidden
}

#footer-copyright {
    float: left;
    clear: both;
    width: 100%;
    font-size: 0.875em;
    text-align: center
}

#footer-copyright a {
    color: #e6e6e6;
    text-decoration: none
}

#footer-copyright a:hover {
    text-decoration: underline
}

@media only screen and (max-width: 768px) {
    .footer_box {
        background: #393939 url(../images/footer-mob.png) repeat-x left top;
        padding: 2em 0 0;
        z-index: 10
    }
    .footer_menu {
        display: none
    }
    .footer_social {
        margin: 0;
        width: auto;
        height: auto
    }
    .footer_social span {
        display: none
    }
    .footer_social p.mobile {
        display: block;
        font: normal 0.9375em/1 Tele-groteskhal;
        color: #ababab;
        margin: 0 0 0.5em
    }
    .footer_copy_legal {
        width: 100%;
        margin: 1.5em 0;
        font-size: 0.875em
    }
    .footer_social a {
        margin: 0 1rem 0 0;
        width: 2.125rem;
        height: 2.125rem;
        background: transparent url(../images/footer-social-mob.png) no-repeat 0 0
    }
    .footer_social a.footer_fb {
        background-position: 0 0
    }
    .footer_social a.footer_tw {
        background-position: -2.125rem 0
    }
    .footer_social a.footer_rss {
        display: none
    }
    .footer_social a.footer_utube {
        background-position: -4.25rem 0
    }
    .footer_social a.footer_linkedin {
        display: none
    }
    .footer_social a.footer_googleplus {
        display: none
    }
    .footer_box .development_purposes {
        display: none
    }
    .footer_box .desktop-switch {
        display: inline-block;
        float: right;
        margin: 1.875em 0 0;
        font: normal 0.8125rem/2.5 Tele-grotesk;
        color: #ababab;
        height: 2.5em;
        padding: 0 0.75em
    }
    .footer_box .desktop-switch span {
        display: inline-block;
        width: 1.0625rem;
        height: 0.6875rem;
        background: transparent url(../images/desktop-switch-span.png) no-repeat 0 0;
        margin: 0 0 -0.125rem 0.5rem
    }
}

@media only screen and (max-width: 480px) {
    #footer .grid {
        padding-left: 20px;
        padding-right: 20px
    }
    #footer-social,
    #footer-socially-devoted {
        float: none;
        clear: both;
        width: 100%;
        text-align: center
    }
    #footer-socially-devoted a {
        background-position: 50% 0
    }
    #footer-social ul {
        margin-bottom: 20px
    }
    #footer-social ul li {
        float: none;
        display: inline-block;
        margin-right: 20px
    }
}

@media only screen and (min-width: 800px) {
    #footer-faq {
        text-align: left
    }
    #footer-faq h1 {
        float: left;
        width: 34.33333333%;
        padding: 3px 0 0 95px;
        margin: 0;
        background-position: 0 0
    }
    #footer-faq .list-columns-2 {
        float: left;
        width: 65.66666666%
    }
    #footer-faq .list-columns-2 li {
        float: left;
        width: 47.715736039%
    }
    #footer-faq .list-columns-2 li:nth-child(odd) {
        margin-right: 4.568527922%
    }
    #footer-faq .list-columns-2 li {
        padding: 3px 0
    }
}

@media only screen and (min-width: 960px) {
    #footer-faq {
        background: #e20074;
        background-image: -webkit-linear-gradient(left, #b5015c, #b5015c 50%, #e20074 50%);
        background-image: -moz-linear-gradient(left, #b5015c, #b5015c 50%, #e20074 50%);
        background-image: -o-linear-gradient(left, #b5015c, #b5015c 50%, #e20074 50%);
        background-image: -ms-linear-gradient(left, #b5015c, #b5015c 50%, #e20074 50%);
        background-image: linear-gradient(to right, #b5015c, #b5015c 50%, #e20074 50%)
    }
    #footer-faq .grid {
        background: #e20074;
        background-image: -webkit-linear-gradient(left, #b5015c, #b5015c 30%, #e20074 30%);
        background-image: -moz-linear-gradient(left, #b5015c, #b5015c 30%, #e20074 30%);
        background-image: -o-linear-gradient(left, #b5015c, #b5015c 30%, #e20074 30%);
        background-image: -ms-linear-gradient(left, #b5015c, #b5015c 30%, #e20074 30%);
        background-image: linear-gradient(to right, #b5015c, #b5015c 30%, #e20074 30%)
    }
    #footer-faq h1 {
        width: 34.33333333%
    }
    #footer-faq .list-columns-2 {
        width: 65.66666666%
    }
    #footer-faq .list-columns-2 li {
        width: 47.715736039%
    }
    #footer-faq .list-columns-2 li:nth-child(odd) {
        margin-right: 4.568527922%
    }
}


/*# sourceMappingURL=htws-2015.min.css.map */