/*
 * navigation menu
 */

#navi {
	width: 87%;
	margin: 0 auto;
	padding: 0;
	height: 9vw;
}

#navi ul {
	display: flex;
	list-style: none; /*square inside url('/img/icons/globe.svg');*/
	margin: auto;
	padding: 0;
	height: 5em;
}

#navi li {
	flex: 1;
	text-align: center;
	background: #000;
	height: 9vw;
	padding: auto;
	font-size: 2vw;
}

#navi li a {
	line-height: 100%;
	height: 100%;
	padding: 2em 0.5ex 0;
	/*border: solid #800 1px;*/
	display: block;
	white-space: nowrap;
}

#navi li a b {
	line-height: 50%;
	font-weight: normal;
	padding: 0;
	margin: 0;
	border: 0;
	border-left: solid 0.5ex #000;
	padding-left: 0.9ex;
	color: #ddd;
}
#navi li a:hover b {
	border-left: solid 0.5ex #d11;
	color: #fff;
}

#navi li:hover {
  /*background: radial-gradient(circle at 50% 160%, #ed1 12%, #f15 24%, rgba(72,17,255,0) 64%); 
   */
}

#navi li a:before {
  /*background: radial-gradient(circle at 50% 160%, #ed1 12%, #f15 24%, rgba(72,17,255,0) 64%); 
   */
}

#navi li {
  padding-left: 16px;
}

/*
#navi ul:not(:first-child) a::before {
  content: "|";
  padding-right: 8px;
  color: #d11; 
}

#navi ul:not(:first-child):hover a:before {
  content: "x";
  color: #d11; 
}
*/

  /*background: radial-gradient(circle at 50% 160%, #ed1 12%, #f15 24%, rgba(72,17,255,0) 64%); 
   */
#navi li a#home {
	padding-top: 0.5em;
}

#navi a, a:visited, a:active {
    color: #ddd;
    text-decoration: none;
}

#navi a:hover {
    color: #fff;
    text-decoration: none;
}


@font-face {
  font-family: 'Meteor';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('/fonts/Meteor.woff2') format('woff2');
}

body, p {
    border: 0; padding: 0; margin: 0;
}

body {
    background: #000;
    color: #ddd;
    align-items: center;
    justify-content: center;
    font-family: "Chakra Petch", "Lucida Console", "Courier New", monospace;
    font-size: calc(12px + 1vw);
    text-align: left;
}

a:visited, a:active { color: #64e; }
a:hover { color: #48e; }

/*
 * headline
 */

#headline {
    color: #eee;
    padding-left: 20%;
    margin-top: -3ex;
}

#headline a {
    background-color: #eee; /*rgba(222, 222, 222, 0.6); */
    border-radius: 5px;
    color: #000;
    padding: 0.2ex 1ex;
    text-decoration-thickness: 1px;

    /*
    background: radial-gradient(ellipse at 50px 160%,
                                rgba(255, 255, 255, 192) 8%,
                                rgba(17,70,127,0) 80%); 
	*/
}

#headline a:hover {
    color: #222;
    background-color: #fff; /*rgba(222, 222, 222, 0.6); */
    text-decoration-thickness: 2px;
}

#broadcast {
  width: auto;
}

#cast0 {
  visibility: hidden;
  animation: 2s ripple infinite;
}

#cast1 {
  visibility: hidden;
  animation: 2s ripple infinite;
  animation-delay: 0.125s;
}

#cast2 {
  visibility: hidden;
  animation: 2s ripple infinite;
  animation-delay: 0.25s;
}

#cast3 {
  visibility: hidden;
  animation: 2s ripple infinite;
  animation-delay: 0.375s;
}

#cast4 {
  visibility: hidden;
  animation: 2s ripple infinite;
  animation-delay: 0.5s;
}

@keyframes ripple {
  0%   { visibility: visible;}
  69%   { visibility: visible;}
  70%   { visibility: hidden;}
  100%   { visibility: hidden;}
}


/*
body:hover {
  background: radial-gradient(circle at 50% 200%, #fed 43%, #01f 64%, #000 80%);
  background-opacity: 0;
    transition: background-opacity 2s linear 0s;
}
*/

#story_partners {
  background: radial-gradient(circle at 50% calc(200% + 50vw), #46f 40%, #31d 60%, #000 80%);
	/*
    background: radial-gradient(circle 256vw at 80% 180vw, #46fa 43%, #3A0BD6aa, 64%, #000a 80%);
  */
  padding-top: 4em;
}

#story_partners p {
  padding: 0 20% 1.5em 20%;
}

@keyframes scroll {
  0% {
    transform: translatex(0);
  }
  100% {
    transform: translatex(calc(-256px * 2 - 128px * 3));
  }
}

.slider {
  background: rgba(0,0,0,0);
  height: 128px;
  margin: auto;
  overflow: hidden;
  position: relative;
  width: 100%;
}

/*
.slider::before, .slider::after {
  background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(17, 17, 17, 0) 100%);
  content: "";
  height: 100px;
  position: absolute;
  width: 200px;
  z-index: 2;
}
.slider::after {
  right: 0;
  top: 0;
  transform: rotatez(180deg);
}
.slider::before {
  left: 0;
  top: 0;
}
*/

