/**********************************************/
/* Stilmall för WebTec
/* Matts Persson
/* webtec.iotec.com
/*
/*
/**********************************************/


/* GENERELL STYLING ***************************/

a {
outline: 0;					/* För att undvika ram runt aktiva klickbara objekt */
}

.floatleft {
float: left;					/* Skicka block åt vänster */
}

.floatright {
float: right;					/* Skicka block åt höger */
}

.price	{
text-align: right;
}

.nowrap {
white-space: nowrap;
}

#front {
margin-left: auto;
margin-right: auto;
font: 14px verdana, arial, sans-serif;
text-align: center;
color: #600;
}

#front a {
color: #888;
font-weight: normal;
text-decoration: none;
font-weight: bold;
}

#front a:link img, #front a:visited img {
color: #fff;
}

#front a:hover {
color: #a00;
}

#front a:hover img {
color: #a00;
}

#front img {
border: 1px solid;
}

#julbock {
width: 640px;
height: 465px;
border-top: 3px solid #333;
border-right: 3px solid #fff;
border-bottom: 3px solid #fff;
border-left: 3px solid #333;
}

/* BODY ***************************************/

body {
height: 1200px;
text-align: center;
/*background-color: #dfdfce;			/* Yttersta bakgrunden - utanför "container" */
background-color: #444;				/* Yttersta bakgrunden - utanför "container" */
/*background-image: url(/images/bg.gif);*/
}

/* CONTAINER **********************************/

#container {
width: 960px;					/* Bredd= 960 + 2 (border) + 10 (padding) = 972 ryms bra på 1024-skärm */
border: 1px solid #600;
padding: 10px;
margin-right: auto;				/* Centrerat */
margin-left: auto;
background-color: #fff;				/* Vit bakgrund */
}

/* HEADER *************************************/

#header {
padding-left: 2px;
/*margin-right: 5px;*/
height: 45px;					/* Höjd måste anges här för att border-bottom ska fungera */
font: 10px verdana, arial, sans-serif;		/* Font och storlek för menyn */
border-top: 4px solid #a00;			/* En röd linje i överkant på headern */
border-bottom: 4px solid #a00;			/* En röd linje i underkant på headern */
/*border-left: 1px solid #a00;
border-right: 1px solid #ddd;*/
background-color: #ECE4C4;			/* Bakgrundsfärg ECE4C4 */
/*background-image: url(/images/bgh1.gif);*/
}

#header .hflag {
margin-top: 25px;
margin-bottom: 0px;
margin-right: 22px;
}

#header ul {
width: 500px;
margin-top: 25px;
margin-bottom: 0px;
margin-right: 15px;
}

#header ul li {
float: right;					/* För att få en inline-meny */
list-style-type: none;				/* Tar bort punkterna i listan */
padding-left: 15px;				/* Mellanrum mellan valen och till högerloggan */
}

#header ul li a {
color: #888;					/* Grå menytext */
text-decoration: none;				/* Tar bort linjen under menytext */
}

#header ul li a:hover {
color: #a00;					/* Svart text vid mouse-over */
}

#header img {
border: none;					/* Ingen ram runt bildlänkar */
}

/* MENU ***************************************/

#menu {
clear: both;					/* Nollställer efter "flytisarna" i headern */
float: left;					/* Håll till vänster */
height: 200px;
width: 150px;					/* Bredd= 150 + 10 i marginal till content */
/*margin-left: 5px;*/
margin-right: 5px;
margin-top: 10px;				/* Lite snyggt en bit ner */
font: 12px verdana, arial, sans-serif;
text-align: left;
background-image: url(/images/bgmenu.gif);
}

#menu ul {
margin-top: 20px;				/* Lite snyggt en bit ner */
}

#menu li {
color: #a00;					/* Röda punkter */
line-height: 1.8em;				/* Lite ökat mellanrum */
margin-left: -5px;				/* Meny jämkad lite åt vänster */
}

#menu li a {
color: #888;					/* Färg på menytext */
font-weight: normal;
text-decoration: none;				/* Inga streck under texten */
}

#menu li a:hover {
color: #a00;					/* Ändra till svart text när musen kommer */
}

/* CONTENT ************************************/

#content {
float: right;					/* Håll även content åt vänster mot meyn */
width: 798px;					/* Bredd= 588px + 2px border */
border: 1px solid #888;
margin-top: 10px;				/* Lite snyggt under headerlinjen */
margin-bottom: 10px;				/* Lite snygg marginal till footer-text */
padding-top: 20px;				/* Innehåll en bit ner */
padding-bottom: 30px;				/* Lite snygg yta efter innehåll */
background-color: #ebebcf;			/* Bakgrundsfärg */
font: 14px Georgia, "New Century Schoolbook", Times, serif;
color: #600;					/* Textfärg */
text-align: center;				/* Centrerat som utgångspunkt */
}

