* {
    margin: 0;
    padding: 0;
    outline: 0;
}
li {
    list-style-type: none;
}
img {
    border: 0;
}
body {
    background: #fff url(../_img/bg.jpg) repeat-x center 0;
    font-family: 'Open Sans',Arial, sans-serif;
    font-size: 14px;
    color: #222;
    margin: 170px 0 0;
}
a {
    color: #222;
}
a.btn {
    border-radius: 25px;
    background: #ce181e;
    color: #fff;
    text-align: center;
    position: relative;
    text-decoration: none;
    min-height: 34px;
    line-height: 31px;
    display: inline-block;
    padding: 0 40px 0 60px;
    font-size: 18px;
}
a.btn span {
    background: url(../_img/btn-arrow.png) no-repeat 0 0 ;
    width: 24px;
    height: 24px;
    position: absolute;
    display: block;
    top: 5px;
    left: 5px;
    transition: left 0.5s;
}
a.btn:hover span {
    top: 5px;
    left: 10px;
}

a.btn-yellow { background: url(../_img/pattern-yellow.gif); }
a.btn-blue { background: url(../_img/pattern-blue.gif); }
a.btn-pink { background: url(../_img/pattern-pink.gif); }
a.btn-green { background: url(../_img/pattern-green.gif); }
a.btn-darkblue { background: url(../_img/pattern-darkblue.gif); }
a.btn-lightgreen { background: #a9c700; }

a.video {
    position: relative;
    display: inline-block;
}
a.video span {
    background-image: url(../_img/btn-play.png);
    background-repeat: no-repeat;
    cursor: pointer;
    height: 6.1em;
    left: 41%;
    position: absolute;
    top: 36%;
    width: 6.1em;
    z-index: 2;
    opacity: .8;
}
a.video:hover span{
    opacity: 1;
}

h1, h2 {
    font-family: 'Righteous', cursive;
    font-size: 34px;
    line-height: 60px;
    border-bottom: 2px solid #c1c1c1;
    margin: 0 0 40px;
}
h2 {
    text-align: center;
}
h3 {
    font-size: 22px;
    margin: 0 0 24px;
}

p {
  margin: 0 0 24px;
}
p.dim {
    color: #959595;
    font-size: 13px;
}
.seperator {
    height: 2px;
    background:#c1c1c1;
    margin: 40px 0;
    clear: both;
}
/* ############################################# GENERAL #### */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.clear { clear: both; }

/* ############################################# STRUCTURE #### */

#wrapper {
  position: relative;
  margin: 0 auto;
  width: 912px;
}

#footer {
    border-top: 1px solid #bdbdbd;
    padding: 20px 0;
}

#footer .disclaimer {
    font-size: 12px;
}
#footer .break {
    border-top: 1px solid #e6e6e6;
    margin: 5px 0;
}
a.top {
    margin: 0 auto;
    display: block;
    background: #ce181e url(../_img/top-button.png) no-repeat center 14px;
    width: 90px;
    text-align: center;
    text-decoration: none;
    color: #fff;
    height: 20px;
    padding: 50px 0 0;
    font-size: 12px;

}
/* ############################################# NAVIGATION #### */

ul.nav {
    border-bottom: 1px solid #ce181e;
    height: 35px;
    margin: 0 0 40px;
}

ul.nav li {
    width: 18%;
    float: left;
    height: 36px;

    -webkit-transform: skew(-15deg);
    -moz-transform: skew(-15deg);
    -ms-transform: skew(-15deg);
    -o-transform: skew(-15deg);
    transform: skew(-15deg);

    -webkit-transition: background 0.5s;
    -moz-transition: background 0.5s;
    -ms-transition: background 0.5s;
    -o-transition: background 0.5s;
    transition: background 0.5s;

}

ul.nav li a {
    text-decoration: none;
    font-size: 13px;
    line-height: 14px;
    text-align: center;
    font-weight: 600;
    padding: 3px 0 0;
    display: block;
    height: 33px;
    -webkit-transform: skew(15deg) !important;
    -moz-transform: skew(15deg) !important;
    -ms-transform: skew(15deg) !important;
    -o-transform: skew(15deg) !important;
    transform: skew(15deg) !important;

}

ul.nav li:hover  {
    background: #bcbcbc;
}

ul.nav li a:hover {
    color: #fff;
}

