/* Reset page */

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;
}
body
{
 line-height: 1;
 color:#000;
}
#cardsNav ol, ul
{
 list-style: none;
}
blockquote, q
{
 quotes: none;
}
 
:focus
{
 outline: 0;
}
 
ins
{
 text-decoration: none;
}
del
{
 text-decoration: line-through;
}
 
table
{
 border-collapse: collapse;
 border-spacing: 0;
}

/*
	Variable Grid System.
	Learn more ~ http://www.spry-soft.com/grids/
	Based on 960 Grid System - http://960.gs/

	Licensed under GPL and MIT.
*/


/* Containers
----------------------------------------------------------------------------------------------------*/
.container_12 {
	margin-left: auto;
	margin-right: auto;
	width: 960px;
}

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	display:inline;
	float: left;
	position: relative;
	margin-left: 10px;
	margin-right: 10px;
}

/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
	margin-left: 0;
}

.omega {
	margin-right: 0;
}

/* Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .grid_1 {
	width:60px;
}

.container_12 .grid_2 {
	width:140px;
}

.container_12 .grid_3 {
	width:220px;
}

.container_12 .grid_4 {
	width:300px;
}

.container_12 .grid_5 {
	width:380px;
}

.container_12 .grid_6 {
	width:460px;
}

.container_12 .grid_7 {
	width:540px;
}

.container_12 .grid_8 {
	width:620px;
}

.container_12 .grid_9 {
	width:700px;
}

.container_12 .grid_10 {
	width:780px;
}

.container_12 .grid_11 {
	width:860px;
}

.container_12 .grid_12 {
	width:940px;
}



/* Prefix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .prefix_1 {
	padding-left:80px;
}

.container_12 .prefix_2 {
	padding-left:160px;
}

.container_12 .prefix_3 {
	padding-left:240px;
}

.container_12 .prefix_4 {
	padding-left:320px;
}

.container_12 .prefix_5 {
	padding-left:400px;
}

.container_12 .prefix_6 {
	padding-left:480px;
}

.container_12 .prefix_7 {
	padding-left:560px;
}

.container_12 .prefix_8 {
	padding-left:640px;
}

.container_12 .prefix_9 {
	padding-left:720px;
}

.container_12 .prefix_10 {
	padding-left:800px;
}

.container_12 .prefix_11 {
	padding-left:880px;
}



/* Suffix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .suffix_1 {
	padding-right:80px;
}

.container_12 .suffix_2 {
	padding-right:160px;
}

.container_12 .suffix_3 {
	padding-right:240px;
}

.container_12 .suffix_4 {
	padding-right:320px;
}

.container_12 .suffix_5 {
	padding-right:400px;
}

.container_12 .suffix_6 {
	padding-right:480px;
}

.container_12 .suffix_7 {
	padding-right:560px;
}

.container_12 .suffix_8 {
	padding-right:640px;
}

.container_12 .suffix_9 {
	padding-right:720px;
}

.container_12 .suffix_10 {
	padding-right:800px;
}

.container_12 .suffix_11 {
	padding-right:880px;
}



/* Push Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .push_1 {
	left:80px;
}

.container_12 .push_2 {
	left:160px;
}

.container_12 .push_3 {
	left:240px;
}

.container_12 .push_4 {
	left:320px;
}

.container_12 .push_5 {
	left:400px;
}

.container_12 .push_6 {
	left:480px;
}

.container_12 .push_7 {
	left:560px;
}

.container_12 .push_8 {
	left:640px;
}

.container_12 .push_9 {
	left:720px;
}

.container_12 .push_10 {
	left:800px;
}

.container_12 .push_11 {
	left:880px;
}



/* Pull Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .pull_1 {
	left:-80px;
}

.container_12 .pull_2 {
	left:-160px;
}

.container_12 .pull_3 {
	left:-240px;
}

.container_12 .pull_4 {
	left:-320px;
}

.container_12 .pull_5 {
	left:-400px;
}

.container_12 .pull_6 {
	left:-480px;
}

.container_12 .pull_7 {
	left:-560px;
}

.container_12 .pull_8 {
	left:-640px;
}

.container_12 .pull_9 {
	left:-720px;
}

.container_12 .pull_10 {
	left:-800px;
}

.container_12 .pull_11 {
	left:-880px;
}




/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

/* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */

