/* Gateway Page */

/* Normalise Browser Styles */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, th, td 
{margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}
body {line-height: 1;font-size:1em;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}

/* remember to define focus styles! */
:focus {outline: 0;}

/* remember to highlight inserts somehow! */
ins {text-decoration: none;}
del {text-decoration: line-through;}
.floatright { float:right; padding:5px;}
.floatrighttop { float:right; padding:0px 0 0px 10px; top:-32px;position:relative; }
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: collapse;border-spacing: 0;}

/* Clear Floats */
.clearfix:after {content: "."; clear: both; display: block; height: 0; visibility: hidden;}

body {background: #900; font-family: Verdana, Arial, Helvetica, sans-serif;}
p, li {font-size: 120%;}
li p {font-size: 100%;}
li li {font-size: 100%;}
p {line-height: 1.4em; }

/* Layout */
#container {margin: 0 auto; width: 909px; background: #000000 url(../images/gateway_bg.gif) repeat-y 0 0; position: relative; z-index: 1;}
#slideshow {margin: 0 4px 0 6px; width: 899px; height: 506px;}
#slideshow ul {position: absolute; left: 495px; top: 372px; z-index: 999;}
#slideshow li {float: left; margin: 0 2px; display: inline;}
h1 {position: absolute; z-index: 9999; top: 71px; left: 33px;}
#nav-top {position: absolute; left: 475px; top: 12px; z-index: 998;}
#nav-top li {float: left; color: #fff; line-height: 1em; list-style:none;}
#nav-top li a {color: #fff; text-decoration: none;}
#nav-top li a:hover, #nav-top li a:focus, #nav-top li a:active {color: #fff; text-decoration: underline;}
#progress {background-color: #ccc; position: absolute; left: 497px; top: 425px; width: 368px; z-index: 998; height: 5px;}

@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */.ui-tabs-hide {display: none;}}
/* Hide useless elements in print layouts... */
@media print {.ui-tabs-nav {display: none;}}

#content-4col {margin: 0 0 0 7px; width: 896px;}
.puff {background-color: #fff; color: #900; float: left; display: inline; width: 223px; padding-bottom: 10px; min-height: 400px; height: auto !important; height: 400px;}
.puff h2 {background-color: #dd291e; padding: 6px 12px; font-size: 130%;}
.puff p, .puff ul {padding: 6px 12px;}
.puff p {min-height: 170px; height: auto !important; height: 170px;}
.puff h2 a {color: #fff; text-decoration: none;}
.puff h2 a:hover, .puff h2 a:active {text-decoration: underline;}
.puff h2 span {background: url(../images/arrow4.gif) no-repeat 0 50% !important; padding: 0 0 0 10px; margin-left: 5px;}
.puff li {font-style: italic; margin: 3px 0; list-style-type: disc; list-style-position: inside;}
.puff li a {color: #900;}

#postcodeSearch {margin: 0 0 0 7px; width: 884px; background-color: #fff; padding: 5px 0 10px 12px;}

#footer {background: #900 !important; padding: 50px 0 0 0; position: relative;}
#footer img {position: absolute; left: 238px; top: 12px;}
#footerleft {float:left; width:210px;  border-top:4px solid #fff; margin: 0 12px 0 6px; color:#fff; font-weight:bold;  font-size:60%; line-height: 1.3em; padding:8px 0 0 10px; display: inline;}
#footerright {float:left; width:665px;  border-top:4px solid #fff; margin-bottom:5px; padding:8px 0 10px 0; display: inline;}
#footerright a {z-index:100000; }
#footerright ul {list-style:none;}
#footerright li {float: left; color: #fff;}
#footerright li a {color: #fff; text-decoration: none; font-weight:bold;}
#footerright li a:hover {color:#b86b61; text-decoration: none; }
#footerright p { clear:left; color:#fff;  font-size:60%; padding-top:10px; line-height: 1.3em;}