﻿.mod
{
    position: relative;
    z-index: 0;
}
/*
    x1 = top and left edges; 
    x1a = top right corner; 
    x2 = right and bottom edges; 
    x2a = bottom left corner 
*/.mod .x1, .mod .x1a, .mod .x2, .mod .x2a
{
    display: block;
    background: transparent url(/images/glow.png) no-repeat;
    width: 100%;
    height: 100%;
    position: absolute;
}
.mod .x1
{
    background-position: 0 0;
    z-index: -2;
    top: -5px; /* set to the size of the glow */
    left: -5px;
    bottom: 0; /* set glow to the edges of 'mod' */
    padding: 0 5px 5px 0;
}
.mod .x1 .x1a
{
    height: 5px;
    width: 5px;
    background-position: 100% 0;
    right: -5px;
    top: 0;
}
.mod .x2
{
    background-position: 100% 100%;
    z-index: -1;
    bottom: -5px;
    right: -5px;
    padding: 5px 0 0 5px;
}
.mod .x2 .x2a
{
    height: 5px;
    width: 5px;
    background-position: 0 100%;
    left: -5px;
    bottom: 0;
}
