/*
B1  	#dcf0ff
B2		#43b2e6
B3		#004cae
B4		#003473
O		#ff6600
G		#f9d918
Gr1
*/

@import url(typography.css);

html {
    background: #dcf0ff url(../gfx/bg_canvas.gif) top repeat-x;
}

.clearFix, .clear {
    width:100%;
    overflow:hidden;
}

input.radio,
input.checkbox {
    vertical-align:middle;
    float: left;
    display: inline;
    margin: 5px;
    border:none;
}

input,
select,
textarea {
    border:1px solid #999;
    padding:1px;
}

form legend {
    display:none;
}


.floatRight {
    float:right;
    position:relative;
}
.floatLeft {
    float:left;
}

div.formRow {
    background: #fff;
    margin-bottom: 1px;
    padding: 5px 10px;
    overflow: hidden;
}

label { font-weight: bold; }

/* Fieldsets */
fieldset    {}
legend      {font-weight: bold; font-size:1.2em; }

/* Text fields */
input.text, input.title   { width: 300px; margin:0.5em 0.5em 0.5em 0; }
input.text, input.title   { border:1px solid #bbb; background:#f6f6f6; padding:5px; }
input.text:focus,
input.title:focus         { border:1px solid #999; background:#fff; }
input.title               { font-size:1.5em; }

/* Textareas */
textarea            { width: 400px; height: 250px; margin:0.5em 0.5em 0.5em 0; }
textarea            { border:1px solid #bbb; background:#eee; padding:5px; }
textarea:focus      { border:1px solid #999; background:#fff; }

/* Select fields */
select              { border:1px solid #ccc; background:#f6f6f6; width:200px; }
select:focus        { border:1px solid #999; background:#fff; }


/* Success, error & notice boxes for messages and errors. */
.error,
.notice,
.success    { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }
.error      { background: #FBE3E4; color: #D12F19; border-color: #FBC2C4; }
.notice     { background: #FFF6BF; color: #817134; border-color: #FFD324; }
.success    { background: #E6EFC2; color: #529214; border-color: #C6D880; }
.error a    { color: #D12F19; }
.notice a   { color: #817134; }
.success a  { color: #529214; }

/* buttons */

a.button {
    margin:0 0.583em 0.667em 0;
    padding:5px 10px 5px 7px;   /* Links */
    display: block;
    float: right;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;
    background-color:#f5f5f5;
    font-size:100%;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    color:#565656;
    cursor:pointer;
}

a.button img{
    margin:0 3px -3px 0 !important;
    padding:0;
    border:none;
    width:16px;
    height:16px;
    float:none;
}

a.backButton {
    float:left;
}
/* Button colors  */

/* Standard */

a.button {
    background: url(../gfx/bg_button.gif) bottom repeat-x #56b9e8;
    border: 1px solid #fff;
    color: #fff !important;
}

a.button:hover{
    background: #56b9e8;
    text-decoration:none !important;
}

a.button:active{
    background: #358eba;
}

/* disabled */

a.disabled {
    background: #ccc;
    color: #ddd;
    cursor: default;
}

a.disabled:hover {
    background: #ccc;
    color: #ddd;
    cursor: default;
}

a.disabled:active {
    background: #ccc;
    color: #ddd;
    cursor: default;
}

/* secondary */

body a.secondary, body a.secondary:hover {
    background: #dcf0ff !important;
    color: #43b2e6 !important;

}

body a.secondary:hover {
    background: #fff !important;
    color: #43b2e6 !important;
}

body a.secondary:active {
    background: #43b2e6 !important;
    color: #fff !important;
}

/* chrome apppages */

div#header {
    height: 58px;
    background: #000;
    border-bottom: 1px solid #969696;
    position: relative;
}

div#header h1 {
    margin: 0;
    padding: 0;
    width: 200px;
    height: 58px;
    text-indent: -1234em;
    overflow: hidden;
    background: url(../gfx/logo_bosatlas.gif) no-repeat;
}

/* thematic maps*/
body.tk div#header h1 {

}
/* country doc */
body.ld div#header h1 {

}

div#header ul#siteMenu {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 30px;
    height: 23px;
}

body.ld div#header ul#siteMenu {
    width:30px;
}

div#header ul#siteMenu li {
    margin: 0;
    display: inline;
    float: left;
}
div#header ul#siteMenu li a {
    display: block;
    margin: 0;
}

div#header ul#siteMenu li.close a {
    width: 30px;
    height: 23px;
    text-indent: -1234em;
    overflow: hidden;
    background: url(../gfx/bg_siteMenu_close_x.gif) no-repeat;
}

div#header ul#siteMenu li.close a:hover {
    background: url(../gfx/bg_siteMenu_close_hover_x.gif) no-repeat;
}

div#header ul#siteMenu li.help a {
    width: 45px;
    height: 23px;
    text-indent: -1234em;
    overflow: hidden;
    background: url(../gfx/bg_siteMenu_help.gif) no-repeat;
}

div#header ul#siteMenu li.help a:hover {
    background: url(../gfx/bg_siteMenu_help_hover.gif) no-repeat;
}

div#header ul#siteMenu li.logout a {
    width: 91px;
    height: 23px;
    text-indent: -1234em;
    overflow: hidden;
    background: url(../gfx/bg_siteMenu_logout.gif) no-repeat;
}

div#header ul#siteMenu li.logout a:hover {
    background: url(../gfx/bg_siteMenu_logout_hover.gif) no-repeat;
}

