/*------------------
    xHTMLBox v1.0
------------------*/

* {
    margin: 0;
    padding: 0;
    outline: 0;
    list-style: none;
}
img, fieldset {
    border: 0;
}
body {
    font-family: "Lucida Grande", "Lucida Sans", Arial, Helvetica, sans-serif;
    background: #f0f0f0;
}
.clear {
    clear: both;
}
#wrapper, #page-wrapper, #footer-wrapper {
    position: relative;
    width: 100%;
}
#wrapper {
    background: url(../images/top-bg.png) repeat-x top left;
}
#page-wrapper {
    background: url(../images/page-top-bg.png) repeat-x top left;
}
#footer-wrapper {
    position: relative;
    height: 72px;
    background: transparent url(../images/footer-bg.png) repeat-x top left;
}
#top, #content, #page, #footer {
    position: relative;
    width: 960px;
    padding: 0 20px;
    margin: 0 auto;
}
#header {
    position: relative;
    float: left;
}
#fake-logo {
    width: 566px;
    height: 177px;
    float: left;
}
#header img.logo {
    float: left;
}
#page img.logo {
    position: absolute;
    top: -150px;
    left: 20px;
}
#top-nav {
    width: 394px;
    float: left;
}
#top-nav ul {
    float: right;
    font-size: .7em;
}
#top-nav ul li {
    float: left;
    margin-top: 77px;
}
#top-nav ul a {
    display: block;
    width: 65px;
    height: 20px;
    padding: 3px 2px;
    padding-top: 6px;
    border: solid 1px #CCCCCC;
    border-bottom: none;
    background: #222222 url(../images/top-nav-bg.png) repeat-x top left;
    color: #f0f0f0;
    margin-left: 3px;
    text-align: center;
    text-decoration: none;
}
#top-nav ul a:hover {
    background: url(../images/top-nav-hover.png) repeat-x top left;
    color: #222222;
}
#header span.head-text {
	display: block;
	width: 362px;
	height: 20px;
	font: bold .9em "Lucida Grande", "Lucida Sans", Tahoma, Verdana, Arial, sans-serif;
    position: absolute !important;
	position: relative;
	margin-top: 0 !important;
	margin-top: 50px;
    bottom: 35px;
    right: 0;
	z-index: 99;
}
#subheader {
    float: left;
}
.subheader-left {
    width: 434px;
    float: left;
}
#subheader img {
    float: right;
    margin-top: 0;
}
#subheader h1 {
    display: block;
    width: 434px;
    margin: 10px 0;
    font-size: 1.6em;
    font-weight: normal;
    color: #ffffff;
}
#subheader p {
    display: block;
    width: 361px;
    padding: 0 70px 0 3px;
    color: #222222;
    font-weight: normal;
    font-size: 1.1em;
    line-height: 1.3em;
}
#content {
    border-top: solid 1px #ffffff;
    background: url(../images/content-bg.png) repeat-y top;
	margin-top: 0 !important;
	margin-top: -18px;
	position: relative;
}
#page {
    border-top: solid 1px #ffffff;
    background: url(../images/content-bg.png) repeat-y top;
    margin-top: -25px;
}
#content-shadow {
    display: block;
    width: 960px;
    height: 15px;
    background: url(../images/content-top-shadow.png) no-repeat top;
    margin-bottom: -15px;
}
#tab-controller {
    float: left;
    margin-left: 15px;
	margin-top: 0 !important;
	margin-top: -25px;
}
#tab-controller ul {
    display: block;
    height: 45px;
    float: left;
	padding: 0;
    background: url(../images/tab-ctr-bg.png) repeat-x bottom left;
}
#tab-controller ul li {
    float: left;
    padding-top: 5px;
}
#tab-controller ul li.tab-ctr-left {
    background: url(../images/tab-ctr-left.png) no-repeat top left;
    padding-left: 15px;
    height: 45px;
    margin-right: 15px;
    margin-left: -15px;
}
#tab-controller ul li.tab-ctr-right {
    background: url(../images/tab-ctr-right.png) no-repeat top right;
    padding-right: 12px;
    height: 45px;
    margin-left: 15px;
    margin-right: -12px;
}
#tab-controller ul li.tab-ctr-link a {
    display: block;
    width: 25px;
    height: 20px;
    padding-top: 5px;
    margin: 0 2px;
    background: url(../images/icon-tab-page.png) no-repeat center;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    color: #000;
}
#tab-controller ul li.tab-ctr-link a:hover {
    background: url(../images/icon-tab-hover.png) no-repeat;
    color: #ffffff;
}
#main-content, #page-content {
    position: relative;
    width: 960px;
    float: left;
}
#page-content img.big-logo {
    position: absolute;
    bottom: 0;
    right: 275px;
}
#page-content {
    padding-top: 0 !important;
	padding-top: 10px
}
#main-content-left {
    position: relative;
    width: 600px;
    float: left;
    padding-top: 45px;
    padding-right: 105px !important;
	padding-right: 100px;
}
#page #main-content-left {
    position: relative;
    width: 600px;
    float: left;
    padding-top: 10px;
    padding-right: 105px !important;
	padding-right: 100px;
}
span.editText {
	padding-right: 30px;
	background: url(../images/profile-edit.png) no-repeat top right;
}
#main-content-right {
    position: relative;
    width: 255px;
    float: right;
}
#main-content .just-outline, #page-content .just-outline {
    display: none;
}
#main-content h3, #page-content h3 {
    color: #83C800;
    font-weight: normal;
}
#main-content p, #page-content p {
    font-size: .8em;
    line-height: 1.3em;
}
#page-content p {
    line-height: 1.4em !important;
}
#main-content-left h3 {
    display: block;
    width: 100%;
    margin-bottom: 15px;
}
#client-info {
    position: relative;
    padding: 5px 10px;
    background: #f0f0f0;
    border: solid 1px #CCCCCC;
    font-size: .8em;
    margin: 20px 0;
}
#content form, #page form {
    padding: 25px 0 100px 0;
}
#content form label, #page form label {
    display: block;
    width: 100%;
    margin-bottom: 5px;
    font-size: .9em;
}
#content form input[type="text"], #page form input[type="text"]{
    display: block;
    width: 203px;
    height: 24px;
    border: solid 1px #CCCCCC;
    background: #f0f0f0;
    padding: 5px;
    padding-top: 4px;
    font-size: 1.3em;
    letter-spacing: 1px;
}
#content form small, #page form small {
    width: 250px;
    font-size: .7em;
    margin: -15px 0 20px 0;
    color: #83C800;
}
#content form small.simple-uploader, #page form small.simple-uploader {
    width: 450px !important;
    background: #E2FFA6;
    border: solid 1px #3D8D1A;
    padding: 5px;
    color: #000 !important;
    margin: 15px 0 20px 0 !important;
}
#content form select, #page form select {
    margin-bottom: 20px;
}
#content form sup, #page form sup {
    color: #83C800;
}
#content form input.upload, #page form input.upload{
    display: block;
    width: 330px;
    height: 40px;
    font-size: 1.2em;
    letter-spacing: 1px;
}
#content form textarea, #page form textarea {
    display: block;
    width: 375px;
    height: 124px;
    border: solid 1px #CCCCCC;
    background: #f0f0f0;
    padding: 5px;
    padding-top: 4px;
    font: normal 1.3em "Lucida Grande", "Lucida Sans", Arial, Verdana, Helvetica, sans-serif;
    letter-spacing: 1px;
}
#content form input.btn-order, #page form input.btn-order {
    display: block;
    width: 120px;
    height: 41px;
    background: url(../images/btn-order.png) no-repeat;
    border: none;
}
#page form input.btn-send, #page form input.btn-signup, #page form input.btn-save {
    display: block;
    width: 120px;
    height: 41px;
    background: url(../images/btn-send.png) no-repeat;
    border: none;
}
#page form input.btn-save {
    background: url(../images/btn-save.png) no-repeat;
}
#page form input.btn-signup {
    background: url(../images/btn-signup.png) no-repeat;
}
#main-content-left table {
    padding-top: 6px;
    background: url(../images/table-top.png) no-repeat top center;
}
#main-content-left table thead.tb-black tr {
    height: 33px;
    background: url(../images/table-head-bg.png) repeat-x top left;
    color: #ffffff;
    font-size: .8em;
}
#form-error, #form-success {
    width: 300px;
    padding: 10px;
    padding-left: 40px;
    background: #f0f0f0 url(../images/icon-error.png) no-repeat 5px 5px;
    border: solid 1px #ff0000;
    font-size: .8em;
}
#form-success {
    background: #f0f0f0 url(../images/icon-info.png) no-repeat 1% 50%;
    border: solid 1px #537EFF;
    font-size: .8em;
}
#form-error ul {
    padding-left: 10px;
    margin-top: -10px;
}
#form-error ul li {
    list-style-type: square;
    font-size: .8em;
}
#client-table {
    margin-bottom:0;
}
thead.tb-black, tbody.tb-black {
    width: 600px;
}
thead.tb-black tr td {
    width: 31px;
    border-right: solid 1px #666666;
    text-align: center;
}
thead.tb-black tr td+td {
    width: 126px;
    border-right: solid 1px #666666;
}
thead.tb-black tr td+td+td {
    width: 76px;
    border-right: solid 1px #666666;
}
thead.tb-black tr td+td+td+td {
    width: 76px;
    border-right: solid 1px #666666;
}
thead.tb-black tr td+td+td+td+td {
    position: relative;
    width: 125px;
    border-right: solid 1px #666666;
}
thead.tb-black tr td+td+td+td+td+td {
    width: 161px;
    border: none;
}
tbody.tb-black tr td {
    width: 31px;
    border: solid 1px #666666;
    text-align: center;
    border-top: none;
    border-right: none;
}
tbody.tb-black tr td.no-project {
    border: solid 1px #666666;
    text-align: center;
    border-top: none;
    padding: 10px 0;
}
tbody.tb-black tr td+td {
    width: 122px;
    padding: 5px 2px;
    text-align: center;
}
tbody.tb-black tr td+td+td {
    width: 76px;
    text-align: center;
}
tbody.tb-black tr td+td+td+td {
    width: 76px;
    text-align: center;
}
tbody.tb-black tr td+td+td+td+td {
    position: relative;
    width: 121px;
    padding: 5px 2px;
    text-align: center;
}
tbody.tb-black tr td+td+td+td+td+td {
    width: 159px;
    border: solid 1px #666666 !important;
    border-top: none !important;
    text-align: center;
}
tbody.tb-black {
    font-size: .8em;
}
tbody.tb-black tr.even td {
    background: #f0f0f0;
}
tbody span.progress-bar, tbody span.progress-text {
    float: left;
}
tbody span.progress-bar {
    display: block;
    height: 13px;
    padding: 3px 0;
    background: url(../images/progress-bar-green.png) no-repeat;
    text-align: center;
    font-size: .7em;
    color: #ffffff;
}
tbody span.progress-text {
    font-size: .6em;
    margin-left: 2px;
}
tbody span.cancelled-bar {
    display: block;
    height: 15px;
    padding: 2px 0;
    background: url(../images/progress-bar-red.png) no-repeat;
    text-align: center;
    color: #ffffff;
}
tbody span.cancelled {
    color: #ff0000;
}
#portfolio-box {
	position: relative;
	width: 530px;
	float: left;
	padding: 10px 0;
	margin-bottom: 300px;
}
#portfolio-box img {
	background: #ffffff;
	padding: 5px;
	border: solid 1px #cccccc;
	margin-right: 15px;
	margin-bottom: 30px;
	float: left
}
#addtestimonial{
    margin-top: -40px;
}
p.comment-head {
    display: block;
    width: 375px;
    margin-bottom: -15px;
}
.project-comments {
    width: 365px;
    padding: 5px;
    background: #83C800;
    color: #ffffff;
    float: left;
}
.project-comments p {
    display: block;
    width: 300px;
    float: left;
}
.project-comments form {
    display: block;
    width: 65px;
    padding: 0 !important;
    float: left;
    text-align: center;
}
.project-comments form input.btn-delete{
    display: block;
    width: 55px;
    height: 24px;
    padding-bottom: 3px;
    border: solid 1px transparent;
    background: #83C800;
    font-size: .6em;
    color: #f0f0f0;
    outline: none;
    cursor: url(../images/cursor.png),default;
}
.project-comments form input.btn-delete:hover{
    background: url(../images/btn-delete-bg.png) repeat-x top left;
    border: solid 1px #3D8D1A;
    color: #000;
}
.project-comments form fieldset {
    border: none;
}
.project-comments-text {
    width: 350px;
    margin-bottom: 4px;
    padding: 5px;
    padding-left: 20px;
    border-top: dotted 1px #666666;
    background: #E2FFA6 !important;
    color: #000 !important;
    overflow: hidden;
}
#table-page, #table-cancel {
    width: 580px;
    padding: 10px;
    text-align: right;
    font-size: .8em;
    margin-bottom: 375px;
}
#table-cancel {
    margin-bottom: 50px !important;
}
#comments-page {
    width: 355px;
    padding: 10px;
    text-align: right;
    font-size: .8em;
    margin-bottom: 10px;
}
#table-cancel img {
    margin: 0 5px;
    margin-bottom: -3px;
}
#main-content-right div.right-header {
    width: 243px;
    height: 41px;
    padding-right: 12px;
    background: url(../images/black-tab-right.png) no-repeat top right;
}
#main-content-right div.right-box {
    padding-bottom: 75px;
}
#main-content-right h3 {
    display: block;
    width: 218px;
    height: 32px;
    padding: 9px 5px 0 20px;
    background: url(../images/black-tab-bg.png) repeat-x top left;
    color: #ffffff;
	margin-left: 0 !important;
	margin-left: 3px;
}
#main-content-right div.right-portfolio {
	width: 235px;
	padding: 10px;
}
#main-content-right div.right-portfolio img {
	padding: 5px;
	border: solid 1px #cccccc;
	background: #ffffff;
}
#main-content-right div.right-portfolio a, #main-content-right div.right-portfolio a:visited {
	display: block;
	width: 235px;
	text-align: right;
	font-size: .8em;
	color: #83C800;
	text-decoration: none;
	margin-top: 5px;
}
#main-content-right div.right-portfolio a:hover {
	text-decoration: underline
}
#main-content-right ul {
    display: block;
    width: 255px;
    padding: 20px 0;
}
#main-content-right ul li {
    display: block;
    width: 210px;
    height: 21px;
    margin-left: 20px;
    padding-top: 3px;
    padding-left: 25px;
    margin-bottom: 5px;
    background: url(../images/icon-checklist.png) no-repeat top left;
    font-size: .9em;
}
#main-content-right ul#logged li {
    width: 207px;
    padding-left: 28px;
}
#main-content-right ul#logged li#logout {
    background: url(../images/icon-logout.png) no-repeat top left;
}
#main-content-right ul#logged li#project-manager {
    background: url(../images/icon-project.png) no-repeat top left;
}
#main-content-right ul#logged li#account-manager {
    background: url(../images/icon-accounts.png) no-repeat top left;
}
#main-content-right ul#logged a {
    text-decoration: none;
    color: #83C800;
}
#main-content-right ul#logged a:hover {
    text-decoration: underline;
}
#main-content-right form {
    position: relative;
    display: block;
    width: 235px;
    padding: 15px 20px;
    padding-right: 0;
}
#main-content-right form label {
    display: block;
    width: 100%;
    font-size: 1.0em;
}
#main-content-left form input.login, #main-content-right form input.login{
    display: block;
    width: 215px;
    height: 25px;
    padding: 5px;
    padding-top: 2px;
    border: solid 1px #CCCCCC;
    background: #ffffff;
    font-size: 1.2em;
    margin-bottom: 15px;
}
#main-content-left form input.login {
    background: #f0f0f0 !important;
}
form input.btn-login {
    display: block;
    width: 96px;
    height: 37px;
    background: url(../images/btn-login.png);
    border: none;
	margin-top: 0 !important;
	margin-top: 10px;
}
#main-content-right form span {
    display: block;
    width: 235px;
    padding: 10px 0;
    font-size: .8em;
}
#main-content-left a, #main-content-right form span a, div.contact-box a {
    color: #83C800;
    text-decoration: none;
}
#main-content-left a:hover, #main-content-right form span a:hover, div.contact-box a:hover {
    text-decoration: underline;
}
div.contact-box {
    width: 166px;
    height: 126px;
    background: url(../images/contact-box.png) no-repeat;
    padding: 10px 20px;
    padding-left: 50px;
    margin-left: 20px;
}
#footer {
    padding: 20px 0;
}
#footer p {
    color: #CCCCCC;
    font-size: .8em;
}