#content img {
border: none;					/* Inga ramar runt länkbilderna */
}

#content .column {				/* Enkel lättläst textcolumn */
width: 430px;
margin-left: auto;
margin-right: auto;
text-align: left;
}

#content .col500 {				/* Text med 500 pixels bilder */
width: 500px;
margin-left: auto;
margin-right: auto;
text-align: left;
}

#content .info {				/* För informationsrutor mm */
margin-left: auto;
margin-right: auto;
font: 12px verdana, arial, sans-serif;
color: #600;
}

#content .code {				/* För kodexempel */
background-color: #fff;				/* Bakgrundsfärg */
padding: 10px;
font: 12px verdana, arial, sans-serif;
color: #000;
border: 1px solid #aaa;				/* Diskret ram runt */
}

#content #prodlist {				/* För produktlistan */
width: 500px;
margin-left: auto;
margin-right: auto;
font: 12px verdana, arial, sans-serif;
text-align: left;
color: #600;
white-space: nowrap;
}

#content .brdr {
border: 1px solid #888;				/* Diskret ram runt dessa bilder */
}

#content #prodlist td {
border: 0px solid #aaa ;
background-color: #fff;				/* Bakgrundsfärg */
height: 20px;
padding-left: 5px;
padding-right: 5px;
}

#content #prodlist th {
background-color: #BBD4B0;			/* Bakgrundsfärg */
text-align: left;
padding-left: 5px;
font: 10px verdana, arial, sans-serif;
font-weight: normal;
color: #444;
border: 1px solid #888;				/* Diskret ram runt */
}

#content #prodlist a {
color: #600;
font-weight: normal;
text-decoration: none;
}

#content #prodlist a:hover {
color: #f00;
}

#content #sitemap {				/* Text med 500 pixels bilder */
width: 400px;
/*margin-top: 50px;*/
margin-left: auto;
margin-right: auto;
font: 12px verdana, arial, sans-serif;
text-align: left;
line-height: 0.8em;				/* Lite ökat mellanrum */
}

#content #sitemap ul {
margin-top: 5px;
}

#content #sitemap ul li {
list-style-type: none;				/* Tar bort punkterna i listan */
}

#content #sitemap a {
color: #600;
font-weight: normal;
text-decoration: none;
}

#content #sitemap a:hover {
color: #f00;
}

#content .support td {
background-color: #fff;			/* Bakgrundsfärg */
text-align: left;
padding: 5px;
font: 12px verdana, arial, sans-serif;
font-weight: normal;
color: #444;
border: 1px solid #888;				/* Diskret ram runt */
}

#content a:link, #content a:visited {		/* Alltid samma länkfärg */
color: #00f;
}

#content table {
text-align: left;				/* Vänsterorienterad text i tabeller */
color: #600;
}

#content h1 {					/* Headings H1 till H4 */
font: 24px verdana, arial, sans-serif;
color: #600;
font-weight: normal;
}

#content h2 {
font: 20px verdana, arial, sans-serif;
color: #600;
font-weight: normal;
}

#content h3 {
font: 16px verdana, arial, sans-serif;
color: #600;
font-weight: normal;
}

#content h4 {
font: 12px verdana, arial, sans-serif;
color: #600;
font-weight: normal;
}

#content h5 {
font: 10px verdana, arial, sans-serif;
color: #600;
font-weight: normal;
}

#content li {
padding-bottom: 10px;				/* Lite mer space i listor */
}

/* SIDEBAR ************************************/

#sidebar {
float: right;					/* Denna får hålla till höger */
width: 0px;					/* Bredd= 200px vilket automatiskt bör ge en marginal på 10px från content */
margin-top: 30px;				/* Lite snyggt en bit ner */
text-align: center;				/* Centrerar allt här */
}

#sidebar img {
border: none;					/* Inga ramar runt länkbilderna */
padding-bottom: 10px;				/* Lite extra luft till nästa bild */
}

#sidebar .info {				/* För eventuell text i sidebar */
font: 10px verdana, arial, sans-serif;
color: #888;
font-weight: normal;
}

/* FOOTER *************************************/

#footer {
clear: both;					/* Nollställer efter "flytisarna" ovanför */
text-align: center;				/* Centrerad text.... */
margin-left: 157px;				/* ....under content */
padding-bottom: 0px;				/* Lite extra luft under texten */
font: 10px verdana, arial, sans-serif;
color: #888;
}

#footer a {
color: #888;
font-weight: normal;
text-decoration: none;
}

#footer a:hover {
color: #a00;
}