body.ld div#header ul#siteMenu li.logout {
    display:none;
}
div#menu {
    height: 34px;
    background: #7f7f7f url(../gfx/bg_menu.gif) bottom repeat-x;
    border-bottom: 1px solid #fff;
    position: relative;
}

div#menu h2 {
    margin:0 0 0 20px;
    text-indent:-1234em;
    height:34px;
}

body.rs div#menu h2 {
    background:url(../gfx/bg_h2_menu_remsensing.gif) 0 0 no-repeat;
}

body.kv div#menu h2 {
    background:url(../gfx/bg_h2_menu_atlastr.gif) 0 0 no-repeat;
}

body.ld div#menu h2 {
    background:url(../gfx/bg_h2_menu_landendoc.gif) 0 0 no-repeat;
}

body.help div#menu h2 {
    background:url(../gfx/bg_h2_menu_help.gif) 0 0 no-repeat;
}

body.tk div#menu h2 {
    background:url(../gfx/bg_h2_menu_themkrt.gif) 0 0 no-repeat;
}

body.vn div#menu h2 {
    background:url(../gfx/bg_h2_menu_verdwnl.gif) 0 0 no-repeat;
}

div#menu ul li.makeMap a {
    display: block;
    width: 124px;
    height: 34px;
    overflow: hidden;
    text-indent: -1234em;
    background: url(../gfx/bg_menu_makeMap.gif) top no-repeat;
}

div#menu ul li.makeMap a:hover {
    background: url(../gfx/bg_menu_makeMap_hover.gif) top no-repeat;
}

div#menu ul li.help {
    position: absolute;
    right: 0;
    top: 0;
}

div#menu ul li.help a {
    display: block;
    width: 72px;
    height: 34px;
    overflow: hidden;
    text-indent: -1234em;
    background: url(../gfx/bg_menu_help.gif) top no-repeat;
}

div#menu ul li.help a:hover {
    background: url(../gfx/bg_menu_help_hover.gif) top no-repeat;
}



div#menu ul li.greyed a {
    background: url(../gfx/bg_menu_makeMap_greyed.gif) top no-repeat;
    cursor: default;
    width: 123px;
    height: 34px;
    display: block;
    text-indent: -1234em;
    overflow: hidden;
}
div#menu ul li.greyed a:hover {
    background: url(../gfx/bg_menu_makeMap_greyed.gif) top no-repeat;
    cursor: default;
}


div#canvas {
    padding:20px 20px 0 20px;
}

div#appHolder {

}

ul#appTabs {
    display: block;
    /*width: 100%;*/
    /*overflow: hidden;*/
}

ul#appTabs li  {
    background: url(../gfx/bg_appTab_right.gif) right top no-repeat;
    padding: 0 13px 0 0;
    white-space: nowrap;
    position: relative;
    float: left;
    width: 15%;
    min-width: 150px;
}

ul#appTabs li a {
    display: block;
    background: url(../gfx/bg_appTab_left.gif) left top no-repeat;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    display: block;
    font-weight: bold;
    text-decoration: none;
    font-size: 12px;
    letter-spacing: 1px;
}

ul#appTabs li.selected {
    background: url(../gfx/bg_appTab_sel_right.gif) right top no-repeat;
}

ul#appTabs li.selected a {
    background: url(../gfx/bg_appTab_sel_left.gif) left top no-repeat;
    color: #fff;
}

ul#appTabs li em {
    padding: 9px 0 7px 15px;
    margin: 0 20px 0 0;
    font-weight: bold;
    line-height: 1em;
}

ul#appTabs div.closeTab {
    width: 13px;
    height: 13px;
    position: absolute;
    right: 10px;
    top: 9px;
}

ul#appTabs div.closeTab a {
    overflow: hidden;
    background: url(../gfx/appTab_close.gif) no-repeat;
    width: 13px;
    height: 13px;
    display: block;
    text-indent: -1234em;
    overflow: hidden;
    position:relative;
    /*z-index:99;*/
}

ul#appTabs li.selected div.closeTab a {
    background: url(../gfx/appTab_sel_close.gif) no-repeat;
}

/* YUI tabs CSS */

.yui-navset .yui-nav li,.yui-navset .yui-navset-top .yui-nav li,.yui-navset .yui-navset-bottom .yui-nav li {
    margin: 0;
}

.yui-navset-left .yui-nav li,.yui-navset-right .yui-nav li {
    margin:0 0 0.5em;
}

.yui-navset .yui-navset-left .yui-nav,.yui-navset .yui-navset-right .yui-nav,.yui-navset-left .yui-nav,.yui-navset-right .yui-nav {
    width:6em;
}

.yui-navset-top .yui-nav,.yui-navset-bottom .yui-nav {
    width:auto;
}

.yui-navset .yui-navset-left,.yui-navset-left {
    padding:0 0 0 6em;
}

.yui-navset-right {
    padding:0 6em 0 0;
}

.yui-navset-top,.yui-navset-bottom {
    padding:auto;
}

.yui-nav,.yui-nav li {
    margin:0;padding:0;list-style:none;
}

.yui-navset li em {}

.yui-navset {
    position:relative;zoom:1;
}

.yui-navset .yui-content {
    zoom:1;
}

.yui-navset .yui-nav li,.yui-navset .yui-navset-top .yui-nav li,.yui-navset .yui-navset-bottom .yui-nav li{
    display:inline-block;display:-moz-inline-stack;*display:inline;vertical-align:bottom;cursor:pointer;zoom:1;
}

