﻿body,html,form {height:100%;padding:0px;margin:0px;} /* Standardkod för att göra 100% höga webbsidor */

/*****************************************
 Generella element
/*****************************************/

body 
{
	font-family: Verdana, sans-serif;
	background-color:#2e2e2e;

    background-position:top center;
    background-repeat:repeat-y;
    font-size:10px;
    color:#5d5d5d;
}


.ImageHeading /* Alla rubrikbilder */
{
	padding-bottom:10px;
	display:block; /* inbyggd radbrytning*/
}

a,a:link,a:active,a:visited,a:hover
{
    
}

.Textbox
{
}

.Button
{
}


/*****************************************
 Rubriker 
/*****************************************/

h1,h2,h3,h4
{
	font-weight:normal;
}

h1 /* Störst */
{
}

h2 
{
}

h3
{
}

h4 /* Minst */
{
	text-transform:uppercase;
	font-weight:bold;
	font-size:10px;
	margin-bottom:5px;
}

/*****************************************
  Layout
/*****************************************/
#Container 
{
	width:100%;
	height:575px;
	overflow:hidden;
	position:relative;
	background-color:black;
	background-image:url(../images/backgrounds/Container.gif);
	background-repeat:repeat-x;

}
	#MainContainer
	{
		width:100%;
		text-align:center;
		margin:auto;
		}      
	        
			#Nav
			{
				background-image:url(../images/Menu/MenuRep.gif);
				background-repeat:repeat-x;
	            
			}

	#BottomRep
	{
		position:relative;
		height:104px;
		width:100%;
		background-position:top;
		background-image:url(../images/bottomTopKant_rep.gif);
		background-repeat:repeat-x;
	    
	}

/*****************************************
  Menyn
/*****************************************/

#MenuHolder
{
	width:961px;
	height:109px;
	background-image:url(../images/Menu/Menu.jpg);
	background-repeat:no-repeat;
	position:relative;
	margin:auto;
}

	#MenuHolder .MenuButton
	{
		cursor:pointer;
	}

	#MenuHolder #ButtonHolder1,#MenuHolder #ButtonHolder2
	{
		position:absolute;
		width:385px;
		height:30px;
		top:39px;
	}


	#MenuHolder #ButtonHolder1
	{
		left:0px !important;
		left:-190px;
		
	}
	
		#MenuHolder #Menu1
		{
			position:relative;
		}
			
			#MenuHolder #Menu1 li
			{
				list-style:none;
				position:absolute;
				top:0px;
			}
		
			#Menu1 #Hem
			{
				left:46px;
			}
			
			#Menu1 #Mecs
			{
				left:115px;
			}
			
			#Menu1 #Inspirationsresa
			{
				left:193px;
			}
	
		#MenuHolder #ButtonHolder2
		{
			left:573px;
		}
		
			#MenuHolder #Menu2
			{
				position:relative;
				float:left;
			}
			
				#MenuHolder #Menu2 li
				{
					list-style:none;
					position:absolute;
				}
		
					#Menu2 #Portfolio
					{
						
					}
					
					#Menu2 #Bioreklam
					{
						left:107px;	
					}
					
					#Menu2 #Kontakt
					{
						left:218px;	
					}

	#MenuHolder #MecsLink
	{
		width:180px;
		height:82px;
		display:block;
		margin:auto;
	}

/*****************************************
  Animation
/*****************************************/

#InnerContainer
{
	position:absolute;
	height:500px;
}
	
#Page0,#Page1,#Page2,#Page3,#Page4,#Page5,#Page6,#Page7,#Page8,#Page9
{
	width:961px;
	height:500px;
	margin-right:10px;
	background-image:url(../images/mockup1.jpg);
	background-repeat:no-repeat;
	background-color:gray;
	float:left;
}

#NavLeft,#NavRight
{
	height:500px;
	position:absolute;
	width:23px;
	z-index:5;
	background-repeat:no-repeat;
	background-position:center;	
	cursor:pointer;
	

}



#NavLeft
{
	background-image:url(../images/misc/arrowleft.gif);
}
	#NavLeft:hover
	{
		/*background-image:url(../images/Backgrounds/NavBg.png);*/
		background-color:#313131;
		
	}
	
