/* Note: Not generated by a scss file, just write regular css */
/* (Some of this was taken from a generated file with the comments left in) */


/*.home {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding-bottom: 4rem;
    z-index: 1;
    background-color: #070826;
    background-image: url(../img/ibm_bg_1.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #444;
    text-align: center;
    display: -webkit-flex; display: flex;
    -webkit-flex-direction: column; flex-direction: column;
    -webkit-justify-content: flex-end; justify-content: flex-end;
    -webkit-align-items: center; align-items: center;
    pointer-events: none;
    transition: transform 0.5s cubic-bezier(0.55, 0.06, 0.68, 0.19), background 5s linear;
}
.home:not(.active) {
    transform: translateY(-100%);
    -webkit-transform: translateY(-100%);
    z-index: 3;
}
.home.noTransition {
    transition: none !important;
    -webkit-transition: none !important;
}

.home a {
    color: #4178be;
}
.home .version {
    font-size: 0.45rem;
    position: absolute;
    bottom: 1rem;
    color: rgba(255,255,255,0.9);
    z-index: 999;
}
.home .copyright {
    color: white;
    font-size: 0.6em;
    padding: 0 1em;
    max-width: 20rem;
}
.home .version {
    left: 1em;
}

.lock {
    width: 1.65em;
    height: 1em;
    background-image: url(../img/lock.png);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    bottom: 1em;
    right: 1em;
}*/


@keyframes rackBottomMargin {
    from { margin-top: 0em; }
    85%  { margin-top: 0em; }
    to   { margin-top: 3em; }
}
@media screen and (min-height: 3800px) {
    .bodyVOSK body {
        background-image: url(../img/logoSlave.png), linear-gradient(to bottom, #eee 0%,#eee 50%,#000 50%, #000 100%);
        background-repeat: no-repeat;
        background-position: center 75%, left top;
    }
    .bodyVOSK #body {
        overflow: visible !important;
        height: 1920px;
    }
    .bodyVOSK.bodyPortrait .rackOverlay.active {
        bottom: auto !important;
        height: 3840px;
        background-size: auto 1712px, 100% 50%;
        background-position: center 116px, left top;
    }
    .bodyVOSK .rackOverlay.active .rackHalf.rackBottom {
        margin-top: 3em;
        animation: rackBottomMargin 3.5s ease-out both;
    }
    .bodyVOSK .rackOverlay:not(.active) .rackHalf.rackBottom {
        animation: none !important;
    }
    .bodyVOSK #svgclose, .bodyVOSK #copyclose {
        bottom: 1976px;
    }
    .bodyVOSK #_ffpdfplayer_close_ {
        bottom: 1920px !important;
    }
}

body.bodyVOSK .feedbacklink { display: none; }
body.bodyVOSK .novosk { display: none; }

/*.bodyPhone { font-size: 14px; }
.bodyTablet { font-size: 20px; }
.bodyPhone.bodyHDPI { font-size: 24px; }
.bodyTablet.bodyHDPI { font-size: 40px; }
.bodyVOSK { font-size: 32px; }
.bodyVOSK.bodyTabletP { font-size: 28px; }
.bodyPhone.bodyAndroid.bodyDiag5 { font-size: 16px; }
.bodyPhone.bodyAndroid.bodyDiag6 { font-size: 18px; }

.bodyPhone.body375x667 { font-size: 18px; }
.bodyPhone.body667x375 { font-size: 18px; }
.bodyPhone.body414x736 { font-size: 20px; }
.bodyPhone.body736x414 { font-size: 20px; }

@media screen and (min-width: 375px) and (min-height: 558px) {
  .bodyPhone.bodyFlex { font-size: 18px; }
}
@media screen and (min-height: 375px) and (min-width: 667px) {
  .bodyPhone.bodyFlex { font-size: 18px; }
}
@media screen and (min-width: 414px) and (min-height: 625px) {
  .bodyPhone.bodyFlex { font-size: 20px; }
}
@media screen and (min-height: 414px) and (min-width: 736px) {
  .bodyPhone.bodyFlex { font-size: 20px; }
}
*/



body { font-size: 20px; }

.header {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 3em;
    background-color: #434343;
    color: white;
    font-weight: 500;
    text-align: center;
    display: -webkit-flex; display: flex;
    -webkit-flex-direction: column; flex-direction: column;
    -webkit-justify-content: space-around; justify-content: space-around;
    -webkit-align-items: center; align-items: center;
}
.home.active ~ .header {
    background-image: url(../img/logo30white.png);
    background-position: 1em bottom;
    background-repeat: no-repeat;
    background-size: auto 2.2em;
    background-color: transparent;
    border-bottom: none;
    z-index: 999;
}
.bodyVOSK.bodyPortrait .header {
    top: 80%;
    margin-top: -3em;
}
.bodyVOSK.bodyPortrait .home.active ~ .header {
    top: 0;
    margin-top: 0;
}
.bodyVOSK.bodyPortrait .settingsMenu {
    top: 1520px;
}
.bodyVOSK.bodyPortrait .rackOverlay.active ~ .header {
    top: auto;
    bottom: 0;
    z-index: 5;
}
.header_bar .heading {
    position: absolute;
    line-height: 1.0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.header_bar .heading div {
    color: white;
    font-size: 1.3rem;
}
.bodyPhoneP .header_bar .heading {
    font-size: 0.8em;
    padding-top: 0.5em;
}

.header .settings, .header .kaonvr, .header .share, .header .search, .header .back, .footer .back, .header .bell {
    position: absolute;
    z-index: 4;
    bottom: 0.25rem;
    width: 2rem;
    height: 2rem;
    background-size: 1em 1em;
    background-position: center;
    background-repeat: no-repeat;
}
.header .kaonvr {
    font-family: Cupertino;
    right: 5em;
    display: none;
    -webkit-flex-direction: row; flex-direction: row;
    -webkit-align-items: center; align-items: center;
    color: white;
    padding-left: 0.5em;
    box-sizing: border-box;
}
body[data-vr] .header .kaonvr {
    display: -webkit-inline-flex; display: inline-flex;
}
.header .share {
    background-image: url(../img/share.png);
    right: 3em;
}
.header .search {
    background-image: url(../img/search.png);
    right: 1em;
} 
.header_bar .back {
    display: flex;
    justify-content: center;
    align-content: center;
    position: absolute;
    background-color: #373D41;
    top: 0em;
    left: 0em;
    width: 0.7em;
    height: 100%;
}
.footer .back {
    display: none;
}
.header .bell {
    background-image: url(../img/bell.png);
    right: 5em;
    display: none;
}
.home.active ~ .header .bell {
    display: block;
}
.header .kaonvr {
    right: 7em;
}
/*
.footer .back {
    background-image: url(../img/back_b.png);
    left: 1em;
    display: none;
}
.bodyVOSK.bodyPortrait .footer .back {
    display: block;
}
.bodyVOSK.bodyPortrait .rackOverlay:not(.active) ~ .header .back {
    display: none !important;
}
.home.active ~ .footer .back {
    display: none !important;
}*/
.home.active ~ .header .back {
    display: none !important;
}
.back.parentHidden {
    display: none !important;
}
.header .settings {
    background-image: url(../img/settings.png);
    right: 9em;
    display: none;
}
.home.active ~ .header .settings {
    display: block;
}
body.bodyVOSK .header .settings {
    right: 1em;
}
body.bodyPortrait.bodyVOSK .header .settings {
    right: 3em;
    bottom: -1818px;
}
body.admin .header .settings {
    background-image: url(../img/settings_b.png);
    background-color: white;
    border-radius: 3px;
    width: 5rem;
    background-position: 0.5rem center;
    font-size: 0.8em;
    padding: 0.45rem 0 0 1.5rem;
    box-sizing: border-box;
}
body.admin .header .settings:after {
    content: "Done";
    color: #434343;
}
@-webkit-keyframes expand {
    from { -webkit-transform: scale(0); }
    to { -webkit-transform: scale(1); }
}
@keyframes expand {
    from { transform: scale(0); }
    to { transform: scale(1); }
}
.header_bar .settingsMenu {
    display: none;
    position: absolute;
    z-index: 4;
    background-image: url(../img/settings_b.png);
    background-color: white;
    right: 1rem;
    top: 0.75rem;
    background-size: 1em 1em;
    background-position: 0.5rem 0.5rem;
    background-repeat: no-repeat;
    border-radius: 3px;
    color: #434343;
    padding: 1rem 3rem;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-animation: expand 0.25s ease;
    animation: expand 0.25s ease;
    font-size: 1rem;
}
.header_bar .settingsMenu div {
    font-weight: normal;
    border-top: solid 1px #434343;
    padding: 0.5rem 0;
}
.header_bar .settingsMenu div:first-child {
    border-top: none;
}
.bodyFlex .settingsMenu .delete {
    display: none !important;
}
.bodyVOSK .settingsMenu .delete {
    display: none !important;
}
.settingsMenu .attractStorage, .settingsMenu .attractPower {
    display: none;
}
.bodyVOSK .settingsMenu .attractStorage, .bodyVOSK .settingsMenu .attractPower {
    display: block;
}

@-webkit-keyframes dropIn {
    from { -webkit-transform: scaleY(0); }
    to { -webkit-transform: scaleY(1); }
}
@keyframes dropIn {
    from { transform: scaleY(0); }
    to { transform: scaleY(1); }
}
.header_bar .shareMenu {
    display: none;
    position: absolute;
    z-index: 4;
    top: 100%;
    right: 0;
    min-width: 5em;
    color: white;
    background-color: #434343;
    text-align: left;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-animation: dropIn 0.25s ease;
    animation: dropIn 0.25s ease;
    font-size: 1rem;
}
.header_bar .bellMenu {
    display: none;
    font-family:CiscoThin;
    position: absolute;
    z-index: 4;
    top: 100%;
    right: 0;
    min-width: 5em;
    background-color: white;
    text-align: left;
    color: #252525;
    border: solid 1px #434343;
    border-radius:4px;
    font-size:0.8rem;
    padding:1em;
    box-sizing:border-box;
    max-width:50vw;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-animation: dropIn 0.25s ease;
    animation: dropIn 0.25s ease;
}
.header_bar .shareMenu.active, .header_bar .bellMenu.active {
    display: block;
}
.header_bar .shareMenu[data-url] .shareWait, .header_bar .shareMenu:not([data-url]) .shareEmail {
    display: none;
}
.shareWait, .shareEmail {
    font-size: 0.7em;
    padding: 1em;
}
#searchParent {
    position: absolute;
    right: 11vmin;
    bottom: 0;
    display: none;
    z-index: 4;
    font-size: 0.4em;
    background: #131619;
    padding: 0 0.2em;    
    align-items: center;
    justify-content: center;
    top: 0;
}

