@media only screen and (min-width:769px){
            div{
                float:left;
            }
            canvas{
                border:1px solid black;
                display:none;
            }
            #mygtukas{
                display:none;
            }
            #wrapper {
                height:800px;
                width:100%;
            }
            #sviesiaimelyna {
                background-color:lightblue;
                width:100%;
                height:10%;
            }
            #ruda {
                background-color:brown;
                width:35%;
                height:20%;
            }
            #orandzine {
                background-color:orange;
                width:25%;
                height:40%;
                float:right;
            }
            #melyna {
                background-color:blue;
                width:20%;
                height:40%;
                float:right;
            }
            #juoda {
                color:white;
                background-color:black;
                width:35%;
                height:35%;
            }
            #zalia {
                background-color:green;
                width:45%;
                height:15%;
            }
            #raudona {
                background-color:red;
                width:60%;
                height:35%;
                opacity: 0.75;
            }
            #geltona {
                background-color:yellow;
                width:20%;
                height:35%;
            }
            #balta {
                background-color:white;
                width:20%;
                height:90%;
                float:right;
            }
}
            @media only screen and (max-width:768px) {
            div{
                width:100%;
                height:100%;
                float:left;
            }
            canvas{
                border:1px solid black;
            }
            #juoda img {
            border:5px dotted yellow;

            }
            #zalia img{
            border:5px dotted blue;
            }
            #sviesiaimelyna {
                background-color:lightblue;
                width:100%;
                height:10%;
            }
            #ruda{
                background-color:brown;
                width:35%;
                height:20%;
            }
            #ruda{
                animation-name: keiciaspalva;
                animation-duration: 5s ;
                animation-iteration-count: infinite;
            }

            #orandzine{
                background-color:orange;
                width:45%;
                height:40%;
                float:right;
            }
            #melyna {
                background-color:blue;
                width:20%;
                height:40%;
                display:none;
            }
            #juoda {
                color:white;
                background-color:black;
                width:35%;
                height:35%;
            }
            #juoda:hover{
                animation-name: pasukimas ;
                animation-duration: 5s ;
                animation-timing-function: ease-in;
                animation-iteration-count: infinite;
            }
            #zalia {
                background-color:green;
                width:45%;
                height:15%;
            }
            #zalia:hover ~ #raudona {
                -webkit-animation-name:pulsavimas;
                -webkit-animation-duration:1s;
                -webkit-animation-iteration-count:infinite;
                -webkit-transition-timing-function:ease-in;
            }
            #raudona {
                background-color:red;
                width:80%;
                height:35%;
                opacity: 0.75;
            }
            #geltona {
                background-color:yellow;
                width:20%;
                height:35%;
                display:none;
            }
            #balta {
                background-color:white;
                width:20%;
                height:90%;
                float:right;

            }
            }
            @keyframes keiciaspalva {
            from {background-color: brown;}
            to {background-color:blue; }
            0%{transform: translateY(100%);}
            100%{transform: translateX(0%);}
            }
            @-webkit-keyframes pulsavimas{
            0%   { color: white;}
            50%  { color: blue;}
            100% { color: white;}
            }
            @keyframes pasukimas{
            100%{transform: rotate(180deg);}
            }