/**
 * common.css
 *
 * Copyright (c) 2003-2009 John Willinsky
 * Distributed under the GNU GPL v2. For full terms see the file docs/COPYING.
 *
 * PKP-wide shared stylesheet.
 *
 * $Id: common.css,v 1.1 2009/06/02 21:15:35 asmecher Exp $
 */

/*
	second draft of JournalStyleSheet.css for Konturen
	JQ Johnson, 14 Mar 2011
	
	This design assumes that no additional Theme is being used.
*/

/* basic overrides to change colors and fonts for the whole site */

body,td,th {
	font-family: Gill Sans, Gill Sans Light, sans-serif;
	color: #FFFFCC;
}
body {
	background-color: #330000;
}
#header, #footer, #header h1 {
	background-color: #330000;
}
a:link {
	color: #CC9966;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #CC9966;
}
a:hover {
	text-decoration: none;
	color: #77211A;
}
a:active {
	text-decoration: none;
}

/* a few more places where there is an explicit font or color setting
   that needs to be overridden */
#content {
	border-top-color: #FFFFCC;
	border-top-style: none;
}
/* make the font size smaller for section names in issue TOC */
#content h4 {
	font-size: 1.3em;
}
#main h2, #main h3, #main h4 {
	font-family: Gill Sans, Gill Sans Light, sans-serif;
	font-weight: normal;
}
/* hack to increase the font size for most of the site. Note that 
   Javascript font sizer overrides the body font-size */
div#main {
	font-size: 1.125em;
}

/* hack fake headings in TOC -- implemented as articles with title
  <strong class="tocSectionTitle"> ... </strong>
  Headings must not have abstracts or author fields, so can only be
  imported, not created within the GUI
 */
.tocTitle .tocSectionTitle {
	color: #ffffcc;
	text-decoration: none;
	background-color: #330000;
	font-size: 1.2em;
	font-weight: normal;
	display: block;
	margin-top: 1em;
	margin-bottom: .3em;
	margin-left: 1em;
}

/* implement the very clean and simple look of the original Konturen site */

/* default on home page is not to float the image.  This change puts 
   text next to image if there's room.   Code on homepage is approximately
   <div id="content">
     <div id="homePageImage">  <img ...> </div>
     text from Setup - The Look - Additional Content
   </div>
*/
#homepageImage img {
	float: left;
	margin: 1em 2em 1em 0;
}

/* add the gradient bar under the #navbar, rather than using a border-bottom.
   note: bg_bar_rev is 7px high, so 12px gives 5px extra space.
   Note also that when we are able to upload files using file browser we 
   will change the URL to be one on this site.
*/
#navbar {
/*
	border-bottom-color: #FFFFCC;
	border-bottom-style: solid;
	border-bottom-width: thick;
*/
	border-bottom-width: 0;
	background-position: left bottom;
	background-image: url('http://libweb.uoregon.edu/pix/scis/sc/ojs/Kbg_bar_rev.jpg');
	background-repeat: no-repeat;
	padding-bottom: 12px;
}
/* Create a standard class to add a bar (3px) after.  Apply this to any block.
   Note also that when we are able to upload files using file browser we 
   will change the URL to be one on this site.
*/
.barAfter {
	border-bottom-width: 0;
	background-position: left bottom;
	background-image: url('http://libweb.uoregon.edu/pix/scis/sc/ojs/Kbg_bar_rev_thin.jpg');
	background-repeat: no-repeat;
	padding-bottom: 6px;
}
/* alternatively, just use <hr>.  We don't use an image because there's
   no good way to get a background image to work right on <hr> in MSIE
*/
hr {
	color: #FFFFCC;
	background-color:#FFFFCC;
	height:1px;
	border:none;
}

/* turn off the standard black top-bar that is used throughout this site */
#header #headerTitle {
	padding-top: 0;
}

/* This issue cover page:
   float the text of the description side by side with the image 
*/
div#issueCoverImage img {
	float: left;
	margin-right: 2em;
	margin-bottom: 1em;
}
/* for browsers that don't support this, include an explict 
   <br style="clear:left"/> at the end of the issue description.
*/
div#issueCoverDescription:after {
	clear: left;
	content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

/* Experiment with radical restructuring of layout.  This may need to 
   be redone if OJS makes major changes to design. */
/* This is a fixed-width design. */
div#main {
	margin-left: 0;
	margin-right: 0;
	width: 650px;
}
div#rightSidebar {
	margin-right: 0;
	margin-left: 10px;
	width: 120px;
}
#header h1 {
	margin-right: 0;
	margin-left: 0;
	padding-left: 0;
}
#container {
	margin-left: auto;
	margin-right: auto;
	width: 780px !important;
}

/** * Table styles */ 
table.listing tr.highlight { background: gray; }