vitro/webapp/web/themes/enhanced/css/screen.css

/* $This file is distributed under the terms of the license in /doc/license.txt$ */

/****************************************
 Vitro Enhanced Theme: screen styles
 
 Original version
 2009-04-30 mw542
*****************************************/

@import url("blueprint/reset.css");
@import url("blueprint/forms.css");
@import url("blueprint/typography.css");
@import url("blueprint/liquid.css");
@import url("blueprint/ie.css");

body {
  position: relative;
  background: #737373;
  padding: 0 4em;
}

#wrap { background: #fff; }

#contentwrap {
  padding: 24px 20px;
  background: #D9D9D9;
}

#content {
  padding: 16px 12px;
  background: #fff;
  font-size: 108.33%; /* bumping up content text from 12px to 13px */
}

#footer {
  color: #e5e5e5;
  background: #4e4e4e;
  padding: 16px 20px 40px 20px;
  text-align: right;
  clear: both;
}


/****************
Global classes
****************/

ul.clean { margin-left: 0; }
ul.clean li { list-style-type: none; }


/****************
Identity
****************/

div#identity { position: relative; }

#identity h1 {
  padding-top: 25px;
  margin-left: 20px;
  margin-bottom: 5px;
}

#identity h1 a {
  color: #000;
  text-decoration: none;
}

ul#otherMenu {
  position: absolute;
  margin: 0;
  top: 3px;
  right: 20px;
}

ul#otherMenu li {
  display: inline;
  margin-left: 4px;
}

ul#otherMenu li.border {
  padding-right: 4px;
  border-right: 1px solid #ccc;
}


/************************
Navigation and Search
************************/

div#navAndSearch {
  position: relative;
  background: #7d8b99;
  border-top: 3px solid #4e4e4e;
  padding-left: 20px;
/*  padding-right: 300px;*/
  padding-right: 22em;
  padding-top: 8px;
  padding-bottom: 8px;
  height: 1%;
}

div#secondaryTabMenu { display: none; }

select#search-form-modifier,
#searchForm label { display: none; }

div#searchBlock {
  width: 19em;
  height: 100%;
  text-align: right;
  padding: 0 20px 0 10px !important; /* fix for IE6 */
  padding: 10px 20px;
  position: absolute;
  top: 0;
  right: 0;
  background: #4e4e4e;
}

#searchForm { margin-top: 10px; }

#navAndSearch ul {
  margin: 0;
  padding: 0;
}

#navAndSearch li {
  list-style-type: none;
  margin: 1px;
}

#navAndSearch li a {
  display: block;
  color: #fff;
  text-decoration: none;
}

#navAndSearch li a:hover {
  color: #000;
  background: #fff;
}

#navAndSearch li a.activePrimaryTab,
#navAndSearch li a.activeTab {
  color: #000;
  background: #fff;
  font-weight: bold;
}

ul#primary,
ul#primary li,
ul#index,
ul#index li {
  float:left;
}

ul#primary li a,
ul#index li a { padding: 5px 12px; }


div#breadcrumbs {
  color: #aaa;
  clear: left;
  background: #D9D9D9;
  padding: 16px 20px 0 20px;
  margin-bottom: -18px;
  display: none;
}

div#breadcrumbs a { color: #888; }

div#breadcrumbs a:hover { color: #000; }


/************************
Individual Pages
************************/

div#label { margin-bottom: 1.5em; }

#label h2,
#label h3 {
  display: inline;
  padding-right: 6px;
}