.yui-navset-left .yui-nav li,.yui-navset-right .yui-nav li {
    display:block;
}

.yui-navset .yui-nav a {
    position:relative;
}

.yui-navset .yui-nav li a,.yui-navset-top .yui-nav li a,.yui-navset-bottom .yui-nav li a {
    display:block;display:inline-block;vertical-align:bottom;zoom:1;
}

.yui-navset-left .yui-nav li a,.yui-navset-right .yui-nav li a {
    display:block;
}

.yui-navset-bottom .yui-nav li a {
    vertical-align:text-top;
}

.yui-navset .yui-nav li a em,.yui-navset-top .yui-nav li a em,.yui-navset-bottom .yui-nav li a em {
    display:block;
}

.yui-navset .yui-navset-left .yui-nav,.yui-navset .yui-navset-right .yui-nav,.yui-navset-left .yui-nav,.yui-navset-right .yui-nav {
    position:absolute;z-index:1;
}

.yui-navset-top .yui-nav,.yui-navset-bottom .yui-nav {
    position:static;
}

.yui-navset .yui-navset-left .yui-nav,.yui-navset-left .yui-nav {
    left:0;right:auto;
}

.yui-navset .yui-navset-right .yui-nav,.yui-navset-right .yui-nav {
    right:0;left:auto;
}

div#appContentHolder {
    background:url(../gfx/bg_appContent.gif) left top no-repeat;

}

div#appContentHolder div.appRight {
    background: transparent url(../gfx/bg_appContent_right.gif) right top no-repeat;
    padding: 0;
    margin: 0;
}

div#appContentHolder {
    min-height: 480px;
}

div#ajaxLoadRegion {
    background:#fff;
}

div.showAjaxTabLoader {
    background-image:url(../gfx/ajax-loader_blue.gif) !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
}

div#appContentHolder div.appContent {
    border-top: 1px solid #43b2e6;
    padding: 20px;
    margin: 0 4px 0 5px;
    min-height: 500px;
    /*background:url(../gfx/ajax-loader_blue.gif) center center no-repeat; /* add-on */
    overflow:hidden;
    width:auto;
    background:#fff;
}

div.appMenu {
    float: left;
    width: 20%;
}

div.appMenu ul {
    display: block;
}

div.appMenu ul li {
    margin-bottom: 10px;
    display: block;
    background: #f2f2f2;
}

div.appMenu ul li.active {
    background: #dcf0ff;
}

div.appMenu ul li.expanded {
    background: #43b2e6;
}

div.appMenu ul li ul {
    margin: 0 0 0 5px;
    padding-bottom: 10px;
    display: none;
    background: #f2f2f2;
}


div.appMenu ul li.expanded ul {
    display: block;
    background: #43b2e6;
}

div.appMenu ul li ul li {
    display: block;
    margin: 0;
    padding: 3px 5px;
}

div.appMenu ul li ul li.inactive a,
div.appMenu ul li ul li.inactive a:hover {
    color: #000;
}

div.appMenu a.displayMap,
div.appMenu a.displayMap:hover {
    color:#fff !important;
}

div.appMenu ul li.expanded ul li {
    background: #43b2e6;
}

div.appMenu ul li a,
div.appMenu ul li span	 {
    padding: 10px 10px 10px 20px;
    color: #ccc;
    cursor: default;
    display: block;
    font-weight: bold;
}

div.appMenu ul li ul li.inactive span,
div.appMenu ul span.inactive {
    color:#8DCEF1;
    cursor:default;
    padding:0;
    display:inline;
    font-weight:normal;
}

div.appMenu ul li ul li ul li.inactive span {
    font-size:11px;
}

div.appMenu ul li a:hover {
    text-decoration: none;
}

div.appMenu ul li a,
div.appMenu ul li span	 {
    min-height:18px;
}
div.appMenu ul li.active a {
    cursor: pointer;
    color: #43b2e6;
    display:  block;
    background: url(../gfx/menu-arrow-closed.gif) no-repeat 5px 14px;
    height:18px;
}

div.appMenu ul li.active a:hover {
    color: #fff;
    background: url(../gfx/menu-arrow-closed-hover.gif) no-repeat 5px 14px #43b2e6;
}

div.appMenu ul li.expanded a {
    cursor: pointer;
    color: #fff;
    background: url(../gfx/menu-arrow-expanded.gif) no-repeat 5px 14px;
}
div.appMenu ul li.expanded a:hover {
    color: #fff;
    background: url(../gfx/menu-arrow-expanded.gif) no-repeat 5px 14px;
}
body.kv div.appMenu ul li.expanded {
    padding-top:10px !important;
}

body.kv div.appMenu ul li.expanded ul li ul {
    display:block;
    margin:0;
}

body.kv div.appMenu ul li.expanded a,
body.kv div.appMenu ul li.expanded a:hover,
body.ld div.appMenu ul li.expanded a,
body.ld div.appMenu ul li.expanded a:hover,
body.help div.appMenu ul li.expanded a,
body.help div.appMenu ul li.expanded a:hover,
body.rs div.appMenu ul li.expanded a,
body.rs div.appMenu ul li.expanded a:hover {
    background:none !important;
}

div.appMenu ul li.expanded li a {
    cursor: pointer;
    color: #fff;
    background: none;
}
div.appMenu ul li.expanded li a:hover {
    background: none;
}
div.appMenu ul ul li a {
    text-decoration: none;
    font-weight: normal;
    padding: 0;
    display: block;
}

