@font-face{
    font-family:KantarBrownWeb-Bold;
    src:url(../fonts/KantarBrownWeb-Bold.eot);
    src:url(../fonts/KantarBrownWeb-Bold.eot?#iefix) format("embedded-opentype"),url(../fonts/KantarBrownWeb-Bold.woff2) format("woff2"),url(../fonts/KantarBrownWeb-Bold.woff) format("woff");
    font-weight:400;
    font-style:normal
}
@font-face{
    font-family:KantarBrownWeb-Regular;
    src:url(../fonts/KantarBrownWeb-Regular.eot);
    src:url(../fonts/KantarBrownWeb-Regular.eot?#iefix) format("embedded-opentype"),url(../fonts/KantarBrownWeb-Regular.woff2) format("woff2"),url(../fonts/KantarBrownWeb-Regular.woff) format("woff");
    font-weight:400;
    font-style:normal
}
@font-face{
    font-family:KantarBrownWeb-Thin;
    src:url(../fonts/KantarBrownWeb-Thin.eot);
    src:url(../fonts/KantarBrownWeb-Thin.eot?#iefix) format("embedded-opentype"),url(../fonts/KantarBrownWeb-Thin.woff2) format("woff2"),url(../fonts/KantarBrownWeb-Thin.woff) format("woff");
    font-weight:400;
    font-style:normal
}

article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{
    display:block
}
audio[controls],canvas,video{
    display:inline-block;
    *display:inline;
    *zoom:1
}
html{
    overflow-y:scroll;
    -webkit-overflow-scrolling:touch;
    -webkit-tap-highlight-color:transparent;
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust:100%;
    height:100%;
    width:100%
}
body{
    margin:0;
    height:100%;
    width:100%
}
body,button,input:not([type=file]),select,textarea{
    font-family:sans-serif;
    font-weight:400;
    font-style:normal;
    color:#000;
    text-align:left
}
*{
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box
}
a{
    text-decoration:underline
}
a:focus{
    outline:thin dotted
}
a:active,a:hover{
    outline:0
}
abbr[title]{
    border-bottom:1px dotted
}
b,strong{
    font-weight:700
}
blockquote{
    margin:1em 40px
}
dfn{
    font-style:italic
}
hr{
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #ccc;
    margin:1em 0;
    padding:0
}
ins{
    background:#ff9;
    color:#000;
    text-decoration:none
}
mark{
    background:#ff0;
    color:#000;
    font-style:italic;
    font-weight:700
}
code,kbd,pre,samp{
    font-family:monospace,monospace;
    _font-family:'courier new',monospace;
    font-size:1em
}
pre{
    white-space:pre;
    white-space:pre-wrap;
    word-wrap:break-word
}
q{
    quotes:none
}
q:after,q:before{
    content:"";
    content:none
}
small{
    font-size:85%
}
sub,sup{
    font-size:75%;
    line-height:0;
    position:relative;
    vertical-align:baseline
}
sup{
    top:-.5em
}
sub{
    bottom:-.25em
}
ol,ul{
    margin:1em 0;
    padding:0 0 0 40px
}
dd{
    margin:0 0 0 40px
}
nav ol,nav ul{
    list-style:none;
    margin:0;
    padding:0
}
img{
    border:0;
    -ms-interpolation-mode:bicubic
}
svg:not(:root){
    overflow:hidden
}
figure,form{
    margin:0
}
fieldset{
    border:0;
    margin:0;
    padding:0
}
legend{
    border:0;
    *margin-left:-7px;
    padding:0
}
label{
    cursor:pointer
}
button,input,select,textarea{
    font-size:100%;
    margin:0;
    vertical-align:baseline;
    *vertical-align:middle
}
button,input{
    line-height:normal;
    *overflow:visible
}
button,input[type=button],input[type=reset],input[type=submit]{
    cursor:pointer;
    -webkit-appearance:button
}
input[type=checkbox],input[type=radio]{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box
}
input[type=search]{
    -moz-box-sizing:content-box;
    -webkit-box-sizing:content-box;
    box-sizing:content-box
}
button::-moz-focus-inner,input::-moz-focus-inner{
    border:0;
    padding:0
}
text area{
    overflow:auto;
    vertical-align:top
}
input:invalid,textarea:invalid{
    background-color:#f0dddd
}
::-webkit-input-placeholder{
    color:#6d6d6d
}
:-moz-placeholder{
    color:#6d6d6d
}
table{
    border-collapse:collapse;
    border-spacing:0
}
.ir{
    display:block;
    text-indent:-999em;
    overflow:hidden;
    background-repeat:no-repeat;
    text-align:left;
    direction:ltr
}
.ir br{
    display:none
}
.hidden{
    display:none;
    visibility:hidden
}
.visuallyhidden{
    border:0;
    clip:rect(0 0 0 0);
    height:1px;
    margin:-1px;
    overflow:hidden;
    padding:0;
    position:absolute;
    width:1px
}
.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{
    clip:auto;
    height:auto;
    margin:0;
    overflow:visible;
    position:static;
    width:auto
}
.invisible{
    visibility:hidden
}
.cf{
    zoom:1
}
.cf:after,.cf:before{
    content:"";
    display:table
}
.cf:after{
    clear:both
}
@media print{
    *{
        background:transparent!important;
        color:#000!important;
        text-shadow:none!important;
        -webkit-filter:none!important;
        filter:none!important;
        -ms-filter:none!important
    }
    a,a:visited{
        color:#444!important;
        text-decoration:underline
    }
    a[href]:after{
        content:" (" attr(href) ")"
    }
    abbr[title]:after{
        content:" (" attr(title) ")"
    }
    .ir a:after,a[href^="#"]:after,a[href^="javascript:"]:after{
        content:""
    }
    block quote,pre{
        border:1px solid #999;
        page-break-inside:avoid
    }
    thead{
        display:table-header-group
    }
    img,tr{
        page-break-inside:avoid
    }
    img{
        max-width:100%!important
    }
    @page{
        margin:.5cm
    }
    h2,h3,p{
        orphans:3;
        widows:3
    }
    h2,h3{
        page-break-after:avoid
    }
}
.jspContainer{
    overflow:hidden;
    position:relative
}
.jspPane{
    position:absolute
}
.jspVerticalBar{
    position:absolute;
    top:0;
    right:0;
    width:16px;
    height:100%;
    background:red
}
.jspHorizontalBar{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    height:16px;
    background:red
}
.jspCap{
    display:none
}
.jspHorizontalBar .jspCap{
    float:left
}
.jspTrack{
    background:#dde;
    position:relative
}
.jspDrag{
    background:#bbd;
    position:relative;
    top:0;
    left:0;
    cursor:pointer
}
.jspHorizontalBar .jspDrag,.jspHorizontalBar .jspTrack{
    float:left;
    height:100%
}
.jspArrow{
    background:#50506d;
    text-indent:-20000px;
    display:block;
    cursor:pointer;
    padding:0;
    margin:0
}
.jspArrow.jspDisabled{
    cursor:default;
    background:#80808d
}
.jspVerticalBar .jspArrow{
    height:16px
}
.jspHorizontalBar .jspArrow{
    width:16px;
    float:left;
    height:100%
}
.jspVerticalBar .jspArrow:focus{
    outline:0
}
.jspCorner{
    background:#eeeef4;
    float:left;
    height:100%
}
* html .jspCorner{
    margin:0 -3px 0 0
}
body,html{
    background:#1A1F1E;
    color:#FFF;
    font-family:KantarBrownWeb-Regular,'Helvetica Neue',Helvetica,Arial,sans-serif;
    font-size:14px;
    -webkit-font-smoothing:antialiased;
    line-height:1.4em
}
*{
    -webkit-backface-visibility:hidden
}
h1,h2,h3,h4,h5,h6,ol,p,ul{
    line-height:1.4em
}
h1,h2,h3,h4,h5,h6{
    font-family:KantarBrownWeb-Bold,'Helvetica Neue',Helvetica,Arial,sans-serif;
    font-weight:400
}
a{
    color:#FFF;
    opacity:1;
    -webkit-transition:opacity .2s linear,visibility .2s linear;
    transition:opacity .2s linear,visibility .2s linear
}
i.compare{
    background:url(../images/compare-white.png) center no-repeat;
    display:inline-block;
    *display:inline;
    height:10px;
    overflow:hidden;
    text-indent:-9999em;
    width:20px;
    zoom:1
}
.no-touch a:hover{
    opacity:.5
}
.info-width{
    margin:0 auto;
    padding:0 7.5em;
    width:90%
}
.viewport{
    height:100%;
    position:absolute;
    width:100%
}
header.main{
    background:#000;
    height:4.6em;
    left:0;
    position:absolute;
    top:0;
    width:100%;
    z-index:1
}
header.main h1{
    font-size:1em;
    height:1.3em;
    margin:1.65em 0;
    width:19.8em
}
header.main h1 a{
    background:url(../images/logo.png) center no-repeat;
    -webkit-background-size:100%;
    background-size:100%;
    display:block;
    height:1.3em;
    overflow:hidden;
    text-indent:-9999em;
    width:19em
}
.svg header.main h1 a{
    background:url(../images/logo.png) center/40% auto no-repeat
}
.no-touch header.main h1 a:hover{
    opacity:1
}
header.main h2{
    font-family:KantarBrownWeb-Regular,'Helvetica Neue',Helvetica,Arial,sans-serif;
    font-size:1.7em;
    font-weight:400;
    margin:.75em 0 0;
    opacity:1;
    position:absolute;
    -webkit-transition:opacity .3s ease-in-out,visibility .3s ease-in-out;
    transition:opacity .3s ease-in-out,visibility .3s ease-in-out;
    visibility:visible
}
header.main h2 a{
	font-family: KantarBrownWeb-Thin,'Helvetica Neue',Helvetica,Arial,sans-serif;
    color:#FFFFFF;
    text-decoration:none
}
.overlay-open.intro header.main h2{
    opacity:0;
    visibility:hidden
}
header.main h3{
    font-family:KantarBrownWeb-Regular,'Helvetica Neue',Helvetica,Arial,sans-serif;
    font-size:1.15em;
    font-weight:400;
    margin:3.25em 0 0;
    opacity:1;
    position:absolute;
    -webkit-transition:opacity .3s ease-in-out,visibility .3s ease-in-out;
    transition:opacity .3s ease-in-out,visibility .3s ease-in-out;
    visibility:visible
}
header.main h3 a{
    text-decoration:none
}
.overlay-open.intro header.main h3{
    opacity:0;
    visibility:hidden
}
header.main p{
    font-size:.9em;
    margin:6em 0 0;
    opacity:1;
    position:absolute;
    -webkit-transition:opacity .3s ease-in-out,visibility .3s ease-in-out;
    transition:opacity .3s ease-in-out,visibility .3s ease-in-out;
    visibility:visible
}
header.main p a{
    text-decoration:none
}
.overlay-open.intro header.main p{
    opacity:0;
    visibility:hidden
}
header.main a.right{
    float:right;
    font-size:1.15em;
    height:1.13043em;
    line-height:1.13043em;
    margin:1.43478em 0 1.43478em 1.5em;
    opacity:.5;
    text-decoration:none
}
header.main a.right.article{
    display:none
}
.no-touch header.main a.right:hover,.overlay-open.about-comtech header.main a.right.about,.overlay-open.article header.main a.right.article,.overlay-open.embed-code header.main a.right.embed{
    opacity:1
}
.overlay{
    background:rgba(0,0,0,.4);
    bottom:0;
    left:0;
    opacity:0;
    position:absolute;
    right:0;
    top:4.6em;
    -webkit-transition:opacity .3s ease-in-out,visibility .3s ease-in-out;
    transition:opacity .3s ease-in-out,visibility .3s ease-in-out;
    visibility:hidden;
    z-index:2
}
.overlay-open .overlay{
    opacity:1;
    -webkit-transform:translateY(0);
    -ms-transform:translateY(0);
    transform:translateY(0);
    visibility:visible
}
.overlay .page{
    background:#000;
    height:30em;
    left:50%;
    margin:-19.2em -22em 0 -22em;
    opacity:0;
    overflow:hidden;
    padding:3.6em 1.2em;
    position:absolute;
    text-align:center;
    top:50%;
    -webkit-transform:translateY(20%);
    -ms-transform:translateY(20%);
    transform:translateY(20%);
    -webkit-transition:opacity .3s ease-in-out,-webkit-transform .3s ease-in-out,visibility .3s ease-in-out;
    transition:opacity .3s ease-in-out,transform .3s ease-in-out,visibility .3s ease-in-out;
    visibility:hidden;
    width:44em
}
.overlay .page.active{
    opacity:1;
    -webkit-transform:translateY(0);
    -ms-transform:translateY(0);
    transform:translateY(0);
    visibility:visible
}
.overlay .page a.close{
    background:url(../images/close.png) center no-repeat;
    height:1.8em;
    overflow:hidden;
    position:absolute;
    right:2em;
    text-indent:-9999em;
    top:2em;
    width:1.8em;
    z-index:2
}
.svg .overlay .page a.close{
    background:url(../images/close.svg) center no-repeat;
    -webkit-background-size:1.7em;
    background-size:1.7em
}
.overlay .page a.close.begin{
    display:none
}
.no-touch .overlay .page a.close:hover{
    opacity:.5
}
.overlay .page .frame{
    margin:0 auto;
    width:8.2em
}
.overlay .page .frame img{
    display:block;
    height:auto;
    margin:0;
    vertical-align:top;
    width:100%
}
.overlay .page .scroll{
    height:100%;
    left:0;
    margin:0;
    position:absolute;
    top:0;
    z-index:0;
    width:100%
}
.overlay .page .scroll:after,.overlay .page .scroll:before{
    -webkit-box-shadow:0 0 4em 3em #000;
    box-shadow:0 0 4em 3em #000;
    content:"";
    height:0;
    left:0;
    position:absolute;
    width:100%;
    z-index:1
}
.overlay .page .scroll:before{
    top:0
}
.overlay .page .scroll:after{
    bottom:0
}
.overlay .page .scroll .pad{
    padding:3.6em
}
.overlay .page .scroll .jspVerticalBar{
    background:0 0;
    width:.5em;
    z-index:2
}
.overlay .page .scroll .jspVerticalBar .jspTrack{
    background:#000
}
.overlay .page .scroll .jspVerticalBar .jspTrack .jspDrag{
    background:#303331
}
.overlay .page h1,.overlay .page h2{
    font-size:1.64em;
    font-weight:400;
    margin:0;
    line-height:1.3em
}
.overlay .page h1{
	font-family: KantarBrownWeb-Thin,'Helvetica Neue',Helvetica,Arial,sans-serif;
    color:#FFFFFF;
	font-weight: 100;
	font-size: 40px;
}
.overlay .page hgroup{
    margin:2.8em 0 2.2em
}
.overlay .page p{
    font-size:1.15em;
    margin:0
}
.overlay .page#about-comtech,.overlay .page#article,.overlay .page#embed-code{
    text-align:left
}
.overlay .page#about-comtech h1,.overlay .page#article h1,.overlay .page#embed-code h1{
    margin-bottom:1em;
    margin-top:0;
}
.overlay .page#about-comtech p,.overlay .page#article p,.overlay .page#embed-code p{
    font-size:1em;
    margin:1em 0
}
.overlay .page#about-comtech p:last-child,.overlay .page#article p:last-child,.overlay .page#embed-code p:last-child{
    margin-bottom:0
}
.overlay .page#about-comtech textarea,.overlay .page#article textarea,.overlay .page#embed-code textarea{
    background:rgba(255,255,255,.1);
    border:0;
    border-radius:0;
    color:#FFF;
    display:block;
    font-family:monospace;
    -webkit-font-smoothing:antialiased;
    height:14em;
    margin-right:-1em;
    outline:0;
    padding:1em;
    resize:none;
    width:100%
}
.visualisation{
    height:100%;
    left:0;
    overflow:hidden;
    padding-top:4.6em;
    position:absolute;
    top:0;
    width:100%;
    z-index:0
}
.visualisation a.close-compare{
    background:url(../images/close.png) center no-repeat #000;
    -webkit-background-size:10px;
    background-size:10px;
    height:30px;
    margin:-15px 0;
    opacity:1;
    overflow:hidden;
    position:absolute;
    right:0;
    text-indent:-9999em;
    top:50%;
    -webkit-transition:all .5s ease-in-out;
    transition:all .5s ease-in-out;
    width:0;
    z-index:1
}
.svg .visualisation a.close-compare{
    background-image:url(../images/close.svg)
}
.visualisation .map{
    background:#1A1F1E!important;
    border:#000 solid 0;
    bottom:0;
    cursor:-webkit-grab;
    cursor:-moz-grab;
    overflow:hidden;
    position:absolute!important;
    right:0;
    top:4.6em;
    -webkit-transition:left .5s ease-in-out,right .5s ease-in-out,border .3s ease-in-out .2s;
    transition:left .5s ease-in-out,right .5s ease-in-out,border .3s ease-in-out .2s;
    z-index:0
}
.visualisation .map .map-container{
    height:100%;
    left:0;
    position:absolute;
    top:0;
    width:100%
}
.visualisation .map.moving{
    cursor:-webkit-grabbing;
    cursor:-moz-grabbing
}
.visualisation .map.left{
    left:0
}
.visualisation .map.left .marker{
    background:url(../images/icon-green.png) center no-repeat
}
.svg .visualisation .map.left .marker{
    background-image:url(../images/icon-green.svg);
    -webkit-background-size:23px;
    background-size:23px
}
.visualisation .map.right{
    left:100%;
    width:50%
}
.visualisation .map.right .marker{
    background:url(../images/icon-yellow.png) center no-repeat
}
.svg .visualisation .map.right .marker{
    background-image:url(../images/icon-yellow.svg);
    -webkit-background-size:23px;
    background-size:23px
}
.visualisation .map .map-instructions{
    display:none
}
.visualisation .map .graph{
    cursor:default;
    font-family:KantarBrownWeb-Regular,'Helvetica Neue',Helvetica,Arial,sans-serif;
    font-size:12px;
    height:0;
    opacity:1;
    position:absolute;
    -webkit-transition:opacity .3s ease-in-out;
    transition:opacity .3s ease-in-out;
    width:292px
}
.overlay-open .visualisation .map .graph{
    opacity:0
}
.visualisation .map .graph .doughnut-wrapper{
    height:124px;
    left:0;
    margin:-62px;
    position:absolute;
    top:0;
    -webkit-transition:all .3s ease-in-out .6s;
    transition:all .3s ease-in-out .6s;
    width:124px;
    z-index:0
}
.visualisation .map .graph .doughnut-wrapper canvas{
    width:100%!important;
    height:100%!important
}
.visualisation .map .graph a.close{
    display:none
}
.visualisation .map .graph hgroup{
    bottom:100%;
    left:142px;
    height:44px;
    overflow:hidden;
    padding:8px 12px;
    position:absolute;
    -webkit-transition:all .3s ease-in-out .3s;
    transition:all .3s ease-in-out .3s;
    width:150px
}
.visualisation .map .graph hgroup h1,.visualisation .map .graph hgroup h2{
    color:#000;
    font-size:1em;
    line-height:1.2em;
    margin:0;
    text-transform:uppercase
}
.visualisation .map .graph hgroup a.close{
    background:url(../images/close-small-black.png) center no-repeat;
    display:block;
    height:12px;
    margin:-6px 12px;
    overflow:hidden;
    position:absolute;
    right:0;
    text-indent:-9999em;
    top:50%;
    width:12px
}
.svg .visualisation .map .graph hgroup a.close{
    background-image:url(../images/close-small-black.svg)
}
.no-touch .visualisation .map .graph hgroup a.close:hover{
    opacity:1
}
.visualisation .map .graph .timeline,.visualisation .map .graph hgroup a.compare{
    display:none
}
.visualisation .map .graph hr{
    border:0;
    height:1px;
    left:0;
    margin:0;
    position:absolute;
    top:0;
    -webkit-transition:width .3s ease-in-out;
    transition:width .3s ease-in-out;
    width:100%;
    z-index:1
}
.visualisation .map .graph .table{
    height:198px;
    left:109px;
    overflow:hidden;
    padding:0;
    position:absolute;
    top:1px;
    -webkit-transition:height .3s ease-in-out .3s;
    transition:height .3s ease-in-out .3s;
    width:183px
}
.visualisation .map .graph .table .platform{
    height:33px
}
.visualisation .map .graph .table .platform .icon{
    float:left;
    height:33px;
    width:33px
}
.visualisation .map .graph .table .platform .icon span{
    background:url(../images/other.png) center no-repeat #595959;
    -webkit-background-size:32px;
    background-size:32px;
    display:block;
    height:32px;
    margin:1px 1px 0 0;
    width:32px
}
.svg .visualisation .map .graph .table .platform .icon span{
    background-image:url(../images/other.svg)
}
.visualisation .map .graph .table .platform.android .icon span{
    background:url(../images/android.png) center no-repeat #3aa960
}
.svg .visualisation .map .graph .table .platform.android .icon span{
    background-image:url(../images/android.svg)
}
.visualisation .map .graph .table .platform.ios .icon span{
    background:url(../images/ios.png) #ff4655
}
.svg .visualisation .map .graph .table .platform.ios .icon span{
    background-image:url(../images/ios.svg)
}
.visualisation .map .graph .table .platform.windows .icon span{
    background:url(../images/windows.png) #ff8200
}
.svg .visualisation .map .graph .table .platform.windows .icon span{
    background-image:url(../images/windows.svg)
}
.visualisation .map .graph .table .platform.blackberry .icon span{
    background:url(../images/blackberry.png) #8359a9
}
.svg .visualisation .map .graph .table .platform.blackberry .icon span{
    background-image:url(../images/blackberry.svg)
}
.svg .visualisation .map .graph .table .platform.harmonyos .icon span{
	background-color: #000;
    background-image:url(../images/harmonyos.svg)
}

