/* --- portfo-palv_base Style Sheet --- */

html, body {
  height: 100%;
  margin: 0em 0% 0em 0%;
  padding: 0em;
  cursor: default;
  color: black; /* font color */
  font-family: Verdana,Arial,Tahoma,sans-serif; 
  font-size: 100%;
  line-height: 100%;
  background-color:  #d4ffaa; /* overall bg color */

  scrollbar-base-color: #aaff55; /* codepunk.hardwar.co.uk */
  scrollbar-track-color: #d4ffaa;
  scrollbar-face-color: #aaff55; 
  scrollbar-highlight-color: white;
  scrollbar-3dlight-color: #666;
  scrollbar-darkshadow-color: #d4ffaa; 
  scrollbar-shadow-color: #666; 
  scrollbar-arrow-color: #e84858; 
}
body.nomargins {
  margin: 0em 0% 0em 0%; 
  padding: 0em;
  border: 0em;
  cursor: default;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
}

/* --- Main container, Application SPECIFIC --- */ 
table.pagetable {  /* table covering the whole page */
  vertical-align: top;
  width: 100%;  /* try universal change in here */
  height: 100%; 
}
table.pagetable td { /* if no other formatting exists this is used */
  color: black; /* debug */
  font-size: 100%; /* Keep fixed at 100%. Adjust other % font sizes */
}

/* --- STANDARD styles --- */
address, blockquote, caption, center, dd, dir, div, dl, dt, form, li, menu, ol, p, td, th, ul {
  font: normal 100% Verdana,Arial,Tahoma,sans-serif;
}
code, pre {font: normal 100% "Courier New",Courier,fixed-width;
  white-space: pre;}
BLOCKQUOTE {margin: 0;
  line-height: 100%;
} 
sup, sub, small {font-size: 100%;
}
td {line-height: 100%;
}
table {
  color: black; /* debug XXXXXXX */
}
table td {
  color: black; /* debug XXXXXXX */
}
p {margin: 0; 
  padding: 0;
  line-height: 130%;
  white-space: normal;
}
h1, h2, h3, h4, h5, h6 {
  margin: 0em;
  font-family: Arial,Verdana,Tahoma,sans-serif;
  letter-spacing: .05em; }
h1 + h2 {margin-top: -.2em;
}
/* Lists */
ul {margin: 0; /* IE and Opera */
  padding: 0; } /* Mozilla, Netscape, Safari */
ol {margin: 0;
  padding: 0; 
}
ul li {
  margin: .4em 0em 0em 1.3em;
  line-height: 120%;
  list-style-type: disc;
  list-style: outside;}
ul ul li, ol ul li {
  margin: .4em 0em 0em 0em;
  line-height: 120%;
  list-style-type: circle;}
ul ul ul li, ol ul ul li, ul ol ul li, ol ol ul li {
  margin: .4em 0em 0em 0em;
  line-height: 120%;
  list-style-type: disc;
  list-style: inside;
}
ol li {margin: .4em 0% 0em 2em;
  line-height: 120%;
  list-style-type: decimal;
  list-style: outside;}
ol ol li, ul ol li {
  margin: .4em 0em 0em 0em;
  line-height: 120%;
  list-style-type: lower-alpha;}
ol ol ol li, ul ol ol li, ol ul ol li, ul ul ol li {
  margin: .4em 0em 0em 0em;
  line-height: 120%;
  list-style-type: lower-roman;
}
/* Misc */
button {cursor: auto;
}
input {cursor: auto;	
  font: normal 100% "Courier New",Courier,fixed-width;
}
textarea {cursor: text;
  font: normal 100% "Courier New",Courier,fixed-width;
}
select {font: normal 100%;
} 
label {font: normal 90%; /* admin field labels */
} 
hr {height: 2px; /* tip maxdesign.com.au */
  margin: 0; 
  padding: 0em;
  color: #060;
  background: #060;
  border: 0;
}
div {display: inline; /* is default unless float specified */
  margin: 0; /* base px, other em. Use for content & container boxes etc. */
  padding: 0em; /* if all use em -> em, other px for alignment */
  line-height: 100%;
}
.cleardiv {clear: both; /* patch IE 5 & 5.5. http://css.maxdesign.com.au/selectutorial/tutorial_step19.htm */
height: 1em;
} 
span {display: inline;
  margin: 0em;
  padding: 0em;
  line-height: 100%;
}
/* Links */
a {cursor: auto;}
a:link {color: #33f;
  text-decoration: none;
  background-color: transparent;}
