@font-face {
    font-family: 'Source Code Pro';
    src: url(../resources/fonts/SourceCodePro-Regular.ttf);
    font-weight: normal;
}
@font-face {
    font-family: 'Source Code Pro';
    src: url(../resources/fonts/SourceCodePro-Semibold.ttf);
    font-weight: 600;
}

body {
  /* background-color: #000; */
  margin: 0;
  font-family: Arial;
  font-size: 17px;
  hyphens: auto
}

code { font-family: monospace; }

#navbar {top:0; position:fixed; width:100%; z-index:3; letter-spacing: normal}

#infodataheader {visibility: true; position:fixed; top:0; width:100%; height: 100px; margin-top:50px; z-index:1} 

#content {position: absolute; padding-top:150px; padding-bottom:150px; width: 100%; visibility: hidden}

#infodatafooter {visibility: true; bottom:0; position:fixed; width:100%; height: 100px; z-index:1}

#logo {transition: opacity 2s; -webkit-transition: opacity 2s; -moz-transition: opacity 2s; z-index:2}

#navSideMenu {margin-top:58px; z-index:3}

#CookieNotice {display:none; max-width:600px;z-index:3}

a {
  text-decoration: none;
}

p {
  text-align: justify;
  text-justify: inter-word
}

.narrowvertical {display: inline}

.gold {
   background-image: linear-gradient(
	to right,
	#462523 0,
       	#cb9b51 22%, 
	#f6e27a 45%,
	#f6f2c0 50%,
	#f6e27a 55%,
	#cb9b51 78%,
	#462523 100%
	);
   color:transparent;
   -webkit-background-clip:text;
}

.goldenglow {
   background-image: linear-gradient(
	to right,
	#462523 0,
       	#cb9b51 11%, 
	#f6e27a 22%,
	#f6f2c0 25%,
	#f6e27a 28%,
	#cb9b51 39%,
	#462523 50%,
       	#cb9b51 61%, 
	#f6e27a 72%,
	#f6f2c0 75%,
	#f6e27a 78%,
	#cb9b51 89%,
	#462523 100%
	);
   color:transparent;
   background-size: 200% 100%;
   animation: gradient 10s ease infinite;
   -webkit-background-clip:text;
}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.beaconshade {
  text-shadow:
    0 0 3px #fff,
    0 0 6px #fff,
    0 0 9px #fff,
    0 0 12px #fff;
}

.neon {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 10px #fff,
    0 0 20px #fff,
    0 0 40px #fff,
    0 0 80px #fff,
    0 0 90px #fff,
    0 0 100px #fff,
    0 0 150px #fff;
}

.blueray {
  color: #2196F3;
  text-shadow:
    0 0 5px #2196F3,
    0 0 10px #2196F3,
    0 0 20px #2196F3,
    0 0 40px #2196F3,
    0 0 80px #2196F3,
    0 0 90px #2196F3,
    0 0 100px #2196F3,
    0 0 150px #2196F3;
}

@media (min-width:993px) {
  #navbar{letter-spacing: 4px}
}

@media (max-height:599px) {
#infodataheader{display:none}
#content {padding-top:50px}
#infodatafooter{height:60px}
#partners{display:none}
.narrowvertical {display: none}
}

.video-container {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%; 
  overflow: hidden;
  z-index:-1
}

.video-container video {
  min-width: 100%; 
  min-height: 100%; 

  width: auto;
  height: auto;

  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}


/* Logo properties */

.logo {width: 100%; height: auto}


.logocontainer {
  padding-left: 25px;
  padding-top: 30px;
  width: 50px;
  height: 50px;
  position: relative;
  -webkit-perspective: 500px;
  /* -moz-perspective: 500px; */
}

#cube {
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-transform-style: preserve-3d;
  -webkit-animation: rotatecube 20s infinite;
  
  -moz-transform-style: preserve-3d;
  -moz-animation: rotatecube 20s infinite;
}

#cube div {
  width: 50px;
  height: 50px;
  display: block;
  position: absolute;
  border: none;
  line-height: 50px;
  text-align: center;
  font-family: "Times New Roman", serif;
  font-size: 38px;
  font-weight: bold;

  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}

@-webkit-keyframes rotatecube {
  0% { -webkit-transform: rotateX(-25deg) rotateY(0deg) rotateZ(0deg); }
  25% { -webkit-transform: rotateX(-25deg) rotateY(-90deg) rotateZ(0deg); }
  50% { -webkit-transform: rotateX(-25deg) rotateY(-180deg) rotateZ(0deg); }
  75% { -webkit-transform: rotateX(-25deg) rotateY(-270deg) rotateZ(0deg); }
  100% { -webkit-transform: rotateX(-25deg) rotateY(-360deg) rotateZ(0deg); }
}

/*
@-moz-keyframes rotatecube {
  0% { -moz-transform: rotateX(-25deg) rotateY(0deg) rotateZ(0deg); }
  25% { -moz-transform: rotateX(-25deg) rotateY(-90deg) rotateZ(0deg); }
  50% { -moz-transform: rotateX(-25deg) rotateY(-180deg) rotateZ(0deg); }
  75% { -moz-transform: rotateX(-25deg) rotateY(-270deg) rotateZ(0deg); }
  100% { -moz-transform: rotateX(-25deg) rotateY(-360deg) rotateZ(0deg); }
}
*/

.front {
  background: rgba(0,75,107,0.95);
}

.back {
  background: rgba(0,75,107,0.95);
}

.left {
  background: rgba(0,178,214,.5);
}

.right {
  background: rgba(0,178,214,.5);
}

.top {
  background: rgba(0,178,214,0.95);
  font-family: monospace;
  /* color: navy */
}

.bottom {
  background: rgba(0,178,214,0.95);
  font-family: monospace;
}

#cube .front  {
  -webkit-transform: rotateY(0deg ) translateZ( 25px );
  /* -moz-transform: rotateY( 0deg ) translateZ( 25px ); */
}
#cube .back {
  -webkit-transform: rotateY( 180deg ) translateZ( 25px );
  /* -moz-transform: rotateY( 180deg ) translateZ( 25px ); */
}
#cube .left   {
  -webkit-transform: rotateY( -90deg ) translateZ( 25px );
  /* -moz-transform: rotateY( -90deg ) translateZ( 25px ); */
}
#cube .right    {
  -webkit-transform: rotateY(  90deg ) translateZ( 25px );
  /* -moz-transform: rotateY(  90deg ) translateZ( 25px ); */
}
#cube .top  {
  -webkit-transform: rotateX(  90deg ) translateZ( 25px );
  /* -moz-transform: rotateX(  90deg ) translateZ( 25px ); */
}
#cube .bottom {
  -webkit-transform: rotateX( -90deg ) translateZ( 25px );
  /*-moz-transform: rotateX( -90deg ) translateZ( 25px ); */
}

.degree45 {
  -webkit-transform: rotateZ( -45deg );
  /*-moz-transform: rotateZ( -45deg );  */
}

.multichar {
  font-size: 24px!important;
  overflow:hidden
}

div.warningbox {
width: 50%;
font-family:monospace,monospace; font-size:1em;color:red; text-align: center; padding: 5px;
border: 2px solid #ff0;background-color: rgba(0,0,0,0.85);
/* position: fixed; bottom: 70px; left:50%; margin: 0 0 0 -30%; z-index: 4 */
position: fixed; bottom: 70px; margin-left:25%; tranlate: -50%; z-index: 4
}

.black-bg-half-opacity {color:#fff!important;background-color:rgba(0, 0, 0, 0.5)!important}