.visualisation .map .graph .table .platform .name,.visualisation .map .graph .table .platform .percentage{
    float:left;
    height:33px
}
.visualisation .map .graph .table .platform .name span,.visualisation .map .graph .table .platform .percentage span{
    background:#4D4D4D;
    display:block;
    height:32px;
    line-height:30px;
    margin:1px 1px 0 0;
    padding:0 12px
}
.visualisation .map .graph .table .platform .name span{
    margin-right:0;
    padding-right:0;
    width:95px
}
.visualisation .map .graph .table .platform .percentage span{
    margin-right:0;
    padding-left:0;
    text-align:right;
    width:55px
}
.visualisation .map .graph .compare{
    background:url(../images/compare.png) 122px center no-repeat #FFF;
    color:#000;
    display:block;
    height:32px;
    line-height:30px;
    margin:1px 0 0 33px;
    opacity:1;
    overflow:hidden;
    padding:0 12px;
    text-decoration:none;
    -webkit-transition:opacity .5s ease-in-out,visibility .5s ease-in-out,height .3s ease-in-out .3s;
    transition:opacity .5s ease-in-out,visibility .5s ease-in-out,height .3s ease-in-out .3s;
    visibility:visible;
    width:150px
}
.visualisation .map .graph .compare.top{
    display:none
}
.svg .visualisation .map .graph .compare{
    background-image:url(../images/compare.svg)
}
.no-touch .visualisation .map .graph .compare:hover{
    opacity:.8
}
.visualisation .map .graph.right{
    margin-left:-292px
}
.visualisation .map .graph.right hgroup{
    left:auto;
    right:142px
}
.visualisation .map .graph.right hr{
    left:auto;
    right:0
}
.visualisation .map .graph.right .table{
    left:auto;
    right:109px
}
.visualisation .map .graph.right .table .platform .icon{
    float:right
}
.visualisation .map .graph.right .table .platform .icon span{
    margin:1px 0 0 1px
}
.visualisation .map .graph.right .compare{
    margin-left:0
}
.visualisation .map .graph.bottom hgroup{
    top:100%;
    bottom:auto
}
.visualisation .map .graph.bottom .table{
    bottom:1px;
    top:auto
}
.visualisation .map .graph.bottom .compare.top{
    display:block
}
.visualisation .map .graph.bottom .compare.bottom{
    display:none
}
.visualisation .map .graph.off .doughnut-wrapper{
    height:0;
    margin:0;
    opacity:0;
    -webkit-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out;
    width:0
}
.visualisation .map .graph.off hgroup{
    height:0;
    padding-bottom:0;
    padding-top:0;
    -webkit-transition:all .3s ease-in-out .3s;
    transition:all .3s ease-in-out .3s
}
.visualisation .map .graph.off hr{
    width:0;
    -webkit-transition:width .3s ease-in-out .6s;
    transition:width .3s ease-in-out .6s
}
.visualisation .map .graph.off .compare,.visualisation .map .graph.off .table{
    height:0;
    -webkit-transition:height .3s ease-in-out .3s;
    transition:height .3s ease-in-out .3s
}
.visualisation .map.left .graph hgroup, .visualisation .map.left .graph hr{
    background:#FFFFFF;
}
.visualisation .map.right .graph hgroup,.visualisation .map.right .graph hr{
    background:#FF0
}
.visualisation .timeline-wrapper{
    background:#000;
    bottom:3.6em;
    height:4.6em;
    left:0;
    position:absolute;
    right:0;
    z-index:1
}
.visualisation .timeline-wrapper .info-width{
    position:relative
}
.visualisation .timeline-wrapper .markers{
    height:2.3em;
    left:7.5em;
    position:absolute;
    right:7.5em;
    top:0
}
.visualisation .timeline-wrapper .marker{
    background:#333;
    display:block;
    height:.7em;
    position:absolute;
    top:1.95em;
    width:1px
}
.visualisation .timeline-wrapper .marker .year{
    background:#000;
    bottom:-.35em;
    color:#FFF;
    display:block;
    font-size:.85em;
    left:-1.5em;
    position:absolute;
    top:-.35em;
    text-align:center;
    width:3em
}
.visualisation .timeline-wrapper .marker .year:after,.visualisation .timeline-wrapper .marker .year:before{
    background:#FFF;
    content:"";
    display:block;
    height:.5em;
    left:50%;
    position:absolute;
    width:1px
}
.visualisation .timeline-wrapper .marker .year:after{
    top:100%;
    margin-top:1px
}
.visualisation .timeline-wrapper .marker .year:before{
    bottom:100%
}
.visualisation .timeline-wrapper .timeline{
    height:2.3em;
    position:relative;
    width:100%
}
.visualisation .timeline-wrapper .timeline a.ui-slider-handle{
    color:#000;
    font-size:.9em;
    font-weight:700;
    height:2.3em;
    line-height:2.3em;
    margin:0;
    opacity:0;
    padding:0 .5em;
    position:absolute;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    visibility:hidden;
    width:auto;
    white-space:nowrap;
    z-index:2
}
.visualisation .timeline-wrapper .timeline a.ui-slider-handle:focus{
    outline:0
}
.visualisation .timeline-wrapper .timeline a.ui-slider-handle.left{
    background:#FFFFFF;
    bottom:100%
}
.visualisation .timeline-wrapper .timeline a.ui-slider-handle.left.active{
    opacity:1;
    visibility:visible
}

