/**
 * Global CSS for OFPEC
 *
 * Created 07 Sep 2008
 * Updated 08 May 2020
 *
 * Last update: formatting.
 *
 * @author bedges
 */


@import 'OFPEC_reset.css';


/* COMMON PAGE ELEMENTS
------------------------------------------------------------ */

body {
	margin: 0;
	padding: 0;
	background: #2d2d2d;
	text-align: center;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 80%;
	color: #333;
}

h1, h2, h3, h4, h5, h6 {
	clear: left;
	margin: 0;
	padding: 10px 0;
	font-weight: normal;
	font-family: Arial, Helvetica, sans-serif;
}

h1 {
	font-size: 200%;
	color: #9E3030;
}

h2 {
	font-size: 180%;
	color: #A47675;
}

h3 {
	margin: 10px 0 0;
	font-size: 149%;
	color: #656565;
}

h4 {
	font-size: 129%;
	margin: 20px 0 10px;
	padding: 5px 0 5px 10px;
	border-left: 5px solid #c9b1a0;
}

h5 {
	font-size: 110%;
	font-weight: bold;
}

h6 {
	font-size: 100%;
}

p {
	margin: 0;
	padding: 5px 0 10px;
	line-height: 150%;
}

li {
	line-height: 150%;
}

a {
	text-decoration: none;
	color: #9e3030;
}

a:hover {
	text-decoration: underline;
	color: #ff0000;
}

img {
	border: none;
}

*:focus {
	outline: none;
}

hr {
	clear: left;
	width: 100%;
	height: 1px;
	margin: 20px auto;
	padding: 0;
	line-height: 1px;
	font-size: 1px;
	border: none;
	border-top: 1px solid #dfd3c6;
	border-bottom: 1px solid #fff;
	background: #dfd3c6;
}

fieldset {
	border: none;
}

object {
	background: #f8f4e4;
}

table, th, td {
	border-collapse: collapse;
	border-color: #dfd3c6;
}

th {
	background: #f9f2dd;
}


/* CONTAINER BLOCKS
------------------------------------------------------------ */

#wrapper_top,
#wrapper_middle,
#wrapper_bottom {
	float: left;
	width: 100%;
}

#wrapper_top {
	background: url(../images/layout/page_bg_top.gif) repeat-x top #eaedde;
}

#wrapper_middle {
	background: url(../images/layout/page_bg_bottom.gif) repeat-x bottom;
}

#container {
	width: 980px;
	margin: 0 auto;
	text-align: left;
}

#container_shadow {
	float: left;
	width: 980px;
}

#container_shadow_topleft,
#container_shadow_topright,
#container_shadow_bottomleft {
	float: left;
	width: 980px;
}

#container_shadow_topleft {
	background: url(../images/layout/container_shadow_topleft.gif) no-repeat left top;
}

#container_shadow_topright {
	background: url(../images/layout/container_shadow_topright.gif) no-repeat right top;
}

#container_shadow_bottomleft {
	background: url(../images/layout/container_shadow_bottomleft.gif) no-repeat left bottom;
}

#container_shadow_bottomright,
#header_topbar,
#header_container,
#header_image {
	float: left;
	width: 960px;
}

#container_shadow_bottomright {
	padding: 0 10px;
	background: url(../images/layout/container_shadow_bottomright.gif) no-repeat right bottom;
}

#header_topbar {
	height: 30px;
	background: #222;
}

#header_container {
	position: relative;
	background: url(../images/layout/header_bg2.gif) repeat-x top;
}


/* Header Ribbon (used for promotions, code in the global template)
------------------------------------------------------------ */

#header_ribbon,
#header_ribbon_link {
	position: absolute;
	top: -3px;
	right: -3px;
	width: 300px;
	height: 150px;
}

#header_ribbon {
	background: url(../images/layout/ribbon_survey2009.png) no-repeat;
}

#header_image {
	position: relative;
	background: url(../images/OFPEC_headers/OFPEC_header_1.jpg) no-repeat right;
	z-index: 10;
}

