@charset "UTF-8";
/*
Preprocessed stylesheet SCSS
SSPACE
sSpace 2015

@inVolt
*/
/*
IMPORT
--
*/
/*
Preprocessed stylesheet SCSS
VARIABLES
sSpace 2015

@inVolt
*/
/* Couleurs */
/* Flexbox */
/* Icons */
/* Animation */
/* Origin */
/* Transforms */
/* Shadow */
/* Grid */
/* Cursor */
/*
Preprocessed stylesheet SCSS
FONTS
sSpace 2015

@inVolt
*/
/* Cabin */
@font-face {
  font-family: "Cabin";
  src: url("../../fonts/cabin/cabin_regular.eot");
  src: url("../../fonts/cabin/cabin_regular.eot#?iefix") format("embedded-opentype"), url("../../fonts/cabin/cabin_regular.woff") format("woff"), url("../../fonts/cabin/cabin_regular.ttf") format("truetype"), url("../../fonts/cabin/cabin_regular.svg#Cabin") format("svg");
  font-weight: 400;
  font-style: normal;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "Cabin";
    src: url("../../fonts/cabin/cabin_regular.svg#Cabin") format("svg");
  }
}
@font-face {
  font-family: "Cabin";
  src: url("../../fonts/cabin/cabin_medium.eot");
  src: url("../../fonts/cabin/cabin_medium.eot#?iefix") format("embedded-opentype"), url("../../fonts/cabin/cabin_medium.woff") format("woff"), url("../../fonts/cabin/cabin_medium.ttf") format("truetype"), url("../../fonts/cabin/cabin_medium.svg#Cabin") format("svg");
  font-weight: 500;
  font-style: normal;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "Cabin";
    src: url("../../fonts/cabin/cabin_medium.svg#Cabin") format("svg");
  }
}
@font-face {
  font-family: "Cabin";
  src: url("../../fonts/cabin/cabin_semibold.eot");
  src: url("../../fonts/cabin/cabin_semibold.eot#?iefix") format("embedded-opentype"), url("../../fonts/cabin/cabin_semibold.woff") format("woff"), url("../../fonts/cabin/cabin_semibold.ttf") format("truetype"), url("../../fonts/cabin/cabin_semibold.svg#Cabin") format("svg");
  font-weight: 600;
  font-style: normal;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "Cabin";
    src: url("../../fonts/cabin/cabin_semibold.svg#Cabin") format("svg");
  }
}
@font-face {
  font-family: "Cabin";
  src: url("../../fonts/cabin/cabin_bold.eot");
  src: url("../../fonts/cabin/cabin_bold.eot#?iefix") format("embedded-opentype"), url("../../fonts/cabin/cabin_bold.woff") format("woff"), url("../../fonts/cabin/cabin_bold.ttf") format("truetype"), url("../../fonts/cabin/cabin_bold.svg#Cabin") format("svg");
  font-weight: 700;
  font-style: normal;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "Cabin";
    src: url("../../fonts/cabin/cabin_bold.svg#Cabin") format("svg");
  }
}
/* ssicons */
@font-face {
  font-family: "ssicons";
  src: url("../../fonts/ssicons/ssicons.eot");
  src: url("../../fonts/ssicons/ssicons.eot#?iefix") format("embedded-opentype"), url("../../fonts/ssicons/ssicons.woff") format("woff"), url("../../fonts/ssicons/ssicons.ttf") format("truetype"), url("../../fonts/ssicons/ssicons.svg#ssicons") format("svg");
  font-weight: normal;
  font-style: normal;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "ssicons";
    src: url("../../fonts/ssicons/ssicons.svg#ssicons") format("svg");
  }
}
/*
Preprocessed stylesheet SCSS
RESET
sSpace 2015

@inVolt
*/
/* line 10, ../scss/_reset.scss */
.reset, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset, figure, html, body {
  margin: 0;
  padding: 0;
}

/* line 21, ../scss/_reset.scss */
html, body {
  font-size: 62.5%;
  width: 100%;
  height: 100%;
  cursor: url(../../images/uikit/ss_cursor_auto.svg), auto;
}

/* line 28, ../scss/_reset.scss */
body {
  overflow-x: hidden;
  overflow-y: hidden;
}

/* line 33, ../scss/_reset.scss */
body.full {
  overflow-y: scroll;
  overflow-x: visible;
}

/* line 38, ../scss/_reset.scss */
img, fieldset {
  border: 0;
}

/* set html5 elements to block */
/* line 43, ../scss/_reset.scss */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

/* set img max-width */
/* line 48, ../scss/_reset.scss */
img {
  max-width: 100%;
  height: auto;
}

/* ie 8 img max-width */
@media \0screen {
  /* line 54, ../scss/_reset.scss */
  img {
    width: auto;
  }
}
/*
PAGE
--
*/
/* line 24, ../scss/sspace.scss */
* #pagewrap {
  width: 100%;
  height: 100%;
}
/* line 27, ../scss/sspace.scss */
* #pagewrap.fractal {
  background: #333366 url(../../images/idkit/entry_bg.svg) 50% 50% no-repeat;
}
/* line 31, ../scss/sspace.scss */
* #pagewrap.load {
  background: #333366 url(../../images/idkit/load_bg.svg) 50% 50% no-repeat fixed;
}

