/*
Theme Name: Blue Portfolio
Theme URI: http://dan-hauk.com
Description: The newest portfolio redesign for me.
Version: 2
Author: Dan Hauk
*/



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

html {
	margin: 0;
	padding: 0;
	}

body {
	margin: 0;
	padding: 0;
	text-align: center;
	background: #076CB0 url(images/body-bg.jpg) repeat-x top left;
	}

#container, #container-404 {
	width: 1024px;
	min-height: 900px;
	margin: 0 auto;
	padding: 0;

	position: relative;
	text-align: left;
	}

#container-404 {
	background: url(images/404.jpg) no-repeat top left;
	padding-top: 400px;
	}

#header {
	width: 1024px;
	height: 150px;
	overflow: auto;
	position: relative;

	background: url(images/header-bg_02.jpg) no-repeat top left;
	}

#logo {
	float: left;

	background: url(images/logo.jpg) no-repeat top left;

	height: 57px;
	width: 278px;
	margin: 50px 0 0 0;
	padding: 0;
	}

ul#main-nav {
	/* margin: 61px 257px 0 0; */
	margin: 0;
	padding: 0;

	/* float: right; */
	height: 44px;
	width: 354px;
	position: absolute;
	top: 61px;
	right: 257px;

	background: url(images/nav.jpg) no-repeat top left;
	}

ul#main-nav li {
	float: left;

	margin: 0;
	padding: 0;

	list-style: none;
	height: 44px;
	}

#welcome {
	height: 100px;
	width: 1000px;
	clear: both;

	margin-bottom: 100px;

	background: url(images/welcome-web-print.jpg) no-repeat top left;
	}

#portfolio-thumbs {
	overflow: auto;
	position: relative;
	}

div.portfolio {
	margin: 0;
	padding: 30px 0;
	overflow: auto;
	}

.description {
	position: relative;
	float: left;

	width: 340px;
	}

#about-full {
	clear: both;
	float: left;
	position: relative;

	background: url(images/about-bg.jpg) no-repeat top center;
	}

#about-full p { padding-right: 339px; line-height: 1.5em; }

#other-info { overflow: auto; clear: both; }

#other-info div {
	float: left;
	width: 215px;
	margin-right: 20px;
	}

#other-info div.blog-feed {
	margin-right: 0;
	}

#about {
	padding: 0 0 25px 0;

	overflow: auto;
	clear: both;
	position: relative;

	background: url(images/about-bg.jpg) no-repeat top center;
	min-height: 303px;
	}

#bio, #contact {
	width: 330px;
	float: left;

	margin-right: 25px;
	}

#contact {
	margin-right: 0;
	}

#elsewhere {
	float: left;
	clear: left;

	width: 300px;
	}

#services {
	width: 275px;
	height: 303px;

	/*float: right;*/
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	right: 0;

	background: url(images/services-note.jpg) no-repeat top right;
	}

#footer {
	background: url(images/footer.jpg) repeat-x top left;
	}

#footer-inner {
	background: url(images/footer-inner.jpg) no-repeat top left;

	height: 124px;
	width: 1024px;

	margin: 0 auto;
	padding: 0;
	}



/*
------------------------------------------------------------
	Typography & Colors
------------------------------------------------------------
*/

body {
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Helvetica, Arial, sans-serif;
	font-weight: 100;
	color: #fff;
	font-size: 13px;
	}

#logo a {
	display: block;

	width: 278px;
	height: 57px;
	}

a {
	color: #082B41;
	text-decoration: none;
	}

a:hover {
	text-decoration: underline;
	}

#welcome span {
	display: none;
	}

.portfolio p {
	font-size: 13px;
	line-height: 1.5em;

	margin: 0;
	padding: 10px 0;
	}

.description span {
	color: #fff;
	font-size: 16px;
	padding-bottom: 10px;
	}

#bio p {
	line-height: 1.5em;
	font-size: 13px;
	}

#footer-inner p {
	color: #fff;
	text-align: right;
	font-size: 12px;
	line-height: 1.5em;

	padding: 0;
	padding-top: 62px;
	margin: 0;
	}

