﻿body {
    margin: 0px; 
    background-image: url('../bilder/bg_main3.jpg');
    background-color: #555; 
    background-repeat: repeat;
    font-family: Verdana, Geneva, Tahoma, Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 15px;
}

img {
	border:0;
}

a:active {
  outline:none;
}

:focus {
  -moz-outline-style:none;
}

.red {color: Red;}


/******************** TEXT Formateringar ***********************/
h1 {font-size: 34px; font-weight: bold; line-height: normal; margin-top: 0px;}

h2 {font-size: 24px; font-weight: bold; line-height: normal; color: #000;}

h3 {font-size: 16px; font-weight: bold; line-height: normal;}

h4 {font-size: 13px; font-weight: bold;}

h5 {font-size: 13px; font-weight: bold; margin: 0px 0px 5px 0px;}

.h3look {font-size: 16px; font-weight: bold; color: #000;}
.h1look {font-size: 34px; font-weight: bold; color: #903a88;}

.h1small {font-size: 24px; font-weight: bold; line-height: normal;} 

.underrubrik {font-size: 20px; font-weight: bold; line-height: normal;}

small {
	font-size: 7pt;
}

.litentext{
	font-family: Tahoma, Geneva, Arial, Helvetica, sans-serif;
	font-size: 9pt;
	padding-left: 0px;
	padding-right: 5px;
	text-align: left;
	line-height: 140%;
}

.brodtext { font-size: 8pt; line-height: 13pt; font-family: Verdana, Tahoma;}

.sasongsfarg, h1, a:link, a:visited, .underrubrik {
 /*color: #299100;*/
 /*color: #4ee44e;*/
 /*color: #40d640;*/
 /*color: #3ece3e;*/
 /*color: #903a88;*/
 color: #c01a26;
}

.tulpanröd 
{
    color: #c01a26;
}

.snyggliten,.snyggliten2
{
    color:#000;
    font-family: Verdana,"Trebuchet MS",Arial,Helvetica,sans-serif;
    font-size:11px;
    font-style:normal;
    font-variant:normal;
    font-weight:normal;
    letter-spacing:1px;
    word-spacing:1px;
}
.snyggliten2 {letter-spacing:0px;
    word-spacing:0px;}

/******************** Länkar ***********************/
a:link {
	text-decoration: underline;
}


a:hover {
	color: #000000;
	text-decoration: none;
}

a:active {
  outline:none;
}
 
:focus {
  -moz-outline-style:none;
}



/******************** Layout ***********************/

.box { 
    background-image: url("../bilder/sidmoduler/sidmodul_1spalt.gif");
    background-position: center top; 
    background-repeat: no-repeat; 
    clear: both; 
    float: none; 
    overflow: hidden; 
    width: 196px;
    margin: 0 0 0 -9px; 
    padding: 0; 
    text-align: center;
}

.boxDubbel { 
    background-image: url("../bilder/sidmoduler/sidmodul_2spalt.gif");
    background-position: center top; 
    background-repeat: no-repeat; 
    clear: both; 
    float: none; 
    overflow: hidden; 
    width: 508px;
    margin: 0 0 0 -9px; 
    padding: 0; 
    text-align: center;
}
        
.contentcontainer {
    background-image: url("../bilder/sidmoduler/sidmodul_1spalt.gif");
    background-position: center bottom; 
    background-repeat: no-repeat; 
    clear: both; 
    float: none; 
    width: 196px;
    margin: 12px auto 0;
}

.contentcontainerDubbel {
    background-image: url("../bilder/sidmoduler/sidmodul_2spalt.gif");
    background-position: center bottom; 
    background-repeat: no-repeat; 
    clear: both; 
    float: none; 
    width: 508px;
    margin: 12px auto 0;
}
        
.contentcontainer div {
    clear: both; 
    display: table;
    float: none; 
    width: 162px;
    margin: 0 auto 0px;
    font-size: 9px; 
    text-align: left; 
    padding-bottom: 20px;
}

.contentcontainer .tvheader {
     /*background-color: #903a88;*/
     background-color: #c01a26;
     color: #FFF; 
     height: 20px; 
     width: 180px; 
     padding-bottom: 0px;
}

.contentcontainer .tvheadertext {
  padding-top: 1px; 
  padding-left: 4px; 
  padding-bottom: 0px; 
  font-weight: bold;
}

.contentcontainer .tvinfo {
     padding-left: 4px;
     padding-bottom: 0px;
     font-size: 9px; font-family: Arial;
}

.contentcontainerDubbel div {
    display: table;
    float: none; 
    width: 474px;
    margin: 0 auto 0px;
    font-size: 9px; 
    text-align: left; 
    padding-bottom: 20px;
}

.contentcontainer h1, .contentcontainerDubbel h1 {
    font-size: 25px; 
    font-family: 'Arial Black', verdana; 
    margin: 0px;
}

.contentcontainer h2, .contentcontainerDubbel h2 {
    font-family: 'Arial Black', verdana;
}


#maindiv {
    width: 980px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 4px;
}


#top {  
    width: 980px;
    height: 90px;
    background-image: url('../bilder/bg_top2.gif');
} 

#logo
{
    position:relative;
    top: 20px;
    left: 32px;
}

#datum 
{
    position:relative;
    top: 17px;
    left: 32px;
}

#content {
    width: 936px;
    min-height: 200px;
    background-image: url('../bilder/bg_content.gif');
    padding: 22px;
    padding-top: 25px;
    overflow: hidden;
}

