.buttonGr{
    position: absolute;
    left: 1100px;
    top: 300px;
    width: calc( 1400px / 2 );
    height: 160px;
    background: url(../Images/Start/Arxiki_Screen_Gr_Button.png);
}

.buttonGr:hover{
    animation: animateButtonGr 1s steps(2) infinite;
}

@keyframes animateButtonGr{
    from{
        background-position: -700px;
    }
    to{
        background-position: -700px;
    }
}
.buttonEn{
    position: absolute;
    left: 1100px;
    top: 550px;
    width: calc( 1400px / 2 );
    height: 160px;
    background: url(../Images/Start/Arxiki_Screen_En_Button.png);
}

.buttonEn:hover{
    animation: animateButtonEn 1s steps(2) infinite;
}

@keyframes animateButtonEn{
    from{
        background-position: -700px;
    }
    to{
        background-position: -700px;
    }
}

.centerControl{
    width: calc( 2160px / 9 );
    height: 60px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_02/Notia_Metopi_Screen02_Center_Control_sprite_new.png);
    animation: animateCenter 1s steps(9) infinite;
}

@keyframes animateCenter{
    from{
        background-position: 0;
    }
    to{
        background-position: -2160px;
    }
}

.centerControlStatic{
    width: calc( 2160px / 9 );
    height: 60px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_02/Notia_Metopi_Screen02_Center_Control_sprite_new.png);
}

.leftControl{
    width: calc( 1890px / 9);
    height: 90px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_02/Notia_Metopi_Screen02_Left_Control_sprite_new_03.png);
    animation: animateLeft 1s steps(9) infinite;
}

@keyframes animateLeft{
    from{
        background-position: 0;
    }
    to{
        background-position: -1890px;
    }
}

.rightControl{
    width: calc( 1890px / 9);
    height: 90px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_02/Notia_Metopi_Screen02_Right_Control_sprite_new.png);
    animation: animateRight 1s steps(9) infinite;
}

@keyframes animateRight{
    from{
        background-position: 0;
    }
    to{
        background-position: -1890px;
    }
}

.lightEarth{
    width: calc( 2700px / 9 );
    height: 115px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_02/Notia_Metopi_Screen02_light_earth_sprite_new.png);
    animation: animateLight 1s steps(9) infinite;
}

@keyframes animateLight{
    from{
        background-position: 0;
    }
    to{
        background-position: -2700px;
    }
}


.drone{
    width: calc( 25000px / 50);
    height: 500px;
    background: url(../Images/Test/DRONE_SPRITE_SHEET-02-02_Full_191219.png);
    animation: animateDrone 1s steps(50) infinite;
}

@keyframes animateDrone{
    from{
        background-position: 0;
    }
    to{
        background-position: -25000px;
    }
}

.lightsTop{
    width: calc( 4755px / 9);
    height: 107px;
    background: url(../Images/Notia_metopi/Notia_metopi_Screen_04/NOTIA_METOPI_TEXT_Page04_light_01_Sprite.png);
    animation: animateLightsTop 1s steps(9) infinite;
}

@keyframes animateLightsTop{
    from{
        background-position: 0;
    }
    to{
        background-position: -4755px;
    }
}

#shadow{
    animation: animateShadow 20s forwards;
}

@keyframes animateShadow{
    from{
        transform: translate(0);
    }
    to{
        transform: translate(-380px);
    }
}

#station{
    transform-origin: left top;
    animation: animateStation 10s ease-in-out forwards;
}

@keyframes animateStation{
    from{
        transform: scale(0.7)
    }
    to{
        transform: scale(1)
    }
}

.centerControl04{
    width: calc( 3420px / 9 );
    height: 90px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_04/Notia_Metopi_Screen04_Center_Control_sprite.png);
    animation: animateCenter04 1s steps(9) infinite;
}

@keyframes animateCenter04{
    from{
        background-position: 0;
    }
    to{
        background-position: -3420px;
    }
}

.missionSelector{
    width: calc( 1620px / 9 );
    height: 100px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_06/Notia_Metopi_Screen06_Mission_Selector.png);
    animation: missionSelector 1s steps(9) infinite;
}

