/*   
Theme Name: Justin Roxburgh
Description: Justin Roxburgh Theme
Author: Renato Mattos
Author URI: http://renatomattos.co.uk/
Version: 2.1
*/

* { margin: 0;  padding: 0; }

body { width: 100%; background:#2e2e2e url(images/bckg_header.jpg) no-repeat 0 0;  font:400 76% "Lucida Sans Unicode", "Lucida Console", Georgia, Arial, Helvetica, sans-serif;  color: #fff; }

/* HTML elements */
a { outline: none; }
a img { border: 0; }
img { border: none; }
:focus { outline: 0; }

label { font-weight: normal; }
form { display: inline; }
form,select,input,textarea { margin: 0; padding: 0 }

h1, h2, h3 { font-family: font-family:"Century Gothic",Arial,Helvetica,sans-serif; }

ul,li { list-style-type: none; }

abbr { border-bottom:1px dotted #FFFFFF; cursor:help; }
code { font-family:Consolas,Monaco,"Courier New",Courier,monospace; }

a:link, a:active, a:visited { text-decoration : none; color : #C9A556; border: 0px; background-color:transparent;} 
a:hover { text-decoration : none; color : #fff; border: 0px; background-color:transparent;} 


/* Header 
---------------------------------------------*/
#header { width: 100%; height: 250px; background: transparent; margin:0 auto;}
#header h1 { float: left; text-indent: -9999px; width: 420px; height: 80px; padding:40px 0 0 40px; }
#header h1 a { text-decoration: none; display: block; width: 420px; height: 80px; }
#header h1 a:hover { text-decoration: none !important; }
#header .header-wrapper { width: 960px; height: 250px; background: transparent url(images/bckg_banner.jpg) repeat-x bottom center; margin: 0 auto; padding: 0;}

/* Main menu */
#nav { float:right; margin-top:30px; width:220px; padding: 0; }
#nav li a { width:210px; height:21px; margin:1px 0; padding:6px 0 0 10px; font:400 12px Arial,Helvetica,sans-serif; text-transform:uppercase; }
#nav li a:link, #nav li a:visited, #nav li a:active { background:transparent url(images/bckg_nav.png) 0 0 no-repeat; display:block; color:#fff; } 
#nav li a:hover { background:transparent url(images/bckg_nav.png) 0 -27px no-repeat; color:#fff; text-decoration:none; }	
#nav li.current_page_item a { background:transparent url(images/bckg_nav.png) 0 -27px no-repeat; display:block; color:#fff; }
#nav li.current_page_item a:hover { background:transparent url(images/bckg_nav.png) 0 -27px no-repeat; color:#fff; text-decoration:none; }

#search-warapper { position: relative; width:250px; float: right; margin-top: 100px; margin-right: 25px; }
#rss { float:left; display:block; clear:both; width:250px; height:40px; padding: 20px 0;}
#search { background:transparent url(images/bckg_search.gif) no-repeat scroll left top; float:left; display:block; clear:both; width:255px; height:30px; margin-bottom::20px;}
#search input { background:transparent none repeat scroll 0 0; color:#000000; font-family: "Lucida Sans Unicode", "Lucida Console", Georgia, Arial, Helvetica, sans-serif; vertical-align:middle; }
#s { border: 0; font-size:12px; padding:4px; width: 215px;  height: 22px;  margin:0;  padding:4px 0 0 4px; }


/* Main content wrapper 
---------------------------------------------*/
.wrapper { background:transparent url(images/bckg_content.png) repeat-y scroll left top; width: 960px; margin: 0 auto; }
/* wrapper float style fix */
.clear:after { content: "."; visibility: hidden; display: block; height: 0px; clear: both; }
* html .clear { height: 1%; }

/* Content */
#content { background-color: transparent; float: left; display: block; width: 610px; padding: 30px 30px 0 30px; }
#content h2.pagetitle { display:block; font-size:16px; font-weight:normal;  color: #fff; line-height:19px; margin:0; padding:0; text-transform:uppercase; padding-bottom:10px; }
#content h2.pagetitle a { color: #8AD9FF; line-height:19px; margin:0; padding:0; text-transform:uppercase; padding-bottom:5px; text-transform: uppercase;}
#content .postmetadata { padding-bottom:15px; }
#content .divider { float: left; width: 610px; margin: 15px 0; background: url(images/divider.gif) bottom repeat-x;	height: 4px; }
#content p a, #content p a:active, #content p a:visited { background-color:transparent; border:0; color:#c9a556; text-decoration:none; }
#content p a:hover { color:#fff; text-decoration:none; border:0; background-color:transparent; }
#content .cont-spacer { background:transparent url(images/dotted_line.png) repeat-x ; height:1px; margin:20px 0 0 0; padding:0; text-align:left; width:604px; }


/* Search (No posts found) */
#content #searchform label { display: block; float: left; color:#666666; padding-right: 10px; }
#content #searchform #s { display: block; float: left; background-color:#fff; border:1px solid #121212; color:#121212; font-family:"Lucida Sans Unicode","Lucida Console",Georgia,Arial,Helvetica,sans-serif; font-size:11px; margin-right:5px; padding:2px 4px; height:18px; width:200px;}
#content #searchform #searchsubmit { display: block; float: left; background-color:#fff; border:1px solid #121212; color:#121212; font-family:"Lucida Sans Unicode","Lucida Console",Georgia,Arial,Helvetica,sans-serif; font-size:11px; margin-bottom:5px; padding:0 4px 2px 4px; height:24px; width:70px; cursor:pointer; }
#content #searchform #searchsubmit:hover { background-color:#121212; border:1px solid #121212; color:#fff; }


/* Post style *************************************************************************/
.post { clear: left ; position: relative; display: block; float: left; width: 610px; padding-bottom: 10px; }
.post h1 { font-size: 19px; line-height: 19px; font-weight: normal; padding: 0px; margin: 0px; display: block;}
.post h1 a { color: #d30703; text-decoration: none;}
.post h1 a:visited { color: #01367a; text-decoration: none;}
.post h1 a:hover { color: #003399; text-decoration: none;}

.post h2 { display: block; font-family:"Century Gothic",Arial,Helvetica,sans-serif; font-size:15px; color: #fff; font-weight: normal; line-height: 19px; margin: 0; padding: 0; text-transform: uppercase; }
.post h2 a, 
.post h2 a:active, 
.post h2 a:visited { color: #8AD9FF; text-decoration: none; }
.post h2 a:hover { color: #fff; text-decoration: none; }

.postHead { padding-left: 40px; }

.postDate { border-right:1px dotted #BFBFBF; left: 0; list-style-image: none; list-style-position: outside; list-style-type: none; margin: 0; padding: 2px 10px 2px 0; position: absolute; text-align: center; top: 0; }
.postDate .day { color: #fff; display: block; font-size: 16px; font-weight: bold; letter-spacing: -1px; line-height: 19px; }
.postDate .month { color: #fff; display: block; font-size: 9px; line-height: 9px; text-transform: uppercase; }

.postInfo { color: #666; font-size: 11px; margin: 0; padding: 0; }
.postInfo em { font-style: normal; }

.postContent { font-size: 12px; line-height: 16px; margin-top: 5px; padding: 0; border-top:1px dotted #BFBFBF; }
.postContent h2 { display: block; clear:both; font-size:1.1em; color: #8AD9FF; font-weight: normal; line-height: 19px; margin: 0; padding:20px 0 0 0; }
.postContent h3 { color: #8AD9FF; font-size: 14px; font-weight: bold; padding-top: 10px; }
.postContent p { line-height: 18px; padding-bottom: 7px; padding-top: 7px; }
.postContent p img { padding: 3px; margin: 0 auto; background-color:#333; margin: 5px 0 5px 10px; float:right;}
.postContent a img, 
.postContent a:active img, 
.postContent a:visited img { padding: 3px; background-color:#333; margin: 5px 0;}
.postContent a:hover img{ padding: 3px; background-color:#fff; margin: 5px 0;}
.postContent blockquote { background: #121212 none repeat scroll 0 0; border-color: #151515; border-style: solid; border-width: 1px 0; color: #666; margin: 5px 0; padding: 3px 15px; }
.postContent blockquote p { font-size: 11px; line-height: 15px; margin: 5px 0; padding: 5px 0; }
.postContent ul { float:left; display:block; font-size: 11px; padding-left: 12px; padding: 10px 0 20px 0;}
.postContent li { padding-bottom: 10px;}
.postContent div img { float:right; margin:5px 0 5px 10px; } /* float:right; */

/* Post content header */
.postContent .contHead { clear:both; display:block; float:left; padding:20px 0 10px 0; width:100%; }
.postContent .contHead h2 { display: block; font-size:1.1em; color: #8AD9FF; font-weight: normal; line-height: 19px; margin: 0; padding: 0; }
.postContent .contInfo { color: #666; font-size: 11px; margin: 0; padding: 0; }

.postEntry p img { background-color:#333333; margin:5px 0; padding:3px; }
.postEntry p small { color:#666; }

.postDetails li { list-style-type: none; margin: 0; padding: 10px 0 0 0; }
.postDetails { display: block; font-size: 11px; margin: 0; padding-bottom: 50px; }
.postDetails .postCom {}
.postDetails .postCom a { position:relative; padding: 0px 0px 0px 23px; background: transparent url(images/postCommentsLeft.gif) no-repeat scroll left top; float: left; text-decoration: none; font-size: 11px;}
.postDetails .postCom a span { position:relative; padding: 4px 15px 4px 5px; display: block; background: transparent url(images/postCommentsRight.gif) no-repeat scroll right top; float: left; }
.postDetails .postCom a span { float: none; color: #fff; }
.postDetails .postCom a:hover span {color:#101010;}
.postDetails .postCom a:hover { background-position: 0% -23px; text-decoration: none;}
.postDetails .postCom a:hover span { background-position: 100% -23px; }

/* This is for the post navigation at the top (single.php) */
.postNavigation { display: block; clear: both; margin-bottom: 10px; }

/* This is for the post navigation at the bottom (index.php) */
.navigation { display: block; clear: both; margin: 10px 0; }
.navigation a, 
.navigation a:link, 
.navigation a:active, 
.navigation a:visited { padding: 2px 4px 2px 4px;  margin: 2px; text-decoration: none; border: 1px solid #414445; color: #fff; background-color: #2e2e2e; }
.navigation a:hover { background-color:#66cbff; border:1px solid #9edeff; color:#2e2e2e; }
.navigation span.pages { padding: 2px 4px 2px 4px; margin: 2px 2px 2px 2px; color: #000; border: 0px solid #000;	background-color: #fff; }
.navigation span.current { padding: 2px 4px 2px 4px; margin: 2px; font-weight: bold; border: 0px solid #000; color: #000000; background-color: #fff; }
.navigation span.extend { padding: 2px 4px 2px 4px; margin: 2px; border: 0px solid #000; color: #000; background-color: #fff; }

/* Post Entries *************************************************************************/
.postEntry { border-top:1px dotted #BFBFBF; line-height: 16px; margin-top: 5px; padding: 0; }
.postEntry h2 { display:block; font-size:1.1em; font-weight:normal;  color: #8AD9FF; line-height:19px; margin:0; padding:0;  }
.postEntry p { line-height: 18px; padding-bottom: 7px; padding-top: 7px; }
.postEntry a img, 
.postEntry a:active img, 
.postEntry a:visited img { padding: 3px; background-color:#333; margin: 5px 0;}
.postEntry a:hover img{ padding: 3px; background-color:#fff; margin: 5px 0;}
.postEntry blockquote { background: #121212 none repeat scroll 0 0; border-color: #151515; border-style: solid; border-width: 1px 0; color: #666; margin: 5px 0; padding: 3px 15px; }
.postEntry blockquote p { font-size: 11px; line-height: 15px; margin: 5px 0; padding: 5px 0; }
.postEntry ul { float:left; display:block; font-size: 11px; padding-left: 12px; padding: 10px 0 20px 0;}
.postEntry li { padding-bottom: 10px;}


/* Post Commentlist *************************************************************************/
.postCommentlist ol { float:left; display:block; font-size: 11px; padding-left: 12px; padding: 10px 0 20px 0;}
.postCommentlist li { padding-bottom: 10px;}
.comment-body { background: #121212 none repeat scroll 0 0; border-color: #151515; border-style: solid; border-width: 1px 0; color: #666; margin: 5px 0; padding: 15px; }
.comment-body cite { font-style: normal; }
.comment-body div.comment-author { float:left; clear: left ; }
.comment-body div.comment-meta { float:right; clear: right; }
.comment-body p {display: block; clear: both; padding-top: 5px; }


/* Comments form *************************************************************************/
.respond { clear: left ; position: relative; display: block; float: left; width: 610px; padding-bottom: 50px; }
.respond h2 { display:block; font-size:1.1em; font-weight:normal; color: #fff; line-height:19px; margin:0; padding:0;  padding: 20px 0; }
.respond label { color:#666666; }
.respond input { background-color: #fff; border: 1px solid #121212; color:#121212; font-size: 11px; font-family: "Lucida Sans Unicode", "Lucida Console", Georgia, Arial, Helvetica, sans-serif; width: 200px; padding: 2px 4px; margin-bottom: 5px; }
.respond textarea { background-color: #fff; border: 1px solid #121212; color:#121212; font-size: 11px; font-family: "Lucida Sans Unicode", "Lucida Console", Georgia, Arial, Helvetica, sans-serif; width: 595px; padding: 2px 4px; margin-bottom: 5px; }

.respond #submit { cursor:pointer }
.respond #submit:hover { background-color:#121212; border:1px solid #121212; color:#fff; }


/* Portfolio *****************************************************************************/
.folio-list ul { float:left; margin: 0; }
.folio-list ul li { float:left; width:610px; padding:10px 0; }
/* sub level */
.folio-list ul li ul { float:left; padding: 10px 0 15px 0; list-style: none; }
.folio-list ul li ul li {line-height:1.7em; height:1.7em; list-style-image:none; list-style-position:outside; list-style-type:none; margin: 0; padding:0 10px 0 15px; }
.folio-list ul li ul li { display: block; background:transparent url(images/arrow.png) no-repeat scroll 0px 5px; }


/* Portfolio: Photos *************************************************************************/
.folio-photo { float: left; width: 610px; }
.folio-photo a.thumbPhoto img, 
.folio-photo a.thumbPhoto:active img,
.folio-photo a.thumbPhoto:visited img { cursor: pointer; display: inline; float: left; width: 181px; height: 117px; margin: 8px 0; padding: 5px; background-color:#333; }
.folio-photo a.thumbPhoto:hover img { padding: 5px; background-color:#fff; } 
.folio-photo a.m9 img { margin: 8px 16px !important; }

/* Portfolio: Icons *************************************************************************/
.folio-icon { float: left; width: 610px; }
.folio-icon li { background:transparent; margin:20px 0 11px 0; padding:0; text-align: left; width: 630px; float:left; position: relative; }
.folio-icon li.line { background-image:none; margin:0; padding: 0; text-align: left; height: 21px; width: 630px; }
.folio-icon h2 { float: left; width:202px; color:#fff; margin:0; padding: 15px 0 4px 20px; font-size:1.1em;  }
.folio-icon dl { float: left; display: inline; width: 282px; margin:0; padding: 0 0 0 20px; text-align: left; position: relative; right: 0; top: 0; } 
.folio-icon dt { float: left; width: 282px; padding: 0; margin: 0; clear: both; }
.folio-icon .thumbIcon { float:left; width:303px; height:155px; margin:0; padding:0; border:none; }
.folio-icon li a.thumbIcon2 { float:left; width:610px; height:313px; margin:0; padding:0; border:none; }

/* Portfolio: Logos *************************************************************************/
.folio-logo { float: left; width: 610px; }
.folio-logo img.thumbLogo, 
.folio-logo img.thumbLogo { display: inline; float: left; width: 284px; height: 184px; margin: 8px 0; padding: 5px; background-color:#333; }
.folio-logo .m9 { margin: 8px 16px 8px 0!important; }


/* Portfolio: Websites ***********************************************************************/
.folio-web { list-style-image:none; list-style-position:outside; list-style-type:none; width:604px; }
.folio-web li { background:transparent; height:170px; margin:24px 0 10px; position:relative; text-align:left; width:604px; }
.folio-web h2 { float:left; display:block; width:604px; color:#fff; font-size:1.1em; font-weight:normal; line-height:30px; margin:0; padding:0;  }
.folio-web dl { float:left; display:inline; margin:0; padding:0; width:420px; font-size:11px; }
.folio-web dt { float:left; display:block; font-weight:normal; margin:0; padding:1px 0;  width:80px; line-height:20px; }
.folio-web dd { float:left; display:block; margin:0; padding:1px 0; text-align:left; width:340px; line-height:20px; }

.folio-web a.thumbWeb img,
.folio-web a:active.thumbWeb img, 
.folio-web a:visited.thumbWeb img { padding: 5px; background-color:#333; width: 250px; height: 155px;  margin: 0; position:absolute; right:0; top:0; }
.folio-web a:hover.thumbWeb img {  padding: 5px; background-color:#fff; }

.folio-web li.line { background:transparent url(images/dotted_line.png) repeat-x ; height:1px; margin:0; padding:0; text-align:left; width:604px; }

/* Sidebar *****************************************************************************/
.clr {clear:both; height:0; overflow:hidden; }
#sidebar { background-color:transparent; display:block; float: left; width: 250px; color:#666666; margin: 0; padding: 8px 20px 20px 20px; }
#sidebar h2 { color: #fff; font-size: 15px; text-transform:uppercase; border-top:1px dotted #BFBFBF; border-bottom:1px dotted #BFBFBF; font-weight: 400; font-family: "Century Gothic",Arial,Helvetica,sans-serif; margin-top:30px; padding:8px 0 6px 10px; }
#sidebar p { float: left; margin: 10px 0; padding-left:10px; }
#sidebar a { color: #C9A556; text-decoration: none; }
#sidebar a:hover { color: #fff; text-decoration: underline; }

#sidebar ul { margin: 20px 0; list-style: none; border-top:1px solid #222222;}
#sidebar ul li {width:215px; border-bottom:1px solid #222222; line-height:2em; height:2em; list-style-image:none; list-style-position:outside; list-style-type:none; margin: 0; padding:0 10px 0 25px; }
#sidebar li { display: block; background:transparent url(images/arrow.png) no-repeat scroll 10px 6px; }
#sidebar ul li a,
#sidebar ul li a:active,
#sidebar ul li a:visited { display: inline; color: #666; text-decoration: none; }
#sidebar ul li a:hover { color: #fff; text-decoration: none; }


#sidebar ul.adds { margin: 20px 0; float:left; display: block; list-style: none; border:0 none !important;}
#sidebar ul.adds li {width:250px; float: left; display: block; height: 90px; width: 120px; list-style-image:none; list-style-position:outside; list-style-type:none; margin: 0; padding:0 0 4px 4px; border:0 none !important; }


#sidebar #latest-comments, 
#sidebar #gallery,
#sidebar #archives, 
#sidebar #partners,
#sidebar #categories,  
#sidebar #blogroll { width: 250px; display: block; clear: both;}
#sidebar .thumb-holder { display: block; clear: both; margin: 10px 0; }


#newslinks { float:left; display:block; clear:both; width:250px; height:160px; padding: 20px 0 0 0;} /* height:120px; change height based on the content */
#newslinks .link-holder { float:left; display:block; width:250px; }
#newslinks .link-img {float: left; display:block; width:50px; }
#newslinks .link-img img { border: medium none ; vertical-align: top; margin-right: 5px; }
#newslinks .link-content { float:left; display:block; width:200px; padding-top:5px; }

#search { background:transparent url(images/bckg_search.gif) no-repeat scroll left top; float:left; display:block; clear:both; width:250px; height:30px; margin-bottom::20px;}
#search input { background:transparent none repeat scroll 0 0; color:#000000; font-family: "Helvetica Neueu", Helvetica, Arial, Tahoma, Verdana, sans-serif; vertical-align:middle; }
#s { border: 0; font-size:12px; padding:4px; width: 215px;  height: 22px;  margin:0;  padding:4px 0 0 4px; }



/* Footer *****************************************************************************/
#footer {color:#ccc; margin: 0; clear: both; width: 100%; background:transparent; padding:0; overflow: auto; }
#footer .wrapper { background:transparent; width: 960px; margin: 0 auto; }
#footer p.copy, #footer p.designed {float:left; margin:0; padding-left:30px; width:50%; font-size: 11px;}
#footer p.link {float:right; margin:0; padding-right:30px; width:33%; font-size: 11px; text-align:right;}
#footer a, #footer a:active, #footer a:visited {color:#ccc; text-decoration:none;}
#footer a:hover {color:#ccc; text-decoration:underline;}
#footer .footer-content { background:#000 url(images/wordpress2.gif) no-repeat scroll 0 0; width: 960px; height: 40px; padding: 30px 0 10px 0; clear: both; }