#footer-inner a {
	color: #5F9C46;
	}

#container-404 p {
	color: #fff;
	line-height: 1.5em;

	padding: 25px 0;
	margin: 0;

	width: 380px;
	}

.description a,
#other-info a {
	background: #065991;
	color: #fff;
	}



/*
------------------------------------------------------------
	Headings
------------------------------------------------------------
*/

h1 {
	text-indent: -9999em;
	}

h2 {
	height: 25px;

	text-indent: -9999em;
	}

h2.work {
	background: url(images/h2-the-work.jpg) no-repeat top left;
	}

h2.info {
	background: url(images/h2-the-info.jpg) no-repeat top left;
	clear: both;
	margin-top: 100px;
	}

h2.oh-snap {
	background: url(images/404-ohsnap.jpg) no-repeat top left;
	height: 143px;
	width: 220px;

	margin: 0;
	padding: 0;
	}

h3 {
	font-size: 16px;
	font-weight: normal;
	color: #fff;

	margin: 0;
	padding: 25px 0 10px 0;
	clear: left;
	}

h3.services {
	display: none;
	}

h4 {
	background: #065991;
	font-size: 16px;
	font-weight: normal;
	color: #fff;

	margin: 10px -60px 0 0;
	padding: 5px;
	}



/*
------------------------------------------------------------
	Lists
------------------------------------------------------------
*/

ul#main-nav li a {
	text-indent: -1000em;
	display: block;

	text-decoration: none;
	height: 44px;
	}

ul#main-nav li a:hover {
	background: url(images/nav.jpg) no-repeat 0 -44px;
	}

ul#main-nav li.home {
	width: 83px;
	height: 44px;
	}

ul#main-nav li.home a:hover {
	background-position: 0 -44px;
	}

ul#main-nav li.about {
	width: 79px;
	height: 44px;
	}

ul#main-nav li.about a:hover {
	background-position: -83px -44px;
	}

ul#main-nav li.portfolio {
	width: 98px;
	height: 44px;
	}

ul#main-nav li.portfolio a:hover {
	background-position: -162px -44px;
	}

ul#main-nav li.contact {
	width: 94px;
	height: 44px;
	}

ul#main-nav li.contact a:hover {
	background-position: -260px -44px;
	}

ul.services {
	display: none;
	}

ul.social,
div.blog-feed ul {
	margin: 0;
	padding: 0;
	/*width: 125px;*/
	
	border-top: 1px solid #0664a2;
	}

ul.social li,
div.blog-feed ul li {
	list-style: none;
	padding: 0;
	margin: 0;
	}

ul.social li a,
div.blog-feed ul li a {
	display: block;

	padding: 5px 10px 5px 27px;
	border-bottom: 1px solid #0664a2;
	}