/* line 36, ../scss/sspace.scss */
* .containerR {
  width: 96rem;
  margin: 0 auto;
  display: flex;
  display: -webkit-flex;
  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;
  justify-content: space-between;
  -webkit-justify-content: space-between;
}

/* line 44, ../scss/sspace.scss */
* .containerC {
  width: 96rem;
  margin: 0 auto;
  display: flex;
  display: -webkit-flex;
  flex-flow: column wrap;
  -webkit-flex-flow: column wrap;
}

/* line 51, ../scss/sspace.scss */
.full {
  height: auto;
}

/*
CANVAS
--
*/
/* line 59, ../scss/sspace.scss */
* .hide {
  opacity: 0 !important;
}

/* line 63, ../scss/sspace.scss */
* #vrMenu, * #vrBoard, * #wip, * #fsPrompt, * #content {
  -moz-transition: 1s, linear;
  -o-transition: 1s, linear;
  -webkit-transition: 1s, linear;
  transition: 1s, linear;
}
/* line 66, ../scss/sspace.scss */
* #vrMenu.fit, * #vrBoard.fit, * #wip.fit, * #fsPrompt.fit, * #content.fit {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

/*
HEADING
--
*/
/* line 79, ../scss/sspace.scss */
* h1, * h2, * h3, * h4, * h5, * h6 {
  font-family: "Cabin", Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 4.8rem;
  line-height: 1.3;
  margin: 0 0 1.5rem 0;
}

/* line 86, ../scss/sspace.scss */
* h2 {
  font-size: 3.6rem;
}

/* line 91, ../scss/sspace.scss */
* h3 {
  font-size: 3.2rem;
}

/* line 96, ../scss/sspace.scss */
* h4 {
  font-size: 2.4rem;
}

/* line 101, ../scss/sspace.scss */
* h5 {
  font-size: 1.8rem;
}

/* line 106, ../scss/sspace.scss */
* h6 {
  font-size: 1.6rem;
}

/* line 111, ../scss/sspace.scss */
h1, * h2, * h3, * h4, * h5, * h6, h2, h3, h4, h5, h6 {
  line-height: 1.3;
}

/* line 115, ../scss/sspace.scss */
* p {
  font-family: "Cabin", Arial, Helvetica, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.8rem;
  line-height: 1.6;
}

/* line 121, ../scss/sspace.scss */
* p + p {
  margin: 1.5rem 0 0;
}

/* line 125, ../scss/sspace.scss */
p.small {
  font-size: 1.5rem;
}

/* line 129, ../scss/sspace.scss */
strong {
  font-size: 700;
}

/* line 133, ../scss/sspace.scss */
ul {
  padding: 0;
  list-style: none;
}

/*
BUTTONS
--
*/
/* line 142, ../scss/sspace.scss */
* button.btn, * a.btn {
  display: flex;
  display: -webkit-flex;
  border: #fff 0.2rem solid;
  outline: none;
  background: #333366;
  cursor: url(../../images/uikit/ss_cursor_pointer.svg), pointer;
  text-decoration: none;
  transform-origin: 50% 50%;
  -weblit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -moz-transition: 0.3s, ease-out;
  -o-transition: 0.3s, ease-out;
  -webkit-transition: 0.3s, ease-out;
  transition: 0.3s, ease-out;
}
/* line 152, ../scss/sspace.scss */
* button.btn:hover, * a.btn:hover {
  transform: translateX(0rem) translateY(0rem) scaleX(1.15) scaleY(1.15) rotate(0deg) skew(0deg);
  -webkit-transform: translateX(0rem) translateY(0rem) scaleX(1.15) scaleY(1.15) rotate(0deg) skew(0deg);
  -moz-transform: translateX(0rem) translateY(0rem) scaleX(1.15) scaleY(1.15) rotate(0deg) skew(0deg);
  box-shadow: 0 0 0.75rem 0.5rem rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: 0 0 0.75rem 0.5rem rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 0.75rem 0.5rem rgba(0, 0, 0, 0.15);
}
/* line 157, ../scss/sspace.scss */
* button.btn p, * a.btn p {
  width: 100%;
  font-weight: 500;
  padding: 1.4rem 0;
  color: #fff;
  text-align: center;
  letter-spacing: 0.1rem;
}
/* line 166, ../scss/sspace.scss */
* button.btn i.icn, * a.btn i.icn {
  width: 100%;
  height: 100%;
}

/*
ICONS
--
*/
/* line 97, ../scss/_variables.scss */
i.icn {
  display: flex;
  display: -webkit-flex;
}

/* line 101, ../scss/_variables.scss */
i.icn::before {
  font-family: "ssicons", monotype;
  font-weight: normal;
  font-style: normal;
  margin: auto;
}

/* line 106, ../scss/_variables.scss */
i.icnMedium::before {
  font-size: 4.2rem;
}

