Difference between revisions of "MediaWiki:Common.css"

From BTAWiki
Jump to navigation Jump to search
m
(V1.7? Hopefully...)
 
(140 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
/* CSS placed here will be applied to all skins */
 
/* CSS placed here will be applied to all skins */
  
/** Infobox template **/
+
/* The following two items make table headers have their sorting indicator on the bottom and have the table header follow the page scroll. */
.infobox {
+
.jquery-tablesorter th.headerSort {
    background-color: #d4d4d4;
+
    background-position: center bottom;
    border: 1px solid #CCCCCC;
+
    padding: 3px 4px 8px;
    color: #1C1C1C;
 
    float: right;
 
    font-size: 11px;
 
    margin: 0px 0px 10px 2em;
 
    width: 270px;
 
 
}
 
}
.ibox .name,
+
 
.infobox .name {
+
.sortable thead {
    background: none repeat scroll 0% 0% #3A3A3A;
+
    position: sticky;
    color: #eeeeee;
+
    top:0;
    font-size: 16px;
 
    padding: 1em;
 
    text-align: center;
 
 
}
 
}
.ibox .image,
+
 
.infobox .image {
+
/* Makes images tagged with the 'percentwidth' class centered on the screen and scaled by screen width */
    height: 200px;
+
img.percentwidth {
    padding: 0.5em;
+
     width: 95%;
    text-align: center;
 
}
 
.ibox .category,
 
.infobox .category {
 
    background: none repeat scroll 0% 0% #3A3A3A;
 
    color: #eeeeee;
 
}
 
.ibox .category a,
 
.infobox .category a {
 
    color:#afd8ff;
 
}
 
.ibox .left,
 
.infobox .left {
 
    font-weight:700;
 
    background: none repeat scroll 0% 0% #3A3A3A;
 
    color: #eeeeee;
 
    text-align: right;
 
    padding-right: 5px;
 
}
 
.ibox .left a,
 
.infobox .left a {
 
    font-weight:700;
 
    color:#afd8ff;
 
}
 
.ibox .right,
 
.infobox .right {
 
    padding: 1px 5px;
 
    text-align: left;
 
    width: 60%;
 
}
 
 
/** Infobox horizontal**/
 
.ibox-hori {
 
    background-color: #d4d4d4;
 
    border: 1px solid #CCCCCC;
 
    color: #1C1C1C;
 
    float: left;
 
    font-size: 11px;
 
    margin: 0px 0px 10px 2em;
 
    width: 660px;
 
}
 
 
.ibox-hori .name {
 
    background: none repeat scroll 0% 0% #3A3A3A;
 
    color: #eeeeee;
 
    font-size: 16px;
 
    padding: 3px;
 
    text-align: center;
 
}
 
 
.ibox-hori .image {
 
    height: 200px;
 
    padding: 0.5em;
 
    text-align: center;
 
}
 
 
.ibox-hori .category {
 
    background: none repeat scroll 0% 0% #3A3A3A;
 
    color: #eeeeee;
 
}
 
 
.ibox-hori .category a {
 
    color:#afd8ff;
 
}
 
 
.ibox-hori .left {
 
    background: none repeat scroll 0% 0% #3A3A3A;
 
    color: #eeeeee;
 
    text-align: right;
 
    padding-right: 5px;
 
}
 
 
.ibox-hori .left a {
 
    color:#afd8ff;
 
}
 
 
.ibox-hori .right {
 
    padding: 1px 5px;
 
    text-align: left;
 
    width: 110px;
 
}
 
 
/***** Portable Infobox - styles of old class names ******/
 
/***** (to be removed ones new class names are released) *****/
 
 
.portable-infobox {
 
    background-color: #d4d4d4;
 
    border: 1px solid #CCCCCC;
 
    color: #1C1C1C;
 
    font-size: 11px;
 
    width: 268px;
 
    padding: 0px 0px 5px 0px;
 
}
 
 
.portable-infobox .item-type-key-val {
 
    box-sizing: border-box;
 
    display:table;
 
    width: 100%;
 
}
 
 
/* Limiting the width of the image in ModBox portable infobox to 250px */
 
.pi-theme-ModBox .pi-image-thumbnail {
 
     max-width: 250px;
 
 
     height: auto;
 
     height: auto;
 +
    display: block;
 +
    margin-left: auto;
 +
    margin-right: auto;
 
}
 
}
+
 
.portable-infobox .portable-infobox-item-label,
+
/* Allows for no wrapping text when desired in the 'Mech List. Makes all <span> tags used inside of a table cell inside of a wikitable object not wrap. Very specific to avoid this affecting unintended <span>s. */
.portable-infobox .portable-infobox-item-value {
+
.wikitable > * > tr > td span
    display: table-cell !important; /* needed for proper handling of tabber */
+
{
    padding-left: 7px;
+
white-space: nowrap;
    font-size: 11px;
 
}
 
 
.portable-infobox .portable-infobox-item-value {
 
    padding-top: 2px;
 
}
 
 
.tabberlive .tabbertab .portable-infobox h3.portable-infobox-item-label {
 
    display: table-cell !important; /* needed for proper handling of tabber */
 
}
 
 
.portable-infobox .portable-infobox-item-label {
 
    padding-left: 10px;
 
    width: 89px;
 
    background: none repeat scroll 0% 0% #3A3A3A;
 
    color: #eeeeee;
 
    text-align: right;
 
    padding-right: 5px;
 
    vertical-align: middle;
 
}
 
 
.portable-infobox .portable-infobox-item-label a {
 
    color: #afd8ff;
 
}
 
 
.portable-infobox .item-type-key-val:not(:last-of-type) {
 
    border-bottom: 0px;
 
}
 
 
/** Styling section headers **/
 
 
.portable-infobox .item-type-header .portable-infobox-secondary-font {
 
    font-size: 11px;
 
    padding: 2px;
 
    color: #eeeeee;
 
 
}
 
}
+
 
.portable-infobox .portable-infobox-item-margins {
+
/*Make tab container 100% width regardless of content, primarily used for the individual 'Mech Pages*/
    padding: 2px 4px 0px 4px;
+
.tabs-content
    min-height: 26px;
+
{
 +
width: 100%;
 
}
 
}
+
 
.portable-infobox .item-type-header {
+
 
    background-color: #3A3A3A;
+
/* Styles for InfoboxVariant template (https://www.bta3062.com/index.php/Template:InfoboxVariant) */
    margin: 2px 4px 0px 4px;
+
.infoboxvariant
    height: 24px;
+
{
    text-align: center;
+
background-color: #dddddd;
    min-height: 0px;
+
border: 1px solid #CCCCCC;
 +
font-size: 11px;
 +
color: #1C1C1C;
 +
float: right;
 +
margin: 0px 0px 10px 2em;
 +
width: 280px;
 
}
 
}
+
 
.portable-infobox .item-type-title {
+
.infoboxvariant th
    background-color: #3A3A3A;
+
{
    color: #eeeeee;
+
vertical-align: middle;
    font-size: 16px;
+
width: 35%;
    padding: 1em;
+
font-weight: 700;
    text-align: center;
+
text-align: right;
    margin: 4px;
+
padding-right: 5px;
 +
background: none repeat scroll 0% 0% #3A3A3A;
 +
color: #eeeeee;
 
}
 
}
+
 
/***** Portable Infobox - styles for new class names *****/
+
.infoboxvariant td
/***** (changes to be announced soon) *****/
+
{
+
vertical-align: top;
.portable-infobox {
+
width: 65%;
    background-color: #d4d4d4;
+
color: #1C1C1C;
    border: 1px solid #CCCCCC;
+
font-weight: 100;
    color: #1C1C1C;
+
text-align: left;
    font-size: 11px;
+
padding: 1px 5px;
    width: 268px;
 
    padding: 0px 0px 5px 0px;
 
 
}
 
}
+
 
.portable-infobox .pi-data {
+
.infoboxvariant .variantequipment
    box-sizing: border-box;
+
{
    display:table;
+
vertical-align: top;
    width: 100%;
+
width: 65%;
 +
color: #1C1C1C;
 +
font-weight: 150;
 +
text-align: left;
 +
padding: 1px 5px;
 
}
 
}
+
 
.portable-infobox .pi-data-label,
+
.infoboxvariant .infobox-variantname
.portable-infobox .pi-data-value {
+
{
    display: table-cell !important; /* needed for proper handling of tabber */
+
color: #eeeeee;
    padding-left: 7px;
+
font-size: 16px;
    font-size: 11px;
+
font-weight: bold;
    vertical-align: middle;
+
padding: 1em;
 +
text-align: center;
 
}
 
}
+
 
.portable-infobox .pi-data-value {
+
.infoboxvariant .infobox-variantloadoutimage
    padding-top: 2px;
+
{
 +
padding: 0.5em;
 +
text-align: center;
 +
width: auto;
 +
height: 256;
 +
background-color: #dddddd;
 +
colspan: 2;
 
}
 
}
+
 
.tabberlive .tabbertab .portable-infobox h3.pi-data-label {
+
 
    display: table-cell !important; /* needed for proper handling of tabber */
+
/* Styles for the InfoboxPilot template (https://www.bta3062.com/index.php/Template:InfoboxPilot) */
 +
.infoboxpilot
 +
{
 +
background-color: #dddddd;
 +
border: 1px solid #CCCCCC;
 +
font-size: 11px;
 +
color: #1C1C1C;
 +
float: right;
 +
margin: 0px 0px 10px 2em;
 +
width: 280px;
 
}
 
}
+
 
.portable-infobox .pi-data-label {
+
.infoboxpilot th
    padding-left: 9px;
+
{
    width: 90px;
+
vertical-align: middle;
    background: none repeat scroll 0% 0% #3A3A3A;
+
width: 35%;
    color: #eeeeee;
+
font-weight: 700;
    text-align: right;
+
text-align: right;
    padding-right: 5px;
+
padding-right: 5px;
    vertical-align: middle;
+
background: none repeat scroll 0% 0% #3A3A3A;
 +
color: #eeeeee;
 
}
 
}
+
 
.pi-theme-ModBox .pi-data-label  {
+
.infoboxpilot td
    width: 88px;
+
{
 +
vertical-align: top;
 +
width: 65%;
 +
color: #1C1C1C;
 +
font-weight: 100;
 +
text-align: left;
 +
padding: 1px 5px;
 
}
 
}
+
 
.portable-infobox .pi-data-label a {
+
.infoboxpilot .pilotability
    color: #afd8ff;
+
{
 +
vertical-align: middle;
 +
width: 65%;
 +
color: #1C1C1C;
 +
font-weight: 200;
 +
font-size: 13px;
 +
text-align: center;
 +
padding: 1px 5px;
 
}
 
}
+
 
.portable-infobox .pi-item:not(:last-of-type) {
+
.infoboxpilot .infobox-pilotname
    border-bottom: 0px;
+
{
 +
color: #eeeeee;
 +
font-size: 16px;
 +
font-weight: bold;
 +
padding: 1em;
 +
text-align: center;
 
}
 
}
+
 
/** Styling Syndicates themes **/
+
.infoboxpilot .infobox-pilotimage
.pi-theme-steel .pi-image {
+
{
    background-color:#2C3F46;
+
padding: 0.5em;
 +
text-align: center;
 +
width: 256;
 +
height: 256;
 +
background-color: #dddddd;
 +
colspan: 2;
 
}
 
}
.pi-theme-hexis .pi-image {
+
 
    background-color:#374045;
+
.infoboxpilot .pilottag
 +
{
 +
vertical-align: top;
 +
width: 140px;
 +
color: #1C1C1C;
 +
font-weight: 100;
 +
text-align: left;
 +
padding: 1px 5px;
 
}
 
}
.pi-theme-suda .pi-image {
+
 
    background-color:#3D375D;
+
/* Styles for InfoboxTurret template (https://www.bta3062.com/index.php/Template:InfoboxTurret) */
 +
.infoboxturret
 +
{
 +
background-color: #dddddd;
 +
border: 1px solid #CCCCCC;
 +
font-size: 11px;
 +
color: #1C1C1C;
 +
float: right;
 +
margin: 0px 0px 10px 2em;
 +
width: 280px;
 
}
 
}
.pi-theme-perrin .pi-image {
+
 
    background-color:#3D4963;
+
.infoboxturret th
 +
{
 +
vertical-align: middle;
 +
width: 35%;
 +
font-weight: 700;
 +
text-align: right;
 +
padding-right: 5px;
 +
background: none repeat scroll 0% 0% #3A3A3A;
 +
color: #eeeeee;
 
}
 
}
.pi-theme-redveil .pi-image {
+
 
    background-color:#3D1839;
+
.infoboxturret td
 +
{
 +
vertical-align: top;
 +
width: 65%;
 +
color: #1C1C1C;
 +
font-weight: 100;
 +
text-align: left;
 +
padding: 1px 5px;
 
}
 
}
.pi-theme-loka .pi-image {
+
 
    background-color:#2A3C2E;
+
.infoboxturret .turretequipment
 +
{
 +
vertical-align: top;
 +
width: 65%;
 +
color: #1C1C1C;
 +
font-weight: 150;
 +
text-align: left;
 +
padding: 1px 5px;
 
}
 
}
.pi-theme-conclave .pi-image {
+
 
    background-color:black;
+
.infoboxturret .infobox-turretname
 +
{
 +
color: #eeeeee;
 +
font-size: 16px;
 +
font-weight: bold;
 +
padding: 1em;
 +
text-align: center;
 
}
 
}
.pi-theme-simaris .pi-image {
+
 
    background-color:#5F3C0D;
+
.infoboxturret .infobox-turretloadoutimage
 +
{
 +
padding: 0.5em;
 +
text-align: center;
 +
width: auto;
 +
height: 256;
 +
background-color: #dddddd;
 +
colspan: 2;
 
}
 
}
.pi-theme-ostron .pi-image {
+
 
    background-color:#B74624;
+
/* Styles for the Navigation Box template (https://www.bta3062.com/index.php/Template:NavigationBox), primarily used on the Main Page. */
 +
.navigationbox
 +
{
 +
display: inline-block;
 +
text-align: left;
 +
vertical-align: top;
 +
background-color: #FFFFFF;
 +
border: 1px solid #CCCCCC;
 +
font-size: 12px;
 +
color: #000000;
 +
margin: 0px 0px 3px 1em;
 +
width: 31%;
 +
float: center;
 
}
 
}
.pi-theme-quills .pi-image {
+
 
    background-color:#F7FACB;
+
.navigationbox table
 +
{
 +
width: 100%;
 +
height: 100%;
 +
float: center;
 +
border: 0px;
 +
margin: 0px;
 +
padding: 0px 0px;
 
}
 
}
+
 
/** Styling section headers **/
+
.navigationbox th
+
{
.portable-infobox .pi-header.pi-secondary-font {
+
vertical-align: middle;
    font-size: 11px;
+
width: 35%;
    padding: 2px;
+
font-weight: bold;
    color: #eeeeee;
+
text-align: left;
 +
padding-right: 5px;
 +
background: #dddddd;
 +
color: #eeeeee;
 
}
 
}
+
 
.portable-infobox .pi-item-spacing {
+
.navigationbox td
    padding: 2px 4px 0px 4px;
+
{
    min-height: 26px;
+
width: 65%;
 +
color: #000000;
 +
font-weight: normal;
 +
text-align: left;
 +
vertical-align: middle;
 +
padding: 1px 5px;
 
}
 
}
+
 
.portable-infobox .pi-header {
+
.navigationbox .boxtitle
    background-color: #3A3A3A;
+
{
    margin: 2px 4px 0px 4px;
+
color: #000000;
    text-align: center;
+
font-size: 18px;
    min-height: 0px;
+
font-weight: bold;
 +
padding: 1em;
 +
text-align: center;
 +
background: #dddddd;
 
}
 
}
+
 
.portable-infobox .pi-title {
+
/* Styles for InfoboxFaction template (https://www.bta3062.com/index.php/Template:InfoboxFaction) */
    background-color: #3A3A3A;
+
.infoboxfaction
    color: #eeeeee;
+
{
    font-size: 16px;
+
background-color: #dddddd;
    padding: 1em;
+
border: 1px solid #CCCCCC;
    text-align: center;
+
font-size: 11px;
    margin: 4px;
+
color: #1C1C1C;
 +
float: right;
 +
margin: 0px 0px 10px 2em;
 +
width: 280px;
 
}
 
}
+
 
/** Styling image tabbers **/
+
.infoboxfaction th
+
{
.portable-infobox .pi-image-collection-tabs li {
+
vertical-align: middle;
    background: transparent;
+
width: 35%;
    border: 1px solid transparent;
+
font-weight: 700;
 +
text-align: right;
 +
padding-right: 5px;
 +
background: none repeat scroll 0% 0% #3A3A3A;
 +
color: #eeeeee;
 
}
 
}
.pi-image-collection-tab-content {
+
 
    background-color:transparent;
+
.infoboxfaction td
 +
{
 +
vertical-align: top;
 +
width: 65%;
 +
color: #1C1C1C;
 +
font-weight: 100;
 +
text-align: left;
 +
padding: 1px 5px;
 
}
 
}
ul.pi-image-collection-tabs {
+
 
    font-family:Roboto;
+
.infoboxfaction .factionname
    font-weight:300;
+
{
    font-size:15px;
+
color: #eeeeee;
 +
font-size: 16px;
 +
font-weight: bold;
 +
padding: 1em;
 +
text-align: center;
 
}
 
}
+
 
ul.pi-image-collection-tabs li.current {
+
.infoboxfaction .factionimage
    font-weight:300;
+
{
    color:#3366FF;
+
padding: 0.5em;
    background:transparent;
+
text-align: center;
 +
width: auto;
 +
height: 256;
 +
background-color: #dddddd;
 +
colspan: 2;
 
}
 
}

Latest revision as of 21:46, 18 April 2023

/* CSS placed here will be applied to all skins */

/* The following two items make table headers have their sorting indicator on the bottom and have the table header follow the page scroll. */
.jquery-tablesorter th.headerSort {
    background-position: center bottom;
    padding: 3px 4px 8px;
}

.sortable thead {
    position: sticky;
    top:0;
}

/* Makes images tagged with the 'percentwidth' class centered on the screen and scaled by screen width */
img.percentwidth {
    width: 95%;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* Allows for no wrapping text when desired in the 'Mech List. Makes all <span> tags used inside of a table cell inside of a wikitable object not wrap. Very specific to avoid this affecting unintended <span>s. */
.wikitable > * > tr > td span 
{
	white-space: nowrap;
}

/*Make tab container 100% width regardless of content, primarily used for the individual 'Mech Pages*/
.tabs-content
{
	width: 100%;
}


/* Styles for InfoboxVariant template (https://www.bta3062.com/index.php/Template:InfoboxVariant) */
.infoboxvariant
{
	background-color: #dddddd;
	border: 1px solid #CCCCCC;
	font-size: 11px;
	color: #1C1C1C;
	float: right;
	margin: 0px 0px 10px 2em;
	width: 280px;
}

.infoboxvariant th 
{
	vertical-align: middle;
	width: 35%;
	font-weight: 700;
	text-align: right;
	padding-right: 5px;
	background: none repeat scroll 0% 0% #3A3A3A;
	color: #eeeeee;
}

.infoboxvariant td 
{
	vertical-align: top;
	width: 65%;
	color: #1C1C1C;
	font-weight: 100;
	text-align: left;
	padding: 1px 5px;
}

.infoboxvariant .variantequipment
{
	vertical-align: top;
	width: 65%;
	color: #1C1C1C;
	font-weight: 150;
	text-align: left;
	padding: 1px 5px;
}

.infoboxvariant .infobox-variantname
{
	color: #eeeeee;
	font-size: 16px;
	font-weight: bold;
	padding: 1em;
	text-align: center;
}

.infoboxvariant .infobox-variantloadoutimage
{
	padding: 0.5em;
	text-align: center;
	width: auto;
	height: 256;
	background-color: #dddddd;
	colspan: 2;
}


/* Styles for the InfoboxPilot template (https://www.bta3062.com/index.php/Template:InfoboxPilot) */
.infoboxpilot
{
	background-color: #dddddd;
	border: 1px solid #CCCCCC;
	font-size: 11px;
	color: #1C1C1C;
	float: right;
	margin: 0px 0px 10px 2em;
	width: 280px;
}

.infoboxpilot th 
{
	vertical-align: middle;
	width: 35%;
	font-weight: 700;
	text-align: right;
	padding-right: 5px;
	background: none repeat scroll 0% 0% #3A3A3A;
	color: #eeeeee;
}

.infoboxpilot td 
{
	vertical-align: top;
	width: 65%;
	color: #1C1C1C;
	font-weight: 100;
	text-align: left;
	padding: 1px 5px;
}

.infoboxpilot .pilotability
{
	vertical-align: middle;
	width: 65%;
	color: #1C1C1C;
	font-weight: 200;
	font-size: 13px;
	text-align: center;
	padding: 1px 5px;
}

.infoboxpilot .infobox-pilotname
{
	color: #eeeeee;
	font-size: 16px;
	font-weight: bold;
	padding: 1em;
	text-align: center;
}

.infoboxpilot .infobox-pilotimage
{
	padding: 0.5em;
	text-align: center;
	width: 256;
	height: 256;
	background-color: #dddddd;
	colspan: 2;
}

.infoboxpilot .pilottag
{
	vertical-align: top;
	width: 140px;
	color: #1C1C1C;
	font-weight: 100;
	text-align: left;
	padding: 1px 5px;
}

/* Styles for InfoboxTurret template (https://www.bta3062.com/index.php/Template:InfoboxTurret) */
.infoboxturret
{
	background-color: #dddddd;
	border: 1px solid #CCCCCC;
	font-size: 11px;
	color: #1C1C1C;
	float: right;
	margin: 0px 0px 10px 2em;
	width: 280px;
}

.infoboxturret th 
{
	vertical-align: middle;
	width: 35%;
	font-weight: 700;
	text-align: right;
	padding-right: 5px;
	background: none repeat scroll 0% 0% #3A3A3A;
	color: #eeeeee;
}

.infoboxturret td 
{
	vertical-align: top;
	width: 65%;
	color: #1C1C1C;
	font-weight: 100;
	text-align: left;
	padding: 1px 5px;
}

.infoboxturret .turretequipment
{
	vertical-align: top;
	width: 65%;
	color: #1C1C1C;
	font-weight: 150;
	text-align: left;
	padding: 1px 5px;
}

.infoboxturret .infobox-turretname
{
	color: #eeeeee;
	font-size: 16px;
	font-weight: bold;
	padding: 1em;
	text-align: center;
}

.infoboxturret .infobox-turretloadoutimage
{
	padding: 0.5em;
	text-align: center;
	width: auto;
	height: 256;
	background-color: #dddddd;
	colspan: 2;
}

/* Styles for the Navigation Box template (https://www.bta3062.com/index.php/Template:NavigationBox), primarily used on the Main Page. */
.navigationbox
{
	display: inline-block;
	text-align: left;
	vertical-align: top;
	background-color: #FFFFFF;
	border: 1px solid #CCCCCC;
	font-size: 12px;
	color: #000000;
	margin: 0px 0px 3px 1em;
	width: 31%;
	float: center;
}

.navigationbox table
{  
	width: 100%;
	height: 100%;
	float: center;
	border: 0px;
	margin: 0px;
	padding: 0px 0px;
}

.navigationbox th
{
	vertical-align: middle;
	width: 35%;
	font-weight: bold;
	text-align: left;
	padding-right: 5px;
	background: #dddddd;
	color: #eeeeee;
}

.navigationbox td 
{
	width: 65%;
	color: #000000;
	font-weight: normal;
	text-align: left;
	vertical-align: middle;
	padding: 1px 5px;
}

.navigationbox .boxtitle
{
	color: #000000;
	font-size: 18px;
	font-weight: bold;
	padding: 1em;
	text-align: center;
	background: #dddddd;
}

/* Styles for InfoboxFaction template (https://www.bta3062.com/index.php/Template:InfoboxFaction) */
.infoboxfaction
{
	background-color: #dddddd;
	border: 1px solid #CCCCCC;
	font-size: 11px;
	color: #1C1C1C;
	float: right;
	margin: 0px 0px 10px 2em;
	width: 280px;
}

.infoboxfaction th 
{
	vertical-align: middle;
	width: 35%;
	font-weight: 700;
	text-align: right;
	padding-right: 5px;
	background: none repeat scroll 0% 0% #3A3A3A;
	color: #eeeeee;
}

.infoboxfaction td 
{
	vertical-align: top;
	width: 65%;
	color: #1C1C1C;
	font-weight: 100;
	text-align: left;
	padding: 1px 5px;
}

.infoboxfaction .factionname
{
	color: #eeeeee;
	font-size: 16px;
	font-weight: bold;
	padding: 1em;
	text-align: center;
}

.infoboxfaction .factionimage
{
	padding: 0.5em;
	text-align: center;
	width: auto;
	height: 256;
	background-color: #dddddd;
	colspan: 2;
}