/* Fonts */

@font-face {
    font-family: "Open Sans"; 
    src: url("../fonts/Open_Sans/OpenSans-Regular.ttf"); 
}
@font-face {
    font-family: "Exo 2"; 
    /* src: url("../fonts/Exo_2/Exo2-Regular.ttf"); */
    src: url("../fonts/Exo_2/static/Exo2-Regular.ttf");
}
/* @font-face {
    font-family: "Exo 2 Black"; 
    src: url("../fonts/Exo_2/Exo2-Black.ttf"); 
}
@font-face { 
    font-family: "Play"; 
    src: url("../fonts/Play/Play-Bold.ttf"); 
}
@font-face { 
    font-family: "Orbitron"; 
    src: url("../fonts/Orbitron/Orbitron-Bold.ttf"); 
} */

/* Ausschluss */
.nav-downloads{
    display: none;
}
/* .nav-jobs{
    display: none;
} */
.nav-companies{
    display: none;
}
.nav-artists{
    display: none;
}
.nav-apps{
    /* display: none; */
}
/* #player{
    display: none;
} */

*{
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    white-space:normal !important;
}

body {
    /* position: absolute; */
    width: 100%;
    height: 100vh;
    top: 0;
    left: 0;
    right: 0;
	font-size:100%;
	font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    font-size: 1em;
    font-style: normal;
    color: #111;
    background-color: black;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

/* Buttons */

button{
    cursor: pointer;
    transition: .2s all ease-in;
}

/* Links */

a {
	color: #222;
	color: deepskyblue;
    font-size: 1em;
    text-decoration: none;
    transition: 0.4s all ease;
}
a:hover {
	color: darkorange;
}
a.pop:hover img{
    width: 17em !important;
    margin-left: 11% !important;
    margin-top: -19% !important;
    transform: rotate(30deg);
}
a.pop img{
    position: relative;
    transition: 0.1s all ease;
    width: 14em !important;
}

/* List UL OL */

li {
    list-style: none;
}

/* Text */

p {
    line-height: 1.4em !important;
    font-size: 1.3em;
    font-family:Segoe, Segoe UI, DejaVu Sans, Trebuchet MS;
    font-family: "Open sans", sans-serif;
    color: darkgrey;
    font-weight: 300;
}
#impress p{
    color: rgb(90, 90, 90) !important;
}
b {
    font-weight: bold;
	color: white;
	font-style: italic;
}
b.artist{
    color: rgb(214, 214, 214);
    color: aquamarine;
}
h1,h2,h3,h4,h5,h6 {
    color: white;
    /* word-wrap: break-word !important;
    overflow-wrap: break-word !important; */
    /* word-break: break-all; */
    margin: 0;
    padding: 0;
}
div {
    margin: 0;
    padding: 0;
}

/* Headlines */



h1 {
    font-size: 3em;
    font-size: 4em;
    font-weight: bold;
    font-family:Segoe, Segoe UI, DejaVu Sans, Trebuchet MS;
    margin: 0;
    padding: 0;
}
h2 {
    font-size: 2em;
    font-size: 3.5em;
    font-weight: bold;
    font-family:Segoe, Segoe UI, DejaVu Sans, Trebuchet MS;
    color: white;
    letter-spacing: -7px;
}
h3 {
    font-size: 1em;
    font-size: 3em;
    font-weight: bold;
    font-family:Segoe, Segoe UI, DejaVu Sans, Trebuchet MS;
}
h4 {
    font-size: 0.8em;
    font-size: 2em;
    font-weight: bold;
    font-family:Segoe, Segoe UI, DejaVu Sans, Trebuchet MS;
}
h5 {
    font-size: 0.6em;
    font-size: 1.5em;
    font-weight: bold;
    font-family:Segoe, Segoe UI, DejaVu Sans, Trebuchet MS;
}
h6 {
    font-size: 0.4em;
    font-size: 1em;
    font-weight: bold;
    font-family:Segoe, Segoe UI, DejaVu Sans, Trebuchet MS;
}

.secondary-title {
    font-size: 1.5em;
    font-family: 'Exo 2','Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-weight: 400;
    letter-spacing: 2px;
    color: rgb(177, 177, 177);
    margin: 0;
    padding: 0;
}
.head1 {
    color: white;
    text-transform: uppercase;
    letter-spacing: -10px;
}
.head2 {
    color: white;
    font-weight: 400 !important;
}

/* Heading */

.section_heading{
    margin-top: 2%;
    text-align: center;
}
.section_heading h1{
    font-weight: 100 !important;
}

/* Buttons / Apps / Download */

.warning{
    width: auto;
    width: 75%;;
    position: relative;
    background-color: #222;
    border: 6px solid deepskyblue;
    border-radius: 15px;
    color: whitesmoke;
    padding: 10px;
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
}
.downloadAppHolder{
    position: relative;
    width: 130px;
    height: 130px;
    float: left;
}
.downloadApp{
    width: calc(100% / 3 - 15%);
    height: 150px;
    height: auto;
    margin-right: 5%;
    margin-bottom: 90px;
    background-color: transparent;
    border: none;
    transition: .3s all ease;
    border-radius: 5px;
    padding: 5px;
}
.downloadApp:hover{
    background-color: #111;
    cursor: pointer;
}
.downloadApp img{
    width: 100%;
    height: auto;
}
/* .downloadApp img:hover{
} */
.downloadApp h4{
    color: white !important;
    font-size: 1em;
    text-align: center !important;
}
.donationPayPalFormBtn{
    position: relative;
    width: 100%;
    height: auto;
}
/* .donationPayPalFormBtn:hover{
} */
.donationPayPalFormBtn input[type=image]{
    width: 50%;
    transition: .3s all ease;
}
.donationPayPalFormBtn input[type=image]:hover{
    width: 60%;
}
.donationBtn{
    position: relative;
    width: 50% !important;
    height: auto !important;
    margin-right: 5%;
    margin-bottom: 5%;
    background-color: transparent;
    border: none;
    border-radius: 10px;
    padding: 10px;
    transition: .3s all ease;
    color: white;
    cursor: pointer;
    font-size: 1em;
}
.donationBtn:hover{
    width: 75% !important;
    height: auto !important;
    background-color: #111;
    cursor: pointer;
    font-size: 1.5em;
}
.donationBtn img{
    width: 100% !important;
    height: auto !important;
}
.donationBtn i{
    width: auto!important;
    height: auto !important;
    color: deeppink !important;
    font-size: 1em !important;
    border-radius: 5px;
    padding: 1%;
    background-color: lightgray !important;
    filter: none;
}
/*.fa-heart{
    color: red !important;
    background-color: aqua !important;
    padding: 1%;
}*/
.btn-dark{
    width: auto;
    min-width: auto;
    max-width: auto;
    height: auto;
    background-color: #222;
    border: 1px solid #333;
    color: white;

}
.btn-dark:hover{
    opacity: 1 !important;
    background-color: #222;
    border: 1px solid #111;
    border: 1px solid aqua;
    color: white;
    
}

/* PWGEN */

.pwgen button{
    width: 100%;
    height: 50px;
    font-weight: bold;
    letter-spacing: 2px;
}
.pwgen input{
    width: calc(100% - 5px);
    height: auto;
    background-color: #222;
    color: mediumseagreen;
    font-size: 5em;
    text-align: center;
    font-weight: bold;
}

