/*
Theme Name: JP3
Theme URI: http://JP3design.com/
Description: 
Version: 1.0
Author: Jason Peters
Author URI: http://JP3design.com/
Tags: 
*/

	@import "reset.css";
	
body{font:63%/1.2 helvetica neue,arial,helvetica,sans-serif; color:#fff; background:url("images/bg.jpg") no-repeat left top #000}

a, a:visited{color:#21b6b6; text-decoration:none}
a:hover{color:#007172; text-decoration:underline}
a img{border:none}

img[align="right"]{margin:0 0 10px 10px; float:right}

p{margin:14px 0}

ul, ol{margin:14px 0 14px 20px}
hr{border:none; background:none; background:url("images/bg-hr.png") repeat-x left 50%; margin:14px 0; height:1px}
button{margin:0; padding:0; border:0; background:none; cursor:pointer}

h1{font-size:1.30em; margin:30px 0 15px 0; color:#3cc; text-transform:uppercase}
#content-default h1{ margin-top:0; text-transform:none}
h2{font-size:1.4em; margin:0 0 15px 0}
h3{font:bold 20px/20px Arial,Helvetica,sans-serif; margin:0 0 15px 0}
h4{font:bold 16px/18px Arial,Helvetica,sans-serif; margin:0 0 15px 0}
h5{font:bold 14px/16px Arial,Helvetica,sans-serif; margin:0 0 15px 0}
h6{font:bold 13px/14px Arial,Helvetica,sans-serif; margin:0 0 15px 0}

.left{float:left}
.right{float:right}
.top{vertical-align:top}
.clear{clear:both}
.center{text-align:center}
.white{color:#fff}
.green{color:#21b6b6}
.hidden{display:none}

#wrapper{width:985px}
#logo{float:left}
#nav{float:right; margin:-102px 0 0 0; list-style:none}
#nav li{float:left}
#nav li a{width:160px; margin:0 30px 0 0; display:block; border-top:1px solid #2a2c2c; text-decoration:none; font-size:1.8em; color:#fff; text-transform:uppercase; text-align:right; text-shadow:#000 3px 3px 5px}
#nav li a:hover, #nav li.current_page_item a{text-shadow:#0ff 0 0 20px}

#nav li a span{display:block; padding:20px 0 14px 0}
#nav li.page-item-6 a{margin:0}
#nav li.page-item-39{display:none}

#nav .page-item-4 span{background:url("images/bg-nav-a.png") no-repeat left 51px}

#nav .page-item-2 span{background:url("images/bg-nav-a.png") no-repeat left 51px}

#nav .page-item-5 span{background:url("images/bg-nav-a.png") no-repeat left 51px}

#nav .page-item-6 span{background:url("images/bg-nav-a.png") no-repeat left 51px}

#nav .page-item-4 a:hover span{background:url("images/bg-nav-a.png") no-repeat right 51px}

#nav .page-item-2 a:hover span{background:url("images/bg-nav-a.png") no-repeat right -22px}

#nav .page-item-5 a:hover span{background:url("images/bg-nav-a.png") no-repeat right -95px}

#nav .page-item-6 a:hover span{background:url("images/bg-nav-a.png") no-repeat right -168px}

#footer{width:985px; font-size:1.2em; color:#fff; text-shadow:#000 0 2px 8px; margin:120px 0 0 0}
#footer #madeinnz a{width:203px; height:19px; line-height:19px; float:left; border-top:1px solid #3d3d3d; margin:0; padding:14px 23px 0 0; text-align:right; background:url("images/bg-madeinnz.png") no-repeat right 10px; color:#fff; text-decoration:none}
#footer #copyright{width:743px; float:left; margin:0 0 0 16px; border-top:1px solid #3d3d3d}
#footer #copyright .left a{color:#fff; text-decoration:none}
#footer #copyright .left a:hover{text-decoration:underline}
#footer #copyright .right a{height:28px; line-height:28px; padding:0 23px 0 0; margin:-7px 0 0 0; background:url("images/bg-greengeeks.png") no-repeat right; color:#fff; text-decoration:none; display:block}
#footer #copyright .right a span{color:#093}

.navigation{clear:both}

#content-default, #content-contact, #content-portfolio, #content-secondary-portfolio{width:100%; clear:both; background:rgba(13,139,137,0.2); font-size:1.4em}
#content-default #sidebar{width:225px; float:left; margin:2px 0 0 0}
#content-default #sidebar ul{margin:0; list-style:none}
#content-default #copy{width:655px; float:right; margin:10px 17px 10px 0}

#content-portfolio #copy{width:720px; float:right; margin:10px 17px 10px 0}

#content-secondary{width:655px; margin:0 0 0 313px; font-size:1.4em}
#sidebar li.cat-item-1{display:none}

#content-home img{border:4px solid #fff; box-shadow:5px 5px 5px #000; margin:10px 0 0 0}
#content-home #copy{width:810px; float:left}
#content-home #articles{width:565px; float:right; color:#ccc}
#content-home #comments{margin:169px 0 0 0;  padding:15px 15px 26px 15px !important}
#content-home #comments h2{color:#ccc; font-size:0.86em; margin:-50px 0 30px 0}
#content-home #comments a{color:#fff; text-decoration:none}
#content-home #comments a:hover, #content-home a.launch:hover{text-decoration:underline}
#content-home #comments ul{list-style:none; color:#46f7e0}
#content-home #comments ul li{background:url("images/bg-features.png") no-repeat right; padding:0 15px 0 0}
a.launch{background:url("images/arrow.png") no-repeat left; padding:0 0 0 15px; color:#fff; text-decoration:none}
#content-home h1{width:263px; height:33px; background:url("images/bg-home-h1.png") no-repeat; text-indent:-9999px}

#content-contact #copy{width:535px; float:left; margin:0 0 0 254px}
#content-contact #copy .wpcf7-form .clearfix{width:100%; padding:0 0 20px}
#content-contact #copy input, #content-contact #copy textarea{width:97%; border:none; background:#2a2727; color:#fff; padding:8px; float:right; margin:-15px 0 0 0}
#content-contact #copy .wpcf7-form label{width:80px; text-transform:uppercase; margin:0; text-align:right; margin:0 0 0 -90px; display:block; float:left}
#content-contact #copy .wpcf7-form .required{text-transform:none; color:#21b4b5; font-style:italic; display:block; font-size:0.86em}
#content-contact #copy .wpcf7-form button{float:right; margin:-20px 0 30px 0}
#content-contact #copy .wpcf7-form input[type="submit"]{width:110px; background:#009594; color:#fff; text-transform:uppercase; font-size:1.2em; padding-top:3px; padding-bottom:3px; cursor:pointer; position:relative; top:-50px;}
#content-contact #copy .wpcf7-form .captcha-671 input { width:100px; float:left; margin:22px 00 0; }
#content-contact #copy .wpcf7-form img.wpcf7-captcha-captcha-671 { float:left; margin:22px 10px 0 0; }
#content-contact #sidebar{width:179px; float:right; margin:40px -23px 0 0; color:#a8efef; font-size:1.14em}
#content-contact #sidebar h3{color:#21bbba; margin:5px 0 0 0}
#content-contact #sidebar p{margin:0; line-height:1.3}
#content-contact #sidebar p img{margin:5px 0 0 0}
#content-contact #sidebar ul{margin:0; list-style:none}
#content-contact #sidebar .twitter{width:179px; height:56px; display:block; background:url("images/twitter.png") no-repeat; text-indent:-9999px; margin-bottom:7px}
#content-contact #sidebar .facebook{ width:179px; height:56px; display:block; background:url("images/facebook.png") no-repeat; text-indent:-9999px; margin-bottom:7px}
#content-contact #sidebar .ichat{width:179px; height:56px; display:block; background:url("images/ichat.png") no-repeat; text-indent:-9999px}
#content-contact .wpcf7-validation-errors{border:none !important; color:#21b4b5 !important; font-weight:bold !important}
#content-contact .wpcf7-not-valid-tip{display:block !important; position:static !important; color:#21b4b5 !important; font-weight:bold !important; padding:10px 0 0 0 !important; clear:both}

#content-blog, #content-article, #content-home{width:100%; font-size:1.4em}
#content-blog #sidebar, #content-article #sidebar, #content-home #sidebar{width:160px; float:right}
#content-blog #sidebar ul, #content-article #sidebar ul{margin:0; list-style:none}
#content-blog #sidebar h2, #content-article #sidebar h2{color:#0a9696; text-transform:uppercase; font-weight:normal; text-align:right; margin:0 0 11px; font-size:1.25em}
#content-blog #sidebar ul ul, #content-article #sidebar ul ul{border-top:1px solid #4b4b4b}
#content-blog #sidebar ul ul li, #content-article ul ul li{border-bottom:1px solid #4b4b4b; text-align:right}
#content-blog #sidebar a, #content-article #sidebar a{color:#fff; text-transform:uppercase; text-shadow:#000 0 2px 8px; text-decoration:none; padding:5px 0; display:block}
#content-blog #sidebar a:hover, #content-article #sidebar a:hover{color:#008d8d}
#content-blog #copy{width:735px; float:left}
#content-article #copy{width:720px; float:left}
#content-blog #copy #comments, #content-article #copy #comments, #content-home #copy #comments{width:195px; float:left; background:rgba(13,139,137,0.2); padding:15px 15px 30px 15px; text-align:right; position:relative}
#content-blog #copy #comments .postmetadata, #content-article #copy #comments .postmetadata{color:#1fafb0; font-style:italic}
#content-blog #copy #comments .readmore{display:block; position:absolute; bottom:10px; right:15px}
#content-blog #copy #comments .readmore a{text-transform:uppercase; color:#fff; text-decoration:none; background:url("images/bg-readmore.png") no-repeat left; padding:0 0 0 14px; font-style:normal}
#content-blog #copy #comments .comments a, #content-article #copy #comments .comments a{color:#ccc; text-decoration:none; font-style:normal; margin:5px 0 50px 0; display:block}
#content-blog #copy #comments .comments a:hover, #content-article #copy #comments .comments a:hover{text-decoration:underline}
#content-blog #copy #comments .readmore a:hover{text-decoration:underline}
#content-blog .navigation{margin:0 0 0 240px}

#content-blog .navigation a{display:block; float:left; color:#fff; text-transform:uppercase; text-decoration:none}
#content-blog .navigation a:hover{text-decoration:underline}
#content-blog .navigation .alignleft a{background:url("images/bg-older.png") no-repeat left; padding:0 5px 0 15px}
#content-blog .navigation .alignright a{background:url("images/bg-newer.png") no-repeat right; margin:0 0 0 5px; padding:0 15px 0 10px; border-left:1px solid #fff}
#content-blog #articles, #content-article #articles{width:480px; float:right; border-bottom:1px solid #4b4b4b; margin:0 0 30px; padding:0 0 30px}
#content-blog h1, #content-article h1{margin:0 0 10px}
#content-blog h1 a, #content-blog h2 a{color:#0a9696; text-decoration:none}
#content-blog h1 a:hover, #content-blog h2 a:hover{text-decoration:underline}
.archivetitle{margin:0 0 20px 257px !important}

#content-portfolio h1{display:none}
#content-portfolio ul{margin:0; list-style:none; font-size:0.92em}
#content-portfolio ul img{display:block; border:3px solid #fff; box-shadow:5px 5px 5px #000; margin:5px 0 30px 0}
#content-portfolio ul li{width:20%; float:left}

#content-secondary-portfolio{margin-top:20px}
#content-secondary-portfolio .portfolio{padding:20px 0; font-size:0.92em}
#content-secondary-portfolio .portfolio img{border:4px solid #fff; box-shadow:5px 5px 5px #000; float:left; margin:0 20px 0 0}
#content-secondary-portfolio ul{width:233px; float:left; margin:0 15px 0 0; list-style:none; text-align:right; color:#88dfd4}
#content-secondary-portfolio li{background:url("images/bg-slash.png") no-repeat right 4px; padding:0 14px 0 0}
#content-secondary-portfolio li.first{background:none; margin-bottom:10px; padding:0; color:#fff}
#web-projects, #gd-projects{clear:both}
.selected{width:210px; display:block; text-align:right; float:left; color:#88dfd4; margin:0 0 0 -240px; position:relative; top:16px; padding-right:13px; background:url("images/bg-readmore.png") no-repeat right 4px}
#gd-gallery{width:159px; height:72px; display:block; margin:60px 0 0 -189px; background:url("images/bg-gd-gallery.png") no-repeat; text-indent:-9999px; float:left; clear:left}
#web-gallery{width:159px; height:72px; display:block; margin:60px 0 0 -189px; background:url("images/bg-wd-gallery.png") no-repeat; text-indent:-9999px; float:left; clear:left}
.portfolio-content{padding-right:20px; clear:right}
.portfolio-content a.launch{width:424px; display:block; margin:20px 0 0 0; color:#fff; text-decoration:none; float:right}
.portfolio-content a:hover.launch{text-decoration:underline}

.commentlist{margin:40px 0; list-style:none; color:#ccc}
.commentlist h3{color:#fff; text-transform:uppercase; font-weight:normal; font-size:1.0em; margin:0 0 10px}
.commentlist .comment{border-top:1px solid #3b3b3b; border-bottom:1px solid #3b3b3b; margin:25px 0; padding:14px 0}
.commentlist .comment-author, .commentlist .commentmetadata{display:inline}
.commentlist .comment-author-jp3-design{border-top:3px solid #3cc; border-bottom:3px solid #3cc; margin:25px 0; padding:14px 0}
.commentlist .comment-author-jp3-design .comment-author a{font-weight:bold; text-transform:uppercase}
.commentlist .comment-author a{color:#0a9696; text-decoration:none; font-style:italic}
.commentlist .comment-author a:hover{text-decoration:underline}
.commentlist .commentmetadata a{color:#999; font-style:italic; text-decoration:none}

#commentform h3{color:#0a9696; font-weight:normal; text-transform:uppercase; font-size:1.2em}
#commentform input{width:97%; border:none; background:#272727; padding:7px; color:#ccc}
#commentform textarea{width:97%; border:none; background:#272727; padding:7px; color:#ccc; font-family:helvetica neue,Arial,Helvetica,sans-serif; font-size:0.88em}

#respond{margin:80px 0 0 0}
#respond h3{color:#0a9696; font-weight:normal; text-transform:uppercase; font-size:1.2em}
#respond p{margin:0 0 20px}
#respond label{text-align:right; float:left; margin-left:-90px; width:80px}
#respond small{text-transform:uppercase; color:#ccc; font-size:0.86em; display:block}
#respond span.required{color:#666; font-style:italic; font-size:0.86em}
#respond button{float:right}