/* CSS for Atutor-redux theme, based on the Atutor default theme 
_____________________________________________________________________

STRUCTURE OF CSS FILE:

* LAYOUT STYLES: all boxes used to control the general layout
* TEXT AND LINK STYLES: basic typography: fonts, headings, links
* BUTTON AND FORM STYLES:
* TABLE STYLES: 
_____________________________________________________________________


/*___________________________________________________________________

LAYOUT STYLES: the boxes and styles used for the general layout
___________________________________________________________________*/


.file-storage-uploads {
	padding: 10px;
	margin: 0 auto;
	/* border: solid 2px #4287CC;
	background: #BACFE5; */ 
	margin-bottom: 40px;
	display: table;
	
}
		
fieldset.file-storage-new-folder {
	/* background: blue;	*/ 
	float: left;
	margin-right: 30px;
	padding: 10px;
	border: 1px solid #E0E0E0;	
}

p.create-new-file {
	text-align: right;
	margin-right: 15px;
}


fieldset.file-storage-new-file {
	/* background: yellow; */ 
	float: left;
	padding: 10px;
	border: 1px solid #E0E0E0;
}



div.togglemenu {
	float: right;
	width: 15%;
	background: #BACFE5;
	text-align: center;
	margin-right: 5px;
	cursor: s-resize;
	-moz-border-radius: 4px;
}


/* sets background information on the body. will only show if width of .site-container is not 100%. */  
body {
/* background: #7c7878;  (lys grå) 
/* background: #90ab8c;  (grønnish) */
background: #474747;
font-size: 80%;
font-family: Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}

/* sets background on pop-up file manager if different */ 
body.filemanager, body.chat, html.chat {
background: white;
}


img.usericon-top {
	border: solid 1px #eee;
	padding: 1px;
	margin-right: 5px;
}



/* top-bar: container for the drop-down course menu, personal information (name, inbox), 
and help links (search, help, log off)  */  

.top-bar {
background: white;
height: 30px;
margin: 0;
padding: 12px 0 5px 0; 
/* border-top: solid 1px blue; */
border-bottom: solid 4px #0066cc;
}

.top-bar-inner {
	margin: 0 auto;
	width: 870px;
}

/* if you wish to put and style custom content (say a site logo og site name) in the top bar */ 
.top-bar-custombox { 
	float: left;
	}

/* the drop-down course meny */ 
.top-bar-form {
height: 26px; /* for Opera */
float: right;
margin: 0 4px 0 0;
padding: 0;
}

/* setting a fixed width on the drop down course menu, to prevent long course names to break the layout */ 
.top-bar-form select#jumpmenu {
width: 200px;
font-size: 75%;
}

/* in the top bar: user name, inbox, search, help, log off */ 
.top-bar-personal {
float: right;
height: 26px;
margin: 0 2px;
padding: 0;
}

.top-bar-personal p {
margin: 3px 3px 0 0;
padding: 0;
font: 95% arial;
}




/* the main container, below the top bar. adjust side margins, fixed vs. dynamic width etc. 
   change margins for side menu in sidemenu.css if you change width and margin for this */  


.site-container {
background: white;																					/* 	COLOR */ 
margin: 0 auto;
padding: 0;
width: 870px;
/*
border-right: solid 1px #eee;
border-left: solid 1px #eee; 
*/
}




/* banner-area: sets the default banner image / background color. 
can be overridden on a course-by-course basis by placing style declarations 
in a file called banner.txt in the root directory of any course's file manager */ 
.banner-area {
background: white url('../images/hopperbanner.gif') no-repeat;
/* border-bottom: solid 1px #eee; /* #70A1CA */
}

/* main-title: the course or page title. positioned at the top in the banner-area */  
.main-title {
width: 100%;
text-align: right;
}



/* main-menu: the main navigation / top tabs. the margin-top here adjusts the height of the banner area! 
   adjust colors and typography under the "text and link style" section */ 
.main-menu {
margin-top: 50px;
width: 100%;
padding-top: 12px;
}

.main-menu ul, .submenu ul {
display: inline;
margin: 0 0 0 4px;
padding: 0;
}


