/************************************/
/* Main structure.                  */
/************************************/

html
{
   margin: 0px;                  /* Cover whole viewport. */
   padding: 0px;
}

body
{
   margin: 0px;                  /* Cover whole viewport. */
   padding-top: 10px;            /* Always show some background image at top... */
   padding-bottom: 10px;         /* ... and bottom. */
                                 /* Sides may be scaled to viewport edge. */
   background-color: #606060;    /* Normally not shown. Color if background image fails. */
   background-image: url('/images/background/bg_tarmac.jpg');   /* Fill whole viewport with tarmac. */
   background-repeat: repeat;
}

/************************************/
/* ID's.                            */
/************************************/

#css_image_enlarge_viewpos       /* Popup window for enlarged image. */
{
   display: none;                /* Normally not shown. Switch to 'block' to display popup. */
   position: absolute;
   z-index: 2;                   /* On top of normal page. */
   left: 6px;                    /* In upper left corner. See also 'image_enlarge.js'. */
   top: 6px;
   margin: 0px;
   padding: 0px;
   border-width: 4px;            /* Shadow to mark as popup window. */
   border-style: solid;
   border-left-color: #F0F0F0;
   border-right-color: #A0A0A0;
   border-top-color: #F0F0F0;
   border-bottom-color: #A0A0A0;
   background-color: #202020;
}

#css_image_enlarge_viewport      /* Inner container that holds all objects. */
{
   position: relative;           /* Also container for absolute position boxes. */
   width: 924px;                 /* css_image_enlarge_menu.width + 20 + css_image_enlarge_frame.width. See also 'image_enlarge.js'. */
   margin: 20px;                 /* "Border" around all container. */
   padding: 0px;
   background-image: url('/images/background/bg_page_menu.gif');    /* Fill up with color for css_image_enlarge_menu to get equal height. */
   background-repeat: repeat-y;  /* Only along the left side. */
}