.bodyVOSK .search, .bodyVOSK .share, .bodyVOSK .kaonvr, .bodyVOSK .bell {
    display: none !important;
}

.header .copybtn, .header .alton, .header .altoff, .header .collbtn {
    display: none;
    position: absolute;
    left: 4em;
    top: 0.5em;
    border: solid white 1px;
    border-radius: 3px;
    padding: 0.25em 1em;
}
.rackOverlay.active[data-alt] ~ .header .collbtn, .rackOverlay.active[data-copy] ~ .header .collbtn {
    left: 12em;
}
.bodyPortrait:not(.bodyVOSK) .header .copybtn, .bodyPortrait:not(.bodyVOSK) .header .alton, .bodyPortrait:not(.bodyVOSK) .header .altoff, .bodyPortrait:not(.bodyVOSK) .header .collbtn  {
    top: 3.2em;
    z-index: 9;
    left: 1em;
    background: rgba(0,0,0,0.6);
}
.bodyPortrait:not(.bodyVOSK) .rackOverlay.active[data-alt] ~ .header .collbtn , .bodyPortrait:not(.bodyVOSK) .rackOverlay.active[data-copy] ~ .header .collbtn  {
    left: 10em;
}
.bodyVOSK.bodyPortrait .header .copybtn, .bodyVOSK.bodyPortrait .header .alton, .bodyVOSK.bodyPortrait .header .altoff, .bodyVOSK.bodyPortrait .header .collbtn {
    left: auto;
    right: 1em;
}
.bodyVOSK.bodyPortrait .rackOverlay.active[data-alt] ~ .header .collbtn , .bodyVOSK.bodyPortrait .rackOverlay.active[data-copy] ~ .header .collbtn {
    left: auto;
    top: -2.5em;
    background: #222;
}
.rackOverlay.active[data-alt="true"] ~ .header .altoff {
    display: block;
}
.rackOverlay.active[data-alt="false"] ~ .header .alton {
    display: block;
}
.rackOverlay.active[data-copy] ~ .header .copybtn {
    display: block;
}
.rackOverlay.active[data-coll] ~ .header .collbtn {
    display: block;
}
.bodyPhoneP .rackOverlay.active[data-alt] ~ .header, .bodyPhoneP .rackOverlay.active[data-copy] ~ .header,  .bodyPhoneP .rackOverlay.active[data-coll] ~ .header {
    -webkit-align-items: flex-end; align-items: flex-end;
}

.footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: 2.75em;
    z-index: 99;
    text-align: center;
    background-color: white;
    transition: min-height 1s ease;
    pointer-events: none;
}
/* Could apply to bodyPhone if iPhone is supposed to look the same */
.bodyAndroid .footer {
    min-height: 4.0em;
}
.rackOverlay.active ~ .footer {
    z-index: 2;
}
body:not(.bodyPhoneL) .home.active ~ .footer {
    font-size: 1.8em;
    min-height: 14em;
    background: none;
}
body:not(.bodyPhoneL) .home.active ~ .footer > div {
    width: 20%;
    background-color: white;
    margin: 0 0.5rem;
    padding-bottom: 1rem;
    height: 12rem;
    background-size: auto 4rem;
    background-position: center 33%;
    vertical-align: top;
    font-weight: normal;
}
.footer > div {
    position: relative;
    box-sizing: border-box;
    width: 32%;
    line-height: 110%;
    padding: 3.6em 0.5em 0 0.5em;
    background-size: auto 2.4em;
    background-position: center 0.72em;
    background-repeat: no-repeat;
    font-size: 0.5em;
    font-weight: bold;
    color: #626469;
    display: -webkit-inline-flex; display: inline-flex;
    -webkit-flex-direction: column; flex-direction: column;
    -webkit-justify-content: flex-end; justify-content: flex-end;
    -webkit-align-items: center; align-items: center;
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    pointer-events: auto;
}
/* Could apply to bodyPhone if iPhone is supposed to look the same */
.bodyAndroid .footer > div {
    font-size: 0.6em;
}
.footer > div.active {
    color: #4178be;
}
.footer .servers {
    background-image: url(../img/servers.png);
}
.footer .storage {
    background-image: url(../img/storage.png);
}
.footer .solutions {
    background-image: url(../img/solutions.png);
}
.bodyPhone .footer > div {
    width: 25% !important;
}