/* PWGEN-AV */

fieldset{
    border: none !important;
    margin: 0;
    padding: 0;
}
form#type{
    width: 100%;
    color: white !important;
    border: none !important;
    font-weight: 600;
    margin: 0;
    padding: 0;
}
fieldset input{
    width: auto !important;
    width: 30px !important;
}
fieldset input:checked{
    color: red !important;
    background-color: red !important;
    background: red !important;
    font-size: 2em !important;
    width: 30px !important;
    padding: 15px !important;
}

/*

input[type=checkbox]:not(old){
  width     : 2em;
  margin    : 0;
  padding   : 0;
  font-size : 1em;
  opacity   : 0;
}
input[type=checkbox]:not(old) + label{
  display      : inline-block;
  margin-left  : -2em;
  line-height  : 1.5em;
}
input[type=checkbox]:not(old) + label > span{
  display          : inline-block;
  width            : 0.875em;
  height           : 0.875em;
  margin           : 0.25em 0.5em 0.25em 0.25em;
  border           : 0.0625em solid rgb(192,192,192);
  border-radius    : 0.25em;
  background       : rgb(224,224,224);
  background-image :    -moz-linear-gradient(rgb(240,240,240),rgb(224,224,224));
  background-image :     -ms-linear-gradient(rgb(240,240,240),rgb(224,224,224));
  background-image :      -o-linear-gradient(rgb(240,240,240),rgb(224,224,224));
  background-image : -webkit-linear-gradient(rgb(240,240,240),rgb(224,224,224));
  background-image :         linear-gradient(rgb(240,240,240),rgb(224,224,224));
  vertical-align   : bottom;
}

input[type=checkbox]:not(old):checked + label > span,
input[type=radio   ]:not(old):checked + label > span{
  background-image :    -moz-linear-gradient(rgb(224,224,224),rgb(240,240,240));
  background-image :     -ms-linear-gradient(rgb(224,224,224),rgb(240,240,240));
  background-image :      -o-linear-gradient(rgb(224,224,224),rgb(240,240,240));
  background-image : -webkit-linear-gradient(rgb(224,224,224),rgb(240,240,240));
  background-image :         linear-gradient(rgb(224,224,224),rgb(240,240,240));
}
input[type=checkbox]:not(old):checked + label > span:before{
  content     : '✓';
  display     : block;
  width       : 1em;
  color       : rgb(153,204,102);
  font-size   : 0.875em;
  line-height : 1em;
  text-align  : center;
  text-shadow : 0 0 0.0714em rgb(115,153,77);
  font-weight : bold;
}

/* Labels for checked inputs *
input[type="checkbox"] {
  color: yellow !important;
  background-color: yellow !important;
}

/* Radio element, when checked *
input[type="radio"]:checked {
  box-shadow: 0 0 0 3px orange;
}

/* Checkbox element, when checked *
input[type="checkbox"]:checked {
  box-shadow: 0 0 0 3px red;
    color: transparent !important;
    background-color: transparent !important;
    background: transparent !important;
}

/* Option elements, when selected *
option:checked {
  box-shadow: 0 0 0 3px lime;
  color: blue;
}

/* Logo */

#logo {
	position: absolute;
    top: 1%;
	width: 20%;
	height: 30px;
	background-image: url('../images/biite/Logo_Biite_1_orange_red_white.svg');
	background-size: contain;
	background-repeat: no-repeat;
}
#footer-logo {
	position: absolute;
	width: 15%;
	height: 150px;
	margin-top: 3%;
	background-image: url('../images/logo.png');
	background-size: contain;
	background-repeat: no-repeat;
}

/* Images */

img {
	height:auto;
	background-size:cover;
}

.handy img {
    display: block;
    margin: 0 auto;
    margin-bottom: 70px;
}

/* Icons */

i {
    position: absolute;
    width: 30px;
    height: 30px;
    /* filter: grayscale(); */	
}
/* i:hover {
    filter: none;
} */
i.fi-database{
    font-size: 3em;
}
.fa-eye{
    color: aqua !important;
}
.fa-eye-slash{
    color: red !important;
}

i.google {
    background: url(../images/google-plus.svg);
    background-size: cover;
}
i.twitter {
    background: url(../images/twitter.svg);
    background-size: cover;
}
i.linkedin {
    background: url(../images/linkedin.svg);
    background-size: cover;
}
i.facebook {
    background: url(../images/facebook.svg);
    background-size: cover;
}
i.youtube {
    background: url(../images/youtube.svg);
    background-size: cover;
}

.fa-desktop{
    color: aquamarine;
}
.fa-mobile-alt{
    color: rgb(0, 157, 255);
}
.fa-film{
    color: red;
}
.fa-play{
    color: deepskyblue;
}
.fa-btc{
    color: gold;
}
.fa-usd{
    color: gold;
}
.fa-euro-sign{
    color: gold;
}
.fa-globe{
    color: rgb(30, 218, 255);
}

/* Video */

video {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0 !important;
    right: 0;
    width: 100% !important;
    height: auto !important;
    z-index: -1;
}
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Header */

header {
    position: relative;
    margin: 0;
    padding: 0;
    height: auto;
    /* background-color: #333; */
}
#header-video{
    position: absolute;
    /* filter: brightness(30.2); */
    /* filter: saturate(2); */
    width: 100% !important;
    /* top: -75%; */
    /* margin-right: 25%; */
}
/* #header-video{
    position: absolute;
    top: 0;
    left: 0;
    float: left;
    z-index: 0;
    
    position: fixed;
    top: 50%;
    left: 50%;
    width: 100vw;
    height: 100vh;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translateX(-50%) translateY(-50%);
    background: url('//demosthenes.info/assets/images/polina.jpg') no-repeat;
    background-size: cover;
    transition: 1s opacity;
} */
@media(max-width:1000px){
    video{
        width: auto !important;
        height: 100vh !important;
    }
    /* h1,h2,h3,h4,h5,h6{
        letter-spacing: -12px !important;
    } */
    h1{
        font-size: 4em !important;
        letter-spacing: -12px !important;
        letter-spacing: -3px !important;
    }
    h2{
        font-size: 3em !important;
        letter-spacing: -8px !important;
        letter-spacing: -1px !important;
    }
    h3{
        font-size: 2em !important;
        letter-spacing: normal !important;
    }
    h3{
        font-size: 1em !important;
        letter-spacing: normal !important;
    }
    h4{
        font-size: 1em !important;
        letter-spacing: normal !important;
    }
    h5{
        font-size: 1em !important;
        letter-spacing: normal !important;
    }
    h6{
        font-size: 1em !important;
        letter-spacing: normal !important;
    }
    b{
        font-size: 1em !important;
        letter-spacing: normal !important;
    }
    p{
        font-size: 1em !important;
        letter-spacing: 0 !important;
    }
    /* #header-video{
        position: absolute;
        top: 0 !important;
        left: 0 !important;
        width: auto !important;
        height: 100vh !important;
        z-index: -100;
    }  */
}
#dc-icon{
    width: 69px;
}

/* Navigation */