/* line 110, ../scss/_variables.scss */
i.icnWhite::before {
  color: #fff;
}

/* line 114, ../scss/_variables.scss */
i.icnMenu::before {
  content: "";
}

/* line 97, ../scss/_variables.scss */
i.icn {
  display: flex;
  display: -webkit-flex;
}

/* line 101, ../scss/_variables.scss */
i.icn::before {
  font-family: "ssicons", monotype;
  font-weight: normal;
  font-style: normal;
  margin: auto;
}

/* line 106, ../scss/_variables.scss */
i.icnMedium::before {
  font-size: 4.2rem;
}

/* line 110, ../scss/_variables.scss */
i.icnWhite::before {
  color: #fff;
}

/* line 114, ../scss/_variables.scss */
i.icnFermer::before {
  content: "";
}

/* line 97, ../scss/_variables.scss */
i.icn {
  display: flex;
  display: -webkit-flex;
}

/* line 101, ../scss/_variables.scss */
i.icn::before {
  font-family: "ssicons", monotype;
  font-weight: normal;
  font-style: normal;
  margin: auto;
}

/* line 106, ../scss/_variables.scss */
i.icnMedium::before {
  font-size: 4.2rem;
}

/* line 110, ../scss/_variables.scss */
i.icnWhite::before {
  color: #fff;
}

/* line 114, ../scss/_variables.scss */
i.icnRetour::before {
  content: "";
}

/* line 97, ../scss/_variables.scss */
i.icn {
  display: flex;
  display: -webkit-flex;
}

/* line 101, ../scss/_variables.scss */
i.icn::before {
  font-family: "ssicons", monotype;
  font-weight: normal;
  font-style: normal;
  margin: auto;
}

/* line 106, ../scss/_variables.scss */
i.icnMedium::before {
  font-size: 4.2rem;
}

/* line 110, ../scss/_variables.scss */
i.icnWhite::before {
  color: #fff;
}

/* line 114, ../scss/_variables.scss */
i.icnHaut::before {
  content: "";
}

/* line 97, ../scss/_variables.scss */
i.icn {
  display: flex;
  display: -webkit-flex;
}

/* line 101, ../scss/_variables.scss */
i.icn::before {
  font-family: "ssicons", monotype;
  font-weight: normal;
  font-style: normal;
  margin: auto;
}

/* line 106, ../scss/_variables.scss */
i.icnMedium::before {
  font-size: 4.2rem;
}

/* line 110, ../scss/_variables.scss */
i.icnPR::before {
  color: #333366;
}

/* line 114, ../scss/_variables.scss */
i.icnHaut::before {
  content: "";
}

/* line 97, ../scss/_variables.scss */
i.icn {
  display: flex;
  display: -webkit-flex;
}

/* line 101, ../scss/_variables.scss */
i.icn::before {
  font-family: "ssicons", monotype;
  font-weight: normal;
  font-style: normal;
  margin: auto;
}

/* line 106, ../scss/_variables.scss */
i.icnSmall::before {
  font-size: 3.2rem;
}

/* line 110, ../scss/_variables.scss */
i.icnPR::before {
  color: #333366;
}

/* line 114, ../scss/_variables.scss */
i.icnFlecheHaut::before {
  content: "";
}

/*
LINKS
--
*/
/* line 188, ../scss/sspace.scss */
* a.link {
  color: #66CCCC;
  border-bottom: #66CCCC solid 0.1rem;
  padding: 0 0 0.2rem 0;
  text-decoration: none;
  -moz-transition: 0.3s, ease-out;
  -o-transition: 0.3s, ease-out;
  -webkit-transition: 0.3s, ease-out;
  transition: 0.3s, ease-out;
}
/* line 195, ../scss/sspace.scss */
* a.link:hover {
  color: #EE524B;
  border-color: #EE524B;
}

/* line 201, ../scss/sspace.scss */
* a {
  cursor: url(../../images/uikit/ss_cursor_pointer.svg), pointer;
  text-decoration: none;
}

/* line 206, ../scss/sspace.scss */
a.active {
  border-color: #EE524B;
  pointer-events: none;
}