.left:not(.line) {
    position: absolute;
    left: 0;
    width: 33%;
    top: 3em;
    bottom: 2.75rem;
    background-color: #4178be;
    color: white;
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}
.left.animateBack .button {
    transform: translateX(120%);
    -webkit-transform: translateX(120%);
    transition: transform 0.25s ease;
    -webkit-transition: -webkit-transform 0.25s ease;
}
.left.animateForward .button {
    transform: translateX(-120%);
    -webkit-transform: translateX(-120%);
    transition: transform 0.25s ease;
    -webkit-transition: -webkit-transform 0.25s ease;
}
.bodyVOSK.bodyTabletP .left:not(.line) {
    width: 100%;
    top: 77%;
    padding-bottom: 4em;
    text-align: center;
}
.bodyVOSK.bodyTabletP .left .button {
    background-image: none;
}
.right:not(.line) {
    position: absolute;
    right: 0;
    width: 66%;
    top: 3em;
    bottom: 2.75rem;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}
.bodyPhoneP .home:not(.active) ~ .left:not(.line) {
    width: 100%;
    background: none;
}
.bodyPhoneP .home.active ~ .left:not(.line) {
    width: 40%;
}
.bodyPhoneP .right:not(.line) {
    display: none;
}
.bodyVOSK.bodyPortrait .right:not(.line) {
    padding-top: 600px;
    top: auto;
    max-height: 831px;
    left: 0;
    width: 100%;
    bottom: 28%;
}
.vrackFadeThing {
    display: none;
}
.bodyVOSK.bodyPortrait #body:not(.slave) .rackOverlay:not(.active) ~ .vrackFadeThing {
    display: block;
    pointer-events: none;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 2.75em;
    height: 1.5em;
    z-index: 5;
    background-image: linear-gradient(0deg, rgba(65,120,190,1), rgba(65,120,190,0));
}
.bodyVOSK.bodyPortrait .home.active ~ .vrackFadeThing {
    display: none !important;
}

.home img.custom {
    display: none;
    position: absolute;
    z-index: 1;
}
.bodyVOSK.bodyPortrait .home.active img#custom_portrait {
    display: block;
    right: 0;
    top: 0;
}
.bodyVOSK.bodyLandscape .home.active img#custom_landscape {
    display: block;
    right: 0;
    bottom: 0;
}
.home #custom_video {
    display: none;
}
.bodyVOSK.bodyLandscape .home.active #custom_video {
    display: block;
    position: absolute;
    z-index: 2;
    right: 103px;
    width: 1080px;
    height: 810px;
    top: 183px;
}
.bodyVOSK.bodyPortrait .home.active #custom_video {
    display: block;
    position: absolute;
    z-index: 2;
    right: 0;
    width: 1080px;
    height: 810px;
    top: 305px;
}

@-webkit-keyframes slideFromRight {
    from { -webkit-transform: translateX(120%); }
    to { -webkit-transform: translateX(0); }
}
@keyframes slideFromRight {
    from { transform: translateX(120%); }
    to { transform: translateX(0); }
}
@-webkit-keyframes slideFromLeft {
    from { -webkit-transform: translateX(-120%); }
    to { -webkit-transform: translateX(0); }
}
@keyframes slideFromLeft {
    from { transform: translateX(-120%); }
    to { transform: translateX(0); }
}
.left .button {
    position: relative;
    margin: 0 1em;
    padding: 0.5em 2em 0.5em 0;
    border-bottom: solid 1px rgba(255,255,255,0.2);
    background-image: url(../img/right.png);
    background-size: auto 1em;
    background-position: 95% center;
    background-repeat: no-repeat;
}
.left[data-navtype="forward"] .button {
    animation: slideFromRight 0.25s ease;
    -webkit-animation: slideFromRight 0.25s ease;
}
.left[data-navtype="back"] .button {
    animation: slideFromLeft 0.25s ease;
    -webkit-animation: slideFromLeft 0.25s ease;
}
.left.animateForward .button, .left.animateBack .button {
    animation: none !important;
    -webkit-animation: none !important;
}
.bodyPhoneP .home:not(.active) ~ .left .button {
    background-color: #f9f9f9;
    margin: 0;
    padding: 1em 3em 1em 1em;
    color: #222;
    border-color:#ddd;
}
.left .button.active {
    background-size: 0 0;
    text-shadow: rgba(0,0,0,0.2) 0 1px 0;
}
.left .button:not(.category) {
    background-size: 0 0;
    box-sizing: border-box;
    width: 100%;
    display: -webkit-inline-flex; display: inline-flex;
    -webkit-flex-direction: row; flex-direction: row;
    -webkit-justify-content: flex-start; justify-content: flex-start;
    -webkit-align-items: center; align-items: center;
}
body:not(.bodyPhoneP) .left .button:not(.category) {
    display: none !important;
}
.left .button .thumb {
    width: 6em;
    -webkit-flex-shrink: 0; flex-shrink: 0;
    margin-right: 1em;
    background-color: #ededed;
    text-align: center;
}
@-webkit-keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
.right .button {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 48%;
    background-color: #f7f7f7;
    margin: 1%;
    -webkit-animation: fadeIn 0.25s 0.25s cubic-bezier(0.45, 0.05, 0.55, 0.95) both;
    animation: fadeIn 0.25s 0.25s cubic-bezier(0.45, 0.05, 0.55, 0.95) both;
}
.right .button:nth-child(1) {-webkit-animation-delay: 0s; animation-delay: 0s;}
.right .button:nth-child(2) {-webkit-animation-delay: 0.05s; animation-delay: 0.05s;}
.right .button:nth-child(3) {-webkit-animation-delay: 0.1s; animation-delay: 0.1s;}
.right .button:nth-child(4) {-webkit-animation-delay: 0.15s; animation-delay: 0.15s;}
.right .button:nth-child(5) {-webkit-animation-delay: 0.2s; animation-delay: 0.2s;}
.bodyVOSK .right .button {
    width: 31.3%;
}

.right .button[data-node="1995"] {
    display: none;
}

.right .button .thumb {
    position: relative;
    margin: 0.5em;
    border: solid 1px #dedede;
    background-color: #fff;
    text-align: center;
}
.disabled .thumb img {
    opacity: 0.1;
}
.right .progress {
    bottom: 2.5em;
}
.thumb img {
    max-width: 80%;
    padding: 1em 0;
}
.right .button .name {
    font-weight: 500;
    font-size: 0.7em;
    padding: 0 1em;
    min-height: 3em;
}
.scrollable[data-scrstate="scrolled"] .button {
    background-color: #ddd;
}

#body.searchResults .left {
    display: none;
}
#body.searchResults .right {
    display: block;
    width: 100%;
}
#body.searchResults .header_bar .heading {
    display: none;
}

.bodyLandscape .rackOverlay.active[data-alt] ~ .header_bar .heading,
.bodyLandscape .rackOverlay.active[data-copy] ~ .header_bar .heading {
    padding: 0 12rem;
}
.bodyLandscape .rackOverlay.active[data-alt][data-coll] ~ .header_bar .heading,
.bodyLandscape .rackOverlay.active[data-copy][data-coll] ~ .header_bar .heading {
    padding: 0 6rem 0 21rem;
}

/* IBM has product tour modules that work on phones, so only exclude the few modules that don't */

/* Doesn't exist? */
.bodyPhone .button.module[data-node="1240"],

/* RackConfig */
.bodyPhone .button.module[data-node="1302"],

/* IBM_Power_Interactive */
.bodyPhone .button.module[data-node="1318"],

