@charset "UTF-8";
/* Template Particlestorm / www.arttec-gmbh.at */
/* CSS style / intro style large / min. device-width 1000px */
/* by Vordenker design u. communication / vordenker.at */



/* Custom Animations */
@-webkit-keyframes slidein { 0% { margin-top: -50px; margin-left: -50vw; opacity: 0; } 5% { opacity: 0; } 100% { margin-top: 0; margin-left: 0; opacity: 1; } }
@-moz-keyframes slidein { 0% { margin-top: -50px; margin-left: -50vw; opacity: 0; } 5% { opacity: 0; } 100% { margin-top: 0; margin-left: 0; opacity: 1; } }
@keyframes slidein { 0% { margin-top: -50px; margin-left: -50vw; opacity: 0; } 5% { opacity: 0; } 100% { margin-top: 0; margin-left: 0; opacity: 1; } }

@-webkit-keyframes fadeout { 0% { margin-top: 0; margin-left: 0; opacity: 1; } 90% { opacity: 0; } 100% { margin-top: -50px; margin-left: 100px; opacity: 0; } }
@-moz-keyframes fadeout { 0% { margin-top: 0; margin-left: 0; opacity: 1; } 90% { opacity: 0; } 100% { margin-top: -50px; margin-left: 100px; opacity: 0; } }
@keyframes fadeout { 0% { margin-top: 0; margin-left: 0; opacity: 1; } 90% { opacity: 0; } 100% { margin-top: -50px; margin-left: 100px; opacity: 0; } }

@-webkit-keyframes faded { 0% { margin-top: -50px; margin-left: 100px; opacity: 0; } 100% { margin-top: -50px; margin-left: 100px; opacity: 0; } }
@-moz-keyframes faded { 0% { margin-top: -50px; margin-left: 100px; opacity: 0; } 100% { margin-top: -50px; margin-left: 100px; opacity: 0; } }
@keyframes faded { 0% { margin-top: -50px; margin-left: 100px; opacity: 0; } 100% { margin-top: -50px; margin-left: 100px; opacity: 0; } }

@-webkit-keyframes move1 { 0% { top: 35px; margin-left: -30px; } 40% { top: 25px; margin-left: -20px; } 100% { top: 35px; margin-left: -30px; } }
@-moz-keyframes move1 { 0% { top: 35px; margin-left: -30px; } 40% { top: 25px; margin-left: -20px; } 100% { top: 35px; margin-left: -30px; } }
@keyframes move1 { 0% { top: 35px; margin-left: -30px; } 40% { top: 25px; margin-left: -20px; } 100% { top: 35px; margin-left: -30px; } }

@-webkit-keyframes move2 { 0% { top: 23px; margin-left: -18px; } 40% { top: 15px; margin-left: -10px; } 100% { top: 23px; margin-left: -18px; } }
@-moz-keyframes move2 { 0% { top: 23px; margin-left: -18px; } 40% { top: 15px; margin-left: -10px; } 100% { top: 23px; margin-left: -18px; } }
@keyframes move2 { 0% { top: 23px; margin-left: -18px; } 40% { top: 15px; margin-left: -10px; } 100% { top: 23px; margin-left: -18px; } }

@-webkit-keyframes blink { 0% { opacity: 0.65; } 10% { opacity: 0.65; } 60% { opacity: 1; } 90% { opacity: 0.65; } 100% { opacity: 0.65; } }
@-moz-keyframes blink { 0% { opacity: 0.65; } 10% { opacity: 0.65; } 60% { opacity: 1; } 90% { opacity: 0.65; } 100% { opacity: 0.65; } }
@keyframes blink { 0% { opacity: 0.65; } 10% { opacity: 0.65; } 60% { opacity: 1; } 90% { opacity: 0.65; } 100% { opacity: 0.65; } }



