/*
Theme Name: Ritchie Linao
Theme URI: http://www.ritchielinao.com
Description: The latest version of Dodzki!
Version: 2.0
Author: Ritchie Linao
Author URI: http://www.ritchielinao.com
*/


@charset "utf-8";
/* CSS Document */

*{
	margin:0;
	padding:0;
}
body{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	background:rgb(255, 255, 255) url(images/body_bg.jpg);
}
a{
	text-decoration:none;
	color:rgb(103, 0, 0);
	outline:none;
}
a:hover{
	color:rgb(48,48,48);
}
p{
	line-height:20px;
	margin:0 0 18px 0;
}
ul li{
	list-style:none;
}
h1, h2, h3, h4, h5{
	text-shadow:1px 1px rgb(239, 239, 239);
	behavior:url(pie.htc);
}
h1{
	font:italic bold 36px georgia, "Times-New-Roman", sans-seris;
}
h1.page-title{
	margin:0 0 20px 0;
}
h2{
	font:30px helvetica, arial, verdana;
	color:rgb(130, 0, 0);
	margin:0 0 20px 0;
}
h3{
	font:italic bold 26px georgia, "Times-New-Roman", sans-seris;
	color:rgb(61, 19, 0);
}
h4{
	font:24px helvetica, arial, sans-seris;
	color:rgb(130, 0, 0);
}
	h4 a{
		font-weight:normal !important;
	}
	h4 a:hover{
		color:rgb(0, 0, 0);
	}
h5{
	font:20px helvetica, arial, verdana;
}
h6{
	font:bold 14px arial, helvetica, verdana;
	color:rgb(255, 153, 0);
	text-transform:uppercase;
}
blockquote{
	width:400px;
	padding:5px 20px;
	color:rgba(61, 19, 0, .7);
	margin:0 10px 20px 20px;
	border-left:solid 3px rgb(128, 0, 0);
	font:italic bold 16px georgia, "Times-New-Roman", sans-serif;
}
blockquote blockquote{
	margin:10px 0 0 20px;
}
blockquote p{
	margin:0;
}
img{
	border:0;
}
/*Other Tags and Elements
------------------------------------------------------------------------------------------------*/
#container{
	background:url(images/container_bg.jpg) no-repeat top center;
	z-index:1;
	margin:10px 0 0 0;
}
#thick-border{
	height:10px;
	background:rgb(48, 48, 48);
	position:fixed;
	top:0;
	left:0;
	width:100%;
	z-index:10;
}
#wrapper{
	width:960px;
	margin:0 auto;
}
.clearfloat{
	clear:both;
}
.heightsize{
	height:100px;
}
.heightsize-s{
	height:30px;
}
.more-continue{
	padding:0 20px 0 0;
	background:url(images/arrow_icon.png) no-repeat right 4px;
	float:right;
	padding-bottom:3px;
	font-weight:normal !important;
}
.more-continue:hover{
	color:rgb(103, 0, 0);
	border-bottom:1px solid rgb(103, 0, 0);
	padding-bottom:2px;
}
#recent-works .rwork-thumb, 
#lws-latest-work .lt-folio, 
#recent-blog .blog-thumbnail, 
#post-blog .blog-thumbnail, 
#contents .post-thumbnail, 
#comments .avatar, 
#post-layer .blog-thumbnail, 
#portfolio-works .rwork-thumb, 
#contents .wp-caption{
	background:rgba(255, 255, 255, .3);
	padding:5px;
	border:1px solid rgb(255, 255, 255);
}


.post ul, .post ol, .hblog-entry ol, .hblog-entry ul, .blog-entry ul, .blog-entry ol, #body .contact-content ul, ul.credits{
	padding:10px;
	margin:0 0 0 10px;
}
.post ul li, .post ol li, .hblog-entry ol li, .hblog-entry ul li, .blog-entry ul li, .blog-entry ol li, #body .contact-content ul li, ul.credits li{
	padding:0 0 0 0;
	margin:0 0 10px 10px;
}
.post ul li, .hblog-entry ul li, .blog-entry ul li, .blog-entry ol li, #body .contact-content ul li, ul.credits li{
	list-style:disc;
}
.hblog-entry a, .blog-excerpt a, .entry-content a{
	font-weight:bold;
}