.missionSelectorStatic{
    width: calc( 1620px / 9 );
    height: 100px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_06/Notia_Metopi_Screen06_Mission_Selector.png);
}

@keyframes missionSelector{
    from{
        background-position: 0;
    }
    to{
        background-position: -1620px;
    }
}

.button08{
    width: calc( 1000px / 2 );
    height: 110px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_08/Notia_Metopi_Screen08_Button01_Sprite.png);
}

.button08:hover{
    animation: animateButton08 1s steps(2) infinite;
}

@keyframes animateButton08{
    from{
        background-position: -500px;
    }
    to{
        background-position: -500px;
    }
}


.buttons08{
    width: calc( 1000px / 2 );
    height: 110px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_08/Notia_Metopi_Screen08_Button02_Sprite.png);
}

.buttons08:hover{
    animation: animateButtons08 1s steps(2) infinite;
}

@keyframes animateButtons08{
    from{
        background-position: -500px;
    }
    to{
        background-position: -500px;
    }
}

.button13{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_13/Notia_Metopi_Screen13_Button01_Sprite.png);
}

.button13:hover{
    animation: animateButton13 1s steps(2) forwards;
}

@keyframes animateButton13{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.buttons13{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_13/Notia_Metopi_Screen13_Button02_Sprite.png);
}

.buttons13:hover{
    animation: animateButtons13 1s steps(2) forwards;
}

@keyframes animateButtons13{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.buttons16{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_16/Notia_Metopi_Screen16_Button02_Sprite.png);
}

.buttons16:hover{
    animation: animateButtons16 1s steps(2) infinite;
}

@keyframes animateButtons16{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.button19{
    width: calc( 1600px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_19/Notia_Metopi_Screen19_Button_Sprite.png);
}

.button19:hover{
    animation: animateButton19 1s steps(2) infinite
}

@keyframes animateButton19{
    from{
        background-position: 0;
    }
    to{
        background-position: -1600px;
    }
}

.button22_1{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_22/Notia_Metopi_Screen22_Button01_Sprite.png);
}

.button22_1Static{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_22/Notia_Metopi_Screen22_Button01_Sprite.png);
}

.button22_1:hover{
    animation: animateButton22_1 1s steps(2) infinite;
}

@keyframes animateButton22_1{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.button22_2{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_22/Notia_Metopi_Screen22_Button03_Sprite.png);
}

.button22_2Static{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_22/Notia_Metopi_Screen22_Button03_Sprite.png);
}

.button22_2:hover{
    animation: animateButton22_2 1s steps(2) infinite;
}

@keyframes animateButton22_2{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.button22_3{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_22/Notia_Metopi_Screen22_Button02_Sprite.png);
}

.button22_3Static{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_22/Notia_Metopi_Screen22_Button02_Sprite.png);
}

.button22_3:hover{
    animation: animateButton22_3 1s steps(2) infinite;
}

@keyframes animateButton22_3{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.button22_4{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_22/Notia_Metopi_Screen22_Button04_Sprite.png);
}

.button22_4Static{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_22/Notia_Metopi_Screen22_Button04_Sprite.png);
}

.button22_4:hover{
    animation: animateButton22_4 1s steps(2) infinite;
}

@keyframes animateButton22_4{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.button24_1{
    width: calc( 1040px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_24/Notia_Metopi_Screen24_Button_london_Sprite.png);
}

.button24_1:hover{
    animation: animateButton24_1 1s steps(2) infinite;
}

.button24_1:hover + #london{
    -webkit-transform: scale(1.4)
}

@keyframes animateButton24_1{
    from{
        background-position: -520px;
    }
    to{
        background-position: -520px;
    }
}

.button24_2{
    width: calc( 1040px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_24/Notia_Metopi_Screen24_Button_Kopenxagi_Sprite.png);
}

.button24_2:hover{
    animation: animateButton24_2 1s steps(2) infinite;
}

.button24_2:hover + #kopenhagen{
    -webkit-transform: scale(1.4)
}

@keyframes animateButton24_2{
    from{
        background-position: -520px;
    }
    to{
        background-position: -520px;
    }
}

.button24_3{
    width: calc( 1040px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_24/Notia_Metopi_Screen24_Button_Paris_Sprite.png);
}