/* z */
.bodyPhone .button.module[data-node="1314"],

/* linuxONE */
.bodyPhone .button.module[data-node="1400"],

/* Storage_Interactive */
.bodyPhone .button.module[data-node="1403"],

/* IBM_Cloud_Object_Storage */
.bodyPhone .button.module[data-node="1408"],

/* Solution_Story_Z */
.bodyPhone .button.module[data-node="1998"] {
    display: none;
}


#svgviewer, #copyoverlay {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 999999;
}
#svgviewer {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
}
#svg {
    width: 100%;
}
#copy {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    color: white;
    background-color: rgba(0,0,0,0.9);
    padding: 2em;
}
.bodyPhone #copy {
    font-size: 10px;
}
#svgclose, #copyclose {
    position: fixed;
    left: 1em;
    bottom: 2em;
    padding: 1em;
    border-radius: 0.25em;
    color: white;
    background-color: rgba(255,255,255,0.2);
    zIndex: 1000000;
}

.rackOverlay {
    position: absolute;
    z-index: 3;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    background-size: auto 94%, 100% 100%;
    background-repeat: no-repeat;
    background-position: center bottom, left top;
    display: none;
}
.rackOverlay.active {
    display: block;
}
#body.slave {
    height: 1828px !important;
}
#body:not(.slave) .rackOverlay.active {
    top: 3rem;
    bottom: 0;
}
.bodyVOSK.bodyPortrait #body:not(.slave) .rackOverlay.active {
    top: 3.2em;
    bottom: 3rem;
}
.bodyVOSK.bodyPortrait #body.slave .rackOverlay.active {
    top: 0;
    bottom: 0;
}

/*
.bodyVOSK.bodyPortrait .settings {
    bottom: auto;
    top: 10rem;
}
.bodyVOSK.bodyPortrait .settingsMenu {
    top: 10rem;
}
*/

.rackNavi {
    position: absolute;
    left: 0;
    top: 3em;
    bottom: 0;
    z-index: 3;
    background-size: 100% auto;
    background-position: top left , bottom left , top left , bottom left;
    background-repeat: no-repeat;
    display: none;
}
.bodyLandscape .rackOverlay.active ~ .rackNavi {
    display: block;
}
.rackOverlay[data-alt="true"] ~ .rackNavi {
    background-size: 0 0, 0 0, 100% auto, 100% auto;
}
.rackNaviHandle {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    background-color: rgba(165,194,208,0.5);
    background-image: url(../racks/updown.png);
    background-size: 13% auto;
    background-position: center;
    background-repeat: no-repeat;
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
}


@-webkit-keyframes scrollerAnim {
    from { background-color: rgba(0,0,0,0); }
    to   { background-color: #202020; }
}
@keyframes scrollerAnim {
    from { background-color: rgba(0,0,0,0); }
    to   { background-color: #202020; }
}
.scroller {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    -webkit-animation: scrollerAnim 1s 3.5s linear both;
    animation: scrollerAnim 1s 3.5s linear both;
}
.bodyVOSK.bodyTabletL .scroller {
    left: 420px;
    right: 420px;
}
.rackOverlay:not(.active) .scroller {
    -webkit-animation: none !important;
    animation: none !important;
}
.fullRack {
    -webkit-backface-visibility: hidden; /* Use GL Pipeline */
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-transform: translate(0px, 0px) scale(1);
    transform: translate(0px, 0px) scale(1);
}

.fullRack {
    -webkit-animation: fullRackAnim 3.5s ease-out both;
    animation: fullRackAnim 3.5s ease-out both;
}
.rackOverlay:not(.active) .fullRack {
    -webkit-animation: none !important;
    animation: none !important;
}

.rackHalf {
    background-size: cover, 0 0;
    background-repeat: no-repeat;
    position: relative;
    width: 100%;
    padding-top: 178%;
}
body.bodyVOSK .rackHalf {
    background-size: 1030px auto, 0 0;
    background-position: center top;
    background-repeat: no-repeat;
    background-color: black;
    padding-top: 169.5%;
}
[data-alt="true"] .rackHalf {
    background-size: 0 0, cover;
}
body.bodyVOSK [data-alt="true"] .rackHalf {
    background-size: 0 0, 1030px auto;
}

@-webkit-keyframes rackSpotLeftAnim {
    0% { opacity: 0; -webkit-transform: translate(-1000px, 0); }
    40% { opacity: 0; -webkit-transform: translate(-50px, 0); }
    50% { opacity: 0; -webkit-transform: translate(-50px, 0); }
    80% { opacity: 1; -webkit-transform: translate(0px, 0); }
    100% { opacity: 1; -webkit-transform: translate(0px, 0); }
}
@-webkit-keyframes rackSpotRightAnim {
    0% { opacity: 0; -webkit-transform: translate(1000px, 0); }
    40% { opacity: 0; -webkit-transform: translate(50px, 0); }
    50% { opacity: 0; -webkit-transform: translate(50px, 0); }
    80% { opacity: 1; -webkit-transform: translate(0px, 0); }
    100% { opacity: 1; -webkit-transform: translate(0px, 0); }
}
@keyframes rackSpotLeftAnim {
    0% { opacity: 0; transform: translate(-1000px, 0); }
    40% { opacity: 0; transform: translate(-50px, 0); }
    50% { opacity: 0; transform: translate(-50px, 0); }
    80% { opacity: 1; transform: translate(0px, 0); }
    100% { opacity: 1; transform: translate(0px, 0); }
}
@keyframes rackSpotRightAnim {
    0% { opacity: 0; transform: translate(1000px, 0); }
    40% { opacity: 0; transform: translate(50px, 0); }
    50% { opacity: 0; transform: translate(50px, 0); }
    80% { opacity: 1; transform: translate(0px, 0); }
    100% { opacity: 1; transform: translate(0px, 0); }
}


.rackSpotLeft, .rackSpotRight, .rackSpotText {
    width: 4em;
    height: 3.8em;
    margin-top: -1.8em;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
}
.rackSpotLeft {
    left: 0;
    background-image: url(../img/hotspotL.png);
    -webkit-animation: rackSpotLeftAnim 2.5s ease-out;
    animation: rackSpotLeftAnim 2.5s ease-out;
}
.rackSpotRight {
    right: 0;
    background-image: url(../img/hotspotR.png);
    -webkit-animation: rackSpotRightAnim 2.5s ease-out;
    animation: rackSpotRightAnim 2.5s ease-out;
}
.rackSpotText {
    left: 6rem;
    background-image: url(../img/hotspotL.png);
    -webkit-animation: rackSpotLeftAnim 2.5s ease-out;
    animation: rackSpotLeftAnim 2.5s ease-out;
}
[data-alt="false"] .rackSpotText.alt,
[data-alt="true"] .rackSpotText:not(.alt) {
    display: none;
}

.rackSpotLeft select, .rackSpotRight select {
    -webkit-appearance: none;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.light {
    position: absolute;
    z-index: 1;
    pointer-events: none;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
[data-alt="true"] .light {
    display: none;
}


#body.slave .header, #body.slave .home, #body.slave .left, #body.slave .right, #body.slave .footer {
    display: none !important;
}
@-webkit-keyframes wanderUpDown {
    from  { background-position-y: 50% }
    25%   { background-position-y: 100% }
    75%   { background-position-y: 0% }
    to    { background-position-y: 50% }
}
#body.slave.screensaver {
    background-color: black;
    background-image: url(../img/logoSlave.png);
    background-position: center;
    background-repeat: no-repeat;
    -webkit-animation: wanderUpDown 3600s linear infinite;
}
#body.slave.screensaver #bg {
    display: none !important;
}
#body.slaveHome {
    background-image: url(../img/logoSlave.png);
    background-position: center;
    background-repeat: no-repeat;
}
#body.slave .topPanel {
    -webkit-transition: none !important;
}
#body.slave .scroller {
    -webkit-animation: none !important;
}
#body.slave .fullRack {
    -webkit-animation: none !important;
}
.PDFMenu {
    display: none;
    position: absolute;
    right: 0;
    bottom: 100px;
    z-index: 999;
    background: white;
    padding: 2px;
    box-sizing: border-box;
    -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.5);
}
.PDFMenu div {
    color: black;
    padding: 1em;
    border: solid 1px #eeeeee;
}