/*Header
------------------------------------------------------------------------------------------------*/
#header{
	position:relative;
	z-index:1;
	height:165px;
}
#header .logo{
	display:block;
	text-indent:-2000px;
	width:390px;
	height:58px;
	background:url(images/logo.png) no-repeat left top;
	position:absolute;
	top:25px;
	left:0;
	z-index:2;
}
#header .logo:hover{
	background:url(images/logo.png) no-repeat left bottom;
}
#menu-secondary{
	position:absolute;
	z-index:3;
	top:45px;
	right:0;
}
#menu-secondary li{
	float:left;
	margin:0 25px 0 0;
}
#menu-secondary li a{
	font:150% helvetica;
	display:block;
}
#menu-secondary li a:hover{
	text-shadow:1px 1px rgb(239, 239, 239);
	color:rgb(0, 0, 0);
}
#menu-secondary li ul {
	position: absolute;
	width: 10em;
	left: -999em;
	padding:5px 0;
}

#menu-secondary ul li a{
	display:block;
	width:130px;
}
#menu-secondary ul li{
	margin:0 0 5px 0;
}

#menu-secondary li:hover ul {
	left: auto;
}
#menu-secondary li:hover ul, #menu-secondary li.sfhover ul {
	left: auto;
}
#menu-secondary li ul ul {
	margin: -1em 0 0 10em;
}
#menu-secondary, #menu-secondary ul {
	padding: 0;
	margin: 0;
	list-style: none; 
	line-height: 1;
}
#menu-secondary li:hover ul ul, #menu-secondary li.sfhover ul ul {
	left: -999em;
}
#menu-secondary li:hover ul, #menu-secondary li li:hover ul, #menu-secondary li.sfhover ul, #menu-secondary li li.sfhover ul {
	left: auto;
}
#menu-secondary li:hover ul ul, #menu-secondary li:hover ul ul ul, #menu-secondary li.sfhover ul ul, #menu-secondary li.sfhover ul ul ul {
	left: -999em;
}

#menu-secondary li:hover ul, #menu-secondary li li:hover ul, #menu-secondary li li li:hover ul, #menu-secondary li.sfhover ul, #menu-secondary li li.sfhover ul, #menu-secondary li li li.sfhover ul {
	left: auto;
}
#menu-secondary li:hover ul ul, #menu-secondary li:hover ul ul ul, #menu-secondary li:hover ul ul ul ul, #menu-secondary li.sfhover ul ul, #menu-secondary li.sfhover ul ul ul, #menu-secondary li.sfhover ul ul ul ul {
	left: -999em;
}

#menu-secondary li:hover ul, #menu-secondary li li:hover ul, #menu-secondary li li li:hover ul, #menu-secondary li li li li:hover ul, #menu-secondary li.sfhover ul, #menu-secondary li li.sfhover ul, #menu-secondary li li li.sfhover ul, #menu-secondary li li li li.sfhover ul {
	left: auto;
}