/*
HEADER
--
*/
/* line 216, ../scss/sspace.scss */
* header {
  width: 100%;
  height: 18rem;
  z-index: 2;
}
/* line 220, ../scss/sspace.scss */
* header.absolute {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
}
/* line 226, ../scss/sspace.scss */
* header .above {
  width: 100%;
  height: 12.0rem;
  position: relative;
}
/* line 231, ../scss/sspace.scss */
* header .below {
  width: 100%;
  height: 6.0rem;
  position: relative;
}
/* line 236, ../scss/sspace.scss */
* header .wrapElmt {
  width: 21.0rem;
  height: 100%;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
/* line 243, ../scss/sspace.scss */
* header .headband {
  width: 100%;
  height: 50%;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  background: #fff;
}
/* line 251, ../scss/sspace.scss */
* header .btn {
  width: 6.0rem;
  height: 6.0rem;
  position: absolute;
  top: 0;
  right: -6.0rem;
}
/* line 256, ../scss/sspace.scss */
* header .btn i.icn {
  width: 100%;
  height: 100%;
}

/*
MENU / navigation
--
*/
/* line 267, ../scss/sspace.scss */
* #navMenu {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  background: rgba(51, 51, 102, 0.95);
  display: flex;
  display: -webkit-flex;
  transform-origin: 50% 50%;
  -weblit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  transform: translateX(0rem) translateY(0rem) scaleX(0) scaleY(0) rotate(0deg) skew(0deg);
  -webkit-transform: translateX(0rem) translateY(0rem) scaleX(0) scaleY(0) rotate(0deg) skew(0deg);
  -moz-transform: translateX(0rem) translateY(0rem) scaleX(0) scaleY(0) rotate(0deg) skew(0deg);
  -moz-transition: 0.3s, ease-out;
  -o-transition: 0.3s, ease-out;
  -webkit-transition: 0.3s, ease-out;
  transition: 0.3s, ease-out;
  overflow: hidden;
}
/* line 279, ../scss/sspace.scss */
* #navMenu.evolve {
  transform: translateX(0rem) translateY(0rem) scaleX(1) scaleY(1) rotate(0deg) skew(0deg);
  -webkit-transform: translateX(0rem) translateY(0rem) scaleX(1) scaleY(1) rotate(0deg) skew(0deg);
  -moz-transform: translateX(0rem) translateY(0rem) scaleX(1) scaleY(1) rotate(0deg) skew(0deg);
}
/* line 283, ../scss/sspace.scss */
* #navMenu .close {
  position: absolute;
  top: 2.0rem;
  right: 2.0rem;
}
/* line 287, ../scss/sspace.scss */
* #navMenu .close .btn {
  width: 6.0rem;
  height: 6.0rem;
}
/* line 290, ../scss/sspace.scss */
* #navMenu .close .btn i.icn {
  width: 100%;
  height: 100%;
}
/* line 296, ../scss/sspace.scss */
* #navMenu nav {
  margin: auto;
}
/* line 299, ../scss/sspace.scss */
* #navMenu nav a + a {
  margin: 2.0rem 0 0;
}
/* line 303, ../scss/sspace.scss */
* #navMenu nav p {
  font-size: 3.6rem;
  padding: 1.0rem 0;
}
/* line 309, ../scss/sspace.scss */
* #navMenu footer {
  width: 100%;
  height: auto;
  position: absolute;
  bottom: 2.0rem;
  left: 0;
}
/* line 314, ../scss/sspace.scss */
* #navMenu footer p {
  color: #fff;
  text-align: center;
}