.button24_3:hover{
    animation: animateButton24_3 1s steps(2) infinite;
}

.button24_3:hover + #paris{
    -webkit-transform: scale(1.4)
}

@keyframes animateButton24_3{
    from{
        background-position: -520px;
    }
    to{
        background-position: -520px;
    }
}

.button24_4{
    width: calc( 1040px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_24/Notia_Metopi_Screen24_Button_Rome_Sprite.png);
}

.button24_4:hover{
    animation: animateButton24_4 1s steps(2) infinite;
}

@keyframes animateButton24_4{
    from{
        background-position: -520px;
    }
    to{
        background-position: -520px;
    }
}

.button31{
    width: calc( 1600px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_31/Notia_Metopi_Screen31_Button_Sprite.png);
}

.button31:hover{
    animation: animateButton31 1s steps(2) infinite;
}

.button24_4:hover + #rome{
    -webkit-transform: scale(1.4)
}

@keyframes animateButton31{
    from{
        background-position: -800px;
    }
    to{
        background-position: -800px;
    }
}

.button47{
    width: calc( 560px / 2 );
    height: 250px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_47/Notia_Metopi_Screen47_PlayButton_Sprite.png);
    animation: animateButton47 1s steps(2) infinite;
}

@keyframes animateButton47{
    from{
        background-position: 0;
    }
    to{
        background-position: -560px;
    }
}

.button49{
    width: calc( 1600px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_49/Notia_Metopi_Screen49_Button_Sprite.png);
}

.button49:hover{
    animation: animateButton49 1s steps(2) forwards;
}

@keyframes animateButton49{
    from{
        background-position: -800px;
    }
    to{
        background-position: -800px;
    }
}

.button53{
    width: calc( 880px / 2 );
    height: 140px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_53/Notia_Metopi_Screen53_Button_Sprite.png);
}

.button53:hover{
    animation: animateButton53 1s steps(2) infinite;
}

@keyframes animateButton53{
    from{
        background-position: -440px;
    }
    to{
        background-position: -440px;
    }
}

.backButton{
    width: calc( 300px / 2 );
    height: 80px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_03/Notia_Metopi_Screen03_Back_button_Sprite.png);
}

.backButton:hover{
    animation: animateBackButton 1s steps(2) forwards;
}

@keyframes animateBackButton{
    from{
        background-position: -150px;
    }
    to{
        background-position: -150px;
    }
}

.forwardButton01{
    width: calc( 300px / 2 );
    height: 80px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_03/Notia_Metopi_Screen03_Forward_button_sprite.png);
}

.forwardButton01:hover{
    animation: animateForwardButton 1s steps(2) forwards;
}

.forwardButton02{
    width: calc( 300px / 2 );
    height: 80px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_03/Notia_Metopi_Screen03_Forward_button_sprite.png);
}

.forwardButton02:hover{
    animation: animateForwardButton 1s steps(2) infinite;
}


@keyframes animateForwardButton{
    from{
        background-position: -150px;
    }
    to{
        background-position: -150px;
    }
}

.lockClosed{
    width: calc( 25000px / 50 );
    height: 500px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_12/Notia_Metopi_Screen12_lock_closed_sprite.png);
    animation: animateLockClosed 8s steps(50) infinite;
}

@keyframes animateLockClosed{
    from{
        background-position: 0;
    }
    to{
        background-position: -250000px;
    }
}

.lockOpen{
    width: calc( 25000px / 50 );
    height: 500px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_26/Notia_Metopi_Screen26_lock_Open_Sprite.png);
    animation: animateLockOpen 8s steps(50) infinite;
}

@keyframes animateLockOpen{
    from{
        background-position: 0;
    }
    to{
        background-position: -250000px;
    }
}

.flag{
    width: calc( 5000px / 50 );
    height: 100px;
    background: url(../Images/Notia_metopi/Notia_metopi_Sceen_37/Notia_Metopi_Screen37_Flag_Sprite.png);
    animation: animateFlag 1s steps(50) infinite;
}

@keyframes animateFlag{
    from{
        background-position: 0;
    }
    to{
        background-position: -5000px;
    }
}