/*MISC ID Layers
------------------------------------------------------------------------------------------------*/
#introduction{
	position:relative;
	height:210px;
	margin:0 0 50px 0;
}
#introduction .welcome{
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	width:270px;
}
#introduction .welcome p{
	font:italic bold 16px/150% georgia, "Times-New-Roman", sans-serif;
}
#introduction .mememe{
	position:relative;
	z-index:2;
	width:225px;
	top:0;
	left:320px;
}
#introduction .hireme{
	position:absolute;
	bottom:-13px;
	right:0;
	padding:7px 10px;
	font:24px helvetica, arial, sans-serif;
	color:rgb(255, 255, 255);
	background:rgb(103, 0, 0);
	behavior:url(pie.htc);
	-webkit-border-radius:.4em;
	-moz-border-radius:.4em;
	border-radius:.4em;
	
}
#introduction .wicd{
	width:360px;
	font:italic bold 12px Georgia, "Times New Roman", sans-serif;
	position:absolute;
	z-index:3;
	top:0;
	right:0;
}
#introduction .wicd p{
	line-height:24px;
}
#introduction .wicd h1{
	font:italic bold 36px Georgia, "Times New Roman", sans-serif;
	margin:0;
}
#introduction .wicd h1 span{
	float:left;
	font-size:70px;
	margin:-10px 10px -15px 0;
}


/*Latest Work and Services
------------------------------------------------------------------------------------------------*/
#latestwork-services{
	position:relative;
	margin:0 0 50px 0;
}
#lws-latest-work{
	position:relative;
	float:left;
	width:532px;
	height:332px;
}
#lws-latest-work .lw-tag{
	position:absolute;
	top:0;
	left:0;
	z-index:2;
}
#lws-latest-work .lw-title{
	position:absolute;
	z-index:3;
	right:20px;
	bottom:-15px;
	padding:10px 20px;
	background:rgb(0, 0, 0);
	font-size:24px;
	font-weight:bold;
	color:rgb(255, 255, 255);
}
#lws-latest-work .lt-folio{
	position:absolute;
	top:20px;
	left:20px;
	z-index:1;
	width:500px;
	height:300px;
}

#lws-services{
	float:right;
	width:375px;
}
#lws-services h1{
	margin:0 0 20px 0;
}
#lws-services .list{
	padding:0 0 0 10px;
}
#lws-services .list li{
	margin:0 0 18px 0;
	padding:0 0 0 35px;
	font:bold 16px helvetica, arial, sans-serif;
	background:url(images/approved_icon.png) no-repeat 0 3px;
}
#lws-services .lmams{
	float:right;
	text-indent:-2000px;
	background:url(images/learnmore_services.png);
	display:block;
	width:270px;
	height:39px;
}

/*Body
------------------------------------------------------------------------------------------------*/
#recent-works{
	float:left;
	width:532px;
}
#recent-works h3{
	margin-bottom:30px;
}
#recent-works h4{
	margin-bottom:20px;
}
#recent-works h4, #recent-works h3{
	margin-left:35px;
}
#recent-works h4 a:hover{
	color:rgb(0, 0, 0);
}
#recent-works .rwork-thumb{
	z-index:1;
}
#recent-works .hwork-entry{
	position:relative;
	margin:0 0 70px 0;
}
#recent-works .work-category{
	padding:8px 15px;
	background:rgb(0, 0, 0);
	color:rgb(255, 255, 255);
	font-weight:normal;
	text-transform:uppercase;
	position:absolute;
	bottom:-10px;
	left:35px;
	z-index:3;
}
#recent-works .work-category a{
	color:rgb(255, 255, 255);
}
#recent-works .entry-excerpt{
	position:absolute;
	right:0;
	top:50px;
	width:215px;
}


#recent-blog{
	float:right;
	width:402px;
}
#recent-blog .blog-thumbnail{
	width:389px;
	height:128px;
	margin:0 0 10px 0;
}
#recent-blog h3{
	margin:0 0 30px 100px;
}
#recent-blog .hblog-entry{
	float:right;
	width:300px;
}
#recent-blog .hblog-entry h4{
	margin:0 0 10px 0;
}
#recent-blog .hblog-entry em{
	font-weight:bold;
	margin:0 0 10px 0;
	display:block;
}



