/*
Id: #76840
Link: www.templatemonster.com
Category : HTML, CSS
*/


@charset "utf-8";
/* reset css */
ul {
	list-style: none;
}
/* CSS Document */
html {height:100%;margin-bottom:1px;}
*:focus{ border:none; outline:none;}
body{background:#FFF; color:#000; font:normal 13px Tahoma, Geneva, sans-serif; margin:0px; padding:0px;}
h1{color:#202020; font-size:21px; margin:10px 0px 15px 0px;}
h2{color:#777; font-size:17px; margin:0px 0px 15px 0px;}
h3{color:#202020; font-family: Arial; font-size:15px; margin:0px 0px 15px 0px;}
img{border:0px;}

/*------------FORM ELEMENETS------------*/
form{padding:0; margin:0;}
label{font-weight:bold; color:#202020;}
.input {color:#777;	font-size:13px;	background:#FFF; margin:5px 0; border-top:1px solid #999999; border-right:1px solid #eeeeee;	border-bottom:1px solid #bcbcbc; border-left:1px solid #d9d9d9;	padding:2px 0px 0px 2px; width:100%; height:18px;}
.submit{border:none; background:url(../images/submit.jpg) no-repeat top center; width:65px; height:23px; cursor:pointer;}
.cancel{border:none; background:url(../images/cancel.jpg) no-repeat top center; width:65px; height:23px; cursor:pointer;}
:focus.input{background:#F7F7f7;}

/*------------HEADER SECTION------------*/
#headercontainer{background:#202020; border-top:5px solid #333; width:100%;}
#header{width:950px; margin:0px auto; position:relative;}
#header a{color:#777; text-decoration:none;}
#header a:hover{color:#aaa; text-decoration:none;}
.topicon{background:#333 url(../images/01.gif) no-repeat bottom center; position:absolute; top:0px; right:0px; padding:10px 14px 0px 14px; font-size:9px; width:185px; height:21px;}
.home{background:url(../images/homeicon.gif) no-repeat left center; padding-left:21px; height:11px;}
.search{background:url(../images/search.gif) no-repeat left center; padding-left:21px; margin:0px 17px; height:11px;}
.sitemap{background:url(../images/sitemap.gif) no-repeat left center; padding-left:21px; height:11px;}

/*------------MENU SECTION------------*/
#menucontainer{background:#333; border-top:1px solid #565656; border-bottom:1px solid #565656; margin-bottom:1px; width:100%;}
#menu{width:950px; margin:0px auto;}
#menu ul{list-style-type:none;margin:0;padding:0px;height:32px;position:relative;z-index:1000;}
#menu ul li{float:left; display:inline; padding:7px 0 0 0; margin:0px; height:24px;}
#menu ul li ul{list-style-type:none;margin:25px 0 0 0;padding:10px 0 0 10px;position:absolute;left:85px;top:-2px;width:100px; height:1px;}
#menu ul li li{background:#333; border-top:1px solid #aaaaaa; float:none; display:none; margin:50px; padding:2px 10px; width:130px; height:20px;}
#menu ul li:hover li{background:#333; border-top:1px solid #aaaaaa; float:none; display:block; margin:0; padding:2px 10px; width:160px; height:20px;}
#menu .divider{padding:5px 20px;}
#menu a{color:#aaa; text-decoration:none; font-weight:bold;}
#menu a:hover{color:#eee; text-decoration:none;}

/*------------BANNER SECTION------------*/
#bannercontainer{background:url(../images/bannerbg.jpg) repeat-x top; border-bottom:1px solid #FFF; width:100%;}
#banner{margin:0px auto; width:950px; position:relative; height:201px;}
.contactbubble{position:absolute; top:8px; left:708px; width:240px; height:191px;}

/*------------BDOY SECTION------------*/
#maincontainer{background:#FFF url(../images/bodybg.gif) repeat-x top; width:100%;}
#bodycontainer{margin:0px auto; padding:20px 0px; width:950px;}
#body{float:left; margin-right:0px; width:690px;}
#body strong{color:#202020;}
#box{ background:#eaeaea url(../images/boxbg.gif) repeat-x top; height:220px; border:1px solid #e2e2e2; padding:10px; margin:35px 0px;}
#box h1{margin-top:0px;}
#box strong{color:#202020;}
.innerbox{ width:213px; float:left; padding:0px; margin:0px; position:relative;}
.innerbox1{ width:200px; float:left; padding:0px 10px; margin:0px 10px; border-left:1px solid #e4e4e4; border-right:1px solid #e4e4e4; position:relative;}
.leftdiv{width:340px; float:left;}
.rightdiv{width:311px; float:right; padding-left:19px; margin-right:19px; border-left:1px solid #cccccc;}

/*------------RIGHT PANEL------------*/
#rpanel{float:right; margin:0px; width:200px;}
.wbox{background:#FFF; border:1px solid #eaeaea; padding:10px; margin-bottom:10px;}
.wbox strong{color:#202020;}
#rpanel a{color:#000000; text-decoration:underline; font-weight:bold;}
#rpanel a:hover{color:#000000; text-decoration:none;}

/*------------BLUE PANEL------------*/
#bottompanelcontainer{width:100%; background:#777; padding-bottom:10px;}
#bottompanel{width:950px; margin:0px auto; color:#e4e4e4;}
#bottompanel a{color:#FFF; text-decoration:underline;}
#bottompanel a:hover{color:#FFF; text-decoration:none;}
#bottompanel li a{color:#e4e4e4; text-decoration:none;}
#bottompanel li a:hover{color:#FFF; text-decoration:none;}
#bottompanel h1{color:#FFF;}
#bottompanel h2{color:#000;}
.recentwork{width:668px; float:left;}
.screenshot{ background:url(../images/screenshot.gif) no-repeat left; padding:0px 0px 0px 20px;}
.visit{ background:url(../images/visit.gif) no-repeat left; padding:0px 0px 0px 15px;}
.leftone{width:522px; float:left; margin:0px 10px 0px 0px; position:relative;}
.leftone .panel { width:520px; min-height:250px; background: #777 url(../images/work-big-bg.gif) no-repeat top; overflow: hidden;}
.workImage{
	padding:6px 0 0 6px;
	width: 506px;
	margin:0 0 5px 0;
}
.workInfo {
	position: absolute;
	width: 520px;
	top: 129px;
	left: 3px;
}
.rightone{width:132px; float:right; margin:0px; padding:0;}
.rightone ul {width: 122px; list-style-type:none; margin:0; padding:0; }
.rightone ul li { width:122px; height:62px; margin:0; padding:0; background:url(../images/work-thumb-bg.gif) }
.rightone ul li a { outline: none; margin:0; padding:0; }
.rightone ul li:hover, ul.rightone li.selected { background-position: 0 -62px; }
.rightone ul li#last-child { margin-right: 0; }
.rightone ul li img { margin: 6px; }
.services{width:220px; float:left;}
.services ul{margin:0px; padding:0px; list-style-type:none;width:220px;}
.services li{margin:5px 0 5px 0; background:url(../images/listbg.gif) no-repeat left center; padding:0px 0px 8px 25px; height:24px width:220px;}

/*------------FOOTER PANEL------------*/
#footercontainer{width:100%; background:#202020;}
#footer{width:950px; margin:0px auto; padding:20px 0px; color:#666; position:relative;}
#footer ul{list-style-type:none; margin:6px 0px; padding:0px; height:20px;}
#footer ul li{float:left; display:inline; padding:0px; margin:0px;}
#footer .divider1{padding:0px 10px;}
#footer a{color:#888; text-decoration:none;}
#footer a:hover{color:#888; text-decoration:underline;}

/*------------PORTFOLOIO SECTION------------*/
.portfolio{width:215px; margin:0 12px 25px 0; float:left; min-height:230px;}
.portfolio img{ border:4px solid #e6e6e6; margin:0 0 10px 0;}
.portfolio a{color:#000000; text-decoration:underline;}     ///#000000;
.portfolio a:hover{color:#000000; text-decoration:none;}
.screenshot1{ background:url(../images/screenshot1.gif) no-repeat left; padding:0px 0px 0px 22px;}
.visit1{ background:url(../images/visit1.gif) no-repeat left; padding:0px 0px 0px 22px;}
.paging{margin:10px; color:#F00;}
.paging a{background:url(../images/pageno_link.gif) no-repeat; color:#000; font-size:10px; font-weight:bold; width:16px; text-align:center; padding:0 5px 4px 5px; margin:0 4px; text-decoration:none;}
.paging a:hover{background:url(../images/pageno_active.gif) no-repeat; color:#FFF; font-size:10px; font-weight:bold; width:16px; text-align:center; padding:0 5px 4px 5px; margin:0 4px; text-decoration:none;}
.paging .active{background:url(../images/pageno_active.gif) no-repeat; color:#FFF; font-size:10px; font-weight:bold; width:16px; text-align:center; padding:0 5px 4px 5px; margin:0 4px; text-decoration:none;}

/*Testimonial*/
.testimonial{ border-bottom:1px solid #eee; margin-bottom:10px; padding-top:10px;}

/*------------OTHER SYTELS------------*/
.clear{clear:both;}
.readmore{background:url(../images/arrow.gif) no-repeat left center; padding-left:21px; color:#202020; text-decoration:none; text-transform:uppercase; font-size:11px; font-weight:bold;}
.readmore:hover{background:url(../images/arrow.gif) no-repeat left center; padding-left:21px; color:#000000; text-decoration:none; text-transform:uppercase; font-size:11px; font-weight:bold;}
.bluelink{color:#000000; text-decoration:underline; font-weight:bold;}
.bluelink:hover{color:#000000; text-decoration:none; font-weight:bold;}
.leftsec{width:45%;float:left;margin:0 20px 0 0;}
.rightsec{width:45%;float:right;margin:0;}
/*------------for recent slider----------------*/
#content { width: 668px; float: left; }
#slider { width: 522px; position: relative;float:left; margin:0px 10px 0px 0px; }
div.panel { width: 522px; height: 250px; background: #777 url(../images/work-big-bg.gif) no-repeat; overflow: hidden; }
.scroll { width: 522px; height: 250px; overflow: auto; overflow-x: hidden; position: relative; clear: left; background: transparent; }
ul.navigation{width:132px; float:right; margin:0px; padding:0;}
ul.navigation { width: 122px; list-style-type:none;}
ul.navigation li { float: right; width: 122px; height: 62px; margin: 0; background:url(../images/work-thumb-bg.gif) no-repeat; }
ul.navigation li a { outline: none; margin:0; padding:0; }
ul.navigation li:hover, ul.navigation li.selected { background-position: 0 -62px;  }
ul.navigation li#last-child { margin-right: 0; }
ul.navigation li img { margin:5px;}
div.workImage{ padding:6px 0 0 6px; width: 506px; margin:0 0 5px 0; }
div.workInfo { position: absolute; width: 520px; top: 129px; left: 3px; }

p.tools a { font-size: .95em; color: #cbffa2; padding: 3px 0 3px 20px; margin-right: 15px; padding-left: 15px; }
p.tools a:hover { color: #FFF; }
p.tools a.zoom { background: url(../img/icon-zoom.html) no-repeat 0 .4em; }
p.tools a.visit { background: url(../img/icon-external.html) no-repeat 0 .3em; }
/*-------------------------------------------------
=EXTRAS
-------------------------------------------------*/
/* =CLEARFIX (do not modify) */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
/* Hides from IE-mac-\*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac9(c)dross */
/*sitemap*/
.arrowlist ul {
	list-style-type: none;
	margin: 15px 0 0 15px;
	padding: 5px;
}
.arrowlist ul li {
	margin: 0 0 10px 0;
	padding:0 0 0 20px;
	background: #fff url(../images/arrow_v.gif) top left no-repeat;
}
.arrowlist ul li a {
	color:#666;
	text-decoration:none;
}
.arrowlist ul li a:hover {
	color:#777;
	text-decoration:none;
	font-weight:bold;
	}