#site_logo {
	float: left;
	width: 322px;
	height: 91px;
	padding: 30px 0 20px 30px;
	background: url(../images/layout/site_logo.gif) no-repeat 30px 30px;
}


/* Login
------------------------------------------------------------ */

#login_control {
	float: left;
	width: 250px;
	padding: 8px 15px;
}

#login_control a,
#adminmenu_control a {
	text-transform: uppercase;
	font-size: x-small;
	color: #aaa;
}

#login_container {
	position: absolute;
	top: 0;
	left: 0;
	width: 300px;
	border: 1px solid #bababa;
	background: url(../images/layout/content_bg.gif) repeat-x top #fcf9ee;
}

#login_form {
	padding: 10px;
	font-size: 87%;
}

#login_form form {
	padding: 0;
	margin: 0;
}

#login_form input#user,
#login_form input#passwrd {
	width: 145px;
	color: #9e3030;
}

#login_form input#login_submit {
	padding: 0 5px;
	font-size: 80%;
	letter-spacing: -1px;
	text-transform: uppercase;
}

#register {
	padding: 10px 0 0;
	text-align: center;
	font-size: x-small;
}


/* Admin Menu
------------------------------------------------------------ */

#adminmenu_control {
	float: right;
	width: 400px;
	padding: 8px 8px 8px 15px;
	text-align: right;
}

#adminmenu_container {
	position: absolute;
	top: 0;
	right: 0;
	width: 180px;
	border: 1px solid #bababa;
	background: url(../images/layout/content_bg.gif) repeat-x top #fcf9ee;
}

#adminmenu {
	padding: 10px;
	font-size: 87%;
}

#adminmenu ul,
#adminmenu li {
	padding: 0;
	margin: 0;
	list-style-type: none;
}

#admin_info {
	float: right;
	clear: both;
	width: 300px;
	padding: 5px;
	border: 1px solid #bbb;
	background: #efefef;
	text-align: right;
	font-size: x-small;
}

#admin_info p {
	padding: 0;
	line-height: normal;
}

.admin_link {
	display: block;
	float: right;
	width: 50px;
	padding: 5px 0;
	line-height: normal;
	text-align: right;
}


/* Horizontal Site Menu
------------------------------------------------------------ */

#menu {
	float: left;
	clear: both;
	width: 930px;
	padding: 0 0 0 30px;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
}

#menu ul,
#menu ul li {
	line-height: normal;
	list-style-type: none;
	padding: 0;
}

#menu ul {
	margin: 0;
}

#menu ul li {
	display: inline-block;
}

#menu ul a {
	display: block;
	padding: 5px 10px;
	background: url(../images/layout/menubar.gif) repeat-x #9d7973;
	text-decoration: none;
	border-top: 1px solid #ccb8b5;
	border-bottom: 1px solid #000;
	font-size: 120%;
	color: #f8f4e4;
}

#menu ul a:hover {
	background: url(../images/layout/menubar.gif) repeat-x left -1px #cebaa6;
	border-top: 1px solid #e9e1e0;
	border-bottom: 1px solid #000;
	color: #fff;
}

#menu ul a.active,
#menu ul a.active:hover {
	background: #E8E4D4;
	border-bottom: 1px solid #E8E4D4;
	border-top: 2px solid #fff;
	color: #000;
}


/* Content Area
------------------------------------------------------------ */

#content_container {
	float: left;
	width: 920px;
	padding: 10px 20px 0;
	background: url(../images/layout/content_bg.gif) repeat-x top #FCF9EE;
}

#content_container,
#to_top_container,
#footer {
	box-shadow: 0 10px 5px #000;
}

#content_container p {
	font-size: 110%;
}

#breadcrumb {
	padding: 2px 0 20px 18px;
	background: url(../images/layout/breadcrumb.gif) no-repeat left top;
	font-size: x-small;
}

#breadcrumb b {
	padding: 0 5px;
}


/* Generic styles for left column
------------------------------------------------------------ */

#left_column {
	float: left;
	width: 100%;
	padding: 10px 0;
}