.active{
    border-bottom: 2px solid aqua;
    /* background-color: rgba(46, 46, 46, 0.5); */
    /* min-height: 170px;
    padding: 50px; */
}
.active a{
    background: rgba(46, 46, 46, 0.5) !important;
    background-color: rgba(46, 46, 46, 0.5) !important;
    color: white !important;
   /*  padding: 27px !important; */
    /* min-height: 50px !important; */
}
@media(max-width:1000px){
    #menu li.active{
        background: orange !important;
        background-color: orange !important;
        border-bottom: 4px solid red;

        background: greenyellow !important;
        background-color: greenyellow !important;
        border-bottom: 4px solid rgb(238, 255, 0);
        
        background: #333 !important;
        background-color: #333 !important;
        border-bottom: 4px solid aqua;
    }
    #menu li.active a{
        background: transparent !important;
        background-color: transparent !important;
        /* color: #111 !important; */
        /* border-bottom: 4px solid rgb(255, 217, 0); */
    }
}


/* .nav-apps{
    min-height: 170px !important;
} */
/* .nav-apps a{
    background: aqua;

    background: aqua;
    background-color: aqua !important;
    color: #222 !important;

    background-color: rgba(46, 46, 46, 0.5) !important;
    color: white !important;

    padding: 27px !important;
} */
/* currently hided */

/* .nav-home{
    display: block !important;
}
.nav-darthcode{
    display: block !important;
}
.nav-reevice{
    display: none !important;
}
.nav-apps{
    display: block !important;
}
.nav-service{
    display: block !important;
}
.nav-social{
    display: none !important;
}
.nav-jobs{
    display: block !important;
}
.nav-webdesign{
    display: block !important;
}
.nav-vfx{
    display: block !important;
}
.nav-contact{
    display: block !important;
}
.nav-login{
    display: block !important;
} */

/* #menu {
	position: fixed;
    top: 0;
	left: 20%;
    width: auto;
	height: auto;
	padding-top: 1%;
    z-index: 1111111111 !important;
    background-color: mediumseagreen;
} */
#menu {
    display: flex;
	position: fixed;
    top: 0;
	left: 50px;
	left: 0;
	/* left: 10%; */
	right: 0;
    margin: 0;
    padding: 0;
    padding-top: 10px;
    width: calc(100% - 100px);
    width: calc(80% );
    width: calc(100% );
	height: auto;
    min-height: 50px;
    z-index: 111 !important;
    background-color: rgba(0, 0, 0, 0.8);
}
#menu li {
    margin: 0;
    padding: 0;
	/* display: inline; */
    font-size: 1em;
    color: white;
    width: auto;
    /* width: calc(100% / 12 - 1px) !important; */
    height: auto;
    max-height: 50px;
    /* min-height: 50px; */
    /*padding: 2em;
    background-color: transparent;
    color: white;
    text-transform: uppercase;
    font-size: 1em;
    font-weight: bold;*/
    /* background-color: rgb(37, 238, 144); */
    text-align: center;
}
#menu li:hover {
    /*background-color: white;
    color: #111;*/
    cursor: pointer;
}
/* #menu li:nth-child(2) {
    margin-left: 15%;
    margin-left: 100px;
} */
#menu a {
	text-decoration: none;
	transition: all 0.2s ease;
	padding: 2em;
    background-color: rgba(34, 34, 34, 0.062);
    background-color: transparent;
    color: white;
    text-transform: uppercase;
    font-size: 0.8em;
    font-weight: bold;
}
#menu a:hover {
    background-color: white;
    color: #111;
}
.nav-logo {
    line-height: 2em;
}
.nav-logo a {
    line-height: 2em;
}
.nav-logo img {
    /* padding-top: 20px; */
    line-height: 2em;
}
.nav-logo a:hover {
    background-color: transparent !important;
}
#action-menu{
    position: relative;
    /* float: right; */
    /* position: fixed;
    top: 0;
    right: 65px; */
    z-index: 100;
    width: auto;
    min-width: 20%;
    height: auto;
    min-height: 50px;
}
#action-menu button{
    position: relative;
    float: left;
    color: white;
    font-size: 16px;
    line-height: normal;
    cursor: pointer;
    width: auto;
    height: auto;
    min-height: 70px;
    min-width: 70px;
    padding: 0;
    margin: 0;
    margin-right: 10px;
    background-color: red;
    border: none;
    z-index: 100;
    cursor: pointer;
    text-align: center;
    line-height: 0;
}
#action-menu > button i{
    position: relative;
    /* line-height: 0.3em; */
}
#accountBtn:hover {
    color: mediumseagreen !important;
}

.nav-login{
    width: 100px;
    height: 100px;
}
.nav-login i{
    color: gray;
    transition: .3s all;
}
.nav-login button{
    width: 100px;
    height: 50px;
    background-color: #111;
    border: 1px solid #222;
    border-bottom: 4px solid #ff00aa;
    transition: .3s all;
}
.nav-login button:hover{
    background-color: #222;
    border-bottom: 4px solid #cf02eb;
}
.nav-login button:hover i{
    color: white !important;
}
#loginBtn {
    position: fixed;
    top: 10px;
    right: 10px;
    display: block;
    color: white;
    font-size: 2.5em;
    font-size: 2.0em;
    line-height: normal;
    cursor: pointer;
    width: auto;
    height: auto;
    min-height: 40px;
    min-width: 40px;
    padding: 0;
    margin: 0;
    background-color: transparent;
    border: none;
    z-index: 100;
}
#loginBtn i{
    position: relative;
}
#loginBtn:hover {
    color: aqua !important;
}
#toggleMobileMenu {
    display:none;
    position: fixed !important;
    left: 5px;
    right: 5px;
    top: 5px;
    width: calc(100% - 10px); 
    height: 40px; 
    text-align: center;
    z-index: 10000000000000000; 
    opacity: 0.7;
    font-size: 1em;
    line-height: 2em;
}
#menuBtn,#mobile-menu-btn {
    display: none;
    color: white;
    position: fixed;
    top: 0;
    right: 15px;
    z-index: 10;
    font-size: 2.5em;
    line-height: normal;
    cursor: pointer;
    width: auto;
    height: auto;
    min-height: 40px;
    min-width: 40px;
    padding: 0;
    margin: 0;
    background-color: transparent;
    border: none;
    z-index: 1000 !important;
}
#menuBtn i,#mobile-menu-btn i,#toggleMobileMenu i{
    position: relative;
}
#menuBtn:hover,#mobile-menu-btn:hover {
    color: orangered !important;
}
/* 1650px 1400px */
@media (max-width:1300px){
    #menuBtn,#mobile-menu-btn,#toggleMobileMenu {
        display:block !important;
    }
    #menu {
        display:none;
        position: fixed;
        width: 90% !important;
        height: auto;
        min-height: 85vh;
        z-index: 9;
        left: 5%;
        background-color: rgba(0,0,0,0.95);
        /* background-color: red !important; */
        margin-top: 30px;
        border: 4px solid rgba(0,0,0,0.97);
        
        /*position: relative;
        margin-left: auto;
        margin-right: auto;*/
    }
    #menu li:first-child a{
        background-color: transparent !important;
    }
    #menu li{
        display: block;
        width: 100% !important;
        height: 70px;
        height: auto;
        height: 120px;
        margin-bottom: 2px;
        /* background-color: blue; */
        /* line-height: 0.7em; */
    }
    #menu > li a{
        display: block;
        width: 90% !important;
        width: 100% !important;
        height: 70px;
        height: auto;
        padding: 0;
        padding-top: 10px;
        padding-bottom: 10px;
        text-align: center;
        line-height: 5em;
        line-height: 2em;
        background-color: rgba(255,255,255,0.3);
        background-color: rgba(65, 65, 65, 0.3);
    }
    #menu li:nth-child(2) {
        margin: 0;
    }
}
@media (min-width:1650px){
    #menu {
        display:flex !important;
    }
}
.scrolledMenu{
    width: 100% !important;
    background-color: rgba(0,0,0,0.8) !important;
    padding-bottom: 25px;
}
/* .scrolledMenu li{
}
.scrolledMenu > li a{
}
.scrolledMenu a{
} */