#contentHem {
    width: 933px;
    min-height: 200px;
    background-image: url('../bilder/bg_content.gif');
    padding: 22px;
    padding-left: 30px;
    padding-top: 17px;
    overflow: hidden;
}

#toppknapparna 
{
    height: 99px;    
}

.toppknapp
{
    margin-right: 8px;
    float: left;
    cursor:pointer;   
}
.toppknappsista
{
    float: left;  
    cursor:pointer; 
}

#handskriven_text
{
  width: 100%;
  height: 22px;
  margin-top: 19px;
  margin-bottom: 14px;
}

/* Spalter */
#spaltwrapper 
{
    width: 936px;
    margin-top: 10px;
    display: table;
}

#dubbelspalt
{
    width: 640px;
    margin-right: 20px;
    margin-top: -15px;
    float: left; 
}

#modulspalt {
    width: 275px;
    float: left;
    overflow: hidden; 
}

.spalt1 {
    width: 275px;
    margin-right: 6px;
    float: left; 
    display: table-cell;
}

.spalt2 {
    width: 275px;
    margin-right: 6px;
    float: left; 
    display: table-cell;
}

.spalt3 
{
    width: 370px;
    float: left; 
    margin-top: -1px;
    margin-right: 14px;
    display: table-cell;
}

.spaltstor 
{
    width: 380px;
    float: left;
}

.spaltmax 
{
    width: 540px;
    float: left;
}


.sidmodul, .sidmodul2 
{
    background-image: url('../bilder/sidmoduler/sidmodul_bg2.gif');
    width: 275px;
    height: 101px;
    margin-bottom: 4px;
    padding: 0px;
}

.sidmodul2 
{
    margin-bottom: 12px;
}

.mittmodul 
{
    background-image: url('../bilder/mittmodul_bg2.gif');
    width: 275px;
    height: 206px;
    margin-bottom: 4px;
}

.modul
{
    width:375px;
}

.modultop
{
    height: 20px; background: url('../bilder/modul_top.gif') no-repeat;
}
.modulmiddle
{
    background: url('../bilder/modul_middle.gif');
    padding: 5px 9px 5px 15px
}
.modulbottom
{
    height: 18px; background: url('../bilder/modul_bottom.gif') no-repeat;
}

.modulräknare
{
    background-image:url('../bilder/modul_raknare.jpg'); width: 367px; height: 416px;
}

