/*---------------------------------------------*/
/* Work Navigation
/*---------------------------------------------*/
#work-nav {
	float: left;
	display: block;
	width: 920px;
	margin: 0;
	padding: 0;
}

#work-nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#work-nav li {
	float: left;
	margin: 0;
	padding: 0;
	text-align: center;
}

#work-nav li a {
	display: block;
	height: 37px;
	margin: 0;
	padding: 12px 47px 2px 46px;
	font-size: 0.875em;
	text-decoration: none;
	background: #e5e5e5;
}

#work-nav li#nav-featured a {
	padding-left: 20px;
	padding-right: 20px;
	background: #cecece;
}
#work-nav li#nav-websites a:hover,
#work-nav li#nav-websites a.active {
	color: #61abc0;
}

#work-nav li#nav-social a:hover,
#work-nav li#nav-social a.active {
	color: #edb741;
}
#work-nav li#nav-mobile a:hover,
#work-nav li#nav-mobile a.active {
	color: #6bc3ad;
}
#work-nav li#nav-installations a:hover,
#work-nav li#nav-installations a.active {
	color: #f8a9be;
}
#work-nav li#nav-internal a:hover,
#work-nav li#nav-internal a.active {
	color: #7a7a7a;
}

#work-nav li#nav-internal a {
	padding-right: 21px;
	padding-left: 22px;
}

#site #work-nav li a.active,
#site #work-nav li a:hover {
	background: #f2f2f2;
}

/*---------------------------------------------*/
/* Featured Project Styles
/*---------------------------------------------*/
#project,
#featured {
	float: left;
	position: relative;
	margin: 36px 0 0 0;
	padding: 0;
}

#featured {
	width: 900px;
	height: 421px;
	overflow: hidden;
	background: transparent url("http://nation.local/site/assets/images/work-section-border.gif") no-repeat 0 100%;
}

#project h2,
#featured h2 {
	display: none;
}

#project article {
	float: left;
	width: 900px;
	margin: 0;
	padding: 0;
}

#featured article {
	position: absolute;
	top: 0;
	left: 0;
}

#project header,
#featured header {
	margin: 0;
	padding: 0;
}

.content {
	float: left;
	display: inline;
	overflow: hidden;
	width: 275px;
	margin: 0;
	padding: 33px 37px 50px 0;
}

#project h1,
#featured h1 {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0 0 10px 0;
	color: #747474;
	font-size: 1.25em;
	font-weight: 400;
}

#project h1 a,
#featured h1 a {
	color: #747474;
	text-decoration: none;
}
#project h1 a:hover,
#featured h1 a:hover {
	color: #61abc0;
}

#project dl,
#featured dl {
	margin: 0;
	padding: 0;
	color: #61abc0;
	font-size: 1em;
}

#project dt,
#project dd,
#featured dt,
#featured dd {
	float: left;
	display: inline;
	margin: 0;
	padding: 0;
}
#project dd,
#featured dd {
	padding-left: 3px;
	padding-bottom: 19px;
}

#project dt.post-date,
#featured dt.post-date {
	display: none;
}

#project dd.post-date,
#featured dd.post-date {
	float: none;
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	padding: 0 5px 3px 6px;
	color: #fff;
	font-size: 0.813em;
	text-transform: uppercase;
}

#project img,
#featured img {
	float: right;
	margin-bottom: 20px;
	border: 3px solid #fff;
}

#project p,
#featured p {
	float: left;
	width: 100%;
}

#project footer,
#featured footer {
	position: absolute;
	width: 275px;
	bottom: 20px;
	left: 0;
	margin: 0;
	padding: 0;
	background: none;
}


#featured footer a.full-project {
	float: right;
	display: block;
	margin: 0;
	padding: 2px 5px 7px 6px;
	color: #FFF;
	line-height: 1.188em;
	font-size: 	0.813em;
	text-align: center;
	background: #6bb0c3;
}

#featured footer a:hover {
	background: #71777a;
}

/*---------------------------------------------*/
/* Project List Styles
/*---------------------------------------------*/
#project-list,
#full-project-list {
	float: left;
	position: relative;
	width: 939px;
	margin: 40px 0 0 0;
	padding: 26px 0 0 0;
}
#project-list {
	margin-top: 0;
	padding-top: 35px;
}
#full-project-list {
	background: transparent url('../images/global-border.gif') no-repeat 0 0;
}
#full-project-list {
	margin: 0;
	background: transparent;
}

#project-list h2,
#full-project-list h2 {
	float: left;
	width: 100%;
	margin: 0;
	padding: 25px 0 20px 0;
	font-size: 1.125em;
	font-weight: 400;
	color: #747474;
	background: transparent url('http://www.wearenation.co.uk/site/assets/images/work-section-border.gif') no-repeat 0 0;
}
#project-list h2 {
	padding-top: 32px;
}
#full-project-list h2.first {
	padding-top: 0;
	background: transparent;
}

#project-list ul {
	position: relative;
	width: 900px;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow: hidden;
}

