﻿/* Basic
*****************************/
*
{
    margin: 0;
    padding: 0;	
    font-family: Tahoma, Trebuchet MS, Lucida Sans Unicode, Lucida Sans, Verdana, Sans-Serif;
    font-size: 11px;
}
span
{
    font-size: inherit;
}
html, body
{
    height: 100%;
    width: 100%;
    color: #515151;
}
li { float: left; list-style-type: none; }
table { border-collapse: collapse; }
img { border: 0; }
hr {margin:10px 0 10px 0; height:1px; color:#dddddd; background-color:#dddddd;}
.hr {margin:10px 0 10px 0; border-top:solid 1px #dddddd;}

body
{
    background: #eeeeee url('../_gfx/bg.jpg') repeat-x top left;
}
a, a:visited
{
    font-weight: bold;
    color: Black; /*#ff823e;*/
    text-decoration: none;
}
a:hover
{
    color: #ff823e; /*#ff5a00;*/
    text-decoration: underline;
}
h1
{
    color: #ff823e;
    font-size: 17px;
    font-weight: bold;
    font-family: Trebuchet MS, Tahoma, Verdana, Sans-Serif;
    text-transform: uppercase;
    margin: 0 0 8px 0;
}
h2
{
    font-size: 13px;
    font-weight: bold;
    font-family: Trebuchet MS, Tahoma, Verdana, Sans-Serif;
    margin: 0 0 4px 0;
}
h3
{
    color: #ff823e;
    font-size: 12px;
    font-weight: bold;
    font-family: Trebuchet MS, Tahoma, Verdana, Sans-Serif;
    margin: 0 0 4px 0;
}

/* Form
------------------*/

input.textbox, textarea, select
{
    background-color: white;
    border: 1px solid #d5af9b;
    margin-bottom: 5px;
    font-family: Tahoma, Verdana, Sans-Serif;
    font-size: 10px;   
}
input.textbox, textarea
{
    padding: 2px;
    width: 120px;
}
select
{
    padding: 1px;
}
input[type='checkbox'] 
{
    margin: 4px;
}
input[type='radio'] 
{
    margin: 4px;
}

.form, .form td 
{
    font-family: Tahoma, Verdana, Sans-Serif;
    font-size: 10px;    
}

label
{
    font-weight: bold;
    display: inline-block;
    margin: 4px 0 0 0;
    vertical-align: top;
}
label.left
{
    padding-top: 2px;
    margin: 0;
    width: 70px;
}

.button 
{
    display: block;
    cursor: pointer;
    text-align: center;
    background: #f37a21 url(../_gfx/btn_bg.gif) repeat-x top;
    border: solid 1px #b8673b;
    padding: 0 3px;
    font-family: Trebuchet MS, Tahoma, Verdana, Sans-Serif;
    font-weight: bold;
    color: white;
    text-decoration: none;
    font-size: 10px;
}

input.disabled /*for disabled button*/
{
    background: #eeeeee;
    border: solid 1px #cac8bb;
    color: #cac8bb;
    cursor: default;
}

.disabled,
.disabled *,
.disabled a,
.disabled .textbox
{
    border-color: #cac8bb;
    color: #cac8bb;
}


/* Message respons
------------------*/

.messageOK, .messageERROR
{
    display: none;
	padding: 4px;
	margin-bottom: 10px;
}
.messageOK
{
	border: 1px solid #01b201;
	background-color: #dfffe5;
	color: #01b201;
}
.messageERROR
{
	border: 1px solid red;
	background-color: #ffd7d7;
	color: Red;
}

/* Header
*****************************/

#header 
{
    height: 200px;
    position: relative;
    margin-bottom: 30px;
}

#header #headerBar 
{
    /* Used background image instead to make it continous to the right.
    background-color: White;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    width: 100%;*/ 
    
    height: 95px;
    position: absolute;
    top: 50px;
    z-index: 20;
}

#header #headerBar #logo
{
    height: 95px;
    position: absolute;
    left: 290px; 
    
    background: transparent url('../_gfx/logo.gif') no-repeat center left;
    height: 100%;
    width: 178px;
}

#header #headerBar #contact
{
    position: absolute;
    left: 520px;
    width: 300px; 
    margin-top: 15px;
}

#header #headerBar #contact table
{
    margin-bottom: 5px;
}

#header #headerBar #contact table th
{
    width: 100px;
    font-weight: bold;
    text-align: left;
}
#header #headerBar #contact table th,
#header #headerBar #contact table td
{
    padding-bottom: 3px;
}

#header #contactMe
{
    position: absolute;
    top: 40px;
    left: 30px;
    z-index: 30;
    
    background: #cccccc url('../_gfx/box_bg.gif') repeat-x top left;
    border: 1px solid #515151;
    width: 234px;
    height: 151px;
}
#header #contactMe .innerGlow 
{
    height: 99%;
    width: 99%;
    border: 1px solid white;
}
#header #contactMe .innerGlow .padding
{
    padding: 15px;
}

#header #contactMe .button
{
    float: right;
    margin-right: 4px;
}

#header #superLink
{
    position: absolute;
    top: 40px;
    left: 800px;
    z-index: 30;
    
    cursor: pointer;
    /*height: 140px;
    width: 140px;*/
}

/* Menu
------------------*/

#header #menu 
{
    position: absolute;
    bottom: 15px;
    left: 280px;
    right: 0px;
    
    min-width: 700px;
    border-top: 1px solid #515151;
    border-left: 1px solid #515151;
    border-bottom: 1px solid #515151;
    background: transparent url( '../_gfx/bar_bg.jpg' ) repeat-x top;
    height: 22px;
}

#header #menu ul
{
    border-left: 1px solid white;
    display: block;
    padding-top: 3px;
    height: 19px;
    line-height: 17px;
}

#header #menu ul li
{
    float: left;
	padding: 0 20px 0 20px;
    border-right: solid 1px #515151;
    border-left: solid 1px white;
}

#header #menu ul li.first
{
    border-left: 0px;
}

#header #menu ul li.last
{
    border-right: 0px;
}

#header #menu ul li a, #menu ul li a:visited
{
    font-family: Tahoma, Trebuchet MS, Verdana, Sans-Serif;
    /*text-transform: uppercase;*/
    font-weight: bold;
    color: #515151;
    text-decoration: none;
    font-size: 11px;
}

#header #menu ul li a:hover
{
    color: black;
    text-decoration: underline;
}


/* Content
*****************************/

#content 
{
    width: 100%;
    margin-bottom: 5px;
}

#content td
{
    vertical-align: top;
}

#content .marginLeft
{
    width: 30px;
}

#content .marginMiddle
{
    width: 15px;
}

/* SideMenu
---------------*/

#sideMenu
{
    margin-left: 30px;
    width: 150px;
    padding: 0px 15px 15px 15px;
    
    border-right: 1px dotted gray;
    border-bottom: 1px dotted gray;
    
    /* width: 204px;
    border: 1px solid #515151;
    padding: 15px;*/
    
}

#sideMenu ul
{
    display: block;
    margin-top: 10px;
}

#sideMenu ul li
{
    float: none;
    border: 1px solid transparent;
}

#sideMenu ul li:hover
{
    background-color: #ffffff;
    border: 1px dotted #cccccc;
}

#sideMenu ul li.divider:hover
{
    background-color: transparent;
    border: 1px solid transparent;
}

#sideMenu ul li a, #sideMenu ul li a:visited
{
    display: block;
    padding: 1px 4px;
    font-weight: normal;
    color: #515151;
    text-decoration: none;
    font-size: 11px;
}

#sideMenu ul li a:hover
{
    font-weight: normal;
    color: black;
    text-decoration: none;
}


/* Main
---------------*/

#main 
{
    padding-bottom: 10px;
}

.mainContainer
{
    width: 720px;
}

.mainContainer .leftCol
{
    width: 400px;
    float: left;
}

.mainContainer .rightCol
{
    width: 265px;
    float: left;
    border-left: 1px dotted gray;
    border-bottom: 1px dotted gray;
    background-color: White;
    margin-left: 20px;
    padding: 0 15px 15px 15px;
}

/* productlist OLD
---------------*/

/*#productlist
{
    margin-bottom: 10px;
    width: 98%;
}

#productlist td
{
    background: #cccccc url('../_gfx/box_bg.gif') repeat-x top left;
    padding: 5px;
    border: 1px solid black;
    height: 82px;
    text-align: center;
}

#productlist td.selected
{
    border-bottom: 1px solid transparent;
    background: transparent;
}

#productlist td.divider,
#productlist td.last
{
    border-left-width: 0px;
    border-right-width: 0px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid black;
    background: transparent;
}

#productlist td.last
{
    width: 100%;
}

#productlist td .thumbHolder
{
    width: 120px;
    height: 60px;
    margin-bottom: 2px;
    background-position: center center;
    background-repeat: no-repeat;
}

#productlist td .title
{
    font-size: 10px;
    font-weight: normal;
}

#productlist td:hover
{
    background: transparent;
}

#productlist td.divider:hover,
#productlist td.last:hover,
#productlist td.selected
{
    background: transparent;
}/*


/* productlist
---------------*/

.special
{
    border-bottom: solid 1px black;
    width: 700px;
}

.productlist 
{
    margin-bottom: 10px;
}

.productlist .item
{
    background: #cccccc url('../_gfx/box_bg.gif') repeat-x top left;
    padding: 5px;
    border: 1px solid black;
    text-align: center;
    margin: 0 10px 10px 0;
}

.productlist .selected
{
    background: #f37a21 url('../_gfx/box2_bg.gif') repeat-x top left;
}

.productlist .item .thumbHolder
{
    width: 120px;
    height: 60px;
    margin-bottom: 2px;
    background-position: center center;
    background-repeat: no-repeat;
}

.productlist .item .title
{
    font-size: 10px;
    font-weight: normal;
}

.productlist .item:hover
{
    background: transparent;
}
.productlist .selected:hover
{
    background: #f37a21 url('../_gfx/box2_bg.gif') repeat-x top left;
}
.productlist .selected a:hover
{
    color: Black;
}

/* Image Viewer
---------------*/

.location 
{
    margin-bottom: 15px;
}

.location ul li
{
    height: 20px;
    margin-right: 5px;
}

/* Image Viewer
---------------*/

#imageViewer 
{
    margin-bottom: 15px;
}

#imageViewer #imageHolder
{
    width: 465px;
    height: 310px;
    border: 1px solid black;
    margin-bottom: 5px;
}

#imageViewer #imageHolder div
{
    width: 465px;
    height: 310px;
    background-position: center center;
    background-repeat: no-repeat;
}

#imageViewer ul#thumbs li
{
    display: block;
    float: left;
    margin-left: 4px;
}

#imageViewer ul#thumbs li.first
{
    margin-left: 0px;
}

#imageViewer ul#thumbs li img
{
    height: 30px; 
    border: 1px solid black;
    cursor: pointer;
}

/* product
---------------*/

.product 
{
    float: left;
    width: 465px;
    margin-right: 20px;
}

h1.title
{
    text-transform: none;
}
h1.title .firstLetter 
{
    font-family: Tahoma, Verdana, Sans-Serif;
    font-size: 20px;
}
h1.title .tm 
{
    font-family: Trebuchet MS, Tahoma, Verdana, Sans-Serif;
    font-size: 18px;
}

/* rightColumn
---------------*/

.rightColumn 
{
    float: left;
    border-left: 1px dotted black;
    padding-left: 20px;
    padding-bottom: 20px;
}

.rightColumn ul li
{
    float: none;
    margin-top: 20px;
}

.rightColumn ul li img
{
    margin-bottom: 5px;
    border: 1px solid black;
}

/* category OLD
---------------*/

.category 
{
    margin-bottom: 10px;
}

/* startBoxes
---------------*/


#startBoxes #Link0, 
#startBoxes #Link1,
#startBoxes #Link2,
#startBoxes #Link3,
#startBoxes #Link4,
#startBoxes #Link5,
#startBoxes #Link6
{
    border: solid 1px black;
    background-color: Black;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
    cursor: pointer;
}

/*#startBoxes #Link0:hover, */
#startBoxes #Link1:hover,
#startBoxes #Link2:hover,
#startBoxes #Link3:hover,
#startBoxes #Link4:hover,
#startBoxes #Link5:hover,
#startBoxes #Link6:hover
{
    border: solid 1px #ff823e;
}

#startBoxes #Link1,
#startBoxes #Link2,
#startBoxes #Link3to5,
#startBoxes #Link6
{
    height: 245px;    
}

#startBoxes #Link3,
#startBoxes #Link4,
#startBoxes #Link5
{
    height: 119px; /*120px; without border*/
}

#startBoxes #Link1
{
    width: 204px;  /*205px; without border*/ 
}

#startBoxes #Link3
{
    width: 205px;
}

#startBoxes #Link3to5 
{
    width: 207px; /*205px; without border*/
}


#startBoxes #Link2,
#startBoxes #Link6
{
    width: 100px;
}

#startBoxes #Link4,
#startBoxes #Link5
{
    width: 99px; /*100px; without border*/
    margin-top: 5px;
}

#startBoxes #Link1,
#startBoxes #Link2,
#startBoxes #Link4,
#startBoxes #Link3to5 
{
    margin-right: 5px;
} 

#startBoxes #Link1,
#startBoxes #Link2,
#startBoxes #Link3,
#startBoxes #Link4,
#startBoxes #Link5,
#startBoxes #Link6,
#startBoxes #Link3to5
{
    float: left;
}

#startBoxes .blackBox 
{
    height: 35px;
    position: absolute;
    bottom: 0;
    background-color: Black;
    width: 100%;
    
    color: White;
    font-size: 10px;
    font-family: Trebuchet MS, Tahoma, Lucida Sans Unicode, Lucida Sans, Verdana, Sans-Serif;
}

#startBoxes .blackBox h3
{
    margin: 2px 0 0 0;
    font-size: 13px;
}

#startBoxes .margin 
{
    float: left;
    width: 4px;
    height: 100%;
    font-size:0;
}

#startBoxes #Link0 
{
    width: 630px; /*625px; without border*/
    height: 380px;
    margin-bottom: 5px;
    cursor: default;
}

#startBoxes #Link0 .blackBox
{
    display: none;
}

#startBoxes #Link0  #announcement
{
    position: absolute;
    border: 1px solid black;
    background-color: White;
    padding: 10px;
    cursor: pointer;
    z-index: 20;
}


/* Contest 
---------------*/

.contest .result
{
    padding: 10px;
    margin: 10px 0 0 10px;
    border: 1px solid black;
    background: #f37a21 url('../_gfx/box2_bg.gif') repeat-x top left;
    color: white;
    margin: 20px 0 20px 0;
}

.contest .result .title
{
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 15px;
}

.contest .result .winner
{
    text-align: center;
    font-size: 15px;
}

.contest .result .name
{
    text-align: center;
    font-size: 19px;
    font-weight: bold;
}
.contest .result .location
{
    text-align: center;   
}
.contest .result .text
{
    margin-top: 20px;
}

.contest .contestText 
{
    margin-bottom: 20px;    
}

.contest img.contestImage
{
    display: block;
    margin: 20px auto 0;
    border: 1px solid black;   
}

.contest .questionForm 
{
    border: 1px dotted gray;
    background-color: White;
    padding: 10px;
    margin: 10px 0;
}

.contest .jury 
{
    font-style: italic;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dotted lightgray;    
}

.contestList img 
{
    border: 1px solid black;    
}

.contestList img:hover
{
    border: 1px solid #ff823e;    
}

.questions .textbox
{
     margin-top: 4px;
}


.contest #slideshow
{
    border: 1px solid black;
    background-color: Black;
	width: 335px;
	margin: 20px auto 10px auto;
	overflow: hidden; /* Patrik: To make the height of this div not increasing while loading the images*/
	visibility: hidden; /* Patrik: To hide the images before making a slideshow of them*/
    z-index: 10; 
}



/* About menu 
---------------*/


#aboutMenu
{
    margin-bottom: 20px;
    width: 100%;
}


#aboutMenu .item,
#aboutMenu .selected,
#aboutMenu .divider,
#aboutMenu .last
{
    float: left;
    padding: 5px;
    border: 1px solid black;
    text-align: center;
    border: 1px solid black;
}

#aboutMenu .item
{
    background: #cccccc url('../_gfx/box_bg.gif') repeat-x center left;
    padding: 5px;
}

#aboutMenu .selected
{
    border-bottom: 1px solid transparent;
    color: #ff823e;
    font-weight: bold;
}

#aboutMenu .divider,
#aboutMenu .last
{
    border-left-width: 0px;
    border-right-width: 0px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid black;
    background: transparent;
}

#aboutMenu .last
{
    float: none;
    margin-left: 458px; /*adjust after how wide menu is*/
}

#aboutMenu .item:hover
{
    background: transparent;
}

#aboutMenu .divider:hover,
#aboutMenu .last:hover,
#aboutMenu .selected
{
    background: transparent;
}
#aboutMenu .selected
{
    background: transparent;
}


/* Personal
---------------*/


#personal img
{
    margin-right: 10px;
    border: 1px solid black;
}
#personal img:hover
{
    border: 1px solid #ff823e;
}

.personalImage
{
    float: left;
    border: 1px solid black;
    margin-right: 10px;
}

/* News
---------------*/

.newsItem h1
{
    margin-bottom: 0;
}

.newsItem .date
{
    margin-bottom: 15px;
    font-weight: bold;
    font-size: 9px;
    font-family: Verdana, Sans-Serif; 
}

.newsItem .text
{
    border-bottom: 1px dotted gray;
    padding-bottom: 20px;
    margin-bottom: 10px;
}

.newsItem .lastText
{
    padding-bottom: 20px;
    margin-bottom: 10px;
}

.newsList li
{
    padding: 2px;
}



