/* no animated cube for IE browser engines due to preserve3d-support */
/* if it's not working, uncomment JS code in html-file */

@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
    
    #cube {
        visibility: hidden;
    }
    #logo {
        margin: 50px auto !important;
    }
}
@supports (-ms-accelerator: true) {
    /* IE Edge 12+ CSS styles go here */
    
    #cube {
        visibility: hidden;
    }
    #logo {
        margin: 50px auto;
    }
}
/* ------------ */
html {
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
    font-style: normal;
}
body {
    background: url(background.jpg) no-repeat center center fixed;
    background-color: #E8D2C5;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 500px;
    background-repeat: no-repeat;
    background-position: top center;
    background-attachment: fixed;
}
#background div {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-position: bottom center;
    background-repeat: no-repeat;
}
#hero {
    background-image: url(hero2_H500.png);
}
.box3d {
    width: 100px;
    height: 100px;
    margin: 50px auto;
    position: relative;
    -webkit-transform-style: preserve-3d;
}
.box3d div {
    position: absolute;
    left: 0;
    top: 0;
    width: 100px;
    height: 100px;
    transform-origin: 50% 50% -50px;
}
.box3d-ie {
    background-image: url(e-Spirit_web.png);
    width: 450px;
    height: 120px;
    margin: 50px auto;
}
.p1 {
    background: #4cadeb;
    background-image: url(e-spirit-logo.png);
    transform: perspective(600px) rotateX(0deg) rotateY(90deg) rotateZ(0deg);
    animation: spin1 15s infinite linear;
}
.p2 {
    background: #7ac2f0;
    background-image: url(e-spirit-logo.png);
    animation: spin2 15s infinite linear;
}
.p3 {
    background: #a8d7f5;
    background-image: url(e-spirit-logo.png);
    animation: spin3 15s infinite linear;
}
.p4 {
    background: #eb8a4c;
    background-image: url(e-spirit-logo.png);
    animation: spin4 15s infinite linear;
}
.p5 {
    background: #f0a87a;
    background-image: url(e-spirit-logo.png);
    animation: spin5 15s infinite linear;
}
.p6 {
    background: #9b9b9b;
    background-image: url(e-spirit-logo.png);
    animation: spin6 15s infinite linear;
}
/* for Safari and Chrome */
/* for IE10 and Firefox */

@keyframes spin1 {
    to {
        transform: perspective(600px) rotateX(360deg) rotateY(450deg) rotateZ(0deg);
    }
}
@keyframes spin2 {
    0% {
        transform: perspective(600px) rotateX(0deg) rotateY(270deg) rotateZ(0deg);
    }
    100% {
        transform: perspective(600px) rotateX(360deg) rotateY(630deg) rotateZ(0deg);
    }
}
@keyframes spin3 {
    0% {
        transform: perspective(600px) rotateX(90deg) rotateY(0deg) rotateZ(0deg);
    }
    100% {
        transform: perspective(600px) rotateX(450deg) rotateY(0deg) rotateZ(-360deg);
    }
}
@keyframes spin4 {
    0% {
        transform: perspective(600px) rotateX(-90deg) rotateY(0deg) rotateZ(0deg);
    }
    100% {
        transform: perspective(600px) rotateX(270deg) rotateY(0deg) rotateZ(360deg);
    }
}
@keyframes spin5 {
    0% {
        transform: perspective(600px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);
    }
    100% {
        transform: perspective(600px) rotateX(360deg) rotateY(360deg) rotateZ(0deg);
    }
}
@keyframes spin6 {
    0% {
        transform: perspective(600px) rotateX(0deg) rotateY(180deg) rotateZ(0deg);
    }
    100% {
        transform: perspective(600px) rotateX(360deg) rotateY(540deg) rotateZ(0deg);
    }
}
section.support {
    position: relative;
    margin: 0 auto;
    max-width: 750px;
}
.support h2 {
    color: #5d0937;
    line-height: 1;
    font-weight: 400;
    font-style: normal;
    margin: 0;
    padding: 0;
}
a {
    color: #810444;
    text-decoration: none;
    -webkit-transition: color .1s ease, background-color .1s ease;
    transition: color .1s ease, background-color .1s ease;
    font-weight: 400;
    font-style: normal;
}
a.button,
span.button {
    font-weight: 400;
    font-style: normal;
    font-size: .9em;
    color: #fff;
    padding: .5em 1em;
    margin: 15px 0 0;
    display: inline-block;
    background-color: #b41269;
}
a.button:hover,
span.button:hover {
    background-color: #930b54;
}
#logo {
    width: 450px;
    height: 120px;
    background-image: url(e-Spirit_web.png);
    margin: 0 auto;
}
.logo-ie {
    margin: 100px auto !important;
}