/* montserrat-300 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/montserrat-v25-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/montserrat-v25-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v25-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/montserrat-v25-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/montserrat-v25-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/montserrat-v25-latin-300.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-500 - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/montserrat-v25-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/montserrat-v25-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v25-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/montserrat-v25-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/montserrat-v25-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/montserrat-v25-latin-500.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-regular - latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/montserrat-v25-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/montserrat-v25-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/montserrat-v25-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/montserrat-v25-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/montserrat-v25-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/montserrat-v25-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
}

/*  GENERAL  */
body { background-color: #3d3d3f; background-image: url(../images/intro.jpg); background-size: cover; background-repeat: no-repeat; }


/*  HEADER  */
header { height: 100vh; }

/*  blockquote  */
header > div#blockquote .mod-custom { position: absolute; top: 50%; left: 40%; -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); transform: translate(-50%,-50%); text-align: center; color: #fff; }
header.scrolling > div#blockquote .mod-custom { animation: fadeout 2s ease, faded 1s 2s infinite; }
header > div#blockquote .mod-custom { text-align: left; }
header > div#blockquote .mod-custom h1 { font-size: 4em; line-height: 1.15em; font-weight: 200; color: #bdb36c; -webkit-animation: slidein 3s ease-out; animation: slidein 3s ease-out; }
header > div#blockquote .mod-custom h2 { font-size: 4em; line-height: 1.15em; font-weight: 200; color: #fff; -webkit-animation: slidein 3s ease-out; animation: slidein 3s ease-out; }
header > div#blockquote .mod-custom h3 { font-size: 2em; font-weight: 200; color: rgba(189,179,108,0.8); -webkit-animation: slidein 3.25s ease-out; animation: slidein 3.25s ease-out; }
header > div#blockquote .mod-custom h4 { font-size: 2em; font-weight: 200; color: rgba(255,255,255,0.8); -webkit-animation: slidein 3.25s ease-out; animation: slidein 3.25s ease-out; }
header > div#blockquote .mod-custom h5 { font-size: 1.17em; font-weight: 500; color: #bdb36c; -webkit-animation: slidein 3.5s ease-out; animation: slidein 3.5s ease-out; }
header > div#blockquote .mod-custom h6 { font-size: 1.17em; font-weight: 500; color: rgba(255,255,255,0.8); -webkit-animation: slidein 3.5s ease-out; animation: slidein 3.5s ease-out; }
header > div#blockquote .mod-custom h6 { color: rgba(255,255,255,0.8); -webkit-animation: slidein 3.75s ease-out; animation: slidein 3.75s ease-out; }
header > div#blockquote .mod-custom img { width: auto; height: auto; max-width: 325px; max-height: 175px; margin: 10px 12px 10px 0; display: inline-block; overflow: hidden; object-fit: cover; font-family: 'object-fit: cover'; }

/*  read more  */
header .readmore { width: 70px; height: 70px; display: block; position: absolute; bottom: 50px; left: 50%; cursor: pointer; -webkit-transform: translateX(-50%) rotate(135deg); -moz-transform: translateX(-50%) rotate(135deg); -ms-transform: translateX(-50%) rotate(135deg); -o-transform: translateX(-50%) rotate(135deg); transform: translateX(-50%) rotate(135deg); }
header .readmore img:first-child { -webkit-animation: move1 3s ease-in-out infinite; animation: move1 3s ease-in-out infinite; }
header .readmore img { width: 30px; height: 30px; overflow: hidden; position: absolute; left: 50%; top: 25px; margin-left: -20px; -webkit-animation: move2 3s 0.5s ease-in-out infinite; animation: move2 3s 0.5s ease-in-out infinite; opacity: 1; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
header .readmore img:last-child { width: 70px; height: 70px; position: static; object-fit: cover; font-family: 'object-fit: cover'; -webkit-margin: 0; animation: blink 3s ease-in-out infinite; margin: 0; animation: blink 3s ease-in-out infinite; }
header .readmore:hover img { opacity: 0; }
header .readmore:hover img:last-child { opacity: 1; }



/*  BACKGROUND  */
.background { display: none; visibility: hidden; }
canvas { width: 100%; height: 100%; position: fixed; z-index: -5; }