#page_footer_container {
	float: left;
	width: 100%;
	padding: 20px 0 0;
}


#ivan_martin {
	position: relative;
	float: left;
	width: 470px;
	height: 171px;
	background: url(../images/help_ivan_and_martin.jpg) no-repeat right top;
}

#how_many_days {
	position: absolute;
	width: 460px;
	height: 171px;
	margin: 0 0 0 10px;
}

#how_many_days a {
	display: block;
	width: 420px;
	height: 141px;
	padding: 15px 20px;
	font-size: 170%;
	line-height: 150%;
	color: #fff;
}

#how_many_days a:hover,
#how_many_days a:focus {
	text-decoration: none;
}


/* Search
------------------------------------------------------------ */

#depot_searchform,
form.depot_searchform {
	float: left;
	width: 140px;
	margin: 0;
	padding: 0 0 10px;
}

#depot_searchform fieldset,
#filter fieldset {
	margin: 0;
	padding: 0;
	border: none;
}

input#depot_searchtext {
	float: left;
	position: relative;
	width: 100px;
	height: 22px;
	padding: 3px;
	border: 1px solid #c5ada7;
}

.depot_searchform select {
	width: 138px;
	padding: 5px 5px 5px 3px;
	border: 1px solid #c5ada7;
}

input#depot_searchsubmit {
	float: left;
	position: relative;
	width: 32px;
	height: 29px;
	margin: 0;
	padding: 0;
	border: 1px solid #c5ada7;
	border-left: none;
	background: url(../images/layout/search_binoc_icon3.gif) no-repeat 0 -2px #fff;
	text-align: center;
	cursor: pointer;
}


/* Comments
------------------------------------------------------------ */

.comment_form_container {
	float: left;
	clear: both;
	width: 758px;
	margin: 20px 0 0;
	font-size: 100%;
}

textarea#comment{
	width: 746px;
	margin: 0;
	padding: 5px;
	border: 1px solid #dfd3c6;
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 120%;
	color: #777;
}

.comment_form_submit {
	text-align: right;
}

.comment_form_title {
	float: left;
	width: 100%;
	padding: 5px 0;
	text-align: left;
	font-size: 110%;
	color: #a47675;
}

.comment_holder,
.make_comment {
	float: left;
	width: 756px;
	margin: 5px 0;
	border: 1px solid #777;
}

.comment_name {
	float: left;
	width: 736px;
	background: #c5b69e;
	border-bottom: 2px solid #8d8872;
	border-top: 1px solid #fcf9ee;
	padding: 3px 10px;
	font-weight: bold;
	color: #fcf9ee;
}

.comment_date {
	float: right;
	width: 200px;
	text-align: right;
}

.comment_content {
	float: left;
	width: 736px;
	padding: 10px;
	background: url(../images/layout/quote_bg2.gif) no-repeat top right #f8f4e4;
	border-top: 1px solid #222;
	line-height: 145%;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #555;
}

.comment_content li {
	font-size: 100%;
}

.comment_admin {
	float: right;
	width: 70px;
	text-align: right;
	padding: 0 10px;
}

.comment_count,
.no_comment {
	float: right;
	width: 150px;
	padding: 7px 0 0;
	text-align: right;
	font-size: x-small;
}

.comment_count a,
.no_comment a {
	padding: 5px 20px 0 10px;
	background: url(../images/layout/comment_icon.gif) no-repeat top right;
}

.no_comment a {
	background: url(../images/layout/no_comment_icon.gif) no-repeat top right;
}


/* Top of Page navigation
------------------------------------------------------------ */

#to_top_container {
	float: left;
	width: 920px;
	padding: 0 20px 10px;
	background: url(../images/layout/content_bottom_bg.gif) repeat-x left bottom #FCF9EE;
}

.top_of_page {
	float: left;
	clear: both;
	width: 100%;
	padding: 10px 0;
}

.top_of_page a {
	padding: 0 0 0 10px;
	background: url(../images/layout/to_top_arrow2.gif) no-repeat left;
	font-size: x-small;
	text-transform: uppercase;
	letter-spacing: -1px;
}


