// out: false
@import "../shared/styles.less";
@import "./styles/lib.less";

@baseHeight: 270px;
@baseWidth: 480px;
@scaleRatio: 1080 / @baseHeight;

html, body {
    height: 100%;
    padding: 0;
    margin: 0;
    font-family: @font-family;
    //height: 100%;
    pointer-events: none;
    /* 
        DIsable Text Selection 
        <https://stackoverflow.com/a/4407335>
    */
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE/Edge */
    user-select: none; /* non-prefixed version, currently
                                    not supported by any browser */
}

body {
    .hidden {
        display: none !important;
    }

    &.feed {
        #games {
            width: auto !important;
        }
    }

    .ownername {
        span {
            border-bottom: 1px solid @header-fgcolor;
        }
    }

    &, &[data-lang="en"] {
        &.flickr {
            #header:after {
                content: " (Images from Flickr)";
            }
        }

        &.unsplash {
            #header:after {
                content: " (Images from Unsplash)";
            }
        }

        .ownername:before {
            content: "by ";
        }

        #games.no-images:empty {
            background-image: url("./no-images-en.jpg");
        }
    }
    
    &[data-lang="nb"] {
        &.flickr {
            #header:after {
                content: " (bilder fra Flickr)";
            }
        }

        &.unsplash {
            #header:after {
                content: " (bilder fra Unsplash)";
            }
        }

        .ownername:before {
            content: "av ";
        }

        #games.no-images:empty {
            background-image: url("./no-images-nb.jpg");
        }
    }
    
    &[data-lang="nn"] {
        &.flickr {
            #header:after {
                content: " (bilder frå Flickr)";
            }
        }

        &.unsplash {
            #header:after {
                content: " (bilder frå Unsplash)";
            }
        }

        .ownername:before {
            content: "av ";
        }

        #games.no-images:empty {
            background-image: url("./no-images-nb.jpg");
        }
    }

    #header {
        background-color: @header-bgcolor;
        color: @header-fgcolor;
        font-family: @font-family;
        font-size: @font-size;
        padding: @header-padding;
        z-index: 1;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        font-weight: bold;

        &:before, &:after {
            font-weight: normal;
        }
    }

    .color-mixin;
}

.coin-slider {
    z-index: 0;
    //position: absolute;
    //bottom: 0;
    height: 100%;
}

#games {
    //margin: 0 auto;

    // Center horizontally (including IE11)
    left: 50%;
    transform: translateX(-50%);
    // See https://stackoverflow.com/q/25982135 for more information

    -moz-transform-origin: 50% 0;
    -moz-transform: translateX(-50%);

    background-repeat: no-repeat;
    background-size: @baseWidth auto; //480px auto;
    
    &:empty {
        background-size: 100%;
        height: 100%;
    }

    a.cs-games {
        background-size: @baseWidth auto; //480px auto;
    }

    .cs-title {
        width: 100%;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        background: @header-bgcolor;
        color: @header-fgcolor;
        font-size: @font-size / @scaleRatio; // / 4;

        .content {
            a {
                color: @accent-fgcolor1;
            }
        }
    }
}
