/* -------------------------------------------------------------- 
  
   Thousandminds CSS
   
-------------------------------------------------------------- */

@import 'reset.css';
@import 'typography.css';

/* Main
-------------------------------------------------------------- */

body {
	background:#141213 url(/images/bg-about.jpg) center top no-repeat;
	overflow:visible;
	line-height:2em;
}

/* ID's
-------------------------------------------------------------- */

/* Main Navigation */
ul#nav-main {
	font-size:90%;
	list-style-type:none;
	text-transform:uppercase;
	margin:65px 0 0 30px;
}
	ul#nav-main li {
	margin-bottom:.5em;
	}
	ul#nav-main li a {margin-left:1em; color:#5e5e5e; text-decoration:none;}
	ul#nav-main li a:hover {color:#979797;}
	
ul#services {}
ul#services li {
	list-style:none;
	padding-left:20px;
	margin-left:10px;
	border-left:1px solid #282828;
	}
ul#services li p {
	padding-left:0;
	}

/* About Us */
div#about {
	margin-top:170px;
	background: url(/images/bg-about-box.jpg) no-repeat center top;
	height:2200px;

}
	h3#about-us {
	text-indent:-9999px;
	background:url(/images/title-About-Us.gif) no-repeat;
	width:59px;
	height:13px;
	}


/* Works */
div#our-works {
	background:url(/images/bg-our-work.jpg) no-repeat center top;
	overflow:visible;
	padding-top:400px;
}	
	
	h3#works {
	text-indent:-9999px;
	background:url(/images/title-Our-Work.gif) no-repeat;
	width:79px;
	height:13px;
	}
	
	ul#portfolio {margin:20px 0;}
	ul#portfolio li {
	list-style:none;
	margin-bottom:30px;
	}
	
	ul#portfolio li dl {
	padding: 1em ;
	line-height: 1.4em;
	background-color: #222;
	background-image: url(/images/bg-portfolio.gif);
	border-bottom:1px dashed #c01c41;
	margin-bottom:0;
	}
	
	ul#portfolio li dt {
	color: #cc1d44;
	font-weight: 700;
	font-style: normal;
	background: none;
	float: left;
	}

	ul#portfolio li dd {
	margin-left: 5.5em;
	}

/* Contact Us */
div#contact {
	background:url(/images/bg-contact.jpg) no-repeat center bottom;
	overflow:visible;
	padding-top:150px;
}

	h3#contact-h {
	text-indent:-9999px;
	background:url(/images/title-Contact-Us.gif) no-repeat;
	width:146px;
	height:13px;
	}

	/* Links */
	h3#links-h {
	text-indent:-9999px;
	background:url(/images/title-Links.gif) no-repeat;
	width:93px;
	height:13px;
	}
	
	ul.links {
		float:left;
		margin:5px 10px 4em 50px;
		list-style-image:url(/images/bullet_blue.gif);
	}
	ul.links li { margin-bottom:5px; }

.container #promo { 
	background:url(/images/go.gif) 640px center no-repeat #54621e; 
	padding:5px 45px 5px 10px; 
	position:absolute; 
	margin:0 30px; 
	width:630px; 
	top:370px;
	border:1px solid #2d3609;
	border-top:1px solid #7e8f3b;
	border-left:1px solid #7e8f3b;   
	}
.container #promo:hover {background-color:#748534; text-decoration:none;}
/* Classes
-------------------------------------------------------------- */

/* A container should group all your columns. */
.container {
  width: 760px;
  margin: 0 auto;
}

.content {padding:35px 30px;}

.content p {padding-left:25px; }

/*3 Colors*/
	.green {color:#799c0c;}
	.red-pink {color:#cc1d44;}
	.blue {color:#3685aa;}

/* Top Button */
div.top {
	position: relative;
	left: 650px;
	top: -45px;
	width: 37px; height: 14px;
	background: url(/images/top.gif) top left no-repeat;
	}

div.top a {
	display: block;
	width:100%;
	height:100%;
	overflow:hidden;
	background: url(/images/top.gif) 0 -17px no-repeat;
	}

div.top a:hover {
	background-image: none;
	}
	
/* Misc classes and elements
-------------------------------------------------------------- */

/* Use a .box to create a padded box inside a column.  */ 
.box { 
  padding: 1.5em; 
  margin-bottom: 1.5em; 
  background: #eee; 
}

/* Use this to create a horizontal ruler across a column. */
hr {
  background: #042D3F; 
  color: #042D3F;
  clear: both; 
  float: none; 
  width: 100%; 
  height: .1em;
  margin: 0 0 1.4em;
  border: none; 
}

hr.space {
  background: #fff;
  color: #fff;
}
.float-left {float:left;}
.float-right {float:right;}


/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.html] */

.clear { display: inline-block; }   
.clear:after, .container:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}
* html .clear { height: 1%; }
.clear { display: block; }