/* ----------------------------------------------------- */
/*  Ian Roebuck - Screen CSS  					         */
/*  Ver     : 1                                          */
/*  Created : 16 Feb 2011                                */
/*  Note    :                                            */
/*  - IE6 : IE6 specific styles exist in screen-ie6.css  */
/*  - IE7 : IE7 specific styles exist in screen-ie7.css  */
/*  - IE8 : IE8 specific styles exist in screen-ie8.css  */
/* ----------------------------------------------------- */

/*------------------*/
/* Table of Content */
/*------------------*/

/*
1. General
	1.1. Hyperlink
	1.2. Heading
	1.3. Text
	1.4. Class
	1.5. Table
	1.6. Form
		
2. Lay-out

3. Header
		
4. Navigation
	4.1. Accessibility Navigation
	4.2. Main Navigation
		
5. Content
	5.1. Home Page
		5.1.1. Slider
		5.1.2. Main Block
		5.1.3. Sec Block
	5.2. Standard Content Page
		5.2.1. Main Block
		5.2.2. Sec Block
	5.3. Crane and Truck Fleet Page
		
6. Footer

7. Plug-in Related CSS

8. Additional CSS
*/

/*------------*/
/* 1. General */
/*------------*/

* {line-height: 1.4;}

body
{
/*behavior: url("../css/csshover3.htc"); */
margin: 0;
padding: 0;
font: 62.5% Arial, Helvetica, Verdana ,sans-serif;
color: #000;
background-color: #FFF;
}

/* 1.1. Hyperlink */

a
{
font-size: 1.2em;
text-decoration: underline;
cursor: pointer;
}

a:hover {text-decoration: none;}

/* 1.2. Heading */

h1, h2, h3, h4, h5, h6 {margin: 0 0 10px 0;}

h1 { font-size: 3.8em; line-height: 55px;}
h2 { font-size: 3.2em;}
h3 { font-size: 1.6em;}
h4 { font-size: 1.2em;}
h5 { font-size: 1.1em;}
h6 { font-size: 0.9em;}

/* 1.3. Text */

p
{
font-size: 1.2em;
margin: 0 0 15px 0;
}

/* 1.4. Class */

.clear  {clear: both;}
.overflow-hidden {overflow: hidden;}
.center-align {text-align: center;}

/* 1.5. Table */

table {margin: 0 0 10px 0;}

td, th 
{
font-size: 1.1em;
padding: 5px;
}

/* 1.6. Form */

input, textarea
{
margin: 0;
padding: 0;
border: 0;
background: none;
}

input.submit {cursor: pointer;}

input.button
{
display: block;
font-size: 0;
line-height: 0;
text-indent: -9999px;
height: 29px;
}

input.btn-submit
{
width: 96px;
background: transparent url(../img/btn-submit.png) no-repeat 0 0;
}

label
{
font-size: 1.2em;
display: block;
margin: 0 0 3px 0;
}

.qet-a-quote-area span
{
font-size: 1.2em;
display: block;
margin: 0 0 3px 0;
}

textarea {margin: 0 0 10px 0;}

/*------------*/
/* 2. Lay-out */
/*------------*/

div.grand-wrapper /* Important to remove space on the top of page in Opera Browser */
{
margin: 0;
padding: 0;
width: 100%;
position: absolute;
top: 0;
}

div.wrapper
{
margin: 0 auto;
position: relative;
}

div.wrapper-974{width: 974px;}
div.wrapper-960 {width: 960px;}

/*-----------*/
/* 3. Header */
/*-----------*/

div.header
{
background-color: #34b6e4;
border-bottom: 1px solid #FFF;
border-top: 1px solid #37cbff;
height: 171px;
}

.header div.wrapper-974
{
height: 171px;
background: transparent url(../img/header-wrapper-bg.png) no-repeat bottom center;
}

.header a.logo
{
position: relative;
top: 10px;
left: 10px;
}

div.search-box
{
width: 237px;
height: 35px;
position: absolute;
top: 17px;
right: 37px;
background: transparent url(../img/common-sprite.png) no-repeat 0 0;
}

.search-box input
{
margin: 0;
padding: 0;
border: 0;
background: none;
height: 35px;
line-height: 35px;
position: absolute;
top: 0;
}

.search-box input.text
{
width: 181px;
margin: 0 10px;
padding: 5px 0;
height: 25px;
line-height: 25px;
font-size: 1.1em;
left: 0;
font-family: arial, helvetica, serif;
}

.search-box input.submit
{
display: block;
width: 36px;
right: 0;
background: transparent url(../img/common-sprite.png) no-repeat 0 -45px;
text-indent: -9999px;
font-size: 0;
line-height: 0;
}

