﻿* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

/* = Reset
----------------------------------------------------------------------------------------------------------------- */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, hr, a, a img, font, img, dd, dl, dt, li, ol, ul, blockquote, fieldset, form, label, legend, table, caption, tr, th, td { margin: 0; padding: 0; border: 0; font-size: 100%; }

/* = HTML5 Elements
----------------------------------------------------------------------------------------------------------------- */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
audio, canvas, video { display: inline-block; }

html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
/* Only for responsive sites take out if not needed */

/* = Body
----------------------------------------------------------------------------------------------------------------- */
body { color: #222; font-size: 1em; text-align: left;  font-family: "Source Sans 3", sans-serif; font-weight: 300; background: #fff; }

/* = Typography
----------------------------------------------------------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 { margin: 0 0 14px; color: #222; font-family: "Playfair Display", serif; font-weight: 300; }
h1 { font-size: 1.9em; font-weight: 600; }
h2 { font-size: 1.7em; }
h3 { font-size: 1.4em; }
h4 { font-size: 1.3em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1.1em; }

p { margin: 0 0 14px; line-height: 1.6em; font-size: 1.1em; }
p:last-child { margin-bottom: 0;}

blockquote { margin: 0 0 20px; }
blockquote p { margin: 0; }
blockquote cite { font-size: 1em; }

a { color: #222; text-decoration: none; }
a:hover { color: #222; text-decoration: none; }

img { vertical-align: bottom; height: auto; max-width: 100%; -ms-interpolation-mode: bicubic; }
hr { margin: 24px 0; height: 1px; border: 0; border-top: 1px solid #e6e6e6; }
small { font-size: 0.8em; }
address { margin: 0 0 20px; line-height: 1.5em; font-style: normal; }

sub, sup { line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

pre { margin: 0; }
pre code { font-size: 1.5em; white-space: pre-wrap; }

figure { margin: 0 0 20px; }
figcaption { padding-top: 10px; color: #777; font-size: 0.8em; }

.floatLeft { float: left; }
.floatRight { float: right; }
.hide { display: none; }
.hideText { text-indent: 100%; white-space: nowrap; overflow: hidden; }
.clr { clear: both; }
.leader { font-size: 1.4em;  font-family: "Source Sans 3", sans-serif; font-weight: 300; color: #222; }
.leaderLarge { font-size: 1.6em; }

.textLeft { text-align: left; }
.textCenter { text-align: center; }
.textRight { text-align: right; }
.highlight { color: #333;  background: #ffff2b; }
.marked { color: #fff; background: #333; }
.meta { color: #666; font-style: italic; font-size: 0.9em; margin-bottom: 10px; }
.lrgfont { font-size: 3em; }
.fixed { position: fixed; top: 20px; }

@media screen and (min-width:601px) {
.textCenterDT { text-align: center;}
}


@media screen and (max-width:480px) {
h1 { font-size: 1.75em; }
h2 { font-size: 1.55em; }
}



/* = Colours
----------------------------------------------------------------------------------------------------------------- */
.block { display: inline-block; padding: 50px 50px 10px 20px; font-weight: bold; }

/* = Buttons
----------------------------------------------------------------------------------------------------------------- */
.btn { display: inline-block; padding: 8px 14px; line-height: 1.2; color: #222; font-weight: 600; outline: none; cursor: pointer; border: 1px solid #222; background: transparent;     font-family: "Playfair Display", serif; border-radius: 2px; vertical-align: middle; }
.btn:hover { color: #fff; background-color: #222; }
.btnImpact { color:#fff; border-color: #333; background: #333; }
.btnBack { float: right; font-size: 100%; }
.btnSearch {     padding: 9px 16px; }

input.btn { font-size: 1em; line-height: 1.2; }

/* = Lists
----------------------------------------------------------------------------------------------------------------- */
ul { margin: 0 0 20px 18px; line-height: 1.5em; }
ul li { margin: 0 0 10px; }
ul li ul { margin-top: 20px; margin-left: 30px; list-style-type: circle; }

ol { margin: 0 0 4px 0; line-height: 1.75em; font-size: 1.15em; list-style: none; counter-reset: section; }
ol li { padding-left: 40px; margin: 0 0 20px; counter-increment: item; position: relative; }
ol li:before { counter-increment: section; content: counters(section,".") " "; width: 30px; height: 30px; line-height: 30px; background: #333; border-radius: 100%; color: #fff; text-align: center; position: absolute; left: 0; top: 50%; margin-top: -15px; }
ol li:last-of-type { margin-bottom: 0; }

ol li ol { margin-top: 20px; margin-left: 30px; }
ol li ol li:before { font-size: 0.6em; width: 26px; height: 26px; line-height: 26px; }

dl { margin: 0 0 20px; line-height: 1.5em; font-size: 1.15em; }
dt { color: #111; font-weight: bold; }
dd { margin: 0 0 20px; }

.inline { margin-left: 0; list-style: none; }
.inline li { display: inline; margin: 0 15px 0 0; }

.breadcrumb ul { margin-left: 0; list-style: none; }
.breadcrumb ul li { display: inline-block; margin: 0 10px 0 0; min-width: 14px; }
.breadcrumb ul li.divide { min-width: 0px; }

.paging { margin: 0 0 18px; line-height: 1.75em; font-size: 1.15em; font-weight: bold; }
.paging .detailsText { color: #222;    font-weight: 600;  }
.paging ul { margin: 0; list-style: none; display: flex; align-items: center; gap:6px; }
.paging ul li { margin:0; line-height: 1; }
.paging ul li.det { padding-right: 10px; font-size: 14px; }
.paging ul li a { display: block;
    width: 26px;
    height: 26px;
    line-height: 24px;
    border: 1px solid #CAD1D6;
    color: #333;
    text-align: center;
    font-size: 14px;
    font-weight: 600; }
.paging ul li a:hover { background: #333; color: #fff; }
.paging ul li a.on { background: #ddd; border-color: #ddd; color: #fff; }

.pagingClr { display: none;}

.paging .inner { display: flex; align-items: center; justify-content: space-between; }

@media screen and (max-width:480px) {
.paging .inner { display: block; }
.paging .inner  .text { margin-bottom: 10px;}

    .paging ul { gap:5px;}
    .paging ul li a  {
            width: 22px;
        height: 22px;
        line-height: 20px;
            font-size: 13px;
    }

    .paging ul li.det {
        padding-right: 5px;
        font-size: 12px;
    }
}

/* = Tables
----------------------------------------------------------------------------------------------------------------- */
table { width: 100%; margin: 0 0 20px; border-spacing: 0; border-collapse: collapse; }
th { padding: 10px 10px 10px 0; margin-bottom: 20px; font-size: 1.1em;  font-weight: 600;}
tr:nth-child(even) td { background: #f8f8f8; }
td { padding: 10px; line-height: 1.4; border: 1px solid #e5e5e5; background: #fff; }
.rowItemStandout td { color: #222; background: #d8e9de; }
.tableButtonCol { min-width: 150px; }

.tableWrap { overflow: auto;}

/* = Screen Messages
----------------------------------------------------------------------------------------------------------------- */
.msg { margin: 0 0 20px; padding: 20px; background: #E6E5E1; }
.msg p { margin-bottom: 0; }
.msg ul { margin-bottom: 0; font-size: 1.15em; }
.msg ul li { margin-bottom: 5px; }

.msgImp { padding-left: 65px; color: #fff; background: #333 url(/_img/icons/important.svg) no-repeat 30px center; }
.msgImp a { color: #fff; font-weight: bold; }
.msgError { padding-left: 65px; color: #fff; background: #d67189 url(/_img/icons/error.svg) no-repeat 20px center; }
.msgError a { color: #fff; font-weight: bold; }
.msgSuccess { padding-left: 65px; color: #fff; background: #CAD1D6 url(/_img/icons/success.svg) no-repeat 20px center; }
.msgSuccess h3 { color: #fff; margin: 0 0 10px; }
.msgSuccess a { color: #fff; font-weight: bold; }
.msgAssist { background-color: #E6E5E1; }

/* = Columns
----------------------------------------------------------------------------------------------------------------- */
.colsHalf .col { width: 47%; float: left; margin-right: 6%; }
.colsThird .col { width: 32%; float: left; margin-right: 2%; }
.colsFourth .col { width: 22%; float: left; margin-right: 4%; }
.cols .endCol { margin-right: 0; }

.cols { margin: 0 0 20px; }
.cols p:last-of-type { margin-bottom: 0; }

.colsTwoThird .col { width: 35%; float: left; margin-right: 5%; }
.colsTwoThird .firstCol { max-width: 350px; width:auto; }
.colsTwoThird .endCol { width: 60%; float: left; margin-right: 0; }

.colsThreeFourth .col { width: 70%; float: left; margin-right: 5%; }
.colsThreeFourth .endCol { width: 25%; float: left; margin-right: 0; }

/* = Modules
----------------------------------------------------------------------------------------------------------------- */
.module h3 { margin: 0 0 10px; }

/* = Tabs
----------------------------------------------------------------------------------------------------------------- */
.tabs { margin: 0 0 20px; }
.tabs ul { margin: 0; list-style: none; }
.tabs ul li { display: inline; margin: 0 20px 0 0; }
.tabs ul li a { display: inline-block; color: #000; }
.tabs ul li a:hover { color: #666; }
.tabs ul li a.on { color: #333; }

.tabs .panel { padding: 20px 0 0; }

/* = Accordions
----------------------------------------------------------------------------------------------------------------- */
.accordion { margin: 0 0 20px; }
.accordion h3 { display: block; text-align: center; color: #fff; margin: 0 0 10px; padding: 10px 15px; background: #080808; }
.accordion h3:hover { cursor: pointer; background: #333; }
.accordion h3.on { background: #333; }
.accordion .content { display: none; }
.accordion .content.contentopen { display: block; }

/* = Forms
----------------------------------------------------------------------------------------------------------------- */
.webForm { margin-top: 20px; }
.webForm div { margin: 0 0 18px; clear: left; }
.webForm div em { display: block; margin-left: 25%; margin-top: 10px; }
.webForm div:last-child { margin-bottom: 0; }

label { width: 28%; float: left; padding: 10px 0; font-size: 1.1em; }
input.text, textarea, select { width: 72%; padding: 8px 12px; border: 1px solid #222;  border-radius: 2px; font-size: 1em;  font-family: "Source Sans 3", sans-serif;  vertical-align: middle; background: #fff; }
input.text:focus, textarea:focus, select:focus { outline: none; box-shadow: 3px 3px 0px #0f0f0f; }
input.file { margin: 8px 0; }
textarea { min-height: 100px; resize: none; }
.labelhide { display: none; }

.formList { display: inline-block; padding: 8px 0; line-height: 1.5em; }
.formList label { width: auto; padding: 0 10px 0 0; float: none; }
.formList input { width: auto; margin: 0 10px 0 0; padding: 0; border: 0; }

.checkbox { display: inline-block; padding: 12px 0 0; }
.checkbox input { float: left; margin: 0; padding: 0; border: 0; }

.check { display: inline-block; padding: 12px 0 0; }
.check input { float: left; margin: 0; padding: 0; border: 0; }

.labelfullwidth div { clear: left; margin: 0 0 10px; }
.labelfullwidth div .label { width: 100%; padding: 0 0 10px; }
.labelfullwidth label.labelhide { display: none; }
.labelfullwidth input.text, .labelfullwidth textarea, .labelfullwidth select { width: 100%; }
.labelfullwidth .formList { width: 100%; float: left; margin: 0 0 10px; }
.labelfullwidth .formList input { float: left; margin: 3px 5px 0 0; }
.labelfullwidth .formList label { width: auto; float: none; padding: 0; }
.labelfullwidth .formList br { clear: left; }

.white-popup { position: relative; background: #FFF; padding: 20px; width: auto; max-width: 700px; margin: 20px auto; border: 3px solid #d6d6d6; }
.white-popup hr { margin: 20px 0; }

/* = No SVG / IE8 < Fallbacks
----------------------------------------------------------------------------------------------------------------- */
.no-svg .msgImp { background-image: url(/_img/icons/important.png); }
.no-svg .msgError { background-image: url(/_img/icons/error.png); }
.no-svg .msgSuccess { background-image: url(/_img/icons/success.png); }
.no-svg .menuTrigger { background-image: url(/_img/icons/menu.png); background-repeat:no-repeat; background-position-x:50%; }
.no-svg .menuTriggerClose { background-image: url(/_img/icons/cross.png); }
.no-svg .contactBox .close { background-image: url(/_img/icons/close.png); }
.no-svg .cover { background: url(/_img/trans_bg.png); background-repeat: repeat;  }

/* = No Javascript
----------------------------------------------------------------------------------------------------------------- */
.no-js .tabs ul { display: none; }
.no-js .tabs .panel { padding: 0; }
.no-js .accordion .content { display: block; }
.no-js header { padding-top: 0; }
.no-js header .nojavascript { padding: 10px 15px; text-align: center; background-image: none; }

/* = Clearing
----------------------------------------------------------------------------------------------------------------- */
.container, .cols, .progress, .FeaturedBooks ul, aside p { zoom: 1; }
.container:after, .cols:after, .progress:after, .FeaturedBooks ul:after, aside p:after { content: "."; clear: both; display: block; height: 0; visibility: hidden; overflow: hidden; }