/* Menu / Selections */

.box-menu{
    position: relative;
    width: 60%;
    height: auto;
    min-height: 100px;
    /* min-height: 70px; */
    margin: 0 auto;
    /* background-color: aqua; */
    display: flex;
    z-index: 1000 !important;
}
.box-menu li{
    position: relative;
    float: left;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    width: calc(100% / 3 - 10px);
    height: auto;
    min-height: 100px;
    /* min-height: 70px; */
    margin-right: 4px;
    background-color: rgba(17, 17, 17, 0.5);
    cursor: pointer;
    text-align: center;
    line-height: 6em;
    line-height: 3em;
    line-height: 5em;
    padding: 10px;
    z-index: 1000 !important;
    border: 1px solid #111;
    border-radius: 3px;
    transition: .2s all ease;
}
.box-menu i{
    position: relative;
    font-size: 2em;
    /* line-height: 2em; */
    margin-right: 10px;
    top: 5px;
    left: -5px;
}
.box-menu li:hover {
    /* color: mediumseagreen !important; */
    background-color: #333;
    border: 1px solid aqua;
}
.box-menu li.active{
    /* background-color: deepskyblue !important; */
    border-bottom: 1px solid aqua;
    background-color: #222;
    /* color: white; */
}
@media(max-width:1000px){
    /* #app-menu-sel{
        display: none;
    }
    #app-menu-sel-mobile{
        display: block;
    } */
    .box-menu{
        position: relative;
        /* left: 5%; */
        width: 80%;
        max-width: 80% !important;
        /* left: 0;
        width: 100%; */
        /* background-color: red !important; */
        margin: 0 auto !important;
        padding: 0 !important;
        /* margin: 0 !important;
        padding: 0 !important; */
        height: auto;
        min-height: auto;
        /* text-align: center; */
    }
    .box-menu li{
        /* width: calc(100% / 3 - 5px) !important; */
        height: auto;
        min-height: auto;
        line-height: normal;
        /* font-size: 1em; */
        margin: 0 !important;
        padding: 5px !important;
        text-align: center;
        /* margin: 0;
        padding: 0; */
        /* background-color: red !important; */
        /* font-size: 1em; */
    }
    .box-menu i{
        font-size: 1em;
        /* font-size: 3em; */
        position: relative;
        /* float: left; */
        /* margin: 0 !important;
        padding: 0 !important; */
        margin-left: 17px;
        margin-bottom: 10px;
    }
    #we-love-js{
        top: 20px !important;
        right: 20px !important;
        width: 80px !important;
        height: 90px;
    }
    #mobile-apps .product{
        min-height: 900px;
    }
    .mobile-infos{
        width: 100% !important;
        height: auto !important;
    }
    .mobile-preview{
        width: 100% !important;
        height: auto !important;
    }
    .mobile-preview img{
        width: 70% !important;
        height: auto !important;
        object-fit: cover !important;
    }
    #header-video{
        width: auto;
        height: 100%;
        top: 30%;
    }
    #audio-content{
        position: relative;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: auto;
        margin: 0 !important;
        padding: 0 !important;
        left: 0 !important;
    }
    #audio-content .table{
        position: relative !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: auto;
        margin: 0 !important;
        padding: 0 !important;
        left: 0 !important;
    }
}
/* box menu specific */
#downloadsMenu .box-menu li{
    width: 50%;
    max-width: 50%;
}

/* Container */

#main {
    position: relative;
	width: 100vw;
	height: auto;
    min-height: 800px;
    margin: 0;
    padding: 0;
    top: 0;
}

/* Footer */

footer {
    background: transparent;
    text-align: center;
}
.parallelogram {
    position: absolute;
    left: -50px;
    bottom: 0px;
    width: 550px;
	height: 170px;
	transform: skew(20deg);
	-webkit-transform: skew(20deg);
	   -moz-transform: skew(20deg);
	     -o-transform: skew(20deg);
	background: white;
    
}
.parallelogramR {
    position: absolute;
    right: -50px;
    bottom: 0;
    width: 550px;
	height: 70px;
	transform: skew(-20deg);
	-webkit-transform: skew(-20deg);
	   -moz-transform: skew(-20deg);
	     -o-transform: skew(-20deg);
	background: white;
    
}
footer > #footer-menu li {
	display:block;
    margin-bottom: 5%;
}
footer > #footer-menu a {
	text-decoration: none;
    font-weight: 100;
}
footer h4 {
    font-weight: 400;
}
.first {
	margin-left: 10%; 
}
@media(max-width:1000px){
    .first {
        margin-left: 0%; 
    }
}
footer > ul {
	float: left; 
}
#footer-menu {
	position: relative;
	width: 20%;
	height: auto;
}
#footer-social {
    display: none;
    text-align: center;
	position: relative;
	width: 35%;
	height: auto;
    min-height: 50px;
    
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 205px;
    z-index: 10;
    color: white;
}
#footer-social li {
    width: 40px;
    height: 40px;
    float: left;
    margin-right: 1.5%;
}
#footer-social i {
    width: 40px;
    height: 40px;
    font-size: 2em;
    color: whitesmoke;
}
/* #footer-social > li a {
} */


.facebook{
    display: block;
}
.googleplus{
    display: block;
}
.twitter{
    display: block;
}
.youtube{
    display: none;
}
.linkedin{
    display: none;
}

.fa-twitter:hover{
    color: deepskyblue !important;
}
.fa-facebook:hover{
    color: dodgerblue !important;
}
.fa-snapchat:hover{
    color: yellow !important;
}
.fa-linkedin:hover{
    color: dodgerblue !important;
}
.fa-youtube:hover{
    color: red !important;
}
.fa-google:hover{
    color: goldenrod !important;
}

/* diverse */

#welcome {
    line-height: 3.5em;
    height: auto;
    /* margin-left: 5%;
    margin-top: 7%;
    margin-top: 11%;
    margin-top: 5%; */
    margin: 30px;
    margin-left: 80px;
    margin-top: 80px;
    /* background-color: aqua; */
}
#welcome p {
    color: gainsboro;
    font-size: 1.3em;
}
#welcome h1 {
    color: white;
    font-size: 6em;
    /* font-size: 4em; */
}
#appsHeader {
    line-height: 3.5em;
    height: auto;
    margin-left: 5%;
    margin-top: 7%;
    margin-top: 4%;
    height: auto;
    min-height: 100px;
}
#appsHeader p {
    color: gainsboro;
    font-size: 1.3em;
}
#appsHeader h1 {
    color: white;
    font-size: 6em;
    font-size: 5em;
    text-transform: uppercase;
    line-height: 0.9em;
    letter-spacing: -17px;
    letter-spacing: -12px !important;
}
#appsHeader h3,#appsHeader h5 {
    color: white;
    font-size: 1.5em;
    text-transform: none;
    letter-spacing: -2px;
    font-weight: 400;
    font-style: italic;
    color: gray;
}
#contactMail{
    position: relative;
    z-index: 10;
    margin-left: 50px;
}
#contactMail i{
    position: relative;
    color: whitesmoke;
}

