@media screen and (min-width: 1000px) { 
.marquee{
    position: relative;
    top:0px;
    box-sizing: border-box;
    animation: marquee 10s linear infinite;
    
}
.overlay1 {
    overflow:hidden;
    height: 0vh;
    width: 20vw;
    min-width:150px;
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: 20vw;
    overflow-x: hidden;
    transition: 0.3s;
    /* transition-delay: 0.2s; jest w javiescrip na samym dole */
    
    }
   
       .overlay-content1 {
           overflow:hidden;
       position: relative;
       bottom: 0vh;
       width: 100%;
       text-align: center;
       margin-top: 0px;
       }
   
         
   
       .openButton1{
           color:white;
           position:absolute;
           bottom:50px;
           left:25vw;
           cursor: pointer;
           text-shadow:1px 2px 2px black;
           z-index:3;
       }
   
   
   
   .overlay2 {
    height: 0vh;
    width: 20vw;
    min-width:150px;
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: 40vw;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.9);
    overflow: hidden;
    overflow-x: hidden;
    transition: 0.3s;
    /* transition-delay: 0.2s; */
    }
   
       .overlay-content2 {
       position: relative;
       top: 0vh;
       width: 100%;
       text-align: center;
       margin-top: 0px;
       }
   
      
   
   
   
       .openButton2{
           color:white;
           position:absolute;
           bottom:50px;
           left:45vw;
           cursor: pointer;
           text-shadow:1px 2px 2px black;
           z-index:3;
       }
   
   
    .overlay3 {
    height: 0vh;
    width: 20vw;
    min-width:150px;
    position: absolute;
    z-index: 2;
    bottom: 0;
    left: 60vw;
    /* background-color: rgb(0,0,0); */
    background-color: rgba(0,0,0, 0.9);
    overflow: hidden;
    overflow-x: hidden;
    transition: 0.3s;
    /* transition-delay: 0.2s; */
    }
   
       .overlay-content3 {
       position: relative;
       top: 0vh;
       width: 100%;
       text-align: center;
       margin-top: 0px;
       }
   
        
       .openButton3{
           color:white;
           position:absolute;
           bottom:50px;
           left:65vw;
           cursor: pointer;
           text-shadow:1px 2px 2px black;
           z-index:3;
       }

       @keyframes marquee {
        0%   { left:   0px }
        50% { left: -300px }
        100% { left: 0px;}
    }
}
@media screen and (max-width: 999px) and (min-height:645px) {
    .marquee{
        position: relative;
        bottom:0px;
        box-sizing: border-box;
        animation: marquee 10s linear infinite;
        
    }
    .overlay1 {
        overflow:hidden;
        height: 0vh;
        width: 100vw;
        min-width:300px;
        position: absolute;
        z-index: 2;
        
        left: 0vw;
        right: 0vw;
        top:80px;
        overflow-x: hidden;
        transition: 0.3s;
        /* transition-delay: 0.2s; jest w javiescrip na samym dole */
        
        }
        
           .overlay-content1 {
           overflow:hidden;
           position: relative;
           bottom: 0vh;
           width: 100%;
           text-align: center;
           margin-top: 0px;
           }
       
             
       
           .openButton1{
               color:white;
               position:absolute;
               top:26vh;
               left:5vw;
               overflow:hidden;
               float:left;
               
               cursor: pointer;
               text-shadow:1px 2px 2px black;
               font-size:1.5rem;
               z-index:3;
           }
       
       
       
       .overlay2 {
        overflow:hidden;
        height: 0vh;
        width: 100vw;
        min-width:300px;
        position: absolute;
        z-index: 2;
        
        left: 0vw;
        right: 0vw;
        top:80px;
        overflow-x: hidden;
        transition: 0.3s;
        }
       
           .overlay-content2 {
           position: relative;
           top: 0vh;
           width: 100%;
           text-align: center;
           margin-top: 0px;
           }
       
          
              
       
           .openButton2{
               color:white;
               position:absolute;
               top:31vh;
               left:5vw;
               overflow:hidden;
               float:left;
       
               cursor: pointer;
               text-shadow:1px 2px 2px black;
               font-size:1.5rem;
               z-index:3;
           }
       
       
        .overlay3 {
            overflow:hidden;
            height: 0vh;
            width: 100vw;
            min-width:300px;
            position: absolute;
            z-index: 2;
            
            left: 0vw;
            right: 0vw;
            top:80px;
            overflow-x: hidden;
            transition: 0.3s;
        }
       
           .overlay-content3 {
           position: relative;
           top: 0vh;
           width: 100%;
           text-align: center;
           margin-top: 0px;
           }
       
            
           .openButton3{
               color:white;
               position:absolute;
               top:36vh;
               left:5vw;
               overflow:hidden;
               float:left;
               cursor: pointer;
               text-shadow:1px 2px 2px black;
               z-index:3;
               font-size:1.5rem;
           }
    
           @keyframes marquee {
            0%   { left:   0px }
            50% { left: -300px }
            100% { left: 0px;}
        }
}