.search-box input.submit:hover {background-position: -53px -45px;}

/*---------------*/
/* 4. Navigation */
/*---------------*/

/* 4.1. Accessibility Navigation */

ul.nav-access
{
position: absolute;
top: -9999px;
left: -9999px;
}

/* 4.2. Main Navigation */


div.main-navigation
{
position: absolute;
top: 90px;
right: 20px;
}

div.main-navigation li {float: left;}

.main-navigation a 
{
font-size: 1.4em;
font-weight: bold;
color: #FFF;
display: inline-block;
height: 35px;
padding: 0 0 0 13px;
text-decoration: none;
}

.main-navigation span
{
height: 35px;
line-height: 35px;
display: inline-block;
padding: 0 15px 0 0;
}

.main-navigation .selected a, 
.main-navigation a:hover 
{
background: transparent url(../img/nav-active-left.png) no-repeat 0 0;
color: #34b6e4;
text-decoration: none;
}

.main-navigation .selected a span, 
.main-navigation a:hover span
{
background: transparent url(../img/nav-active-right.png) no-repeat 100% 0;
text-decoration: none;
}

/*------------*/
/* 5. Content */
/*------------*/

div.content
{
background: #ababab url(../img/content-bg.png) repeat-x 0 0; 
}

.content div.wrapper-974 {background: transparent url(../img/content-wrapper-bg.png) repeat-y 0 0;}

.content div.wrapper-960
{
width: 900px;
padding: 0 30px;
background: transparent url(../img/content-block-bg.png) no-repeat 0 0;
}

.content h1, h2, h3, h4, h5, h6
{
color: #34b6e4;
font-weight: normal;
}

.content h2 {font-size: 2.7em;}

.content a
{
font-size: 1em;
color: #139ecf;
}

div.caonz-area
{
width: 455px;
margin: 0 auto;
height: 61px;
line-height: 61px;
font-weight: normal;
}

.caonz-area a.logo
{
width: 55px;
height: 61px;
float: left;
margin: 0 25px 0 10px;
}

.caonz-area p
{
float: left;
line-height: 61px;
font-size: 1.4em;
}