.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}

/* -------------------------------------------------------------------------------------- */

body
{
	position: relative;
	background-color: #4A4B4F;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#fff;
}

a:link 
{
	color:#FF9600;
	text-decoration:none;
} 
a:visited 
{
	color:#FF9600;
	text-decoration:none;
}
a:hover 
{
	color:#BDBDBF;
	text-decoration:underline;
} 
a:active 
{
	color:#FF9600;
	text-decoration:none;
}

.grey
{
	color:#959597;
}
.orange
{
	color:#FF9600;
}
#topbar
{
	float:left;
	width:100%;
	height:129px;
	color:#fff;
	background-color:#fff;
}
#topbar .logo
{
	float:left;
	width:118px;
	height:98px;
	margin:29px 0 0 43px;
	background:url(../images/mcl-logistics-logo.png) no-repeat top left;
}
.imgright
{
	float:right;
	padding:0 0 20px 0;
	border-bottom: 2px solid #68686F;
}
/* nav */
#topbar .navigation
{
	float:right;
	color:#656566;
}
.navigation .nav
{
	float:right;
	margin: 67px 47px 0px 0px;
	padding:0;
	list-style: none;
	font-size: 15px;
}
.navigation .nav li
{
	float: left;
	margin-right: 15px;
}
.navigation .nav .last
{
	margin-right:0;
}
.navigation .nav li a
{
	color:#4A4B4F;
	text-decoration: none;
}
.navigation .nav li a:hover
{
	color:#FB9400;
}
.navigation .nav li a#active
{
	color:#FB9400;
}

.navigation .nav li a
{
	margin-right: 0px;
}
/* ---------------------- */

#header-animation
{
	float:left;
	width:100%;
	height:255px;
	background:url(../images/header-home.jpg) no-repeat top left;
}
#subheader
{
	float:left;
	width:100%;
	height:153px;
	background:url(../images/sub-header.jpg) no-repeat top left;
}
#content
{
	float:left;
	width:700px;
	padding:30px 0px 0px 0px;
	line-height:18px;
}
#content h1
{
	float:left;
	width:700px;
	font-size:30px;
	padding:0 0 7px 0;
	margin:0 0 18px 0;
	font-weight:normal;
	border-bottom:2px solid #68686F;
}
#subcontent
{
	float:left;
	line-height:18px;
}
.subsidebar
{
	float:right;
	margin:0 0 5px 10px;
}
#subcontent h1
{
	float:left;
	width:700px;
	font-size:30px;
	padding:0 0 7px 0;
	margin:30px 0 18px 0;
	font-weight:normal;
	border-bottom:2px solid #68686F;
}
#subcontent h4
{
	float:left;
	width:190px;
	height:41px;
	line-height:41px;
	padding:0 15px 0 15px;
	font-size:17px;
	margin:20px 0 0 0;
	background:url(../images/know-more-heading.png) no-repeat top left;
}

#subcontent a span
{	
	float:left;
	width:190px;
	height:67px;
	padding:15px;
	font-size:17px;
	line-height:20px;
	color:#fff;
	background:url(../images/know-more-bg.png) repeat-y top left;
}

#subcontent .curve
{
	float:left;
	width:220px;
	height:3px;
	background:url(../images/know-more-curve.png) no-repeat top left;
}
#subcontent p
{
	margin-bottom:10px;
}