/*Portfolio
------------------------------------------------------------------------------------------------*/
#portfolio-works h3{
	margin-bottom:30px;
}
#portfolio-works h4{
	margin-bottom:20px;
}
#portfolio-works h4, #portfolio-works h3{
	margin-left:35px;
}
#portfolio-works h4 a:hover{
	color:rgb(0, 0, 0);
}
#portfolio-works .rwork-thumb{
	position:relative;
	z-index:2;
}
#portfolio-works .hwork-entry{
	position:relative;
	margin:0 16px 70px 0;
	width:472px;
	float:left;
}
#portfolio-works .box-two{
	margin-right:0 !important;
}
#portfolio-works .work-category{
	padding:8px 15px;
	background:rgb(0, 0, 0);
	color:rgb(255, 255, 255);
	font-weight:normal;
	text-transform:uppercase;
	position:absolute;
	bottom:-10px;
	left:35px;
	z-index:3;
}
#portfolio-works .work-category a{
	color:rgb(255, 255, 255);
}
#portfolio-works .entry-excerpt{
	position:absolute;
	right:30px;
	top:30px;
	width:215px;
	z-index:1;
}
#portfolio-works p{
	background:rgb(0,0,0);
	padding:5px 5px 5px 25px;
	color:rgb(255,255,255);

}


/*Single Post
------------------------------------------------------------------------------------------------*/
#contents{
	float:left;
	width:600px;
}
#contents .post{
	width:500px;
	float:right;
}
#contents .post em.meta-date{
	font-size:18px;
	color:rgb(128, 0, 0);
	margin:0 0 30px 0;
	padding:0 0 5px 0;
	display:block;
	width:500px;
}
#contents .post h1{
	margin:0 0 20px 0;
}
#contents .post-thumbnail, #contents .wp-caption{
	float:left;
	margin:0 0 20px -100px;
}
#contents .alignleft{
	width:588px !important;
	clear:both;
}
#contents .wp-caption p{
	margin:0;
	/*padding:5px;
	background:rgb(255, 255, 255);*/
	text-align:center;
}
#contents .gallery > div{
	float:left;
}
#contents .gallery-item{
	margin-bottom:0 !important;
	height:120px;
}
#contents .gallery img{
	padding:5px;
	background:rgba(255, 255, 255, .2);
	border:1px solid rgb(255, 255, 255);
	margin:0 25px 0 0;
}
#contents .gallery-caption{
		visibility:hidden;
		width:0px;
}

/*Contents
------------------------------------------------------------------------------------------------*/
#worx-contents{
	width:320px;
	float:left;
}
#worx-contents .meta-data{
	margin:0 0 20px 0;
}
#worx-contents .meta-data li{
	background:url(images/borderbw.png) bottom repeat-x;
	line-height:35px;
	font-size:11px;
	clear:left;
}
#worx-contents .meta-data li label{
	display:block;
	width:100px;
	font-weight:bold;
	float:left;
}
#worx-screen{
	padding:5px;
	background:rgba(255, 255, 255, .3);
	border:1px solid rgb(255, 255, 255);
	float:right;
}
#worx-contents .gallery{
	padding:10px 0 0 0;
}
#worx-contents .gallery-item{
	float:left;
	margin:0 10px 5px 0;
}
#worx-contents .gallery-item img{
	padding:4px;
	background:rgba(255, 255, 255, .3);
	border:1px solid rgb(255, 255, 255);
}
#photography-screen{
	width:600px;
	float:right;
}
#post-layer{
	float:left;
	width:512px;
}
#post-layer .blog-entry{
	margin:0 0 50px 0;
}
#post-layer .blog-entry h3 a:hover{
	color:rgb(0,0,0);
}
#post-layer h3{
	margin:0 0 20px 112px;
}
#post-layer .blog-excerpt{
	width:400px;
	/*float:right;*/
	margin:0 0 0 100px;
}
#post-layer .blog-thumbnail{
	clear:both;
	margin:0 0 20px 0;
}
#post-layer .post-date-time{
	font:bold italic 16px helvetica, arial, verdana;
	color:rgb(102, 102, 102);
	margin:0 0 0 112px;
	text-shadow:1px 1px rgb(239, 239, 239);
}
#post-layer .post-date-time a{
	color:rgb(102, 102, 102);
}
.my-photo{
	float:left;
	margin:0 20px 50px 0;
	padding:10px;
	background:rgba(255, 255, 255, .3);
	border:1px solid rgb(255, 255, 255);
}
.aboutpg-intro li{
	float:left;
	width:300px;
	margin:0 30px 0 0;
}
.about-skills li{
	line-height:30px;
	width:120px;
	float:left;
	border-bottom:1px solid rgb(48, 48, 48);
}
.serv-title{
	clear:both;
}
.about-services li{
	float:left;
	width:270px;
	margin:0 50px 0 0;
}
.about-serv-secrow{
	clear:both;
}


