@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:#444; background-color:#f3f3ff;}
#Wrap{background-color:#fff;}
#Footer, #Footer a, #Footer a:hover{color:#999; background-color:transparent; font-weight:normal;}
h1, h2, h3, h4, h5, h6{color:#0d5a99;}

#TopBar, #MainMenuBar, #MainMenu a, #MainMenuShort a{background-color:#0080ef; color:#fff;}
#MainMenu a:hover{background-color:#eee; color:#0080ef;}
.SubMenu{background-color:transparent;}
.SubMenuBody{background-color:#eee; border-color: #0080ef; color: #0080ef;}
.SubMenuBody a{color:#0080ef !important; background-color:transparent !important;}
.SubMenuBody a:hover{color:#0040ff !important;background-color:#fff !important;}
#LogIn{border-color: #0080ef; color: #0080ef; background-color:#fff;}
#LogIn:hover{color: #fff; background-color:#0080ef;}
#FooterBar{background-color:#CCC; color:#669;}
#FooterBody a{color:#666;}
#FooterBody a:hover{color:#0080ef;}
a{color:#66f;}
a:hover{color:#fff; background-color:#0080ef;}
hr{border-color:#0080ef;}

input, select, .StandAloneButton, .SmallButton{border-color: #0080ef; color: #0080ef;}
input[type="submit"], input[type="button"], .StandAloneButton, .SmallButton{background-color:#eef;}
input[type="submit"]:hover, input[type="button"]:hover, .StandAloneButton:hover, .SmallButton:hover{color:#fff; background-color:#0080ef;}
input[type="text"]:focus, input[type="password"]:focus{border-color: #00cc66; background-color:#efe;}
.FieldError{border-color: #ee3333; background-color:#fee;}

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

.InfoBox{border-color:#0080ef; background-color:#fffaea; color:#006;}

.Red{color:#C00;}
.ErrorTxt{color:#E00;}

/* Main layout */
#TopMenu{position:relative; max-width:1000px; margin:10px auto; padding:0px; text-align:right;}
#TopMenu a{padding:0px 8px 1px; font-weight:normal; border-radius:6px; font-size:0.9em;}
#TopMenu #LoggedInInfo{position:absolute; left:4px; top:2px; font-size:0.9em;}
#Wrap{position:relative; max-width:1000px; margin:10px auto; padding:0px; text-align:left; box-shadow:0px 0px 6px #999; border-radius:4px;}
#Banner{position:relative; width:100%; height:90px; margin:0px; text-align:right; padding:8px;}
#Logo{position:absolute; top:12px; left:12px; width:300px; height:71px; margin:0px; background:url(images/UWL-logo.jpg) top left no-repeat;}
#LoggedInStrip{position:relative; width:100%; margin:12px 0px 0px; text-align:right; padding:4px 20px; background-color:#f3f3ff; font-size:12px;}
#Footer{position:relative; max-width:1000px; margin:0px auto; padding:4px; font-size:12px;}
.Spacer{width:100%; height:10px; font-size:9px;}
.SpacerBig{width:100%; height:30px; font-size:9px;}

.row {position:relative; width: 100%; clear:both; margin:0px;}
.row.spaceTop {margin-top:30px;}
.row.spaceBottom {margin-bottom:30px;}
.row.spaced {margin-top:16px; margin-bottom:16px;}
.row::after {content: "";clear: both;display: block;}
.col-1 {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;}

/* alterations for mobile phones */
@media screen and (max-width:601px){
	[class*="col-"] {width: 100%;}
	#ContactInfo{display:none;}
}


/* Containers */
.InfoBox {position:relative; width:96%; margin:4px 2%; border-width:1px; border-style:solid; border-radius:4px; box-shadow:2px 2px 2px #999; padding:4px 8px;}
.InfoBox p {padding:4px; font-size:0.9em;}
.InfoBox h2 {padding:4px; font-size:1.2em;}
.InfoBox img{width:100%;}
.MoreInfoPanel{position:relative; display:none; margin:4px 2px; padding:4px; border-width:1px; border-style:solid; border-radius:4px; box-shadow:2px 2px 2px #999;}

.ProductBox {position:relative; width:96%; margin:4px 2%; padding:4px 8px; border-width:1px; border-style:solid; border-radius:4px; box-shadow:2px 2px 2px #999;}
.ProductBox .row {padding:2px 4px;}
.ProductBox p {font-size:0.8em;}
.ProductBox h2 {font-size:1.2em;}
.ProductBox img{width:100%; display:block; border:solid 1px #666; box-shadow:0px 0px 6px #999;}

#SliderBox{padding:0px; margin:12px auto; width:98%; border:solid 1px #333; background-color:#999;}


/* Common Basic Styles */
h1, h2, h3, h4, h5, h6{line-height:1.2; margin:0px; padding:8px 4px 4px;}
h1{font-size:2em; padding-top:10px;}
h2{font-size:1.7em;}
h3{font-size:1.5em;}
h4{font-size:1.4em; padding-top:6px;}
h5{font-size:1.2em; padding-top:6px; padding-bottom:0px; font-weight:normal;}
h6{font-size:1em; padding-top:6px;}
p{margin:0px; padding:4px 12px 4px 4px;}
a{text-decoration:none; padding:0px 2px; font-weight:600;}
hr{border-width:1px; border-style:solid; box-shadow:0px 0px 4px #99c; width:100%; margin:8px auto;}
img {width:auto; height:auto; max-width:100%; border:none; display:block;}
ul{margin:4px 0px; padding:0px 0px 0px 34px;}
li{padding:2px 0px 4px 8px; font-size:90%;}
li a{display:inline-block; width:90%;}

/* General Styles */
.TxtCenter{text-align:center;}
.TxtRight{text-align:right;}
.Bold{font-weight:bold;}
.Small{font-size:0.8em;}
.vSmall{font-size:0.7em;}

/* Images */
.ImgLeft{float:left;}
.ImgRight{float:right;}

/* Forms and Fields */
form{width:100%; margin: 4px auto; padding:0px 4px;}
form.FmBorder{border:2px solid #0080ef; padding:4px; border-radius:8px; box-shadow:2px 2px 6px #999;}
form [class*="col-"] {padding:2px 4px;}
form .FldText {padding-top:5px;}
form h3{padding-left:0px;}
input, select{font-size:1.1em; padding:1px 2px; border-width:2px; border-style:solid; border-radius:2px; box-shadow:0px 0px 3px #999;}
input, textarea, select.FullWidth{width:99%;}
input[type="checkbox"], input[type="radio"]{width:auto;}
select{width:auto;}
input[type="submit"], input[type="button"], .StandAloneButton{cursor:pointer; border-radius:8px;}
/* Various width settings */
input.FldNumber99{width:30px; text-align:right}
input.FldShort{width:80px;}
input.FldDate{width:100px;}
input.FldPostCode{width:90px;}

.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;}
.SmallButton{display:inline-block; text-align:center; border-width:2px; border-style:solid; margin:1px 2px; font-size:1em; padding:0px 4px; box-shadow:0px 0px 3px #999; font-weight:normal; cursor:pointer; border-width:1px; border-radius:6px; display:none;}

/* Tables */
table{width:98%; margin:4px 1%; padding:0px; border-width:2px; border-style:solid; border-radius:2px; box-shadow:0px 0px 3px #999; border-collapse: collapse;}
form table{border:none; box-shadow:none;}
tr{padding:0px;}
th, td{margin:0px; padding:1px 8px 2px 4px; text-align:left; border:none;}
.CellRight{text-align:right;}
.CellCenter{text-align:center;}


/* Special styles */
.LinkOnPic{display:block; position:absolute; bottom:10px; left:0px; width:60%; margin:0px 20%; text-align:center; border-radius:4px;} /* on Home Page */

.DeleteButton{display:inline-block; padding:1px 4px; margin:0px; color:#a00; background-color:#fff; border-radius:8px; font-size:12px; font-weight:normal;}
.DeleteButton:hover{color:#fff; background-color:#a00;}