.naslovna{height:100vh; width:100%; overflow: hidden; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 3em), 0% 100%); 
       position: relative; top:0; left: 0; z-index:10}
    .cetvrtina{width:50%; height: 100%; position: absolute; 
              background-size:cover; background-position: center; cursor: pointer;
              display: flex; align-items: center; justify-items: center; justify-content: center;
               background-image: url('/slike/galerija/rent-a-boat-porec-38.webp'); top:0; left:0vw;}  
        .cetvrtina span{display:block; font-family: jedan, sans-serif; transition: .1s;
                    background-color:#EF7F1Add; border: .5rem solid #ffffff32;}        
    .cetvrtina:nth-of-type(2){background-image: url('/slike/galerija/rent-a-boat-porec-10.webp'); left:50%;} 
        .cetvrtina:nth-of-type(2) span{background-color:#01afeeaa; }    
    .cetvrtina:nth-of-type(3){background-image: url('/slike/galerija/rent-a-boat-porec-74.webp'); 
                            width:100%; height:50%; z-index:11;
                            clip-path: polygon(100% 0, 0 0, 50% 100%);}  
        .cetvrtina:nth-of-type(3) span{background-color:#E5097Faa; }                      
    .cetvrtina:nth-of-type(4){background-image: url('/slike/galerija/rent-a-boat-porec-42.webp'); 
                            top:50%; width:100%; height:50%; z-index:11; 
                            clip-path: polygon(50% 0%, 0% 100%, 100% 100%);}   
        .cetvrtina:nth-of-type(4) span{background-color:#47BA27aa;}                                          
    .cetvrtina:hover span{color:white; border-color: white;}                        
@media (orientation: portrait) {
    .naslovna{height:auto; top:4rem; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 3em), 0% 100%); }
        .cetvrtina{width:100%; height:calc(25vh - 1rem + 5vh) !important;  position: static; 
            clip-path: polygon(0 3em, 100% 0, 100% 100%, 0% 100%)  !important; margin-top: -7vh;}
            .ispravak-kosine{transform: rotate(45deg)}
}