/*Contact Page
------------------------------------------------------------------------------------------------*/
#body .contact-content{
	float:left;
	width:300px;
}
#body .contact-content p{
	font-size:14px;
	line-height:24px;
	text-shadow:1px 1px rgb(239, 239, 239);
}
#body .contact-form{
	float:right;
	width:570px;
}
#body .contact-form ul li{
	margin:0 0 20px 0;
}
#body .contact-form label{
	float:left;
	display:block;
	width:170px;
	font-weight:bold;
	line-height:40px;
}
#body .contact-form input, #body .contact-form textarea{
	width:350px;
	padding:10px;
	border:0;
	background:rgba(255, 255, 255, .4);
}
#body .captcha{
	border:0 !important;
}
#body .subm{
	margin:0 0 0 170px !important;
	border:0px !important;
	width:100px !important;
	background:rgb(103, 0, 0) !important;
	color:rgb(255, 255, 255) !important;
	font-weight:bold;
}
#body .subm:hover{
	background:rgb(48, 48, 48) !important;
}
#body .code-cap{
	float:left;
	height:35px;
}
#body .captcha{
	width:75px !important;
}

/*Sidebar
------------------------------------------------------------------------------------------------*/
#primary{
	float:right;
	width:350px;
}
#search-2{
	background:rgba(255, 255, 255, .3);
	padding:10px;
	border:1px solid rgb(255, 255, 255);
}
#searchsubmit{
	border:1px solid rgb(255, 255, 255);
	font:12px arial, helvetica, verdana;
	color:rgb(255, 255, 255);
	text-transform:uppercase;
	padding:2px 5px;
	background:rgb(48, 48, 48);
}
#meta-post{
	float:right;
	width:250px;
	font-size:11px;
	margin:0 50px 0 0;
}
#post-meta-data{
	padding:60px 0 0 0;
	margin:0 0 20px 0;
}
#post-meta-data span{
	display:block;
	padding:0 0 0 25px;
}
#post-meta-data .calendar span{
	background:url(images/calendar.png) no-repeat left center;
}
#post-meta-data .comments span{
	background:url(images/comment.png) no-repeat left center;
}
#post-meta-data .tags span{
	background:url(images/tag.png) no-repeat left center;
}
#post-meta-data .chart span{
	background:url(images/chart_bar.png) no-repeat left center;
}
#social-icons li, #post-meta-data li{
	line-height:35px;
	background:url(images/borderbw.png) bottom repeat-x;
}
#social-icons{
	margin:0 0 20px 0;
}
#social-icons a{
	padding:3px 0 3px 25px;
}
#social-icons .share-tweet a{
	background:url(images/twitter.png) no-repeat left center;
}
#social-icons .share-fbook a{
	background:url(images/facebook.png) no-repeat left center;
}
#social-icons .share-digg a{
	background:url(images/digg.png) no-repeat left center;
}
#social-icons .share-stumble a{
	background:url(images/stumble.png) no-repeat left center;
}
#social-icons .share-delicious a{
	background:url(images/delicious.png) no-repeat left center;
}
#social-icons .share-technorati a{
	background:url(images/technorati.png) no-repeat left center;
}