.adminToggler {
    display: none;
    position: absolute;
    width: 3rem;
    height: 2.25rem;
    right: 0;
    top: 50%;
    margin-top: -1.125rem;
    background-image: url(../img/adminOn.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.right .button .adminToggler {
    top: auto;
    bottom: 0;
}
.main .adminToggler {
    width: 2rem;
}
body.admin .adminToggler {
    display: block;
}
.adminHide .adminToggler {
    background-image: url(../img/adminOff.png);
}
body:not(.admin) .adminHide {
    display: none !important;
}

#protect {
    position: absolute;
    z-index: 999;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.9);

    display: -webkit-flex; display: flex;
    -webkit-flex-direction: column; flex-direction: column;
    -webkit-justify-content: center; justify-content: center;
    -webkit-align-items: center; align-items: center;
}
#protect.wrong {
    pointer-events: none;
}
#protectEntry {
    background-color: rgba(200,200,255,0.5);
    color: white;
    font-size: 2em;
    border-radius: 0.2em;
    width: 8em;
    height: 2em;
    margin: 0.5em;

    display: -webkit-inline-flex; display: inline-flex;
    -webkit-flex-direction: row; flex-direction: row;
    -webkit-justify-content: center; justify-content: center;
    -webkit-align-items: center; align-items: center;
}
#protect.wrong #protectEntry {
    background-color: rgba(255,0,0,0.5);
    
}
.protectRow {
    display: -webkit-flex; display: flex;
    -webkit-flex-direction: row-reverse; flex-direction: row-reverse;
}
.protectKey {
    background-color: white;
    color: black;
    font-size: 2em;
    border-radius: 0.2em;
    width: 2em;
    height: 2em;
    margin: 0.5em;

    display: -webkit-inline-flex; display: inline-flex;
    -webkit-flex-direction: row; flex-direction: row;
    -webkit-justify-content: center; justify-content: center;
    -webkit-align-items: center; align-items: center;
}
.protectKey:active {
    background-color: blue;
}

/* Special rules for Elastic Storage Server alt mode */
.bodyVOSK.bodyPortrait .rackOverlay.active[data-node="1204"][data-alt="true"] .rackSpotLeft,
.bodyVOSK.bodyPortrait .rackOverlay.active[data-node="1204"][data-alt="true"] .rackSpotRight,
.bodyVOSK.bodyPortrait .rackOverlay.active[data-node="1204"][data-alt="true"] .rackSpotText {
    display: none;
}
.bodyVOSK.bodyPortrait #body:not(.slave) .rackOverlay.active[data-node="1204"][data-alt="true"] {
    top: 0;
    bottom: 0;
}
.rackOverlay.active[data-node="1204"][data-alt="true"] ~ .header {
    display: none;
}
.bodyVOSK.bodyPortrait .rackOverlay.active[data-node="1196"][data-alt="true"] .rackSpotLeft,
.bodyVOSK.bodyPortrait .rackOverlay.active[data-node="1196"][data-alt="true"] .rackSpotRight,
.bodyVOSK.bodyPortrait .rackOverlay.active[data-node="1196"][data-alt="true"] .rackSpotText {
    display: none;
}
.bodyVOSK.bodyPortrait #body:not(.slave) .rackOverlay.active[data-node="1196"][data-alt="true"] {
    top: 0;
    bottom: 0;
}
.rackOverlay.active[data-node="1196"][data-alt="true"] ~ .header {
    display: none;
}



/*new animations for IBM start here ----------------*/

#body.slave.screensaver {
    background-color: black;
    background-image: url(../img/screensaver/Base_Dark_Layer_Glow.jpg);
    background-position: center;
    background-repeat: no-repeat;
}

.bg_default{
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
}

#body.slave.screensaver.sspower .bg_default {
    display: block;
}

.bg_default.bg1 {
    background-image: url(../img/screensaver/Blurry_Blue_Dots_Full_Base.jpg);
    -webkit-animation: bottomAnim2 10s ease-in infinite;
    animation: bottomAnim2 10s ease-in infinite;
    -webkit-animation-delay: 1s; 
    animation-delay: 1s;
}

.bg_default.bg2 {
    background-image: url(../img/screensaver/Blurry_Blue_Dots_Partial_1.jpg);
    -webkit-animation: bottomAnim3 10s ease-in infinite;
    animation: bottomAnim3 10s ease-in infinite;
    -webkit-animation-delay: 2s; 
    animation-delay: 2s;
}

.bg_default.bg3 {
    background-image: url(../img/screensaver/Blurry_Blue_Dots_Partial_2.jpg);
    -webkit-animation: bottomAnim2 10s ease-in infinite;
    animation: bottomAnim2 10s ease-in infinite;
    -webkit-animation-delay: 2.5s; 
    animation-delay: 2.5s;
}

.bg_default.bg4 {
    background-image: url(../img/screensaver/colorful_dots_small_partial_glow_1.jpg);
    -webkit-animation: bottomAnim3 10s ease-in infinite;
    animation: bottomAnim3 10s ease-in infinite;
    -webkit-animation-delay: 3s; 
    animation-delay: 3s;
}

.bg_default.bg5 {
    background-image: url(../img/screensaver/colorful_dots_small_partial_glow_2.png);
    -webkit-animation: bottomAnim2 10s ease-in infinite;
    animation: bottomAnim2 10s ease-in infinite;
    -webkit-animation-delay: 4s; 
    animation-delay: 4s;
}

.bg_default.bg6 {
    background-image: url(../img/screensaver/colorful_dots_full_glow.png);
    -webkit-animation: bottomAnim3 10s ease-in infinite;
    animation: bottomAnim3 10s ease-in infinite;
    -webkit-animation-delay: 5s; 
    animation-delay: 5s;
}

.bg_default.bg7 {
    background-image: url(../img/screensaver/triangles_low_glow.png);
    -webkit-animation: bottomAnim3 10s ease-in infinite;
    animation: bottomAnim3 10s ease-in infinite;
    -webkit-animation-delay: 6s; 
    animation-delay: 6s;
}

@-webkit-keyframes bottomAnim {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes bottomAnim {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes bottomAnim2 {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
        transform: scale(1.1);
    }
    100% {
        opacity: 0;
    }
}
@keyframes bottomAnim2 {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
        transform: scale(1.1);
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes bottomAnim3 {
    0% {
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: scale(10);
    }
}
@keyframes bottomAnim3 {
    0% {
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: scale(10);
    }
}

@-webkit-keyframes bottomAnim4 {
    0% {
        opacity: 0;
    }
    3% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: scale(10);
    }
}
@keyframes bottomAnim4 {
    0% {
        opacity: 0;
    }
    3% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: scale(10);
    }
}

/* Disable modules that use recent tech that aren't supported on legacy */
#body[data-old-vosk] .module[data-node="1318"] { display: none !important; }
#body[data-old-vosk] .module[data-node="1314"] { display: none !important; }