a:visited {color: #039;
  text-decoration: none;
  background-color: transparent;}
a:hover {color: #060;
  text-decoration: underline;}
a:active {color: green;
  text-decoration: none;
  background-color: transparent;
}
img, a img {border: 0px;
}

/* ------ STANDARD CLASSES ------ */ 
.normaali, .note, .date, .navigationBar, .normaali table td {
  font-family: Verdana,Arial,Tahoma,sans-serif;
  font-size: 95%;
  line-height: 130%;
}
.normaali {
  white-space: normal;
  padding: 0em; 
  color: black;
}
.kirjoituskone {
  font-family: "Courier New",Courier,fixed-width;	
  font-size: 95%;
  line-height: 130%;
}
.paaotsikko { /* span */
  white-space: nowrap;
  color: black;
  font-family: Arial,Verdana,Tahoma,sans-serif;
  font-size: 200%;
  letter-spacing: .05em; 
  text-decoration: none;
}
.otsikko2, .otsikko3, .otsikko4 {
  display: inline;
  font-family: Arial,Verdana,Tahoma,sans-serif;
  font-size: 160%;
  text-decoration: none;
  line-height: 130%;}
.otsikko3 {
  font-size: 140%;}
.otsikko4 {
  font-size: 120%;
}
.pieni {
  font-size: 80%;
  line-height: 120%;
}

/* Boxes & specific page items */
#boxtoptitle { /* for paaotsikko */
  display: block;
  width: 50%;
  margin: 21px 0 1em 5em;
}
#boxtopnote { /* for Top Note */
  display: block;
  width: 99%;
  margin: .7em 1em 0em 1em; 
  padding: .3em .5em .3em .5em; 
  background-color: yellow;
}
#boxmidnote { /* for Mid Note, Comment */
  display: block;
  width: 99%;
  margin: .5em 1em 0em 1em; 
  padding: .3em .5em .3em .5em; 
}
#boxbottomnote { /* for Bottom Note */
  display: block;
  width: 99%;
  clear: both;
  margin: .5em 1em 0em 1em; 
  padding: .3em .5em .3em .5em; 
  text-align: center;
/*  background-color: yellow;*/
}
.bottomnote { /* span */
  display: inline;
  font-family: Verdana,Arial,Tahoma,sans-serif;
  color: black;
  font-size: 70%;
  line-height: 130%;
}
#boxhowto {
}
.howto {
  width: 100%;
  margin: 0em .9em .5em .9em; 
  padding: .4em .4em .4em .4em; 
  border-left: 5px solid #ff6633; /* */
  background-color: yellow;
}
#boxtip {
}
.tip { 
  padding: .1em 0em .1em 0em; 
  color: black;
  font-size: 80%;
  line-height: 130%;
}
#boxmycopyright { /* for User copyright */
  display: block;
  width: 99%;
  clear: both;
  margin: 0em 1em 0em 1em; 
  padding: .3em 1em .3em 1em;
  text-align: center;
}

/* --- Application SPECIFIC CLASSES --- */ 
.note, .date, {
  padding: 1em 0em 1em 0em; 
}
.navigationBar {
  white-space: nowrap;
  vertical-align: middle;
  padding: .5em 0em .5em 0em; 
}
/* -- Copyright, small text -- */
#boxLeftBottom { /* for service info */
  float: left;
  width: 30%;
  margin: 0; 
  padding: .1em .1em .1em 1em; 
  text-align: left;
}
#boxRightBottom { /* for app copyright */
  float: right;
  width: 20%;
  margin: 0; 
  padding: .1em .5em .1em .1em; 
  text-align: right;
}
.copyright { /* span */
  white-space: nowrap;
  color: black;
  font-family: Tahoma,Arial,sans-serif; 
  font-size: 70%;
  text-decoration: none;
}
.copyright a, .copyright a:visited {
  color: black; 
  text-decoration: none; }