/* Posts */

.section {
    position: relative;
}
/* #section1{
} */
#section2{
    padding-bottom: 5%;
}
/* #section3{
    
} */
#section4{
    padding-left: 5%;
    padding-right: 5%;
    height: 1300px;
}
#section4 h2{
    color: white !important;
}
#section4 a{
    color: white !important;
}
#section4 a:hover{
    color: orangered !important;
}
#section4 img{
    width: 40%;
}
#section4 .app-single{
    color: white !important;
    width: 40%;
    margin-right: 5%;
    margin-bottom: 4%;
    float: left;
}
@media(max-width:1100px){
    #section4 .app-single{
        width: 90%;
    }
}

/* Section - Content */

.device-image{
    width: 40%;
    height: 300px;
    float: left;
}
#section4 .app-metadata{
    width: 100%;
    height: 270px;
}
/* #section4 .app-metadata a{
} */

/* Download */

.download {
    position: relative;
    float: left;
    height: auto;
    /* max-height: 300px; */
	z-index: 9 !important;
    border-radius: 5px;
    /* font-size: 1em; */
    text-align: left;
    text-align: center;
    /* background-color: aliceblue; */
    /* padding: 10px; */
    /* margin: 10px; */
}
.download:hover {
    background-color: rgba(51, 51, 51, 0.2);
    color: aqua !important;
}
.download a {
    cursor: pointer;
}
.download a:hover {
    color: aqua !important;
}
.download i {
    position: relative;
}

/* Product */

.product {
    position: relative;
    float: left;
    /* min-height: 450px;
    min-height: 700px;
    min-height: 400px; */
    height: auto;
    max-height: 300px;
	z-index: 8 !important;
    /* padding: 10px; */
    border-radius: 5px;
    /* margin: 40px !important; */
    transition: 1s all ease;
}
.product:hover {
    background-color: rgba(51, 51, 51, 0.2);
    /* border:2px solid aqua */
}
.page-soon{
    display: none;
    position: absolute;
    right: 50px;
    right: 0;
    margin-top: -30px;
    margin-top: 0;
    color: goldenrod;
    color: rgb(88, 88, 88);
}
#companies .product{
    max-height: 500px;
}
#artists .product{
    height: 550px;
    max-height: 550px;
}
#audios .product{
    height: 550px;
    max-height: 700px;
}
#home .product{
    height: 400px;
    max-height: 700px;
}
@media(min-width:1500px){
    #audios .product.w4{
        width: 33.33% !important;
    }       
}
@media(max-width:1500px){
    #audios .product.w4{
        width: 50% !important;
    }       
}
@media(max-width:1000px){
    /* #audios{
        height: 4400px;
    }   */ 
    #audios .product.w4{
        width: 100% !important;
    }       
}
/* @media screen and(max-width:1000) {
    #audios .product.w4{
        width: 50% !important;
    }    
} */
#services .product{
    height: 450px;
    max-height: 700px;
}
#mobile-apps .product{
    height: 500px;
    max-height: 700px;
    margin-bottom: 50px;
}
.product h1 {
    font-size: 3.1em;
    font-size: 2.5em !important;
    font-weight: 400;
    font-weight: 100;
    letter-spacing: 5px;
    color: whitesmoke;
    transition: .132s all ease-in;
    
    
    font-weight: bold !important;
    letter-spacing: -5px;
}
.product h2 {
    transition: .132s all ease-in;
}
.product i {
    position: relative;
    font-size: 4em;
    /* font-size: 1em; */
    width: 100%;;
    height: 70px;
    color: white;
    /* float: left; */
}
.product img{
    max-width: 200px !important;
}
/* .product a {
    position: relative;
    float: right;
    width: 200px !important;
    max-width: 200px !important;
} */
.product a img {
    object-fit: contain !important;
    max-width: 300px !important;
}
.product p {
    width: calc(100% - 20px);
    line-height: 1.32em;
    padding: 10px;
}
.product h1:hover {
    /* font-size: 2.4em !important; */
    font-weight: bold !important;
    letter-spacing: -5px;
    font-weight: 200 !important;
    letter-spacing: 5px !important;
}
.product h2:hover {
    font-weight: 200 !important;
    letter-spacing: 5px !important;
}

.products {
    margin-left: auto;margin-right: auto; margin-top: 50px; height: 1700px;
}

/* Product Page (detail) */

/* #product{
    display: flex;
} */
#product img{
    max-width: unset !important;
}
#product-infos h1{
    letter-spacing: 5px;
    /* font-size: 3em; */
    font-weight: 400 !important;
    color: grey;
}
#product-infos h3{
    letter-spacing: -4px;
    font-size: 3em;
}
#product-infos p{
    letter-spacing: 2px;
    font-size: 1.2em;
    font-weight: 500 !important;
    color: rgb(206, 206, 206);
    line-height: 1.7em !important;
}


/* #product_revice {
} */
#product_darthcode {
    margin-left: 15%;
    width: 50%;
}
#product-last {
    float: none;
    clear: both;
}
/* @media(max-width:1500px){
    .product{
        width: calc(50% - 20px) !important;
        padding: 10px !important;
    }
    .product img{
        max-width: 100% !important;
    }
} */
@media(max-width:1000px){
    .product{
        width: calc(100% - 20px) !important;
        padding: 10px !important;
    }
    .product img{
        max-width: 100% !important;
    }
    #appsHeader {
        margin-top: 8%;
    }
    .disclaimer{
        position: relative;
        width: 80% !important;
        margin: 0 auto !important;
    }
}



/* @media(min-width:1500px){
    .product{
        width: calc(33.33% - 5%) !important;
    }       
}
@media(max-width:1500px){
    .product{
        width: calc(50% - 5%) !important;
    }       
}
@media(max-width:1000px){
    .product{
        width: calc(100% - 5%) !important;
    }       
} */


/* Artist */