/* KS: Compatability fixes on iPad */
.bodyIOS .block.solution_message .slide[data-slide="1"] .i18n {
    font-size: 1.9vw;
}
.bodyIOS .block.solution_message .slide[data-slide="1"] .solution_content .i18n {
    font-size: 1.7vmin;
}

ul {
  margin: 0;
  padding: 0;
  padding-left: 1.5em
}

.touchable {
  cursor: pointer;
}

/* line 5, ../sass/custom.scss */
#body {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: white;
}

/* line 14, ../sass/custom.scss */
.header_bar {
  position: relative;
  top: 0;
  height: .6em;
  background-color: #121619;
  border-bottom: .03em solid white;
  display: flex;
  z-index: 5;
}
/* line 20, ../sass/custom.scss */
.header_bar .logo {
  top: 24%;
  position: relative;
  height: .34em;
  left: 3.4%;
}
/* line 26, ../sass/custom.scss */
.header_bar ul.nav_bar {
  list-style: none;
  display: flex;
  position: absolute;
  z-index: 1;
  right: 0.3em;
  top: 50%;
  margin: 0;
  transform: translate(0, -50%);
}
/* line 33, ../sass/custom.scss */
.header_bar ul.nav_bar li.nav_item {
  margin-left: 0.36em;
}
/* line 35, ../sass/custom.scss */
.header_bar ul.nav_bar li.nav_item img {
  display: block;
  height: 0.25em;
  position: relative;
}

/* line 44, ../sass/custom.scss */
.grid {
  position: relative;
  margin: auto;
  top: 0;
  left: 0;
  width: calc(100% - .125em);
  height: calc(100% - 1.25em);
  display: flex;
  flex-direction: row;
}