div.appMenu ul li.expanded ul li ul {
    display: none;
    padding-bottom: 0;
}

div.appMenu ul li ul li.inactive ul {
    display: block;
}

div.appMenu ul li ul li.inactive ul li a, div.appMenu ul li ul li.inactive ul li a:hover {
    cursor: pointer;
    color: #fff;
    font-size: 11px;
}

body.ld div.appMenu ul li.active a,
body.ld div.appMenu ul li.active span {
    color: #fff;
    background: #43b2e6;
}

body.ld div.appMenu ul.inactive li {
    background:none;
}

div.app {
    float: left;
    width: 80%;
    /*position:relative;
	z-index:2;*/ /* BOSO-77 */
}

div#appIntro {
    padding: 20px;
    margin: 0 0 0 20px;
    background: #43b2e6;
    color: #fff;
    height: 100%;
}

div#appIntro h2 {
    font-weight: bold;
    font-size: 1.5em;
    color: #dcf0ff;
    margin: 0 0 20px 0;
}

div#appIntro ul {
    margin: 0;
    padding: 0;
}

div#appIntro ul li, div#appIntro div.highlight {
    background: #fff;
    color: #bbb;
    margin: 10px 0 0 0;
    overflow: hidden;
    width:100%;
    position: relative;
}

div#appIntro ul li.newMap_myData,
div#appIntro ul li.newMap_GPSData {

}

div#appIntro div#mapQuestion.highlight {
    width:auto;
    padding:10px;
}

div#appIntro div.mapControls {
    margin:10px;
}

div#appIntro ul li {
    padding:10px;
    width:auto;

}

div#appIntro ul li a.uitleg {
    padding: 0 0 0 15px;
    background: url(../gfx/icn_info.gif) left no-repeat;
}

div#appIntro ul li a.uitlegVideo {
    /*padding: 0 0 0 21px;
	background: url(../gfx/icn_video.gif) left no-repeat;*/
}

div#appIntro ul li a {
    color: #43b2e6;
    font-weight: bold;
}

div#appIntro h3 {
    font-size: 1.167em;
    margin-bottom: 10px;
    padding: 0;
}

div#appIntro li div.rightButton {
    position: absolute;
    right: 20px;
    top: 20px;
    width: 150px;
}

div#appIntro li div.rightButton a ,
div#appIntro li div.rightButton a:hover {
    margin: 0;
    text-decoration:none !important;
}

div#appIntro ul li p {
    font-size: 0.917em;
    margin: 0;
}

div#appIntro ul li p.helpLinks {
    margin-bottom: 0;
    padding: 0;
    line-height: 100%;
}

div#appIntro ul li p.rightButton {
    float: right;
    display: inline;
}

div#tabContentFooter {
    height: 15px;
    background: url(../gfx/bg_appContentFooter.gif) left top no-repeat;

}

div#tabContentFooter div{
    display: inline;
    float: right;
    width: 15px;
    height: 15px;
    background: url(../gfx/bg_appContentFooter_right.gif) right top no-repeat;

}

div.notify, div#barDisplayNotify {
    margin: 0;
    padding: 1px 5px;
    display: block;
    clear: both;
    background:#f9d918;
    border:1px solid #fff;
    color: #000;
    position:relative;
    top:3px;
    margin-bottom:3px;
}

div.lightboxContent div.notify p {
    padding: 0;
    margin: 0;
    display: inline;
    color: #000;
}

/* lightbox content divs */

div#colorScheme,
div#dataDisplay,
div#licenceBox,
div#newMapSetup,
div#yearDiffSetup,
div#printMapPreview {
    padding: 0 10px 0 10px;
    color: #73766c;
    line-height: 1.5em;
}

div#printMapPreview  {
    background:#fff;
}
div#printMapPreview img {
    height:370px;
    margin:5px;
}

div.lightboxContent h3 {
    margin: 5px 0;
}

div.lightboxContent h3 strong {
    color:#000;
}

div.lightboxContent p {
    margin-bottom: 20px;
}

div.lightboxContent form {
    /*margin: 10px 0 0 0;*/
}

div#yearDiffSetup h2 {
    margin:0 0 10px 0;
}

/* tabs */

a#newAppTabLink {
    display:block;
    background:url(../gfx/new-tab-bg2.gif) 0 0 no-repeat;
    height:16px;
    width:71px;
    padding:7px 5px 5px 34px;
    float:left;
    font-size:11px;
    color:#000;
    text-decoration:none;
}

a#newAppTabLink.greyed {
    display:none;
}

ul.tabControls {
    padding: 5px 20px;
    margin: 0 -20px 10px -20px;
    z-index:1;
    position:relative;
    overflow: hidden;
    background: #fff;
    color: #73766C;
    width:100%;
}

ul.tabControls li {
    display:inline;
    float:left;
}

ul.tabControls li a, ul.tabControls li a:hover  {
    display:block;
    text-decoration:none;
    padding: 5px 10px 5px 0;
    font-size:1em;
    line-height:normal;
    float:left;
    border-bottom:2px solid #ccc;
    color: #73766C;
    cursor:default !important;
}

ul.tabControls li a.disabled {
    cursor: default;
    background: #fff;
}

ul.tabControls li.selected a {
    font-weight: bold;
    border-bottom: 2px solid #73766C;
    color: #73766C;
}

div.tabContentSet div.tabContent {
    margin-top:10px;
}

div.tabContentSet div.showTab {
    display:block;
}