#mainflash {
    height: 240px; padding-left:6px;
}


#bottom {
    height: 16px;
    background-image: url('../bilder/bg_bottom2.gif'); 
    margin-bottom: 5px;
} 

#footer 
{
    height: 18px; 
    text-align: center; 
    vertical-align: top;
    color: White; 
    font-size: 7pt;
    margin-bottom: 30px;
}

.enkeltsteg  
{
    float: left;
    width: 100px; 
    margin-right: 8px;
}


/* Menyn */
#meny 
{
    width:968px;
    height: 33px;
    overflow: hidden; 
    margin-left: 6px;
    background:#4ee44e url('../bilder/meny_bg_green.gif') repeat-x scroll 0 0;
}

#meny table {
	font-size:1.0em;
	border:0px;
	border-collapse: collapse;
	text-align:left;
	margin-left: 2px;
	white-space: nowrap;
	width:972px; 	
}

#meny td {
	background:#4ee44e url('../bilder/meny_bg_green.gif') repeat-x scroll 0 0;
	padding: 0px;
}

#meny td a .separator {
	background:url('../bilder/meny_seperator_green.gif') no-repeat center right;
	width:100%;
	height:23px;
	padding-top:10px;
	cursor:pointer;	
}

#meny td a .separator2 {	
	width:100%;
	height:23px;
	padding-top:10px;
	cursor:pointer;	
}

#meny td a .padding {
	padding:0 1.68em;
	cursor:pointer;
	line-height:1.182em;
	color:#FFF;	
}

#meny td div:hover,
#meny td div.active {
	background:#4ee44e url('../bilder/meny_bg_hoover_green.gif') repeat-x 0px 0px;
	text-decoration:none;
	color: #FFF; /* For IE6 */
}

.menypil {
    vertical-align:top; 
    margin-top: 7px;
    margin-left: 2px;
}

.nounderline {
    text-decoration: none !important;
}


/* Sidmoduler */
#sm_tulpantv 
{
    position: relative;
    background: url('../bilder/sidmoduler/sidmodul_tulpantv.jpg') no-repeat; 
    width: 254px; 
    height: 83px; 
    position: relative; 
    top: 10px; 
    left: 9px;
}

#sm_merinfo 
{
    position: relative;
    background: url('../bilder/sidmoduler/sidmodul_merinfo.gif') no-repeat; 
    width: 253px; 
    height: 87px; 
    position: relative; 
    top: 8px; 
    left: 11px;
}

#sm_förtjänst
{
    position: relative;
    background: url('../bilder/sidmoduler/sidmodul_fortjanst.gif') no-repeat; 
    width: 253px; 
    height: 87px; 
    position: relative; 
    top: 8px; 
    left: 16px;
}



#sm_tavling 
{
    position: relative;
    background: url('../bilder/sidmoduler/sidmodul_tavling.gif') no-repeat; 
    width: 252px; 
    height: 90px; 
    position: relative; 
    top: 8px; 
    left: 11px;
}

#sm_resa 
{
    position: relative;
    background: url('../bilder/sidmoduler/sidmodul_resa.gif') no-repeat; 
    width: 248px; 
    height: 93px; 
    position: relative; 
    top: 4px; 
    left: 11px;
}

#sm_garanti
{
    position: relative;
    background: url('../bilder/sidmoduler/sidmodul_garanti.gif') no-repeat; 
    width: 248px; 
    height: 93px; 
    position: relative; 
    top: 4px; 
    left: 11px;
}


/* Jquery */

/* the overlayed element */ 
div.overlay { 
     
    /* growing background image */ 
    background-image:url(../bilder/overlay_bg_white.png); 
     
    /* dimensions after the growing animation finishes  */ 
    width:651px; 
    height:533px;         
     
    /* initially overlay is hidden */ 
    display:none; 
     
    color: White;
} 


