/*   
Theme Name: Renato Mattos
Description: Renato Mattos Theme
Author: Renato Mattos
Author URI: http://renatomattos.co.uk/
Version: 2.1
*/

* { margin: 0;  padding: 0; }

body { width: 100%;  background:#0c0c0c url(images/bckg_body.gif) no-repeat fixed center top;  background-attachment: fixed;  font:400 76% "Lucida Sans Unicode", "Lucida Console", Georgia, Arial, Helvetica, sans-serif;  color: #999; }

/* 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: "Lucida Sans Unicode", "Lucida Console", Georgia, 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 : #FFB800; border: 0px; background-color:transparent;} 
a:hover { text-decoration : none; color : #fff; border: 0px; background-color:transparent;} 


/* Header 
---------------------------------------------*/
#header { width: 100%; height: 300px; background: transparent; margin:0 auto 30px;}
#header h1 { float: left; text-indent: -9999px; width: 50px; height: 250px; }
#header h1 a { text-decoration: none; display: block; width: 50px; height: 250px; }
#header h1 a:hover { text-decoration: none !important; }
#header .header-wrapper { width: 960px; height: 300px; background: transparent url(images/bckg_banner.gif) repeat-x bottom center; margin: 0 auto; padding: 0;}

#nav { width: 960px; height:50px; display: block; float: left; clear: both; }
#nav li { display: inline; float: right; margin: 20px 10px 0 30px; }
#nav li a { background: transparent; color: #fff; text-decoration: none; text-transform:uppercase; }
#nav li a:active { background: transparent; color: #fff; text-decoration: none; border-bottom: 2px solid #00AEEF !importnat; }
#nav li a:visited { background: transparent; color: #fff; text-decoration: none; text-transform:uppercase; }
#nav li a:hover { background: transparent; color: #fff; text-decoration: none; border-bottom: 2px solid #00AEEF; }

#nav li.current_page_item a, 
#nav li.current_page_item a:active, 
#nav li.current_page_item a:visited { background: transparent; color: #fff; text-decoration: none; border-bottom: 2px solid #00AEEF; }

#search-warapper { position: relative; width:250px; float: right; margin-top: 200px; 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: 605px; padding: 15px 30px 0 30px; }
#content h2.pagetitle { display:block; font-size:1.1em; font-weight:normal;  color: #fff; line-height:19px; margin:0; padding:0; text-transform:uppercase; padding-bottom:10px; }
#content h2.pagetitle a { color: #00AEEF; line-height:19px; margin:0; padding:0; text-transform:uppercase; padding-bottom:5px; }
#content .postmetadata { padding-bottom:15px; }
#content .divider { float: left; width: 605px; margin: 15px 0; background: url(images/divider.gif) bottom repeat-x;	height: 4px; }

/* 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:#121212; border:1px solid #151515; color:#999999; 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:#121212; border:1px solid #151515; color:#999999; 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:#FFB800; border:1px solid #121212; color:#000; }


/* Post style *************************************************************************/
.post { clear: left ; position: relative; display: block; float: left; width: 605px; padding-bottom: 50px; }
.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-size:1.1em; color: #00AEEF; font-weight: normal; text-transform:uppercase; line-height: 19px; margin: 0; padding: 0; }
.post h2 a, 
.post h2 a:active, 
.post h2 a:visited { color: #00AEEF; 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: #999; display: block; font-size: 16px; font-weight: bold; letter-spacing: -1px; line-height: 19px; }
.postDate .month { color: #999; 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 { border-top:1px dotted #BFBFBF; font-size: 12px; line-height: 16px; margin-top: 5px; padding: 0; }
.postContent h3 { font-size:1.1em; font-weight:normal; color: #FFFFFF; padding: 15px 0 2px 0; text-transform:uppercase; line-height: 19px; }
.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;}
.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;}

/* 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: #00AEEF; font-weight: normal; text-transform:uppercase; 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; }

.postDetails li { list-style-type: none; margin: 0; padding: 10px 0 0 0; }
.postDetails { display: inline; font-size: 11px; margin: 0; padding: 0; }
.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 #151515; color: #999999; background-color: #121212; }
.navigation a:hover { background-color:#FFB800; border:1px solid #151515; color:#000; }
.navigation span.pages { padding: 2px 4px 2px 4px; margin: 2px 2px 2px 2px; color: #000000; border: 0px solid #000000;	background-color: #FFFFFF; }
.navigation span.current { padding: 2px 4px 2px 4px; margin: 2px; font-weight: bold; border: 0px solid #000000; color: #000000; background-color: #FFFFFF; }
.navigation span.extend { padding: 2px 4px 2px 4px; margin: 2px; border: 0px solid #000000; color: #000000; background-color: #FFFFFF; }

/* 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: #00AEEF; line-height:19px; margin:0; padding:0; text-transform:uppercase; }
.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: 605px; padding-bottom: 50px; }
.respond h2 { display:block; font-size:1.1em; font-weight:normal; color: #fff; line-height:19px; margin:0; padding:0; text-transform:uppercase; padding: 20px 0; }
.respond label { color:#666666; }
.respond input { background-color: #121212; border: 1px solid #151515; color:#999999; 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: #121212; border: 1px solid #151515; color:#999999; 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:#FFB800; border:1px solid #151515; color:#000; }


/* Portfolio *****************************************************************************/
.folio-list ul { float:left; margin: 0; }
.folio-list ul li { float:left; width:605px; 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: 605px; }
.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: 605px; }
.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; text-transform:uppercase; }
.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:605px; height:313px; margin:0; padding:0; border:none; }

/* Portfolio: Logos *************************************************************************/
.folio-logo { float: left; width: 605px; }
.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; text-transform:uppercase; }
.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; text-transform:uppercase; 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: 1.1em; border-top:1px dotted #BFBFBF; border-bottom:1px dotted #BFBFBF; font-weight: 400; text-transform:uppercase; margin-top:30px; padding:8px 0 6px 10px; }
#sidebar p { float: left; margin: 10px 0; padding-left:10px; }
#sidebar a { color: #FFB800; 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: #FFB800; 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 #tags,  
#sidebar #blogroll { width: 250px; display: block; clear: both;}
#sidebar .thumb-holder { display: block; clear: both; margin: 10px 0; }

#gallery a.thumb img, 
#gallery a.thumb:active img, 
#gallery a.thumb:visited img {background-color:#333333; border: none; float:left; width:67px; height:67px;  margin-left:5px; margin-bottom:5px; padding:5px;}
#gallery a.thumb:hover img {background-color:#FFB800; border: none;}
#gallery a.mr img{margin-right:5px; margin-left:5px;}


/* Tag Cloud */
#tags h2 { margin-bottom:15px; }
#tags a { background:transparent url(images/arrow.png) no-repeat scroll 10px 6px;  margin: 0; padding-left:25px; line-height:2em; }
#tags a, #tags a:active, #tags a:visited { color:#666666; text-decoration:none; display: block; }
#tags a:hover { color: #FFB800; text-decoration: none; }


/* Footer *****************************************************************************/
#footer {color:#000; 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:#000; text-decoration:none;}
#footer a:hover {color:#000; text-decoration:underline;}
#footer .footer-content { background:#2b2a25 url(images/wordpress.gif) no-repeat scroll 0 0; width: 665px; height: 40px; padding: 30px 0 10px 0; clear: both; }