/* Item List
------------------------------------------------------------ */

.item_container {
	float: left;
	overflow: hidden;
	width: 428px;
	padding: 10px 0;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #dfd3c6;
}

.item_header,
.item_content,
.item_footer {
	float: left;
	clear: both;
	width: 428px;
}

.item_content {
	width: 408px;
	padding: 5px 10px 0;
}

.item_header_left,
.item_header_meta {
	float: left;
	width: 386px;
}

.item_header_meta {
	padding: 5px 0;
}

.item_header_right {
	float: left;
	width: 42px;
}

.item_header h3 {
	display: inline;
	margin: 0;
	padding: 0;
	font-size: 160%;
	color: #554444;
}

.item_header h3 a {

}

.item_content p {
	padding: 5px 0 3px;
	line-height: 150%;
	font-size: 100%;
}

.item_content li {
	font-size: 100%;
}

.item_footer p {
	padding: 5px 0;
	text-align: left;
	text-transform: uppercase;
	font-size: x-small !important;
}


/* RESOURCE LIST
------------------------------------------------------------ */

.resource_list_display {
	float: left;
	width: 746px;
	margin: 5px 0;
	padding: 5px 10px;
	border: 1px solid #ddd;
	background: #fdfcf7;
}

.resource_list_display h3,
.resource_list_display h4 {
	padding: 0;
}

.resource_list_display h3 {
	/* font-weight: bold; */
	font-size: large;
}

.resource_list_display h4 {
	font-size: x-small;
}

.resource_list_display th {
	background: none;
	text-align: left;
}

.resource_title {
	float: left;
	width: 446px;
}

.resource_author {
	float: left;
	width: 446px;
	padding: 3px 0;
	font-size: x-small;
	color: #555;
}

.resource_info {
	float: left;
	width: 446px;
}

.resource_info img {
	margin: 5px;
	padding: 3px;
	background: #fcf9ee;
	border: 1px solid #ddd;
}

.resource_admin {
	float: right;
	padding: 5px 0;
	font-size: x-small;
	text-transform: uppercase;
}

.resource_list_metainfo,
.resource_metainfo {
	float: right;
	width: 280px;
	padding: 3px 0;
	text-align: right;
	font-size: x-small;
	font-weight: bold;
	color: #815d57;
}

.resource_metainfo {
	width: 200px;
	margin: 5px 0 5px 5px;
	background: #f8f4e4;
	border: 1px solid #ddd;
	text-align: left;
	font-weight: normal;
	color: #444;
}

.resource_metainfo th {
	text-align: right;
	color: #815d57;
}

.resource_description {
	float: left;
	width: 726px;
	padding: 0 10px;
}

.resource_footer {
	float: left;
	width: 100%;
	padding: 0 0 5px;
}

#left_column .resource_footer p {
	padding: 5px 0 0;
	font-size: x-small;
	text-transform: uppercase;
}

#left_column .resource_footer p a,
#left_column .resource_footer p a:hover {
	border: none;
}

#left_column .resource_footer p a:hover {
	text-decoration: underline;
}

tr.odd {
	background: #f8f4e4;
}

table.resource_list {
	margin: 5px 0 10px;
	border: 1px solid #838375;
}

.resource_list th {
	background: #d0bfa6;
	border-top: 1px solid #fcf9ee;
	border-bottom: 1px solid #67362e;
	text-transform: uppercase;
}

img.rate_star {
	cursor: pointer;
}

.is_rated {
	font-size: 210%;
}


/* page navigation
------------------------------------------------------------ */

.pagenav_container,
.sort_container {
	float: right;
	text-align: right;
}

.sort_container {
	width: 500px;
	padding: 8px 0;
}

.pagenav_container {
	font-size: 130%;
}

.pagenav_container a:hover {
	text-decoration: none;
}

.nav_arrow,
.nav_pagejump,
.nav_currentpage {
	float: left;
}

.nav_arrow {
	padding: 0 3px 6px;
	font-size: 200%;
}