.copyright a:hover, {
  text-decoration: none;
  color: black; }
.copyright a:active {
  color: black; 
  text-decoration: none;
}

/* ---------- Link button styles ------------*/
a.buttonLink, .disabledButtonLink {
  padding: .15em .7em .2em .7em; 
  font-size: 90%;
  font-weight: bold;
} 
.disabledButtonLink {
  border: 1px inset white;
  color: white;
  background-color: #d4ffaa; /*  */}
a.buttonLink {
  white-space: nowrap;
  border: 1px outset #666;
  color: #06c;
  text-decoration:none;
  background-color: #aaff55; /*  */ }
a.buttonLink:visited {
  color: #06c;
  background-color: #aaff55; /*  */ }
a.buttonLink:hover {
  border: 1px inset white;
  color: #060; /*  */
  text-decoration: none;
  background-color: #ddd; /*  */ }
a.buttonLink:active {
}
a.buttonLink#login {
  border: 0px;
  color: black;
  font-weight: normal;
  background-color: #aaff55; /*  */ 		
}
a.pageLink {
  font-size: 80%;
}
a.curPageLink, a.curPageLink:visited, a.curPageLink:link,
a.otherPageLink, a.otherPageLink:visited, a.otherPageLink:link {
  padding: .1em .3em .1em .3em; 
  color: #06c;
  font-size: 80%;
  font-weight: bold;
  text-decoration: none;
}
a.curPageLink, a.curPageLink:visited, a.curPageLink:link {
  border: 1px solid #e84858;
}
a.curPageLink:hover, a.otherPageLink:hover {
  color: #060;
  text-decoration: underline;
}

/* ----------- Main page header styles -------------*/
.indexPageHeader {
  display: inline;
  vertical-align: top; /* bottom */
  width: 100%;
  padding: .2em .5em .2em .2em; 
  border-bottom: .4em solid #69c; 
  background-color: #aaff55; /*  */
}
.indexPageHeader .navigationBar {
  text-align: right;
  vertical-align: middle;
}
.indexPageHeader .username {
  color: #e84858; 
  font-family: Tahoma,Arial,sans-serif; 
  font-size: 80%;
}

/* ----------- Folder view -------------*/
.insetPane {
  height: 100%;
  vertical-align: top;
  background-image: url(css_kuvi/_bg_repy_sidebar_left.gif);
  background-repeat: repeat-y;
}
.insetPane#folderPane {
  width: 10%; /*  */ 
  background-color: #d4ffaa; /* */
}
.insetPane#thumbViewPane {
  width: 85%;
  background: #d4ffaa;
}
.folderTree {
  vertical-align: top;
  margin-top: 10px; /* dtree top padding */
  margin-left: 15px;
  padding: 0px;

}
.folderTree#folderTree { /* corrects broken dTree.. */
  display: block;
}

/* ----------- Album header panel -------------*/
#boxAlbHeader {
  display: inline;
  white-space: normal;
  padding: .4em .4em .4em .4em; 
  border-collapse: collapse;
  color: black;
  background-color: #d4ffaa;
}
.navigationBar#pages {
  display: block;
  float: right;
  width: 20em;
  overflow: visible;
  padding: .2em 1.5em .3em 0em; 
  text-align: right;
  line-height: 140%;
}
#displayedinfo { /* pics 1-12... */
  font-family: Tahoma,Arial,sans-serif; 
  font-size: 80%;
}
#albCommands { /* admin btn group */
  display: block;
  width: 30em;
  white-space: nowrap;
  overflow: visible;
  vertical-align: bottom;
  margin: .3em 0em 0em 1em; 
  padding: .3em .1em .3em .1em;
}