#full-project-list ul {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	background: transparent url('../images/work-list-bg.gif') no-repeat 0 100%;
}

#full-project-list li {
	float: left;
	display: inline;
	width: 269px;
	height: 242px;
	margin: 0;
	padding: 0 43px 32px 0;
	text-align: center;
}

#project-list li {
	float: left;
	display: inline;
	top: 0;
	width: 269px;
	margin: 0;
	padding: 0 43px 32px 0;
	text-align: center;
}

#project-list li.active a img,
#project-list li.active a:hover img {
	border-color: #6bb0c3;
}

#project-list li#item-2 {
	padding-right: 0;
}

#project-list img,
#full-project-list img {
	border: 3px solid #fff;
}

#project-list a:hover img,
#full-project-list a:hover img {
	border-color: #cecccc;
}


#project-list h3,
#full-project-list h3 {
	margin: 0;
	padding: 10px 0 0 0;
	color: #747474;
	font-size: 1em;
	font-weight: 400;
}

#project-list h3 a,
#full-project-list h3 a {
	color: #747474;
}
#project-list h3 a:hover,
#full-project-list h3 a:hover {
	color: #67abc4;
}

.project-link {
	margin: 0;
	padding: 0;
	color: #67abc4;
	font-size: 0.875em;
	font-weight: 400;
}

#featured a:hover.project-link img {
	border-color: #cecccc;
}

#project-list nav {
	position: absolute;
	top: 27px;
	right: 39px;
	margin: 0;
	padding: 0;
}

#project-list nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#project-list nav li {
	float: left;
	display: inline;
	width: auto;
	margin: 0;
	padding: 0;
}

#project-list nav li a {
	float: left;
	display: inline;
	width: 73px;
	height: 33px;
	margin: 0;
	padding: 0;
	font-size: 0.01em;
	text-indent: -99999px;
	text-decoration: none;
	overflow: hidden;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: 0 0;
}
#project-list nav li a#back {
	width: 73px;
	background-image: url('../images/projects-button-back.gif');
}
#project-list nav li a#next {
	width: 74px;
	background-image: url('../images/projects-button-next.gif');
}

#project-list nav li a:hover {
	background-position: 0 -33px;
}

.work-type {
	display: inline;
	margin: 0;
	padding: 0 5px 4px 5px;
	color: #fff;
	font-size: 0.875em;
	background: #7a7a7a;
}

a:hover.work-type {
	color: #ccc;
}

.work-websites {
	background: #61abc0;
}
a:hover.work-websites {
	color: #447c8c;
}
.work-social {
	background: #edb741;
}
a:hover.work-social {
	color: #b98d2d;
}
.work-mobile {
	background: #6bc3ad;
}
a:hover.work-mobile {
	color: #428474;
}
.work-installations {
	background: #f8a9be;
}
a:hover.work-installations {
	color: #c78496;
}
.work-internal {
	background: #7a7a7a;
}

/*---------------------------------------------*/
/* Project Page Styles
/*---------------------------------------------*/

#view-options {
	float: left;
	margin: 0;
	padding: 22px 0 31px 0;
	list-style: none;
}

#view-options li {
	float: left;
	margin: 0;
	padding: 0;
	text-align: center;
}

#view-options li a {
	display: block;
	width: 273px;
	height: 26px;
	margin: 0 0 1px 0;
	padding: 0 0 7px 0;
	color: #fff;
	font-size: 1.125em;
	text-decoration: none;
	background: #6bb0c3;
	text-transform: uppercase;
}

#view-options li#share-twitter a {
	background: #6bc3ad;
}

#view-options li#share-facebook a {
	background: #f8a9be;
}

#site #view-options li a:hover {
	background: #71777a;
}

#project footer {
	position: static;
	float: left;
	padding-bottom: 34px;
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: #cecece;
}

#project footer nav {
	float: right;
	margin-right: 2px;
}

#project footer nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#project footer nav li {
	float: left;
	display: inline;
	margin: 0;
	padding: 0;
}

#project footer nav li a,
#project footer nav li span {
	height: 19px;
	margin: 0;
	padding: 0 3px 0 0;
	line-height: 1em;
	color: #61abc0;
	text-decoration: none;
	font-size: 0.875em;
	overflow: hidden;
}
#project footer nav li span {
	font-size: 1em;
}

#project footer nav li#previous a {
	padding-left: 14px;
	background: transparent url('http://www.wearenation.co.uk/site/assets/images/projects-nav-previous.gif') no-repeat 0 0;
}

#project footer nav li#next a {
	padding-right: 9px;
	background: transparent url('http://www.wearenation.co.uk/site/assets/images/projects-nav-next.gif') no-repeat 100% 0;
}

#project footer nav li#previous a:hover {
	color: #555555;
	background-position: 0 -50px;
}
#project footer nav li#next a:hover {
	color: #555555;
	background-position: 100% -50px;
}

#project footer .like-button {
	width: auto;
}