.col-10 {
    width: 10%;
    float: left;
}

.col-20 {
    width: 20%;
    float: left;
}

.col-30 {
    width: 30%;
    float: left;
}

.col-40 {
    width: 40%;
    float: left;
}

.col-50 {
    width: 50%;
    float: left;
}

.col-60 {
    width: 60%;
    float: left;
}

.col-80 {
    width: 80%;
    float: left;
}

.narrow {
    min-width: 25%;
    max-width: 25%;
}

/***
Profile pages 
 */

.profile-left {
    font-size: smaller;
    width: 25%;
}

.profile-left .row2 {
    max-width: 90%;
    margin: auto;
    padding: 5px;
}

#profile-heading .row2,
#profile-contents .row2 {
    max-width: none;
}

.profile-left .titlemedium {
    text-align: center;
    font-weight: bold;
    font-size: larger;
}

.profile-left a {
    color: var(--satin-sheen-gold);
}

.profile-left .tableborder>div {
    padding: 10px 0;
}

#profile-header h3,
#profile-header h4 {
    margin: 10px;
}

#post_search_results .maintitle {
    background: var(--middleBackground);
    font-size: smaller;
}

#post_search_results .tablebasic {
    font-size: smaller;
}

#post_search_results a {
    color: var(--satin-sheen-gold);
}

/***
Custom HTML Pages styling
*/

main {
    padding: 10px;
    margin: 10px 0;
    background: var(--topBackground);
    color: var(--lightText)
}

main>h1 {
    margin: 10px 0 30px;
    text-align: center;
}

main h3 {
    text-align: center;
    margin: 10px 0;
}

main td {
    padding: 5px 0;
}

.playerType,
.roleTemplate {
    text-align: center;
}

.keyAttribute {
    color: var(--key);
    border: 1px dashed var(--key);
    border-radius: 5px;
    padding: 0 5px;
}

.importantAttribute {
    color: var(--important);
    border: 1px dashed var(--important);
    border-radius: 5px;
    padding: 0 5px;
}

.tpeSum table,
.attributeTable {
    margin: 0 auto;
}

.tpeSum td,
.attributeTable table,
.attributeTable td {
    padding: 2px 5px;
}

.tpeSum input {
    max-width: 50px;
}

.attributeTable th,
td>.attributeCost,
#outfieldExtra,
.attributeSubmit,
.purchaseSubmit {
    text-align: center;
}

.popupBox #CODE {
    height: 250px;
    overflow-y: scroll;
}

.popupDescription {
    padding: inherit;
}

.popupDescription a {
    color: var(--satin-sheen-gold);
}

.copyButton {
    padding: inherit;
    text-align: center;
}

/* Player Store Style */
.storePurchases table {
    width: inherit;
}

.storePurchases h4 {
    text-align: center;
}

.storePurchases td {
    min-width: 5px;
    max-width: 5px;
}

.cart {
    display: flex;
}

.changeRows {
    display: inline;
}

.changeRows button {
    display: block;
}

#playerName,
#playerBank {
	padding: 5px;
	
	font-size: x-large;
}

.updateScale {
    font-size: small;
}

.updateScale table {
    text-align: center;
    border: 1px solid var(--borderColor);
    margin: 0 auto;
}

.updateScale table td,
.updateScale table th {
    border: 1px solid var(--borderColor);
}

.storePurchases li {
    list-style: square;
    padding-bottom: 5px;
}

.attributeTable td {
    vertical-align: top;
}

.attributeTable .attributeTable td {
    max-width: 130px;
}