/****************************************************************************
MySoft CSS Template 3
*****************************************************************************/
div { padding: 0px;  margin: 0px; }

form {
  padding: 0;
  margin: 0;
  display: inline;  
}

/* Container around the whole portlet */
#portlet {
 width: 680px;
}

.printpage {
  width: 100% !important;
}

/* Portletframe is the frame/border around the portlet. The buttonrow is 
   placed outside this frame */
#portletFrame {
 border-color: #999; 
 border-style: solid;
 border-width: 0 1px 1px 1px;
}

#dialogFrame {}

td,
#portlet,
#portlet select,
#portlet input,
#portlet textarea {
 font-family: arial;
 font-size: 8pt;
}

#portlet textarea { height: 80px; }

/*********************
 * Div table section
 * ******************* */ 

/* Container for one and two columns table */
.oneColumn, .twoColumns { 
 width: 100%; 
}

/* The outer div table */
DIV.tableRowOuter {
  margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;
  padding: 2px 0 2px 0; width: 100%; height: auto;
}

/* Left outer cell of the div table */
DIV.leftCellOuter {
 width: 49%; /* Needs to be set to 49% to be compatible with MSIE 6.x */
 float: left;
 margin: 0; padding: 0;
}

/* Right outer cell of the "table" */
DIV.rightCellOuter {
  width: 50%;
  float: right; 
  margin: 0; padding: 0; 
}

DIV.mainCell {
 padding: 1px 0 0 4px;
}

/* Opacity on mouseover */
/*
DIV.rightCellOuter,
DIV.leftCellOuter { opacity: 0.6; }
DIV.rightCellOuter:hover, 
DIV.leftCellOuter:hover { opacity: 1; }
*/

/* Inner table row - modify this width if you want spacing on each side of the rows */
DIV.tableRow {
  margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;
  padding: 0; text-align: left; width: 100%;
}

/* Padding on the text in the left cell */
.leftCellOuter { padding: 1px 0 0 4px; }

/* Padding on the text in the right cell */
.rightCellOuter .tableRow, 
.leftCellOuter .tableRow { 
  padding-top: 1px; 
}

/* Left inner cell */
.oneColumn .leftCell, 
.twoColumns .leftCell {
 float: left; 
 margin: 0; padding: 0;
}
.oneColumn .leftCell { width: 50%; }
.twoColumns .leftCell { width: 142px; }


/* Right inner cell */
DIV.rightCell { float: left; margin: 0; padding: 0;}

/* This line is used at the end of each row to clear the float */
DIV.spaceLine { clear: both; margin: 0; padding: 0; width: auto; padding-bottom: 0px;}

/* Defines the maximum width for contents inside a "cell" in a two column table.
   This is for compatibility with Opera and Firefox, and it is needed to prevent 
   the "cell" to get too wide (eg with large portions of static text). */ 
.maxWidth2col { width: 180px!important; }

/* Adds background-shade to the textinputs and dropdown */
.textInput, .textInputHalf, .textInputQuarter, .textInputTwoThirds, .textInputFree, .textInputDate, .textInputHalfDate, .textInput3Quarters, .textInputOneThird{
  border: 1px solid #ccc;
  background-image: url(http://wwwpo11.mysoft.no/mysoft/images/png/backgroundshade.png);
  background-repeat: repeat-x;
  background-position: top left;
}

/* Various static widths for the text inputs */
.oneColumn .textInput { width: 320px; }
.oneColumn .textInput3Quarters { width: 240px; }
.oneColumn .textInputHalf { width: 160px; } /* Half size of input fields in two column-mode */
.oneColumn .textInputQuarter { width: 80px; } /* Quarter size of input fields in two column-mode */
.oneColumn .textInputDate {width: 302px; } /* Space for icon on right side of input */
.oneColumn .textInputHalfDate {width: 142px; } /* Space for icon on right side of input */


.twoColumns .textInput { width: 160px; }
.twoColumns .textInputHalf { width: 80px; } /* Half size of input fields in two column-mode */
.twoColumns .textInputTwoThirds { width: 110px; } /* 2/3 size of input fields in two column-mode */
.twoColumns .textInputOneThird { width: 50px; } /* 1/3 size of input fields in two column-mode */
.twoColumns .textInputQuarter { width: 40px; } /* Quarter size of input fields in two column-mode */
.twoColumns .textInput3Quarters { width: 120px; } /* Quarter size of input fields in two column-mode */
#portlet .twoColumns textarea { width: 100%; }

/* Used for stacked elements inside a DIV (instead of list items) */
#portlet DIV P {
 margin: 0; width: auto; 
 text-align: left; text-indent: 0;
}

/* Alternative inner row colors */
/*
.row1 { background-color: #DDA7A8; }
.row2 { background-color: #FFC0CB; }
*/

/****************************************************************************
 * Header part
 * *********************************************************************** */ 

#dialogFrame .header { 
 width: 100%;
 margin: 0; 
 padding: 4px 0 4px 0; 
 border: #999 solid;
 border-width: 1px;
 font-weight: bold;
 background-color: #efefef;
}

.header { 
 width: 100%;
 margin: 0; 
 padding: 4px 0 4px 0; 
 border: #999 solid;
 border-width: 1px 0 1px 0;
 font-weight: bold;
 background-color: #efefef;
}