#css_image_enlarge_menu          /* Floating column. Menu at the left side of popup window. */
{
   float: left;                  /* At the left edge of css_image_enlarge_viewport. */
   width: 180px;                 /* To fit logo width. */
   background-color: #404040;    /* Background image in css_image_enlarge_viewport will fill up the rest to get equal height. */
   margin: 0px;
   padding: 0px;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_image_enlarge_frame         /* Floating column. Image and information about it. */
{
   float: right;                 /* At the right edge of css_image_enlarge_viewport. */
   width: 724px;                 /* Width as the image + 2 * border width. See also 'image_enlarge.js'. */
   background-color: #202020;    /* Fills up columns to get equal height. */
   margin: 0px;
   padding: 0px;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_image_enlarge_copyright     /* Copyright message. */
{
   position: absolute;
   left: 0px;
   bottom: 0px;                  /* At the bottom of the menu on the left side. */
   width: 168px;                 /* css_image_enlarge_menu.width (180) - padding (6) * 2. */
   margin: 0px;
   padding: 6px;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}






#css_float_win_viewpos           /* Popup window for enlarged image, video and map. */
{
   display: none;                /* Normally not shown. Switch to 'block' to display popup. */
   position: absolute;
   z-index: 2;                   /* On top of normal page. */
   left: 6px;                    /* In upper left corner. See also 'float_win.js'. */
   top: 6px;
   margin: 0px;
   padding: 0px;
   border-width: 4px;            /* Shadow to mark as popup window. */
   border-style: solid;
   border-left-color: #F0F0F0;
   border-right-color: #A0A0A0;
   border-top-color: #F0F0F0;
   border-bottom-color: #A0A0A0;
   background-color: #202020;
}

#css_float_win_viewport          /* Inner container that holds all objects. */
{
   position: relative;           /* Also container for absolute position boxes. */
   width: 924px;                 /* css_float_win_menu.width + 20 + css_float_win_frame.width. See also 'float_win.js'. */
   margin: 20px;                 /* "Border" around all container. */
   padding: 0px;
   background-image: url('/images/background/bg_page_menu.gif');    /* Fill up with color for css_float_win_menu to get equal height. */
   background-repeat: repeat-y;  /* Only along the left side. */
}

#css_float_win_menu              /* Floating column. Menu at the left side of popup window. */
{
   float: left;                  /* At the left edge of css_float_win_viewport. */
   width: 180px;                 /* To fit logo width. */
   background-color: #404040;    /* Background image in css_float_win_viewport will fill up the rest to get equal height. */
   margin: 0px;
   padding: 0px;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_float_win_frame             /* Floating column. Image, video or map and information about it. */
{
   float: right;                 /* At the right edge of css_float_win_viewport. */
   width: 724px;                 /* Width as the image + 2 * border width. See also 'float_win.js'. */
   background-color: #202020;    /* Fills up columns to get equal height. */
   margin: 0px;
   padding: 0px;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_float_win_copyright         /* Copyright message. */
{
   position: absolute;
   left: 0px;
   bottom: 0px;                  /* At the bottom of the menu on the left side. */
   width: 168px;                 /* css_float_win_menu.width (180) - padding (6) * 2. */
   margin: 0px;
   padding: 6px;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_page_frame                  /* Container for the whole page and with a shadow border. */
{
   position: relative;           /* Also container for absolute position boxes. */
   width: 960px;
   margin: 0px;
   margin-left: auto;            /* Center on viewport. */
   margin-right: auto;
   padding-left: 0px;            /* Float all the way to the edge. */
   padding-right: 0px;
   padding-top: 180px;           /* Make room for absolute positioned objects above. (Logo, main menu and upper part of image). */
                                 /* Lower part of image and css_page_path will cover top right corner of css_page_text. */
   padding-bottom: 0px;
   border-width: 2px;            /* Shadow. */
   border-style: solid;
   border-left-color: #606060;
   border-right-color: #000000;
   border-top-color: #606060;
   border-bottom-color: #000000;
   background-color: #202020;    /* Fill up columns to get equal height. */
   background-image: url('/images/background/bg_page_menu.gif');    /* Fill up with color for css_page_menu to get equal height. */
   background-repeat: repeat-y;  /* Only along the left side. */
}

#css_top_logo
{
   position: absolute;           /* At top left corner. Image size 180*140. */
   left: 0px;
   top: 0px;
   padding: 0px;
}

#css_top_image                   /* At top beside logo. Image size 780*200. */
{
   position: absolute;
   left: 180px;
   top: 0px;
   padding: 0px;
}

#css_main_menu                   /* On top of top css_top_image, aligned to the left edge of page. */
{
   position: absolute;
   z-index: 1;                   /* On top. */
   left: 0px;
   top: 140px;                   /* Below logo. */
   height: 36px;
   background-color: #202020;
   padding-left: 186px;          /* Start to the right of the logo plus 6px padding. */
   padding-right: 24px;
   padding-top: 2px;
   padding-bottom: 2px;
   color: #F0F0F0;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: bold;
   overflow: hidden;
}

#css_page_path                   /* Below top image. */
{
   position: absolute;
   left: 180px;
   top: 200px;                   /* Covers part of css_page_text. */
   width: 768px;
   height: 15px;
   background-color: #202020;
   padding-left: 6px;
   padding-right: 6px;
   padding-top: 8px;
   padding-bottom: 8px;
   color: #F0F0F0;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 11px;
   font-weight: normal;
   overflow: hidden;
}

#css_page_menu                   /* Floating column. Page specific menu at the left side of page. */
{
   float: left;                  /* At the left edge of css_page_frame. */
   width: 174px;
   background-color: #404040;    /* Background image in css_page_frame will fill up the rest to get equal height. */
   padding-left: 0px;            /* Button background all the way to the edge. */
   padding-right: 0px;           /* IE6 "steals" 6px between floating css_page_menu and css_page_text. */
                                 /* Remove right padding (6px) to compensate this, otherwise layout will be messed up. */
                                 /* There will be a 6px space between float boxes. The problem does not exist in IE7. */
   padding-top: 6px;
   padding-bottom: 6px;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_page_text                   /* Floating column. Acts as container for css_wide_text and floats in css_narrow_text. */
{
   float: right;                 /* At the right edge of css_page_frame. */
   width: 780px;                 /* A 6px space between css_page_menu and css_page_text is filled with background image in css_page_frame. */
   background-color: #202020;    /* Fills up columns to get equal height. */
   padding: 0px;                 /* All padding must be in child boxes. */
}

#css_wide_text                   /* Floating column. Text block without right column. Fills entire css_page_text. */
{
   background-color: #202020;
   padding: 6px;
   padding-top: 57px;            /* Start below css_top_image and css_page_path. */
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_wide_text_no_side_padding   /* Floating column. Text block without right column. Fills entire css_page_text. */
{
   background-color: #202020;
   padding-left: 0px;            /* All the way to the sides. */
   padding-right: 0px;
   padding-top: 57px;            /* Start below css_top_image and css_page_path. */
   padding-bottom: 6px;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_narrow_text                 /* Floating column. Text block with right column. Used inside a css_page_text container. */
{
   float: left;                  /* At the left edge of css_page_text. */
   width: 588px;
   background-color: #202020;
   padding: 6px;
   padding-top: 57px;            /* Start below css_top_image and css_page_path. */
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_related                     /* Floating column. Used with css_narrow_text inside a css_page_text container. */
{
   float: right;                 /* At the right edge of css_page_text. */
   width: 168px;
   background-color: #202020;
   padding-left: 0px;            /* IE6 has (for some reason) not the same problem here as in css_page_frame, but better safe than sorry. */
                                 /* By removing left padding, a 6px space between css_narrow_text and css_related is filled with background color form css_page_text. */
   padding-right: 6px;
   padding-top: 57px;            /* Start below css_top_image and css_page_path. */
   padding-bottom: 6px;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_page_foot
{
   background-color: #202020;
   padding: 6px;
   clear: both;                  /* Below both css_narrow_text/css_related. */
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   text-align: center;
   overflow: hidden;
}

#css_page_end
{
   clear: both;                  /* Quickfix to make Firefox fill css_page_menu all the way down along css_page_text. */
   #clear: none;                 /* Only IE understands this. Don't clear in IE (messes up layout). Only needed with Firefox. */
}

/************************************/
/* General classes.                 */
/************************************/

.more_info                       /* Internal link. */
{
   text-align: right;
}

.error                           /* Error text. */
{
   font-weight: normal;
   font-style: italic;
}

.date                            /* General date. Ex: "Anslaget". */
{
   color: #A0A0A0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: normal;
}

.big_date                        /* Date in calender. */
{
   color: #A0A0A0;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: bold;
   line-height: normal;
}

.mega_text                       /* Really big text. */
{
   padding-top: 2px;
   padding-bottom: 2px;
   font-family: arial, helvetica, sans-serif;
   font-size: 24px;
   font-weight: bold;
   overflow: hidden;
   text-align: center;
}

.mini_text                       /* Really small text. */
{
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 11px;
   font-weight: normal;
}

.article_author                  /* Article author and/or photographer. */
{
   font-style: italic;
}

.side_padding                   /* Text in "bakgrunden" since 'css_wide_text_no_side_padding' aligns images all the way to the edges. */
{
   padding-left: 6px;
   padding-right: 6px;
}

/********************************************/
/* Tags (with optional classes or ID's).    */
/********************************************/

h1
{
   background-color: #404040;
   margin-left: 0px;
   margin-right: 0px;
   margin-top: 12px;             /* Make some room to previous section. */
   margin-bottom: 6px;
   padding: 2px 6px;
   color: #F0F0F0;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 18px;
   font-weight: bold;
   line-height: normal;
   overflow: hidden;
}

h1.top_of_col
{
   margin-top: 0px;              /* First header in a column. */
}

h2                               /* Sub header. */
{
   margin-left: 0px;
   margin-right: 0px;
   margin-top: 12px;             /* Make some room to previous section. */
   margin-bottom: 6px;
   color: #F0F0F0;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 16px;
   font-weight: bold;
   line-height: normal;
   overflow: hidden;
}

p
{
   overflow: hidden;
}

p.article_intro                  /* Article introduction (first paragraph). */
{
   font-family: arial, helvetica, sans-serif;
   font-weight: normal;
   font-style: italic;
}

em                               /* Usually italic in browsers, but just make sure. */
{
   font-style: italic;
}

strong                           /* Usually bold in browsers, but just make sure. */
{
   font-weight: bold;
}

img
{
   border: none;                 /* Skip border around link images (top logo and other logos). */
}

img.photo
{
   border: 2px solid #404040;    /* Small frame around photos. */
}

img.collection_photo
{
   border: 2px solid #404040;    /* Small frame around photos. */
   margin: 6px;                  /* Margins between photos in all directions. */
}

img.image_enlarge
{
   border: 2px solid #404040;    /* Small frame around photos. */
   margin-bottom: 10px;          /* Below enlarged image. */
}

div.article_date                 /* Date for article. */
{
   text-align: right;
   color: #A0A0A0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: normal;
}

div.article_headline             /* Article paragraph headline. */
{
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 16px;
   font-weight: bold;
   line-height: normal;
}

div.switch_page                  /* Goto previous/next article page. */
{
   font-size: 14px;
   text-align: center;
}

div.img_left_top_of_block        /* Left floating image. */
{
   float: left;
   margin-left: 0px;
   margin-right: 10px;
   margin-top: 0px;             /* All the way up. */
   margin-bottom: 6px;
}

div.img_left                     /* Left floating image. */
{
   float: left;
   margin-left: 0px;
   margin-right: 10px;
   margin-top: 6px;
   margin-bottom: 6px;
}

div.img_right_top_of_block       /* Right floating image. */
{
   float: right;
   margin-left: 10px;
   margin-right: 0px;
   margin-top: 0px;             /* All the way up. */
   margin-bottom: 6px;
}

div.img_right                    /* Right floating image. */
{
   float: right;
   margin-left: 10px;
   margin-right: 0px;
   margin-top: 6px;
   margin-bottom: 6px;
}

div.img_collection               /* Collection of pictures in article. */
{
   clear: both;                  /* Start fresh. */
   text-align: center;           /* Center pictures. */
}

div.fresh_start
{
   clear: both;                  /* Start fresh. */
}

div.lonely_object                /* Image or something that should be centered. */
{
   text-align: center;
}

div.vspace                       /* Some space between objects. */
{
   padding-top: 6px;
   padding-bottom: 6px;
}

div.big_vspace                   /* Some space between objects. */
{
   padding-top: 10px;
   padding-bottom: 10px;
}

div.controlled_line_break        /* Just a way to avoid <br />. */
{
}

hr
{
   clear: both;
   width: 100%;
   margin-top: 6px;
   margin-bottom: 6px;
   color: #404040;
   border-style: solid;
}

hr.sub_split                     /* Sub hr's between normal hr's. */
{
   clear: both;
   width: 100%;
   margin-top: 6px;
   margin-bottom: 6px;
   color: #404040;
   border-style: dashed;
}

span.date                        /* Inline dates. Ex: "Notarien". */
{
   margin-right: 6px;
   color: #A0A0A0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: normal;
}

span.hspace                       /* Some space between objects. */
{
   padding-left: 4px;
   padding-right: 4px;
}

ul
{
   list-style-type: disc;
}

ul.controlled_line_break         /* Lines on different rows. (For list type data). */
{                                /* See also 'div.controlled_line_break'. */
   list-style-type: none;
}

table
{
   border: none;
   border-spacing: 0px;          /* IE don't understand this. Used for Firefox instead of border-collapse. */
   #border-collapse: collapse;   /* Equal to HTML cellspacing = 0. Use this only for IE. */
                                 /* (Firefox understand 'border-collapse' but makes strange things with cellborders in some tables). */
   margin-left: 0px;
   margin-right: 0px;
   margin-top: 10px;
   margin-bottom: 4px;
   padding: 0px;
}

thead                            /* Table with header on top above cols. */
{
   background-color: #404040;
   color: #F0F0F0;
}

th
{
   padding-left: 6px;
   padding-right: 6px;
   padding-top: 2px;
   padding-bottom: 2px;
   color: #F0F0F0;
   font-family: verdana, arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: bold;
   text-align: left;
   line-height: 120%;
   vertical-align: top;
   overflow: hidden;
}

th.middle_header                 /* For all cols but the last. */
{
   border-right: 2px solid #202020;
}

td
{
   padding-left: 6px;
   padding-right: 6px;
   padding-top: 2px;
   padding-bottom: 2px;
   border-bottom: 1px solid #404040;      /* Line below text. */
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   text-align: left;
   line-height: 120%;
   vertical-align: top;
   overflow: hidden;
}

td.middle_col                    /* For all cols but the last. */
{
   padding-right: 18px;
}

td.row_description               /* First col in table with headers on the left side. */
{
   background-color: #303030;
   text-align: right;
}

form.image_enlarge_data          /* Hidden form with data to enlarge images. */
{
   display: none;
}

input.text , textarea            /* Text input box. */
{
   background-color: #202020;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   line-height: 120%;
   border: 2px solid #606060;
}

input.button                     /* Submit button. */
{
   background-color: #404040;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   line-height: normal;
   border-width: 2px;            /* 3D look. */
   border-style: solid;
   border-left-color: #606060;
   border-right-color: #303030;
   border-top-color: #606060;
   border-bottom-color: #303030;
}

input.check , input.option       /* Checkbox and option button. */
{
   background-color: #202020;    /* This will not be the real color, but it makes at least a black/white combination. */
                                 /* It only works in IE. */
}

select.option                    /* Combo box / List box. */
{
   background-color: #404040;
   color: #F0F0F0;
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   line-height: 120%;
   border: 2px solid #606060;
}

/************************************/
/* Tags at specific ID's.           */
/************************************/

#css_page_menu h1
{
   background-color: transparent;
   padding: 0px;
   padding-left: 6px;            /* css_page_menu has no padding on left side. */
}

#css_related h1                  /* A bit smaller header. */
{
   font-size: 14px;
}

#css_page_menu ul
{
   margin: 0px;
   margin-right: 4px;            /* Totally: 4px margin + 6px float space = Visually 10px from css_page_text. */
   padding: 0px;
   list-style-type: none;
}

#css_image_enlarge_menu ul
{
   margin: 0px;
   margin-right: 10px;
   padding: 0px;
   list-style-type: none;
}

#css_page_menu li, #css_image_enlarge_menu li
{
   background-color: #202020;
   margin-top: 0px;
   margin-bottom: 2px;           /* Space between list items. */
   padding-left: 6px;
   padding-right: 0px;
   padding-top: 4px;
   padding-bottom: 4px;
   color: #F0F0F0;               /* Normally white text, but usually the whole text is a link. */
   font-family: arial, helvetica, sans-serif;
   font-size: 14px;
   font-weight: normal;
   line-height: 120%;
   overflow: hidden;
}

#css_page_menu hr
{
   clear: both;
   width: 100%;
   height: 2px;
   margin-top: 48px;             /* Make som space above. */
   margin-bottom: 2px;
   color: #404040;               /* Same as background = not shown. */
   border-style: solid;
}

/********************************************/
/* Pseudo classes (optionally ID specific). */
/********************************************/

a:link
{
   color: #F0F000;
   font-weight: normal;
   text-decoration: none;
}

a.url:link                       /* External URL's has a different style. */
{
   font-weight: normal;
   font-style: italic;
}

#css_main_menu a:link
{
   font-weight: bold;
}

a:visited
{
   color: #F0F000;
   font-weight: normal;
   text-decoration: none;
}

a.url:visited                    /* External URL's has a different style. */
{
   font-weight: normal;
   font-style: italic;
}

#css_main_menu a:visited
{
   font-weight: bold;
}

a:hover
{
   color: #F00000;
   font-weight: normal;
   text-decoration: none;
}

a.url:hover                      /* External URL's has a different style. */
{
   font-weight: normal;
   font-style: italic;
}

#css_main_menu a:hover
{
   font-weight: bold;
}

a:active
{
   color: #F00000;
   font-weight: normal;
   text-decoration: none;
}

a.url:active                     /* External URL's has a different style. */
{
   font-weight: normal;
   font-style: italic;
}

#css_main_menu a:active
{
   font-weight: bold;
}