div.tabContentSet div.hideTab {
    display:none;
}

div.lightboxFooterNav {
    text-align:right;
    background: #e1dfd4;
    margin:10px 0;
    height:29px;
    overflow:hidden;
    padding:5px 0pt 5px 5px;
}

div.lightboxFooterNav a.tabLink.inactive {
    text-decoration:none;
    color:#999;
    cursor:arrow;
}

/* colorscheme wizard */

div#colorScheme select {
    width:160px;
}

ul#colorSchemePreview {
    display:inline;
}

ul#colorSchemePreview li {
    padding:0 8px 0 8px;
    line-height:10px;
    display:inline;
}


ul#colorSchemeSetup li {
    display:block;
    background: #fff;
    margin-bottom: 1px;
    padding: 3px 10px 3px 205px;
}

ul#colorSchemeSetup.singleColor li {
    padding: 5px 10px 5px 10px;
}

ul#colorSchemeSetup li a.previewColor,
a.previewColor {
    padding:0 10px;
    line-height:150%;
    cursor:pointer;
    border:1px solid #000;
    text-decoration:none;
    margin:0;
}

div.mapLegend a.previewColor {
    cursor:default;
}

div#printMapPreview embed {
    width:550px;
    height:363px;
}

ul#colorSchemeSetup input.textField {
    border:none;
    background-color:#EEE;
    width:80px;
    height:18px;
    padding:2px
}

ul#colorSchemeSetup input.disabled {
    background:#CCC;
    color:#aaa;
}

ul#colorSchemeSetup input.legendRangeError {
    background:#FFB3B3;
}

span.legendRangeError {
    color:#ff0000;
    font-weight:bold;
    display:block;
    position:relative;
    top:-5px;
}

ul#colorSchemeSetup input.hidden {
    display:none;
}

div#colorPickerContainer {
    height:205px;
    width:380px;
    position:absolute;
    z-index:99;
    background:#ddd;
    border:1px solid #000;
    display:none;
    top:216px;
}

div#colorPicker #setColor,
div#colorPicker #cancelColorPicker {
    left:258px;
    top:168px;
    position:absolute;
}

div#colorPicker #cancelColorPicker {
    left:297px;
}

div#colorPicker .hd {
    font-size:11px;
    display:none;
}

div#colorPicker .bd {
    background:none;
}

ul#dataArrangement li {
    float:left;
    display:block;
    width:160px;
    margin-right:20px;
}

ul#dataArrangement div.jumpIn   {
    margin:10px 0 0 18px;
    clear:both;
}
ul#dataArrangement div.jumpIn p {
    font-size: 0.917em;
}

ul#dataArrangement label {
    position:relative;
    top:2px;
}
/* datatable */
div#dataTableDiv,
div#dataTableDiv2 {
    padding: 0;
}
div#dataTableDiv table#dataTable,
div#dataTableDiv2 table#dataTable	 {
    display:none;
}

div#dataTableDiv table,
div#dataTableDiv2 table,
div#ownMapDataTableDiv table {
    width:640px;
    font-size:85%;
    position:absolute;
}

div#dataTableDiv table caption,
div#dataTableDiv2 table caption,
div#ownMapDataTableDiv table caption {
    display:none;
}

div#dataTableDiv table input.checkbox,
div#dataTableDiv2 table input.checkbox {
    vertical-align:middle;
    margin-right:5px;
}

div#dataTableDiv table tr.highlight td,
div#dataTableDiv2 table tr.highlight td  {
    background-color:#B2D2FF;
    color: #000;
}

.yui-skin-sam .yui-dt-liner {
    padding:1px 5px !important;
}

div#ownMapDataDiv table{
    width:97%;
}
div#ownMapDataDiv ul {
    border:1px solid #7F7F7F;
}

div#ownMapDataDiv ul li {
    overflow:hidden;
    background:#FFF;
    padding:3px;
    margin:1px;
}

div#ownMapDataDiv ul li.even {
    background:#EDF5FF;
}

div#ownMapDataDiv ul li.header {
    background:#D8D8DA url(../js/yui/build/assets/skins/sam/sprite.png);
    font-weight:bold;
    padding:4px;
    margin:0;
}

div#ownMapDataDiv ul li div {
    width:190px;
    float:left;
}

div#ownMapDataDiv ul li div.label {
    width:380px;
}
/* forms */

form#licenceForm {
    margin-bottom:20px;
}

form#newMapSetupForm select,
form#ownDataMapForm select,
select.select{
    width:230px;
}

form#ownDataMapForm input.textField,
form#newBosatlasMapSetupForm input.textField,
form input#mapNameInput,
form input#mapUnitSelect,
form input#userThemeYear	{
    width:226px;
}

form#ownDataMapForm input#mapNameInput {
    margin-left:5px;
}

div.lightboxContent label {
    float:left;
}

div.lightboxContent fieldset {
    padding:0;
    margin:0;
}

div.lightboxContent div.diagramOptions {
    text-align:right;
    padding-right:30px;
    margin:5px 0;
}
div.diagramOptions {

}
div.diagramOptions input {
    vertical-align:middle;
    margin:0 3px;
}

div.diagramOptions label {
    float:none;
    font-weight:normal;
    text-transform:capitalize;
} 

form#newGpsMapDisplayForm div.leftFormCol {
    float:left;
    width:300px;
}

form#newGpsMapDisplayForm div.rightFormCol {
    float:left;
    width:260px;
}

