@charset "UTF-8"

@media (min-width: 1920px) .container {
    max-width: 1920px;
}

body {
    overlay: hidden;
    background-color: white;
    user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.container {
    padding: 0 0 0 0;
    max-width: 100% !important;
}

.row {
    margin: 0 0 0 0;
}

.patternOverlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0.5;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVQImWNgYGD4DwABBAEAfbLI3wAAAABJRU5ErkJggg==);
    z-index: 1;
}

#mainContainer {
    z-index: 2;
}

.fullWidthTop {
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    position: absolute;
}

.menuBot {
    position: absolute;
    bottom: 0;
    z-index: 2;
    display: flex;
}

.animationOverlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0.5;
    z-index: 3;
    background-color: black;
}

.deleteMe {
    display: none;
}

    .deleteMe * {
        user-drag: none;
        user-select: none;
        -moz-user-select: none;
        -webkit-user-drag: none;
        -webkit-user-select: none;
        -ms-user-select: none;
    }

#mainCanvas {
    z-index: 4;
    position: absolute !important;
    top: 0;
    left: 0;
    width: 1920px !important;
    height: 575px !important;
}

.videoAnimace {
    z-index: 11 !important;
    position: absolute;
    top: calc(50% - 575px/2);
}

.videoAnimDiv {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index: 10 !important;
    cursor: pointer;
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------STROM----------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/

.tree {
    position: absolute;
    left: 26%;
    bottom: 0;
    /*! max-width: 1000px; */
    width: 53%;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
}

.treeHeader {
    position: absolute;
    z-index: 50;
}

    .treeHeader:hover {
        transform: scale(1.04);
        cursor: pointer;
    }

.treeHeader1 {
    top: 51.1%;
    left: 28%;
    width: 10%;
}

.treeHeader2 {
    top: 26%;
    left: 37.1%;
    width: 11.2%;
}

.treeHeader3 {
    top: 39.8%;
    right: 24.3%;
    width: 21%;
}

.treeHeader4 {
    top: 62.5%;
    right: 23.2%;
    width: 13.5%;
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*------------------------------------------------------PROMITANI-----------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/

.divPromitani {
    width: 100vw;
    height: 100vh;
}


.navDivPromitani {
}

    .navDivPromitani:hover .navZpetPromitani {
        transform: scale(1.03);
    }

.navVetvePromitani {
    position: absolute;
    cursor: pointer;
    z-index: 3;
    right: 0%;
    top: 4.2%;
    width: 20%;
}

.navZpetPromitani {
    position: absolute;
    cursor: pointer;
    z-index: 3;
    right: 2%;
    top: 32%;
    width: 8%;
}


.snury {
    position: absolute;
    left: 0%;
    width: 98.2%;
    top: 4.5%;
}


.hadr {
    position: absolute;
}

.hadrTeaser1 {
    width: 24.2%;
    left: 36.5%;
    top: 10.1%;
    z-index: 4;
}

    .hadrTeaser1:hover {
        transform: scale(1.01);
        cursor: pointer;
    }

.hadrTeaser2 {
    width: 25%;
    left: 58.3%;
    top: 4.5%;
    z-index: 4;
}

    .hadrTeaser2:hover {
        transform: scale(1.01);
        cursor: pointer;
    }

.hadrInfo {
    width: 20.5%;
    left: 15%;
    bottom: 0%;
    z-index: 4;
}


/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------TVORBA-----------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/

.imgAnotace_velka {
    position: absolute;
    width: 79%;
    top: 10%;
    right: 0%;
}

.divTvorba {
    width: 100vw;
    height: 100vh;
}


.navDivTvorba {
}

    .navDivTvorba:hover .navZpetTvorba {
        transform: rotate(26deg) scale(1.03);
    }

.navVetveTvorba {
    position: absolute;
    cursor: pointer;
    z-index: 3;
    left: 0;
    bottom: 45%;
    width: 20%;
}

.navZpetTvorba {
    position: absolute;
    cursor: pointer;
    z-index: 3;
    left: 10.5%;
    bottom: 61.5%;
    width: 6%;
    transform: rotate(26deg);
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------------------KONTAKTY---------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/

.divKontakty {
    width: 100vw;
    height: 100vh;
}

.contactsDiv a img {
    margin-right: 100px;
    position: absolute;
    top: 35%;
}

.imgKontakt {
}

    .imgKontakt:hover {
        transform: scale(1.02);
    }

.imgLogoFacebook {
    left: 30%;
    width: 12%;
}

.imgLogoInstagram {
    left: 50%;
    width: 12%;
}

.imgLogoLmzch {
    left: 70%;
    width: 10%;
}


.navDivKontakty {
}

    .navDivKontakty:hover .navZpetKontakty {
        transform: rotate(8deg) scale(1.03);
    }

.navVetveKontakty {
    position: absolute;
    cursor: pointer;
    z-index: 3;
    left: 0;
    bottom: 18%;
    width: 20%;
}

.navZpetKontakty {
    position: absolute;
    cursor: pointer;
    z-index: 3;
    left: 6.5%;
    bottom: 20.5%;
    width: 6%;
    transform: rotate(8deg);
}


/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------STYLY ZOBRAZENI PISNOVYCH TEXTU------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/

.divHudba {
    width: 100vw;
    height: 100vh;
}

.downloadDivHudba {
}

.downloadDivHudba:hover .navStahnoutHudbu {
        transform: rotate(-12deg) scale(1.03);
    }

.navDivHudba {
}

    .navDivHudba:hover .navZpetHudba {
        transform: rotate(-23deg) scale(1.03);
    }

.navStahnoutHudbu {
    position: absolute;
    cursor: pointer;
    z-index: 3;
    left: 53.5%;
    bottom: 4%;
    width: 15%;
    transform: rotate(-12deg);
}

.navVetveHudba {
    position: absolute;
    cursor: pointer;
    z-index: 3;
    left: 25.5%;
    bottom: 0%;
    width: 35%;
}

.navZpetHudba {
    position: absolute;
    cursor: pointer;
    z-index: 3;
    left: 50.1%;
    bottom: 11.5%;
    width: 6%;
    transform: rotate(-23deg);
}

.svgNazev {
    position: absolute;
    display: none;
}

.svgText {
    position: absolute;
    width: 15%;
    cursor: pointer;
    z-index: 3;
    max-height: 65%;
}

    .svgText:not(.no-hover):hover {
        transform: scale(1.03);
    }

/*--------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------JEDNOTLIVE TEXTY------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/

/*/////////////////PISNE//////////////////////////*/

.text01 {
    left: 5.5%;
    top: 5%;
    width: 11%;
}

.text02 {
    left: 16.5%;
    top: 4.5%;
    width: 16%;
}

.text03 {
    left: 37.7%;
    top: 7.6%;
    width: 18%;
    z-index: 4;
}

.text04 {
    left: 41%;
    top: 6%;
    width: 40%;
}

.text05 {
    left: 75.7%;
    top: 9.7%;
    width: 11.5%;
}

.text06 {
    left: 3.5%;
    top: 14.5%;
    width: 14%;
}

.text07 {
    left: 4%;
    top: 25%;
    width: 24.5%;
}

.text08 {
    left: 36%;
    top: 28%;
    width: 16%;
}

.text09 {
    left: 60%;
    top: 20%;
    width: 20.2%;
}

.text10 {
    left: 4.5%;
    top: 38%;
    width: 21%;
}

.text11 {
    left: 18%;
    top: 44%;
    width: 26%;
}

.text12 {
    left: 40.5%;
    top: 43.8%;
    width: 13%;
}

.text13 {
    left: 52%;
    top: 45%;
    width: 8%;
}

.text14 {
    left: 69%;
    top: 32.5%;
    width: 12%;
}

.text15 {
    left: 4%;
    top: 51%;
    width: 17%;
}

.text16 {
    left: 12.2%;
    top: 60%;
    width: 10%;
}

.text17 {
    left: 42%;
    top: 59%;
    width: 17%;
}

.text18 {
    left: 56%;
    top: 58%;
    width: 24%;
}

.text19 {
    left: 3%;
    top: 68.1%;
    width: 23%;
}

.text20 {
    left: 59%;
    top: 77%;
    width: 16%;
}

.text21 {
    left: 73%;
    top: 67%;
    width: 22%;
}

.text22 {
    left: 29%;
    top: 80%;
    width: 10%;
}

.text23 {
    left: 84%;
    top: 75.5%;
    width: 9%;
}

/*/////////////////BASNE//////////////////////////*/

.text50 {
    left: 30%;
    top: 3.5%;
    width: 13%;
}

.text51 {
    left: 70.8%;
    top: 7%;
    width: 9%;
}

.text52 {
    left: 79.5%;
    top: 5%;
    width: 16%;
}

.text53 {
    left: 87.3%;
    top: 9%;
    width: 8%;
}

.text54 {
    left: 4%;
    top: 19.8%;
    width: 6%;
}

.text55 {
    left: 10.8%;
    top: 22.5%;
    width: 6.5%;
}

.text56 {
    left: 25.3%;
    top: 30.2%;
    width: 16.1%;
}

.text57 {
    left: 59%;
    top: 18.5%;
    width: 14.2%;
}

.text58 {
    left: 83%;
    top: 15%;
    width: 10%;
}

.text59 {
    left: 77%;
    top: 26%;
    width: 15%;
}

.text60 {
    left: 48%;
    top: 46.5%;
    width: 5%;
    z-index: 4;
}

.text61 {
    left: 63%;
    top: 42.9%;
    width: 11%;
}

.text62 {
    left: 82%;
    top: 36%;
    width: 10%;
}

.text63 {
    left: 76%;
    top: 45.3%;
    width: 16.5%;
}

.text64 {
    left: 81%;
    top: 62.5%;
    width: 13%;
}

.text65 {
    left: 22%;
    top: 72%;
    width: 9.8%;
}

.text66 {
    left: 74%;
    top: 76%;
    width: 15%;
}

/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*----------------------------------------------AUDIO-PREHRAVAC-------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/

.containerTrackBottom {
    display: flex;
    position: absolute;
    bottom: 50px;
}

.containerAudioPlayer {
    float: left;
}

#audio-player {
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
}

#play {
    height: 95px;
    cursor: pointer;
}

.containerDownloadTrack {
    float: left;
}

#downloadTrack {
    height: 95px;
    cursor: pointer;
}


/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------FORMULAR----------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------------------*/

.divForm {
    width: 100vw;
    height: 100vh;
}

.contactForm input {
    clear: both;
}

input {
    display: block;
}

    input[type=text], textarea {
        background: transparent;
        border: none;
        border-bottom: 2px solid white;
        resize: both;
        color: white;
    }

::placeholder {
    color: white;
    opacity: 1;
}