/*----------------------------------------------------
                 Innobox - CSS File
------------------------------------------------------*/


/* Global
------------------------------------------------------*/
html,body{height:100%}
body{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:13px;
margin:0 auto;
padding:0;
background-color:#323231;
color:#4f4f4f;
height:100%;
}
*{
margin:0;
padding:0;
}
*:focus{
outline:none; /* removes ugly dotted border but may make template more unsuable, up to you
				 if you want to keep it! */
}
.clr{clear:both}
form{margin:0; padding:0;}
hr{
border:0;
color:#dedede;
background-color: #dedede;
height: 1px;
margin:10px 0px 6px 0px;
padding:0px;
}


/* Default Element Styles
------------------------------------------------------*/
/* heading */
h1, h2, h3, h4, h5{font-family:Arial, Helvetica, sans-serif; font-weight:normal; color:#878686;}
h1{font-size:32px; line-height:30px; margin-bottom:15px;}
h2{font-size:22px; line-height:28px; margin-bottom:8px;}
h3{font-size:18px; line-height:20px; margin-bottom:8px;}
h4{font-size:16px; line-height:18px; margin-bottom:8px; font-weight:bold;}
h5{font-size:14px; margin:3px 0px; padding:0px; letter-spacing:1px;}

/* links */
a{color:#00a491; text-decoration:none;}
a:visited{color:#00a491; text-decoration:none;}
a:hover{color:#85cbab;}
a img{border:none}
.imgleft{float:left; margin-top:4px; padding-right:12px;}
.imgright{float:right; margin-top:4px; padding-left:12px;}
.imgborder{float:left; border:1px solid #d7d7d7; padding:2px;}

/* lists, blockquotes and paragraphs */
p, ul, ol, blockquote{
font-size:11px;
line-height:20px;
margin-bottom:14px;
color:#4f4f4f;
}
ul, ol{
margin:10px 0 35px 40px;
}
li ol, li ul{
font-size:1.0em;
list-style:square;
margin-bottom:0;
margin-top:0;
}
li ol{list-style:decimal;}
blockquote{
font-style:italic;
margin:0px;
color:#4f4f4f;
padding:0px 4px 2px 38px;
background-image:url(../images/quote.gif);
background-position:0px 5px;
background-repeat:no-repeat;
float:left;
}

/* code */
code{
font-family:Tahoma, Arial, Verdana;
letter-spacing:1px;
margin:25px 0 25px 0px;
display:block;
font-size:0.9em;
border-left:4px solid #dddddd;
padding:15px 10px;
}


/* Container
------------------------------------------------------*/
#outer-container{background-image:url(../images/bg-top-repeat.gif); background-repeat:repeat-x; background-position:top;}
#inner-container{width:960px; margin:0px auto; padding-top:3px;}


/* Header
------------------------------------------------------*/
#header{background-image:url(../images/bg-header.jpg); background-repeat:no-repeat; width:960px; height:296px; float:left;}
#header-inner{background-image:url(../images/bg-header.jpg); background-repeat:no-repeat; width:960px; height:277px; float:left;}
#left-header{width:252px; float:left;}
#logo{width:252px; text-align:center; padding:30px 0px 30px 0px; border-bottom:1px solid #3f3f3e;}
#right-header{width:708px; float:left;}

/* Twitter */
#twitter{width:252px; margin-top:5px; float:left;}
.twitter-icon{width:40px; margin-top:5px; float:left;}
.twitter-code{width:202px; margin-left:10px; line-height:18px; color:#fff; font-style:italic; float:left;}

/* RSS */
#rss{width:708px; height:16px; padding:8px 0px; float:left;}
.rss-text{float:right; margin-right:5px;}
.rss-text a, .rss-text a:visited{color:#fff;}
.rss-icon{float:right;}

/* Top Navigation bar menu styling */
#nav{
float:left;
list-style-type: none;
margin:18px 0px;
}
#nav li{
float:left;
}
#nav li a:link, #nav li a:visited{
display:block;
width:252px;
text-decoration: none;
outline: none;
text-align:left;
font-size: 30px;
color:#fff;
}
#nav li a:hover{
padding-left:10px;
}


/*  Page Title and Description
------------------------------------------------------*/
#page-title{
width:708px;
height:245px; 
margin:0px;
float:left;
}
.page-title-content{
width:342px;
margin-top:65px;
float:right;
}
.page-title-content h1{
color:#fff;
margin-bottom:25px;
}
.page-title-content p{
font-size:12px;
color:#fff;
}
.title-img{margin:50px 0px 0px 110px; float:left;}



/*  Homepage Slider
------------------------------------------------------*/
#slideshow-container{
width:708px;
height:264px; 
margin:0px;
float:left;
}


/* Content
------------------------------------------------------*/
.content{width:960px; background:url(../images/bg-content-top.jpg) no-repeat top; background-color:#FFFFFF; float:left;}
.content-bottom{width:960px; height:11px; background:url(../images/bg-content-bottom.gif) no-repeat bottom; float:left;}
#content-left{
	width:600px;
	float:left;
	margin-top: 0px;
	margin-right: 40px;
	margin-bottom: 0px;
	margin-left: 30px;
}
#sidebox{
	width:250px;
	float:left;
	margin-top: 0px;
	margin-right: 30px;
	margin-bottom: 0px;
	margin-left: 0px;
}
.maincontent{margin:20px 0px 30px 0px;}
.maincontent-inner{
	float:left;
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.maincontent h2, .maincontent-inner h2{color:#323231; padding-bottom:10px;}

/* main-front */
.box-main{width:259px; float:left; padding-top:10px;}
.spacer{width:30px; float:left; display:block; height:100%;}
.icon{width:77px; height:92px; float:left;}

ul.content-list {margin:0px; padding:0px; list-style-type:none;}
ul.content-list li {background-image:url(../images/arrow.gif); background-position:0px 5px; background-repeat:no-repeat; padding:0px 0px 12px 17px; line-height:18px;}
ul.content-list li a {color:#4f4f4f; text-decoration:none;}
ul.content-list li a:hover {text-decoration:underline;}

ul.check-list {margin:0px; padding:0px; list-style-type:none;}
ul.check-list li {background-image:url(../images/check-list.jpg); background-position:0px 3px; background-repeat:no-repeat; padding:0px 0px 12px 44px; line-height:18px;}
ul.check-list li a {color:#4f4f4f; text-decoration:none;}
ul.check-list li a:hover {text-decoration:underline;}

ul.client{list-style-type:none; margin:0px; padding:0px;}
ul.client li{background-image:none; padding:0px 21px 15px 0px; border-bottom:none; display:inline; float:left;}
ul.client li.last{background-image:none; padding:0px 0px 15px 0px; border-bottom:none; display:inline; float:left;}

/* Services page */
.img-services{width:81px; height:90px; margin-top:7px; float:left;}
#quote-container{width:400px; height:300px; padding:10px; background-color:#FFFFFF;}

/* Bottom content */
#bottom-content{border-top:1px solid #a5a5a5; width:850px; float:left;}
#bottom-icon{width:37px; padding:0px 10px 0px 0px; margin-top:0px; float:left;}
#newsflash{width:762px; height:38px; line-height:20px; float:left;}


/* Portfolio
------------------------------------------------------*/
.pf-content{margin:5px 0px; float:left;}
.pf-img{border:1px solid #d7d7d7; margin:6px 15px 0px 0px; padding:2px; float:left;}
.pf-content h4 a, .pf-content h4 a:visited{color:#878686;}
ul.content-list-portfolio {margin:0px; padding:0px; list-style-type:none; float:left;}
ul.content-list-portfolio li {background-image:url(../images/arrow.gif); background-position:0px 5px; background-repeat:no-repeat; padding:0px 0px 12px 17px; line-height:16px;}
ul.content-list-portfolio li a {color:#323231; text-decoration:underline;}
ul.content-list-portfolio li a:hover {text-decoration:underline;}

#project-desc{
	width:600px;
	margin-top:0px;
	margin-left:30px;
	float:left;
}
#project-thumb{width:116px; margin-top:10px; border-right:1px solid #d7d7d7; float:left;}
#detail-img{width:548px; height:256px; float:left;}
#detail-nav{list-style-type:none; margin:0px 30px 0px 0px; float:left;}
#detail-nav li img {margin-bottom:10px; float:left;}
#detail-nav li.last img {margin-bottom:0px; float:left;}
#detail-nav li a{cursor:pointer; float:left;}


/* Blog
------------------------------------------------------*/
.blog-post h2 {width:508px; color:#2f87aa; padding-bottom:0px; float:left;}
.blog-post p {float:left;}
.blog-post {padding-bottom:18px; margin-bottom:15px; border-bottom:1px solid #d7d7d7; float:left;}
.blog-posted{width:508px; margin-bottom:40px; height:20px; float:left;}
.blog-posted-inner h2{width:508px; color:#2f87aa; padding-bottom:0px; float:left;}
.posted-detail{width:508px; padding-bottom:11px; float:left;}
.date{font-size:22px; color:#878686; line-height:10px; text-align:center; float:right;}
.read-more{float:left; margin-bottom:10px;}
.author{background-color:#f1f1f1; color:#737373; padding:10px; line-height:16px; float:left;}
.author h5{margin-bottom:7px;}
.line{width:548px; height:1px; margin:20px 0px 13px 0px; border-top:1px solid #ccc; float:left;}

ul#sponsors {margin:0px; padding:0px; list-style-type:none;}
ul#sponsors li {padding:0px 5px;}

.commonPageListControlBar{
height: 30px;
margin-top:6px;
text-align: left;
}
.commonPageListBtn{
border: 1px solid #d7d7d7;
background-color:transparent;
font: normal 11px/28px Verdana; 
padding: 5px 4px;
cursor: pointer;
}
.commonPageListControlBar a, .commonPageListControlBar a:visited{color:#414141;}
.commonPageListBtn:hover{
text-decoration: underline;
}
.commonPageListBtnSelected{
border: 1px solid #d7d7d7;
background-color: #d7d7d7;
font: normal 11px/28px Verdana; 
padding: 5px 4px;
cursor:default;
}
#comment{margin-bottom:15px; float:left;}
#comment-form{float:left;}
.comment-post{margin-top:20px; border-bottom:1px solid #d7d7d7; float:left;}
.avatar{width:34px; margin-right:20px; float:left;}
.comment-date{font-style:italic; float:left;}
.comment-text{width:494px; float:left;}
.comment-text p{width:494px; margin-top:10px; float:left;}

#commentFormArea {width:500px; margin-top:15px; color:#6b6b6b; float:left;}
.label-comment {width:100px; margin:6px 0px 0px 10px; float:left;}
.input-comment {background-color: #ffffff; border:1px solid #d7d7d7; width:270px; padding:5px 5px 5px 5px; margin:0px 0px 13px 0px; color:#6b6b6b; float:left;}
.input-submit-comment { background-image:url(../images/but-send.jpg); background-repeat:no-repeat; padding:0px; margin:0px; border:0px; width:93px; height:28px; cursor:pointer; float:left; clear:both;}
.textarea-comment {background-color: #ffffff; border:1px solid #d7d7d7; width:515px; padding:5px 5px 5px 5px; margin:0px; color:#6b6b6b;}

/* Contact
------------------------------------------------------*/
form {margin:0; padding:0;}
#contactFormArea {
	width:480px;
	margin-top:0px;
	color:#6b6b6b;
	float:left;
}
.input {background-color: #ffffff; border:1px solid #d7d7d7; width:366px; padding:5px 5px 5px 5px; margin:0px; color:#6b6b6b;}
.input-submit {
	background-image:url(../images/but-send.jpg);
	background-repeat:no-repeat;
	padding:0px;
	border:0px;
	width:93px;
	height:28px;
	cursor:pointer;
	float:none;
	margin-right:15px;
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
.textarea {background-color: #ffffff; border:1px solid #d7d7d7; width:366px; padding:5px 5px 5px 5px; margin:0px; color:#6b6b6b;}


/* Footer
------------------------------------------------------*/
#footer{width:960px; height:65px; float:left;}
.footer-text{
	width:960px;
	font-size:11px;
	color:#fff;
	text-align:center;
	float:left;
	padding: 12px;
}
.footer-text a, #footer a:visited{color:#fff; text-decoration:none;}
.footer-text a:hover{text-decoration:underline;}