.grid_12 h1
{
	float:left;
	width:940px;
	font-size:30px;
	padding:0 0 7px 0;
	margin:30px 0 18px 0;
	font-weight:normal;
	border-bottom:2px solid #68686F;
}
#content h2, #subcontent h2
{
	font-size:14px;
	color:#FF9600;
	margin-bottom: 10px;
}
#content p, #subcontent p, #content .aboutus, #subcontent a 
{
	margin-bottom:15px;
	color:#BDBDBF;
	text-decoration:none;
}
#subcontent a:hover
{
	color:#FF9600;
}
#content p.first-para, #subcontent p.first-para
{
	color:#fff;
	font-size:14px;
}
#content ul.bodylist, #subcontent ul.bodylist
{
	list-style-type:disc;
	padding-left:16px;
	margin-bottom:10px;
	color:#BDBDBF;
}
#content .contact-details
{
	color:#FF9600;
	font-size:16px;
}
#content .emailcontact
{
	color:#FF9600;
	font-size:14px;
}
#content img
{
	float:right;
	padding:0 0 0 10px;
}
#content .borders
{
	float:left;
	width:700px;
	padding:27px 0 0px 0;
	margin:27px 0 0px 0;
	border-top:1px solid #68686F;
}
#content .quotetopcurve
{
	float:left;
	width:700px;
	height:2px;
	background:url(../images/quote-top-curve.gif) no-repeat top left;
}
#content #testimonial
{
	float:left;
	width:696px;
	border-right:2px solid #68686F;
	border-left:2px solid #68686F;
	background-color:#626469;
}
#content #testimonial p
{
	position:relative;
	float:left;
	width:440px;
	padding:10px 0 0 240px;
	font-style:italic;
	color:#BDBDBF;
	line-height:16px;
	font-size:12px;
	font-family:Georgia, "Times New Roman", Times, serif;
}
#content .quoteimg
{
	float:left;
	width:218px;
	height:118px;
	background:url(../images/quote-img.gif) no-repeat top left;
}
#content #testimonial span
{
	position:absolute;
	bottom:7px;
	right:20px;
	color:#F18E00;
	font-size:11px;
}
#content .quotebottomcurve
{
	float:left;
	width:700px;
	height:2px;
	background:url(../images/quote-bottom-curve.gif) no-repeat top left;
}
#sidebar
{
	float:right;
	padding:41px 0px 0px 0px; /* main page */
}
#sidebar h2
{
	float:left;
	width:100%;
	font-size:15px;
	padding:0 0 7px 0;
	margin:0 0 18px 0;
	font-weight:normal;
	border-bottom:2px solid #68686F;
}
.sub-side h2
{
	float:left;
	width:220px;
	color:#fff;
	font-size:18px;
	padding:0 0 7px 0;
	font-weight:normal;
	margin:41px 0 18px 0;
	border-bottom:2px solid #68686F;
}
/* sidebar nav */
ul#services-nav li, ul#sub-services-nav li
{
	position:relative;
	display:block;
	float:left;
	margin:0;
	width:220px;
	height:34px;
	background:url(../images/sidebar-nav-bg.png) no-repeat top left;
}

ul#services-nav li a, ul#sub-services-nav li a
{
	display:block;
	float:left;
	color:#fff;
	width: 100%;
	height: 100%;
	text-decoration:none;
}

ul#services-nav .heading, ul#sub-services-nav .heading
{
	float:left;
	width:205px;
	font-size:14px;
	font-weight:700;
	padding:9px 0px 0px 15px;
}
ul#services-nav .cabinsheading, ul#sub-services-nav .cabinsheading
{
	line-height:15px;
	padding-top:15px;
}
ul#services-nav .subline, ul#sub-services-nav .subline
{
	float:left;
	width:133px;
	font-size:11px;
	padding:0px 0px 5px 65px;
}
ul#services-nav li:hover,ul#sub-services-nav li:hover
{
	background:url(../images/sidebar-nav-bg.png) no-repeat bottom left;
}
ul#services-nav li#active
{
	width:230px;
	background:url(../images/sidebar-nav-bg.png) no-repeat bottom left;
}
ul#services-nav .first-child#active
{
	width:230px;
	background:url(../images/sidebar-nav-firstbg.png) no-repeat bottom left;
}

ul#services-nav .last-child#active
{
	width:230px;
	background:url(../images/sidebar-nav-lastbg.png) no-repeat bottom left;
}

ul#services-nav .first-child
{
	width:220px;
	height:33px;
	background:url(../images/sidebar-nav-firstbg.png) no-repeat top left;
}
ul#services-nav .first-child:hover
{
	background:url(../images/sidebar-nav-firstbg.png) no-repeat bottom left;
}