#artist{
    /* width: 100% !important; */
    height: auto;
    min-height: 2200px;
}
#artist img{
    max-width: 100% !important;
    margin: 0;
    padding: 0;
}
#artist table{
    position: relative;
    width: 100% !important;
    max-width: 100% !important;
    min-width: unset;
    left: 0;
    margin: 0;
    padding: 0;
}
@media(max-width:1000px){
    #artist-image{
        /* width: 100% !important;
        max-width: 100% !important; */
        min-height: 500px !important;

        /* height: auto !important;
        min-height: auto !important; */
    }
    .slogan{
        font-size: 1.5em !important;
    }  
    #artist-infos{
        height: auto !important;
        min-height: auto !important;
    } 
}
#artist-infos h1{
    letter-spacing: 5px;
    font-weight: 400 !important;
    color: grey;
}
#artist-infos h3{
    letter-spacing: -4px;
    font-size: 3em;
}
#artist-infos p{
    letter-spacing: 2px;
    letter-spacing: .3px;
    font-size: 1.2em;
    font-weight: 500 !important;
    color: rgb(206, 206, 206);
    color: rgb(134, 134, 134);
    line-height: 1.7em !important;
}
#artist-visuals{
    width: 90%;
    min-width: 90%;
    height: auto !important;
    min-height: 600px !important;
    max-height: auto !important;
    margin: 0;
    padding: 0;
}
.visuals{
    width: 100%;
    min-width: 100%;
    /* height: 1000px !important;
    min-height: 1000px !important;
    max-height: 1000px !important; */
    margin: 0;
    padding: 0;
}
.visuals li{
    position: relative;
    width: 50%;
    float: left;
    margin: 0;
    padding: 0;
}



.linkText {
    position: relative;
    width: 90%;
}
.link {
    position: absolute;
    width: 10%;
    float: left;
}
.link#link1 {
    position: absolute;
    left: 0%;
}
.link#link2 {
    position: absolute;
    left: 30%;
}
.link#link3 {
    position: absolute;
    left: 60%;
}
.link img {
    width: 50%;
    margin-left: 23%;
}

.link h1 {
    text-align: center;
}
.link p {
    text-align: center;
}

/* .icon{
} */

.features_detail li{
    width: 38%;
    height: 300px;
    float: left;
    margin-right: 2%;
    padding: 5%;
}
.features_detail i{
    width: 38%;
    position: relative;
    font-size: 3em;
}
.features{
    text-align: center;
    position: relative;
    height: auto;
    
    color: white;
}
.features h5{
    font-weight: 400;
    text-transform: uppercase;
    
    color: white;
}
.features h1{    
    color: white;
}

/*
.features_detail > ul {
  margin: 0;
  padding: 0;
}

.features_detail li:nth-child(2n) {
  border-right: 0 none;
  padding-left: 18px;
  text-align: left;
}

.features_detail li:nth-last-child(2) {
  border-bottom: 0 none;
}
.features_detail li:nth-child(2n) {
  border-right: 0 none;
  padding-left: 18px;
  text-align: left;
}
.features_detail li:last-child {
  border-bottom: 0 none;
}

.features_detail li {
  border-bottom: 1px solid #bfbfbf;
  border-right: 1px solid #bfbfbf;
  display: inline-block;
  font-size: 13px;
  font-weight: 300;
  line-height: 20px;
  list-style: outside none none;
  margin-bottom: 20px;
  padding: 10px 20px 30px 0;
  text-align: right;
  width: 40%;
  color:#555454;
}

.features_detail i {
  font-size: 28px;
  color:#f6b20e;
}

.features_detail h5 {
  color: hsl(0, 1%, 33%);
  font-weight: 400;
  line-height: 47px;
}

.features_img {
  text-align: right;
}

.features_detail {
  margin-top: 100px;
}
*/

/* -------------------------- STANDARDS ----------------------- */

/* Boxes */

/* .box {
} */

/* Sizes 

.w100 {
    width: 100%;
}
.w90 {
    width: 90%;
}
.w80 {
    width: 80%;
}
.w70 {
    width: 70%;
}
.w60 {
    width: 60%;
}
.w50 {
    width: 50%;
}
.w40 {
    width: 40%;
}
.w30 {
    width: 30%;
}
.w20 {
    width: 20%;
}
.w10 {
    width: 10%;
}
.w0 {
    width: 0%;
}

.w1000px {
    width: 1000px;
}
.w900px {
    width: 900px;
}
.w800px {
    width: 800px;
}
.w700px {
    width: 700px;
}
.w600px {
    width: 600px;
}
.w500px {
    width: 500px;
}
.w400px {
    width: 400px;
}
.w300px {
    width: 300px;
}
.w250px {
    width: 250px;
}
.w200px {
    width: 200px;
}
.w150px {
    width: 150px;
}
.w100px {
    width: 100px;
}
.w90px {
    width: 90px;
}
.w80px {
    width: 80px;
}
.w70px {
    width: 70px;
}
.w60px {
    width: 60px;
}
.w50px {
    width: 50px;
}
.w40px {
    width: 40px;
}
.w30px {
    width: 30px;
}
.w20px {
    width: 20px;
}
.w10px {
    width: 10px;
}
.w0px {
    width: 0px;
}

.hauto {
    height: auto;
}
.h100 {
    height: 100%;
}
.h90 {
    height: 90%;
}
.h80 {
    height: 80%;
}
.h70 {
    height: 70%;
}
.h60 {
    height: 60%;
}
.h50 {
    height: 50%;
}
.h40 {
    height: 40%;
}
.h30 {
    height: 30%;
}
.h20 {
    height: 20%;
}
.h10 {
    height: 10%;
}
.h0 {
    height: 0%;
}

.h1000px {
    height: 1000px;
}
.h900px {
    height: 900px;
}
.h800px {
    height: 800px;
}
.h700px {
    height: 700px;
}
.h600px {
    height: 600px;
}
.h500px {
    height: 500px;
}
.h400px {
    height: 400px;
}
.h300px {
    height: 300px;
}
.h250px {
    height: 250px;
}
.h200px {
    height: 200px;
}
.h150px {
    height: 150px;
}
.h100px {
    height: 100px;
}
.h90px {
    height: 90px;
}
.h80px {
    height: 80px;
}
.h70px {
    height: 70px;
}
.h60px {
    height: 60px;
}
.h50px {
    height: 50px;
}
.h40px {
    height: 40px;
}
.h30px {
    height: 30px;
}
.h20px {
    height: 20px;
}
.h10px {
    height: 10px;
}
.h0px {
    height: 0px;
}

.ml5 {
    margin-left: 5%;
}
.ml10 {
    margin-left: 10%;
}
.ml15 {
    margin-left: 15%;
}

/* colors

.white {
    color: white;
}
.orange {
    color: orange;
}
.crimson {
    color: crimson;
}

/* columns */


.column3{
    /* margin-top: -4%;
    padding: 5%; */
    padding-left: 5%;
    padding-right: 5%;
    margin-bottom: 0;
    width: calc(100% - 10%);
    height: auto;
    min-height: 500px;
    color: white;
    font-weight: 1em;
}
.column3 div{
    margin: 5%;
    margin: 2.5%;
    width: calc(100% / 3 - 5%);
    color: white;
    float: left !important;
}
.column3#link div{
	padding: 0%;
	padding-left: 10%;
	padding-right: 10%;
	padding-top: 3%;
}
.column3 > div img{
	padding: 2%;
}
.infront{
    position: relative;
	z-index: 9 !important; 
}
/*.column3 a{
    position: relative;
	z-index: 99999 !important;
    #width: 100%;
    #height: 50px;;
}
.column3 h1{
    position: relative;
	z-index: 99999 !important;
    #width: 100%;
    #height: 50px;;
}*/


.column1xxx{
-webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
	height: auto;
}
.column3xxx{
-webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
	height: auto;
    color: white;
}
@media (max-width:1100px){
	.column3xxx{
	-webkit-column-count: 1 !important;
    -moz-column-count: 1 !important;
    column-count: 1 !important;
}}



