﻿.right { float: right; }
.left { float: left; }
.center { text-align: center; }
.bold { font-weight: bold; }
/* ^ Needed as there's no comparable classes in the central stylesheet */

.richtext table { overflow-x: auto; border: 1px solid #eaeaea; border-top: 0;  } /* Needed as there's no styling yet for basic responsive tables */
.richtext table th, .richtext table td { min-width: 0; } /* Needed so we can have really narrow table columns */
.richtext table tr th { font-weight: 700; line-height: 1.125em; letter-spacing: 0; /*background-color: #333;  color: #fff; border-bottom: 1px solid #666;*/ } /* No styling for table stuff yet, hence the need for this */
.richtext table tr.alt { background-color: #fff; } /* Alternating row colours */
.richtext table { table-layout: auto; }
.richtext table.module-selection th, .richtext table.module-selection td { vertical-align: top; }

.richtext h3 { font-size: 22px; } /* Font size increase of 1px needed to prevent the dot on the i disappearing due to font differences (might not need this on live) */
.richtext .muted-red li { color: #db4433; } /* For validation groups, so that li children are also red */

.richtext .vertical-table th { font-weight: 500; }

.select-module .button { color: #000; min-width: 7.5em; } /* Not entirely sure why I needed to do this, but I did. It was showing in red or purple on some buttons */

.richtext .module-row table tr th { font-weight: 400; text-align: right; } /* No styling for table stuff yet, hence the need for this */
.module-row { display: flex; margin-top: 4em; }
.module-row div { width: 40%; margin-right: 2em; }
.module-row div:last-child { margin-right: 0; }
.module-row .heading { width: 20%; text-align: right; }
/* ^ For module comparison page (two column layout). Almost certain I should be using the grid layout stuff, so this will likely be replaced at some point */

input[type="text"], button, select { font-family: 'akzidenz-grotesk'; } /* For some reason buttons don't show the Akzidenz font locally, so that's what this is for */

.form .input-error-message li { color: #db4433; font-size: .75rem; font-weight: 500; } /* By default, list items within div.input-error-message aren't shown as red */
.disabled a:link,
.disabled a:visited,
.disabled a:hover,
.disabled a:active,
button.disabled,
button.button.disabled:hover
{
    color: #CCC;
    cursor: not-allowed;
    border-color: #CCC;
} /* Just a temporary thing until Georgia adds this to the central stylesheet */

.form-field__input::placeholder { font-family: 'akzidenz-grotesk'; font-weight: 700; color: #aaa; } /* Will only be needed if Georgia can't fix the @blur @focus issue (input value not remembered on postback) */