.submenu ul {
/*	width: 80%;*/
/*	border: solid 1px red;*/
	float: left;
	background: #4287CC; 
	
}

.main-menu ul li, .main-menu ul li.active, .submenu ul li {
display: inline;
/*-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;*/
}


/* sub-menu: the secondary links, under the main navigation 
   adjust colors and typography under the "text and link styles" section */
.submenu {	
background: #4287cc;
width: 100%;
min-height: 1.3em; 
font-size: 95%;
padding: 6px 0;
}


.submenu ul li {
padding: 1px 2px;
}

/* for the back-to icon in the submenu */
.submenu img {
border: 0;
}

.submenu ul li.active {
background: #bacfe5; orginal
border: solid 1px #bacfe5;
-moz-border-radius: 4px;
}

/* invisible links to jump to content or side menu */ 
.skip-to-content {
visibility: hidden;
display: none;
height: 0;
width: 0;
padding: 0;
margin: 0;
}


/* heading + date and author box for announcements on front page*/ 

.announcement-single h3 {
border-bottom: dotted 1px gray;
}

.announcement-single span.date {
color: gray;
font-weight: normal;
float: right;
padding: 0 0 20px 20px;
}


/* main content container: includes all content from the submenu down to the footer box. the content 
   of this container changes based on the presence of a side menu or not. 
   see sidemenu.css for styles of .main-content-showmenu, .main-content-menu and #side-menu-container  */ 
.main-content-container {
background: white;
width: 68%; 		/* for those with no javascript */ 
float: left;
border-top: solid 1px #f5f5ff;
/* border-bottom: solid 4px #4287CC; */
margin: 0 0 30px 0;
padding: 10px 20px;
line-height: 1.3em;
}



/* side-menu-container general styles */ 
#side-menu-container{
float: right;
width: 220px; 
padding: 4px;
font-size: 90%;
/* background: #f6f7e1; */
background: #f5f5ff; 
/* background: #BACFE5; */ 
/* background: #4287CC; */
/* color: white; */ 
border-left: solid 1px #eee;
border-right: solid 1px #eee;
border-bottom: solid 1px #eee;
}





/* footer-container: the content of the footer, including translate to links, copyright etc. */ 
.footer-container {
width: 860px;
margin: 0 auto;
font-size: 90%;
color: white;
padding: 2px 0px 6px 10px;¨
clear: both;
}



.footer-language-selector p {
	background: #BACFE5;
	border-top: solid 3px #0066CC;
	clear: both;
	padding: 5px;
	font-size: 90%;
}

.footer-copyright {
	color: gray;
	text-align: right;
}

.course-copyright {
	float: left;
}

.footer-copyright a:link, .footer-copyright a:visited  {
	color: gray;
	border-bottom: dotted 1px white;
}

/*___________________________________________________________________

TEXT AND LINK STYLES: fonts, links, headings  
___________________________________________________________________*/


/* all links unless else is specified */
a:link, a:visited {
	text-decoration: none;
	color: #384F89;
	}

/* the heading in the top-bar-custombox. default is the site name */ 
.top-bar-custombox h1 {
margin: 0;
padding: 3px;
font: 1em arial;
float: left;
font-weight: bold;
}

/* sets a semi-transparent .png image as the background on the main title. 
   create your own here: http://apps.everamber.com/alpha/ 
   see ie6_styles.css for workaround for IE6 and below */ 
.main-title h1 {
margin: 0;
padding: 3px;
background: url('../images/70.png');
font-size: 1em;
font-family: arial, sans-serif;
color: white;
font-weight: bold;
}

/* all headings unless else is specified */ 
h2 {
font-size: 115%;
}

h3, h4 {
font-size: 105%;
}

/* headings in the side menu */ 
.side-menu-block h4 {
color: #444;
font-size: 105%;
padding: 2px;
border-bottom: dotted 1px gray;
}

/* headings on the login page, in the login and registration box */
.login-box h3, .registration-box h3 {
margin: 0;
padding: 2px;
border-bottom: solid 1px #eee;
text-align: center;
background: #f5f5ff;
}

/* the link for forgotten password under the login box */
.forgot-pass {
font-size: 90%;
padding: 0 0 0 7px;
}