.nav_pagejump,
.nav_currentpage {
	margin: 2px 0 0;
	padding: 6px 3px;
	border: 1px solid #fcf9ee;
}

.nav_currentpage {
	border: 1px solid #aaa;
}

.nav_key {
	float: left;
	width: 736px;
	text-align: center;
}


/* game selector
------------------------------------------------------------ */

#game_selector {
	float: left;
	width: 250px;
	padding: 10px 0;
}

.download_control {
	float: right;
}

.download_button {
	width: 89px;
	height: 20px;
	padding: 0;
	border: none;
	background-image: url(../images/layout/button_icon_download.gif);
	background-repeat: no-repeat;
	background-position: left 0;
	cursor: pointer;
}

.download_button:hover {
	background-position: left -20px;
}

.link_button {
	width: 52px;
	height: 20px;
	padding: 0;
	border: none;
	background-image: url(../images/layout/button_icon_link.gif);
	background-repeat: no-repeat;
	background-position: left 0;
	cursor: pointer;
}

.link_button:hover {
	background-position: left -20px;
}

.resource_metainfo .download_button,
.resource_metainfo .link_button {
	margin: 5px;
}

#more_results_container {
	padding: 5px;
}

#more_by_author,
#more_by_author p,
#more_results_container,
#more_results_container li,
#more_results_container a {
	font-size: x-small;
}

#left_column #more_results_container ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#left_column #more_results_container ul li {
	padding: 0;
	line-height: normal;
	font-size: x-small;
}

#more_by_author p {
	padding: 5px;
}


/* Footer
------------------------------------------------------------ */

#footer {
	float: left;
	width: 940px;
	padding: 10px;
	font-size: x-small;
	border-bottom: 4px solid #000;
	background: url(../images/layout/footer_bg.gif) no-repeat #2d2d2d;
	color: #888;
}

#footer .box {
	float: left;
	width: 130px;
	margin: 0 6px 0 0;
	border: 1px solid #222;
	border-bottom: 1px solid #3c3c3c;
}


/* Sitemap
------------------------------------------------------------ */

#sitemap {
	float: left;
	width: 699px;
	padding: 25px 0;
	border-right: 1px solid #444;
}

#sitemap h2 {
	margin: 0;
	padding: 2px 2px 3px;
	border-bottom: 1px solid #111;
	text-transform: uppercase;
	text-shadow: 0 -1px 1px #111;
	letter-spacing: 8px;
	font-size: 130%;
	color: #555;
}

#sitemap_container {
	float: left;
	width: 100%;
	padding: 7px 0 0;
	border-top: 1px solid #3f3f3f;
}

#sitemap ul {
	display: block;
	float: left;
	width: 130px;
	margin: 0;
	padding: 5px 0 7px;
	border-top: 1px solid #3c3c3c;
	border-bottom: 1px solid #111;
	list-style: none;
}

#sitemap li {
	line-height: 1;
	float: left;
	width: 100%;
}

#sitemap a {
	display: block;
	position: relative;
	padding: 0 0 0 8px;
	color: #b3605e;
}

#sitemap a:hover,
#site_info a {
	color: #c7b3af;
	text-decoration: none;
}

#site_info {
	float: left;
	width: 213px;
	padding: 35px 13px 20px;
	border-left: 1px solid #111;
	color: #a7aaad;
}

#site_info p {
	padding: 0;
}

#footer_site_title,
#copyright {
	font-family: "Century Gothic", Geneva, Arial, Helvetica, sans-serif;
	font-size: 120%;
}

#footer_site_title b {
	font-weight: normal;
	font-size: 141%;
	text-shadow: 0 -1px 1px #000;
}

#copyright {
	padding: 7px 0 53px 3px;
	letter-spacing: -1px;
	color: #777;
}


/* CLASS STYLES
------------------------------------------------------------ */

.clear {
	clear: both;
	font-size: 1px;
	line-height: 1px;
}

br.clear {
	float: left;
	clear: both;
	width: 100%;
	font-size: 1px;
	line-height: 1px;
}

.small {
	font-size: 70%;
}

.xsmall {
	font-size: x-small;
}

