/* border_base.css */
/* copyright 2007 Robert E Walker */

/* set position */

.image_border {
 position: relative;
 height: 100%;
}

.image_border,
.top,
.bottom {
 /* provide space for IE6 which has no left/right edges */
 /*padding-left: 16px; 
 padding-right: 16px;*/
}

.image_border > .top,
.image_border > .bottom {
 /* remove space for non-IE6 browsers */
 /*padding-left: 0;
 padding-right: 0;*/
}

.top {
 display: block;
 position: absolute;
 width: 100%;
 bottom: 100%;
 left: 0;
 background-color: transparent;
 background-position: top left;
 background-repeat: repeat-x;
 z-index: 1;
}

.right {
 display: none; /* hide from IE6 */
 position: absolute;
 height: 100%;
 top: 0;
 left: 100%;
 background-color: transparent;
 background-position: top right;
 background-repeat: repeat-y;
 z-index: 1;
}

.image_border > .right {
 display: block; /* show in all non-IE6 browsers */
}

.bottom {
 display: block;
 position: absolute;
 width: 100%;
 top: 100%;
 left: 0;
 background-color: transparent;
 background-position: bottom left;
 background-repeat: repeat-x;
 z-index: 1;
}

.left {
 display: none; /* hide from IE6 */
 position: absolute;
 height: 100%;
 top: 0;
 right: 100%;
 background-color: transparent;
 background-position: top left;
 background-repeat: repeat-y;
 z-index: 1;
}

.image_border > .left {
 display: block; /* show in all non-IE6 browsers */
}

.top_left {
 display: none; /* hide from IE6 */
 position: absolute;
 bottom: 100%;
 right: 100%;
 background-color: transparent;
 background-position: top left;
 background-repeat: no-repeat;
}

.image_border > .top_left {
 display: block;
}

.top_right {
 display: none; /* hide from IE6 */
 position: absolute;
 bottom:100%;
 left: 100%;
 background-color: transparent;
 background-position: top right;
 background-repeat: no-repeat;
}

.image_border > .top_right {
 display: block; /* show in all non-IE6 browsers */
}

.bottom_right {
 display: none; /* hide from IE6 */
 position: absolute;
 top: 100%;
 left: 100%;
 background-color: transparent;
 background-position: bottom right;
 background-repeat: no-repeat;
}

.image_border > .bottom_right {
 display: block; /* show in all non-IE6 browsers */
}

.bottom_left {
 display: none; /* hide from IE6 */
 position: absolute;
 top: 100%;
 right: 100%;
 background-color: transparent;
 background-position: bottom left;
 background-repeat: no-repeat;
}

.image_border > .bottom_left {
 display: block; /* show in all non-IE6 browsers */
}

.cap_left {
 position: absolute;
 bottom: 100%;;
 right: 100%;
 background-color: transparent;
 background-position: top right;
 background-repeat: no-repeat;
 z-index: 2;
}

.cap_right {
 position: absolute;
 bottom: 100%;
 left: 100%;
 background-color: transparent;
 background-position: top left;
 background-repeat: no-repeat;
 z-index: 2;
}

.cap_top {
 position: absolute;
 bottom: 100%;
 left: 0;
 background-color: transparent;
 background-position: bottom left;
 background-repeat: no-repeat;
 z-index: 2;
}

.cap_bottom {
 position: absolute;
 top: 100%;
 left: 0;
 background-color: transparent;
 background-position: top left;
 background-repeat: no-repeat;
 z-index: 2;
}

.cap_top_tee {
 display: block;
 position: relative;
 top: 0;
 margin-left: auto;
 margin-right: auto;
 background-color: transparent;
 background-position: center top;
 background-repeat: no-repeat;
 z-index: 2;
}

.cap_bottom_tee {
 display: block;
 position: relative;
 bottom: 0;
 margin-left: auto;
 margin-right: auto;
 background-color: transparent;
 background-position: center bottom;
 background-repeat: no-repeat;
 z-index: 2;
}

.inline_tee_down {
 position: absolute;
 top: 100%;
 left: 0;
 width: 100%;
 background-color: transparent;
 background-position: top center;
 background-repeat: no-repeat;
 z-index: 2;
}

.inline_tee_up {
 position: absolute;
 bottom: 100%;
 left: 0;
 width: 100%;
 background-color: transparent;
 background-position: bottom center;
 background-repeat: no-repeat;
 z-index: 2;
}

.ver_rule_bottom {
 position: absolute;
 top: 100%;
 width: 100%;
 background-color: transparent;
 background-position: top center;
 background-repeat: repeat-y;
 z-index: 1;
}

/* set default sizes for borders */

.top,
.top_left,
.top_right,
.cap_left,
.cap_right,
.cap_bottom_tee,
.inline_tee_down,
.hor_rule {
 height: 2px;
}

.right,
.top_right,
.bottom_right,
.cap_right {
 width: 2px;
}

.bottom,
.bottom_right,
.bottom_left,
.cap_top_tee,
.inline_tee_up {
 height: 2px;
}

.left,
.bottom_left,
.top_left,
.cap_left,
.cap_top_tee,
.cap_bottom_tee,
.ver_rule {
 width: 2px;
}

/* set fills, note that this is separate from all positioning styles for convenience of modding */

.top {
 background-color: black;
}

.right {
 background-color: black;
}

.bottom {
 background-color: black;
}

.left {
 background-color: black;
}

.top_left {
 background-color: black;
}

.top_right {
 background-color: black;
}

.bottom_right {
 background-color: black;
}

.bottom_left {
 background-color: black;
}

.cap_left {
 background-color: black;
}

.cap_right {
 background-color: black;
}

.cap_top {
 background-color: black;
}

.cap_bottom {
 background-color: black;
}

.cap_top_tee {
 background-color: black;
}

.cap_bottom_tee {
 background-color: black;
}

.inline_tee_down {
 background-color: black;
}

.inline_tee_up {
 background-color: black;
}

.hor_rule {
 width: 99%;
 position: relative;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 8px;
}

.hor_rule .top {
 top: 0;
}

.hor_rule .cap_left {
 top: 0;
 left: 0;
}

.hor_rule .cap_right {
 top: 0;
 right: 0;
}

.ver_rule {
 background-color: black;
}