Retina responsive images

With use background-image Full screen image
            
                .retina .bg-block.full {
                    background-image: url('http://via.placeholder.com/414x900/2E8B57/ffffff?text=Mobile+image+414x900px');
                }

                    @media (-webkit-min-device-pixel-ratio: 1.5),
                    (min-resolution: 144dpi) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/828x1800/2E8B57/ffffff?text=Mobile+image+(retina)+828x1800px');
                        }
                    }

                    @media (min-height: 900px) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/414x1024/2E8B57/ffffff?text=Tablet+image+414x1024px');
                        }
                    }
            
                    @media (min-height: 900px) and (-webkit-min-device-pixel-ratio: 1.5),
                    (min-height: 900px) and (min-resolution: 144dpi) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/828x2048/2E8B57/ffffff?text=Tablet+image+(retina)+828x2048px');
                        }
                    }

                    @media (min-width: 415px) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/768x800/2E8B57/ffffff?text=Tablet+image+768x1600px');
                        }
                    }

                    @media (min-width: 415px) and (-webkit-min-device-pixel-ratio: 1.5),
                    (min-width: 415px) and (min-resolution: 144dpi) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/1536x1600/2E8B57/ffffff?text=Tablet+image+(retina)+1536x1600px');
                        }
                    }

                    @media (min-width: 415px) and (min-height: 800px) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/768x1024/2E8B57/ffffff?text=Tablet+image+768x1024px');
                        }
                    }

                    @media (min-width: 415px) and (-webkit-min-device-pixel-ratio: 1.5),
                    (min-width: 415px) and (min-resolution: 144dpi),
                    (min-height: 800px) and (min-resolution: 144dpi) {
                         .retina .bg-block.full {
                              background-image: url('http://via.placeholder.com/1536x2048/2E8B57/ffffff?text=Tablet+image+(retina)+1536x2048px');
                         }
                     }

                    @media (min-width: 769px) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/980x900/2E8B57/ffffff?text=Tablet+image+980x900px');
                        }
                    }
                    
                    @media (min-width: 769px) and (-webkit-min-device-pixel-ratio: 1.5),
                    (min-width: 769px) and (min-resolution: 144dpi) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/1960x1800/2E8B57/ffffff?text=Tablet+image+(retina)+1960x1800px');
                        }
                    }

                    @media (min-width: 769px) and (min-height: 900px) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/980x1024/2E8B57/ffffff?text=Tablet+image+980x1024px');
                        }
                    }

                    @media (min-width: 769px) and (-webkit-min-device-pixel-ratio: 1.5),
                    (min-width: 769px) and (min-resolution: 144dpi), (min-height: 900px) and (min-resolution: 144dpi) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/1960x2048/2E8B57/ffffff?text=Tablet+image+(retina)+1960x2048px');
                        }
                    }

                    @media (min-width: 981px) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/1280x980/2E8B57/ffffff?text=Landscape+image+1280x980px');
                        }
                     }
             
                     @media (min-width: 981px) and (-webkit-min-device-pixel-ratio: 1.5),
                     (min-width: 981px) and (min-resolution: 144dpi) {
                         .retina .bg-block.full {
                             background-image: url('http://via.placeholder.com/2560x1960/2E8B57/ffffff?text=Landscape+image+(retina)+2560x1960px');
                         }
                     }

                     @media (min-width: 981px) and (min-height: 980px) {
                         .retina .bg-block.full {
                              background-image: url('http://via.placeholder.com/1280x1440/2E8B57/ffffff?text=Landscape+image+1280x1440px');
                         }
                    }

                    @media (min-width: 981px) and (-webkit-min-device-pixel-ratio: 1.5),
                          (min-width: 981px) and (min-resolution: 144dpi), (min-height: 980px) and (min-resolution: 144dpi) {
                            .retina .bg-block.full {
                                background-image: url('http://via.placeholder.com/2560x2880/2E8B57/ffffff?text=Landscape+image+(retina)+2560x2880px');
                            }
                     }

                    @media (min-width: 1281px) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/1920x1024/2E8B57/ffffff?text=Desktop+image+1920x1024px');
                        }
                     }

                    @media (min-width: 1281px) and (-webkit-min-device-pixel-ratio: 1.5),
                     (min-width: 1281px) and (min-resolution: 144dpi) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/3840x2048/2E8B57/ffffff?text=Desktop+image+(retina)+3840x2048px');
                        }
                     }

                    @media (min-width: 1281px) and (min-height: 1024px)  {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/1920x1440/2E8B57/ffffff?text=Desktop+image+1920x1440px');
                        }
                    }

                    @media (min-width: 1281px) and (-webkit-min-device-pixel-ratio: 1.5),
                    (min-width: 1281px) and (min-resolution: 144dpi), (min-height: 1024px) and (min-resolution: 144dpi) {
                        .retina .bg-block.full {
                            background-image: url('http://via.placeholder.com/3840x2880/2E8B57/ffffff?text=Desktop+image+(retina)+3840x2880px');
                        }
                    }
            
        