#NavRight
{
	background-image:url(../images/misc/arrowright.gif);
}
	#NavRight:hover
	{
		background-color:#313131;
	}
		
#BottomNav
{
	margin:auto;
	padding-top:510px;
	height:75px;
	width:961px;
}

	#BottomNav .NavBox
	{
		margin-right:15px;
		float:left;
		cursor:pointer;
		padding-top:5px;
	}
		#BottomNav .NavBox img
		{
			border:1px solid #414141;

		}
		
		#BottomNav .NavBox img:hover
		{
			border:1px solid #ef4123;
		}


/*****************************************
  Hem
/*****************************************/

.Scrollbox
{
    border:0px none;
    height: 310px;
    width: 430px;    
    overflow: auto;
    scrollbar-face-color: #ffffff; 
    scrollbar-highlight-color: #ffffff; 
    scrollbar-shadow-color: #ffffff;
    scrollbar-3dlight-color: #9b9b9b;
    scrollbar-arrow-color: #9b9b9b; 
    scrollbar-track-color: #cdcdcd;
    scrollbar-darkshadow-color: #9b9b9b;
    }
  
    
#Container #Hem
{
	background-color:White;
	width:100%;
	background-image:url(../images/backgrounds/content.gif);
	text-align:center;
	height:500px;
	overflow:hidden;
}

	#Container #Hem #NewsWrapper
	{
		width:835px;
		height:390px;
		margin:auto;
		margin-top:60px;
		text-align:right;
		position:relative;
		padding-left:15px;
		
	}
		#Container #Hem #Globe
		{
			position:absolute;
			top:0px;
			left:0px;	
			width:680px;
			height:340px;	
		}
		
		#Container #Hem #News
		{
			position:absolute;
			top:0px;
			right:0px;
			width:450px;
			height:340px;	
			text-align:left;
		}
		
		#Container #Hem #News #NewsContainer
		{
			position:relative;
			top:50px;
			left: 35px;
			display: block;	
			width: 100%;			
			text-align:left;
		}
				
		#Container #Hem #News .NewsItem
		{
			margin-bottom:2px;
			display:block;
		}
/*****************************************
  Mecs
/*****************************************/

#Container #Mecs
{
	
}

	#Container #Mecs #InnerContainer /* 971 st*/
	{
		width:3884px;
	}
	
	#Container #Mecs #Page0
	{
		background-image:url(../images/mecs/01.jpg);
		background-repeat:no-repeat;
		text-align:left;
	}
	
	#Container #Mecs #Page1
	{
		background-image:url(../images/mecs/02.jpg);
		background-repeat:no-repeat;
		text-align:left;
	}
	
	#Container #Mecs #Page2
	{
		background-image:url(../images/mecs/03.jpg);
		background-repeat:no-repeat;
		text-align:left;
	}
	
p
{
    margin-bottom:10px;
    }	
/*****************************************
  Portfolio
/*****************************************/

