@charset "utf-8";
/* CSS Document */
body{margin:0px; padding:0px; background:url(../images/mainbg-new.gif) repeat-x left top #000000; font-family:Arial, Helvetica, sans-serif;}
.clear{clear:both;}

form{margin:0px; padding:0px;}

#advertising{ width:985px; margin:0 auto; height:35px}

#wrapper{ width:952px; margin:0 auto; margin-top:34px;  margin-bottom:10px;}

.logo{width:250px; float:left;}

img{border:none;}
/* ----------------------NAVIGATION PART---------------*/
#navigation{ margin:40px 0 0 0; width:509px; float:right; height:70px; background: #CCCCCC;}


#navigationArea {
width:530px;
height:30px;
text-align:left;
float:right;
margin:20px 0 0 0;
}
#nav {
	list-style:none;
	padding:0px;
	line-height:normal;
	margin: 0px;
	float:right;
}
#nav li{
	float:left;
}
#nav li a{
	height: 38px;
	display:block;
	float:left;
	text-decoration:none;
	color: #FFFFFF;
	font-family: Tahoma, Arial, Verdana;
	font-size: 0px;
	vertical-align: bottom;
	text-align:center;
	line-height: normal;
	padding-right:6px;
text-indent:-3000px; }

#nav #nav-01 a{
	width:40px;
	padding-right:16px;
	background-image: url(../images/home-roll.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#nav #nav-01 a:hover{
	background-image: url(../images/home-hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#nav #nav-01 .active{
	background-image: url(../images/home-hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}

#nav #nav-02 a{
	width:100px;
	padding-right:16px;
	background-image: url(../images/introduce-roll.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#nav #nav-02 a:hover{
	background-image: url(../images/introduce-hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#nav #nav-02 .active{
	background-image: url(../images/ntroduce-hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}

#nav #nav-03 a{
	width:69px;
	padding-right:16px;
	background-image: url(../images/work-roll.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#nav #nav-03 a:hover{
	background-image: url(../images/work-hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#nav #nav-03 .active{
	background-image: url(../images/work-hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}

#nav #nav-04 a{
	width:59px;
	padding-right:16px;
	background-image: url(../images/blog-roll.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#nav #nav-04 a:hover{
	background-image: url(../images/blog-hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#nav #nav-04 .active{
	background-image: url(../images/blog-hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
}

#nav #nav-05 a{
	width:83px;
	background-image: url(../images/contact-roll.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
#nav #nav-05 a:hover{
	background-image: url(../images/contact-hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}
#nav #nav-05 .active{
	background-image: url(../images/contact-hover.gif);
	background-repeat: no-repeat;
	background-position: left top;
	}


/* ----------------------punchline---------------*/

.bg{ background:url(../images/bar.png) left top no-repeat; width:922px; margin:0 auto; height:86px; padding:30px 30px 0 0; text-align:right; margin-bottom:20px;}

.home-work{ width:952px; margin:0 auto; text-align:left;}

.banner-01{ float:left; margin:4px 11px 4px 0px; background-color:#F5F5F5; border:solid 8px #DEDEDE;}

.banner-02{ float:left; margin:4px 0px 4px 0px; background-color:#F5F5F5; border:solid 8px #DEDEDE; }

/* ----------------------SHORT ABOUT ME---------------*/
.shortbg{background: url(../images/short-me-bar.png) repeat-x left top; height:115px; margin:20px 0 0 0; padding:24px 30px 0 24px;}

.shortbg span{ width:90%; padding:0 0 16px 0;}

.shortbg p{ color:#b6b6b6; font-size:12px; line-height:22px; margin:0px; padding:0px;}

/* ----------------------THINGS I CAN DO---------------*/
.thingBG{background: url(../images/things-I-do-bar.png) repeat-x left bottom; height:246px; margin:20px 0 0 0; padding:24px 23px 0 23px;}

.thingBG span{ width:90%; padding:0 0 16px 0;}

.thingsLeft{width:534px; float:left;}

.thingsOne{width:147px; float:left; margin:10px 0 0 0; padding:0 12px 0 0;}
.thingsOne ul{list-style-type: none;padding: 0;margin: 0;font-size:11px; line-height:25px; color:#5f5f5f; }
.thingsOne ul li{ background: url(../images/icon-yes.gif) 0px 5px no-repeat; padding-left:21px; border-bottom:solid 1px #393939;}
.thingsOne ul li a{ color:#d3d2d2; text-decoration:none;}
.thingsOne ul li a:hover{ color:#b0b0b0; text-decoration:none;}

.thingsTwo{width:148px; float:left; margin:10px 0 0 0; padding:0 8px 0 8px;}
.thingsTwo ul{list-style-type: none;padding: 0;margin: 0;font-size:11px; line-height:25px; color:#5f5f5f; }
.thingsTwo ul li{ background: url(../images/icon-yes.gif) 0px 5px no-repeat; padding-left:21px; border-bottom:solid 1px #393939;}
.thingsTwo ul li a{ color:#d3d2d2; text-decoration:none;}
.thingsTwo ul li a:hover{ color:#b0b0b0; text-decoration:none;}


.thingsThree{width:192px; float:left; margin:10px 0 0 0; padding:0 8px 0 8px;}
.thingsThree ul{list-style-type: none;padding: 0;margin: 0;font-size:11px; line-height:25px; color:#5f5f5f; }
.thingsThree ul li{ background: url(../images/icon-yes.gif) 0px 5px no-repeat; padding-left:21px; border-bottom:solid 1px #393939;}
.thingsThree ul li a{ color:#d3d2d2; text-decoration:none;}
.thingsThree ul li a:hover{ color:#b0b0b0; text-decoration:none;}

.thingsRight{width:370px; float:right; }

.thingsRight span{ width:90%; padding:0 0 16px 0;}

.thingsRight-div{ width:369px; margin:5px 0 0 0;}

.fotmText{ width:62px; float:left; text-align:right; padding:0 8px 0 0; margin:8px 0 8px 0; }
.fotmText-p{  color:#d3d2d2; padding:6px 0 0 0; font-size:11px; vertical-align:top;}

.fotmInput{ width:294px; float:left; padding:8px 0 0 0;}
.fotmInput .input{ border:solid 1px #3a3a3a; background:#0f0f0f; padding:4px 0 4px 5px; color:#CCCCCC; width:290px;}

.btn{background:#1d1d1d; border:solid 1px #393939; padding:4px 18px 4px 18px; font-size:11px; color:#5f5f5f; text-transform:uppercase; font-weight:bold;}

/* ----------------------ELSE WHERE PROFILE---------------*/
.ElsewhereArea{ float:left; padding:0 17px 20px 16px; margin:20px 0 0 0;}

.ElseWhereLeft{ width:530px; float:left;}

.eLseWhere{width:260px; float:left;}

.eLseWhere-span{ width:97%; padding:0 0 16px 0;}


.eLseWhere-one{width:115px; float:left; margin:0 13px 0 0;}
.eLseWhere-one ul{list-style-type: none; padding:0px; margin:0px;font-size:11px; line-height:25px; color:#5f5f5f; }
.eLseWhere-one ul li{ border-bottom:solid 1px #414141; padding:0px;padding-left:22px; }
.eLseWhere-one ul li a{ color:#a5a5a5; text-decoration:none;}
.eLseWhere-one ul li a:hover{ color:#d5d5d5; text-decoration:none;}

.eLseWhere-Two{width:110px; float:left; margin:0 0 0 13px;}
.eLseWhere-Two ul{list-style-type: none;padding:0px; margin:0px;font-size:11px; line-height:25px; color:#5f5f5f; }
.eLseWhere-Two ul li{ border-bottom:solid 1px #414141; padding:0px;padding-left:22px; margin:0px; display:block;}
.eLseWhere-Two ul li a{ color:#a5a5a5; text-decoration:none;}
.eLseWhere-Two ul li a:hover{ color:#d5d5d5; text-decoration:none;}

li.youtube{background: url(../images/icon-twitter.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.youtube:hover{background: url(../images/icon-twitter-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}

li.flickr{background: url(../images/icon-flickr.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.flickr:hover{background: url(../images/icon-flickr-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}

li.shelfari{background: url(../images/icon-shelfari.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.shelfari:hover{background: url(../images/icon-shelfari-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}

li.ff{background: url(../images/icon-ff.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.ff:hover{background: url(../images/icon-ff-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}

li.likndin{background: url(../images/icon-likndin.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.likndin:hover{background: url(../images/icon-likndin-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}

li.blog{background: url(../images/icon-blog.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.blog:hover{background: url(../images/icon-blog-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}

li.twitter{background: url(../images/icon-twitter.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.twitter:hover{background: url(../images/icon-twitter-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}

li.facebook{background: url(../images/icon-facebook.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.facebook:hover{background: url(../images/icon-facebook-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}

li.googlereader{background: url(../images/icon-googlereader.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.googlereader:hover{background: url(../images/icon-googlereader-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}

li.deviantart{background: url(../images/icon-deviantart.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.deviantart:hover{background: url(../images/icon-deviantart-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}

li.deviantart{background: url(../images/icon-deviantart.gif) no-repeat left 50%; padding: 0 0 0 22px;}
li.deviantart:hover{background: url(../images/icon-deviantart-h.gif) no-repeat left 50%; padding: 0 0 0 22px;}


.eLseWhere-three{width:110px; float:left; margin:0 13px 0 0;}
.eLseWhere-three ul{ list-style-type: none; padding:0px; margin:0px;font-size:11px; line-height:25px; color:#5f5f5f; }
.eLseWhere-three ul li{ border-bottom:solid 1px #414141; padding:0px;padding-left:02px; margin:0px; display:block;}
.eLseWhere-three ul li a{ color:#a5a5a5; text-decoration:none;  }
.eLseWhere-three ul li a:hover{ color:#d5d5d5; text-decoration:none; }

.eLseWhere-four{width:110px; float:left; margin:0 0 0 13px;}
.eLseWhere-four ul{list-style-type: none;padding:0px; margin:0px;font-size:11px; line-height:25px; color:#5f5f5f; }
.eLseWhere-four ul li{ border-bottom:solid 1px #414141; padding:0px;padding-left:02px; margin:0px; display:block;}
.eLseWhere-four ul li a{ color:#a5a5a5; text-decoration:none;}
.eLseWhere-four ul li a:hover{ color:#d5d5d5; text-decoration:none;}


.featuRed{width:255px; float:left; padding:0 0 0 5px;}
.featuRed span{ width:90%; padding:0 0 16px 0;}

.featuRed-p{ font-size:11px; color:#9c9c9c; margin:20px 0 10px 0; text-align:justify; line-height:18px;}

.ElseWhereRight{ width:380px; float:right;}

.footer{background:#181818; margin:0 auto; width:920px; padding:0px 8px 0px 8px;}

.footerLeft{width:45%; color:#9d9d9d; text-decoration:none; font-size:11px; float:left; padding:8px 0 8px 0;}

.footerRight{width:45%;color:#9d9d9d; float:right; font-size:11px; text-align:right; padding:8px 0 8px 0;}
.footerRight a{ color:#9d9d9d; text-decoration:none; font-size:11px; padding:0 7px;}
.footerRight a:hover{ color:#acacac; text-decoration: underline; font-size:11px;}


/*----------------------ABOUT US--------------------------*/
.BGaboutus{background: url(../images/bg-about-us.png) repeat-x left top; height:407px; margin:20px 0 0 0; padding:24px 30px 0 24px;}

.BGaboutus-span{ width:90%; padding:0 0 13px 0;}

.BGaboutus p{ color:#b6b6b6; font-size:12px; line-height:22px; margin:0px; padding:0px;}


/*----------------------WORK--------------------------*/

.work-list{ width:952px; margin:0 auto; text-align:left; margin-top:4px;}
.work-cateory{ background:#161616; border:solid 2px #2d2d2d; margin:20px 0 0 0; padding:12px 18px 10px 18px;}
.work-cateory-left{ float:left; width:250px;}
.work-cateory-right{ float:right; width:200px; text-align:right; vertical-align:middle;}
.work-cateory-right p{ width:25px; margin:0px; padding:0px; text-align:right; float:right;}

.work-cateoryTop{ background:#161616; border:solid 2px #2d2d2d; margin:20px 0 10px 0; padding:12px 18px 10px 18px;}

/* ----------------------CONTACT ME---------------*/
.contactBg{background: url(../images/contact-bg.png) repeat-x left top; margin:20px 0 0 0; padding:28px 24px 28px 24px;}

.contactbgLeft{float:left; width:552px; padding:0 24px 0 0;}
.contactbgLeft-div{ width:99%; padding:0 0 10px 0;}

.contactbgLeft-p{ color:#b6b6b6; font-size:12px; line-height:22px; margin:0px; padding:0px;}

.formBox{width:450px; border:solid 1px #3a3a3a; margin:25px 0 0 0; padding:27px 48px 20px 48px;}

.formBoxHead{ height:21px; border-bottom:solid 1px #3a3a3a;font-weight:bold; color:#6b6b6b; font-size:12px; text-transform:uppercase;}

.CformText{ width:70px; vertical-align:middle; text-align:left; float:left;color:#b6b6b6; padding:12px 0 8px 0; font-size:12px;}


.CfotmInput{ width:376px; float:right; padding:4px 0 0 0; text-align:right; margin:3px 0 3px 0;}
.CfotmInput .input{ border:solid 1px #3a3a3a; background:#0f0f0f; padding:4px 0 4px 5px; color:#CCCCCC; width:368px;}
.CfotmInput .input2{ border:solid 1px #3a3a3a; background:#0f0f0f; padding:4px 0 4px 5px; color:#CCCCCC; width:100px;}

.button{background:#1d1d1d; border:solid 1px #393939; padding:4px 10px 4px 10px; font-size:11px; color:#b5b6b6; text-transform:uppercase; font-weight:bold;}
.captcha{ float:left; margin:0 20px 0 0;}


.contactbgRight{float:right; width:298px; padding:0 0 0 24px;}
.contactbgLeft-div{ width:100%; padding:0 0 10px 0;}


.contactInfo{width:294px; float:left;}
.contactInfo ul{list-style-type: none;padding: 0;margin: 0;font-size:12px; line-height:28px; color:#5f5f5f; }
.contactInfo ul li{ padding-left:3px; border-bottom:solid 1px #393939; display:block;}
.contactInfo ul li a{ color:#656363; text-decoration:none;}
.contactInfo ul li a:hover{ color:#b0b0b0; text-decoration:none;}

.contactInfo ul li span a{ color:#acacab; text-decoration:none;}
.contactInfo ul li span a:hover{ color:#b0b0b0; text-decoration:none;}


/*------------------BLOG------------------*/

.BlogRight{float:right; width:236px; padding:0 0 0 14px;}
.BlogRight-div{ width:100%; padding:0 0 10px 0;}

.BlogRights {width:236px; float:left;}
.BlogRights ul{list-style-type: none;padding: 0;margin: 0;font-size:12px; line-height:28px; color:#5f5f5f; }
.BlogRights ul li{ padding-left:3px; border-bottom:solid 1px #393939; display:block;}
.BlogRights ul li a{ color:#656363; text-decoration:none;}
.BlogRights ul li a:hover{ color:#b0b0b0; text-decoration:none;}

.BlogLeft{float:left; width:600px; padding:0 24px 0 0;}
.BlogLeft-div{ width:100%; padding:0 0 10px 0;}
.BlogLeft-headbdr{ width:100%; padding:0 0 10px 0; border-bottom:solid 1px #3a3a3a; margin:0 0 20px 0;}

.BlogLeft-p{ color:#b6b6b6; font-size:12px; line-height:22px; margin:0px; padding:0px;}



.BlogBox{width:510px; border:solid 1px #3a3a3a; background:#111111; margin:25px 0 0 0; padding:27px 50px 20px 48px;}

.BlogBoxHead{ height:21px; border-bottom:solid 1px #3a3a3a;font-weight:bold; color:#6b6b6b; font-size:12px; text-transform:uppercase;}

.BformText{ width:60px; vertical-align:middle; text-align:left; float:left;color:#b6b6b6; padding:12px 0 8px 0; font-size:12px;}

.BfotmInput{ width:450px; float:right; padding:4px 0 0 0; text-align:left; margin:3px 0 3px 0;}
.BfotmInput .input{ border:solid 1px #3a3a3a; background:#0f0f0f; padding:4px 0 4px 5px; color:#CCCCCC; width:250px;}
.BfotmInput .input2{ border:solid 1px #3a3a3a; background:#0f0f0f; padding:4px 0 4px 5px; color:#CCCCCC; width:440px;}

.Bbutton{background:#1d1d1d; border:solid 1px #393939; padding:4px 10px 4px 10px; font-size:11px; color:#b5b6b6; text-transform:uppercase; font-weight:bold;}

.blogHeader{ width:100%; float:left;}

.blogHeaderLeft{ width:55px; float:left; border:solid 1px #3b3b3b;  line-height:14px;background:#060606; text-align:center; padding:3px;}
.blogHeaderLeft span{ font-weight: bold; font-size:12px; color:#ffffff;}

.blogHeaderRight{ width:520px; float:right;}
.blogHeaderRight span{ font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#6b6b6b; text-transform:uppercase; line-height:normal; font-weight:bold; vertical-align: top;}
.blogHeaderRight p{ font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#ffffff; line-height:normal; vertical-align: top;}