/* link styles for "enroll me" if user is not enrolled in the course */ 
.main-title a:link, .main-title a:visited {
background: #;
color: white;
padding: 1px;
border-right: solid 2px gray;
border-bottom: solid 2px gray;
}

/* link styles in main menu */ 
.main-menu ul li { 
border-top: 1px solid #eee;
border-left: 1px solid #eee;
border-right: 1px solid #eee;
padding: 5px 4px 0px 4px;
background: #F5F5FF;
-moz-border-radius-topright: 4px;
-moz-border-radius-topleft: 4px;
}

#side-menu-container strong {
	background: #FFFFD5;
}


#side-menu-container strong a {
	background: #f5f5ff;
}


.main-menu ul li.active {
border-top: 1px solid #4287cc;
border-left: 1px solid #4287cc;
border-right: 1px solid #4287cc;
background: #4287cc;
padding: 5px 4px 1px 4px;
}

.main-menu ul li a:link, .main-menu ul li a:visited {
color: #555; 
padding: 2px;
/* font-weight: bold; */ 
}

.main-menu ul li.active a:link, .main-menu ul li.active a:visited {
color: white;
}

/* link styles in submenu */ 
.submenu ul li a:link, .submenu ul li a:visited {
color: #eee;
padding: 0 4px;
}

.submenu ul li.active a:link, .submenu ul li.active a:visited {
color: black;
padding: 0 2px;
background: white;
border: solid 1px #eee;
}

/* styles for links to help documentation, menu toggle, print page and "go to top" */
.context-documentation a:link, .context-documentation a:visited, 
.print-page a:link, .print-page a:visited, 
.goto-top-link a:link, .goto-top-link a:visited, 
.toggle-menu a:link, .toggle-menu a:visited, 
.breadcrumbs a:link, .breadcrumbs a:visited
{
color: #777;
}

/* the footer text of any content page, containing info on last updated, number of revisions etc */ 
.content-info {
font-size: 80%;
color: gray;
margin: 5px 0 0 0;
border-top: solid 1px #eee;
clear: both;
}

/* the box with "print page" and context help documentation  */
.content-links-container {
text-align: right;
}

/* pushes the "print page" and context help documentation below the side menu links, if the side menu is not visible */
#main-content-nomenu .content-links-container {
margin: 25px 0 0 0;
}

.context-documentation p, .print-page p {
display: inline;
}

.context-documentation, .print-page {
float: right;
padding: 0 10px 0 0;
}

.context-documentation a img, .print-page a img {
border: 0;
margin: 2px 0 0 0;
}

/* show / hide links for sidemenu and sequence arrows */
.side-menu-top-container p {
margin: 0;
}

.sequence-links {
float: left;
}

.toggle-menu {
float: right;
}

/* removes padding on lists in side menu */ 
#side-menu-container ul,  #side-menu-container ul li {
padding: 0;
margin: 0;
}

/* styles for a single block within the side menu, e.g. forum posts or users online */
.side-menu-block {
margin: 40px 0 0 0;
}

/* the links to jump to the top of any page */
.goto-top-link {
font-size: 80%;
width: 100%;
clear: both;
padding: 20px 0 0 10px;
}

/* the edit / add content links for instructors / assistants */
fieldset#shortcuts {
width: 20%;
}

fieldset#shortcuts ul {
margin: 0;
padding:0;
list-style-type: none;
}

/*___________________________________________________________________

BUTTON AND FORM STYLES
___________________________________________________________________*/


/* styles buttons sitewide */
input.button, input#jump-button, table.data tfoot input, table.data tfoot input.button, div.saved input, div.unsaved input {
background-color: #eee;
border-top: none;
border-left: none;
border-right: 2px solid gray;
border-bottom: 2px solid gray;
}

/* ..and the hover styles on these buttons */
input.button:hover, input#jump-button:hover, table.data tfoot input:hover, table.data tfoot input.button:hover, div.saved input:hover, div.unsaved input:hover {
background-color: #f5f5ff;
border-top: none;
border-left: none;
border-right: 2px solid gray;
border-bottom: 2px solid gray;
}