em.moniker { color: #9c9c9c; }

ul.externalLinks { margin: 0 0 1.5em 0; }

ul.externalLinks li {
  list-style-type: none;
  display: inline;
  padding-right: .5em;
  padding-left: .8em;
  border-left: 1px solid #ddd;
}

ul.externalLinks li.primary,
ul.externalLinks li.first {
  padding-left: 0;
  border: 0;
}

ul.externalLinks a { color: #84a655; } /* green links */ 

ul.externalLinks a:hover,
ul.externalLinks a:active,
a.externalLink:hover,
a.externalLink:active {
  color: #000;
}

a.externalLink { color: #84a655; }

div.description { margin-bottom: 1.5em; }

.propertyName {
  font-size: 1em;
  line-height: 1em;
  color: #666;
  background: #ebebeb;
  border-right: 1px solid #fff;
  margin-left: -12px;
/*  margin-bottom: .75em;*/
  padding: 4px 12px;
  float: left;
}

.propsItem,
.datatypeProperties,
.properties {
  clear: left;
}

.propsItem { padding: 1em 0; }

.propsItem a { font-weight: bold; }

.pageGroupBody {
    margin-bottom: 1em;
}

#acknowledgementText {
    font-size: 90%;
}


/************************
Search Results
************************/

.contentsBrowseGroup h2 {
  margin-top: 2em;
  padding-bottom: .25em;
  border-bottom: 1px solid #eee;
}

.contentsBrowseGroup h3 {
  color: #666666;
  font-size: 1em;
  margin-bottom: 0;
}

.contentsBrowseGroup ul { margin-left: 0; }

.contentsBrowseGroup li {
  list-style-type: none;
  color: #9C9C9C;
}

.searchTOC a {
  font-weight: bold;
  padding-left: 3px;
}


/************************
Tabs
************************/

ul.tabEntities {
  color: #9c9c9c;
  margin: 1em 0;
}

ul.tabEntities li {
  margin-bottom: 1em;
  list-style-type: none;
}

ul.tabEntities a { font-weight: bold; }

ul.tabEntities a.externalLink, 
.entityList a.externalLink {
  text-decoration: none;
  font-weight: normal;
}

div.blurb { color: #999; }

div.blurb a { font-weight: normal; }

/* Index and List pages */
.siteMap ul,
.entityList ul { margin-left: 0; }

.siteMap li { 
  list-style-type: none; 
  color: #9c9c9c;
}

.entityList li { 
  list-style-type: none;
  color: #9c9c9c;
  margin-bottom: .5em;
 }
 
.siteMap li a,
.entityList li a { font-weight: bold; }
 
.siteMap h2 { margin-bottom: .5em; }

div.tab h2 {
  margin: 0 -12px;
  padding: 0 12px 10px 12px;
  border-bottom: 5px solid #d9d9d9;
}

.tab h3 {
  color: #999;
  margin-top: 1em;
  padding-bottom: 3px;
}

.tab h3 a { color: #1b4f89; }

.tab h3 a:hover { color: #000; }

.tab th, .tab td, .tab caption { padding-left: 0; }

.tabBody { padding: 12px 0; }

.tabDesc { padding-top: 16px; }

/************************
Footer
************************/

#footer a {
  color: #fff;
  font-weight: bold;
}

img.footerLogo { float: left; }

ul.otherNav { margin: 0; }

ul.otherNav li {
  display: inline;
  padding: 0 6px;
  border-right: 1px solid #aaa;
}

ul.otherNav li.last {
  border: 0;
  padding-right: 0;
}


/**********************************************
Admin Panels & Controls

the odd combinations of positioning types
are necessary for cross-browser consistency
**********************************************/

/*** Admin Dashboard ***/

#adminDashboard {
    margin-top: 1em;
}

#adminDashboard .pageBodyGroup {
    margin-top: 2em;
    margin-bottom: 2em;
    clear: both;
}

#adminDashboard .pageBodyGroup h4 {
    margin-bottom: .25em;
}

#adminDashboard .pageBodyGroup h3 {
    background-color: #efefef;
    color: #000;
    padding: 5px;
}

#adminDashboard .pageBodyGroup ul {
    margin: 0 0 1.5em 0;
}

#adminDashboard .pageBodyGroup li {
    list-style-type: none;
}

#adminDashboard #verbosePropertyForm {
  margin-top: 3em;
}

/*** end Admin Dashboard ***/

div.admin {
  color: #fff;
  background: #aaa;
  padding: 6px;
  height: 1%; /* IE likes this */
  width: 100%; /* and this */
}