div.overlay .inrebox 
{
    position: absolute; 
    display: inline-block; overflow: auto;
    left: 42px;
    top: 33px;
    /*color: #40d640;*/    
    color: #000;
    width: 570px;
    height: 450px;
    }

div.overlay .inrebox h2 {
    color: #40d640;
}
div.overlay .inrebox h3 {
    color: #40d640;
}
 
/* default close button positioned on upper right corner */ 
div.overlay .close { 
    background-image:url(../bilder/close.png); 
    position:absolute; 
    right: 5px; 
    top: 5px; 
    cursor:pointer; 
    height: 35px; 
    width: 35px; 
} 

/* ------------ TulpanTV --------------- */


.tv  
{
    background: url(../bilder/tulpantv/tv.jpg) no-repeat; 
    width: 554px; 
    height: 449px;
    margin-bottom: 35px;
    margin-left: 20px;
}

/* player container */
.player 
{
    position: relative; 
    top: 37px;
    left: 34px;
	height:320px;
	width:480px;
	border:2px solid #fff;
	outline:1px solid #333;
	-moz-outline-radius:4px;
	cursor:pointer;
	float:left;
	text-align:center;
	margin-right:15px;
}

/* play knappen */
.player img {
	margin-top:112px; left: 190px; position: relative;
	margin-bottom: 50px;
}

/* info area */
.player div.info {
    clear: both;
	height:40px;
	background:#000;
	opacity:0.7;
	color:#fff;
	text-align:center;
	padding: 6px 0px;		
	font-size:12px;
	border-top:1px solid #ccc;
	margin-top:75px;	
}

/* duration data inside info area */
.player div.info span {
	color:#99FF99;
	display:block;
	font-weight:bold;
}


/* wrapper element for playlist items */
div.clips, div.clips2 {
	/*background:#fff url(../bilder/h150.png) repeat scroll;*/
	margin-top:-20px;
	margin-left: -10px;
	padding:0px 0px;
}

/* single playlist entry */
div.clips a, div.clips2 a {
	background:transparent url(../bilder/tulpantv/tv_knappar.gif) no-repeat scroll 0;
	display:block;
	float:left;
	height:131px;
	margin:0px 5px 12px 0;
	width:113px;
	font-size: 11px;
	padding-left: 5px;
	padding-right: 0px;
	text-decoration: none;
    font-weight: bold;
}

div.clips a em, div.clips2 a em {
	color:#f00;
	font-size: 8px;
	font-weight: normal;
}	

div.clips a small, div.clips2 a small {
	color:#000;
	font-size: 9px; font-family: Arial;
	font-weight: normal; letter-spacing: -0.0px;
}


/* playlist entry when mouse is entered */
div.clips a:hover, div.clips2 a:hover {
	background-position:-118px 0;		
}

/* active playlist entry */
div.clips a.playing, #clips a.paused {
	background-position:-236px 0;
	outline:none;
}

div.controls div.buffer {
	background-color:#789;
}

div#subtitle 
{
    height: 16px;
    font-size: 10px;
    font-family:"bitstream vera sans","trebuchet ms";
}



/* Outlinemenyn som fälls ned */
.outlinemenu{
position: absolute; /*leave this alone*/
display: none; /*leave this alone*/
width: 250px; /*default width of menu*/
border: 1px solid #fff;
overflow-x: hidden;
}

.outlinemenu ul{
list-style-type: none;
margin: 0;
padding: 0; 
}

.outlinemenu ul li a{
background: #4ee44e;
font: normal 12px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: #fff;
display: block;
width: auto;
padding: 3px 0;
padding-left: 5px; width: 350px;
text-decoration: none;
border-bottom: 1px solid #fff;
}

.outlinemenu ul li a:visited, .outlinemenu ul li a:active{
color: #fff;
background: #4ee44e;
text-decoration: none;
}

.outlinemenu ul li a:hover{
color: #fff;
background: #23dc34;
text-decoration: none;
}

/* Holly Hack for IE \*/
* html .outlinemenu li {height: 1%; }
* html .outlinemenu li a { height: 1%; }
/* End */








