/* RESET */

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, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

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

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
/* I've commented this out because of something strange with table borders */
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* GENERIC */

html,
body {
   height:100%;
}

body {
	background-color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#333333;
}


/* Headings */

h1 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 26px;
	font-weight: normal;
	color: #0e3272;
	text-transform:uppercase;
	padding:25px;
	width:310px;
}

h2 {
	font-size:14px;
	font-weight:bold;
	color:#072350;
	padding-bottom:5px;
	padding-top:10px;
	text-transform:uppercase;
}


p, ul {padding-bottom:10px;}
p.intro {
	font-size: 14px;
	font-weight: bold;
	color: #072350;
}

ul {
	margin-left:15px;
}

/* Links */

a:link,
a:visited{
	color: #072350;
	text-decoration: none;
}
a:hover,
a:active,
a:focus{
	color: #072350;
	text-decoration:underline;
}
a[rel="external"] {
	background-position:right center;
	background-repeat:no-repeat;
	color:#0178aa;
}

a.more {
	font-weight:bold;
	background-image: url(../images/icons/arrow-bullet.png);
	background-repeat: no-repeat;
	background-position: left center;
	padding-left:8px;
}

a.azexis {
	background-image: url(../images/azexis.png);
	background-position:right center;
	padding: 4px 25px 4px 5px;
	color:#5e5e5e;
	height:20px;
	background-repeat: no-repeat;
}

/* Lists: menu-tabs */

ul.menu-tabs {
	clear:both;
}

ul.menu-tabs li {
	float:left;
	list-style:none;
}

ul.menu-tabs li a:link,
ul.menu-tabs li a:visited{
	color:#FFFFFF;
	font-size:14px;
	display:block;
	height:29px;
	line-height:29px;
	padding:0px 11px;
}

ul.menu-tabs li.active {
	background-image: url(../images/tabs.png);
	background-color:#FFFFFF;
}
ul.menu-tabs li.active a:link,
ul.menu-tabs li.active a:visited{
	color:#000000;
	background-image: url(../images/tabs.png);
	background-position: right top;
}
ul.menu-tabs li.active a:hover {
	text-decoration:none;
}

.hr {
	height:1px;
	margin-bottom:1px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #d4d4d4;
}

.hr hr {
	display:none;
}


/* LAYOUT */

#Page {
	min-height:100%;
	position:relative;
	background-image: url(../images/header.png);
	background-repeat: repeat-x;
	background-position: center top;
}
*html #Page {height:100%;} /* ie6 */

.wrapper {
	width: 960px;
	margin:0 auto;
}

#Header {
	margin-bottom:15px;
	padding-top:1px;
}

#Logo {
	float:left;
	height:120px;
}


.banner {
	height:286px;
	clear:both;
	margin-bottom:30px;
	background-image:url(../images/banner-home.jpg)
}

.cargo .banner {background-image:url(../images/banner-cargo.jpg);}
.cargo .banner h1 {width:600px;}
.toplift .banner {background-image:url(../images/banner-toplift.jpg);}
.toplift .banner h1 {color:#FFFFFF; padding-top:150px;}
.transportation .banner {background-image:url(../images/banner-transportation.jpg);}
.transportation .banner h1 {color:#FFFFFF; padding-top:180px; text-align:right; width:900px;}
.other .banner {background-image:url(../images/banner-other.jpg);}
.studies .banner {background-image:url(../images/banner-studies.jpg);}
.studies .banner h1 {color:#FFFFFF; padding-top:180px;}
.gallery .banner {display:none;}
.contact .banner {background-image:url(../images/banner-contact.jpg);}
.contact .banner h1 {display:none;}

.banner .countries {
	height:58px;
	background-image: url(../images/countries-bg.png);
	background-repeat: repeat-x;
}

.banner .countries .flags {
	float:left;
	padding-top:15px;
	padding-left:10px;
}

.banner .countries .flags img {
	padding-left: 10px;
}

.banner .countries #google_translate_element {
	float:right;
	text-align:right;
	margin-top:7px;
	margin-right:20px;
}

.body {
	padding-bottom:120px;   /* includes height of the footer */
	background-repeat: no-repeat;
	background-position: right top;
	min-height:492px;
}

.home .body {background-image: url(../images/photos-home.jpg);}
.cargo .body {background-image: url(../images/photos-cargo.jpg);}
.toplift .body {background-image: url(../images/photos-toplift.jpg);}
.transportation .body {background-image: url(../images/photos-transportation.jpg);}
.other .body {background-image: url(../images/photos-other.jpg);}
.studies .body {background-image: url(../images/photos-studies.jpg);}
.project .body {background-image: url(../images/photos-project.jpg); min-height:240px;}

.gallery .body a {margin:6px; display:block; float:left;}

.leftColumn {
	width:560px;
	float:left;
}

.studies .leftColumn {width:465px;}

.contact .leftColumn {width:230px;}
.contact .centreColumn {
	float:left;
	margin-left:20px;
	width:460px;
}
.contact .rightColumn {
	float:left;
	margin-left:20px;
}


#Footer {
	position:absolute;
	bottom:0;
	width:100%;
	height:90px;
	background-color:#1d3f7b;
	font-size:10px;
	color:#c7cfde;
}

#Footer .wrapper {	
	background-image: url(../images/footerlogo.png);
	background-repeat: no-repeat;
	background-position: 0px 25px;
}

#Footer .left {
	min-height:37px;
	margin-top:30px;
	padding-left:70px;
	width:700px;
}

#Footer .right {
	margin-top:30px;
}

#Footer a {
	color:#c7cfde;
}

/*

	Clear Fix: clear-after
	---------
	This is really handy!!!
	instead of doing this:
		<div class="float-left"></div>
		<div class="clear"></div>
	do this:
		<div class="float-left clear-after"></div>
*/
	.clear-after:after,
	.clearfix:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
    }
	.clear-after,
	.clearfix{
		display:block;
		zoom:1;
		position:relative;
	}

.clear {clear:both;}
.left {float:left;}
.right {float:right;}

.stdPad {padding:10px;}


/* Form */

.contact fieldset {
	margin-bottom:15px;
	clear:left;
}

.contact label {
	float:left;
	width:80px;
}

.contact input[type=text] {
	padding:2px;
	width:370px;
}

.contact textarea {
	padding:2px;
	width:370px;
	height:100px;
}

.contact .button {
	margin-left:80px;
}

table.error {
	margin-left:80px;
	margin-bottom:10px;
	color:#710F32;
}