/* Slider Styles */

div.order-box, div.page-order-box {
    width: 200px;
    padding: 10px;
    position: absolute;
    top: 400px;
    right: 50px;
    background: #f0f0f0;
    border: solid 1px #CCCCCC;
    color:#000;
    font-size:.9em;
}
div.page-order-box {
    top: 360px;
}
div.order-box div p, div.page-order-box div p {
    display: block;
    width: 200px;
    margin-top: -20px;
}
div.order-box div p.order-total, div.page-order-box div p.order-total {
    margin-top: 5px;
    color: #83C800;
}
div.order-box div img, div.page-order-box div img {
    position: relative;
    top: 15px;
    left: -20px;
}
#base-price {
    display: none;
}
div.slider-output {
    float: left;
    width: 75px;
    padding: 5px;
    background: #f0f0f0;
    border: solid 1px #CCCCCC;
    margin-bottom: 25px;
    text-align: center;
    font-size:.9em;;
    font-weight: bold;
    color:#83C800;
}
.slider {
    float:left;
    background:url('../images/table-top.png') 0 40% no-repeat;
    width:400px;
    height:32px;
    margin:0 5px 0 0;
    padding:0;
}
.sub {
    float:left;
    background:url('../images/icon-min.png') 100% 50% no-repeat;
    width:25px;
    height:25px;
    cursor:pointer;
}
.add {
    float:right;
    background:url('../images/icon-plus.png') 0 50% no-repeat;
    width:25px;
    height:25px;
    cursor:pointer;
}
.ui-slider {
    float:left;
    position:relative;
    top:-32px;
    left:30px;
    width:325px;
}
.ui-slider-handle {
    background:url('../images/icon-slider.png') 0 50% no-repeat;
    border:0!important;
    width:25px;
    height:25px;
    position:absolute;
    z-index:500;
    cursor:pointer;
}