form#ownDataMapDataForm fieldset {
    margin-bottom:10px;
}
div#mapDetails,
div#backgroundDetails,
div#backgroundUploadProgress{
    display:none;
}

div#ownDataMapSettingsTab div.leftCol {
    width:170px;
}

div#ownDataMapSettingsTab div.leftCol input {
    width:136px;
}

/* tooltip */

a.tooltip {
    line-height:12px;
    padding:0 3px 0 10px;
    text-decoration:none!important;
    cursor:help;
    font-weight:bold;
    background: url(../gfx/icn_info_blauw.gif) right no-repeat;
}

a.tooltip.noIcon {
    background:none !important;
    padding:0;
}


.yui-tt {
    width:160px;
    text-align:left;
    font-size:86%;
    z-index:99999;
}

.yui-tt .hd {
    font-weight:bold;
}

.yui-tt-shadow {
    bottom:-3px;
    left:-3px;
    right:-3px;
    top:2px;
    position:absolute;
    display:block;
    z-index:-1;
}

/* lightbox panel styling */

.mask {
    -moz-opacity: 0.75;
    opacity:.75;
    filter: alpha(opacity=75);
    background-color: #43b2e6;
}

div#lightboxPanel.yui-panel {
    border: 1px solid #fff;
}

.yui-panel .container-close {
    cursor:pointer;
    height:15px;
    position:absolute;
    right: 0px;
    top:11px;
    width:28px;
    background:transparent url(../gfx/appTab_sel_close.gif) no-repeat scroll 0pt 0px;
}

div#lightboxPanel {
    background:#e1dfd4;
}

div.showAjaxLightboxLoader {
    background-image:url(../gfx/ajaxloader-lightbox.gif) !important;
    background-position:center center !important;
    background-repeat:no-repeat !important;
}

div.mapLegendContainer div.hd {
    display:none;
}

div.mapLegendContainer .toggleOut {
    height: auto !important;
    overflow: hidden;
}

div#lightboxPanel .lightboxScrollableContent {
    height:240px;
    padding:5px;
    overflow:scroll;
    background:#fff;
    position:relative;
    width:660px !important;
    overflow-x:hidden;
}

div#dataTableDiv {
    padding: 0;
}

.yui-panel .bd  {
    background: #ecebe0;
    padding: 0px;
    height:90%;
}

.yui-panel .bd p {
    margin:1em 0;
}

.yui-panel .hd {
    background: #0077ad;
    color: #fff;
    font-size: 1.5em;
    border: none;
    padding: 10px;

}

div#UploadProgressContainer {
    background:#fff;
    border:1px solid #000;
    height:18px;
}

/*map*/

div.map {
    width: 100%;
    overflow: hidden;
    background: #fff;
    position: relative; /* BOSO-77 off */
}

div.svgMapContainer {
    width:600px;
    height:396px;
    padding:10px;
    border:1px solid #43B2E6;
    margin-left:20px;
}

div.svgChartContainer {
    width:600px;
    height:396px;
    padding:0px;
    border:0px solid #43B2E6;
    margin-left:20px;
}

div.svgBackgroundContainer {
    width:600px;
    height:396px;
    padding:10px;
    border:1px solid #43B2E6;
    margin-left:20px;
}

.zoomIn { display: block; width: 13px; height: 13px; background: url(../gfx/zoomIn.gif) left top no-repeat; text-indent: -1234em; margin-left: 4px; overflow: hidden;}
.zoomOut { display: block; width: 13px; height: 13px; background: url(../gfx/zoomOut.gif) left top no-repeat; text-indent: -1234em; margin-left: 4px; margin-top: 5px; overflow: hidden;}

/* SVG custom tooltip */

div.svgTTNode {
    padding:3px;
    margin-left:20px;
    font-weight:bold;
}

/* Map legend */

div.mapLegend {
    padding: 0;
    position: relative;
    border:1px solid #43B2E6;
    background:#fff;
    opacity:0.9;
}

div.mapLegendContent p.printLegendText,
div.mapLegendContent h4.printLegendLabel {
    display:none;
}
div.mapLegend.print {
    border:none;
}

div.mapLegend h2 {
    background: #43b2e6;
    color:#fff;
    overflow: hidden;
    height: 22px;
    cursor:move;
    margin: 0;
    padding:3px 0 0 5px;
}

div.mapLegend div.mapTitle {
    border-top: 1px solid #b0b4a8;
    border-bottom: 1px solid #b0b4a8;
    padding: 10px;
    margin: 0;
    color: #000;
    font-weight: bold;
}

div.mapTitle h3 {
    font-size:1.086em;  /*1.167em;*/
    margin: 0 0 5px 0;
}

div.mapTitle p {
    font-size: 1em;
    margin: 0 !important;
}

div.mapLegend a.toggleLegend {
    position: absolute;
    right: 5px;
    top: 3px;
    width: 13px;
    height: 13px;
    text-indent: -1234em;
    overflow: hidden;
    background: url(../gfx/btn_minimize.gif) no-repeat;
    cursor: hand;
    cursor: pointer;
}

div.mapLegend div.legendFooter {
    border-top: 1px solid #b0b4a8;
    margin:5px 0;
    padding: 10px;
    font-weight: bold;
}

div.mapLegend ul span {
    padding:0 3px;
}

div.mapLegend ul span.printSquare,
div.mapLegendContainer span.printSquare {
    display:none;
}
div.mapLegendContainer {
    position:absolute;
    height:20px;
    width:180px;
    right:0;
    z-index:10;
}

