body {
	background-color: #FFFFFF;
	font-family: Arial,Helvetica,sans-serif !important;
    font-weight: normal;
	color: #3C3C3C;
	/*background: none repeat scroll 0 0 #efefef;*/
	margin:0;
}

a:link {
	color: #3C3C3C;	
    font-weight: bold;
    text-decoration: underline;
}
a:visited {
	color: #3C3C3C;	
    font-weight: bold;
}
a:hover {
	color: #0096D2;	
    font-weight: bold;
}
a:active {
	color: #0096D2;	
    font-weight: bold;
}
h1 {
	font-size: 2.5em !important;
	color:#0096D2;
	padding: 0px;
	margin: 10px 0px 5px 0px;
}

h1>a {
	color:#3C3C3C !important;
}

h2 {
	font-size: 1.6em !important;
	color:#3C3C3C;
	margin: 0px;
	margin-bottom: 5px;
}

h3 {
	font-size: 1.3em !important;
	margin-top: 5px;
	margin-bottom: 2px;
	padding: 0px;
	color:#3C3C3C;
}
h4 {
	color:#3C3C3C;	
}

p {
	font-size: 1em;
	max-width: 50em;
	line-height: 1.4;
}

p.wide {
	max-width: 60em;
}

.highlight {
	color: #E4042C!important;
}

p.important {
	border: solid 2px #E4042C;
	padding: 5px 5px 5px 40px;
	text-indent: -30px;
}

p.important::before {
	content: "!";
	color: #ffffff;
	background-color: #E4042C;
	font-size: 1.2em;
	font-weight: bold;
	padding: 0em 0.4em 0em 0.4em;
	border: solid 1px #E4042C;
	border-radius: 1em;
	margin: 5px 5px 5px 0px;
}

p.information {
	border: solid 2px #E37606;
	padding: 5px 5px 5px 40px;
	text-indent: -30px;
}

p.information::before {
	content: "\2139 ";
	color: #ffffff;
	background-color:#E37606;
	font-size: 1.2em;
	padding: 0em 0.4em 0em 0.4em;
	border: solid 1px #E37606;
	border-radius: 1em;
	margin: 5px 5px 5px 0px;
}
p.cta {
	border: solid 2px #07A75A;
	padding: 5px 5px 5px 40px;
	text-indent: -30px;
}

p.cta::before {
	content: "\2139 ";
	/*color: #07A75A;*/
	color: white;
	background-color:  #07A75A;
	font-size: 1.2em; 
	font-weight: bold;
	padding: 0em 0.4em 0em 0.4em;
	border: solid 1px #07A75A;
	border-radius: 1em;
}
img {
	border:none;
    height: auto;
    max-width: 100%;
    width: auto;
}
ul {
	list-style-type: none;
	text-indent: -1.4em;
	padding-left:20px;
}

ol {
	color:#3C3C3C;
	counter-reset: item;
	list-style-type:none;
	margin:0px;
	padding:0px 0px 10px 25px;
}
ol>li::before {
	display:inline-block;
	content: counter(item) ". ";
	counter-increment: item;
    color: #E4042C;
	text-indent: -30px;
	font-weight: bold;
}   
li {
	padding: 5px 0px 5px 10px;
	color: #000000;
	max-width: 50em;
	line-height: 1.4;
}

ul li::before {
    color:#E4042C;
    content: "\25A0";
    display: inline-block;
    float: left;
    font-family:"Arial Black", Gadget, sans-serif;
    font-size: 75%;
    width: 25px;
}

ul li ul{
	padding-top: 10px;
}
ul li ul li::before {
    color: rgba(0, 0, 0, 0.6);
}

ul.arrow li::before {
    color: #E4042C;		
    content: "\25B6" !important;
    font-family:"Arial Black", Gadget, sans-serif;
	width: 25px;
}

li>img {
	padding-top: 10px;
}

table td, table th {
	text-align: left;
}

.clearFloats {
	clear:both;
	margin-bottom: 15px;
}

.video {
	padding-top: 10px;
}

section {
	float: left;
	margin: 0px;
    min-height: 420px;
    padding: 10px 0px 10px 10px;
	background: none repeat scroll 0 0 #fff;
}