/* SWF Upload */
#swfupload-control p{
    margin:10px 5px;
    font-size:0.9em;
}
#log{
    margin:0;
    padding:0;
    width:500px;
}
#log li{
    list-style-position:inside;
    margin:2px;
    border:1px solid #ccc;
    padding:10px;
    font-size:12px; 
    font-family:Arial, Helvetica, sans-serif;
    color:#333;
    background:#fff;
    position:relative;
}
#log li .progressbar{
    border:1px solid #333;
    height:5px;
    background:#fff;
}
#log li .progress{
    background:#999;
    width:0%;
    height:5px;
}
#log li p{
    margin:0;
    line-height:18px;
}
#log li.success{
    border:1px solid #339933;
    background:#ccf9b9;
}
#log li span.cancel{
    position:absolute;
    top:5px;
    right:5px;
    width:20px;
    height:20px; 
    background:url('../swfupload/cancel.png') no-repeat;
    cursor:pointer;
}
ol#log li {
    background: none;
    border: none;
}

.sliderwrapper{
    position: relative; /*leave as is*/
    overflow: hidden; /*leave as is*/
    width: 960px; /*width of featured content slider*/
    height: 240px;
}



.sliderwrapper .contentdiv{
    visibility: hidden; /*leave as is*/
    position: absolute; /*leave as is*/
    left: 0;  /*leave as is*/
    top: 0;  /*leave as is*/
    padding: 0;
    width: 960px;
    opacity: 1;
}

.pagination{
    width: 260px;
    height: 35px;
    text-align: right;
    background: url(../images/tab-controller-bg.png) no-repeat center;
    padding: 5px 0;
    position: absolute;
	top: 0;
	left: 15px;
}

.pagination a{
    display: block;
    width: 25px;
    height: 20px;
    padding-top: 5px;
    margin: 0 3px;
    background: url(../images/icon-tab-page.png) no-repeat center;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    color: #000;
    float: left;
}    
.pagination a.prev, .pagination a.prev:hover{
    background: url(../images/icon-tab-prev.png) no-repeat center !important;
    margin-right: 15px;
    margin-left: 28px !important;
	margin-left: 14px;
}
.pagination a.next, .pagination a.next:hover{
    background: url(../images/icon-tab-next.png) no-repeat center !important;
    margin-left: 15px;
}
.pagination a:hover, .pagination a.selected{
    background: url(../images/icon-tab-hover.png) no-repeat center;
    color: #ffffff;
}