/*
ENTRY / template work
--
*/
/* line 327, ../scss/sspace.scss */
* .sys1 {
  width: 5.8rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys2 {
  width: 14rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys3 {
  width: 22.2rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys4 {
  width: 30.4rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys5 {
  width: 38.6rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys6 {
  width: 46.8rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys7 {
  width: 55rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys8 {
  width: 63.2rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys9 {
  width: 71.4rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys10 {
  width: 79.6rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys11 {
  width: 87.8rem;
  height: auto;
}

/* line 327, ../scss/sspace.scss */
* .sys12 {
  width: 96rem;
  height: auto;
}

/* line 333, ../scss/sspace.scss */
* #entryArea, * #troubleShArea {
  height: calc(100% - 18.0rem - 8.0rem);
}
/* line 336, ../scss/sspace.scss */
* #entryArea .sys6, * #troubleShArea .sys6 {
  display: flex;
  display: -webkit-flex;
}
/* line 340, ../scss/sspace.scss */
* #entryArea .welcome, * #troubleShArea .welcome {
  margin: auto;
}
/* line 343, ../scss/sspace.scss */
* #entryArea .welcome h2, * #troubleShArea .welcome h2, * #entryArea .welcome p, * #troubleShArea .welcome p {
  color: #fff;
}
/* line 348, ../scss/sspace.scss */
* #entryArea a.entryLink, * #troubleShArea a.entryLink {
  width: 100%;
  height: 8.0rem;
  background: transparent;
  text-decoration: none;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
  position: relative;
  margin: auto;
  -moz-transition: 0.3s, ease-out;
  -o-transition: 0.3s, ease-out;
  -webkit-transition: 0.3s, ease-out;
  transition: 0.3s, ease-out;
  transform-origin: 50% 50%;
  -weblit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
}
/* line 360, ../scss/sspace.scss */
* #entryArea a.entryLink:hover, * #troubleShArea a.entryLink:hover {
  transform: translateX(0rem) translateY(0rem) scaleX(1.15) scaleY(1.15) rotate(0deg) skew(0deg);
  -webkit-transform: translateX(0rem) translateY(0rem) scaleX(1.15) scaleY(1.15) rotate(0deg) skew(0deg);
  -moz-transform: translateX(0rem) translateY(0rem) scaleX(1.15) scaleY(1.15) rotate(0deg) skew(0deg);
}
/* line 363, ../scss/sspace.scss */
* #entryArea a.entryLink:hover .fieldAbv path, * #troubleShArea a.entryLink:hover .fieldAbv path, * #entryArea a.entryLink:hover .fieldBlw path, * #troubleShArea a.entryLink:hover .fieldBlw path {
  fill: rgba(102, 204, 204, 0.15);
}
/* line 368, ../scss/sspace.scss */
* #entryArea a.entryLink h4, * #troubleShArea a.entryLink h4 {
  margin: 0;
  padding: 2.5rem 0;
}
/* line 372, ../scss/sspace.scss */
* #entryArea a.entryLink .shield, * #troubleShArea a.entryLink .shield {
  position: absolute;
  top: -19.0rem;
  left: 0;
  width: 100%;
  height: auto;
}
/* line 379, ../scss/sspace.scss */
* #entryArea svg, * #troubleShArea svg {
  width: 100%;
}
/* line 382, ../scss/sspace.scss */
* #entryArea svg .fieldAbv, * #troubleShArea svg .fieldAbv, * #entryArea svg .fieldBlw, * #troubleShArea svg .fieldBlw {
  transform-origin: 23.4rem 23.4rem;
  -weblit-transform-origin: 23.4rem 23.4rem;
  -moz-transform-origin: 23.4rem 23.4rem;
}
/* line 385, ../scss/sspace.scss */
* #entryArea svg .fieldAbv, * #troubleShArea svg .fieldAbv {
  -moz-animation: ranScale 5s infinite alternate ease-out;
  -webkit-animation: ranScale 5s infinite alternate ease-out;
  animation: ranScale 5s infinite alternate ease-out;
}
/* line 388, ../scss/sspace.scss */
* #entryArea svg .fieldBlw, * #troubleShArea svg .fieldBlw {
  -moz-animation: ranScaleAlt 5s infinite alternate-reverse ease-out;
  -webkit-animation: ranScaleAlt 5s infinite alternate-reverse ease-out;
  animation: ranScaleAlt 5s infinite alternate-reverse ease-out;
}
/* line 392, ../scss/sspace.scss */
* #entryArea svg #eclats, * #troubleShArea svg #eclats {
  transform-origin: 23.4rem 23.4rem;
  -weblit-transform-origin: 23.4rem 23.4rem;
  -moz-transform-origin: 23.4rem 23.4rem;
}
/* line 395, ../scss/sspace.scss */
* #entryArea svg #eclats path, * #troubleShArea svg #eclats path {
  -moz-animation: dashMov 10s infinite alternate ease-out;
  -webkit-animation: dashMov 10s infinite alternate ease-out;
  animation: dashMov 10s infinite alternate ease-out;
}

/* line 405, ../scss/sspace.scss */
* #troubleShArea a.btn {
  margin: 3.0rem 0 0;
}
/* line 407, ../scss/sspace.scss */
* #troubleShArea a.btn p {
  text-transform: uppercase;
}
/* line 412, ../scss/sspace.scss */
* #troubleShArea svg {
  margin: auto;
}

