/*
Design by Joakim Rannikko
for MyCosmik.com
*/

body {
	margin: 30px 0;
	padding: 0;
	background-color: #c8c8c8;
	text-align: justify;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #898989;
}

p {
	margin: 4px 0;
	padding: 0;
}

h1, h2, h3 {
	margin-top: 0;
}

h1 {
	font-size: 16px;
	font-weight: normal;
}

h2 {
	font-size: 12px;
}

h3 {
	font-size: 15px;
}

ul {
}

a {
	text-decoration: none;
	color: #9a7d48;
	font-weight: bold;
}

a:hover {
	border-bottom: none;
}

a img {
	border: none;
	padding: 0;
	margin: 0;
}

/* tables */
table, th, td, tr {
	border: none;
	text-align: left;
	vertical-align: top;
	font: 10px Arial, Helvetica, sans-serif;
	margin: 0 auto;
}

table ul {
	padding: 0 0 0 15px;
	margin: 0;
	list-style-image: url(images/simple/small_bullet.gif);
}

table li {
	padding-bottom: 8px;
}

table strong {
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
}


/* Header */
#header-wrapper {
	width: 100%;
	height: 104px;
}

#header {
	width: 960px;
	margin: 0 auto;
	height: 104px;
	background: url(images/header.jpg) no-repeat top left;
}

#logo {
	width: 260px;
	height: 74px;
	margin: 20px 10px 10px 20px;
	float: left;
	background: url(images/logo.gif) no-repeat top left;	
}

#social {
	width: 640px;
	margin: 10px;
	height: 18px;
	padding: 0;
	float: right;
	text-align: right;
}

#social img {
	padding: 0;
	margin: 0;
	border: none;
}

#join_pocp {
	width: 640px;
	margin: 6px 10px 0 20px;
	height: 22px;
	padding: 0;
	float: left;
}


#menu {
	width: 640px;
	margin: 10px 10px 0 10px;
	height: 24px;
	padding: 0;
	float: right;
}

#menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
	float: right;
}

#menu li {
	padding: 0;
	margin: 0;
	display: inline;
}

#menu a {
	margin: 0;
	padding: 8px 20px 0 20px;
	text-decoration: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: normal;
}

#menu a:hover {
	background: url(images/menu_arrow.gif) no-repeat top center;
}

#menu .current_page_item a {
	color: #898989;
	background: url(images/menu_arrow.gif) no-repeat top center;
}


/* Image and greenbox under header/menu */
#image-wrapper {
	width: 960px;
	height: 265px;
	margin: 0 auto;
}

#greenbox {
	float: left;
	width: 250px;
	height: 225px;
	padding: 20px;
	margin: 0;
	background: url(images/greenbox.jpg) no-repeat top left;
	color: #FFFFFF;
}

#greenbox h1 {
	font-size: 18px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

#greenbox h2 {
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

#greenbox p {
	font-size: 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

#imagebox {
	float: left;
	width: 630px;
	height: 225px;
	padding: 20px;
	margin: 0;
	background: url(images/eye01.jpg) no-repeat top left;
}


/* Wrapper */
#wrapper {
	width: 100%;
	margin: 0;
	padding: 0;
}


/* Page */
#page {
	width: 960px;
	margin: 0 auto;
	padding: 0;
	background: #FFFFFF url(images/mainbg.gif) repeat-y left top;
}

#page_wide_right {
	width: 960px;
	margin: 0 auto;
	padding: 0;
	background: #FFFFFF url(images/mainbg_wide_right.gif) repeat-y left top;
}

#page_wide_left {
	width: 960px;
	margin: 0 auto;
	padding: 0;
	background: #FFFFFF url(images/mainbg_wide_left.gif) repeat-y left top;
}

#page_extra_wide {
	width: 960px;
	margin: 0 auto;
	padding: 0;
	background-color: #FFFFFF;
}

#page-bgtop {
}

#page-bgbtm {
	padding: 0;
}


/* Content */
#content {
	float: left;
	width: 470px;
	padding: 0;
	margin: 0;
}

#content_wide_right {
       float: left;
       width: 670px;
       padding: 0;
       margin: 0;
}

#content_wide_left {
       float: left;
       width: 760px;
       padding: 0;
       margin: 0;
}

#content_extra_wide {
       float: left;
       width: 960px;
       padding: 0;
       margin: 0;
}

.main {
	margin-bottom: 20px;
}

.main p {
	line-height: 150%;
	padding: 5px 20px;
}

.main li {
	line-height: 150%;
	padding: 0px 20px 15px 10px;
}