.header .headerMiddle { padding-left: 4px; }
 
/*
The following can be used to apply pictures in each corner of the header 

#header .headerLeft, 
#header .headerRight { height: 100%; width: 26px; }

#header .headerLeft { float: left; background-image: url(); }
#header .headerRight { float: right; background-image: url(); }
#header .headerMiddle { float: left; }
*/

.buttonRow {
 padding-top: 4px;
 text-align: right;
 border: #999 solid;
 border-width: 0 0 0 0;
}

.button {
  width: 75px;
}

/***************************************************
 ** Misc styles 
 ************************************************ */

/* Datepicker */
.ui-datepicker-trigger {
  padding: 0 0 0 0;
  margin: 0 0 0 2px;
  vertical-align: middle;
  margin-bottom: .25em; /* emulate absmiddle */
}

/* Spacer between close objects such as text inputs */
.smallSpace { padding-left: 10px; }

/* For mandatory fields */
.asterisk { color: red; }

/* For bold text */
.bold {font-weight: bold;}

/* Common class for all disabled objects 
   The [readonly] feature is not compatible with MSIE 6.x,
   so a better use as for now is to use multiple classes. Example:
   class="textInput readOnly" (this will add styles from both textInput and readOnly) */
[readonly], .readOnly  { 
  background-color: #ddd;
  background-image: none; 
  border: 1px solid #aaa;
}

[displayText], .displayText  { 
  background-color: #FFF;
  background-image: none; 
  border: 1px solid #FFF;
}

.clickable { cursor: pointer }

/***************************************************
 ** Error and confirm styles 
 ************************************************ */

/* confirm */
#confirmHeader {
 color: black;
 background-color: lightGreen;
 float: left;
}

#confirmHeader .headerLeft {
 background-image: url("/mysoft/images/png/accept.png");
 margin-left: 3px; 
 width: 16px;
 height: 16px;
 float: left;
}

#confirmHeader .headerMiddle {
 width: 625px;
 float: left;
}

#confirmHeader .headerRight {
 /*background-image: url("/mysoft/images/png/cross.png");*/
 font-size: 7pt;
 text-decoration: underline;
 text-align: right;
 cursor: pointer;
 width: 25px;
 height: 16px;
 float: left;
}

#confirmText {
  color: green;
  background-color: white;
}

/* Error */

#errorHeader { 
 color: white;
 background-color: darkRed;
 float: left;
}

#errorHeader .headerLeft {
 background-image: url("/mysoft/images/png/exclamation.png");
 margin-left: 3px; 
 width: 16px;
 height: 16px;
 float: left;
}

#errorHeader .headerMiddle {
 width: 625px;
 float: left;
}

#errorHeader .headerRight {
 /*background-image: url("/mysoft/images/png/cross.png");*/
 font-size: 7pt;
 text-decoration: underline;
 text-align: right;
 cursor: pointer;
 width: 25px;
 height: 16px;
 float: left;
}

#errorText {
  color: #8B0000;
  line-height: 1.6em;
}

/* highlights required field on mouseover */
.errorHighlight {
  background-image: none;
  background-color: #f6e8e8;
  color: #8B0000;
}

/***************************************************
 ** Search results
 ************************************************ */

.popBox {
  padding: 6px;  
  width: 200px; 
  background-color: white; 
  border: 1px black solid; 
  position:absolute;
}

.closeBox{

}

.iconRow {
  padding: 4px;
  text-align: right;
  border-width: 0 0 0 0;
}

.searchList {
  width: 99%; /* MSIE bug with 100% so leave it at 99% */
  font-size: 8pt;
  padding-left: 4px;
}

.searchList th {
  text-decoration: underline;
  font-weight: bold;
}

/*
.searchList .sortIconWrapper {
  width: 100%;
}
*/

.thHeaderContainer {
  float: left;
}

.searchList .sortIconWrapper, 
.searchList th {
  text-align: left;
  /* float: left; */
}

.icon16x16 {
	width: 16px;
	height: 16px;
}

.searchList .sortIconWrapper .normal, 
.searchList .sortIconWrapper .active {
  cursor: hand;
  cursor: pointer;
}

.searchList .sortIconWrapper .active {
  color: #300;
}


.sortIconAscending {
  width: 16px; height: 16px;
  background-image: url("/mysoft/images/png/bullet_arrow_up.png");
  float: left;
}

.sortIconDescending {
  background-image: url("/mysoft/images/png/bullet_arrow_down.png");
  width: 16px; height: 16px;
  float: left;
}

.searchResultRow {
  line-height: 1.6em;
}

.rowOdd {
  background-color: white;
}

.rowEven {
  background-color: #edf3fe;
}

.rowOver {
  background-color: #c5d0e2;
}

.searchNavigation {
  padding: 4px;
}

.searchNavigation .pagenrSelected {
  font-weight: bold;
}

/* styles til boxview (for å flytte over elementer mellom to selectbokser) */
#box1View, #box2View {
  width: 300px;
  height: 500px;
}

.countLabel 
{
  color:Gray;
  font-style:italic;
}

.storageBox 
{
  display:none;
}

.copiedOption
{
  background-color:Yellow;
}

.countLabel {
  display: none;
}