div#printLegendContainer {
    width:140px;
    font-size:9px;
    right:5px;
}

div#printLegendContainer a.previewColor {
    padding:0 4px;
}

div.mapLegendContainer div.yui-panel {
    border: 1px solid #7b7f75;
    background: #ECEBE0;
}


div.mapLegendContent h4 {
    padding: 0;
    margin: 10px 10px 5px 10px;
}

div.mapLegendContent p {
    margin: 0 10px;
}

div.mapLegendContent ul {
    margin: 10px;
}

div.mapLegendContent table {
    width:160px;
    margin:10px;
}

div.mapLegendContent table tr td {
    font-size:11px;
}

div.mapLegendContent table tr td.colorPreview{
    width:35px;
}
div#printLegendContainer table tr td.colorPreview {
    width:20px;
}

div.mapLegendContent ul li {
    font-weight: bold;
    font-size: 0.917em;
}

div.editLegendHeader {
    background: #dcf0ff;
    margin: 0 -20px;
    padding: 5px 20px;
    font-weight: bold;
    color: #202020;
    border-bottom: 1px solid #0077AD;
}


div#footer {
    margin-top: 10px;
    text-align: center;
    color: #43B2E6;
}


/*Landendocumentatie*/

body.ld div#header h1 {

}

body.ld div#menu ul li.selCountry a {
    display: block;
    width: 105px;
    height: 34px;
    overflow: hidden;
    text-indent: -1234em;
    background: url(../gfx/bg_menu_selCountry.gif) top no-repeat;
}

body.ld div#menu ul li.selCountry a:hover {
    background: url(../gfx/bg_menu_selCountry_hover.gif) top no-repeat;
}

body.ld div#menu ul li.greyed a {
    background: url(../gfx/bg_menu_selCountry_greyed.gif) top no-repeat;
    cursor: default;
}

body.ld div#menu ul li.greyed a:hover {
    background: url(../gfx/bg_menu_selCountry_greyed.gif) top no-repeat;
    cursor: default;
}

div#countryAlfabet.highlight p {
    margin:10px;
}
div#countryAlfabet.highlight a {
    cursor: pointer;
    cursor: hand;
    padding: 3px;
}
div#countryAlfabet.highlight a:hover {
    color: #fff;
    background: #43B2E6;
    text-decoration: none;
}

div#countryAlfabet a.active {
    color:#bbb !important;
    text-decoration:none !important;
    cursor:arrow !important;
}

div#alfabetLetter.floatLeft {
    margin-right: 40px;
    font-size: 30px;
    line-height:30px;
}

div#countryResult div.countryResultContent,
div#maptrainerStart div.maptrainerStartContent	 {
    margin:10px;
    overflow:hidden;
}

div.countryList {
    display:none;
}
div.countryList li {
    margin: 0 !important;
    padding: 0 !important;
}

div#countryArticle {
    padding: 0 20px;
    background:#fff;
}


div#countrySwitch {
    margin-bottom: 20px;
}
div#countrySwitch div.prevCountry, div#countrySwitch div.nextCountry {
    display: inline;
    font-weight: bold;
}

div#countrySwitch div.prevCountry {
    float: left;
}

div#countrySwitch div.nextCountry {
    float: right;
}

div#countryArticle table {
    width: 100%;
    margin-bottom: 40px;
}

div#countryArticle table tr td, div#countryArticle table tr th {
    border-bottom: 1px solid #aaa;
    padding: 4px 0;
    vertical-align: top;
}
div#countryArticle table tr td.countryMap {
    padding-left: 20px;
    text-align: right;
}

div#countryArticle table tr th {
    font-weight: bold;
    width: 30%;
}

div#countryArticle.appArticle h2 {
    color:	#000;
    font-size: 1.5em;
    font-weight: bold;
    margin: 0pt 0pt 20px;
}

div#countryArticle.appArticle h3 {
    color:	#43B2E6;
    font-size: 1.2em;
    font-weight: bold;
    margin: 0pt 0pt 20px;
}

/*styling maptrainer*/

body.kv div#maptrainerStart div.floatLeft,
body.rs div#maptrainerStart div.floatLeft	 {
    width: 48%;
}


body.kv div#maptrainerStart div.floatLeft li,
body.rs div#maptrainerStart div.floatLeft li {
    margin: 0;
    padding: 0;
}

div#appIntro div.highlight h3 {
    color: #000;
}

h1.kvHeader {
    margin-bottom:10px;
    font-size:160%;
}
div.mapNumber p {
    margin-bottom: 0;
    color: #000;
    margin:10px;
}
div#appIntro div#mapAnswers.highlight {
    padding: 20px 10px 10px 10px;
    width:auto;
}


div#mapQuestion.highlight h3 {
    margin-bottom: 0;
}


div#mapAnswers.highlight a {
    font-weight: bold;
}

div#mapAnswers.highlight a:hover {
    text-decoration: none;
    color: #000;
}

div#mapAnswers.highlight a span.answerNumber {
    padding: 5px;
    background: #ddd;
    margin-right: 10px;
    line-height: 0;
    border: 1px solid #ddd;
}

div#mapAnswers.highlight a {

}
div#mapAnswers.highlight a span.answerText {
    display:inline;
    float:left;
    margin:-20px 0pt 0pt 30px;
    position:relative;
    cursor:pointer;
}

div#mapAnswers.highlight a:hover span.answerNumber {
    padding: 5px;
    background: #fff;
    border: 1px solid #000;
    margin-right: 10px;
}