/* sets a minimum width on most of the buttons */ 
input.button, input#jump-button, table.data tfoot input, table.data tfoot input.button {
min-width: 80px;
}

div.buttons {
	text-align: right;
	padding:8px;
}

/* _________________________
   ??? not sure ???
   ________________________*/
div.buttons input {
	background-color: #eee;
	padding: 2px;
	padding-left: 10px;
	padding-right: 10px;
	min-width: 100px;
	margin-left: 5px;
}

/* the login page with the login box, and register box */ 
.login-box, .registration-box {
border: solid 1px #eee;
margin: 0 auto 35px auto;
width: 60%;
}

.login-box p, .login-box label, .registration-box p { 
padding: 3px 6px;
}

.login-box label {
font-size: 90%;
}

.login-box input, .registration-box input {
margin: 3px 6px;
}

/* the star indicating that an item is required */
.required {
display: inline;
color: red;
font-size: 140%;
padding: 0 5px 0 0;
font-weight: bold;
}

/* common styles for all status messages */ 
.status-error, .status-warning, .status-feedback, .status-info {
padding: 10px; 
width: 50%;
margin: 30px auto;
/* -moz-border-radius: 8px; */ 
}

/* status messages: errors and warnings */ 
.status-error, .status-warning {
border: solid 1px red;
background: #f99c9c;;
}

/* status messages: (positive) feedback */ 
.status-feedback {
border: solid 1px green;
background: #a3dcad;
}

/* status messages: general information */ 
.status-info {
border: solid 1px orange;
background: #f8d15b;
}

/*___________________________________________________________________

TABLE STYLES
___________________________________________________________________*/


/* for data tables */


th {
text-align: left; 
}

td {
vertical-align: top;
}

table.data {
	border: 1px solid #e0e0e0;
	width: 90%; 
	margin-left: auto; 
	margin-right: auto;
	border-spacing: 0px;
	border-collapse: collapse;
	clear: both;
}

table.data th {
	background-color: #fafafa;
	border-bottom: 1px solid #e0e0e0;
	padding: 2px;
	white-space: nowrap;
}

table.data th a {
	color: black;
	padding-right: 15px;
	margin-right: 15px;
	background-image: url(images/sort.gif);
	background-repeat: no-repeat;
	background-position: right;
	text-decoration:none;
}

table.data th a:hover {
	text-decoration: underline;
}

table.data tbody th {
	text-align: left;
	background-color: #fdfdfd;
	cursor: auto;
}

table.data td {
	padding: 3px;
}

table.data col.sort {
	background-color: #fafafa;
}

table.data tbody tr:hover, table.data tbody tr:hover th {
	background-color: #f5f5ff;
	cursor: pointer;
}

table.data tbody tr.selected, table.data tbody tr.selected th {
	background-color: #f5f5ff;
	cursor: auto;
}

table.data tfoot {
	background-color: #fafafa;
	border-top: 1px solid #e0e0e0;
}

table.data tfoot tr:first-child td {
	padding: 5px;
	background-image: url(images/arrow_ltr.gif);
	background-repeat: no-repeat;
	background-position: 4px 5px;
	padding-left: 40px;
}

table.data.static tfoot td, table.data.static tfoot tr:first-child td {
	padding: 5px;
	background-image: none;
	padding-left: 0px;
}

/* used for static tables with no form elements */
table.data.static tbody tr:hover {
	background-color: transparent;
	cursor: auto;
}

table.data tfoot input[type=submit]:hover {
	background-color: #f5f5ff;
	cursor: pointer;
}


/* editor tabs 
   used for the edit content pages */ 
table.etabbed-table {
	background-color: white;
}
table.etabbed-table td#left-empty-tab {
	background-color: transparent;
	width: 15px;
	border-bottom: 1px solid #9DAB9A;
}
table.etabbed-table td#right-empty-tab {
	text-align: right;
	background-color: transparent;
	border-bottom: 1px solid #9DAB9A;
	padding-right: 5px;
}

table.etabbed-table td.tab-spacer {
	background-color: transparent;
	width: 5px;
	border-bottom: 1px solid #9DAB9A;
}

