@font-face {
  font-family: 'Raleway-Regular';
  font-style: normal;
  font-weight: 700;
  src: local("Raleway-Regular"), local("Raleway-Regular"), url(../fonts/Raleway-Regular.ttf) format("TrueType"); }
@font-face {
  font-family: 'Raleway-ExtraLight';
  font-style: normal;
  font-weight: 700;
  src: local("Raleway-ExtraLight"), local("Raleway-ExtraLight"), url(../fonts/Raleway-ExtraLight.ttf) format("TrueType"); }
@font-face {
  font-family: 'Raleway-Light';
  font-style: normal;
  font-weight: 700;
  src: local("Raleway-Light"), local("Raleway-Light"), url(../fonts/Raleway-Light.ttf) format("TrueType"); }
@font-face {
  font-family: 'Raleway-ExtraBold';
  font-style: normal;
  font-weight: 700;
  src: local("Raleway-ExtraBold"), local("Raleway-ExtraBold"), url(../fonts/Raleway-ExtraBold.ttf) format("TrueType"); }
body, .entry-content {
  font-family: Raleway-Regular; }

.voyage-header .brand {
  position: fixed;
  z-index: 1000;
  top: 20px;
  left: 20px; }
  .voyage-header .brand img {
    height: 40px;
    width: auto; }

.page-header, .footer-home {
  display: none; }

@keyframes pinAnimation {
  0% {
    transform: scale(0.2);
    opacity: 1;
    stroke-width: 3; }
  50% {
    transform: scale(1);
    opacity: 1; }
  100% {
    transform: scale(2);
    opacity: 0;
    stroke-width: 1; } }
#le-voyage {
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0; }
  svg a {
    transform: scale(0.5); }
  svg[status="choice"] a {
    transform: scale(1); }
  svg[status="choice"] circle.pin {
    fill: none;
    stroke: #FFFF00;
    animation: pinAnimation 1.5s linear infinite; }
    svg[status="choice"] circle.pin.pin-1 {
      animation-delay: .2s; }
    svg[status="choice"] circle.pin.pin-2 {
      animation-delay: .4s; }
    svg[status="choice"] circle.pin.pin-3 {
      animation-delay: .8s; }
  svg[status="initial"] .focus circle {
    transform: scale(2); }
  svg[status="initial"] circle.pin {
    opacity: 0; }
  svg[status="initial"] a {
    transform: scale(0.5); }
  svg * {
    transition: all .7s ease-in-out; }
  svg text {
    font-family: Raleway-Regular; }
  svg circle {
    fill: #FFFF00; }
  svg a:hover, svg a {
    text-decoration: none; }
  svg g.scene {
    cursor: pointer; }
    svg g.scene:not(.focus) polyline, svg g.scene:not(.focus) text {
      opacity: 0; }

.svg-container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0px;
  bottom: 0; }
  @media (max-width: 800px) {
    .svg-container {
      bottom: auto;
      top: 20vh;
      height: 60vh; } }

body {
  background: #333; }

.voyage-content {
  position: relative;
  z-index: 1;
  float: right; }
  @media (min-width: 800px) {
    .voyage-content {
      width: 40%;
      max-width: 550px;
      padding-right: 40px; } }
  @media (max-width: 800px) {
    .voyage-content {
      padding: 0 !important;
      margin-top: 100vh; } }

.introduction {
  background: rgba(0, 0, 0, 0.5);
  position: relative;
  min-height: 100vh;
  z-index: 1;
  color: white;
  display: flex;
  align-items: center; }
  .introduction h1 {
    text-transform: uppercase;
    font-family: Raleway-ExtraBold;
    text-align: center;
    color: #FFFF00; }
  .introduction p {
    line-height: 1.15; }

.popup {
  font-family: Raleway-Light;
  color: #efefef; }
  .popup .story-content {
    background: rgba(0, 0, 0, 0.66);
    padding: 20px; }
    @media (min-width: 800px) {
      .popup .story-content {
        padding-bottom: 25vh; } }
    .popup .story-content p {
      font-size: 15px;
      line-height: 22px; }
      .popup .story-content p:last-child {
        border-bottom: 1px dashed #fff;
        padding-bottom: 25px; }
  @media (max-width: 800px) {
    .popup [scene-ref] {
      padding-top: 60vh; }
      .popup [scene-ref] .story-content {
        background: #333; } }
  .popup h3 {
    font-family: Raleway-ExtraBold;
    text-transform: uppercase;
    font-size: 35px;
    margin-bottom: 20px;
    color: yellow; }
  .popup h4 {
    font-family: Raleway-Regular;
    line-height: 25px;
    font-size: 20px; }
  .popup img {
    max-width: 100%; }
  .popup.filtered .scene:not(.active) {
    display: none; }

.disclaimer {
  height: 100vh; }
  @media (max-width: 800px) {
    .disclaimer {
      display: none; } }

@media (max-width: 800px) and (orientation: landscape) {
  div[scene-ref] {
    padding-top: 100vh !important; }

  .svg-container {
    top: 0;
    height: 100vh; } }
.socialicon-holder {
  text-align: center;
  margin-top: 10px; }
  .socialicon-holder .socialicon {
    display: inline-block;
    margin: 2px;
    transform: scale(0.9); }

.btn-close {
  position: fixed;
  display: none;
  height: 40px;
  width: 40px;
  right: 0;
  top: 0;
  z-index: 100;
  background: #FFFF00;
  color: #333;
  cursor: pointer;
  line-height: 40px;
  font-size: 30px;
  text-align: center; }
  @media (max-width: 800px) {
    .btn-close {
      visibility: hidden; } }
  body.admin-bar .btn-close {
    top: 32px; }

.voyage-header .brand {
  position: fixed;
  z-index: 1000;
  top: 20px;
  left: 20px; }
  .voyage-header .brand img {
    height: 40px;
    width: auto; }

.voyage-header .social-share {
  position: fixed;
  top: 10px;
  z-index: 1000;
  right: 10px; }
  body.admin-bar .voyage-header .social-share {
    transform: translateY(32px); }
  .voyage-header .social-share span {
    background-repeat: no-repeat;
    background-size: contain;
    height: 40px;
    width: 40px;
    display: inline-block; }
  .voyage-header .social-share .twitter-icon {
    background-image: url(https://inkyfada.com/wp-content/themes/inky/assets/img/twitter-icone.png); }
  .voyage-header .social-share .facebook-icon {
    background-image: url(https://inkyfada.com/wp-content/themes/inky/assets/img/fb-icone.png); }

@media (min-width: 800px) {
  body.popup-open .social-share {
    right: calc(40% + 10px); } }
body.popup-open .btn-close {
  display: block; }

@media (max-width: 800px) {
  .voyage-header {
    height: 50px;
    background: #333;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100; }
    .voyage-header .brand {
      top: 10px; }
    .voyage-header .social-share {
      top: 5px !important; } }

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