ul#services-nav .last-child
{
	width:220px;
	height:49px;
	background:url(../images/sidebar-nav-lastbg.png) no-repeat top left;
}
ul#services-nav .last-child:hover
{
	background:url(../images/sidebar-nav-lastbg.png) no-repeat bottom left;
}
/* ------------------------------------ */
/* services */
.services-barend-left
{
	float:left;
	width:3px;
	height:30px;
	background:url(../images/orange-leftend-services.gif) no-repeat top left;
}
.services-strip
{
	float:left;
	width:924px;
	height:26px;
	line-height:26px;
	padding:0 0 0 10px;
	border-top:2px solid #FFB03E;
	border-bottom:2px solid #FFB03E;
	background:#FF9600;
	font-size:14px;
}
.services-barend-right
{
	float:left;
	width:3px;
	height:30px;
	margin-bottom:55px;
	background:url(../images/orange-rightend-services.gif) no-repeat top left;
}
/* ------------------------ */
.services-container
{
	width:924px;
	margin-left:90px;
}

ul.services li a
{
	float:left;
	width:154px;
	height:250px;
	margin-right:2px;
	text-decoration:none;
}
ul.services li a .s-header
{
	color:#fff;
	font-size:18px;
	width:110px;
	height:25px;
	line-height:20px;
	padding: 100px 0 20px 10px;
}
ul.services li a:hover .s-header
{
	color:#FF9600;
}

ul.services li a span
{
	float:left;
	width:123px;
	height:80px;
	line-height:15px;
	color:#B6B4B9;
	font-size:11px;
	padding: 0px 0 0 10px;
}

ul.services li.last a
{
	margin-right:0;
}
.roadtransport
{
	background:url(../images/services-link-1.jpg) no-repeat top left;
}
ul.services li a.roadtransport:hover
{
	color:#FF9600;
	background:url(../images/services-link-1.jpg) no-repeat bottom left;
}
.craneservice
{
	background:url(../images/service-link-crane.jpg) no-repeat top left;
}
ul.services li a.craneservice:hover
{
	background:url(../images/service-link-crane.jpg) no-repeat bottom left;
}
.loadservice
{
	background:url(../images/services-link-abnormalload.jpg) no-repeat top left;
}
ul.services li a.loadservice:hover
{
	background:url(../images/services-link-abnormalload.jpg) no-repeat bottom left;
}
.shippingservice
{
	background:url(../images/services-link-shipping.jpg) no-repeat top left;
}
ul.services li a.shippingservice:hover
{
	background:url(../images/services-link-shipping.jpg) no-repeat bottom left;
}
.flyservice
{
	background:url(../images/services-link-fly.jpg) no-repeat top left;
}
ul.services li a.flyservice:hover
{
	background:url(../images/services-link-fly.jpg) no-repeat bottom left;
}
.shipservice
{
	background:url(../images/service-link-ship.jpg) no-repeat top left;
}
ul.services li a.shipservice:hover
{
	background:url(../images/service-link-ship.jpg) no-repeat bottom left;
}
.cabinservice
{
	background:url(../images/services-link-cabins-containers.jpg) no-repeat top left;
}
ul.services li a.cabinservice:hover
{
	background:url(../images/services-link-cabins-containers.jpg) no-repeat bottom left;
}
.commservice
{
	background:url(../images/services-link-mcl-commercial.jpg) no-repeat top left;
}
ul.services li a.commservice:hover
{
	background:url(../images/services-link-mcl-commercial.jpg) no-repeat bottom left;
}
.hazservice
{
	background:url(../images/services-hazardous-waste.jpg) no-repeat top left;
}
ul.services li a.hazservice:hover
{
	background:url(../images/services-hazardous-waste.jpg) no-repeat bottom left;
}
.dangerservice
{
	background:url(../images/services-dangerous-goods.jpg) no-repeat top left;
}
ul.services li a.dangerservice:hover
{
	background:url(../images/services-dangerous-goods.jpg) no-repeat bottom left;
}




ul.servicelist
{
	width:460px;
	list-style-type:disc;
	margin-bottom:15px;
}
ul.servicelist li
{
	color:#BDBDBF;
	margin-left:15px;
}
ul.servicelist li ul
{
	list-style-type:circle;
}
/* contact page */
.topcurve
{
	float:left;
	width:220px;
	height:4px;
	background:url(../images/sidebox-topcurve.png) no-repeat top left;
}