/* ----------  TABS -----------------*/


/* root element for tabs  */
ul.tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;
	height:30px;
	border-bottom:1px solid #666;	
}

/* single tab */
ul.tabs li { 
	float:left;	 
	text-indent:0;
	padding:0;
	margin:0 !important;
	list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
ul.tabs a { 
	background: url(../bilder/tabs_green.png) no-repeat -420px 0;
	font-size:13px;
	font-weight: bold;
	display:block;
	height: 30px;  
	line-height:30px;
	width: 134px;
	text-align:center;	
	text-decoration:none;
	color:#333;
	padding:0px;
	margin:0px;	
	position:relative;
	top:1px;
}

ul.tabs a.green { 
	background: url(../bilder/tabs_green.png) no-repeat -420px 0;
	font-size:13px;
	font-weight: bold;
	display:block;
	height: 30px;  
	line-height:30px;
	width: 134px;
	text-align:center;	
	text-decoration:none;
	color:#333;
	padding:0px;
	margin:0px;	
	position:relative;
	top:1px;
}

ul.tabs a:active {
	outline:none;		
}

/* when mouse enters the tab move the background image */
ul.tabs a:hover {
	background-position: -420px -31px;	
	color:#fff;	
}

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
	background-position: -420px -62px;		
	cursor:default !important; 
	color:#000 !important;
	outline:none;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
ul.tabs a.w1 			{ background-position: -519px 0; width:134px; }
ul.tabs a.w1:hover 	{ background-position: -519px -31px; }
ul.tabs a.w1.current { background-position: -519px -62px; }

/* width 2 */
ul.tabs a.w2 			{ background-position: -366px -0px; width:154px; }
ul.tabs a.w2:hover 	{ background-position: -366px -31px; }
ul.tabs a.w2.current { background-position: -366px -62px; }


/* width 3 */
ul.tabs a.w3 			{ background-position: -193px -0px; width:174px; }
ul.tabs a.w3:hover 	{ background-position: -193px -31px; }
ul.tabs a.w3.current { background-position: -193px -62px; }

/* width 4 */
ul.tabs a.w4 			{ background-position: -0px -0px; width:194px; }
ul.tabs a.w4:hover 	{ background-position: -0px -31px; }
ul.tabs a.w4.current { background-position: -0px -62px; }


/* initially all panes are hidden */ 
div.panes div.pane {
	display:none;		
	padding:15px 10px;
	border:1px solid #999;
	border-top:0;
	font-size:11px;
	background-color:#fff;
	width: 560px;
}


.enkeltsteg img {
	margin:0 20px 10px 0;	
	cursor:pointer;	
}

div.description {
	background-color:#ccffcc;
	border:2px solid #ccc;	
	min-height:260px;
	display:none;
	margin-top:63px;
	-moz-border-radius:4px;
	padding:0 20px;
	color: #000;
}


div.description div.arrow {
	width:34px;
	height:34px;
	background:transparent url(../bilder/pilar_green.png) repeat scroll 0 -68px;
	margin-top:-28px;
	margin-left:36px;
}

#steg1 div.arrow {
	margin-left:20px;	
}

#steg2 div.arrow {
	margin-left:130px;	
}

#steg3 div.arrow {
	margin-left:230px;	
}

#steg4 div.arrow {
	margin-left:345px;	
}

#steg5 div.arrow {
	margin-left:445px;	
}



/* Tooltip */

.tooltip{
        position:absolute;
        z-index:999;
        left:-9999px;
        background-color:#dedede;
        padding:5px;
        border:1px solid #fff;
        width:250px;
    }

.tooltip p{
        margin:0;
        padding:0;
        color:#fff;
        background-color:#222;
        padding:8px 12px; font-family: Arial, Sans-Serif; 
        font-size: 12px; 
    }
    


.tulpan {
width: 59px; float: left; height: 63px; -moz-outline-style:none;
}
