/* Resetting most of browser pre defined styles */
* { margin:0; padding:0; } 
option { padding-left: 0.4em }
html { height:100% }
body { min-height: 100%; font-size: 100.01%; position: relative; color: #000; background: #fff;text-align: left; } 
fieldset, img { border:0; }
select, input, textarea { font-size: 99% }
ul { padding: 0px; margin: 0px; list-style-type: none; list-style: none; }
a, a:hover, a:active, a:link, a:visited { color: #585858; }

/* Some helper classes */
br.cb { margin: 0px; padding: 0px; clear: both; }

body { min-width: 885px; margin-top: 22px; margin-left: 100px; line-height: 22px; font-family: Georgia; font-size: 11px; color: #787878; }
textarea { font-family: Georgia; font-size: 11px; height: 150px; }
p { margin: 0px; padding: 0px; line-height: 22px; }
input { font-family: Georgia; font-size: 11px; color: #585858; width: 90px; }
input.image { width: auto; }
#header { width: 885px; height: 37px; background: url(/_images/dotted_line.gif) no-repeat; }
#logo { float:left; }
#menu { float:left; width: 718px; padding-top: 4px; height: 22px; padding-right: 2px; text-align: right; }
#menu ul li { padding: 0px; margin: 0px; display: inline; padding-right: 2px; }
#menu ul li.active { font-weight: bold; }

#content { margin-top: 139px; width: 885px; }
#site-content { padding-top: 22px; min-height: 700px; }
#site-content.contact { background: url(/_images/sketch.jpg) no-repeat; min-height: 704px; padding-left: 375px; }
#contact-info { float: left; width: 209px; }
#links { float: left; margin-left: 91px; width: 210px;}
.important, .important-1 { color: black; line-height: 14px; }
.important { font-weight: bold; line-height: 14px; }
.heading { line-height: 14px; padding-bottom: 16px; }
.info { font-style: italic; } 
#clients { width: 134px; float: left; margin-right: 16px; }
/* If height (rename min-height) is set and overflow hidden together with white-space
 * the overlapping text will be hidden which looks better, but doesn't really comfort
 * usability at all. To be uncomment on deployment, or enabled for CMS-management view only.
 */
#clients #client-list li { /*min-height: 22px; overflow: hidden; white-space: nowrap; */ width:134px; }
#client-info { width: 134px; float: left; }
.intro { line-height: 14px; }
#project-visuals { float: left; margin-left: 55px; }
#project-visuals.cms { }
#project-visuals-switch-mode { margin-bottom: 5px; background:transparent url(/_images/dotted_line_1.gif) no-repeat scroll center bottom; width: 545px; }
#list-view { background: url(/_images/cms/visuals_list_view.png); height: 21px; width: 28px; display: block; float: left; }
#sort-view { background: url(/_images/cms/visuals_sort_view.png); height: 21px; width: 28px; display: block; float: left;}
#list-view:hover { background-position: 0pt -21px; }
#sort-view:hover { background-position: 0pt -21px; }
#sort-view.active { background-position: 0pt -42px; }
#list-view.active { background-position: 0pt -42px; }
#projects { min-height: 44px; }
#project-details p { line-height: 16px; padding-top: 3px; padding-bottom: 13px; }
#site-content.portfolio .heading, #clients ul li, #projects, #project-details #info { background: url(/_images/dotted_line_1.gif) no-repeat bottom; }

/* for Internet Explorer */
/*\*/
* html #site-content {
height: 704px;
}
/**/

.cms-active .action { padding-top: 6px; float:left; margin-right: 7px; }
.cms-active a, .cms-active a:hover, .cms-active a:active, .cms-active a:visited, .cms-active a:link { border: 0px; text-decoration: none; }
.cms-active a:hover input { border: 1px #585858 dotted; }
.cms-active li.active a, .cms-active li.active a:hover, .cms-active li.active a:active, .cms-active li.active a:visited, .cms-active li.active a:link { color: #000000; }
#clients #client-list li#add-client { background: none; }
#clients #client-list li#save { display: none; }

/* Hint cloud */
.cloud-bottom { 
    background: transparent url(/_images/cms/cloud_bottom.png) no-repeat scroll left top;
    height: 26px;
    overflow: hidden;
    width: 229px;
}
.cloud { 
    background:transparent url(/_images/cms/cloud.png) no-repeat scroll left top;
    min-height:5.6em;
    overflow:hidden;
    padding:1.4em 16px 0.4em 20px;
    width:193px;
    font-size: 11px;
    line-height: 13px;
    color: #999999;
    font-family: "Lucida Grande", Arial, Verdana;
}
#no-clients {
    position: absolute;
    top: 80px;
    left: -52px;
}
#no-projects {
    position: absolute;
    top: 67px;
    left: 100px;
}
#no-visuals {
    position: absolute;
    top: 67px;
    left: 410px;
}
#project-info-cloud {
    position: absolute;
    top: 180px;
    left: 105px;
}
#visuals-sort-cloud {
    position: absolute;
    top: 67px;
    left: 490px;
}
.cloud h3 { font-size: 15px; color: #ffffff; }
.spinner { padding-left: 35px; }
.new-link, .save-link { padding-left: 35px; padding-top: 1px; margin-right: 7px; }
#new-visual .save-link { padding-left: 0px; }
#add-visual.no-visuals .new-link, .save-link { padding-left: 0px; padding-top: 1px; margin-right: 7px; }

ul.sort-view { width: 544px; display: none; }
ul.sort-view li { float: left; margin-bottom: 10px; margin-right: 10px; /*height: 114px;*/ }
ul.sort-view li img { width: 171px; }
ul.sort-view li span.cms-active img { width: inherit; }
#visual-sort-msg { line-height: 16px; /*padding-left: 20px;*/ display:none; }
#visual-sort-msg .sort-msg, .error { background-color: #f4f2e4; border-bottom: #9a8e51 1px solid; padding: 2px; padding-left: 0px; color: #000000; }
.indicator {background: url(/_images/cms/indicator.gif) no-repeat left center;  }
.error-msg { display: none; color: #a73939; }
.global-project-sorting li { margin: 0px; float: left; margin-right: 10px; margin-bottom: 7px; }
.global-project-sorting li .sprites {
    border: #c5c5c5 1px solid;
    padding: 1px; background-color: #e4e4e4; margin: 0px;
}

.global-project-sorting li .caption { 
    /*background-color: #eeeeee; 
    border: #dddddd 1px solid; 
    border-top-width: 0px;*/
    padding: 4px; margin: 0px; 
    line-height: 13px;
}
.global-project-sorting li .caption .project { font-weight: bold; /*text-transform: uppercase;*/ letter-spacing: 1px; }
.global-project-sorting li .caption .client { font-weight: normal; font-size: 10px; color: #000000; }
#client-container, #order-projects-container { float: left; }
#order-projects-container {display: none; width: 735px;} 
.visual-sort-container { height:42px; }
#project-sort-cloud {
    left:340px;
    position:absolute;
    top:67px;
}

li.active a, li.active a:hover, li.active a:active, li.active a:visited, li.active a:link { color: #64a5e9; font-style: italic; }
li a, li a:hover, li a:active, li a:visited, li a:link { text-decoration: none; }
#menu li.active a, #menu li.active a:hover, #menu li.active a:active, #menu li.active a:visited, #menu li.active a:link { color: #585858; font-weight: bold; font-style: normal; }

.list-view li { padding-top: 9px; }
.list-view li.first { padding-top: 0px; }

.cms-active .list-view .li { padding-top: 0px; }
#project-details #info { padding-bottom: 14px; padding-top: 4px; }
#project-details { line-height: 15px; }
#project-details #details { padding-top: 4px; }