*{margin: 0; padding:0;}

body{background-color: black; width: 100%; height: 100%; overflow: hidden;}

#fullscreen_background_image{
    width: 100%; height:100%;
    background-image: url(images/bg_stummfilmII.jpg);
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: center;
    cursor: url(images/cursor/cursor_white.png), auto;}

.deselect ::selection {background: transparent;color: inherit;}
.deselect ::-moz-selection {background: transparent;color: inherit;}
.deselect {-ms-user-select: none; -webkit-user-select: none; -moz-user-select: none; user-select: none;}

/*########################################################################################################################*/

/*PRELOADER*/
#preloader{
    width: 100%; height: 100%;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 10000;
    background-color: rgba(0, 0, 0, 1);
    background-image: url(images/bg_stummfilmII.jpg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center;
    cursor: url(images/cursor/cursor_white.png), auto;}

#preloader_content{
    position: absolute;
    bottom: 20vh; left: 50%;  
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 10001;
    font-family: 'Didot';
    font-size: 30px;
    line-height: 1.3;
    letter-spacing: 1px;
    text-align: center;
    filter: blur(0.5px);
    color: white;
    display: none;}

#preloader_content:hover{
    color: rgba(255, 255, 255, 0.5);}

#loader{
    position: absolute;
    bottom: 19vh; left: 50%;  
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    font-family: 'Didot';
    font-size: 30px;
    line-height: 1.3;
    text-align: center;
    filter: blur(0.5px);
    color: white;
    animation: load infinite 300ms;
    -webkit-animation: load infinite 300ms;}

@keyframes load{0%{opacity: 1;} 50%{opacity: 0;} 100%{opacity: 1;}}
@-webkit-keyframes load{0%{opacity: 1;} 50%{opacity: 0;} 100%{opacity: 1;}}

/*########################################################################################################################*/

/* SAFARI ALERT + CHROME ALERT*/
#safari_alert, #chrome_alert{
    position: fixed;
    width: 100%; height: 100%;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(0, 0, 0, 0.9);
    z-index: 10002;
    display: none;}

#safari_alert_message, #chrome_alert_message{
    position: absolute;
    top: 50%; left: 50%;  
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    color: rgba(250, 250, 250, 0.8);
    font-family: 'Didot'; 
    font-size: 18px;
    letter-spacing: 1px;
    border: 1px solid white;
    padding: 20px;}

#chrome_alert_message:hover{
    text-decoration: underline;}

#close_safari_alert{
    cursor: pointer;
    margin-bottom: 10px;
    width: 100%; text-align: right;}

/*########################################################################################################################*/

/*NO TOUCHSUPPORT*/
#no_touchsupport{
    position: fixed;
    width: 100%; height: 100%; 
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(0, 0, 0, 1);
    color: rgba(250, 250, 250, 0.8);
    font-family: 'Didot'; 
    font-size: 18px;
    letter-spacing: 1px;
    z-index: 10005;
    display: none;}

#no_touchsupport_content{
    position: absolute;
    top: 50%; left: 50%; 
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    border: 1px solid rgba(250, 250, 250, 1);
    width: 250px; height: 150px;}

#no_touchsupport_content span{
    position: absolute;
    top: 50%; left: 50%; 
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);}

#close{position: absolute; top: 5px; right: 15px; font-size: 30px;}

/*########################################################################################################################*/

/*NOT FOR MOBILE*/
#not_for_mobile{
    width: 100%; height: 100%;
    position: absolute; 
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 10002; 
    background-color: rgba(0, 0, 0, 1);
    display: none;}

#not_for_mobile_content{
    position: absolute; 
    top: 50%; left: 50%;  
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 10003;
    color: rgba(150, 150, 150, 1);
    font-family: 'Didot'; 
    font-size: 40px;
    line-height: 1.2;}

@media only screen and (max-width:767px){#not_for_mobile{display: block;}}

/*########################################################################################################################*/

/*BUISINESS CARD*/
#buisinesscard{
    text-decoration: none;
    position: absolute;
    right: 50px; bottom: 15px;
    font-family: 'Didot';
    opacity: 0;
    color: rgba(100, 100, 100, 1);
    transition: all 500ms ease;
    font-size: 12px;
    letter-spacing: 1.5px;}

#buisinesscard:hover{color: rgba(150, 150, 150, 1);}

/*########################################################################################################################*/

#overlay{
    position: fixed;
    width: 100%; height: 100%;
    background-color: black;
    top: 0; left: 0; right: 0; bottom: 0;
    cursor: url(images/cursor/cursor_invisible.png), auto;}

#text_container{
    position: absolute;
    width: 500px; height: 250px;
    top: 50%; left: 50%; transform: translate(-50%, -50%) rotateZ(1deg);
    color: white;
    font-family: 'Didot';
    font-size: 55px;
    line-height: 1.3;
    letter-spacing: 1px;
    text-align: center;
    filter: blur(0.5px);
    cursor: url(images/cursor/cursor_white.png), auto;}

.particle{
    position: absolute;
    transform-origin: center center;}

.pickUpContainer{
    position: absolute;
    color: rgba(255, 255, 255, 1);
    filter: blur(0.5px);
    font-family: 'Didot';
    font-size: 55px;
    line-height: 0.1;}