.main h1 {
	line-height: 100%;
	font-size: 16px;
	padding-top: 4px;
	margin: 0;
	text-indent: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #898989;
}

.main h2 {
	line-height: 90%;
	font-size: 12px;
	padding-bottom: 7px;
	margin: 0;
	text-indent: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #FFFFFF;
	background-color: #898989;
}

.main h3 {
	color: #9a7d48;
	font-size: 12px;
	padding: 20px 20px 2px 20px;
	margin: 0;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.main h4 {
	color: #9a7d48;
	font-size: 12px;
	padding: 0 20px 2px 20px;
	margin: 0;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.title {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	text-indent: 10px;
	font-size: 12px;
	font-weight: normal;
}

.title a {
	border-bottom: none;

}

.byline {
	line-height: 100%;
	padding: 0 0 0 3px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: italic;
}

.byline a {
	color: #9a7d48;
}

.tag {
	padding: 0 15px;
}

.links {
	text-align: right;
	font-weight: bold;
	font-size: 10px;
	float: right;
	padding: 0;
	margin: 0;
}

.links a {
	text-align: right;
}

.links a:hover {
}


/* Sidebars */

#sidebar1 {
	float: left;
	width: 250px;
	padding: 20px;
	margin: 0;
}

#sidebar2 {
	float: right;
	width: 160px;
	padding: 0 20px;
	margin: 0;
}

.sidebar {
	float: left;
	font-size: 11px;
}

.sidebar p {
	line-height: 110%;
	padding: 0;
}


.sidebar img {
	border: 4px solid #FFFFFF;
	margin: 0 auto;
}

.sidebar h1 {
	margin: 0;
	padding: 10px 0 0 0;
	font-size: 16px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #9a7d48;
}

.sidebar h2 {
	margin: 0;
	padding: 10px 0 0 0;
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #9a7d48;
}

.sidebar h3 {
	margin: 0;
	padding: 0;
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #898989;
}

#searchbox {
	width: 240px;
	height: 200px;
	padding: 0;
	margin: 10px auto;
	color: #FFFFFF;
	background: url(images/searchbox.jpg) no-repeat top left;
	line-height: 100%;
}

#searchbox h1 {
	font-size: 16px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	padding: 16px 10px 2px 10px;
	margin: 0;
	color: #FFFFFF;
}

#searchbox h2 {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	padding: 2px 10px 0 10px;
	margin: 0;
	color: #FFFFFF;
}

#searchbox p {
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	padding: 0;
	margin: 2px 10px;
	color: #FFFFFF;
}

#searchbox img {
	border: none;
}

#pocp_menu ul {
	padding: 0;
	Margin: 0;
	list-style-type: none;
}

#pocp_menu li {
	padding: 0 0 2px 0;
	Margin: 0;
	list-style-type: none;
}

#pocp_menu li p {
	line-height: 100%;
	color: #FFFFFF;
}

#pocp_menu a {
	display:block;
	width: 150px;
	height: 38px;
	padding: 13px 0 0 20px;
	margin: 0 0 0 -10px;
	color: #FFFFFF;
	background: url(images/poc_btn.gif) no-repeat top right;
	font-weight: normal;
}

#pocp_menu .selected_item_pocp a {
	display:block;
	width: 150px;
	height: 38px;
	padding: 13px 0 0 20px;
	color: #FFFFFF;
	background: url(images/poc_btn_dark_selected.gif) no-repeat top left;
}

#pocp_menu .selected_item_pocp a:hover {
	background: url(images/poc_btn_dark_selected.gif) no-repeat top left;
}

#pocp_menu strong {
	font-size: 16px;
	font-weight: normal;
}

#pocp_menu h1 {
	font-size: 18px;
	font-weight: normal;
	color: #898989;
	padding: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

#pocp_menu h2 {
	font-size: 12px;
	font-weight: normal;
	color: #898989;
	line-height: 90%;
	padding: 0 0 4px 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

#pocp_menu a:hover {
	background: url(images/poc_btn_light.gif) no-repeat top right;
}

#pocp_menu .summary {
	width: 154px;
	background-color: #FFFFFF;
	border-bottom: 3px solid #898989;
	border-left: 3px solid #898989;
	border-right: 3px solid #898989;
	margin: -11px 0 10px 0;
}

#pocp_menu .summary p {
	color: #898989;
	padding: 6px 4px 4px 4px;
}


/* Footer */

#footer-wrapper {
	width: 100%;
	height: 30px;
}

#footer {
	width: 920px;
	height: 30px;
	margin: 0 auto;
	padding: 0 20px;
	background: #898989;
}