.keyboard {
    position: absolute;
    display: none;
    top: 662px;
    left: 517px;
    width: 886px;
    height: 368px;
    background-color: #404040;
    box-shadow: 0 0 50px rgba(0, 0, 0, 0.5);
}

.keyboard__keys {
    text-align: center;
}

.keyboard__key {
    height: 65px;
    width: 71px;
    max-width: 90px;
    margin: 3px;
    border-radius: 4px;
    border: none;
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    font-size: 1.05rem;
    outline: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: top;
    padding: 0;
    -webkit-tap-highlight-color: transparent;
    position: relative;
}

.keyboard__key:active {
    background: rgba(255, 255, 255, 0.12);
}

.keyboard__key--wide {
    width: 12%;
}

.keyboard__key--extra-wide {
    width: 36%;
    max-width: 500px;
}

.keyboard__key--activatable::after {
    content: '';
    top: 10px;
    right: 10px;
    position: absolute;
    width: 8px;
    height: 8px;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 50%;
}

.keyboard__key--active::after {
    background: #08ff00;
}

.keyboard__key--dark {
    background: rgba(0, 0, 0, 0.25);
}

#p01{
    position: absolute;
    width: 100px;
    height: 100px;
    top: 586px;
    left: 990px;
}

#p02{
    position: absolute;
    width: 100px;
    height: 100px;
    top: 275px;
    left: 912px;
}

#p03{
    position: absolute;
    width: 100px;
    height: 100px;
    top: 473px;
    left: 720px;
}

.eyes{
    width: calc( 350px / 7 );
    height: 20px;
    background: url(../Images/Notia_Metopi_Screen02_Male_character_eyes/eyes_male_character_new.png);
    animation: animateEyes 2s steps(7) infinite;
}

@keyframes animateEyes{
    from{
        background-position: 0;
    }
    to{
        background-position: -350px;
    }
}

#m01{
    position: absolute;
    width: 200px;
    height: 200px;
    top: 221px;
    left: 805px;
}

#m02{
    position: absolute;
    width: 50px;
    height: 50px;
    top: 610px;
    left: 985px;
}

.glassesSpite{
    width: calc( 8192px / 50 );
    height: 164px;
    background: url(../Images/Test/Notia_Metopi_Screen09_Scanner_Glasses_Sprite_new.png);
    animation: animateGlassesSpite 5s steps(50) infinite;
}

@keyframes animateGlassesSpite{
    from{
        background-position: 0;
    }
    to{
        background-position: -8192px;
    }
}

#m03{
    position: absolute;
    width: 300px;
    height: 300px;
    top: 610px;
    left: 985px;
}

#ms01{
    position: absolute;
    width: 150px;
    height: 100px;
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none;
    cursor:pointer;
    overflow: hidden;
    outline:none;
}

#ms02{
    position: absolute;
    width: 150px;
    height: 100px;
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none;
    cursor:pointer;
    overflow: hidden;
    outline:none;
}

#ms03{
    position: absolute;
    width: 150px;
    height: 100px;
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none;
    cursor:pointer;
    overflow: hidden;
    outline:none;
}

.button00{
    width: 150px;
    height: 80px;
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none !important;
    cursor:pointer;
    overflow: hidden;
    outline: none !important;
}

.box:hover > .forwardButton02{
    animation: animateForwardButton 1s steps(2) infinite;
}

.box:hover > .forwardButton01{
    animation: animateForwardButton 1s steps(2) infinite;
}

.box2:hover > .backButton{
    animation: animateBackButton 1s steps(2) forwards;
}

.buttonTravel{
    width: 500px;
    height: 110px;
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none !important;
    cursor:pointer;
    overflow: hidden;
    outline: none !important;
}

.boxTravel:hover > .button08{
    animation: animateButton08 1s steps(2) infinite;
}

.buttonGlasses{
    width: 330px;
    height: 330px;
    background-color: Transparent;
    background-repeat:no-repeat;
    border: none !important;
    cursor:pointer;
    overflow: hidden;
    outline: none !important;
}

.flagParis{
    width: calc( 5000px / 50 );
    height: 100px;
    background: url(../Images/Zoforos/Zoforos_Screen_26/Zoforos_Screen26_Flag_Sprite.png);
    animation: animateFlag 1s steps(50) infinite;
}