ul.social li.twitter a { background: url(images/social-icons/twitter-16x16.jpg) no-repeat 5px center !important; }
ul.social li.twitter a:hover { background: #0664a2 url(images/social-icons/twitter-16x16.jpg) no-repeat 5px center !important; border-bottom: 1px solid #065a92; }

ul.social li.flickr a { background: url(images/social-icons/flickr-16x16.jpg) no-repeat 5px center !important; }
ul.social li.flickr a:hover { background: #0664a2 url(images/social-icons/flickr-16x16.jpg) no-repeat 5px center !important; border-bottom: 1px solid #065a92; }

ul.social li.digg { background: url(images/social-icons/digg-16x16.jpg) no-repeat 5px center !important; }
ul.social li.digg a:hover { background: #0664a2 url(images/social-icons/digg-16x16.jpg) no-repeat 5px center !important; border-bottom: 1px solid #065a92; }

ul.social li.facebook { background: url(images/social-icons/facebook-16x16.jpg) no-repeat 5px center !important; }
ul.social li.facebook a:hover { background: #0664a2 url(images/social-icons/facebook-16x16.jpg) no-repeat 5px center !important; border-bottom: 1px solid #065a92; }

ul.social li.linkedin a { background: url(images/social-icons/linkedin-16x16.jpg) no-repeat 5px center !important; }
ul.social li.linkedin a:hover { background: #0664a2 url(images/social-icons/linkedin-16x16.jpg) no-repeat 5px center !important; border-bottom: 1px solid #065a92; }

div.blog-feed ul li a { background: 0 !important; padding: 5px; }
div.blog-feed ul li a:hover { background: #0664a2 !important; border-bottom: 1px solid #065a92; }



/*
------------------------------------------------------------
	Images
------------------------------------------------------------
*/

img a {
	border: 0;
	}

a img {
	border: 0;
	}

img.main-thumb {
	float: left;

	padding: 5px 10px 19px 10px;
	background: url(images/main-thumb-bg.jpg) no-repeat top left;
	}

img.main-thumb-mid {
	float: left;
	margin: 0 17px;
	padding: 5px 10px 19px 10px;
	background: url(images/main-thumb-bg.jpg) no-repeat top left;
	}

.portfolio img {
	padding: 0;
	margin: 0 0 0 50px;
	float: right;

	border: 15px solid #065991;
	}

.sm-portfolio img {
	padding: 0;
	margin: 0;

	border: 5px solid #065991;
	}



/*
------------------------------------------------------------
	Buttons
------------------------------------------------------------
*/

a.launch, a.view, p.progress {
	background: url(images/launch-site.jpg) no-repeat top left;

	height: 29px;
	width: 171px;

	display: block;
	text-indent: -9999em;
	}

a.launch:hover {
	background: url(images/launch-site.jpg) no-repeat bottom left;
	}

a.view {
	background: url(images/view-full.jpg) no-repeat top left;
	}

a.view:hover {
	background: url(images/view-full.jpg) no-repeat bottom left;
	}

p.progress {
	background: url(images/in-progress.jpg) no-repeat top left;

	margin: 0;
	padding: 0;
	}

a.see-more-work {
	background: url(images/see-more-work.jpg) no-repeat top left;

	height: 29px;
	width: 171px;

	display: block;
	position: absolute;
	right: 0;
	top: 10px;
	text-indent: -9999em;
	}

a.see-more-work:hover {
	background: url(images/see-more-work.jpg) no-repeat bottom left;
	}

div#portfolio-thumbs a.see-more-work {
	display: none;
	}

div#portfolio-thumbs:hover a.see-more-work {
	display: block;
	}



/*
------------------------------------------------------------
	Contact Form
------------------------------------------------------------
*/

#wpcf fieldset {
	padding: 0;
	margin: 0;

	width: 330px;
	overflow: auto;

	border: 0;
	}

#wpcf legend, #wpcf label {
	display: none;
	}

#wpcf input, #wpcf input.field {
	padding: 5px;
	width: 140px;
	float: left;

	background: #075589;
	border: 3px solid #075589;

	color: #082B41;
	font-size: 15px;
	}

#wpcf input#wpcf_email {
	margin-left: 10px;
	}

#wpcf input:focus, #wpcf textarea:focus {
	background-color: #fff;
	border: 3px solid #075589;
	}

#wpcf p.button input {
	padding: 5px;
	width: 140px;
	float: left;

	background: #075589;
	border: 0;

	color: #082B41;
	font-size: 15px;
	}

#wpcf p.button input {
	margin-top: 0;
	cursor: pointer;
	}

#wpcf p.button input:hover {
	background: #6A9558;
	color: #fff;
	}

#wpcf textarea {
	background: #075589;
	border: 3px solid #075589;
	clear: both;

	padding: 5px;
	margin: 10px 0;
	width: 306px;

	color: #082B41;
	font-size: 15px;
	}

#wpcf p.alert {
	border: 1px solid #A80909;
	background: #C0A0A0;

	text-align: center;
	font-weight: bold;
	color: #000;

	padding: 5px 0;
	}

p.success {
	font-weight: bold;

	padding: 0 0 0 45px;
	margin-top: 25px;
	line-height: 1.5em;

	background: url(images/check-success.jpg) no-repeat top left;
	}

#wpcf .error {
	background-color: #FFFF00
	}

/* Remove Safari highlight */
#wpcf input, #wpcf textarea {
	outline-style: none;
	outline-width: 0;
	}