.column33{
-webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
	height: auto;
}
@media (max-width:1100px){
	.column33{
	-webkit-column-count: 1 !important;
    -moz-column-count: 1 !important;
    column-count: 1 !important;
	}
	.col-4{
	-webkit-column-count: 1 !important;
    -moz-column-count: 1 !important;
    column-count: 1 !important;
    width: 100%;
	}
}
@media (max-width:768px){
	.features_detail li{
	-webkit-column-count: 1 !important;
    -moz-column-count: 1 !important;
    column-count: 1 !important;
    width: 100%;
	}
}
/* .column33 div{
}
.column33#link div{
} */
.column33 > div img{
    width: 95%;
    max-width: 300px;
    margin-left: 15%;
	padding: 10%;
}
.column33 > div:hover img{
    width: 16em !important;
    margin-left: 13% !important;
    transform: rotate(30deg);
}
.column33 > div img{
    position: relative;
    transition: 0.1s all ease;
    width: 14em !important;
}
.column33 > div > p{
    text-align: center;
}

/* buttons */

.btn {
    width: auto;
    padding: 2%;
    /* background-color: deepskyblue; */
    border-radius: 5px;
}
a.btn:hover {
    color: #000 !important;
}
.btn i {
    width: 3%;
}
.btn span {
    padding-left: 7%;
}
.ios {
    background-image: url(../images/icons/Ultimate-Social/app_store.svg);
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: -5px;
}
.android {
    background-image: url(../images/icons/Ultimate-Social/google_play.svg);
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: -5px;
}
.blackberry {
    background-image: url(../images/icons/Ultimate-Social/amazon.svg);
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: -5px;
}
.windowsphone {
    background-image: url(../images/Windows_Store_Logo.svg);
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: -5px;
}
.kindle {
    background-image: url(../images/icons/Ultimate-Social/amazon.svg);
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: -5px;
}
.btn.primary{
    background-color: orange;
}
.btn.primary span{
    font-weight: 100 !important;
}
.btn.primary:hover{
    color: white !important;
    background-color: #222;
}
.btn.secondary{
    background-color: orangered;
}
.btn.secondary span{
    font-weight: 100 !important;
}
.btn.secondary:hover{
    color: white !important;
    background-color: #222;
}
span:hover{
    color: white !important;
}
.btn.third{
    background-color: crimson;
}
.btn.transparent{
    background-color: transparent;
}
/* @media(min-width:768px){
    .btn, .btn.primary, .btn.secondary, .btn.third, .btn.transparent{
    }
} */
.btn-download{
    position: relative;
    background-color: rgb(12, 157, 109) !important;
    font-size: 2em;
    width: 100%;
    height: auto;
    /* min-height: 80px; */
    font-weight: 500;
    /* text-align: center; */
    float: none;
    clear: both;
    line-height: 1.7em;
}
.btn-download:hover{
    background-color: aqua !important;
}
.btn-download i{
    position: relative;
    left: 0;
    margin-right: 20px;
    /* float: none;
    clear: both;
    text-align: left; */
    float: left;
    font-size: 1.8em;
}
.btn-flash{
    position: relative;
    background-color: deeppink !important;
    font-size: 2em;
    width: 100%;
    height: auto;
    font-weight: 500;
    float: none;
    clear: both;
    line-height: 1.7em;
}
.btn-flash:hover{
    background-color: red !important;
}
.btn-flash i{
    position: relative;
    left: 0;
    margin-right: 20px;
    float: left;
    font-size: 1.8em;
}

/* social */

.sharetastic{
    display: none !important;
    position: absolute;
    right: 5%;
    top: 3%;
}

#share{
    display: none !important;
    position: fixed;
    right: 1%;
    bottom: 0%;
    z-index: 9;
}
.jssocials-share a{
    font-size: 1em;
}
.jssocials-share i{
    font-size: 1em;
}
.jssocials-share span{
    font-size: 1em;
    padding-left: 65px;
}

/* subscribe */

.subscribe-ul li {
    width: 15%;
    margin-right: 5%;
    float: left;
    padding: 25px;
    height: auto;
    color: white;
}
.subscribe-ul > li h4{
    font-weight: 100;
}
@media(max-width:1100px){
 .subscribe-ul li {
    width: 90%;
}}
.subscribe-ul li:first-child {
    margin-left: 15%;
}
.subscribe-ul > li i {
    position: relative;
    width: 200px;
    height: 200px;
    font-size: 10em;
    padding: 1%;
    
}
.subscribe-ul {
    float: none;
    clear: both;
    height: 400px;
    text-align: center;
}
.subscribe {
    text-align: center;
}
.subscribe input {
    height: 50px;
    border: none;
    border-radius: 3px;
    padding-left: 35px;
    font-size: 1em;
}
.subscribe button {
    height: 55px;
    border: none;
    border-radius: 3px;
    margin-left: -10px;
    margin-top: 2px;
    padding-left: 35px;
    padding-right: 35px;
}
#newsletterBtn{
    transition: .3s all ease;
}
#newsletterBtn:hover{
    background-color: lightgrey;
}
.dc-icon {
    position: relative;
    width: 150px;
    height: 150px;
    background: url(../images/round-dc-icon.svg);
    background-image: url(../images/round-dc-icon.svg);
    color: white !important;
    font-size: 3em;
    background-position: top left;
    background-repeat: no-repeat;
    background-size: cover;
}
.dc-icon-img {
    position: relative;
    width: 60px;
    height: 60px;
    padding: 0;
    margin: 0;
    line-height: 0;
}
.impress{
    position: relative;
    color: white;
    margin-top: 100px;
    margin-bottom: 100px;
    z-index: 10;
}
.impress h1{
    color: white;
}
.impress b{
    font-style: normal;
}
.sources{
    margin-bottom: 50px;
}
.sources a{
    color: white;
    font-weight: 100;
    font-size: 0.9em;
    color: lightgray;
}
.sources a:hover{
    color: white;
}
.sources p{
    line-height: 0.5em;
}
.disclaimer{
    position: relative;
    color: white;
    margin-top: 100px;
    margin-bottom: 100px;
    bottom: 50px;
    z-index: 10;
    
    position: relative; width: auto; text-align: center;margin-left: auto;margin-right: auto; z-index: 10 !important;
}
.disclaimer h1{
    color: white;
}
.disclaimer a{
    color: white;
    font-weight: 600;
}
.disclaimer a:hover {
    color: gold;
    font-weight: 600;
}
.disclaimer p{
    font-size: 1em;
    font-weight: 500;
}

/* Buttons */

.btn{
    color: white;
    background-color: transparent;
    /* background-color: whitesmoke; */
    border-color: orangered;
    /* font-size: 1.2em;
    padding: 15px;
    padding-left: 25px;
    padding-right: 25px; */
    cursor: pointer;
    transition: 1s all ease;
    border: 1px solid transparent;
}
.btn:hover {
    color: #222;
    /* background-color: mediumaquamarine; */
    background-color: whitesmoke;
    border-color: rgb(134, 134, 134);
}
.btn i{
    position: relative;
    margin-right: 3px;
}

/* Animation */