/* ----------- Thumbnail view page -------------*/
#boxThumbView {
  display: block;
  width: 100%;
  vertical-align: top;
  margin: .1em .7em 0em 1em;
}
.fldimgrow {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  font-size: 1px;
  line-height: 1px;
}
.nothing, .imagethumb, .folderthumb {
  vertical-align: top;
  margin: 0em 0 0em 0;
  padding: 0em;
  border: none;
  border-collapse: collapse;
  text-align: center;
}

/* --- images thumbnails --- */
a.imglink {
  display: block;
  padding: .2em;
  cursor: hand;
  text-align: center;
  text-decoration: none;
}
/* - thumbnail borders - */ 
a.imglink .imagethumb {
  border-width: 1px; 
  border-color: #e84858; /*  */
  border-style: solid; 
}
a.imglink:hover {
  text-decoration: underline;
}

/* --- image titles --- */
.imageTitle {
  display: block;
  width: auto;
  height: auto;
  white-space: normal;
  margin: .4em 0em 0em 0em;
  padding: 0em 0em .4em 0em;
  cursor: hand;
  font-size: 80%;
}

/* --- album thumbnails --- */
a.fldlink {
  display: block;
  padding: .2em;
  cursor: hand;
  text-decoration: none;
}
a.fldlink:hover {
  text-decoration: underline;
}
/* folder borders */ 
a.fldlink .folderthumb { 
  border: 1px inset #999; /*  */
} 

/* ---- LARGE IMAGE VIEW: page title ---- */
#boxShowImageNavigationBar {
  display: block;
  width: 100%;
  margin: 0em 0em .1em 0em;
  padding: 0; 
  white-space: nowrap;
  background-color: #d4ffaa;
}
#boxShowImageNavigationBar .navigationBar { /* span */
  display: block;
  width: 100%;
  margin: 0;
  text-align: center;
}
#boxShowImageTitle {
  display: block;
  width: 100%;
  margin: 0;
  white-space: nowrap;
  padding: .3em .5em .2em .5em;
  background-color: #aaff55;		
}
#boxShowImageTitle .otsikko2 { /* span */
  display: block;
  width: 100%;
  color: black;
}
#boxShowImageComnt {
  display: block;
  width: 100%;
  margin: 0;
  white-space: normal;
  padding: 0em .5em .1em .5em;
  background-color: #aaff55;	
  border-bottom: .4em solid #6699CC; /* */
}

/* --- LARGE IMAGE VIEW: tr2 td --- */
.showImgPane {
  height: 100%;
  vertical-align: middle;
  white-space: nowrap;
  text-align: center;
  background-color: #d4ffaa;  /* */
}
.showImgPane table {
  margin: auto;
}
.showImgPane img {
  border: 1px #e84858 solid; /* max 2px wide */
  filter: progid:DXImageTransform.Microsoft.dropShadow(color='#666666', OffX='2', OffY='2');
  progid: DXImageTransform.Microsoft.BasicImage(enabled:false);
/* Filter: Invert;*/
/* Filter: Gray;*/
  background-color: #d4ffaa;
}

/* --- Tree styles --- */
.dtree, .dTreeNode, .dTreeNode table {
  display: block;
  white-space: nowrap;
  padding: 0px 0px 4px 0px; /* nav tree item offsets */
}
.dTreeNode table {
  font-size: 100%; /* nav bar text size */
}
.dtree img {
  border: 0px;
  vertical-align: middle; 
}
.dtree a {   /* nav bar font & text weight */
  font-family: Arial,Tahoma,Verdana,sans-serif;
  text-decoration: none;
  font-weight: bold;  
}
.dtree a.node, .dtree a.nodeSel {
  vertical-align: baseline;
  padding: 1px 0px 1px 1px; /* last is pic to text offset */
  white-space: normal;
}
.dtree a.node:hover, .dtree a.nodeSel:hover { /* hover */
  vertical-align: baseline;
  color: #090;  /* */
  text-decoration: none; /* */
}
.dtree a.nodeSel { /* nav bar active state */
  color: #e84858; /* */
}
.dtree .clip {
  overflow: hidden;
}