#gui {
    font-size: 28px;
    font-weight: 100;
    text-align: center;
    color: #222;
    cursor: pointer;
    z-index: 30000;
    position: fixed;
    width: 100%;
    height: 100%;
    display: block;
    top: 0px;
    left: 0px;
    pointer-events: none;
}

#gui .guiset {
	position: absolute;
	z-index: 30000;
	visibility: hidden;
	opacity: 0;

    transition: opacity 1s;
    -webkit-transition: opacity 1s;
}

#gui .guibg {
    width: 100%;
    height: 89px;
    display: block;
    position: absolute;
    z-index: 25000;
    background-color: #cc3333;
}

#gui .guiset.menu_button {
    left: 2rem;
    top: 2rem;
    width: 144px;
    height: 144px;
    position: absolute;
}

#gui .guiset.logo {
    width: 100%;
    height: 89px;
    /*
    width: 377px;
    height: 53px;
    padding: 20px;
    */
    display: block;
    position: absolute;
    color: #fff;
    background-color: #cc3333;
}

#gui .guiset.image_viewer {
    left: 0rem;
    top: 0rem;
    width: 100%;
    height: 100%;
    position: absolute;
    pointer-events: none;
}

#gui .guiset.right_corner {
    right: 0rem;
    top: -3rem;
    width: 300px;
    height: 120px;
    position: absolute;
    pointer-events: none;
}

#gui .gui {
	z-index: 30000;
	position: absolute;
    cursor: pointer; cursor: hand;
    pointer-events: all;
}

#gui .gui:before {
    content: "";
	background-repeat: no-repeat;
	display: block;
	margin-bottom: 5px;

    transform-origin: center center;
    -webkit-transform-origin: center center;
}

#gui .gui.leftButt {
    top: 40%;
    left: 10rem;
    pointer-events: all;

    transform: rotate(90deg) scale(0.25);
    -webkit-transform: rotate(90deg) scale(0.25);
}

#gui .gui.rightButt {
    top: 40%;
    right: 10rem;
    pointer-events: all;

    transform: rotate(-90deg) scale(0.25);
    -webkit-transform: rotate(-90deg) scale(0.25);
}

#gui .gui.menuButt {
    top: -50px;
    left: 0px;

    transform: rotate(0deg) scale(0.35);
    -webkit-transform: rotate(0deg) scale(0.35);
}

#gui .gui.logoButt {
    width: 377px;
    height: 53px;
    left:29px;
    top:16px;

    transform: rotate(0deg) scale(1);
    -webkit-transform: rotate(0deg) scale(1);
}

#gui .gui.search {
    right:12rem;
    top:0rem;
    opacity: 0.4;
    display: none;

    transform: rotate(0deg) scale(0.25);
    -webkit-transform: rotate(0deg) scale(0.25);
}

#gui .gui.account {
    right:6rem;
    top:0rem;
    opacity: 0.4;

    transform: rotate(0deg) scale(0.25);
    -webkit-transform: rotate(0deg) scale(0.25);
}

#gui .gui.exit {
    right:0rem;
    top:0rem;
    opacity: 0.4;

    transform: rotate(0deg) scale(0.25);
    -webkit-transform: rotate(0deg) scale(0.25);
}

#gui .gui.imprint {
    right:0rem;
    top:0rem;
    opacity: 0.4;

    transform: rotate(0deg) scale(0.25);
    -webkit-transform: rotate(0deg) scale(0.25);
}

#gui .leftButt:before {
    width: 144px;
    height: 144px;
    background: url(../gui_img/gui1.png);
    background-position: -430px -144px; 
    background-repeat: no-repeat;
}

#gui .rightButt:before {
    width: 144px;
    height: 144px;
    background: url(../gui_img/gui1.png);
    background-position: -430px -144px; 
    background-repeat: no-repeat;
}

#gui .menuButt:before {
    width: 144px;
    height: 144px;
    background: url(../gui_img/gui1.png);
    background-position: -144px 0px; 
    background-repeat: no-repeat;
}

#gui .search:before {
    width: 144px;
    height: 144px;
    background: url(../gui_img/gui1.png);
    background-position: -432px 0px; 
    background-repeat: no-repeat;
}

#gui .account:before {
    width: 144px;
    height: 144px;
    background: url(../gui_img/gui1.png);
    background-position: -144px -144px; 
    background-repeat: no-repeat;

    transition: background-position 0.5s;
    -webkit-transition: background-position 0.5s;
}

#gui .exit:before {
    width: 144px;
    height: 144px;
    background: url(../gui_img/gui1.png);
    background-position: -144px -432px; 
    background-repeat: no-repeat;

    transition: background-position 0.5s;
    -webkit-transition: background-position 0.5s;
}

#gui .account.auth:before {
    background-position: 0px -144px; 
}

#gui .imprint:before {
    width: 144px;
    height: 144px;
    background: url(../gui_img/gui1.png);
    background-position: -288px -144px; 
    background-repeat: no-repeat;
}

#gui .logoButt:before {
    width: 377px;
    height: 53px;
    background: url(../gui_img/mezokovesdi_matyo_himzes.svg);
    background-position: 0px 0px; 
    background-size: contain;
    background-repeat: no-repeat;
}

#gui .gui span {
	display: none;
	margin-bottom: 20px;
}