#Container #Portfolio
{
	text-align:left;
	color:White;
}

	#Container #Portfolio #InnerContainer 
	{
		width:7000px; /*6797*/
	}
	
	#Container #Portfolio #Page0
	{
		background-image:url(../images/Backgrounds/Content2.gif);
		background-repeat:repeat-x;
		text-align:center;	
	}
	
		#Container #Portfolio #Page0 #PortfolioWrapper
		{
			margin:30px;
			margin-left:70px;

		}
		
			#Container #Portfolio #Page0 .PortfolioBox
			{
				width:241px;
				height:225px;
				float:left;
				background-repeat:no-repeat;
				margin-right:40px;
				cursor:pointer;
			}
		
			#Container #Portfolio #Page0 #CaseBox
			{
				background-image:url(../images/buttons/case.gif);
			}
				#Container #Portfolio #Page0 #CaseBox:hover
				{
						background-image:url(../images/buttons/casehover.gif);
				}
			
			#Container #Portfolio #Page0 #WebbBox
			{
				background-image:url(../images/buttons/webb.gif);	
			}
				#Container #Portfolio #Page0 #WebbBox:hover
				{
					background-image:url(../images/buttons/webbhover.gif);	
				}
				
			#Container #Portfolio #Page0 #SystemBox
			{
				background-image:url(../images/buttons/system.gif);	
			}
				#Container #Portfolio #Page0 #SystemBox:hover
				{
				background-image:url(../images/buttons/systemhover.gif);	
				}
			
			#Container #Portfolio #Page0 #PrintBox
			{
				background-image:url(../images/buttons/print.gif);	
			}
				#Container #Portfolio #Page0 #PrintBox:hover
				{
					background-image:url(../images/buttons/printhover.gif);	
				}
			
			#Container #Portfolio #Page0 #FotoBox
			{
				background-image:url(../images/buttons/foto.gif);	
			}
				#Container #Portfolio #Page0 #FotoBox:hover
				{
					background-image:url(../images/buttons/fotohover.gif);	
				}
			
			#Container #Portfolio #Page0 #RorligtBox
			{
				background-image:url(../images/buttons/rorligt.gif);		
			}
				#Container #Portfolio #Page0 #RorligtBox:hover
				{
					background-image:url(../images/buttons/rorligthover.gif);	
				}
				


	#Container #Portfolio #CaseWrapper,#Container #Portfolio #WebbWrapper,#Container #Portfolio #SystemWrapper,#Container #Portfolio #PrintWrapper,#Container #Portfolio #FotoWrapper,#Container #Portfolio #RorligtWrapper
	{
		height:100%;
		width:100%;	
		background-repeat:repeat-x;
		position:relative;
	}
				
	

		#Container #Portfolio #CaseWrapper
		{
		
			background-image:url(../images/backgrounds/Case.jpg);

		}
	
		#Container #Portfolio #WebbWrapper
		{
			height:100%;
			width:100%;
			background-image:url(../images/backgrounds/Webb.jpg);
			background-repeat:repeat-x;
			position:relative;
		}
	
		#Container #Portfolio #SystemWrapper
		{
			background-image:url(../images/backgrounds/system.jpg);
		}
	
	
		#Container #Portfolio #PrintWrapper
		{
			background-image:url(../images/backgrounds/print.jpg);
		}
	
		#Container #Portfolio #FotoWrapper
		{
			background-image:url(../images/backgrounds/foto.jpg);	
		}
		
		    #Container #Portfolio #FotoWrapper .Description
		    {
			    position:absolute;
                top:25px;
                width:250px;
                left: 620px;
		    }		    
		    
		    #Container #Portfolio #FotoWrapper .Images
		    {
			    left:0;
                position:absolute;
                top:25px;
		    }
	
		#Container #Portfolio #RorligtWrapper
		{
			background-image:url(../images/backgrounds/rorligt.jpg);	
		}
		
			#Container #Portfolio #RorligtWrapper #Player
			{
				float:right;
				margin-top: 25px; margin-right:45px;
			}
	
	
/*
	Klasser
*/
	
	
	#Container #Portfolio .IconText
	{
		position:absolute;
		left:38px;
		top:30px;
	}
	
	#Container #Portfolio .Browser
	{
		position:absolute;
		left:38px;
		top:49px;
	}
		
/*****************************************
  PortfolioBrowser
*****************************************/


.PortfolioBrowser
{
	width:900px;
	height:445px;
	position:relative;
}

	.Description
	{
		position:absolute;
		top:240px;

		width:400px;
	}
	
	.PortfolioBrowser .Images
	{
		position:absolute;
		top:0px;
		left:450px;
		
	}
		.PortfolioBrowser ul
		{
			margin:0px;
			padding:0px;
		}
		
				.PortfolioBrowser li
				{
					float:left;
					display:block;
				}
				
					.PortfolioBrowser li .ArrowImage
					{
						padding-top:20px;
					}
					
					.PortfolioBrowser .SquareBox
					{
						width:352px;
						height:76px;
						background-image:url(../images/Images/Misc/Squares.png);
						background-repeat:no-repeat;
						position:relative;
						padding-left:1px;

					}
					
						.PortfolioBrowser .SquareBox .Squares
						{
							position:absolute;
							left:0px;
							top:0px;
							z-index:0;
						}
						
						.PortfolioBrowser .SquareBox .Thumbs
						{
							position:absolute;
							left:0px;
							top:1px;
							z-index:1;	
							padding-left:9px;
							
							
						}
							.PortfolioBrowser .SquareBox .Thumbs .Thumb
							{
								margin:0px;
								padding-right:6px;
								margin-top:6px;
							}
							
							
							