div#mapAnswers.highlight p.selected a {
    color: #000;
}

div#mapAnswers.highlight p.selected a span.answerNumber  {
    padding: 5px;
    background: #fff;
    border: 1px solid #000;
}

div#mapAnswers.highlight p.false a {
    color: #ff0000;
}

div#mapAnswers.highlight p.false a span  {
    margin-right:10px;
    padding:5px;
    background: pink;
    border: 1px solid #ff0000;
}

div#mapAnswers.highlight p.true a {
    color: #158F00;
}

div#mapAnswers.highlight p.true a span  {
    padding: 5px;
    background: #92FF7F;
    border: 1px solid #158F00;
}

div#mapAnswers.highlight p.submit a.button  {
    float: left;
}

div#mapAnswers.highlight p.falseInfo {
    padding: 5px;
    background: pink;
    border: 1px solid #ff0000;
    color: #ff0000;
}

div#mapAnswers.highlight p.trueInfo  {
    padding: 5px;
    background: #92FF7F;
    border: 1px solid #158F00;
    color: #158F00;
}

div#mapAnswers.highlight p.submit a.button  {
    float: left;
}


body.kv div.appMenu ul li a,
body.kv div.appMenu ul li span {
    display:inline;
}

body.kv div.appMenu ul li ul li.active a {
    font-weight: bold;
    color: #000;
    cursor: default;
}

body.kv div.appMenu ul li ul li.inactive a {
    color: #8FCFFF;
}

body.kv div.appMenu ul li ul li a span {
    padding: 0 3px;
    border: 1px solid #fff;
    font-weight: bold;
    margin-right: 5px;
}

body.kv div.appMenu ul li ul li a:hover span,
body.kv div.appMenu ul li ul li.false a:hover span,
body.kv div.appMenu ul li ul li.true a:hover span {
    color: #000;
    border: 1px solid #fff;
    background: #fff;
}


body.kv div.appMenu ul li ul li.active a span,
body.kv div.appMenu ul li ul li.active a:hover span {
    border: 1px solid #000;
    background: #000;
    color: #fff;
}

body.kv div.appMenu ul li ul li.inactive a span,
body.kv div.appMenu ul li ul li.inactive a:hover span {
    border: 1px solid #8FCFFF;
    background: transparent;
    color: #8FCFFF;
}

body.kv div.appMenu ul li ul li.true a span {
    background: #92FF7F;
    border: 1px solid #158F00;
    color: #158F00;
}

body.kv div.appMenu ul li ul li.false a span {
    background: pink;
    border: 1px solid #ff0000;
    color: #ff0000;
}

body.help div#header h1 {

}

div#helpArticle {
    padding: 0 20px;
}
div#helpArticle.appArticle h2 {
    color:	#000;
    font-size: 1.5em;
    font-weight: bold;
    margin: 0pt 0pt 20px;
}

div#helpArticle.appArticle h3 {
    color:	#000;
    font-size: 1.2em;
    font-weight: bold;
    margin: 0pt 0pt 20px;
}

div.zoomInOnMap {
    position: absolute;
    text-align:center;
    top: 10px;
    left: 30px;
    z-index: 1;
    padding: 8px;
}

/* ad-on*/
div.slider-bg {
    position: relative;
    background:url(../gfx/bg-v.gif) no-repeat scroll center 2px;
    height:98px;
    width:50px;
}

div.slider-thumb {
    position: relative;
    top:82px;
}

/* pan controls */
div.panControls {
    height:100px;
    width:100px;
    position:absolute;
    margin-left:-24px;
}

div.panControls button {
    border:none;
    background:url(../gfx/pan_arrows.gif) no-repeat;
    height:20px;
    width:20px;
    cursor:pointer;
    font-size:0;
    color:#43B2E6;
    position:absolute;
}

div.panControls button.panLeft {
    background-position: 0 -20px;
    right:63px;
    top:40px;
}
div.panControls button.panRight {
    background-position: -20px -20px;
    top:40px;
    right:17px;
}

div.panControls button.panUp {
    background-position: -20px 0px;
    top:17px;
    right:40px;
}

div.panControls button.panDown {
    background-position: 0 0;
    top:63px;
    right:40px;
}

div.panControls button.resetValues {
    background:url(../gfx/resetValue.gif) no-repeat;
    height:22px;
    width:22px;
    top:39px;
    right:39px;
}

/* map feedback */

div#mapFeedback {
    line-height:1.8em;
    font-size:1em;
    font-weight:bold;
    background:#FFFF80;
    border:1px solid #B7B700;
    width:70em;
    z-index:99;
    position:absolute;
    height:3em;
    padding-left:10px;
    margin-left:20px;
}

div#tooManyTabs {
    border:1px solid #ff0000;
    padding:10px;
    margin:15px;
    background:#FFFF80;
}

div#accountBarDiv {
    color:#FFFFFF;
}

div#accountBarDiv a {
    color:#FFFFFF;
    font-size:0.9em;
    text-transform: uppercase;
    font-weight:bold;
}

div#accountBarDiv a:hover {
    background:url("../gfx/bg_siteMenu.gif") repeat-x scroll 0 0 transparent;

}

div#overlay{
    position: absolute;
    top: 0; /* These positions makes sure that the overlay */
    bottom: 0;  /* will cover the entire parent */
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0.90;
    -moz-opacity: 0.90; /* older Gecko-based browsers */
    filter:alpha(opacity=90); /* For IE6&7 */
}