#footer p {
	margin: 0;
	padding: 6px 0;
	text-transform: uppercase;
	font-size: 13px;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
}

#footer a {
	color: #FFFFFF;
}

#copyrightbox {
	width: 270px;
	height: 30px;
	float: left;
}

#menubox {
	width: 650px;
	height: 30px;
	float: right;
	text-align: right;
}


/* Mouse-Over Box */
.balloonstyle {
	position: absolute;
	top: -500px;
	left: 0;
	visibility: hidden;
	border: 2px solid #666666;
	color: #454545;
	z-index: 4000;
	background-color: #f6f6f6;
	width: 300px;
}

.balloonstyle h1 {
	line-height: 100%;
	font-size: 16px;
	padding-top: 4px;
	margin: 0;
	text-indent: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	background-color: #666666;
}

.balloonstyle h2 {
	line-height: 90%;
	font-size: 11px;
	padding-bottom: 6px;
	margin: 0;
	text-indent: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #e5e6ea;
	background-color: #666666;
}

.balloonstyle p {
	line-height: 130%;
	padding: 10px;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #777777;
	font-weight: normal;
}

.balloonstyle ul {
	list-style: lower-roman;
	padding: 10px 10px 10px 30px;
}

.balloonstyle li {
	line-height: 130%;
	padding-bottom: 10px;
}

#arrowhead {
	z-index: 3999;
	position:absolute;
	top: -500px;
	left: 0;
	visibility: hidden;
}

.stickytooltip {
	display: none;
	position: absolute;
	display: none;
	border: 4px solid #777777; /*Border around tooltip*/
	background: #FFFFFF;
	z-index: 3000;
}

.stickytooltip h1 {
	line-height: 100%;
	font-size: 16px;
	padding-top: 4px;
	margin: 0;
	text-indent: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #777777;
}

.stickytooltip h2 {
	line-height: 90%;
	font-size: 11px;
	padding-bottom: 6px;
	margin: 0;
	text-indent: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #FFFFFF;
	background-color: #777777;
}

.stickytooltip h3 {
	color: #898989;
	font-size: 12px;
	padding: 20px 20px 2px 20px;
	text-align: center;
	margin: 0;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.stickytooltip p {
	line-height: 130%;
	padding: 10px;
	margin: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
}

.stickytooltip .stickystatus { /*Style for footer bar within tooltip*/
	background: #777777;
	color: #FFFFFF;
	padding-top: 5px;
	text-align: center;
	font: bold 11px Arial;
}


/* new dynamic menu */
.blockmenu {
	width: 250px; /*width of menu*/
	margin: 0 0 0 5px;
	line-height: 100%;
}

.blockmenu h1 {
	color: #898989;
	font-size: 16px;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding: 0 0 2px 0;
	margin: 0;
}

.blockmenu h2 {
	color: #898989;
	font-size: 12px;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding: 0 0 8px 0;
	margin: 0;
}

.blockmenu .headerbar {
	height: 60px;
	color: #FFFFFF;
	background: transparent url(images/mb.png) no-repeat top left;
	line-height: 100%;
	margin: 0;
	padding: 0;
}

.blockmenu .headerbar h1 {
	color: #FFFFFF;
	font-size: 16px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	padding: 0 0 2px 0;
	margin: 0;
}

.blockmenu .headerbar h2 {
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	padding: 0 0 2px 0;
	margin: 0;
}

.blockmenu a {
	text-decoration: none;
	padding: 14px 0 20px 20px;
	display: block;
}

.blockmenu a:hover {
	text-decoration: none;
	background: transparent url(images/mb_hover.png) no-repeat top left;
	display: block;
}

.blockmenu ul {
	padding: 5px 0 0 15px;
	margin: 0;
	list-style-image: url(images/simple/small_bullet.gif);
}

.blockmenu li {
	padding-bottom: 8px;
}


.openedmenu a {
	text-decoration: none;
	background: transparent url(images/mb_selected.png) no-repeat top left;
	display: block;
}

.openedmenu a:hover {
	text-decoration: none;
	background: transparent url(images/mb_selected.png) no-repeat top left;
	display: block;
}

.subcontent {
	background-color: #f9f9f9;
	color: #777777;
	margin: -10px 10px 10px 0;
	padding: 0 10px 10px 10px;
	border-left: 3px solid #898989;
	border-bottom: 3px solid #898989;
	border-right: 3px solid #898989;
	font-size: 11px;
	line-height: 120%;
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
}

#dynamic_content {
	float: left;
	min-height: 500px;
	padding: 20px 0;
}