Full width image
            
                .retina .bg-block {
                    background-image: url('http://via.placeholder.com/414x500/2E8B57/ffffff?text=Mobile+image+414px');
                }
                @media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
                    .retina .bg-block {
                        background-image: url('http://via.placeholder.com/828x1000/2E8B57/ffffff?text=Mobile+image+(retina)+828px');
                    }
                }
                @media (min-width: 415px){
                    .retina .bg-block {
                        background-image: url('http://via.placeholder.com/768x500/2E8B57/ffffff?text=Tablet+image+768px');
                    }
                }
                @media (min-width: 415px) and (-webkit-min-device-pixel-ratio: 1.5), (min-width: 415px) and (min-resolution: 144dpi) {
                    .retina .bg-block {
                        background-image: url('http://via.placeholder.com/1534x1000/2E8B57/ffffff?text=Tablet+image+(retina)+1534px');
                    }
                }
                @media (min-width: 769px) {
                    .retina .bg-block {
                        background-image: url('http://via.placeholder.com/980x500/2E8B57/ffffff?text=Tablet+image+980px');
                    }
                }
                @media (min-width: 769px) and (-webkit-min-device-pixel-ratio: 1.5), (min-width: 769px) and (min-resolution: 144dpi) {
                    .retina .bg-block {
                        background-image: url('http://via.placeholder.com/1960x1000/2E8B57/ffffff?text=Tablet+image+(retina)+1960px');
                    }
                }
                @media (min-width: 981px){
                    .retina .bg-block {
                        background-image: url('http://via.placeholder.com/1280x500/2E8B57/ffffff?text=Landscape+image+1280px');
                    }
                }
                @media (min-width: 981px) and (-webkit-min-device-pixel-ratio: 1.5), (min-width: 981px) and (min-resolution: 144dpi) {
                    .retina .bg-block {
                        background-image: url('http://via.placeholder.com/2560x1000/2E8B57/ffffff?text=Landscape+image+(retina)+2560px');
                    }
                }
                @media (min-width: 1281px){
                    .retina .bg-block {
                        background-image: url('http://via.placeholder.com/1920x500/2E8B57/ffffff?text=Desktop+image+1920px');
                    }
                }
                @media (min-width: 1281px) and (-webkit-min-device-pixel-ratio: 1.5), (min-width: 1281px) and (min-resolution: 144dpi) {
                    .retina .bg-block {
                        background-image: url('http://via.placeholder.com/3840x1000/2E8B57/ffffff?text=Desktop+image+(retina)+3840px');
                    }
                }
            
        
Not full width image
            
                .retina .bg-block.max-800 {
                    background-image: url('http://via.placeholder.com/414x500/2E8B57/ffffff?text=Mobile+image+414px');
                }
                @media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
                    .retina .bg-block.max-800 {
                        background-image: url('http://via.placeholder.com/828x1000/2E8B57/ffffff?text=Mobile+image+(retina)+828px');
                    }
                }
                @media (min-width: 415px){
                    .retina .bg-block.max-800 {
                        background-image: url('http://via.placeholder.com/768x500/2E8B57/ffffff?text=Tablet+image+768px');
                    }
                }
                @media (min-width: 415px) and (-webkit-min-device-pixel-ratio: 1.5), (min-width: 415px) and (min-resolution: 144dpi) {
                    .retina .bg-block.max-800 {
                        background-image: url('http://via.placeholder.com/1534x1000/2E8B57/ffffff?text=Tablet+image+(retina)+1534px');
                    }
                }
                @media (min-width: 768px) {
                    .retina .bg-block.max-800 {
                        background-image: url('http://via.placeholder.com/800x500/2E8B57/ffffff?text=Tablet+image+800px');
                    }
                }
                @media (min-width: 768px) and (-webkit-min-device-pixel-ratio: 1.5), (min-width: 768px) and (min-resolution: 144dpi) {
                    .retina .bg-block.max-800 {
                        background-image: url('http://via.placeholder.com/1600x1000/2E8B57/ffffff?text=Tablet+image+(retina)+1600px');
                    }
                }
            
        
Multicolumn
            
                .retina .columns-holder .img-box {
                    background-image: url('http://via.placeholder.com/414x414/2E8B57/ffffff?text=Mobile+image+414px');
                }
                @media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
                    .retina .columns-holder .img-box {
                        background-image: url('http://via.placeholder.com/828x828/2E8B57/ffffff?text=Mobile+image+(retina)+828px');
                    }
                }
                @media (min-width: 415px){
                    .retina .columns-holder .img-box {
                        background-image: url('http://via.placeholder.com/376x376/2E8B57/ffffff?text=Tablet+image+376px');
                    }
                }
                @media (min-width: 415px) and (-webkit-min-device-pixel-ratio: 1.5), (min-width: 415px) and (min-resolution: 144dpi) {
                    .retina .columns-holder .img-box {
                        background-image: url('http://via.placeholder.com/752x752/2E8B57/ffffff?text=Tablet+image+(retina)+752px');
                    }
                }
                @media (min-width: 769px) {
                    .retina .columns-holder .img-box{
                        background-image: url('http://via.placeholder.com/240x240/2E8B57/ffffff?text=Landscape+image+240px');
                    }
                }
                @media (min-width: 769px) and (-webkit-min-device-pixel-ratio: 1.5), (min-width: 769px) and (min-resolution: 144dpi) {
                    .retina .columns-holder .img-box{
                        background-image: url('http://via.placeholder.com/480x480/2E8B57/ffffff?text=Landscape+image+(retina)+480px');
                    }
                }