.bottomcurve
{
	float:left;
	width:220px;
	height:4px;
	background:url(../images/sidebox-bottomcurve.png) no-repeat top left;
}
#contact-form
{
	float:left;
	width:460px;
}
#contact-form div
{
	float:left;
	margin-bottom:10px;
}
#contact-form label
{
	float:left;
	width:65px;
	font-size:12px;
}
#contact-form input
{
	float:left;
	width:365px;
	height:20px;
	line-height:20px;
	font-size:12px;
	padding:0 4px 3px 4px;
	background:#6B6B72;
	color:#fff;
	border:1px solid #838383;
}
#contact-form input:focus, #contact-form textarea:focus
{
	border:1px solid #FF9800;
}
#contact-form textarea
{
	width:365px;
	background:#6B6B72;
	color:#fff;
	border:1px solid #838383;
	padding:3px 4px 3px 4px;
}
#contact-form a.sub_btn_text
{
	position:relative;
	display: block;
	width:135px;
	height:29px;
	line-height:29px;
	border:none;
	color:#fff;
	cursor:pointer;
	font-size:15px;
	text-align:center;
	margin-left:305px;
	background:url(../images/send-request-btn.png) no-repeat top left;
}
#contact-form a.sub_btn_text:hover
{
	text-decoration:none;
	background:url(../images/send-request-btn.png) no-repeat bottom left;
}
#contact-form label.error
{
	width: 220px;
	color:#f00;
	font-size:12px;
	padding:5px 10px 10px 65px;
}
.info-box
{
	float:left;
	width:190px;
	color:#fff;
	padding:15px 15px 15px 15px;
	background:#FFA628;
}
#content .info-box p
{
	color:#fff;
}
#content .info-box p.para
{
	font-size:14px;
}
#content .info-box span.number
{
	font-size:25px;
}
#content .info-box span.address
{
	font-size:15px;
}
#content .info-box a
{
	color:#fff;
	font-size:18px;
}
/* Footer --------------------- */
div#footer
{
	float:left;
	width:940px;
	height: 79px;
	padding-top:20px;
	margin:23px 0 0 0;
	border-top:2px solid #68686F;
}
div#footer #mc-embedded-subscribe-form h3 
{
	float:left;
	width:460px;
	padding-bottom:12px;
}

div#footer #mc-embedded-subscribe-form
{
	float:left;
	width:460px;
	height:77px;
	padding:10px 10px 10px 10px;
	background:url(../images/mailinglist-bg.gif) no-repeat top left;
}
div#footer #mc-embedded-subscribe-form div
{
	float:left;
}
div#footer #mc-embedded-subscribe-form input
{
	float:left;
	border:0;
	width:119px;
	height:25px;
	margin-right:5px;
	color:#BDBDBF;
	padding:3px 5px 0 3px;
	background:url(../images/input-bg.png) no-repeat top left;
}
div#footer #mc-embedded-subscribe-form #mc-embedded-subscribe
{
	float:left;
	width:39px;
	height:25px;
	color:#fff;
	font-weight:bold;
	font-size:13px;
	padding:0 2px 3px 0;
	background:url(../images/join-button.gif) no-repeat top left;
}

div#footer .contact-details
{
	float:left;
	width:195px;
	font-size:11px;
	line-height:15px;
}
div#footer .copyright
{
	float:left;
	width:210px;
	line-height:15px;
	font-size:11px;
}
div#footer ul.footernav
{
	color:#FF9600;
}
/*
div#footer .copyright a.bluegg
{
	color:#959597;
}
*/
div#footer ul.footernav li a
{
	float:left;
	color:#FF9600;
	padding-right:10px;
	text-decoration:none;
}
div#footer ul.footernav li a:hover, div#footer a:hover
{
	color:#B5B5B8;
}
div#footer a
{
	color:#FF9600;
	padding-right:10px;
	text-decoration:none;
}

/* HOLDING PAGE */

#customerLogin
{
	position: relative;
	top: -5px;
	display: block;
	width: 150px;
	height: 29px;
	background: url(../images/customer-login-btn.png) no-repeat 0 0;
}
#customerLogin:hover
{
	background-position: bottom left;
}