#particles-js{
    position: absolute !important;
    width: 100vw;
    height: 100vh;
    z-index: 1 !important;
}
#particles-dc-js{
    position: fixed !important;
    width: 100vw;
    height: 100vh;
    z-index: 1 !important;
}
a.storelinks{
    display: none;
}


/* notification */

.notification{
    position: fixed;
    min-width: 15%;
    width: auto;
    width: 25%;
    height: auto;
    top: 16%;
    left: 35%;
    background-color: #222;
    background-color: rgba(50,50,50,0.8);
    color: white;
    padding: 20px;
    border: 2px solid orange;
    border: 2px solid grey;
    border-radius: 5px;
    text-align: center;
    z-index: 1000000000000000000000000000;
}
.notification.long{
    width: 70%;
    top: 35%;
    height: auto;
    max-height: 200px;
    left: 12.5%;
    background-color: rgba(30,30,30,0.9);
}
.notification.long button{
    width: 85%;
}
.notification h3{
    width: 100%;
    width: auto;
    height: auto;
    color: white !important;
}
.notification p{
    width: 100%;
    width: auto;
    height: auto;
    color: white !important;
    font-weight: bold;
}
.notification img{
    width: 10%;
    height: auto;
    float: right;
}
.notification i{
    font-size: 1.5em;
    float: left;
    transform: rotate(25deg);
    color: whitesmoke;
}



/*input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button
{
  -webkit-appearance: none;
  margin: 0;
}

input[type=number]
{
  -moz-appearance: textfield;
}*/


/* contact */

/* ORG! */
/* #mail{
    height: auto;
    text-align: center;
}
#mail h2{
    text-align: center;
    color: white;
    padding: 0;
    margin: 0;
    letter-spacing: -5px;
}
#mail button{
    width: auto;
    padding: 30px;
    border-radius: 5px;
    max-width: 330px;
    background-color: mediumaquamarine;
    background-color: whitesmoke;
    background-color: rgb(60, 60, 60);
    height: auto;
    border: 4px solid deepskyblue;
    border: 2px solid #444;
    line-height: 1em;
}
#mail button:hover{
    background-color: whitesmoke;
    background-color: lightgray;
    background-color: #222;
    border: 2px solid #111;
}
#mail button i{
    font-size: 5em;
    font-size: 12em;
    line-height: 0.6em;
    filter: none;
    color: rgb(27, 27, 27);
}
#mail button:hover i{
    color: white;
    color: aquamarine;
}
#mail button img{
    width:auto;
    height: 80%;
} */

#mail{
    height: auto;
    text-align: center;
    height: auto;
    /* min-height: 500px; */
}
#mail h2{
    text-align: center;
    color: white;
    padding: 0;
    margin: 0;
    letter-spacing: -5px;
}
#mail button{
    width: auto;
    padding: 30px;
    border-radius: 5px;
    max-width: 330px;
    background-color: rgb(37, 37, 37);
    height: auto;
    border: 2px solid #111;
    line-height: 1em;
}
#mail button:hover{
    background-color: rgb(60, 60, 60);
    border: 2px solid #111;
}
#mail button i{
    font-size: 5em;
    font-size: 12em;
    line-height: 0.6em;
    filter: none;
    color: aquamarine;
}
#mail button:hover i{
    color: aqua;
}
#mail button img{
    width:auto;
    height: 80%;
}


/* User */

.user-menu{
    width: 100%;
    height: auto;
    min-height: 130px;
    margin: 0;
    padding:0;
}
.user-menu li{
    margin: 0;
    padding:0;
    font-size: 1em;
    width: calc(100% / 4 - 24px);
    height: auto;
    min-height: 70px;
    min-height: 50px;
    color: white;
    float: left;
    text-align: center;
    font-weight: bold;
    line-height: 4em;
    line-height: 1em;
    cursor: pointer;
    transition: .2s all ease-in;
    padding: 10px;
    /* margin-right: 5px; */
    border-radius: 7.5px;
    background-color: rgba(66, 66, 66, 0.301);
    border:2px solid rgb(41, 41, 41);
}
.user-menu li:hover{
    background-color: white;
    color: #222;
}
.user-menu li:hover i{
    color: #222;
}
.user-menu > li i{
    font-size: 3em;
}

/* Animation */

.blink {
    /* animation: blink-animation .7s steps(5, start) infinite;
    -webkit-animation: blink-animation .7s steps(5, start) infinite; */
    animation: blink-animation .7s steps(5, start) infinite;
    -webkit-animation: blink-animation .7s steps(5, start) infinite;
}
@keyframes blink-animation {
    to {
        background: rgb(44, 44, 44);
    }
}
@-webkit-keyframes blink-animation {
    to {
        background: rgb(44, 44, 44);
    }
}
@keyframes blink {
    50% {
      /* opacity: 0.3; */
      background: rgba(42, 42, 42, 0.3);
    }
}
@-webkit-keyframes blink {
    50% {
        /* opacity: 0.3; */
      background: rgba(42, 42, 42, 0.3);
    }
}
.blinker {
    animation: blink 1s infinite;
    -webkit-animation: blink 1s infinite;
}

@keyframes smoothblink {
    50% {
      background: rgba(42, 42, 42, 1);
    }
}
@-webkit-keyframes smoothblink {
    50% {
        background: rgba(42, 42, 42, 1);
    }
}
.smooth-blinker {
    animation: blink 100s infinite;
    -webkit-animation: blink 100s infinite;
}

/* Audio Player */

#player-title{
    position: fixed;
    bottom: 40px;
    left: 10px;
    width: auto;
    height: auto;
    padding: 5px;
    font-style: italic;
    color: aquamarine;
    z-index: 1000;
    background-color: rgba(0, 0, 0, 0.8);
}

@media (max-width:1000px){
    #player{
        left: 0 !important;
        width: 100% !important;
    }
}

#playlist{
    z-index: 100;
    display: block;
    background-color: #333;
    position: fixed;
    left: 0;
    bottom: 0;
    width: auto;
}
#playlist a{
    margin: 5px;
}

/* Artists */

.btn-audio{
    /* display: none; */
    width: auto;
    min-width: auto;
    max-width: auto;
    height: auto;
    background-color: #222;
    border: 1px solid #333;
    color: deepskyblue;
    padding: 5px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 10%;
    font-size: 1em;
    font-weight: 500;
}
.btn-audio:hover{
    opacity: 1 !important;
    background-color: #222;
    border: 1px solid aqua;
    color: white;    
}
/* a.btn-audio{
    display: none;
} */
.soundcloud{
    color: rgb(255, 140, 0);
}
.spotify{
    color: rgb(2, 169, 38);
}
.facebook{
    color: royalblue;
}
.note{
    color: rgb(99, 99, 99);
    color: red;
    font-size: 0.75em;
    letter-spacing: 0px;
}
.table{
    width: auto;
    min-width: 700px;
    max-width: 100%;
    color: gray;
    background-color: #222;
    text-align: left !important;
}
.table tr{
    width: 100%;
}
.table td{
    background-color: rgb(109, 109, 109);
    background-color: rgb(39, 39, 39);
}
.table td:nth-child(1){
    min-width: 50%;
}
ul.list{
    position: relative;
    width: auto;
    height: auto;
}
ul.list a{
    position: relative;
    left: 150px;
}