@-moz-keyframes dashMov {
  0% {
    stroke-dasharray: 25;
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dasharray: 25;
    stroke-dashoffset: 300;
  }
}
@-webkit-keyframes dashMov {
  0% {
    stroke-dasharray: 25;
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dasharray: 25;
    stroke-dashoffset: 300;
  }
}
@keyframes dashMov {
  0% {
    stroke-dasharray: 25;
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dasharray: 25;
    stroke-dashoffset: 300;
  }
}
@-moz-keyframes ranScale {
  0% {
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform: rotate3d(234, 234, 100, 0);
    -webkit-transform: rotate3d(234, 234, 100, 0);
    -moz-transform: rotate3d(234, 234, 100, 0);
  }
  100% {
    transform: rotate3d(234, 234, 100, 360deg);
    -webkit-transform: rotate3d(234, 234, 100, 360deg);
    -moz-transform: rotate3d(234, 234, 100, 360deg);
  }
}
@-webkit-keyframes ranScale {
  0% {
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform: rotate3d(234, 234, 100, 0);
    -webkit-transform: rotate3d(234, 234, 100, 0);
    -moz-transform: rotate3d(234, 234, 100, 0);
  }
  100% {
    transform: rotate3d(234, 234, 100, 360deg);
    -webkit-transform: rotate3d(234, 234, 100, 360deg);
    -moz-transform: rotate3d(234, 234, 100, 360deg);
  }
}
@keyframes ranScale {
  0% {
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform: rotate3d(234, 234, 100, 0);
    -webkit-transform: rotate3d(234, 234, 100, 0);
    -moz-transform: rotate3d(234, 234, 100, 0);
  }
  100% {
    transform: rotate3d(234, 234, 100, 360deg);
    -webkit-transform: rotate3d(234, 234, 100, 360deg);
    -moz-transform: rotate3d(234, 234, 100, 360deg);
  }
}
@-moz-keyframes ranScaleAlt {
  0% {
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform: rotate3d(234, -234, 100, 0);
    -webkit-transform: rotate3d(234, -234, 100, 0);
    -moz-transform: rotate3d(234, -234, 100, 0);
  }
  100% {
    transform: rotate3d(234, -234, 100, 360deg);
    -webkit-transform: rotate3d(234, -234, 100, 360deg);
    -moz-transform: rotate3d(234, -234, 100, 360deg);
  }
}
@-webkit-keyframes ranScaleAlt {
  0% {
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform: rotate3d(234, -234, 100, 0);
    -webkit-transform: rotate3d(234, -234, 100, 0);
    -moz-transform: rotate3d(234, -234, 100, 0);
  }
  100% {
    transform: rotate3d(234, -234, 100, 360deg);
    -webkit-transform: rotate3d(234, -234, 100, 360deg);
    -moz-transform: rotate3d(234, -234, 100, 360deg);
  }
}
@keyframes ranScaleAlt {
  0% {
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform: rotate3d(234, -234, 100, 0);
    -webkit-transform: rotate3d(234, -234, 100, 0);
    -moz-transform: rotate3d(234, -234, 100, 0);
  }
  100% {
    transform: rotate3d(234, -234, 100, 360deg);
    -webkit-transform: rotate3d(234, -234, 100, 360deg);
    -moz-transform: rotate3d(234, -234, 100, 360deg);
  }
}
/*
INFORMATION AREA
--
*/
/* line 469, ../scss/sspace.scss */
* #infoArea {
  position: absolute;
  bottom: 2.0rem;
  right: 2.0rem;
  z-index: 99;
  display: flex;
  display: -webkit-flex;
  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;
  justify-content: flex-end;
  -webkit-justify-content: flex-end;
}
/* line 477, ../scss/sspace.scss */
* #infoArea .controlsArea, * #infoArea .safetyArea {
  width: 29.0rem;
  height: 6.0rem;
  background: #fff;
  position: relative;
  margin: 0 2.0rem 0 0;
}
/* line 483, ../scss/sspace.scss */
* #infoArea .controlsArea:hover .hdnDrawer, * #infoArea .safetyArea:hover .hdnDrawer {
  transform: translateX(0rem) translateY(0rem) scaleX(1) scaleY(1) rotate(0deg) skew(0deg);
  -webkit-transform: translateX(0rem) translateY(0rem) scaleX(1) scaleY(1) rotate(0deg) skew(0deg);
  -moz-transform: translateX(0rem) translateY(0rem) scaleX(1) scaleY(1) rotate(0deg) skew(0deg);
}
/* line 487, ../scss/sspace.scss */
* #infoArea .controlsArea:hover i.icn, * #infoArea .safetyArea:hover i.icn {
  transform: translateX(0rem) translateY(-1rem) scaleX(1) scaleY(1) rotate(0deg) skew(0deg);
  -webkit-transform: translateX(0rem) translateY(-1rem) scaleX(1) scaleY(1) rotate(0deg) skew(0deg);
  -moz-transform: translateX(0rem) translateY(-1rem) scaleX(1) scaleY(1) rotate(0deg) skew(0deg);
}
/* line 491, ../scss/sspace.scss */
* #infoArea .controlsArea i.icn, * #infoArea .safetyArea i.icn {
  width: 6.0rem;
  height: 6.0rem;
  float: right;
  -moz-transition: 0.5s, ease-in;
  -o-transition: 0.5s, ease-in;
  -webkit-transition: 0.5s, ease-in;
  transition: 0.5s, ease-in;
}
/* line 497, ../scss/sspace.scss */
* #infoArea .controlsArea .hdnDrawer, * #infoArea .safetyArea .hdnDrawer {
  position: absolute;
  left: 0;
  width: calc(100% - 0.8rem);
  height: auto;
  border: #fff solid 0.4rem;
  overflow: hidden;
  background: #333366;
  transform-origin: 50% 100%;
  -weblit-transform-origin: 50% 100%;
  -moz-transform-origin: 50% 100%;
  transform: translateX(0rem) translateY(0rem) scaleX(1) scaleY(0) rotate(0deg) skew(0deg);
  -webkit-transform: translateX(0rem) translateY(0rem) scaleX(1) scaleY(0) rotate(0deg) skew(0deg);
  -moz-transform: translateX(0rem) translateY(0rem) scaleX(1) scaleY(0) rotate(0deg) skew(0deg);
  -moz-transition: 0.3s, ease-out;
  -o-transition: 0.3s, ease-out;
  -webkit-transition: 0.3s, ease-out;
  transition: 0.3s, ease-out;
}
/* line 508, ../scss/sspace.scss */
* #infoArea .controlsArea .hdnDrawer p, * #infoArea .safetyArea .hdnDrawer p {
  margin: 0;
  padding: 2.0rem;
  color: #fff;
}
/* line 513, ../scss/sspace.scss */
* #infoArea .controlsArea .hdnDrawer ul.controls, * #infoArea .safetyArea .hdnDrawer ul.controls {
  width: 87%;
  height: 100%;
  padding: 2.0rem;
  display: flex;
  display: -webkit-flex;
  flex-flow: column wrap;
  -webkit-flex-flow: column wrap;
}
/* line 519, ../scss/sspace.scss */
* #infoArea .controlsArea .hdnDrawer ul.controls li.control, * #infoArea .safetyArea .hdnDrawer ul.controls li.control {
  width: 100%;
  display: flex;
  display: -webkit-flex;
  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;
}
/* line 524, ../scss/sspace.scss */
* #infoArea .controlsArea .hdnDrawer ul.controls li.control .key, * #infoArea .controlsArea .hdnDrawer ul.controls li.control .caption, * #infoArea .safetyArea .hdnDrawer ul.controls li.control .key, * #infoArea .safetyArea .hdnDrawer ul.controls li.control .caption {
  padding: 1.5rem;
  font-family: "Cabin", Arial, Helvetica, sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 1.6rem;
  color: #fff;
  border: #fff solid 0.2rem;
}
/* line 532, ../scss/sspace.scss */
* #infoArea .controlsArea .hdnDrawer ul.controls li.control .key, * #infoArea .safetyArea .hdnDrawer ul.controls li.control .key {
  background: #EE524B;
  text-transform: uppercase;
}
/* line 537, ../scss/sspace.scss */
* #infoArea .controlsArea .hdnDrawer ul.controls li.control .caption, * #infoArea .safetyArea .hdnDrawer ul.controls li.control .caption {
  margin: 0 0 0 -0.2rem;
  flex: 1 1 10rem;
  -webkit-flex: 1 1 10rem;
}
/* line 543, ../scss/sspace.scss */
* #infoArea .controlsArea .hdnDrawer ul.controls li + li, * #infoArea .safetyArea .hdnDrawer ul.controls li + li {
  margin: 1.05rem 0 0;
}
/* line 549, ../scss/sspace.scss */
* #infoArea .controlsArea .hdn1, * #infoArea .safetyArea .hdn1 {
  top: -29.0rem;
}
/* line 552, ../scss/sspace.scss */
* #infoArea .controlsArea .hdn2, * #infoArea .safetyArea .hdn2 {
  top: -43.2rem;
}
/* line 557, ../scss/sspace.scss */
* #infoArea h6 {
  color: #333366;
  margin: 0;
  padding: 2.0rem 1.4rem;
}
/* line 562, ../scss/sspace.scss */
* #infoArea .vrArea {
  height: 6.0rem;
  background: #66CCCC;
}