.slider .slide-track {
  animation: scroll 10s linear infinite;
  display: flex;
  width: calc(256px * 2 + 128px * 3);
}
.slider .slide {
  height: 128px;
  background: rgba(0,0,0,0);
  transition: background-color 1s ease-out 0s;
  border-radius: 15px; 
  margin: auto;
}
.slider .slide:hover {
  color: #fff;
  height: 128px;
  background: radial-gradient(circle at 50% 160%, #ed1 12%, #f15 35%, rgba(72,17,255,0) 70%); 
}
.slider .slide a {
    display: block;
    height: 128px;
}

h1, h2, h3, h4 {
    font-family: Meteor;
    text-transform: uppercase;
    text-align: center;
}
h1  { font-size: 7vw; }
h2  { font-size: 32; }
h3  {
text-shadow: #000 0px 0px 5px,   #000 0px 0px 5px,   #000 0px 0px 5px,
             #000 0px 0px 5px,   #000 0px 0px 5px,   #000 0px 0px 5px;
}

h1, b, em { color: #fff; }

#footer h3 {
	text-align: left;
	text-shadow: none;
}

#footer h3::before,
#values h3::before,
#fleet h3::before {
	color: #d11;
	content: "I";
	padding-right: 0.3ex;
}

#story {
    display: flex;
    	position: relative;
	top: -16vw;
}

#story h1,
#story h2 {
    max-width: 480px;
    margin: auto;
    padding: 1em 0 1em 4em;
    vertical-align: middle;
}

#always_ready h1 {
    margin: 0;
    padding: .5em 8px;
}

#ready {
    color: #000;
    background: #e8e8e8;
}

/*
 *  SHIPPING
 */

	
#menu {
    font-family: Meteor;
    font-size: 36pt;
    text-transform: capitalize;
    background: url(/img/figure/epkt3_up___.jpg) no-repeat;
    background-position: 100% 50%;
    background-size: 125%; /* calc(1440/1920*1.11);*/
    height: 90vw;
    z-index: -1;
	position: relative;

}

.main-container {
	top: calc(-900vw/16);
}

#menu h3 {
    transform-origin: 80% 100%;
    font-size: 40px;
    rotate: -90deg;
    padding: 0;
    margin:0;
}
#menu ul {
    padding: 0;
    font-size: 20pt;
    list-style: none;
}

#menu ul a {
    color: #ccc;
    text-decoration: none;
}
#menu ul a:hover {
    color: #eee;
    text-decoration: underline;
}

#menu h1 {
    font-size: 40pt;
}

#landing {
    background: url(/img/figure/_DSF8667_op.jpg) no-repeat center bottom;
    background-size: 100vw calc(1000vw/ 16);
    height: calc(1000vw / 16);
}

/*
 * Our values
 */

#values {
    max-height: 2560px;
    background: url(/img/figure/Kurt_Trattner_austria_.jpg) no-repeat 60% bottom;
    height: 256vh;
    padding-left: 45%;
    padding-right: 5%;
    padding-top: 7vw;
}

#values p {
    background: rgba(0, 0, 0, 0.3);
    padding: 0.5ex 1.0ex;
    border-radius: 0.5ex;
    color: #fff;
}

/*
 * fleet
 */

 table {
    margin: auto;
}

table td {
    padding: 0 1ex;
}

/*
 * footer
 */

#footer {
    margin: auto;
    text-align: left;
    padding-bottom: 16em;
    background: radial-gradient(circle 200vw at 50% -108vw, #46f 43%, #3A0BD6, 64%, #000 80%);
    min-height: 15vw;
}

#footer a:link, a:visited,  a:active {
	color: #ddd;
}
#footer a:hover {
	color: #fff;
}

#ever_safe h1 {
	border:0; margin: 0; padding: 1em ;
	background: radial-gradient(circle 200vw at 50% 800%, #46f 43%, #3A0BD6, 64%, #000 80%);
}

.planetary {
    background: radial-gradient(circle 256vw at 80% 180vw, #46fa 43%, #3A0BD6aa, 64%, #000a 80%);
    padding: 0;
}

#fleet {
    min-height: 56svw;
    margin-top: 0;
    border: 0;
    padding-top: 3em;

    background: radial-gradient(circle 256vw at 80% 180vw, #46fa 43%, #3A0BD6aa, 64%, #000a 80%),
                url('/img/vector/aeroplane.svg'),
                url('/img/vector/aeroplane.svg'),
                url('/img/vector/aeroplane.svg');
    background-size: 100%, 128%, 50%, 25%;
    background-position: 100% bottom;
    background-repeat: no-repeat;
}

.left, .rite {
	width: 29%;
	display: block;
	float: left;
	padding: 1em 10%;
}

#statement {
	position: relative;
	top: -11vw;
	color: black;
	padding-bottom: 8ex;

}

#statement h1 {
	margin-top: 0.2ex; margin-bottom: 0; 
}

#sunset {
	height: 66.6666vw;
}

#socials a {
	opacity: 0.8;
}

#socials a:hover {
	opacity: 1;
}

