/* -------------------------------------

#. Body

------------------------------------- */



body {

	margin: 0;

	padding: 0;
	
	font: 12px Verdana, Arial, sans-serif;
	color: #777;

}



/* -------------------------------------

#. General

------------------------------------- */



.clear {clear: both;}



/* -------------------------------------

#. Containers & Wrappers

------------------------------------- */



.container {

	width: 940px;

	margin: 0 auto;

}



/* -------------------------------------

#. Typo

------------------------------------- */



a {text-decoration: none; color: #CCC;}

a:hover {
	color: #F90;
}


p {line-height: 20px;}



/* -------------------------------------

#. Header

------------------------------------- */


.header {
	padding: 15px 0;
	background: #0d1015;
}


.header .top {

	padding: 25px 0;
	margin-bottom: 15px;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);

	background: transparent url('../img/header.png') repeat-y;

}

.header .top .logo {
	float: left;
}

	.header .top .logo img {
		width: 300px;
	}

.header .top .navigation {
	float: right;
}

.header .top .navigation ul {
	padding: 0;
	margin: 40px 0 0;
	overflow: hidden;
	list-style: none;
}

.header .top .navigation ul li {
	float: left;
	margin-right: 15px;
}

.header .top .navigation ul li.last {
	margin-right: 0;
}

.header .top .navigation ul li a {
	color: #ccc;
	font-size: 16px;
	text-transform: uppercase;
}

.header .top .navigation ul li a:hover {
	color: #F90;
}

/* -------------------------------------
#. Slogan
------------------------------------- */

.slogan {
	padding: 35px 0;
	background: #e6e6e6;
	border-bottom: 1px solid #ddd;
	box-shadow: inset 0 -1px 0 #fff, 0 1px 2px rgba(0, 0, 0, 0.1);
}

.slogan h2 {
	font-weight: normal;
	margin: 0;
	line-height: 30px;
	color: #777;
	float: left;
}

.slogan .btn {
	display: inline-block;
	float: right;
	padding: 7px 10px;
	margin-left: 50px;
	
	background: #273037;
	box-shadow: inset 0 1px 0 #334049;

	-webkit-box-shadow: inset 0 1px 0 #334049;
	border: 1px solid #2f383f;
	color: #fff;
	
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
}



.slogan .btn:hover {

	background: #F60;

	box-shadow: inset 0 1px 0 #CCC;

	-webkit-box-shadow: inset 0 1px 0 #CCC;

}



/* -------------------------------------

#. Services

------------------------------------- */



.services {

	padding: 40px 0;

}



.services h1 {

	font-weight: normal;

	margin-bottom: 40px;

}



.services ul {

	margin: 0;

	padding: 0;

	list-style: none;

	overflow: hidden;

}



.services ul li {

	float: left;

	width: 220px;

	margin-right: 20px;

	overflow: hidden;

}



.services ul li.last {

	margin-right: 0;

}



.services ul li h2 {

	font-weight: normal;

	font-size: 12px;

	margin-top: 0;

	text-transform: uppercase;

	padding-bottom: 5px;

	border-bottom: 1px solid #e0e0e0;

	box-shadow: 0 1px 0 #fff;

}



.services ul li .icon {

	float: left;

	margin-right: 5px;

	margin-bottom: 5px;

	margin-top: 10px;

}



/* -------------------------------------

#. Footer

------------------------------------- */



.footer {

	padding: 50px 0 0;

	border-top: 5px solid #1e2329;

	background: #0c0f14 url('../img/footer.jpg') repeat-x;

	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);

	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);

}



.footer .col {

	margin: 0;

	padding: 0;

	list-style: none;

	overflow: hidden;

}



.footer .col li {

	width: 300px;

	margin-right: 20px;

	float: left;

}



.footer .col li.last {

	margin-right: 0;

}



.footer .col li h3 {

	font-weight: normal;

	color: #eee;

	font-size: 18px;

	margin-top: 0;

}



.footer .col li ul {

	padding: 0;

	margin: 0;

	list-style: none;

	border-top: 1px solid #444;

	border-bottom: 1px solid #444;

	overflow: hidden;

}



.footer .col li ul li {

	padding: 10px 0;

	border-bottom: 1px solid #444;

}



.footer .col li ul li.last {

	border-bottom: none;

}



.footer .col li ul li a {

	color: #999;

	font-size: 12px;

}
.footer .col li ul li a:hover {
	color:#F60;
}

.footer .col li #form {}



.footer .col li #form input[type='text'], .footer .col li #form textarea {

	background: #0e1217;

	border: none;

	border-radius: 3px;

	-moz-border-radius: 3px;

	-webkit-border-radius: 3px;

	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.05);

	color: #777;

	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);

	outline: none;

}



.footer .col li #form label {

	float: left;

	text-transform: uppercase;

	font-size: 10px;

	padding: 9px 0 0;

}



.footer .col li #form input[type='text'] {

	width: 76%;

	padding: 2%;

	float: right;

	margin-bottom: 10px;

}



.footer .col li #form textarea {

	resize: none;

	width: 96%;

	height: 100px;

	padding: 2%;

}



.footer .col li #form input[type='submit'] {

	background: #0e1217;

	margin-top: 20px;

	padding: 10px;

	font-size: 14px;

	border: none;

	border-radius: 3px;

	-moz-border-radius: 3px;

	-webkit-border-radius: 3px;

	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 2px rgba(0, 0, 0, 0.5);

	color: #777;

	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);

}



.footer .col li #form input[type='submit']:hover {

	background: #1e242b;

	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.5);

	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);

}



.footer .lower {

	border-top: 1px solid #444;

	margin-top: 50px;

	background: #000;

	padding: 15px 0;

	color: #555;

	font-size: 10px;

}



.footer .lower p {

	margin: 0;

	float: left;

}



.footer .lower .navigation {

	float: right;

}



.footer .lower .navigation ul {

	padding: 0;

	margin: 0;

	list-style: none;

	overflow: hidden;

}



.footer .lower .navigation ul li {

	float: left;

	margin-right: 15px;

}



.footer .lower .navigation ul li.last {

	margin-right: 0;

}



.footer .lower .navigation ul li a {

	text-transform: uppercase;

}



.footer .lower .navigation ul li a:hover {

	color: #999;

}

/* ----------------------------------
#. Services
---------------------------------- */

.services-list {
	list-style: none;
	padding: 0 0 15px;
	margin: 0;
}

.services-list li {
	background: url('../img/tick.png') no-repeat;
	padding: 1px 0 3px 25px;
	margin-bottom: 5px;
}

/* ----------------------------------
#. Form
---------------------------------- */

.error {color: red;}
.success {color: green;}

.form {
	
}

.form input[type='text'], .form textarea {
	padding: 10px;
	border: 1px solid #ccc;
}

.form input[type='text'] {
	width: 250px;
}

.form textarea {
	width: 400px;
	height: 100px;
	min-height: 100px;
	resize: vertical;
}

/* ----------------------------------
#. Portfolio
---------------------------------- */

.portfolio {
	list-style: none;
	padding: 0;
	margin: 0;
}

	.portfolio li {
		float: left;
		width: 220px;
		height: 140px;
		overflow: hidden;
		margin-right: 20px;
		margin-bottom: 20px;
	}
	
		.portfolio li.last {
			margin-right: 0;
		}
	
	.portfolio li img {
		max-width: 100%;
		min-height: 100%;
	}