a.enlarge-img-btn
{
display: block;
width: 33px;
height: 33px;
background: transparent url(../img/common-sprite.png) no-repeat 0 -154px;
position: absolute;
bottom: 0;
right: 0;
z-index: 999;
text-indent: -9999px;
line-height: 0;
font-size: 0;
}

	/* 5.1. Home Page */
	
	.template-home div.wrapper-960 {background-position: 0 249px;}
	
	.template-home div.main-block
	{
	width: 510px;
	float: left;
	}
	
	.template-home div.content-block {padding: 40px 0 0 0;}
	
	.template-home div.sec-block
	{
	width: 367px;
	float: right;
	}
	
		/* 5.1.1. Slider */
	
		div.slider-area 
		{
		width: 900px;
		height: 226px; /* 224 */
		margin: 0 0 25px 0;		
		}
		
		.slider-area a {text-decoration: none;}
		
		.slider-area span.text-area
		{
		display: block;
		width: 458px; /*528 */
		height: 154px; /* 224 */
		padding: 35px;
		background: transparent url(../img/home-sprite.png) no-repeat 0 -65px;
		float: left;
		color: #FFF;
		font-size: 1.3em;
		position: relative;
		top: 1px;
		}
		
		.slider-area .text-area span.title
		{
		font-size: 4em;
		line-height: 40px;
		margin: 0 0 15px 0;
		display: block;
		}
		
		.slider-area span.img-area
		{
		display: block;
		width: 370px;
		height: 226px;
		float: right;
		position: relative;
		}
		
		.slider-area span.img-area img
		{
		width: 370px;
		height: 226px;
		}
		
		.slider-area .img-area span.img-frame
		{
		display: block;
		width: 370px;
		height: 226px;
		position: absolute;
		top: 0;
		left: 0;
		background: transparent url(../img/home-sprite.png) no-repeat 0 -299px;
		}
				
		div.anythingSlider
		{
		width: 900px !important;
		height: 226px !important;
		padding: 0 !important;
		}
		
		.anythingSlider span.arrow a
		{
		display: block !important;
		width: 10px !important;
		height: 17px !important;
		background: transparent url(../img/home-sprite.png) no-repeat 0 0 !important;
		margin: 0 !important;
		}
		
		.anythingSlider span.back {left: -20px !important;}		
		.anythingSlider span.back a {background-position: 0 -535px !important;}		
		.anythingSlider span.back a:hover {background-position: -60px -535px !important;}
		.anythingSlider span.forward {right: -20px !important;}
		.anythingSlider span.forward a {background-position: 0 -562px !important;}
		.anythingSlider span.forward a:hover {background-position: -60px -562px !important;}
		
		div.anythingWindow {border: 0 !important;}		
		div.anythingControls{display: none !important;}
		
		/* 5.1.2. Main Block */
		
		.template-home div.main-text-area {margin: 0 0 25px 0;}
		
		div.featured-section-area
		{
		width: 510px;
		margin: 0 0 25px 0;
		}
		
		.featured-section-area div.first-item {margin: 0 22px 0 0;}
		
		.featured-section-area img
		{
		position: relative;
		z-index: 1;
		}
		
		div.featured-section
		{
		width: 244px;		
		float: left;	
		overflow: hidden;
		}
		
		.featured-section div.top
		{
		width: 220px;
		background: #e1e1e1 url(../img/feat-section-bg.png) no-repeat 0 0;
		padding: 0 12px;	
		height: 340px;
		}
		
		.featured-section .top p
		{
		margin: 0;
		padding: 0 0 10px 0;
		}
		
		.featured-section div.bottom
		{
		height: 5px;		
		background: transparent url(../img/home-sprite.png) no-repeat 0 -729px;
		}
		
		.featured-section a
		{
		display: block;
		margin: 0 0 20px 0;
		}
		
		.featured-section span.img-area
		{
		display: block;
		width: 220px;
		height: 117px;	
		position: relative;
		margin: 0 auto;
		}
		
		.featured-section .img-area span.feat-item-frame
		{
		width: 220px;
		height: 117px;
		background: transparent url(../img/home-sprite.png) no-repeat 0 -587px;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 999;
		}
		
		.featured-section img
		{
		width: 220px;
		height: 117px;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		}
		
		/* 5.1.3. Sec Block */
		
		div.contact-area
		{
		width: 339px;
		height: 55px;
		margin: 0 auto 25px auto;
		background: transparent url(../img/home-sprite.png) no-repeat 0 0;
		text-indent: -9999px;
		}
		
		div.qet-a-quote-area
		{
		width: 367px;
		}
		
		.qet-a-quote-area div.top
		{
		width: 341px;
		padding: 0 13px;
		background: #e1e1e1 url(../img/get-a-quote-bg.png) no-repeat 0 0;
		}
		
		.qet-a-quote-area div.bottom
		{
		width: 367px;
		height: 5px;		
		background: transparent url(../img/home-sprite.png) no-repeat 0 -714px;
		}
				
		.qet-a-quote-area input {margin: 0 0 10px 0;}
		
		div.input-text-container
		{
		width: 309px;
		background: transparent url(../img/form-sprite.png) no-repeat 0 0;
		height: 29px;
		margin: 0 0 10px 0;
		position: relative;
		}
		
		.qet-a-quote-area input.text
		{
		margin: 0 10px;
		padding: 5px 0;
		width: 289px;	
		height: 19px;		
		line-height: 29px;		
		font-size: 1.2em;		
		background: none;
		position: absolute;
		top: 0;
		left: 0;
		}
		
		div.text-area-container
		{
		width: 339px;
		height: 129px;
		background: transparent url(../img/form-sprite.png) no-repeat 0 -44px;
		margin: 0 0 10px 0;
		}
		
		.qet-a-quote-area textarea
		{
		margin: 10px;
		width: 319px;
		height: 109px;
		font-size: 1.15em;
		font-family: arial, helvetica, serif;
		}
		
		.qet-a-quote-area input.btn-submit
		{
		margin: 0;
		height: 39px;
		padding: 0 0 10px 0;		
		}
	
	/* 5.2. Standard Content Page */
	
	.template-std-page div.wrapper-960,
	.template-no-sec div.wrapper-960 {background: transparent url(../img/std-page-content-bg.png) no-repeat 0 71px;}
	
	a.print-page-link
	{
	font-size: 1.2em;
	display: inline-block;
	height: 22px;
	line-height: 22px;
	padding: 0 31px 0 0;
	background: transparent url(../img/common-sprite.png) no-repeat 65px -90px;
	position: absolute;
	top: 17px;
	right: 42px;	
	}
	
	.template-std-page div.main-block
	{
	width: 601px;
	float: left;
	}
	
	.template-std-page div.sec-block
	{
	width: 276px;
	float: right;
	}
	
	.template-std-page div.content-block, 
	.template-no-sec div.content-block  {padding-top: 41px;}

		/* 5.2.1. Main Block */
		
		div.cms-std-editable-area {margin: 0 0 30px 0;}
	
		.cms-std-editable-area li
		{
		background: transparent url(../img/common-sprite.png) no-repeat -114px -41px;
		font-size: 1.2em;
		padding: 0 0 0 20px;
		margin: 0 0 5px 0;
		}

		.cms-std-editable-area li p {font-size: 1em;}
			
		/* 5.2.2. Sec Block */
		
		.sec-block  div.section {margin: 0 0 20px 0;}
		
		.sec-block  div.cms-std-editable-area {margin: 0;}
		
		.sec-block div.img-area
		{
		width: 276px;
		height: 337px;
		position: relative;
		}
		
		.sec-block div.img-area img
		{
		width: 276px; /* 262px */
		height: 337px; /* 323px */
		}
		
		.img-area span.shadow-img-frame
		{
		display: block;
		width: 276px;
		height: 337px;
		position: absolute;
		top: 0;
		left: 0;
		background: transparent url(../img/side-img-frame.png) no-repeat 0 0;
		}

		.pdf-download li
		{
		font-size: 1.2em;
		padding: 0 0 0 35px;
		background: transparent url(../img/common-sprite.png) no-repeat 0 -122px;
		height: 22px;
		margin: 0 0 10px 0;
		line-height: 22px;
		}
	
	/* 5.3. Crane and Truck Fleet Page */
	
	.template-no-sec div.main-block {padding: 0 0 25px 0;}	
	div.img-list-area {margin: 0 0 25px 0;}
	
	.crane-list li
	{
	float: left;
	width: 225px; /* 228px */
	height: 180px;
	overflow: hidden;
	margin: 0 0 10px 0;	
	}
	
	.crane-list div.img-area
	{
	width: 225px; /* 228px */
	height: 156px; /* 158px */
	position: relative;
	}
	
	.crane-list div.img-container
	{
	width: 225px; /* 228px */
	height: 156px; /* 158px */
	overflow: hidden;
	}

	.crane-list img
	{
	width: 225px; /* 228px */
	height: 156px; /* 158px */
	}
	
	.crane-list span.img-frame
	{
	width: 225px; /* 228px */
	height: 156px; /* 158px */
	background: transparent url(../img/fleet-sprite.png) no-repeat 0 0;
	position: absolute;
	top: 0;
	left: 0;
	}
	
	.crane-list div.caption
	{
	width: 208px;
	margin: 0 auto;
	text-align: center;
	}
	
	div.zoom-note
	{
	background: transparent url(../img/fleet-sprite.png) no-repeat 0 -164px; 
	color: #34b6e4;
	height: 28px;
	line-height: 28px;
	padding: 0 0 0 40px;
	font-size: 1.2em;
	margin: 0 0 15px 0;
	float: right;
	position: relative;
	right: 20px;
	}
	
	div.table-list-area {margin: 0 0 25px 0;}
	
	.table-list-area table
	{
	width: 460px;
	border-top: 1px solid #e6e6e6;
	border-left: 1px solid #e6e6e6;
	margin: 10px 0 0 0;
	}
	
	.table-list-area th, td
	{
	border-right: 1px solid #e6e6e6;
	border-bottom: 1px solid #e6e6e6;
	}
	
	.table-list-area th
	{
	font-weight: bold;
	background-color: #ebebeb;
	text-align: left;
	}
	
	.table-list-area .alt td {background-color: #ebebeb;}	
	.table-list-area div.table-area {float: left;}	
	
	.table-list-area div.img-area 
	{
	float: right;
	width: 366px;
	height: 229px;
	position: relative;
	}
	
	.table-list-area .img-area img
	{
	width: 366px;
	height: 229px;
	}
	
	.table-list-area .img-area span.img-frame
	{
	display: block;
	width: 366px;
	height: 229px;
	background: transparent url(../img/fleet-sprite.png) no-repeat 0 -202px;
	position: absolute;
	top: 0;
	left: 0;
	}	
/*-----------*/
/* 6. Footer */
/*-----------*/

div.footer
{
border-top: 1px solid #fff;
background-color: #1e1e1e;
color: #FFF;
font-size: 1.15em;
}

.footer a
{
font-size: 1em;
color: #FFF;
text-decoration: none;
}

.footer a:hover {text-decoration: underline;}

.footer div.wrapper
{
padding: 40px 25px 30px 25px;
background: transparent url(../img/footer-wrapper-bg.png) no-repeat 0 0;
width: 910px;
}

div.copy {float: left;}
div.by {float: right;}

.by a
{
color: #34b6e4;
font-weight: bold;
font-size: 1.3em;
}

.by a:hover
{
text-decoration: none;
color: #FFF;
}

/*------------------------*/
/* 7. Plug-in Related CSS */
/*------------------------*/

/*-------------------*/
/* 8. Additional CSS */
/*-------------------*/
.floatLeft 
{
    float:left;
}

.floatRight
{
    float:right;
}
.error { color: Red; }
.h1-home 
{
    visibility:hidden;
    display:none;
}