main {
	margin-left: auto;
	margin-right: auto;
}
article {
	float:left;
	width: 70%;
	min-height: 420px;
}

header {
	height: 85px;
	background: #E4042C;
}

header .uol-logo {
    position: relative;
    z-index: 10;
    float: left;
}
header .uol-logo svg {
	margin: 12px 12px 0px 12px;
	width: 75%; height: auto;
}
header a.openmenu {
	color: #ffffff;
	text-decoration: none;
	float: right;
	margin-right: 10px;
}
header a.openmenu span {
	display: none;
}


section p a:hover, section li a:hover
{
	text-decoration:underline;
}

section form {
	width : 100%;
	padding: 30px 10px;
}

section label {
    display: block;
    float: left;
    font-size: 0.95em;
    margin: 0 5px 10px 0;
    padding: 7px 7px 0px 0px;
    text-align: right;
    width: 20%;
    min-height: 20px;
}

section input {
    background-color: #ffffff;
    border: 1px solid #ccc;
    border-radius: 4px;
    display: inline-block;
    font-size: 0.95em;
    min-height: 28px;
    padding: 0 6px;
	margin: 0 0 20px 20px;
    float: left;
    width: 59%;
}

section input:focus, section textarea:focus {
	border-color: rgba(82, 168, 236, 0.8);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(82, 168, 236, 0.6);
    outline: 0 none;
    transition: all 0.5s ease 0s;
}

section input[type="Submit"] {
	background: none repeat scroll 0 0 #007a9b !important;
    border: medium none;
    border-radius: 5px;
    color: #fff !important;
	min-height: 28px;
	margin: 0px 10px 0px 73%;
	width: 90px;
}

section input[type="Submit"]:hover {
	background: none repeat scroll 0 0 #00619a !important;
}

#announcement {
	background: none repeat scroll 0 0 #f5f5f5 !important;
    border: 1px solid #e3e3e3 !important;
    border-radius: 4px !important;
    overflow: auto;
    padding: 10px;
}

#announcement h2 {
	font-size: 1.25em !important;
	margin: 5px;
	padding: 0px;
}

#announcement p {
    clear: both;
	margin: 5px;
	padding: 0px;
}

nav {
	margin: 10px 0px 0px 10px;
	font-size: 0.9em;
}
nav[id="breadcrumb"] h2 {
	font-size: 1em !important;
	display: inline!important;
	font-weight: normal;
}
nav ul {
	list-style-type:none;
	margin: 0;
    padding: 0;
	font-size: 0.95em;
	display: inline!important;
}

nav[id="breadcrumb"] ul li {
	display: inline;
	padding: 0px;
	margin: 0px;
}

nav[id="page-navigation"] {
	float: right;
	background: #EBEBEB;
    border: 1px solid #e3e3e3 !important;
    border-radius: 4px !important;
    margin: 20px 0px 30px 20px !important;
    overflow: auto;
    padding: 20px;
}

nav ul li::before {
	content: none;
}	
nav[id="page-navigation"] ul li::before {
	color: #E4042C;		
	content: " \25B6";
	padding-left: 15px;
}
nav[id="breadcrumb"] li::after {
    color: #E4042C;		
	content: " \25B6";
}

nav li:last-child::after {
    content: "";
}

aside {
	float: right;
	width: 25%;
	background: #EBEBEB;
    border: 1px solid #e3e3e3 !important;
    border-radius: 4px !important;
    margin: 0px 0px 0px 0px !important;
    overflow: auto;
    padding: 10px;
}

aside h3 {
	margin-top: 0px;
}

aside ul {
	margin: 20px;
	padding: 0px;
}

footer {
	background-color: #EBEBEB;
    clear: both;
    float: left;
    height: 5em;
	width: 100%;
	margin: 0;
    padding: 0;
}

footer ul {
	margin: 30px 0 5px 30px;
	float:left;
	padding: 0;
	text-indent: 0px;
}

footer ul li {
	list-style-type: none;
	display: inline;
	margin: 0;
    padding: 0;
	font-size: 0.95em;
}

footer ul li::before {
	content: "";
}