/* line 55, ../sass/custom.scss */
.half {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 50%;
  flex-shrink: 0;
  flex-wrap: wrap;
}
/* line 62, ../sass/custom.scss */
.half.catalogue_links {
  color: white;
  background: #020024;
  background: linear-gradient(180deg, #020024 0%, #032fac 0%, #0062ff 100%);
}
/* line 66, ../sass/custom.scss */
.half.catalogue_links .link_arrow {
  position: absolute;
  bottom: 11%;
  right: 8%;
  height: 3.5vmin;
}
/* line 72, ../sass/custom.scss */
.half.catalogue_links .link_icon {
  position: absolute;
  top: 11%;
  left: 9%;
  height: 40%;
  max-width: 82%;
}
/* line 78, ../sass/custom.scss */
.half.catalogue_links .i18n {
  font-size: 3vmin;
  position: absolute;
  bottom: 10%;
  left: 9.4%;
  max-width: 65%;
}

/* line 87, ../sass/custom.scss */
.block {
  position: relative;
  flex-grow: 1;
  width: 100%;
  border: .04em solid white;
  overflow: hidden;
}
/* line 93, ../sass/custom.scss */
.block.hero {
  width: 98.7%;
  background-color: white;
}
/* line 96, ../sass/custom.scss */
.block.hero .slide {
  height: 80%;
  width: 100%;
}
/* line 99, ../sass/custom.scss */
.block.hero .slide .hero_text {
  padding: .32em;
  min-height: 15%;
  max-width: 68%;
}
/* line 102, ../sass/custom.scss */
.block.hero .slide .hero_text .i18n {
  font-family: AppFontSemiBold;
  font-size: 2.5vw;
  top: 3.8%;
  left: 5%;
}
/* line 109, ../sass/custom.scss */
.block.hero .slide .hero_content {
  position: relative;
  top: 10.4%;
  height: 58%;
  background-size: cover;
}
.block.hero .slide .hero_content {
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}
.block.hero .slide[data-slide="1"] .hero_content {
  background-image: url(../img/Satellite_IS_hero.png);
}
/*.block.hero .slide[data-slide="2"] .hero_content {
  background-image: url(../img/Satellite_IS_hero.png);
}*/
.block.hero .slide[data-slide="2"] .hero_content {
  background-image: url(../img/hero_ibm_storage_solution_explorer.png);
}
.block.hero .slide[data-slide="3"] .hero_content {
  background-image: url(../img/hero_ibm_power.png);
}
/*.block.hero .slide[data-slide="4"] .hero_content {
  background-image: url(../img/hero_zsolutions.png);
}*/
.block.hero .slide[data-slide="4"] .hero_content {
  background-image: url(../img/hero_linuxsolutions.png);
}
/*.block.hero .slide[data-slide="6"] .hero_content {
  background-image: url(../img/hero_filler.png);
}*/

/* KS: POTD remove Configurator, move last two modules down by 1 */
.block.hero .slide[data-slide="5"] .hero_content {
  background-image: url(../img/linux_4frames.png);
}
.block.hero .slide[data-slide="6"] .hero_content {
  background-image: url(../img/hero_ibm_cloud_object_storage.png);
}
.block.hero .slide[data-slide="7"] .hero_content {
  background-image: url(../img/hero_ibm_z16.png);
}
.block.hero .slide[data-slide="8"] .hero_content {
  background-image: url(../img/hero_ibm_linuxONE_emperor4.png);
}
.block.hero .slide[data-slide="9"] .hero_content {
  background-image: url(../img/qradar_hero.png);
}

.block.hero .slide[data-slide="12"] .hero_content {
  background-image: url(../img/z_solution_hero.png);
}

/* line 128, ../sass/custom.scss */
.block.hero .slide .learn_more {
  color: #0766FE;
  position: absolute;
  top: 20%;
  right: 8%;
}
/* line 133, ../sass/custom.scss */
.block.hero .slide .learn_more img {
  display: block;
  width: 5vmin;
  margin: 0em .0em .1em .1em;
}
/* line 138, ../sass/custom.scss */
.block.hero .slide .learn_more .i18n {
  font-size: 2vmin;
  font-family: AppFont;
}
/* line 144, ../sass/custom.scss */
.block.hero .hero_slider {
  height: 22%;
  width: 100%;
  bottom: 0%;
  position: absolute;
  display: flex;
  z-index: 10;
}

.block.hero .hero_slider .indicator {
  position: relative;
  height: .2em;
  width: .2em;
  border-radius: 50%;
  top: 39%;
  background-color: #C8DEFF;
  margin-left: 0.1em;
  margin-right: 0.1em;
  flex-shrink: 0;
}
.block.hero .hero_slider .indicator:first-child {
  margin-left: auto;
}
.block.hero .hero_slider .indicator:last-child {
  margin-right: auto;
}

/* line 170, ../sass/custom.scss */
.block.solution_message .slide {
  transition-delay: 311ms;
  display: flex;
  flex-flow: column-reverse;
  justify-content: flex-end;
  color: white;
  background-color: #23292D;
  width: calc(100% - 6vmin);
  height: 100%;
  padding: 3vmin;
}
.copyright_slide {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 0.6em;
  color: white;
  background-color: #23292D;
  display: flex;
  align-items: center;
  justify-content: center;
}
.copyright_slide .solution_content {
  font-family: AppFont;
  font-size: 1.3vmin;
  text-align: center;
  position: relative;
  width: 88%;
}
/* line 179, ../sass/custom.scss */
.block.solution_message .slide .i18n {
  font-family: AppFontSemiBold;
  font-size: 2vw;
  padding-bottom: 1vw;
}
/* line 186, ../sass/custom.scss */
.block.solution_message .slide .solution_content .i18n {
  font-family: AppFont;
  font-size: 1.9vmin;
  line-height: 2.9vmin;
}
/* Text size a bit smaller for Storage Solution Explorer blurb */
.block.solution_message .slide[data-slide="2"] .solution_content .i18n {
  font-size: 1.7vmin;
  line-height: 2.4vmin;
}

/* line 195, ../sass/custom.scss */
.block.bottom .slide {
  transition-delay: 511ms;
  background-color: #D4D9E0;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

.block.bottom .slide[data-slide="2"] {
  background-image: url(../img/storage_racks.png);
}
.block.bottom .slide[data-slide="3"] {
  background-image: url(../img/E1080.png);
  background-size: 45%;
}
.block.bottom .slide[data-slide="4"] {
  background-image: url(../img/LinuxONE_product.png);
/*  background-size: 45%;*/
}
/*.block.bottom .slide[data-slide="6"] {
  background-image: url(../img/server.png);
  background-size: 65%;
}*/
.block.bottom .slide[data-slide="5"] {
  background-image: url(../img/linux_2frames.png);
  background-size: 45%;
}
.block.bottom .slide[data-slide="6"] {
  background-image: url(../img/CloudStorage.png);
  background-size: 50%;
}
.block.bottom .slide[data-slide="7"] {
  background-image: url(../img/IBM_Z16_oneframe.png);
  background-size: 40%;
}
.block.bottom .slide[data-slide="9"] {
  background-image: url(../img/qradar_small.png);
  background-size: 50%;
}

.block.bottom .slide[data-slide="12"] {
  background-image: url(../img/z_solution_frontpage.png);
  background-size: 50%;
}

/* line 219, ../sass/custom.scss */
.slide {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  transition: 411ms opacity cubic-bezier(0.29, 0.04, 0.23, 1), 806ms transform cubic-bezier(0.29, 0.04, 0.23, 1);
  transform: translate(100%);
}

/* line 227, ../sass/custom.scss */
/*#body[data-slide="1"] .bottom .s1,
#body[data-slide="2"] .bottom .s2,
#body[data-slide="3"] .bottom .s3,
#body[data-slide="4"] .bottom .s4*/

.bottom .slide.current {
  opacity: 1;
  transform: translate(0%);
}

/* line 234, ../sass/custom.scss */
/*#body[data-slide="1"] .bottom .s4,
#body[data-slide="2"] .bottom .s1,
#body[data-slide="3"] .bottom .s2,
#body[data-slide="4"] .bottom .s3 */
.bottom .slide.prev {
  transform: translate(-100%);
}

/* line 240, ../sass/custom.scss */
/*#body[data-slide="1"] .bottom .s2, #body[data-slide="1"] .bottom .s3,
#body[data-slide="2"] .bottom .s3, #body[data-slide="2"] .bottom .s4,
#body[data-slide="3"] .bottom .s4, #body[data-slide="3"] .bottom .s1,
#body[data-slide="4"] .bottom .s1, #body[data-slide="4"] .bottom .s2*/
.bottom .slide.upcoming {
  transform: translate(100%);
}

/* line 245, ../sass/custom.scss */
/*#body[data-slide="1"] .top .s1,
#body[data-slide="2"] .top .s2,
#body[data-slide="3"] .top .s3,
#body[data-slide="4"] .top .s4*/
.top .slide.current {
  opacity: 1;
  transform: translateY(0%);
}

/* line 252, ../sass/custom.scss */
/*#body[data-slide="1"] .top .s4,
#body[data-slide="2"] .top .s1,
#body[data-slide="3"] .top .s2,
#body[data-slide="4"] .top .s3*/
.top .slide.prev {
  transform: translateY(100%);
}

/* line 258, ../sass/custom.scss */
/*#body[data-slide="1"] .top .s2, #body[data-slide="1"] .top .s3,
#body[data-slide="2"] .top .s3, #body[data-slide="2"] .top .s4,
#body[data-slide="3"] .top .s4, #body[data-slide="3"] .top .s1,
#body[data-slide="4"] .top .s1, #body[data-slide="4"] .top .s2*/
.top .slide.upcoming {
  transform: translateY(-100%);
}

/* line 264, ../sass/custom.scss */
/*#body[data-slide="1"] .s1,
#body[data-slide="2"] .s2,
#body[data-slide="3"] .s3,
#body[data-slide="4"] .s4*/
.hero .slide.current {
  opacity: 1;
  transform: translate(0%);
}

/* line 271, ../sass/custom.scss */
/*#body[data-slide="1"] .s4,
#body[data-slide="2"] .s1,
#body[data-slide="3"] .s2,
#body[data-slide="4"] .s3*/
.hero .slide.prev {
  transform: translate(100%);
}

/* line 277, ../sass/custom.scss */
/*#body[data-slide="1"] .s2, #body[data-slide="1"] .s3,
#body[data-slide="2"] .s3, #body[data-slide="2"] .s4,
#body[data-slide="3"] .s4, #body[data-slide="3"] .s1,
#body[data-slide="4"] .s1, #body[data-slide="4"] .s2*/
.hero .slide.upcoming {
  transform: translate(-100%);
}

/*#body[data-slide="1"] .block .hero_slider .indicator.slide1 {
  background-color: #0062FF;
}

#body[data-slide="2"] .block .hero_slider .indicator.slide2 {
  background-color: #0062FF;
}

#body[data-slide="3"] .block .hero_slider .indicator.slide3 {
  background-color: #0062FF;
}

#body[data-slide="4"] .block .hero_slider .indicator.slide4 {
  background-color: #0062FF;
}*/
.block .hero_slider .indicator.active_indicator {
  background-color: #0062FF;
}

/* line 293, ../sass/custom.scss */
.home a {
  color: #4178be;
}

/* line 296, ../sass/custom.scss */
.home .version {
  font-size: 0.12em;
  position: absolute;
  color: black;
  z-index: 999;
  left: 1em;
  bottom: 5.2em;
}

/* line 305, ../sass/custom.scss */
.lock {
  width: .2em;
  height: 1.22em;
  background-image: url(../img/icons/icon_lock.svg);
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  bottom: -0.1em;
  left: .1em;
  z-index: 99;
}

/*# sourceMappingURL=custom.css.map */

/* KS EDITS */
.inactive {
  display: none !important;
}

.compatability_container {
  width: 100vw;
  height: 100vh;
  font-size: 100px;
}

.entry_cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #eeeeee;
}

#privacy {
  color: #c8deff;
}

.back img {
  height: 0.6em;
  width: 0.3em;
}

/* Portrait Version */

/* Home elements */
.bodyPortrait .lock {
  top: 0.68em;
  bottom: auto;
  right: .1em;
  left: auto;
}
.bodyPortrait:not(.bodyPhone) .version {
  top: 5.4em;
  bottom: auto;
}
.bodyPortrait .copyright_slide .solution_content {
  font-size: 1vmin;
}

/* Grid layout */
.bodyPortrait .grid {
  flex-direction: column;
  height: calc(100% - 1.3em);
}
.bodyPortrait .grid > .half {
  position: absolute;
  width: 100%;
  height: 75%;
}
.bodyPortrait .grid > .half:nth-child(1) {
  top: 0;
  left: 0;
}
.bodyPortrait .grid > .half:nth-child(2) {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  top: 25%;
  left: 0;
}