@keyframes animateFlag{
    from{
        background-position: 0;
    }
    to{
        background-position: -5000px;
    }
}

.kopenhagen{
    overflow: hidden;
}

.kopenhagen > div{
    width: 100%;
    height: 100%;
    transition: background-size 2s ease;
    background-size: 100%;
    background-position: center center;
}

#kopenhagenM{
    background-image: url(../Images/Notia_metopi/Notia_metopi_Sceen_28/Notia_Metopi_Screen28_Backr.png);
    width: 1920px;
    height: 1080px;
}

.london{
    overflow: hidden;
}

.london > div{
    width: 100%;
    height: 100%;
    transition: background-size 2s ease;
    background-size: 100%;
    background-position: center center;
}

#londonM{
    background-image: url(../Images/Notia_metopi/Notia_metopi_Sceen_37/Notia_Metopi_Screen37_Backr.png);
    width: 1920px;
    height: 1080px;
}

.paris{
    overflow: hidden;
}

.paris > div{
    width: 100%;
    height: 100%;
    transition: background-size 2s ease;
    background-size: 100%;
    background-position: center center;
}

#parisM{
    background-image: url(../Images/Zoforos/Zoforos_Screen_26/Zoforos_Screen26_Backr.png);
    width: 1920px;
    height: 1080px;
}

.papyrosSprite{
    width: calc(22860px / 18 ) ;
    height: 953px;
    background-image: url(../Images/Notia_metopi/Notia_metopi_Sceen_48/Notia_Metopi_Papyros_Open_Big_Sprite.png);
    animation: animatePapyrosTest 3s steps(17) forwards;
}

@keyframes animatePapyrosTest{
    from{
        background-position: 0;
    }
    to{
        background-position: -21590px;
    }
}