div.panelContents  {
  color: #777;
  background: #e5e3d5;
  display: none;
  padding: 12px;
}

div.top {
  margin: 0 -12px;
  padding: 0 24px 0 0;
  position: relative;
  top: -16px;
  background: #e5e3d5;
}

div.bottom {
  margin: 0 -12px;
  position: relative;
  bottom: -16px;
  padding: 6px 12px 8px 12px;
}

.admin h3 {
  font-size: 1em;
  text-transform: uppercase;
  font-weight: bold;
  color: #ddd;
  background: #aaa;
  line-height: 2em;
  margin: 0 !important; /* fix for IE6 */
  margin-right: -24px;
  padding: 0 12px;
  width: 100% !important; /* fix for IE6 */
  width: auto;
}

.admin p { margin-bottom: .25em; }

.admin a:link,
.admin a:visited { color: #fff; }

.panelContents a:link,
.panelContents a:visited { color: #777; }

.admin a:hover,
.admin a:active { color: #000; }

#loginPanel ul { margin: 0; }

#loginPanel li {
  list-style-type: none;
  margin-bottom: .5em;
}



/******************************************************************
ENTITY LIST TOGGLES
(The little plus/minus toggles that show additional items)

These controls are set up to use JavaScript but degrade to use 
CSS :hover classes -- JavaScript can be found in controls.js

IE6 does not support :hover so it will see everything 
(hack is in ie.css)
******************************************************************/

span.entityMoreSpan {
  display: block;
  font-style: italic;
  background: url(../site_icons/plus.gif) left center no-repeat;
  padding-left: 14px;
  margin: .5em 0;
  line-height: 1em;  
  cursor: pointer;
}

div.navlinkblock:hover span.entityMoreSpan,
div.navlinkblock-collapsed:hover span.entityMoreSpan,
span.entityMoreSpan:hover {
  color: #8C65A1;
}

div.navlinkblock:hover span.entityMoreSpan,
div.navlinkblock-expanded span.entityMoreSpan {
  background: url(../site_icons/minus.gif) left center no-repeat;
}


div.navlinkblock:hover div.extraEntities,
div.navlinkblock-expanded div.extraEntities {
  display: block;
}

div.extraEntities {
  display: none;
}


/********************************
Frontend Edit Controls and Forms
********************************/

div.editingForm { background: none; }

div.editingForm hr { display: none; }

a.add {
  float: left;
  line-height: 1em;
  width: 1em;
  height: 1em;
  padding: 4px;
  background: #ebebeb url(../site_icons/plus_transparent.gif) center center no-repeat;
  text-indent: -9999px;
  overflow: hidden;
}

a.add:hover { background-color: #000; }

ul.properties { margin: 0; }

ul.properties li {
  color: #9c9c9c;
  list-style-type: none;
}

ul.properties li,
div.datatypePropertyValue,
ul.datatypePropertyValue li { 
  position: relative; 
}

span.editLinks,
em.nonEditable { 
  display: none; 
}

span.editLinks a,
em.nonEditable { font-size: 84.62%; } /* 13px down to 11px */

span.editLinks a {
  color: #da8622;
  font-weight: normal;
}

span.editLinks a:hover { color: #000; }

span.editLinks a.edit { padding-right: 4px; }

span.statementWrap:hover span.editLinks,
span.statementWrap:hover em.nonEditable {
  display: block;
  width: 6em;
  padding: 2px 0 4px 0;
  position: absolute;
  top: -2px;
  left: -6em;
  line-height: 1.5em;
  background: #fff;
  z-index: 10;
  text-align: center;
}

span.statementWrap:hover em.nonEditable {
  padding-top: 5px;
  width: 8em;
  left: -8em;
  font-style: normal;
}

.verbosePropertyListing {
    color: gray;
    font-size: 0.75em;
    margin-left: 1em;
}

/************************
Backend forms
************************/

div.sparqlform label {
  font-weight: normal;
  display: inline;
}