/***********************************************
    Kontakt
***********************************************/							

#Container #Kontakt
{
    background-color:White;
	width:100%;
	background-image:url(../images/backgrounds/content.gif);
	text-align:center;
	height:500px;
	overflow:hidden;
    margin:auto;		
    }
    
#Container #Kontakt #KontaktWrapper
	{
		margin:auto;
		width:900px;
	}

	#Container #Kontakt #StaffTable
	{
		text-align:left;
	}
		#Container #Kontakt #StaffTable td
		{
			padding-right:15px;
			padding-bottom:3px;
		}
		
		#Container #Kontakt #StaffTable .Separator
		{
			height:15px;
		}
		
		
		#Container #Kontakt #StaffTable tr:hover,#Container #Kontakt #StaffTable tr:hover a,#Container #Kontakt #StaffTable .Active,#Container #Kontakt #StaffTable .Active a
		{
			color:#fb7140;
		}
		
		#Container #Kontakt h4
		{
			color:#051955;
			font-weight:bold;
			text-transform:none;
			margin-bottom:4px;
		}

	#Container #Kontakt #StaffPicture
	{		
		float:left;
		width:480px;
		height:500px;
	}

	#Container #Kontakt #StaffList
	{
		width:400px;
		height:500px;
		float:left;
		color:#5d5d5d;	
		text-align:left;			
	}
	
.StaffList a,a:link,a:visited,a:active
{
    color:#5d5d5d;
    text-decoration:none;
    
    }
    
    .StaffList a:hover
    {
        color:#fc713c;
        text-decoration:none;
        }
        
/***********************************************
    Kontakt
***********************************************/							

#Container #Kontakt
{
    background-color:White;
	width:100%;
	background-image:url(../images/backgrounds/content.gif);
	text-align:center;
	height:500px;
	overflow:hidden;
    margin:auto;		
    }
    

	#Container #Kontakt #StaffPicture
	{		
		float:left;
		width:480px;
		height:500px;
	}

	#Container #Kontakt #StaffList
	{
		width:400px;
		height:500px;
		float:left;
		color:#5d5d5d;	
		text-align:left;			
	}
	
.StaffList a,a:link,a:visited,a:active
{
    color:#5d5d5d;
    text-decoration:none;
    
    }
    
    .StaffList a:hover
    {
        color:#fc713c;
        text-decoration:none;
        }
        
/*****************************************
  Portfolio
/*****************************************/

#Container #Inspiration
{
	text-align:left;
	color:White;
}

	#Container #Inspiration #InnerContainer 
	{
		width:15000px; /*6797*/
	}
	
	
#CaseLinks
{
	position:absolute;
	left:42px;
	top:22px;
}
	#CaseLinks a
	{
		display:block;
		color:White;
		line-height:15px;
		font-size:10px;
		font-weight:bold;
		text-transform:uppercase;
		cursor:pointer;
	}
	
		#CaseLinks a:hover
		{
			text-decoration:underline;
		}


/*****************************************
Lokal Bioreklam
*****************************************/

    
#Container #Lokal_Bioreklam
{
    width:961px;
	background-image:url(../images/backgrounds/lokal_bioreklam.jpg);
	background-repeat:no-repeat;
	text-align:center;
	height:500px;
	overflow:hidden;
    margin:auto;		
    }
    

	#Container #Lokal_Bioreklam #Content
	{		
		float:left;
		width:400px;
		height:500px;
		padding-left:60px;
		padding-top:115px;
		text-align:left;
		color:#afd1f7;
		
	} 
	
	#Container #Lokal_Bioreklam #Content b
	{
	    color:#ffffff;
	}
	    
/*****************************************
 News
*****************************************/	

 #News h4
 {
	font-size:10px; 
	margin-bottom:2px;
	color:#051955;
	font-weight:normal;
 }
 
#News h5
 {
	font-size:10px; 
	color:#fe1a0d;
	margin-bottom:2px;
 }
 
 #News p
 {
	width:90%;
 }
 

#News .Separator
{
   margin-bottom:10px;
   margin-top:10px;
}
 
	