/*
JY AREA
--
*/
/* line 574, ../scss/sspace.scss */
* #JYArea {
  width: 96rem;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-45%);
  z-index: 98;
}
/* line 581, ../scss/sspace.scss */
* #JYArea p {
  color: #fff;
}
/* line 585, ../scss/sspace.scss */
* #JYArea .notice, * #JYArea .hardware {
  height: auto;
  border: #fff solid 0.4rem;
  background: #333366;
}
/* line 590, ../scss/sspace.scss */
* #JYArea .notice .intro, * #JYArea .hardware .intro {
  width: 100%;
}
/* line 594, ../scss/sspace.scss */
* #JYArea .notice .content, * #JYArea .hardware .content {
  padding: 2.0rem;
}
/* line 598, ../scss/sspace.scss */
* #JYArea .notice .xbox, * #JYArea .hardware .xbox {
  width: 100%;
}
/* line 601, ../scss/sspace.scss */
* #JYArea .notice .xbox .content, * #JYArea .hardware .xbox .content {
  text-align: center;
}
/* line 605, ../scss/sspace.scss */
* #JYArea .notice .xbox img, * #JYArea .hardware .xbox img {
  width: 100%;
  margin: 0 auto;
}
/* line 612, ../scss/sspace.scss */
* #JYArea .title {
  background: #fff;
  width: 100%;
}
/* line 616, ../scss/sspace.scss */
* #JYArea .title p {
  font-weight: 700;
  color: #333366;
  padding: 2.0rem 0 2.0rem 2.0rem;
}
/* line 623, ../scss/sspace.scss */
* #JYArea .buttons {
  display: flex;
  display: -webkit-flex;
  flex-flow: row wrap;
  -webkit-flex-flow: row wrap;
  width: 100%;
}
/* line 629, ../scss/sspace.scss */
* #JYArea .buttons a, * #JYArea .buttons button {
  flex: 1 1 5rem;
  -webkit-flex: 1 1 5rem;
  border: none;
}
/* line 633, ../scss/sspace.scss */
* #JYArea .buttons a p, * #JYArea .buttons button p {
  text-transform: uppercase;
}
/* line 638, ../scss/sspace.scss */
* #JYArea .buttons a {
  background: #EE524B;
}
/* line 642, ../scss/sspace.scss */
* #JYArea .buttons button {
  background: #66CCCC;
}
/* line 647, ../scss/sspace.scss */
* #JYArea .hardware {
  margin: 1.5rem 0 0;
}
/* line 651, ../scss/sspace.scss */
* #JYArea .hardware svg {
  width: 100%;
}
/* line 654, ../scss/sspace.scss */
* #JYArea .hardware svg path {
  fill: #fff;
}

