@charset "utf-8";
/* CSS Document */

/* body -------------------------------------------------*/

h1,h2,h3,h4,h6,p,blockquote,ol,ul,li,img {
	margin: 0px;
	padding: 0px;
}

body {
	margin: 0px;
	color: #fff;
	background-color:#000;
	background-attachment: fixed;
	background-image: url(backgrounds/bg-main.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}



/* text -------------------------------------------------*/

@font-face {
	font-family: 'Conv_GOTHIC';
	src: url('fonts/GOTHIC.eot');
	src: url('fonts/GOTHIC.woff') format('woff'), url('fonts/GOTHIC.ttf') format('truetype'), url('fonts/GOTHIC.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

a:link {
	text-decoration: underline;
	color: #CCC;
}
a:visited {
	text-decoration: underline;
	color: #CCC;
}
a:hover {
	text-decoration: underline;
	color: #FFF;
}
a:active {
	text-decoration: underline;
	color: #CCC;
}

p {
	font-family: 'Conv_GOTHIC';
	font-size: 13px;
	color: #999;
	margin: 0px 0px 10px 0px;
	padding:0px;
	line-height: 1.6em;
}

h1 {
	font-family: 'Conv_GOTHIC';
	font-size: 26px;
	color: #fff;
	line-height: 1.5em;
	margin: 0px 0px 10px 0px;
	padding:0px;
	font-weight: normal;
}

h2 {
	font-family: 'Conv_GOTHIC';
	font-size: 18px;
	color: #FAB800;
	line-height: 1.5em;
	margin-top: 20px;
	margin-bottom: 15px;
	font-weight: normal;
}

h3 {
	font-family: 'Conv_GOTHIC';
	font-size: 16px;
	color: #5DAD19;
	line-height: 1.5em;
	margin-bottom: 15px;
	font-weight: normal;
	
}

.bullets {
list-style-type:none;
padding:0px;
margin-bottom:10px;
}

.bullets li {
            padding-left:0px;
            font-size: 13px;
            line-height: 1.8em;
            margin-bottom:0px;
            font-family: 'Conv_GOTHIC';
            font-weight: normal;
            color: #999;
            list-style-type: disc;
            list-style-position: inside;
}


/* wrapper ------------------------------------*/

#wrapper {
	width: 880px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 20px;
	margin-left: auto;
	padding:0px 20px 20px 20px;
	background-image: url(backgrounds/bg-wrapper.png);
	background-repeat: repeat;
}

/* header ------------------------------------*/

#header {
	width: 880px;
	background-color: #666;
	/*margin-bottom:10px;*/
}

#slideshow {
    position:relative;
    height:470px;
}

#slideshow IMG {
    position:absolute;
    top:0;
    left:0;
    z-index:8;
    opacity:0.0;
}

#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
}

#slideshow IMG.last-active {
    z-index:9;
}

/* nav ---------------------------------------*/

#nav-wrap {
	width: 880px;
	height:44px;
	margin:0px 0px 0px 0px;
	background-image: url(backgrounds/bg-nav.png);
	background-repeat: no-repeat;
}

/* remove the list style */
#nav {
	margin:0; 
	padding:0; 
	list-style:none;
	font-family: 'Conv_GOTHIC';
	font-size:14px;
	font-weight:bold;
}	
	
/* make the LI display inline */
/* it's position relative so that position absolute */
/* can be used in submenu */
#nav li {
	float:left; 
	display:block; 
	/*width:100px;*/ 
	/*background:#ccc;*/ 
	position:relative;
	z-index:500; 
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #3F4446;
	/*border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #F80138;*/
}
		
/* this is the parent menu */
#nav li a {
	display:block; 
	padding:13px 20px 12px 20px;
	/*font-weight:700;*/  
	/*height:40px;*/
	text-decoration:none; 
	color:#ccc; 
	text-align:left; 
	/*color:#333;*/
}

#nav li a:hover {
	color:#FAB800;
}
	
/* you can make a different style for default selected value */
#nav a.selected {
	color:#f00;
}
	
/* submenu, it's hidden by default */
#nav ul {
	position:absolute; 
	left:0; 
	display:none; 
	margin:0 0 0 -1px; 
	padding:0px; 
	list-style:none;
	font-size:11px;
}
		
#nav ul li {
	width:200px;
	float:left;
	background-color:#262C2F;
	border-top-width: 1px;
	border-right-width: 0px;
	border-top-style: solid;
	border-top-color: #3F4446;
}
		
/* display block will make the link fill the whole area of LI */
#nav ul a {
	display:block;  
	height:15px;
	padding: 6px 5px 6px 5px; 
	color:#ccc;
}
		
#nav ul a:hover {
	text-decoration:none;	
}

/* fix ie6 small issue */
/* we should always avoid using hack like this */
/* should put it into separate file : ) */
*html #nav ul {
	margin:0 0 0 -2px;
}


/* body ------------------------------------*/
/* body ------------------------------------*/
/* body ------------------------------------*/
/* body ------------------------------------*/


#body-wrap {
	width: 840px;
	padding:0px 20px 20px 20px;
	background-color: #181B1D;
}

#content-wrap {
	width: 840px;
	/*margin-bottom:20px;*/
}

#content-left {
	width: 550px;
	margin-right:20px;
	padding-top:10px;
	float:left;
}

#content-right-home {
	width:270px;
	float:left;
	text-align: center;
}

#content-right {
	width:270px;
	float:left;
	text-align: center;
	padding-top:20px;
}

#body {
	width: 650px;
	margin: 20px 30px 30px 0px;
	float: left;
}

/* home buttons --*/

a.vehicle-recycling {
	display: block;
	float:left;
	width: 270px;
	height: 175px;
	background-image: url(buttons/btn-home-vehicle-recycling.jpg);
}

a.vehicle-recycling:hover {
	background-position: center bottom;
}

a.ferrous {
	display: block;
	float:left;
	width: 270px;
	height: 175px;
	background-image: url(buttons/btn-home-ferrous.jpg);
}

a.ferrous:hover {
	background-position: center bottom;
}

a.non-ferrous {
	display: block;
	float:left;
	width: 270px;
	height: 175px;
	background-image: url(buttons/btn-home-non-ferrous.jpg);
}

a.non-ferrous:hover {
	background-position: center bottom;
}

a.collection {
	display: block;
	width: 204px;
	height: 274px;
	background-image: url(pictures/collection-png.png);
	margin-bottom:20px;
}

a.collection:hover {
	background-position: center bottom;
}

a.cash-for-scrap {
	display: block;
	width: 204px;
	height: 65px;
	background-image: url(buttons/btn-cash-for-scrap.png);
}

a.cash-for-scrap:hover {
	background-position: center bottom;
}



/* footer ------------------------------------*/


#footer {
	width: 880px;
	height: 40px;
	background-color:#101214;
}

#footer p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	margin: 0px;
	padding: 0px;
}

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

.left {
	float: left;
	margin-left: 20px;
	margin-top: 12px;
}

.right {
	float: right;
	margin-right: 20px;
	margin-top: 12px;
}

/* footer ------------------------------------*/

.picborder {
	border: 10px solid #292F31;
	margin-bottom: 15px;
}