.itaDrop{
    position: absolute;
    width: 13px;
    height: 26px;
    top: 481px;
    left: 731px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.eDrop{
    position: absolute;
    width: 12px;
    height: 30px;
    top: 248px;
    left: 1013px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.ipsilonDrop{
    position: absolute;
    width: 15px;
    height: 32px;
    top: 632px;
    left: 567px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.mDrop{
    position: absolute;
    width: 14px;
    height: 47px;
    top: 711px;
    left: 1060px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.oDrop{
    position: absolute;
    width: 11px;
    height: 14px;
    top: 565px;
    left: 673px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.omegaDrop{
    position: absolute;
    width: 20px;
    height: 19px;
    top: 561px;
    left: 1064px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.thitaDrop{
    position: absolute;
    width: 11px;
    height: 38px;
    top: 310px;
    left: 1039px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

#p08{
    position: absolute;
    width: 200px;
    height: 200px;
    top: 245px;
    left: 910px;
}

#p12{
    position: absolute;
    width: 200px;
    height: 200px;
    top: 350px;
    left: 910px;
}

.itaDropP14{
    position: absolute;
    width: 13px;
    height: 26px;
    top: 395px;
    left: 807px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.eDropP14{
    position: absolute;
    width: 18px;
    height: 30px;
    top: 230px;
    left: 1155px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.mDropP14{
    position: absolute;
    width: 15px;
    height: 47px;
    top: 311px;
    left: 1091px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.oDropP14{
    position: absolute;
    width: 10px;
    height: 14px;
    top: 569px;
    left: 1076px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.omegaDropP14{
    position: absolute;
    width: 22px;
    height: 13px;
    top: 399px;
    left: 1462px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.thitaDropP14{
    position: absolute;
    width: 13px;
    height: 45px;
    top: 541px;
    left: 1183px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

#p15{
    position: absolute;
    width: 200px;
    height: 200px;
    top: 299px;
    left: 858px;
}

.nt07{
    position: absolute;
    width: 200px;
    height: 200px;
    top: 221px;
    left: 805px;
}

.omegaDropP06{
    position: absolute;
    width: 22px;
    height: 17px;
    top: 376px;
    left: 746px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.ipsilonDropP06{
    position: absolute;
    width: 12px;
    height: 32px;
    top: 291px;
    left: 1314px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.mDropP06{
    position: absolute;
    width: 15px;
    height: 47px;
    top: 293px;
    left: 779px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.itaDropP06{
    position: absolute;
    width: 13px;
    height: 26px;
    top: 454px;
    left: 1305px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.eDropP06{
    position: absolute;
    width: 14px;
    height: 30px;
    top: 452px;
    left: 1001px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

#z02{
    position: absolute;
    width: 365px;
    height: 200px;
    top: 411px;
    left: 706px;;
}

.z03{
    position: absolute;
    width: 86px;
    height: 80px;
    top: 680px;
    left: 555px;
}

.buttonZlondon{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Zoforos/Zoforos_Screen_22/Zoforos_Screen22_button02_London_Sprite.png);
}

.buttonZlondon:hover{
    animation: animatebuttonZlondon 1s steps(2) infinite;
}

@keyframes animatebuttonZlondon{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.buttonZparis{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Zoforos/Zoforos_Screen_22/Zoforos_Screen22_button01_Paris_Sprite.png);
}

.buttonZparis:hover{
    animation: animatebuttonZparis 1s steps(2) infinite;
}

@keyframes animatebuttonZparis{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.buttonZrome{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Zoforos/Zoforos_Screen_22/Zoforos_Screen22_button03_Rome_Sprite.png);
}

.buttonZrome:hover{
    animation: animatebuttonZrome 1s steps(2) infinite;
}

@keyframes animatebuttonZrome{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.buttonZcopen{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Zoforos/Zoforos_Screen_22/Zoforos_Screen22_button04_Copench_Sprite.png);
}

.buttonZcopen:hover{
    animation: animatebuttonZcopen 1s steps(2) infinite;
}

@keyframes animatebuttonZcopen{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.z11{
    position: absolute;
    width: 436px;
    height: 200px;
    top: 484px;
    left: 480px;
}

.z11_01{
    position: absolute;
    width: 436px;
    height: 200px;
    top: 484px;
    left: 480px;
}

.z12{
    position: absolute;
    width: 142px;
    height: 50px;
    top: 799px;
    left: 1320px;
}

.buttonRtm{
    width: calc( 1600px / 2 );
    height: 140px;
    background: url(../Images/Zoforos/Zoforos_Screen_36/Zoforos_Screen36_button.png);
}

.buttonRtm:hover{
    animation: animatebuttonRtm 1s steps(2) infinite;
}

@keyframes animatebuttonRtm{
    from{
        background-position: -800px;
    }
    to{
        background-position: -800px;
    }
}

.z13{
    position: absolute;
    width: 436px;
    height: 200px;
    top: 484px;
    left: 480px;
}

.pieceZdrop14{
    position: absolute;
    width: 83px;
    height: 79px;
    top: 720px;
    left: 357px;
}

.omegaDropZ12{
    position: absolute;
    width: 25px;
    height: 17px;
    top: 451px;
    left: 1406px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.ipsilonDropZ12{
    position: absolute;
    width: 12px;
    height: 32px;
    top: 383px;
    left: 530px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.mDropZ12{
    position: absolute;
    width: 30px;
    height: 64px;
    top: 313px;
    left: 754px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.itaDropZ12{
    position: absolute;
    width: 42px;
    height: 26px;
    top: 391px;
    left: 1178px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.eDropZ12{
    position: absolute;
    width: 14px;
    height: 30px;
    top: 320px;
    left: 577px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.thitaDropZ12{
    position: absolute;
    width: 24px;
    height: 34px;
    top: 437px;
    left: 1035px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.oDropZ12{
    position: absolute;
    width: 14px;
    height: 30px;
    top: 446px;
    left: 849px;
    background-color: rgb(255,158,142);
    outline-color: black;
    outline-style: dotted;
}

.buttonsP07{
    width: calc( 1160px / 2 );
    height: 140px;
    background: url(../Images/Posidonas/Poseidonas_Screen_24/Poseidonas_Screen24_Button_Sprite.png);
}

.buttonsP07:hover{
    animation: animatebuttonsP07 1s steps(2) infinite;
}

@keyframes animatebuttonsP07{
    from{
        background-position: -580px;
    }
    to{
        background-position: -580px;
    }
}

.poseidonasDrop{
    position: absolute;
    width: 303px;
    height: 325px;
    top: 387px;
    left: 758px;
}