/*Comment List
------------------------------------------------------------------------------------------------*/
#comments{
	background:url(images/borderbw.png) top repeat-x;
	padding:30px 0 0 0;
}
#comments h3{
	text-align:center;
	margin:0 0 30px 0;
}
#comments .commentlist{
	width:800px;
	margin:0 auto;
}
.commentlist li{
	list-style:none;
	clear:both;
	margin-bottom:20px;
	padding-bottom:20px;
}
.fn a, .bypostauthor cite{
	font:italic 20px helvetica, arial, verdana;
	text-shadow:1px 1px rgb(239, 239, 239)
}
#comments a:hover{
	color:rgb(0,0,0);
}
.bypostauthor cite{
	font-weight:bold;
}
.vcard, .comment-meta{
	margin:0 0 10px 0;
}
#comments .avatar{
	float:left;
	margin:0 0 0 -100px;
}
#comments .comms-entry-layer{
	float:right;
}
.children{
	display:block;
	padding:20px 0 0 0;
}
.children li{
	margin-bottom:10px !important;
}

#comments ol.commentlist li.depth-1{
	float:right;
	width:700px;
	display:block;
}
#comments ul.children li.depth-2{
	float:right;
	width:600px;
	display:block;
}
#comments ul.children li.depth-3{
	float:right;
	width:500px;
	display:block;
}

/*Comment Form
------------------------------------------------------------------------------------------------*/
#respond{
	clear:both;
	margin:20px auto 0 auto;
	padding:50px 0 0 0;
	background:url(images/borderbw.png) top repeat-x;
}
#commentform{
	width:500px;
	margin:0 auto;
}
#respond label{
	float:left;
	display:block;
	width:130px;
	padding:5px 0;
	color:rgb(108, 0, 0);
	text-shadow:1px 1px rgb(239, 239, 239);
	font:bold 14px helvetica, arial, verdana;
}
#respond p{
	clear:both;
}
#respond input, #respond textarea{
	padding:5px 10px;
	border:0;
	background:rgba(255, 255, 255, .3);
	width:340px;
}
#respond textarea{
	height:150px;
}
#submit{
	background:rgb(108, 0, 0) !important;
	color:rgb(255, 255, 255);
	width:130px !important;
	margin:0 0 0 130px;
}
#respond .form-allowed-tags{
	width:340px;
	display:block;
	margin:0 0 20px 130px;
	background:rgba(48, 48, 48, .3);
	padding:5px 10px;
}


/*Footer
------------------------------------------------------------------------------------------------*/
#footer-wrap{
	width:100%;
	background:/*url(images/footer_bg.png)*/ rgb(25, 25, 25);
	height:452px;
	padding:20px 0 0 0;
}
#footer{
	width:960px;
	margin:0 auto;
	position:relative;
}
#footer p, #footer ul li{
	font-size:11px;
	color:rgb(255, 255, 255);
}
#footer > div{
	float:left;
	width:225px;
	margin:0 20px 0 0;
}
#footer .dodski-footer{
	position:absolute;
	right:0;
	top:-148px;
}
#footer strong{
	color:rgb(255, 255, 255);
}
#footer h6{
	margin:0 0 10px 0;
}
#footer ul{
	padding:0 0 0 15px;
	margin:0 0 10px 0;
}
#footer ul li{
	line-height:24px;
	list-style:circle;
	margin:0 0 0 10px;
}
#footer a{
	color:rgb(255, 255, 255);
}
#footer ul li a{
	display:block;
}
#footer a:hover, #footer ul li:hover{
	color:rgb(255, 153, 0);
}
#footer ul li:hover{
	list-style:disc;
}
#footer .flickr img{
	float:left;
	padding:5px;
	margin:0 10px 20px;
	border:0;
	background:rgb(0, 0, 0);
}
#footer .flickr img:hover{
	background:rgb(255, 255, 255);
}
#footer .flickrlink{
	clear:both;
	display:block;
	float:right;
}