/*********** C O L O U R S *********
	#02afee - DCM blue
	#FFC900 - yellow
	#1c1c1c - almost black
	#87b4ed - sky blue
*/
/*********** RESET ***********/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,hr { 
	margin: 0;padding: 0;}
table {border-collapse: collapse; border-spacing: 0;}
/*****************************/
html, body {
    background-color: #02afee;	/* DCM blue */
    color: white;
    border-color: white;
    margin: 0;
    padding: 0;
    font-size: 16px;
    text-align: left;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
}
a:link, a:visited {color: #FFC900; background-color: transparent; font-weight: bold;}	/* yellow */
a:hover, a:focus, a:active {color: white; background-color: transparent;}

h1 {clear: both; font-size: 36px; margin: 25px 0 15px 0; color: white;}
h2 {clear: both; font-size: 36px; margin: 36px 0 15px 0; color: white;}
h3 {clear: both; font-size: 24px; margin: 12px 0 10px 0; color: white;}
h4 {font-size: 28px; font-weight: bold; margin: 0 0 10px 0; color: #555555;} /* mid grey */

#wrapper h5 {font-size: 18px; font-weight: bold; margin: 5px 0 3px 0;}
#wrapper h6 {font-size: 18px; font-weight: normal; font-style: italic; margin: 5px 0 3px 0;}

p {font-size: 20px; margin: 5px 0; line-height: 2em;}

ul {padding-left: 64px;}
li {margin: 5px 0;}
hr {color: white; background-color: white; height: 3px;}

/* C L A S S E S */
.floatleft {float: left !important;}
.floatright {float: right !important;}
.clear {
	clear: both !important;
	margin: 0;
	padding: 0;
	line-height: 0.25em;
	height: 0.25em;
}
.noClear {clear: none !important;}
.clearRight {clear: right;}
.clearLeft {clear: left !important;}
.clearBoth {clear: both !important;}
.tiny {font-size: 11px !important;}
.small {font-size: 12px !important;}
.bigger {font-size: 120% !important;}
.smaller{font-size: 80% !important;}
.centre, .center {text-align: center !important;}
.hide {display: none !important;}
.show {display: block !important;}
.showAuto {}	/* display according to type of tag/previous style when un-hiding */
.red {color: red !important;}

.absCentre {	/* centre horizontally and vertically in *positioned* container - OVERRIDE MAX-WIDTH/HEIGHT */
	position: absolute; top: 0; left: 0; bottom: 0; right: 0;
	width: auto; max-width: 150px;
	height: auto; max-height: 150px;
	margin: auto;
}
.warning {background-color: transparent; color: red;}

/* iPad etc */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
	td.wideScreen, th.wideScreen {display: none;}
}
div#wrapper {
	max-width: 1100px; min-width: 900px;
	margin: 10px auto 10px auto; padding: 0;
	position: relative;
	background-color: #02afee; 	/* DCM blue */
}
div#content {padding: 0 30px 0 30px;}
div#divHeading	{text-align: center;}
div#divHeading img {width: 50%;}

div#divIntro p {text-align: center; font-size: 20px; line-height: 1.65em;}
div#divIntro p.big  {font-size: 26px !important;}
div#divIntro p.tiny {font-size: 16px !important;}

div#divContent {margin-top: 35px;}
div#divContact {float: left; width: 50%; margin: 0 80px 0 20px; background-color: transparent;}
div#divContact form textarea {width: 80%; height: 100px; border: none; padding: 0 4px 0 5px;}
div#divContact form input {width: 80%; height: 40px; padding: 0 0 0 5px;}
div#divContact form p#sendButton {float: left; width: 135px;}
div#divContact p.failMsg, div#divContact p.successMsg {color: red; padding-top: 10px;}

div#divContact form input.button {
	background-color: #888888; color: #ffc900;	/* grey / yellow */
	border-width: 0px; border-radius: 30px;
	font-size: 12px; font-weight: bold; cursor: pointer; outline: none;
	height: 50px; width: 120px; line-height: 40px;
	padding: 0 20px;
}
div#divContact form input.button:hover, div#divContact form input.button:active {border: 3px solid; background-color: #02afee; color: #ffc900;}	/* DCM blue; yellow */
div#divContact form input.button.dimmed {color: #cccccc !important;}	/* grey */
div#divContact form input.button.dimmed:hover {border-width: 0px; background-color: #888888;}

div#divCatalog {clear: none; margin: 0 20px 75px 0;}

/* --------F O R M S--------- */
#wrapper form {margin: 0; padding: 0;}
#wrapper form p {margin: 0; padding: 0 0 10px 0;}
#wrapper form p.confirm {display: none;} /* honeypot */
#wrapper form p.small {font-size: 0.6em;}
#wrapper form input, #wrapper form textarea, #wrapper form select {
	color: #1C1C1C; 					/* nearly black */
	background-color: white;
	font-size: 18px;
}