/*
NOTICE
--
*/
/* line 667, ../scss/sspace.scss */
* #content {
  display: flex;
  display: -webkit-flex;
}
/* line 670, ../scss/sspace.scss */
* #content #fsPrompt {
  margin: auto;
  background: rgba(238, 82, 75, 0.75);
  border: #fff solid 0.8rem;
}
/* line 675, ../scss/sspace.scss */
* #content #fsPrompt .up {
  margin: 2.5rem auto 5rem auto;
  border: #fff solid 0.2rem;
}
/* line 679, ../scss/sspace.scss */
* #content #fsPrompt .up i {
  padding: 0.8rem;
}
/* line 684, ../scss/sspace.scss */
* #content #fsPrompt ul {
  width: 46.8rem;
  margin: 0 auto;
  padding: 0 0 5.0rem 0;
  list-style-image: none;
  list-style: none;
}
/* line 692, ../scss/sspace.scss */
* #content #fsPrompt ul li + li {
  margin: 2.0rem 0 0;
}
/* line 696, ../scss/sspace.scss */
* #content #fsPrompt ul li p {
  font-weight: 600;
  color: #fff;
}
/* line 701, ../scss/sspace.scss */
* #content #fsPrompt ul li.note p {
  font-size: 1.5rem;
  opacity: .75;
}

/*
ARTICLES
--
*/
/* line 716, ../scss/sspace.scss */
* #articles {
  width: 100%;
  height: auto;
  background: transparent;
}
/* line 720, ../scss/sspace.scss */
* #articles section {
  width: 100%;
  height: auto;
}
/* line 723, ../scss/sspace.scss */
* #articles section .cover {
  width: inherit;
  height: auto;
  padding: 5.0rem 0;
  background: transparent;
}
/* line 728, ../scss/sspace.scss */
* #articles section .cover h1, * #articles section .cover h2, * #articles section .cover h3, * #articles section .cover h4, * #articles section .cover h5, * #articles section .cover h6 {
  padding: 2.0rem 0;
}
/* line 732, ../scss/sspace.scss */
* #articles section .cover h1, * #articles section .cover h2, * #articles section .cover h3, * #articles section .cover h4, * #articles section .cover h5, * #articles section .cover h6, * #articles section .cover h2 {
  color: #fff;
  text-align: center;
}
/* line 738, ../scss/sspace.scss */
* #articles section article {
  width: 100%;
  height: auto;
  padding: 7.5rem 0;
  background: #fff;
}
/* line 743, ../scss/sspace.scss */
* #articles section article .content {
  width: 96rem;
  margin: 0 auto;
}
/* line 748, ../scss/sspace.scss */
* #articles section article h3, * #articles section article h4 {
  color: #333366;
}
/* line 751, ../scss/sspace.scss */
* #articles section article h3 span.smaller, * #articles section article h4 span.smaller {
  font-size: 2.4rem;
  font-weight: 500;
}
/* line 757, ../scss/sspace.scss */
* #articles section article p {
  color: #333366;
}
/* line 761, ../scss/sspace.scss */
* #articles section article ul {
  padding: 2.0rem;
  margin: 3.0rem 0;
  border: #333366 solid 0.2rem;
}
/* line 766, ../scss/sspace.scss */
* #articles section article ul li + li {
  margin: 1.0rem 0 0;
}
/* line 771, ../scss/sspace.scss */
* #articles section article button {
  background: transparent;
  width: 100%;
  height: 6.0rem;
  border-color: #333366;
}
/* line 777, ../scss/sspace.scss */
* #articles section article .features {
  margin: 10.0rem 0;
}
/* line 780, ../scss/sspace.scss */
* #articles section article .features img {
  margin: 0 0 7.5rem;
}
/* line 785, ../scss/sspace.scss */
* #articles section article .sign {
  width: 26.0rem;
  margin: 10.0rem auto 0 auto;
}
/* line 789, ../scss/sspace.scss */
* #articles section article .sign img {
  width: 100%;
}
/* line 794, ../scss/sspace.scss */
* #articles section article video {
  width: 100%;
}

/*
404
--
*/
/* line 810, ../scss/sspace.scss */
* #content.notFound {
  display: flex;
  display: -webkit-flex;
  z-index: 0;
}
/* line 815, ../scss/sspace.scss */
* #content p {
  margin: auto;
  color: #fff;
  font-size: 2.4rem;
}
/* line 821, ../scss/sspace.scss */
* #content span {
  font-family: "Cabin", Arial, Helvetica, sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 30.4rem;
  color: #fff;
  position: absolute;
  display: block;
}
/* line 828, ../scss/sspace.scss */
* #content span.number1 {
  top: 22.0rem;
  left: 154.0rem;
}
/* line 832, ../scss/sspace.scss */
* #content span.number2 {
  bottom: 52.0rem;
  right: 111.0rem;
}
/* line 836, ../scss/sspace.scss */
* #content span.number3 {
  top: 54.0rem;
  left: 31.0rem;
}