/* Hero block */
.bodyPortrait .grid > .half:nth-child(1) .block.hero .slide {
  height: 100%;
}
.bodyPortrait .grid > .half:nth-child(1) .block.hero .slide .hero_text {
  position: relative;
  top: 8%;
  max-width: 75%;
}
.bodyPortrait .grid > .half:nth-child(1) .block.hero .slide .hero_text .i18n {
  font-size: 2.5vh;
}
.bodyPortrait .grid > .half:nth-child(1) .block.hero .slide .hero_content {
  position: absolute;
  width: calc((100% / 3) * 2);
  height: 48%;
  top: calc((100% / 3) + 0.04em);
}
.bodyPortrait .grid > .half:nth-child(1) .block.hero .hero_slider {
  width: calc((100% / 3) * 2);
  height: 16%;
}

/* Rotating images */
.bodyPortrait .grid > .half:nth-child(2) > .half:nth-child(1) {
  height: calc((100% / 3) * 2);
  width: calc((100% / 3) - 0.08em);
  margin-right: 0.08em;
}
.bodyPortrait .block.solution_message .slide .i18n {
  font-size: 1.9vmin;
  padding-bottom: 1vmin;
}
.bodyPortrait .block.solution_message .slide .solution_content .i18n {
  font-size: 1.1vmin;
  line-height: 1.7vmin;
}

/* Catalogue links */
.bodyPortrait .grid > .half:nth-child(2) > .half.catalogue_links {
  display: flex;
  flex-direction: row;
  width: 100%;
  height: calc(100% / 3);
  background: linear-gradient(90deg, #020024 0%, #032fac 0%, #0062ff 100%);
}
.bodyPortrait .grid > .half:nth-child(2) > .half.catalogue_links .block {
  width: calc((100% / 3) - 0.08em);
  height: 100%;
}

/* Vrack Version */
.bodyPortrait.bodyVOSK .grid > .half:nth-child(1) .block.hero .slide:nth-child(4) .hero_text .i18n {
  font-size: 1.65vh;
}
.bodyPortrait.bodyVOSK .grid > .half:nth-child(1) .block.hero .slide:nth-child(5) .hero_text .i18n {
  font-size: 2.2vh;
}
.bodyPortrait.bodyVOSK .compatability_container {
  height: 50vh;
}

.bodyPortrait.bodyVOSK .block.hero .slide .hero_text .i18n {
  font-size: 4.5vmin;
}
.bodyPortrait.bodyVOSK .copyright_slide .solution_content {
  font-size: 1vmin;
  width: 93%;
}

/* iPad Version */
.bodyTablet.bodyIOS #searchParent {
  right: 7%;
}
.bodyTablet.bodyIOS.bodyLandscape #searchParent {
  right: 6%;
}

/* Mobile Version */

#mobile_title {
  display: none;
}

/* Mobile Portrait */
.bodyPhone #mobile_title {
  display: block;
  position: absolute;
  top: 6%;
  left: 50%;
  width: 90%;
  transform: translate(-50%, 0);
  color: black;
}
.bodyPhone #mobile_title .i18n {
  font-size: 9vmin;
  text-align: center;
  font-family: AppFontSemiBold;
}
.bodyPhone .lock {
  top: auto;
  bottom: 0em;
  left: auto;
  right: 0.1em;
  height: 0.3em;
}
.bodyPhone.bodyPortrait .lock {
  background-image: url(../img/icons/lock_mobile.svg);
}
.bodyPhone .home .version {
  left: 0.5em;
  bottom: 0.5em;
  font-size: 0.1em;
  color: white;
}
.bodyPhone .header_bar ul.nav_bar {
  right: 6vmin;
}
.bodyPhone .header_bar ul.nav_bar li.nav_item {
  margin-left: 6vmin;
}
.bodyPhone .header_bar ul.nav_bar li.nav_item img {
  height: 5vmin;
}
.bodyPhone .header_bar .heading {
  padding: 0;
}
.bodyPhone .header_bar .heading .lang_en {
  font-size: 4vmin;
}
.bodyPhone .grid {
  width: 100%;
  height: calc(100% - 0.6em);
}
.bodyPhone .grid > .half {
  height: 100%;
}
.bodyPhone .grid > .half:nth-child(1) {
  display: none;
}
.bodyPhone .grid > .half:nth-child(2) {
  top: 0;
}
.bodyPhone .grid > .half:nth-child(2) > .half:nth-child(1) {
  position: absolute;
  top: 72%;
  height: 25%;
  width: 100%;
  transform: translate(0, -50%);
}
.bodyPhone .grid > .half:nth-child(2) > .half:nth-child(1) .block.top {
  display: none;
}
.bodyPhone .grid > .half:nth-child(2) > .half:nth-child(1) .block.bottom {
  display: none;
}
.bodyPhone .grid > .half:nth-child(2) > .half.catalogue_links {
  position: absolute;
  top: 45%;
  height: 30%;
  transform: translate(0, -50%);
  background: linear-gradient(90deg, #020024 0%, #032fac 0%, #0062ff 100%);
}
.bodyPhone .grid > .half:nth-child(2) > .half.catalogue_links .block {
  width: calc((100% / 3) - 2px);
  border-width: 1px;
}
.bodyPhone .grid > .half:nth-child(2) > .half.catalogue_links .link_icon {
  left: 50%;
  height: 32%;
  transform: translate(-50%, 0);
}
.bodyPhone .grid > .half:nth-child(2) > .half.catalogue_links .i18n {
  top: 50%;
  bottom: auto;
  left: 50%;
  transform: translate(-50%, 0);
  font-size: 4vmin;
}
.bodyPhone .grid > .half:nth-child(2) > .half.catalogue_links .link_arrow {
  right: 50%;
  height: 10%;
  transform: translate(50%, 0);
}
.bodyPhone .copyright_slide {
  height: calc((100% - 0.6em) * 0.39 - 2px);
}
.bodyPhone .copyright_slide .solution_content {
  padding: 10vw 5vw;
  font-size: 1.3vmax;
  text-align: center;
}
.bodyPhone.bodyPortrait .left:not(.line) {
  width: 100%;
}
.bodyPhone .footer > div {
  width: 30% !important;
}

/* Mobile Landscape */
.bodyPhone.bodyLandscape #mobile_title {
  top: 2%;
}
.bodyPhone.bodyLandscape .lock {
  bottom: 0.7em;
}
.bodyPhone.bodyLandscape .home .version {
  color: black;
  bottom: 7em;
}
.bodyPhone.bodyLandscape .grid > .half:nth-child(2) {
  width: 100%;
}
.bodyPhone.bodyLandscape .grid > .half:nth-child(2) > .half:nth-child(1) {
  top: 79%;
}
.bodyPhone.bodyLandscape .grid > .half:nth-child(2) > .half.catalogue_links {
  flex-direction: row;
  top: 49%;
  left: 50%;
  width: 60%;
  height: 60%;
  transform: translate(-50%, -50%);
}
.bodyPhone.bodyLandscape .copyright_slide {
  height: calc((100% - 0.6em) * 0.2 - 2px);
}
.bodyPhone.bodyLandscape .copyright_slide .solution_content {
  padding: 1vw 5vw;
}

/* Browser Compatability */

/* IE */
.feedback .question:nth-child(4) {
  width: 97%;
}

.block.hero .slide[data-slide="10"] .hero_content {
  background-image:url(../img/hero_ibm_storage_virtualize.png);
}

.block.bottom .slide[data-slide="10"] {
  background-image: url(../img/ibm_storage_virtualize_teaser.png);
  background-size: 121%;
  background-position-x: 0;
}

.block.hero .slide[data-slide="11"] .hero_content {
  background-image:url(../img/hero_ibm_fusion.png);
}

.block.bottom .slide[data-slide="11"] {
  background-image: url(../img/ibm_fusion_teaser.png);
  background-size: 100%;
}