@media screen and (max-width: 999px) and (max-height:644px) {
    .marquee{
        position: relative;
        bottom:0px;
        box-sizing: border-box;
        animation: marquee 10s linear infinite;
        
    }
    .overlay1 {
        overflow:hidden;
        height: 0vh;
        width: 100vw;
        min-width:300px;
        position: absolute;
        z-index: 2;
        
        left: 0vw;
        right: 0vw;
        top:80px;
        overflow-x: hidden;
        transition: 0.3s;
        /* transition-delay: 0.2s; jest w javiescrip na samym dole */
        
        }
        
           .overlay-content1 {
           overflow:hidden;
           position: relative;
           bottom: 0vh;
           width: 100%;
           text-align: center;
           margin-top: 0px;
           }
       
             
       
           .openButton1{
               color:white;
               position:relative;
               top:13vh;
               left:5vw;
               overflow:hidden;
               float:left;
               padding-right:15px;
               cursor: pointer;
               text-shadow:1px 2px 2px black;
               font-size:1.2rem;
               z-index:3;
           }
       
       
       
       .overlay2 {
        overflow:hidden;
        height: 0vh;
        width: 100vw;
        min-width:300px;
        position: absolute;
        z-index: 2;
        
        left: 0vw;
        right: 0vw;
        top:80px;
        overflow-x: hidden;
        transition: 0.3s;
        }
       
           .overlay-content2 {
           position: relative;
           top: 0vh;
           width: 100%;
           text-align: center;
           margin-top: 0px;
           }
       
          
              
       
           .openButton2{
               color:white;
               position:relative;
               top:13vh;
               left:5vw;
               overflow:hidden;
               float:left;
                padding-right:15px;
               cursor: pointer;
               text-shadow:1px 2px 2px black;
               font-size:1.2rem;
               z-index:3;
           }
       
       
        .overlay3 {
            overflow:hidden;
            height: 0vh;
            width: 100vw;
            min-width:300px;
            position: absolute;
            z-index: 2;
            
            left: 0vw;
            right: 0vw;
            top:80px;
            overflow-x: hidden;
            transition: 0.3s;
        }
       
           .overlay-content3 {
           position: relative;
           top: 0vh;
           width: 100%;
           text-align: center;
           margin-top: 0px;
           }
       
            
           .openButton3{
               color:white;
               position:relative;
               top:13vh;
               left:5vw;
               overflow:hidden;
               float:left;
               padding-right:15px;
               cursor: pointer;
               text-shadow:1px 2px 2px black;
               z-index:3;
               font-size:1.2rem;
           }
    
           @keyframes marquee {
            0%   { left:   0px }
            50% { left: -300px }
            100% { left: 0px;}
        }
}