.visualisation .timeline-wrapper .timeline a.ui-slider-handle.left:after{
    content:"";
    border:transparent solid .6em;
    border-top-color:#FFFFFF;
    display:block;
    left:50%;
    margin:0 -.6em;
    position:absolute;
    top:100%
}
.visualisation .timeline-wrapper .timeline a.ui-slider-handle.right{
    background:#FF0;
    opacity:0;
    top:100%;
    visibility:hidden
}
.visualisation .timeline-wrapper .timeline a.ui-slider-handle.right:after{
    content:"";
    border:transparent solid .6em;
    border-bottom-color:#FF0;
    bottom:100%;
    display:block;
    left:50%;
    margin:0 -.6em;
    position:absolute
}
.visualisation.compare .map{
    -webkit-transition:left .5s ease-in-out,right .5s ease-in-out,border .3s ease-in-out;
    transition:left .5s ease-in-out,right .5s ease-in-out,border .3s ease-in-out
}
.visualisation.compare .map.left{
    border-right-width:1px;
    right:50%
}
.visualisation.compare .map.right{
    border-left-width:1px;
    left:50%
}
.visualisation.compare a.close-compare{
    margin:-15px -15px;
    right:50%;
    width:30px
}
.visualisation.compare .map .graph .table{
    height:165px
}
.visualisation.compare .map .graph.off .table{
    height:0
}
.no-touch .visualisation.compare .map .graph a.compare:hover,.visualisation.compare .map .graph a.compare{
    opacity:0;
    pointer-events:none;
    visibility:0
}
.visualisation.compare .timeline-wrapper a.ui-slider-handle.right{
    opacity:1;
    visibility:visible
}
.screen-warning{
    background:#000;
    display:none;
    height:100%;
    left:0;
    overflow:auto;
    padding:2em;
    position:fixed;
    top:0;
    width:100%;
    z-index:9999
}
.screen-warning .table{
    display:table;
    height:100%;
    width:100%
}
.screen-warning .table .cell{
    display:table-cell;
    height:100%;
    text-align:center;
    vertical-align:middle;
    width:100%
}
.screen-warning .frame{
    margin:0 auto;
    max-width:8.2em;
    width:100%
}
.screen-warning .frame img{
    display:block;
    height:auto;
    margin:0;
    vertical-align:top;
    width:100%
}
.screen-warning h1,.screen-warning h2{
    font-size:1.64em;
    font-weight:400;
    margin:0;
    line-height:1.3em
}
.screen-warning h1{
    color:#92D400
}
.screen-warning hgroup{
    margin:2.8em 0 2.2em
}
.screen-warning p{
    font-size:1.15em;
    margin:0 auto;
    max-width:30em
}
.lt-ie9 .visualisation .map .graph .table .platform,.lt-ie9 .visualisation .map .graph.bottom .table .platform,.lt-ie9 .visualisation .map .graph.right .table .platform{
    background:#4D4D4D;
    height:32px;
    margin-top:1px;
    position:relative
}
.lt-ie9 .visualisation .map .graph .table .platform .bar,.lt-ie9 .visualisation .map .graph.bottom .table .platform .bar,.lt-ie9 .visualisation .map .graph.right .table .platform .bar{
    height:100%;
    left:0;
    position:absolute;
    top:0;
    width:100%;
    z-index:0
}
.lt-ie9 .visualisation .map .graph .table .platform .bar span,.lt-ie9 .visualisation .map .graph.bottom .table .platform .bar span,.lt-ie9 .visualisation .map .graph.right .table .platform .bar span{
    background-color:#1A1F1E;
    height:100%;
    left:0;
    position:absolute;
    top:0;
    -webkit-transition:width .3s ease-in-out;
    transition:width .3s ease-in-out
}
.lt-ie9 .visualisation .map .graph .table .platform .icon,.lt-ie9 .visualisation .map .graph.bottom .table .platform .icon,.lt-ie9 .visualisation .map .graph.right .table .platform .icon{
    height:32px;
    float:left;
    position:relative;
    z-index:1
}
.lt-ie9 .visualisation .map .graph .table .platform .icon span,.lt-ie9 .visualisation .map .graph.bottom .table .platform .icon span,.lt-ie9 .visualisation .map .graph.right .table .platform .icon span{
    background-color:transparent;
    margin:0 1px 0 0
}
.lt-ie9 .visualisation .map .graph .table .platform .name,.lt-ie9 .visualisation .map .graph.bottom .table .platform .name,.lt-ie9 .visualisation .map .graph.right .table .platform .name{
    height:32px;
    position:relative;
    z-index:1
}
.lt-ie9 .visualisation .map .graph .table .platform .name span,.lt-ie9 .visualisation .map .graph.bottom .table .platform .name span,.lt-ie9 .visualisation .map .graph.right .table .platform .name span{
    background:0 0;
    margin:0 0 0 -2px;
    opacity:1;
    padding-left:0;
    -webkit-transition:opacity .3s ease-in-out,width 0s;
    transition:opacity .3s ease-in-out,width 0s;
    width:auto
}
.lt-ie9 .visualisation .map .graph .table .platform .percentage,.lt-ie9 .visualisation .map .graph.bottom .table .platform .percentage,.lt-ie9 .visualisation .map .graph.right .table .platform .percentage{
    height:32px;
    float:right;
    position:relative;
    z-index:1
}
.lt-ie9 .visualisation .map .graph .table .platform .percentage span,.lt-ie9 .visualisation .map .graph.bottom .table .platform .percentage span,.lt-ie9 .visualisation .map .graph.right .table .platform .percentage span{
    background:0 0;
    margin:0;
    width:auto
}
.lt-ie9 .visualisation .map .graph .table .platform.android .bar span,.lt-ie9 .visualisation .map .graph.bottom .table .platform.android .bar span,.lt-ie9 .visualisation .map .graph.right .table .platform.android .bar span{
    background-color:#3aa960
}
.lt-ie9 .visualisation .map .graph .table .platform.android .icon span,.lt-ie9 .visualisation .map .graph.bottom .table .platform.android .icon span,.lt-ie9 .visualisation .map .graph.right .table .platform.android .icon span{
    background-color:transparent
}
.lt-ie9 .visualisation .map .graph .table .platform.blackberry .bar span,.lt-ie9 .visualisation .map .graph.bottom .table .platform.blackberry .bar span,.lt-ie9 .visualisation .map .graph.right .table .platform.blackberry .bar span{
    background-color:#8359a9
}
.lt-ie9 .visualisation .map .graph .table .platform.blackberry .icon span,.lt-ie9 .visualisation .map .graph.bottom .table .platform.blackberry .icon span,.lt-ie9 .visualisation .map .graph.right .table .platform.blackberry .icon span{
    background-color:transparent
}
.lt-ie9 .visualisation .map .graph .table .platform.ios .bar span,.lt-ie9 .visualisation .map .graph.bottom .table .platform.ios .bar span,.lt-ie9 .visualisation .map .graph.right .table .platform.ios .bar span{
    background-color:#ff4655
}
.lt-ie9 .visualisation .map .graph .table .platform.ios .icon span,.lt-ie9 .visualisation .map .graph.bottom .table .platform.ios .icon span,.lt-ie9 .visualisation .map .graph.right .table .platform.ios .icon span{
    background-color:transparent
}
.lt-ie9 .visualisation .map .graph .table .platform.windows .bar span,.lt-ie9 .visualisation .map .graph.bottom .table .platform.windows .bar span,.lt-ie9 .visualisation .map .graph.right .table .platform.windows .bar span{
    background-color:#ff8200
}
.lt-ie9 .visualisation .map .graph .table .platform.windows .icon span,.lt-ie9 .visualisation .map .graph.bottom .table .platform.windows .icon span,.lt-ie9 .visualisation .map .graph.right .table .platform.windows .icon span{
    background-color:transparent
}
.lt-ie9 .visualisation .map .graph.right .table{
    left:-33px
}
.lt-ie9 .visualisation .map .graph.right .table .compare{
    margin-left:33px
}
@media screen and (max-width:999px){
    .info-width{
        padding:0 1em
    }
    .visualisation .timeline-wrapper .markers{
        left:1em;
        right:1em
    }
}
@media screen and (max-width:759px){
    body,html{
        font-size:12px
    }
    header.main{
        height:3.333em
    }
    header.main .info-width{
        width:auto
    }
    header.main h1{
        height:1em;
        margin:1.1665em 0;
        width:15.23em
    }
    header.main h1 a{
        height:1em;
        width:15.23em
    }
    header.main h2,header.main h3{
        display:none
    }
    header.main a.right{
        -webkit-background-size:auto 1em;
        background-size:auto 1em;
        height:3em;
        margin:0;
        overflow:hidden;
        position:relative;
        text-indent:-9999em;
        width:2em
    }
    header.main a.right.about{
        background:url(../images/info.png) center no-repeat
    }
    header.main a.right.article{
        background:url(../images/article.png) center no-repeat;
        display:block;
        top:-1px
    }
    header.main a.right.embed{
        background:url(../images/embed.png) center no-repeat;
        width:3em
    }
    .svg header.main a.right.about{
        background-image:url(../images/info.svg)
    }
    .svg header.main a.right.article{
        background-image:url(../images/article.svg)
    }
    .svg header.main a.right.embed{
        background-image:url(../images/embed.svg)
    }
    .overlay{
        background:#303331;
        top:3.333em
    }
    .overlay .page{
        background:#303331;
        font-size:1.2em;
        height:100%;
        left:0;
        margin:0;
        overflow:auto;
        top:0;
        -webkit-transform:translateY(0%);
        -ms-transform:translateY(0%);
        transform:translateY(0%);
        width:100%
    }
    .overlay .page a.close{
        -webkit-background-size:100%!important;
        background-size:100%!important;
        height:1em;
        margin:0;
        right:1.4em;
        top:4.2em;
        width:1em
    }
    .overlay .page .scroll:after,.overlay .page .scroll:before{
        -webkit-box-shadow:0 0 4em 3em #303331;
        box-shadow:0 0 4em 3em #303331
    }
    .overlay .page .scroll .pad{
        padding:3em 1.4em 3.5em
    }
    .overlay .page .scroll .jspVerticalBar .jspTrack{
        background:#303331
    }
    .overlay .page .scroll .jspVerticalBar .jspTrack .jspDrag{
        background:#000
    }
    .overlay .page#intro{
        font-size:1em;
        padding:2.4em
    }
    .overlay .page#intro hgroup{
        margin:2.4em 0 1.2em
    }
    .overlay .page#intro p{
        margin:1.2em 0 1.8em
    }
    .overlay .page#intro a.close{
        display:none
    }
    .overlay .page#intro a.close.begin{
        background:0 0;
        color:#92D400;
        display:inline;
        font-size:1.2em;
        height:auto;
        position:relative;
        right:auto;
        text-decoration:none;
        top:auto;
        width:auto
    }
    .overlay .page#about-comtech h1,.overlay .page#article h1,.overlay .page#embed-code h1{
        font-size:1em;
        margin:1em 0 2em
    }
    .visualisation{
        overflow-x:hidden;
        overflow-y:auto;
        padding-top:3.333em
    }
    .visualisation .map{
        bottom:0;
        height:auto;
        min-height:0;
        top:3.333em;
        -webkit-transition:min-height .3s ease-in-out,left .5s ease-in-out,right .5s ease-in-out,border .3s ease-in-out;
        transition:min-height .3s ease-in-out,left .5s ease-in-out,right .5s ease-in-out,border .3s ease-in-out;
        width:auto
    }
    .visualisation .map.data-visible{
        min-height:400px
    }
    .visualisation .map .map-container{
        bottom:3.333em;
        height:auto;
        left:0;
        position:absolute;
        top:0;
        -webkit-transition:bottom .5s ease-in-out;
        transition:bottom .5s ease-in-out
    }
    .visualisation .map .map-instructions{
        background:#92D400;
        bottom:0;
        display:block;
        height:3.333em;
        position:absolute;
        text-align:center;
        width:100%
    }
    .visualisation .map .map-instructions a,.visualisation .map .map-instructions span{
        color:#000;
        font-size:1.1em;
        font-weight:700;
        line-height:3.18182;
        text-transform:uppercase
    }
    .visualisation .map.data-visible .map-container{
        bottom:231px
    }
    .visualisation .map [data-class=chart-sector]{
        display:none
    }
    .visualisation .map .graph,.visualisation .map .graph.bottom,.visualisation .map .graph.right{
        bottom:0!important;
        height:auto;
        left:0!important;
        margin:0;
        right:0!important;
        top:auto!important;
        -webkit-transition:opacity .3s ease-in-out,height 0s;
        transition:opacity .3s ease-in-out,height 0s;
        width:auto
    }
    .visualisation .map .graph a.close,.visualisation .map .graph.bottom a.close,.visualisation .map .graph.right a.close{
        background:0 0;
        bottom:231px;
        display:none;
        left:0;
        overflow:hidden;
        position:absolute;
        right:0;
        text-indent:-9999em;
        top:0
    }
    .visualisation .map .graph .data,.visualisation .map .graph.bottom .data,.visualisation .map .graph.right .data{
        background:#1A1F1E;
        border-top:#1A1F1E solid 1px;
        bottom:0;
        left:0;
        position:absolute;
        right:0;
        -webkit-transition:-webkit-transform .3s ease-in-out;
        transition:transform .3s ease-in-out
    }
    .visualisation .map .graph.bottom.off,.visualisation .map .graph.off,.visualisation .map .graph.right.off{
        opacity:0;
        height:0;
        -webkit-transition:opacity .3s ease-in-out,height 0s linear .3s;
        transition:opacity .3s ease-in-out,height 0s linear .3s
    }
    .visualisation .map .graph.bottom.off .data,.visualisation .map .graph.off .data,.visualisation .map .graph.right.off .data{
        -webkit-transform:translateY(100%);
        -ms-transform:translateY(100%);
        transform:translateY(100%)
    }
    .visualisation .map .graph hgroup,.visualisation .map .graph.bottom hgroup,.visualisation .map .graph.right hgroup{
        bottom:auto;
        left:auto;
        height:auto;
        overflow:visible;
        padding:8px 12px;
        position:relative;
        right:auto;
        text-align:center;
        -webkit-transition:none;
        transition:none;
        width:auto
    }
    .visualisation .map .graph hgroup:after,.visualisation .map .graph.bottom hgroup:after,.visualisation .map .graph.right hgroup:after{
        border:transparent solid .5em;
        border-top-color:#92D400;
        content:"";
        height:0;
        left:50%;
        margin:0 -.5em;
        position:absolute;
        top:100%;
        width:0;
        z-index:1
    }
    .visualisation .map .graph hgroup h1,.visualisation .map .graph hgroup h2,.visualisation .map .graph.bottom hgroup h1,.visualisation .map .graph.bottom hgroup h2,.visualisation .map .graph.right hgroup h1,.visualisation .map .graph.right hgroup h2{
        display:inline-block;
        *display:inline;
        zoom:1
    }
    .visualisation .map .graph hgroup h1,.visualisation .map .graph.bottom hgroup h1,.visualisation .map .graph.right hgroup h1{
        padding-right:5px
    }
    .visualisation .map .graph hgroup h2:before,.visualisation .map .graph.bottom hgroup h2:before,.visualisation .map .graph.right hgroup h2:before{
        content:"-";
        padding-right:5px
    }
    .visualisation .map .graph hgroup a.close,.visualisation .map .graph.bottom hgroup a.close,.visualisation .map .graph.right hgroup a.close{
        display:none
    }
    .visualisation .map .graph hgroup a.compare,.visualisation .map .graph.bottom hgroup a.compare,.visualisation .map .graph.right hgroup a.compare{
        background:url(../images/compare.png) center no-repeat;
        display:block;
        height:32px;
        margin:0;
        opacity:1;
        overflow:hidden;
        padding:0;
        position:absolute;
        right:0;
        text-indent:-9999em;
        top:0;
        -webkit-transition:opacity .5s ease-in-out,visibility .5s ease-in-out;
        transition:opacity .5s ease-in-out,visibility .5s ease-in-out;
        visibility:visible;
        width:40px
    }
    .svg .visualisation .map .graph hgroup a.compare,.svg .visualisation .map .graph.bottom hgroup a.compare,.svg .visualisation .map .graph.right hgroup a.compare{
        background-image:url(../images/compare.svg)
    }
    .no-touch .visualisation .map .graph hgroup a.compare:hover,.no-touch .visualisation .map .graph.bottom hgroup a.compare:hover,.no-touch .visualisation .map .graph.right hgroup a.compare:hover{
        opacity:.8
    }
    .visualisation .map .graph .timeline,.visualisation .map .graph.bottom .timeline,.visualisation .map .graph.right .timeline{
        display:block;
        height:32px;
        overflow:hidden;
        margin:1px 0 0;
        padding:0 50%;
        position:relative
    }
    .visualisation .map .graph .timeline .markers,.visualisation .map .graph.bottom .timeline .markers,.visualisation .map .graph.right .timeline .markers{
        cursor:-webkit-grab;
        cursor:-moz-grab;
        height:32px;
        left:0;
        margin:0 -12px;
        position:relative;
        top:0;
        width:99999em
    }
    .visualisation .map .graph .timeline .markers.ui-draggable-dragging,.visualisation .map .graph.bottom .timeline .markers.ui-draggable-dragging,.visualisation .map .graph.right .timeline .markers.ui-draggable-dragging{
        cursor:-webkit-grabbing;
        cursor:-moz-grabbing
    }
    .visualisation .map .graph .timeline .marker,.visualisation .map .graph.bottom .timeline .marker,.visualisation .map .graph.right .timeline .marker{
        background:#333;
        display:block;
        height:8px;
        float:left;
        margin:12px;
        position:relative;
        width:1px
    }
    .visualisation .map .graph .timeline .marker .year,.visualisation .map .graph.bottom .timeline .marker .year,.visualisation .map .graph.right .timeline .marker .year{
        background:#1A1F1E;
        bottom:-.35em;
        color:#92D400;
        display:block;
        font-size:.85em;
        left:-1.5em;
        position:absolute;
        top:-.35em;
        text-align:center;
        width:3em
    }
    .visualisation .map .graph .timeline .marker .year:after,.visualisation .map .graph .timeline .marker .year:before,.visualisation .map .graph.bottom .timeline .marker .year:after,.visualisation .map .graph.bottom .timeline .marker .year:before,.visualisation .map .graph.right .timeline .marker .year:after,.visualisation .map .graph.right .timeline .marker .year:before{
        background:#FFF;
        content:"";
        display:block;
        height:.5em;
        left:50%;
        position:absolute;
        width:1px
    }
    .visualisation .map .graph .timeline .marker .year:after,.visualisation .map .graph.bottom .timeline .marker .year:after,.visualisation .map .graph.right .timeline .marker .year:after{
        top:100%;
        margin-top:1px
    }
    .visualisation .map .graph .timeline .marker .year:before,.visualisation .map .graph.bottom .timeline .marker .year:before,.visualisation .map .graph.right .timeline .marker .year:before{
        bottom:100%
    }
    .visualisation .map .graph hr,.visualisation .map .graph.bottom hr,.visualisation .map .graph.right hr{
        display:none
    }
    .visualisation .map .graph .table,.visualisation .map .graph.bottom .table,.visualisation .map .graph.right .table{
        bottom:auto;
        height:auto;
        left:auto;
        position:relative;
        right:auto;
        top:auto;
        -webkit-transition:none;
        transition:none;
        width:auto
    }
    .visualisation .map .graph .table .platform,.visualisation .map .graph.bottom .table .platform,.visualisation .map .graph.right .table .platform{
        background:#4D4D4D;
        height:32px;
        margin-top:1px;
        position:relative
    }
    .visualisation .map .graph .table .platform .bar,.visualisation .map .graph.bottom .table .platform .bar,.visualisation .map .graph.right .table .platform .bar{
        height:100%;
        left:0;
        position:absolute;
        top:0;
        width:100%;
        z-index:0
    }
    .visualisation .map .graph .table .platform .bar span,.visualisation .map .graph.bottom .table .platform .bar span,.visualisation .map .graph.right .table .platform .bar span{
        background-color:#1A1F1E;
        height:100%;
        left:0;
        position:absolute;
        top:0;
        -webkit-transition:width .3s ease-in-out;
        transition:width .3s ease-in-out
    }
    .visualisation .map .graph .table .platform .icon,.visualisation .map .graph.bottom .table .platform .icon,.visualisation .map .graph.right .table .platform .icon{
        height:32px;
        float:left;
        position:relative;
        z-index:1
    }
    .visualisation .map .graph .table .platform .icon span,.visualisation .map .graph.bottom .table .platform .icon span,.visualisation .map .graph.right .table .platform .icon span{
        background-color:transparent;
        margin:0 1px 0 0
    }
    .visualisation .map .graph .table .platform .name,.visualisation .map .graph.bottom .table .platform .name,.visualisation .map .graph.right .table .platform .name{
        height:32px;
        position:relative;
        z-index:1
    }
    .visualisation .map .graph .table .platform .name span,.visualisation .map .graph.bottom .table .platform .name span,.visualisation .map .graph.right .table .platform .name span{
        background:0 0;
        margin:0 0 0 -2px;
        opacity:1;
        padding-left:0;
        -webkit-transition:opacity .3s ease-in-out,width 0s;
        transition:opacity .3s ease-in-out,width 0s;
        width:auto
    }
    .visualisation .map .graph .table .platform .percentage,.visualisation .map .graph.bottom .table .platform .percentage,.visualisation .map .graph.right .table .platform .percentage{
        height:32px;
        float:right;
        position:relative;
        z-index:1
    }
    .visualisation .map .graph .table .platform .percentage span,.visualisation .map .graph.bottom .table .platform .percentage span,.visualisation .map .graph.right .table .platform .percentage span{
        background:0 0;
        margin:0;
        width:auto
    }
    .visualisation .map .graph .table .platform.android .bar span,.visualisation .map .graph.bottom .table .platform.android .bar span,.visualisation .map .graph.right .table .platform.android .bar span{
        background-color:#3aa960
    }
    .visualisation .map .graph .table .platform.android .icon span,.visualisation .map .graph.bottom .table .platform.android .icon span,.visualisation .map .graph.right .table .platform.android .icon span{
        background-color:transparent
    }
    .visualisation .map .graph .table .platform.blackberry .bar span,.visualisation .map .graph.bottom .table .platform.blackberry .bar span,.visualisation .map .graph.right .table .platform.blackberry .bar span{
        background-color:#8359a9
    }
    .visualisation .map .graph .table .platform.blackberry .icon span,.visualisation .map .graph.bottom .table .platform.blackberry .icon span,.visualisation .map .graph.right .table .platform.blackberry .icon span{
        background-color:transparent
    }
    .visualisation .map .graph .table .platform.ios .bar span,.visualisation .map .graph.bottom .table .platform.ios .bar span,.visualisation .map .graph.right .table .platform.ios .bar span{
        background-color:#ff4655
    }
    .visualisation .map .graph .table .platform.ios .icon span,.visualisation .map .graph.bottom .table .platform.ios .icon span,.visualisation .map .graph.right .table .platform.ios .icon span{
        background-color:transparent
    }
    .visualisation .map .graph .table .platform.windows .bar span,.visualisation .map .graph.bottom .table .platform.windows .bar span,.visualisation .map .graph.right .table .platform.windows .bar span{
        background-color:#ff8200
    }
    .visualisation .map .graph .table .platform.windows .icon span,.visualisation .map .graph.bottom .table .platform.windows .icon span,.visualisation .map .graph.right .table .platform.windows .icon span{
        background-color:transparent
    }
    .visualisation .map .graph .table .compare,.visualisation .map .graph.bottom .table .compare,.visualisation .map .graph.right .table .compare{
        display:none
    }
    .visualisation .map.right .graph hgroup:after{
        border-top-color:#FF0
    }
    .visualisation .map.right .graph .timeline .marker .year{
        color:#FF0
    }
    .visualisation .map.right .graph .table .platform .name span{
        opacity:0;
        width:0
    }
    .visualisation .map.right .map-instructions{
        background-color:#FF0
    }
    .visualisation .timeline-wrapper{
        display:none
    }
    .visualisation.compare .map.left{
        border-right-width:2px
    }
    .visualisation.compare .map.right{
        border-left-width:2px
    }
    .no-touch .visualisation.compare .map .graph hgroup a.compare:hover,.visualisation.compare .map .graph hgroup a.compare{
        opacity:0;
        visibility:0
    }
    .visualisation.compare .map .graph .table .platform .name span{
        opacity:0;
        -webkit-transition:opacity .3s ease-in-out,width 0s .3s;
        transition:opacity .3s ease-in-out,width 0s .3s;
        width:0
    }
}


.newfooter.main{
    background:#000;
    height:4.75em;
    line-height:1.75em;
    padding:1.5em 0;
    z-index:20
}
.newfooter.main .kantar-logo{
    font-size:1em;
    height:1.75em;
    line-height:1.75em;
    max-width:17.375em;
    width:100%;
	margin:0;
}
.newfooter.main .kantar-logo a{
    background:url(../images/logo.png) center/50% auto no-repeat;
    display:block;
    height:100%;
    overflow:hidden;
    text-indent:-9999em;
    width:100%
}
.newfooter.svg header.main .kantar-logo a{
    background-image:url(../images/logo.svg)
}