footer ul li a {
	color: #3C3C3C;
	font-weight: bold;
}
footer ul li:after {
    color:#E4042C;
    content: "\25A0";
    font-size: 1.2em;
    margin: 0 10px 0 15px;
    opacity: 0.7;
}
footer ul li:last-child::after {
    content: "";
}
footer ul.right {
	/*clear: both;*/
    float: right;
    margin: 0;
    padding: 0;
	margin: 30px 10px 0px 15px;
}

footer ul.right li {
	font-size: 0.85em;
	font-weight:normal;
}

#highlight {
	float: left;
	/*background-color: #EEEEEE;
	border: 2px solid #E1E1E1;
    border-radius: 0.6em !important;*/
	padding: 0px;
	margin: 0px 0px 0px 0px;
}

#highlight.colour1 { /*purple*/
	background-color: #5A4BC2 !important;	
	background: -moz-linear-gradient(#008AAE, #00637E) repeat scroll 0 0 #0096D2;
	/*border:thick solid #A0D843;*/
	border:none;
	border-radius: 9px 9px 9px 9px;
	margin: 0px;
	padding: 10px 20px 10px 20px;
	color: #FFFFFF !important;
}

main a:hover #highlight {
	background-color:#DADADA !important;
    background: -moz-linear-gradient(#F8F8F8, #BBBBBB) repeat scroll 0 0 #DADADA;
	color: #2F3E46 !important;
}

.highlightitem {
	float: left;
	display:block;
	min-width: 300px;
	width: 100%;
	background:url(./images/arrow1.gif);
}

main .buttons li {
	float: left;
    display: block;
    margin: 10px 0px 0px 0px;
	padding: 0px;
	line-height: 1.1;
}

main .buttons ul {
	float: left;
	margin: 0px 0px 20px 0px;
	padding: 0px 0px 20px 0px;
	list-style-type: none;
	text-indent: 0px;
}

main .buttons ul li::before {
	content: "";
}

main a.button {
    display:block;
    margin: 0px ;
    padding: 0px;
	float:left;
	min-width: 300px;

    background-color: #6C8F32;
    border-radius: 0.6em;
    color: #FFFFFF;
    font-size: 1.8em;
    font-weight: bold;
    height: 2.2ex;
	margin: 10px 25px 10px 0px;
    padding: 15px 10px 15px 15px;
    text-decoration: none !important;
	box-shadow:5px 5px 10px #AAA;
}

main .button.colour1 {/*orange*/
	background-color: #0096D2;
}
main .button.colour2 { /*green*/
	background-color:#07A75A;
}
main .button.colour3 {/*blue*/
	background-color:#E37606;
}
main .button.colour4 { /*purple*/
	background-color:#5A4BC2;	
}

main .button.small { /*small text*/
	font-size: 1.2em;
	padding-top:1em;
	padding-bottom:1em;
}
main a.button:hover {
	background-color:#DADADA;
    background: -moz-linear-gradient(#F8F8F8, #BBBBBB);
    background: -webkit-linear-gradient(#F8F8F8, #BBBBBB);
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#F8F8F8), to(#BBBBBB));
    background: -o-linear-gradient(#F8F8F8, #BBBBBB);
    background: linear-gradient(#F8F8F8, #BBBBBB) repeat scroll 0 0 #DADADA;
	color: #3C3C3C;
	text-decoration: underline !important;
}

main .help {
	margin-left: 15px;
	text-decoration: none;
}

main .help:before {
	content: "\2139 ";
	margin-right: 10px;
	/*color: #3C3C3C;*/
	
	color: white;
	background-color:  #07A75A;
	font-size: 0.6em; 
	font-weight: bold;
	padding: 0em 0.4em 0em 0.4em;
	border: solid 1px #07A75A;
	border-radius: 1em;
}

main .icon {
	background-color: #818181;
	background-image: url("../images/icons-18-white.png");
	background: url("../images/icons-18-white.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0.4);
	background-position: -108px 50%;
	width:20px;
	height:20px;
	float: right;
	margin: 5px 5px 0px 10px;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
	border-radius: 15px 15px 15px 15px;
}