<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/* file-specific layout. Should only be grid-template-areas with media queries! */
/* $Id: layout.css 151 2020-11-11 16:02:26Z fuchsm $ */

main {
    grid-template-areas: " hero-banner hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner "
                         " .           welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome         . "
                         " .           game-list      game-list      game-list      game-list      game-list      game-list      game-list      game-list      game-list      game-list      game-list      game-list      . "
                         " .           event-calendar event-calendar event-calendar event-calendar event-calendar event-calendar event-calendar event-calendar event-calendar event-calendar event-calendar event-calendar . "
                         " .           event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     . "
                         " .           bugs-text      bugs-text      bugs-text      bugs-text      bugs-text      bugs-text      bugs-text      bugs-text      bugs-text      bugs-text      bugs-text      bugs-text      . "
                         " .           martins-bugs   martins-bugs   martins-bugs   martins-bugs   martins-bugs   martins-bugs   martins-bugs   martins-bugs   martins-bugs   martins-bugs   martins-bugs   martins-bugs   . "
                         " .           lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    . " 
                         " .           uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      . " 
                         " .           bugs           bugs           bugs           bugs           bugs           bugs           bugs           bugs           bugs           bugs           bugs           bugs            . " 
                        
                         ;
}

@media (min-width: 768px) {
    main {
    grid-template-areas: " hero-banner hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner "
                         " .           welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome         . "
                         " .           game-list      game-list      game-list      game-list      game-list      game-list      game-list      event-calendar event-calendar event-calendar event-calendar event-calendar . "
                         " .           event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     . "
                         " .           martins-bugs   martins-bugs   martins-bugs   martins-bugs   martins-bugs   martins-bugs   lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    lindas-bugs    . "
                         " .           uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      uwes-bugs      bugs           bugs           bugs           bugs           bugs           bugs           . "
                         ;
    }    
}

@media (min-width: 1024px) {
    main {
    grid-template-areas: " hero-banner hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner "
                         " .           welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome         . "
                         " .           game-list      game-list      game-list      game-list      game-list      game-list      game-list      game-list      event-calendar event-calendar event-calendar event-calendar . "
                         " .           event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     event-list     . "
                         " .           martins-bugs   martins-bugs   martins-bugs   lindas-bugs    lindas-bugs    lindas-bugs    uwes-bugs      uwes-bugs      uwes-bugs      bugs           bugs           bugs  . "
                         ;
    }    
}


@media (min-width: 1600px) {
    main {
    grid-template-areas: " hero-banner hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner    hero-banner     hero-banner "
                         " .           welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome        welcome         . "
                         " .           game-list      game-list      game-list      game-list      event-list     event-list     event-list     event-list     event-list     event-list     event-calendar event-calendar  . "
                         " .           martins-bugs   martins-bugs   martins-bugs   lindas-bugs    lindas-bugs    lindas-bugs    uwes-bugs      uwes-bugs      uwes-bugs      bugs           bugs           bugs  . "
                         ;
    }    
}

#hero-banner {
    grid-area: hero-banner; 
}

#game-list {
    grid-area: game-list;
}

#event-calendar-list {
    grid-area: event-calendar;
}

#event-list {
    grid-area: event-list;
}

#martins-bugs {
    grid-area: martins-bugs;
}

#lindas-bugs{ 
    grid-area: lindas-bugs;
}

#uwes-bugs{ 
    grid-area: uwes-bugs;
}

#bugs {
    grid-area: bugs;
}

#welcome-text {
    grid-area: welcome;
}

/* responsive banner background */

/* no background image on the smalles devices 
#hero-banner {

}
*/

@media (min-width: 360px) {
    #hero-banner {
        background-image: url(../img_480/Banner_Home_1zu1.jpg.jpg);
    }        
}
@media (min-width: 360px) and (-webkit-min-device-pixel-ratio: 2),
       (min-width: 360px) and (min-resolution: 2dppx) {
 #hero-banner {
     background-image: url(../img_1080/Banner_Home_1zu1.jpg.jpg);
 }   
}     


@media (min-width: 480px) {
    #hero-banner {
        background-image: url(../img_768/Banner_Home_4zu3);
    }        
}
@media (min-width: 480px) and (-webkit-min-device-pixel-ratio: 2),
       (min-width: 480px) and (min-resolution: 2dppx) {
    #hero-banner {
        background-image: url(../img_1536/Banner_Home_4zu3.jpg.jpg);
    }        
}


@media (min-width: 960px) {
    #hero-banner {
        background-image: url(../img_1080/Banner_Home_Original.jpg.jpg);
    }        
}
@media (min-width: 960px) and (-webkit-min-device-pixel-ratio: 2),
       (min-width: 960px) and (min-resolution: 2dppx) {
    #hero-banner {
        background-image: url(../img_2160/Banner_Home_Original.jpg.jpg);
    }        
}


@media (min-width: 1200px) {
    #hero-banner {
        background-image: url(../img_2160/Banner_Home_Original.jpg.jpg);
    }        
}
@media (min-width: 1200px) and (-webkit-min-device-pixel-ratio: 2),
       (min-width: 1200px) and (min-resolution: 2dppx) {
    #hero-banner {
        background-image: url(../img_3840/Banner_Home_Original.jpg.jpg);
    }        
}
</pre></body></html>