.photo,
.photae {
	padding: 2px;
	background: #fff;
	border: 1px solid #888;
}

.hidden {
	display: none;
}

.offscreen {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	border: 0;
	clip: rect(0 0 0 0);
	background: #fafafa;
	color: #444;
}


/* Context menu styles
------------------------------------------------------------ */

#context_menu {
	float: left;
	width: 140px;
}

#context_menu ul,
#context_menu ul li {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#context_menu ul {
	width: 138px;
	margin: 0 0 10px;
	border: 1px solid #000;
}

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

#context_menu ul li {
	line-height: 110%;
}

#context_menu ul a {
	display: block;
	width: 118px;
	padding: 3px 10px 3px 8px;
	background: #815d57;
	border-top: 1px solid #c5ada7;
	border-bottom: 1px solid #333;
	border-left: 2px solid #333;
	text-decoration: none;
	color: #eeeadc;
	font-size: 80%;
}

#context_menu ul a:hover,
#context_menu ul a.active,
#context_menu ul a.active:hover {
	border-bottom: 1px solid #333;
	background: #95716b;
	color: #fff;
}

#context_menu ul ul {
	line-height: 110%;
	border: none;
}

#context_menu ul ul a {
	display: block;
	width: 118px;
	padding: 2px 8px 2px 10px;
	background: #c9c6b8;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #777;
	text-decoration: none;
	color: #222;
	font-size: 9px;
}

#context_menu ul ul a:hover {
	background: #dad8cf;
	border-bottom: 1px solid #777;
	color: #444;
}

#context_menu ul ul a.active,
#context_menu ul ul a.active:hover {
	background: #e3e2db;
	border-top: 1px solid #bbb;
	border-bottom: 1px solid #fff;
	color: #222;
}


/* Alphabet menu styles
------------------------------------------------------------ */

#alphabet_wrapper {
	margin: 0 auto;
}

#alphabet_container {
	float: left;
	margin: 0 0 10px;
	padding: 5px 0 10px 10px;
}

#alphabet_container ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

#alphabet_container ol li {
	float: left;
}

#alphabet_container ol li a,
#alphabet_container ol li span.no_link {
	float: left;
	width: 22px;
	padding: 5px 0;
	margin: 0 4px 0 0;
	border: 1px solid #dfd3c6;
	background: url(../images/layout/archive_calendar_bg.gif) no-repeat top #815d57;
	text-align: center;
	font-weight: bold;
	color: #fcf9ee;
}

#alphabet_container ol li a:hover,
#alphabet_container ol li a:focus {
	background: #fff;
	text-decoration: none;
	color: #444;
}

#alphabet_container ol li span.no_link {
	background: #f5f2e2;
	color: #dfd3c6;
}

.last {
	margin: 0;
}

/* form styles
------------------------------------------------------------ */

#form_errors {
	padding: 10px 20px;
	border: 1px dotted #dca592;
	background: #faf1f1;
}

#form_errors ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#form_errors li {
	padding: 0 0 0 22px;
	background: url(../images/layout/form_error.gif) no-repeat left 2px;
	line-height: 170%;
}

#form_errors label {
	font-weight: bold;
	color: #9e3030;
	cursor: pointer;
}


.optional {
	font-size: 70%;
	letter-spacing: 1px;
	font-style: normal;
	color: #ccc;
}

.code {
	display: block;
	width: 80%;
	margin: 5px auto 7px;
	padding: 30px 10px 20px 50px;
	background: url(../images/layout/code_bg.gif) no-repeat top left #DEE7ED;
	border: 1px solid #C4CDDB;
	font-family: "Courier New", Courier, monospace;
	line-height: 140%;
	color: #004E9B;
	/* white-space: pre; causes no wrapping... */
	overflow: auto; /* h- 15.6.2014  code won't wrap so better to have some way to see it */
}

blockquote {
	padding: 10px;
	border: 1px solid #dfd3c6;
	background: url(../images/layout/quote_bg2.gif) no-repeat top right #f8f4e4;
	font-style: italic;
}