@charset "utf-8";
/* CSS Document */

/* Initial Settings */
*{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
html{-ms-text-size-adjust:100%; -webkit-text-size-adjust:100%}
body{margin:0; padding:0; font-family:'Open Sans', sans-serif; font-size:16px; line-height:1.3; text-align:center;}

/* Colours */
body{color:#4C1C00; background-color:#FFF;}
h1, h2, h3, h4, h5, h6{color:#A87C4F;}
a{color:#0066DD;}
a:hover{color:#3399FF;}
#PgContainer{background-color:#fff;}
#PgContent{border-color:#4C1C00;}
#PgFootPhone{color:#FFFFCC; background-color:#13A;}
#PgFoot{color:#FFFFCC; background:url(../images/layout/footer-back.jpg); background-position: center; background-repeat: repeat-y;}
#PgFoot a, #PgFoot a:hover, #PgFootPhone a{color:#FFFFCC;}
#PgFoot h3, #PgFootPhone h3{color:#FFFF00;}
.red{color:#C00;}
.green{color:#0C0;}
.NotesBox{border-color: #1133aa; background-color:#ffe;}

input, select, .StandAloneButton, .StandAloneButtonSmall, .StandAloneButtonVSmall, textarea, .TabRow{border-color: #1133aa; color: #1133aa;}
input[type="submit"], input[type="button"], .StandAloneButton, .StandAloneButtonSmall, .StandAloneButtonVSmall{background-color:#eef;}
input[type="submit"]:hover, input[type="button"]:hover, .StandAloneButton:hover, .StandAloneButtonSmall:hover, .StandAloneButtonVSmall:hover{color:#fff; background-color:#1133aa;}
input[type="text"]:focus, input[type="password"]:focus{border-color: #1133aa; background-color:#efe;}
.FieldError{border-color: #ee3333; background-color:#fee;}

table{border-color: #1133aa;}
th{color:#fff; background-color:#1133aa;}
.ShadedRow td{background-color:#eeeeff;}

.ErrorTxt{color:#E00;}
.ErrorBlock{color:#E00; background-color:#FF9; border-radius:4px; border:solid 2px #E00; text-align:center; font-size:1.1em; padding:3px 4px; box-shadow:0px 0px 6px #CAA;}


/* General Layout */
#PgContainer{position:relative; min-height:100vh; min-width:360px;}
#PgHead{position:relative; height:180px; background:center top no-repeat url(/images/layout/long-banner.jpg); background-size:cover;}
#PgHead img{height:100%;}
#PgContent{position:relative; max-width:1020px; margin:6px auto; padding:8px; padding-bottom:150px; border:none; text-align:left;}
#PgContentLarge{position:relative; max-width:98%; margin:auto; padding:1% 1% 2% 1%; border:none; text-align:center;}
#PgFoot, #PgFootPhone{position:absolute; bottom:0; width:100%; min-height:120px; font-weight:normal; font-size:80%;}
#PgFootPhone{display:none;}

.row {position:relative; width: 100%; clear:both; margin:0px;}
.NoCols{padding:0px 15px;}
.spaceTop {margin-top:30px;}
.spaceBottom {margin-bottom:30px;}
.spaced {margin-top:16px; margin-bottom:16px;}
.row::after {content: "";clear: both;display: block;}
.col-1 {width: 8.33%; float:left;}
.col-1-keep {width: 8.33%; float:left;}
.col-2 {width: 16.66%; float:left;}
.col-3 {width: 25%; float:left;}
.col-4 {width: 33.33%; float:left;}
.col-5 {width: 41.66%; float:left;}
.col-6 {width: 50%; float:left;}
.col-7 {width: 58.33%; float:left;}
.col-8 {width: 66.66%; float:left;}
.col-9 {width: 75%; float:left;}
.col-10 {width: 83.33%; float:left;}
.col-11 {width: 91.66%; float:left;}
.col-12 {width: 100%; float:left;}
[class*="col-"] {position:relative; padding:15px;}
.Bordered{border:2px solid #1133aa; padding:8px 8px; border-radius:8px; box-shadow:2px 2px 6px #999;}

/* column spacing in forms */
form .row [class*="col-"] {padding:2px 8px;}

/* column spacing in footer */
#PgFoot [class*="col-"] {padding:0px;}

/* General Settings */
p{margin:4px 0px 12px;}
h1{margin:4px 0px 8px; font-size:200%;}
h2{margin:20px 0px 4px; font-size:150%;}
h3{margin:18px 0px 4px; font-size:130%;}
h4{margin:16px 0px 2px; font-size:120%;}
h5{margin:2px 0px; font-size:120%;} /* used where small top padding is required */
h6{margin:8px 0px 2px; font-size:100%;}
.Bordered h2{margin-top:2px;}
a{text-decoration:none;}
ul{margin:0px 0px 18px;}

.TxtCenter{text-align:center;}
.TxtRight{text-align:right;}
.Bold{font-weight:bold;}
.Italics{font-style:italic;}
.Small{font-size:80%;}
.vSmall{font-size:0.7em;}

/* Position */
.TxtCenter{text-align:center;}
.TxtLeft{text-align:left;}
.TxtRight{text-align:right;}

/* Images */
img{border:solid 2px #1133aa; border-radius:8px; box-shadow:2px 2px 6px #AAA; margin:4px auto; max-width:100%; height:auto;}
.NoBorder{border:none; box-shadow:none;}
.ImgLeft{float:left;}
.ImgRight{float:right;}

/* Forms and Fields */
form{width:100%; margin: 8px auto; padding:4px;}
form.FmBorder{border:2px solid #1133aa; padding:8px 8px; border-radius:8px; box-shadow:2px 2px 6px #999;}
form .FldText {padding-top:4px;}
input, select{font-size:1.1em; padding:1px 2px; border-width:1px; border-style:solid; border-radius:2px; box-shadow:0px 0px 3px #999;}
select{width:auto; max-width:100%;}
textarea{border-width:1px; border-style:solid; border-radius:2px; box-shadow:0px 0px 3px #999; padding:3px; font-family:inherit; height:48px; font-size:90%;}
input, textarea, select.FullWidth{width:100%;}
input[type="checkbox"], input[type="radio"]{width:auto;}
input[type="submit"], input[type="button"], .StandAloneButton, .StandAloneButtonSmall, .StandAloneButtonVSmall{cursor:pointer; border-radius:8px;}
.btnAutoWidth{width:auto; padding-left:8px; padding-right:8px;}
/* Various width settings */
input.FldVVShort{width:50px;}
input.FldVShort{width:90px;}
input.FldShort{width:120px;}
input.FldMedium{width:180px;}
input.FldLong{width:250px;} /* used to force a longer field e.g. in a table */
input.FldMoney{width:80px;}
input.FldMoneyShort{width:60px;}
input.FldDate{width:100px;}
input.FldDateShort{width:80px;}
input.FldDateLong{width:116px;}
input.FldTime{width:60px;}
input.FldPostCode{width:74px;}
input.FldNumber{width:60px;}
input.FldNumberSmall{width:40px;}

.StandAloneButton{display:block; text-align:center; border-width:2px; border-style:solid; margin:4px; font-size:1.2em; padding:2px; box-shadow:0px 0px 3px #999; font-weight:normal;}
.StandAloneButtonSmall{display:block; text-align:center; border-width:2px; border-style:solid; margin:2px; font-size:1em; padding:2px; box-shadow:0px 0px 3px #999; font-weight:normal;}
.StandAloneButtonVSmall{display:block; text-align:center; width:auto; border-width:1px; border-style:solid; margin:0px; font-size:0.9em; padding:0px 4px 1px; box-shadow:0px 0px 3px #999; font-weight:normal;}

/* Tables */
table{width:98%; margin:8px 1% 12px; padding:0px; border-width:2px; border-style:solid; border-collapse: collapse;}
tr{padding:0px;}
th, td{margin:0px; padding:1px 8px 2px 4px; text-align:left; border:none; vertical-align:top;}
.PadCell_1{padding:1px;} /* used for cells with tick boxes or icons where padding is not needed */
th h2{color:#fff; padding:2px 0px; font-size:1.4em;}
.TblNoBorders, .TblNoBorders th, .TblNoBorders td{border:none;}
.NoWrap{white-space:nowrap;}


/* Tabs */
.TabRow{position:relative; padding:0px; border-bottom:solid 1px;}
.TabChoice{display:inline-block; padding:1px 8px; margin:0px 6px -1px 0px; border:1px solid#1133aa; color: #1133aa; box-shadow:2px -2px 3px #999; border-top-left-radius:6px; border-top-right-radius:6px;}
.TabSelected{color:#fff; background-color:#1133aa;}


/* Containers */
#AdminMenuDropDown{display:block;}
#AdminMenuPhone{display:none;}
#AdminPageChoice{display:inline-block;}
.NotesBox{border:solid 2px; border-radius:8px; box-shadow:0px 0px 5px #999; padding:1%; margin:24px 12px 8px;}
.NotesBox h2{font-size:1.1em; margin:0px 0px 8px; padding:2px 2px 2px 4px; background-color:#A87C4F; color:#ffe; border-radius:6px;}
.NotesBox h3{font-size:1.1em; margin:4px 0px 0px; padding:4px;}
.NotesBox p, .NotesBox ul{font-size:0.9em; margin-bottom:8px;}


/* Lists */

/* Buttons and icons */
.DelIcon{position:absolute; top:4px; right:12px; color:#F00; background-color:#FFF; padding:0px 6px; border:solid 1px #F00; border-radius:8px; cursor:pointer; width:1.5em; text-align:center;}
.DelIconInline{position:relative; color:#F00; background-color:#FFF; padding:0px 5px; margin:0px auto; font-size:92%; border:solid 1px #F00; border-radius:8px; cursor:pointer; display:inline-block;}
.DelIcon:hover, .DelIconInline:hover{background-color:#F00; color:#FFF;}
.EditIcon{position:absolute; top:4px; right:42px; color:#0F; background-color:#FFF; padding:0px 6px; border:solid 1px #00F; border-radius:8px; cursor:pointer; width:1.5em; text-align:center;}
.EditIcon:hover{background-color:#00F; color:#FFF;}


/* Changes for smaller screens */
@media screen and (max-width:700px){
	#PgHead{height:84px;}
	[class*="col-"] {width: 100%; padding:4px;}
	.col-1 {display:none;}
	#PgFoot{display:none;}
	#PgFootPhone{display:block;}
	#AdminMenuDropDown{display:none;}
	#AdminMenuPhone{display:block;}
	#AdminPageChoice{display:block;}
}