table.etabbed-table td.tab {
	padding-top: 2px;
	padding-bottom: 2px;
	width: 110px;
	background-color: #f5f5ff;
	border-bottom: 1px solid #9DAB9A;
	border-left: 1px solid #9DAB9A;
	border-top: 1px solid #9DAB9A;
	border-right: 1px solid #9DAB9A;
	font-weight:normal;
	text-align:center;
}

table.etabbed-table td.tab input {
border: 0;
background: white;
font-weight: bold;
color: #777;
}

table.etabbed-table td.selected {
	padding-top: 2px;
	padding-bottom: 2px;
	width: 110px;
	background-color: #474747;
	color: white;
	border-left: 1px solid #9DAB9A;
	border-top: 1px solid #9DAB9A;
	border-right: 1px solid #9DAB9A;
	font-weight:bold;
	text-align:center;
}

table.etabbed-table td.tab:hover {
	background-color: #fdfdfd;
}

/* save / close buttons at edit content  */
div.saved, div.unsaved {
	text-align:right;
	padding-right:20px;
	padding-top:5px;
	padding-bottom:10px;
}

div.saved input:focus, div.unsaved input:focus {
	border: 1px solid black;
	background-color: white;
    font-weight: normal;
}


/* input field */ 
#body_text {
	width:95%;
}

/* paging: where data is split up into several browsable pages */
div.paging {
   width: 100%;
   margin: 10px;
}
div.paging ul {
   list-style: none;
   display: inline;
   padding: 0px;
}

div.paging li { 
display: inline; 
padding: 4px;
margin: 0 2px;
-moz-border-radius: 4px;
border: solid 1px #eee;
}

div.paging li a {
	text-decoration: none;
	padding: 6px;
}

div.paging li a:hover, div.paging li a.current, div.paging li.current {
background-color: #ACACAB;
color: white;
font-weight: bold;
-moz-border-radius: 4px;
}

/* input forms from old CSS. used mostly for the question database */ 
div.input-form {
	width: 80%;
	margin: 0 auto 20px auto;
	border: 1px solid #f0f0f0;
}

div.input-form div.row {
	padding:10px 4px;
}

div.input-form input {
	cursor: pointer;
}
div.input-form textarea {
	border: 1px solid #999;
	width: 98%;
	background-color: #eee;
	padding: 2px;
	margin-right: 2px;
}

div.input-form textarea:focus {
	border: solid 1px green;
	background-color: white;
	padding: 2px;
}

div.input-form input[type=text], div.input-form input[type=password] {
	border: 1px solid #999;
	background-color: white;
	padding: 2px;
	max-width: 60%;
}


/* directory.php - used for the directory pages
   uses the same styles as the course list at start page */
   
input.directorysearch {
margin-bottom: 20px;

}


div.members {
	position: relative;
	width: 300px;
	height: 10.5em;
	border: rgb(204, 204, 204) 1px solid;
	background-color: white;
	float: left;
	margin: 3px;
	padding: 3px;
}

div.members img {
border: solid 2px #eee;
padding: 5px;
}

div.members.break {
	clear: left;
}

div.members h2 {
	border: 0px;
	font-weight: normal;
	font-size: large;
}

div.members:hover {
	background-color:#D1E3ED;
	border: #AAAAAA 1px solid;
}

div.members a {
	text-decoration: none;
}

div.members:hover a {
	color: #006699;
}

div.members a:hover {
	color: #000000;
}

div.members p {
	font-size: small;
}

div.members p a {
	font-weight: bold;
}

div.members img.icon	{
	float: left;
	margin: 2px;
	height:6.8em;
	width:6.8em;
}

div.members div.shortcuts {
	text-align: right;
	clear: left;
	vertical-align: middle;
}


/* the question stats */  
.qstat_bar-border {
height: 40px;
width: 22px;
background: #fff;
border: 1px solid #e0e0e0;
margin: 0;
padding: 0;
}
.qstat_bar-fill {
width: 20px;
margin: 0px;
padding: 0;
background: #fff;
}
.qstat_bar-bar {
width: 20px;
height: 38px;
margin: 1px;
padding: 0;
background: #a9c8dC;
}