body.home ul.nav li.nav-home,
body.whatsnew ul.nav li.nav-whatsnew,
body.system ul.nav li.nav-system,
body.customise ul.nav li.nav-customise,
body.support ul.nav li.nav-support {
    background: #ce181e; }

body.home ul.nav li.nav-home a,
body.whatsnew ul.nav li.nav-whatsnew a,
body.system ul.nav li.nav-system a,
body.customise ul.nav li.nav-customise a,
body.support ul.nav li.nav-support a {
    color: #fff; }

ul.nav li.nav-home a { line-height: 28px; } /* #ONLY FOR 1-Liners# */

.uk-store{
    background: url('../_img/uk-store.png') no-repeat 0 0;
    border-radius: 10px;
    box-shadow: 2px 2px 3px gray;
    display: block;
    height: 55px;
    position: absolute;
    right:10px;
    top: -11px;
    width: 87px;
    z-index: 5;

}

/* ############################################# HOME #### */
body.home p {
    font-size: 18px;
}
body.home .lc {
    width: 356px;
    margin: 0 50px;
    float: left;
}
body.home .rc {
    width: 356px;
    margin: 0 50px;
    float: left;
}

body.home .header {
    border-bottom: 1px solid #bdbdbd;
    background: url(../_img/home-header.png) no-repeat center 0;
    height: 541px;
    position: relative;
    margin: 0 0 24px;
}

.header a.customise {
    background: url(../_img/customise-teaser.png) no-repeat center 0;
    height: 149px;
    width: 149px;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    text-decoration: none;
    position: relative;
    text-indent: -9999px;
    transition: all 0.2s ease;
}

.header a.customise:hover {
    -ms-transform: rotate(7deg) scale(0.9);
    -webkit-transform: rotate(7deg) scale(0.9);
    transform: rotate(7deg) scale(0.9);
}

.header .biggest-screens {
    background: url(../_img/screen-sticker.png) no-repeat center 0;
    height: 88px;
    width: 92px;
    display: block;
    top: 80px;
    right: 230px;
    position: absolute;
    z-index: 5;
}
.header .compact-and-light {
    background: url(../_img/compact-sticker.png) no-repeat center 0;
    height: 84px;
    width: 94px;
    display: block;
    left: 310px;
    top: 140px;
    position: absolute;
    z-index: 5;
}

.control-section h2{
    color: #f4aa01;
    border-color: #f4aa01;
}
.power-section h2{
    color: #01a1dd;
    border-color: #01a1dd;
}
.amiibo-section h2{
    color: #c4027b;
    border-color: #c4027b;
}
.viewing-section h2{
    color: #007758;
    border-color: #007758;
}
.feature-section h2{
    color: #00435b;
    border-color: #00435b;
}

.customisation-section h2{
    color: #a9c700;
    border-color: #a9c700;
}

body.home .intro-section {
    text-align: center;
    margin: 24px 0;
}

body.home .control-section {
    overflow: hidden;
}
body.home .control-section p{
    margin: 80px 0 24px ;
}
body.home .power-section .lc p,
body.home .customisation-section .rc p,
body.home .amiibo-section .rc p {
    margin: 50px 0 24px;
}
body.home .control-section .ds-control-teaser {
    background: url(../_img/ds-control-teaser.png) no-repeat 0 0;
    width: 205px;
    height: 255px;
    margin: 20px 246px 24px 60px;
    display: block;
    float: left;
    position: relative;
}

body.home .control-section .ds-control-teaser span {
    background: url(../_img/ds-control-teaser-label.png) no-repeat bottom left;
    width: 110px;
    display: block;
    position: absolute;
    height: 189px;
    padding: 50px 0 0 135px;
    left: 152px;
    top: -70px;
    z-index: 5;
}
body.home .customisation-section,
body.home .power-section,
body.home .amiibo-section {
    overflow: hidden;
    margin: 0 0 40px 0;
}
body.home .power-section .rc {
    margin: 0 50px 0 0;
    width: 406px;
}
body.home .amiibo-section .amiibo-teaser {
    background: url(../_img/ds-amiibo-teaser.png) no-repeat 0 0;
    width: 402px;
    height: 330px;
    display: block;
    position: relative;
    overflow: hidden;
}

body.home .amiibo-section .amiibo-teaser span {
    background: url(../_img/ds-amiibo-teaser-hand.png) no-repeat 0 0;
    width: 289px;
    display: block;
    position: absolute;
    height: 249px;
    left: 0;
    bottom: 0;
    z-index: 5;
}

body.home .viewing-section {
    background: url(../_img/section-gradient.jpg) no-repeat bottom center;
    overflow: hidden;
    text-align: center;
}

body.home .viewing-section .lc p,
body.home .viewing-section .rc p {
    margin: 20px 0 25px;
}
body.home .viewing-section .compare3ds,
body.home .viewing-section .comparen3ds {
    width: 368px;
    height: 222px;
    margin: 20px 0 0;
}
body.home .viewing-section .compare3ds {
    background: url(../_img/home-3dcomparison-1.png) no-repeat 0 0;
}
body.home .viewing-section .comparen3ds {
    background: url(../_img/home-3dcomparison-n1.png) no-repeat 0 0;
}

.customisation-section .custom-teaser {
    position: relative;
    width: 324px;
    height: 233px;
}

 .customisation-section .custom-teaser .plate1 {
    background: url(../_img/home-plate1.png) no-repeat 0 0;
    width: 177px;
    height: 186px;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 5;
}
.customisation-section .custom-teaser .plate2 {
    background: url(../_img/home-plate2.png) no-repeat 0 0;
    width: 177px;
    height: 186px;
    display: block;
    position: absolute;
    left: 74px;
    top: 23px;
    z-index: 6;
}
.customisation-section .custom-teaser .plate3 {
    background: url(../_img/home-plate3.png) no-repeat 0 0;
    width: 177px;
    height: 186px;
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 7;
}


/* ############################################# WHATS NEW #### */
body.whatsnew {
    font-size: 14px;
}
body.whatsnew .header {
    background: #000;
    height: 330px;
    position: relative;
    margin: 0 0 24px;
    background: url(../_img/whatsnew-header.png) no-repeat center 0;
}


body.whatsnew .intro-section {
    text-align: center;
    margin: 24px 0;
    font-size: 18px;
}

body.whatsnew .control-section {
    overflow: hidden;
}

body.whatsnew .control-section h2 {
    margin: 0;
}

body.whatsnew .ds-info {
    border-bottom: 2px solid #c1c1c1;
    overflow: hidden;
}

body.whatsnew .ds-info > p {
    margin: 100px 0 0 0;
}

body.whatsnew .rc {
    float: left;
    width: 573px;
    margin: 60px 0 0;
}

body.whatsnew .info-container {
    position: relative;
    overflow: hidden;
    margin: 0 0 20px;
}

body.whatsnew .ds-teaser1 {
    background: url(../_img/whatsnew-ds-1.png) no-repeat 0 0;
    width: 115px;
    height: 286px;
    padding: 87px 0 0 224px;
    float: left;
    font-size: 18px;
}
body.whatsnew .ds-teaser2 {
    background: url(../_img/whatsnew-ds-2.png) no-repeat 0 0;
    width: 570px;
    height: 92px;
    position: absolute;
    bottom: 10px;
    right: 20px;
    font-size: 18px;
}

body.whatsnew .ds-teaser2 span {
    position: absolute;
    top: -25px;
    text-align: center;
    width: 180px;
}
body.whatsnew .ds-teaser2 span.zr-label {
    left: -5px;
}
body.whatsnew .ds-teaser2 span.zl-label {
    right: -5px;
}
body.whatsnew .ds-teaser3 {
    float: left;
    margin: 0 15px 0 0;
}
body.whatsnew .ds-teaser4 {
    background: url(../_img/whatsnew-ds-4.png) no-repeat 0 0;
    width: 197px;
    height: 204px;
    float: left;
    margin: 40px 104px 20px 45px;
}
body.whatsnew .teaser4-info {
    margin: 85px 120px 0 0;
}
body.whatsnew .power-section {
    overflow: hidden;
    margin: 0 0 20px;
}
body.whatsnew .power-section a.video {
    float: left
}

body.whatsnew .power-section .rc {
    overflow: hidden;
    margin: 0 0 0 20px;
    width: 546px;
}
body.whatsnew .amiibo-section {
    overflow: hidden;
}
body.whatsnew .amiibo-section h2{
    margin: 0;
}
body.whatsnew .amiibo-section .lc {
    width: 470px;
    margin: 55px 0 0 0;
    float: left;
}
body.whatsnew .amiibo-section a.btn {
    margin: 60px 0 0 ;
}

body.whatsnew .amiibo-section .amiibo-teaser {
    background: url(../_img/ds-amiibo-teaser-large.png) no-repeat 0 0;
    width: 371px;
    height: 365px;
    display: block;
    position: relative;
    float: right;
    margin: 0 30px 70px 0;
}

body.whatsnew .amiibo-section .amiibo-teaser span {
    background: url(../_img/ds-amiibo-teaser-hand-large.png) no-repeat 0 0;
    width: 418px;
    display: block;
    position: absolute;
    height: 343px;
    z-index: 5;
    bottom: -70px;
    left: -151px;
}

body.whatsnew .viewing-section {
    margin: 0 0 40px;
}
body.whatsnew .viewing-section .ds-comparison {
    margin: 0 0 40px;
    border-bottom: 2px solid #c1c1c1;
    height: 191px;
    position:relative;
}
body.whatsnew .viewing-section .ds-comparison img{
    position:absolute;
    z-index:1;
    top: 0;
    left: 140px;
}
body.whatsnew .viewing-section .ds-comparison img.active{z-index:3}

body.whatsnew  .dim-simulated{
    position: relative;
}

body.whatsnew  .dim-simulated p{
    position: absolute;
    top: 170px;
    left: 0;
    text-align: center;
    color: #959595;
    font-size: 13px;
}

body.whatsnew .viewing-section .lc {
    float: left;
    width: 440px;
    margin: 0 10px 0 0;
}
body.whatsnew .viewing-section .rc {
    float: left;
    width: 462px;
    margin: 0;
}
body.whatsnew .viewing-section .lc.ds-label p {
    text-align: center;
    padding: 0 0 0 150px;
    margin: 0;
}
body.whatsnew .viewing-section .rc.ds-label p {
    text-align: center;
    padding: 0 127px 0 30px;
    margin: 0;
}



body.whatsnew .feature-section {
    margin: 0 0 40px;
}
body.whatsnew .ds-games {
    height: 200px;
    position: relative;
}
body.whatsnew .ds-games .row1 {
    height: 126px;
    width: 444px;
    background: url(../_img/whatsnew-ds-games-2.png) no-repeat 0 0;
    position: absolute;
    top: 0;
    right: 0;
}

body.whatsnew .ds-games .row2 {
    height: 133px;
    width: 327px;
    background: url(../_img/whatsnew-ds-games-3.png) no-repeat 0 0;
    position: absolute;
    left: 80px;
    top: 70px;
}

body.whatsnew .feature-section .lc {
    float: left;
    width: 440px;
    margin: 0 10px 0 0;
}
body.whatsnew .feature-section .rc {
    float: left;
    width: 462px;
    margin: 0;
}
body.whatsnew .feature-section .camera-section {
    margin: 0 0 60px 0;
}
body.whatsnew .feature-section .camera-section .rc {
    width: 398px;
    margin: 60px 0 0 30px;
}


body.whatsnew .feature-section .camera {
    height: 181px;
    width: 484px;
    background: url(../_img/whatsnew-camera.png) no-repeat 0 0;
    position: relative;
    float: left;
}

body.whatsnew .feature-section .camera .label-original,
body.whatsnew .feature-section .camera .label-new {
    position: absolute;
    text-align: center;
    bottom: -30px;
    left: 0;
    width: 206px;
}
body.whatsnew .feature-section .camera .label-new {
    left: 250px;
}
body.whatsnew .micro-sd-section {
    overflow: hidden;
}
body.whatsnew .brightness-section {
    overflow: hidden;
}
body.whatsnew .brightness-section img{
    float: left;
    margin: 10px 50px 0 0;
}
body.whatsnew .video-section {
    overflow: hidden;
}
body.whatsnew .video-section img {
    float: right;
    margin: 10px 160px 0 60px;
}
body.whatsnew .video-section h3 {
    margin-top: 70px;
    text-align: right;
}
body.whatsnew .video-section p {
    text-align: right;
}

body.whatsnew .customisation-section h2 {
    margin: 0;
}
body.whatsnew .theme-section {
    overflow: hidden;
}
body.whatsnew .theme-section .ds-themes {
    background: url(../_img/whatsnew-customize.png) no-repeat 0 0;
    width: 391px;
    height: 368px;
    float: left;
    margin: 0 0 0 30px;
}
body.whatsnew .theme-section .rc {
    width: 453px;
    margin-left: 30px;
}
body.whatsnew .cover-section {
    overflow: hidden;
    margin: 0 0 40px;
}
body.whatsnew .customisation-section .custom-teaser {
    float: left;
}
body.whatsnew .customisation-section .cover-section .lc {
    float: left;
    width: 530px;
    margin: 0 0 0 30px;
}


/* ##############################--- SYSTEM --- */

body.system .header {
    background: url(../_img/system-header.jpg) no-repeat center 0;
    height: 330px;
    position: relative;
    margin: 0 0 24px;
}
body.system .header .n3ds{
    background: url(../_img/system-header-ds1.png) no-repeat center 0;
    height: 290px;
    width: 339px;
    position: absolute;
    left: 110px;
    top: 50px;
}
body.system .header .n3dsxl{
    background: url(../_img/system-header-ds2.png) no-repeat center 0;
    height: 322px;
    width: 383px;
    position: absolute;
    left: 470px;
    top: 15px;
}
body.system .header a.customise{
    left: -20px;
    top: 30px;
}
body.system .header .biggest-screens {
    right: 70px;
    top: 20px;
}

body.system .comparison {
    overflow: hidden;
    margin: 0 0 30px;
}

body.system .comparison .n3ds {
    float: left;
    width: 430px;
    border-right: 1px solid #bdbdbd;
    padding: 0 24px 0 0;
}
body.system .comparison .n3dsxl {
    float: left;
    width: 430px;
    padding: 0  0 0 26px;
}
body.system .inbox h3 {
    font-family: 'Righteous', cursive;
    font-size: 22px;
    line-height: 40px;
    border-bottom: 2px solid #c1c1c1;
    margin: 0 0 40px;
}
body.system .inbox img {
    margin: 0 auto;
    display: block;
}
body.system .inbox ul {
    border-top: 1px solid #c1c1c1;
    padding: 30px 0 0 10px;
    margin: 30px 0;
    font-size: 15px;
}
body.system .n3ds .inbox ul{
    margin: 61px 0 30px;
}

body.system .inbox ul li:before {
    content: "• ";
    color: #ce181e;
}
body.system .intro {
    height: 220px;
}
body.system .n3dsxl .intro {
    height: 203px;
}
body.system .colors {
    overflow: hidden;
    margin: 0 0 40px;
}
body.system .colors div {
    float: left;
    width: 45%;
}
body.system .colors div span {
    -webkit-border-radius: 15px;
    border-radius: 15px;
    width: 145px;
    display: block;
    margin: 10px auto 0;
    text-align: center;
}
body.system .colors div.white span {
     background: #d2d0c5;
     color: #222;
}
body.system .colors div.black span {
     background: #000;
     color: #fff;
}
body.system .colors div.blue span {
     background: #293b61;
     color: #fff;
}
body.system .colors div img {
    display: block;
    margin: 0 auto;
}
 body.system .ac-info {
    background: url(../_img/system-plug.png) no-repeat 0 0;
    padding: 0 0 0 55px;
}
 body.system .ac-info h4 {
    font-weight: normal;
    font-style:italic;
}

body.system .info-select {
    background: url(../_img/system-select-bg.png) no-repeat 0 0;
    width: 912px;
    height: 151px;
    border-top: 2px solid #bcbcbc;
    border-bottom: 4px solid #ce181e;
}
body.system .info-select li {
    width: 50%;
    float: left;
    text-align: center;
    position: relative;
}
body.system .info-select li a{
    font-family: 'Righteous', cursive;
    font-size: 28px;
    line-height: 151px;
    text-decoration: none;
    color: #acacac;
}
body.system .info-select li.active a,
body.system .info-select li a:hover {
    color: #222;
}

body.system .info-select li.active .pointer{
    width: 58px;
    height: 20px;
    background: url(../_img/system-pointer.png) no-repeat 0 0;
    display: block;
    position: absolute;
    bottom: -24px;
    left: 49%;
}

body.system .info-select .n3ds a span {
    background: url(../_img/system-dssymbol.png) no-repeat 0 0;
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 0 10px 0 0;
    position: relative;
    top: 2px;
}
body.system .info-select .n3dsxl a span {
    background: url(../_img/system-dssymbol.png) no-repeat -44px 0;
    display: inline-block;
    width: 32px;
    height: 32px;
    margin: 0 10px 0 0;
    position: relative;
    top: 5px;
}
body.system .info-select .n3ds.active a span,
body.system .info-select .n3ds a:hover span {
    background: url(../_img/system-dssymbol.png) no-repeat 0 -50px;
}
body.system .info-select .n3dsxl.active a  span,
body.system .info-select .n3dsxl a:hover span {
    background: url(../_img/system-dssymbol.png) no-repeat -44px -50px;
}

.select-toggle  {
    width: 600px;
    margin: 40px auto;
    overflow: hidden;
}

.select-toggle div {
    float: left;
    width: 255px;
    font-size: 22px;
    cursor: pointer;
}
.select-toggle div.front,
.select-toggle div.white {
    text-align: right;
    padding: 0 10px 0 0;
    color: #959595;
}
.select-toggle div.back,
.select-toggle div.black {
    text-align: left;
    padding: 0 0 0 10px;
    color: #ce181e;
}


div.active div.front,
div.active div.white  {
    color: #ce181e;
}
div.active div.back,
div.active div.black  {
    color: #959595;
}

.select-toggle a {
    float: left;
    height: 30px;
    width: 70px;
    background: #ddd;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    display: block;
    position: relative;
}

.select-toggle a span {
    display: block;
    position: absolute;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: #ce181e;
    width: 50%;
    top: 1px;
    left: 34px;
    height: 28px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

div.active a span  {
    left: 1px;
}

body.system .ds-box {
    display: none;
}

body.system .gallery {
    height: 250px;
    margin-bottom: 30px;
    text-align: center;
}
body.system .gallery .dsxl-gallery{
    display: none;
}

body.system .frame {
    position: relative;
    display: inline-block;
    margin: 4px;
    width: 157px;
    height: 125px;
    border: 1px solid #d3d3d3;
    -webkit-border-radius: 4px;
    border-radius: 4px;
}
body.system .frame img {
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100px;
    cursor: pointer;
}

body.system table {
    display: block;
    width: 100%;
    border-spacing: 0;
    background-color: #ffffff;
}
body.system tr.gray-row {
    background-color: #f7f7f7;
}
body.system td {
    padding: 14px;
    width: 358px;
    border-top: 1px solid #e5e5e5;
    color: #000000;
    font-size: 13px;
    font-weight: normal;
    vertical-align: top;
}
    body.system td:first-child {
        width: 196px;
        color: #ce181e;
        font-size: 16px;
        font-weight: bold;
        vertical-align: top;
    }
    body.system td.headerpic {
        padding-bottom: 20px;
        vertical-align: bottom;
        border: none;
        text-align: center;
    }
    body.system td.tbl-line {
        border-left: 1px solid #e5e5e5;
    }
    body.system td ul li:before {
        content: "• ";
        color: #ce181e;
    }


/* ##############################--- CUSTOMISE --- */

body.customise {
    font-size: 18px;
}
body.customise .header {
    background: #000;
    height: 364px;
    position: relative;
    margin: 0 0 24px;
    background: url(../_img/customise-header.png) no-repeat 0 0;
}

body.customise .intro {
    position: relative;
    height: 500px;
}
body.customise .intro h2 {
    text-align: left;
}
body.customise .intro p {
    padding: 0 300px 0 0;
}

body.customise h4 {
    font-size: 22px;
    margin: 10px 0;
}

body.customise .slider h3:hover
{
    color:#ce181e;
    text-decoration: none;
}

body.customise .intro .dsteaser {
    width: 285px;
    height: 419px;
    position: absolute;
    top: 20px;
    right: 20px;
    display: block;
    background: url(../_img/customise-intro.png) no-repeat 0 0;
}

body.customise .customise-ds {
    background: url(../_img/slider-bg.jpg) no-repeat bottom center;

}

body.customise .slider {
    background: #fff;
    position:relative;
    border: 2px solid #dbdbdb;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    min-height: 206px;
    margin: 0 0 40px;
}
body.customise .slider span {
    width: 98px;
    height: 36px;
    position: absolute;
    bottom: -36px;
    left: 403px;
    display: block;
    background: url(../_img/slider-bg.png) no-repeat 0 0;
}
body.customise .slider h3 {
    font-family: 'Righteous', cursive;
    font-size: 22px;
    line-height: 58px;
    text-align: center;
    cursor: pointer;
}

body.customise .slider a.browse {
    background:url(../_img/slider-arrows.png) no-repeat;
    display:block;
    width:45px;
    height:45px;
    top: 82px;
    cursor:pointer;
    font-size:1px;
    position: absolute;
}

body.customise .slider a.right { background-position: 0 -50px; right: 15px; }
body.customise .slider a.right.disabled { background-position:-50px -50px; cursor: default;}

body.customise .slider a.left { left: 15px;}
body.customise .slider a.left.disabled { background-position: -50px 0; cursor: default;}

body.customise .scrollable {
    overflow:hidden;
    width: 765px;
    height:120px;
    left: 76px;
    position: absolute;
    top: 60px;
}
body.customise .scrollable .items {
    width:20000em;
    position:absolute;
}

body.customise .items div {
    float:left;
}
body.customise .items div a {
    display: inline-block;
    width: 105px;
    text-align: center;
}

body.customise .slider-open a.left,
body.customise .slider-open a.right{
    display: none;
}
body.customise .slider-open .scrollable{
    overflow: visible;
    height: auto;
    position: relative;
    top: auto;
    left: auto;
    margin: 20px 0 20px 76px;
}
body.customise .slider-open .scrollable .items{
    position: relative;
    width: auto;
    top: auto !important;
    left: auto !important;
}
body.customise .slider-open .scrollable .items div{
    display: inline;
    float: none;
}

body.customise .display-ds {
    background: url(../_img/display-ds-white.png) no-repeat 0 0;
    width: 546px;
    height: 569px;
    margin: 40px auto 0;
    position: relative;
}
body.customise .black-console {
    background: url(../_img/display-ds-black.png) no-repeat 0 0;
}
body.customise .display-ds .top {
    width: 540px;
    height: 240px;
    position: absolute;
    top: 31px;
    left: 2px;
}
body.customise .display-ds .bottom {
    width: 540px;
    height: 271px;
    position: absolute;
    top: 279px;
    left: 2px;
}
body.customise .top-cover1 { background: url(../_img/cover-top-1.png) no-repeat 0 0; }
body.customise .top-cover2 { background: url(../_img/cover-top-2.png) no-repeat 0 0; }
body.customise .top-cover3 { background: url(../_img/cover-top-3.png) no-repeat 0 0; }
body.customise .top-cover4 { background: url(../_img/cover-top-4.png) no-repeat 0 0; }
body.customise .top-cover5 { background: url(../_img/cover-top-5.png) no-repeat 0 0; }
body.customise .top-cover6 { background: url(../_img/cover-top-6.png) no-repeat 0 0; }
body.customise .top-cover7 { background: url(../_img/cover-top-7.png) no-repeat 0 0; }
body.customise .top-cover8 { background: url(../_img/cover-top-8.png) no-repeat 0 0; }
body.customise .top-cover9 { background: url(../_img/cover-top-9.png) no-repeat 0 0; }
body.customise .top-cover10 { background: url(../_img/cover-top-10.png) no-repeat 0 0; }
body.customise .top-cover11 { background: url(../_img/cover-top-11.png) no-repeat 0 0; }
body.customise .top-cover12 { background: url(../_img/cover-top-12.png) no-repeat 0 0; }
body.customise .top-cover13 { background: url(../_img/cover-top-13.png) no-repeat 0 0; }
body.customise .top-cover14 { background: url(../_img/cover-top-14.png) no-repeat 0 0; }
body.customise .top-cover15 { background: url(../_img/cover-top-15.png) no-repeat 0 0; }
body.customise .top-cover16 { background: url(../_img/cover-top-16.png) no-repeat 0 0; }
body.customise .top-cover17 { background: url(../_img/cover-top-17.png) no-repeat 0 0; }
body.customise .top-cover18 { background: url(../_img/cover-top-18.png) no-repeat 0 0; }
body.customise .top-cover19 { background: url(../_img/cover-top-19.png) no-repeat 0 0; }
body.customise .top-cover20 { background: url(../_img/cover-top-20.png) no-repeat 0 0; }
body.customise .top-cover21 { background: url(../_img/cover-top-21.png) no-repeat 0 0; }
body.customise .top-cover22 { background: url(../_img/cover-top-22.png) no-repeat 0 0; }
body.customise .top-cover23 { background: url(../_img/cover-top-23.png) no-repeat 0 0; }
body.customise .top-cover24 { background: url(../_img/cover-top-24.png) no-repeat 0 0; }
body.customise .top-cover25 { background: url(../_img/cover-top-25.png) no-repeat 0 0; }
body.customise .top-cover26 { background: url(../_img/cover-top-26.png) no-repeat 0 0; }
body.customise .top-cover27 { background: url(../_img/cover-top-27.png) no-repeat 0 0; }
body.customise .top-cover28 { background: url(../_img/cover-top-28.png) no-repeat 0 0; }
body.customise .top-cover29 { background: url(../_img/cover-top-29.png) no-repeat 0 0; }
body.customise .top-cover30 { background: url(../_img/cover-top-30.png) no-repeat 0 0; }
body.customise .top-cover31 { background: url(../_img/cover-top-31.png) no-repeat 0 0; }
body.customise .top-cover32 { background: url(../_img/cover-top-32.png) no-repeat 0 0; }
body.customise .top-cover33 { background: url(../_img/cover-top-33.png) no-repeat 0 0; }
body.customise .top-cover34 { background: url(../_img/cover-top-34.png) no-repeat 0 0; }

body.customise .bottom-cover1 { background: url(../_img/cover-bottom-1.png) no-repeat 0 0; }
body.customise .bottom-cover2 { background: url(../_img/cover-bottom-2.png) no-repeat 0 0; }
body.customise .bottom-cover3 { background: url(../_img/cover-bottom-3.png) no-repeat 0 0; }
body.customise .bottom-cover4 { background: url(../_img/cover-bottom-4.png) no-repeat 0 0; }
body.customise .bottom-cover5 { background: url(../_img/cover-bottom-5.png) no-repeat 0 0; }
body.customise .bottom-cover6 { background: url(../_img/cover-bottom-6.png) no-repeat 0 0; }
body.customise .bottom-cover7 { background: url(../_img/cover-bottom-7.png) no-repeat 0 0; }
body.customise .bottom-cover8 { background: url(../_img/cover-bottom-8.png) no-repeat 0 0; }
body.customise .bottom-cover9 { background: url(../_img/cover-bottom-9.png) no-repeat 0 0; }
body.customise .bottom-cover10 { background: url(../_img/cover-bottom-10.png) no-repeat 0 0; }
body.customise .bottom-cover11 { background: url(../_img/cover-bottom-11.png) no-repeat 0 0; }
body.customise .bottom-cover12 { background: url(../_img/cover-bottom-12.png) no-repeat 0 0; }
body.customise .bottom-cover13 { background: url(../_img/cover-bottom-13.png) no-repeat 0 0; }
body.customise .bottom-cover14 { background: url(../_img/cover-bottom-14.png) no-repeat 0 0; }
body.customise .bottom-cover15 { background: url(../_img/cover-bottom-15.png) no-repeat 0 0; }
body.customise .bottom-cover16 { background: url(../_img/cover-bottom-16.png) no-repeat 0 0; }
body.customise .bottom-cover17 { background: url(../_img/cover-bottom-17.png) no-repeat 0 0; }
body.customise .bottom-cover18 { background: url(../_img/cover-bottom-18.png) no-repeat 0 0; }
body.customise .bottom-cover19 { background: url(../_img/cover-bottom-19.png) no-repeat 0 0; }
body.customise .bottom-cover20 { background: url(../_img/cover-bottom-20.png) no-repeat 0 0; }
body.customise .bottom-cover21 { background: url(../_img/cover-bottom-21.png) no-repeat 0 0; }
body.customise .bottom-cover22 { background: url(../_img/cover-bottom-22.png) no-repeat 0 0; }
body.customise .bottom-cover23 { background: url(../_img/cover-bottom-23.png) no-repeat 0 0; }
body.customise .bottom-cover24 { background: url(../_img/cover-bottom-24.png) no-repeat 0 0; }
body.customise .bottom-cover25 { background: url(../_img/cover-bottom-25.png) no-repeat 0 0; }
body.customise .bottom-cover26 { background: url(../_img/cover-bottom-26.png) no-repeat 0 0; }
body.customise .bottom-cover27 { background: url(../_img/cover-bottom-27.png) no-repeat 0 0; }
body.customise .bottom-cover28 { background: url(../_img/cover-bottom-28.png) no-repeat 0 0; }
body.customise .bottom-cover29 { background: url(../_img/cover-bottom-29.png) no-repeat 0 0; }
body.customise .bottom-cover30 { background: url(../_img/cover-bottom-30.png) no-repeat 0 0; }
body.customise .bottom-cover31 { background: url(../_img/cover-bottom-31.png) no-repeat 0 0; }
body.customise .bottom-cover32 { background: url(../_img/cover-bottom-32.png) no-repeat 0 0; }
body.customise .bottom-cover33 { background: url(../_img/cover-bottom-33.png) no-repeat 0 0; }
body.customise .bottom-cover34 { background: url(../_img/cover-bottom-34.png) no-repeat 0 0; }

.display-ds .next,
.display-ds .prev {
    background: url(../_img/arrow.png) no-repeat 0 -100px;
    width: 41px;
    height: 66px;
    position: absolute;
    top: 37%;
    right: -70px;
}
.display-ds .prev {
    background: url(../_img/arrow.png) no-repeat 0 0;
    width: 41px;
    height: 66px;
    position: absolute;
    top: 37%;
    left: -70px;
}

body.customise p.colorselect {
    text-align: center;
    font-weight: bold;
    margin: 20px 0 15px;
}
body.customise .select-toggle {
    margin: 20px auto 0;
    padding: 0 0 60px;
}

body.customise .charging-section {
    text-align: center;
    overflow: hidden;
    margin: 0 0 24px 0;
}
body.customise .charging-section .charging-black,
body.customise .charging-section .charging-white {
    float: left;
    width: 50%;
}
body.customise .charging-section .charging-black img,
body.customise .charging-section .charging-white img {
    border-bottom: 1px solid #bcbcbc;
    margin: 0 0 15px 0;
}
body.customise .ac-section {
    overflow: hidden;
}
body.customise .ac-section img {
    float: right;
    margin: 0 40px 20px 150px;
}
/* ##############################--- SUPPORT --- */
body.support .topic { margin-bottom: 50px; }
body.support .question {
    background: url(../_img/support-arrow-down.png) no-repeat right 0;
    color: #da0010;
    font-weight: 600;
    text-decoration: none;
    display: block;
    margin: 10px 0;
    cursor: pointer;
}
body.support .question.trigger_active {
    background: url(../_img/support-arrow-up.png) no-repeat right 0;
}

body.support .question p {
    background: url(../_img/support-question-small-icon.png) no-repeat 0 0;
    padding: 0 0 0 35px;
    width: 80%;
}
body.support .answer {
    background: url(../_img/support-answer-small-icon.png) no-repeat 0 0;
    padding: 0 0 10px 35px;
    border-bottom: 1px solid #c1c1c1;
}
body.support .topic ul li:before {
    content: "• ";
    color: #ce181e;
}
body.support .topic table {
    width: 100%;
    margin: 20px 0;
}
body.support .topic tr:first-child {
    font-weight: 600;
}
body.support .topic td {
    vertical-align: top;
    width: 25%;
}
/* ##############################--- OVERLAY --- */
.overlay {
    position: absolute;
    top: 200px;
    left: 45px;
    z-index: 100;
    width: 752px;
    min-height: 350px;
    background: #fff;
    margin: 0 auto 30px;
    -webkit-box-shadow: 0 0 56px 0 #aaa;
    box-shadow: 0 0 56px 0 #aaa;
    padding: 35px;
}
.overlay-small {
    width: 442px;
    left: 195px;
}

.gallery-container {
    margin: 0 auto;
    text-align: center;
    position: relative;
    height: 430px;
}

.gallery-container img {
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.overlay a.next,
.overlay a.prev {
    background:url(../_img/slider-arrows.png) no-repeat;
    display:block;
    width:45px;
    height:45px;
    top: 45%;
    cursor:pointer;
    font-size:1px;
    text-indent: -9999px;
    position: absolute;
}

.overlay a.next { background-position: 0 -50px; right: 15px; }
.overlay a.prev { left: 15px;}




a.close {
    width: 45px;
    height: 45px;
    position: absolute;
    top: -15px;
    right: -15px;
    display: block;
    background: url(../_img/btn-close.png) no-repeat 0 0;
    text-indent: -9999px;
    z-index: 2;
}
a.close:hover {
    -ms-transform: rotate(7deg) scale(0.9);
    -webkit-transform: rotate(7deg) scale(0.9);
    transform: rotate(7deg) scale(0.9);
}
