/* ---------------UTSEENDE------------- */

body {
	background-image:url(Bilder/hello.jpg);
	font-family:verdana,sans-serif; /* typsnitt */
	font-size:14px; /* typsnittsstorlek på sidan */
}
a img { 
	border:none;
}

/* HUVUD */

#huvud h1 {
	margin:0;
	margin-left:200px;
	position:absolute;
	bottom:0px;
	padding:0;
	font-size:30px;
	color:#000;
	font-weight:normal;
}


/* LAYOUTRUTA */



/* MENY */
#menybakgrund {
	background-image:url(Bilder/Sarameny.jpg);
	background-color:#262521;
}

#meny li {
	list-style-type:none; /* inga punkter */
	margin:15px;
	margin-left:-12px;
}

/* Knapparna */
#meny a {
	text-decoration:none; /* ingen understrykning */
	color:white;
}
#meny a:hover { /* när man pekar på en knapp */
	text-decoration:none;
	font-weight:bold;	
}
#start #hart {
	position:absolute;
	margin-left:10px;
	margin-top:45px;
	z-index:5;
}
#sara #hart {
	position:absolute;
	margin-left:10px;
	margin-top:117px;
	z-index:5;
}
#vanner #hart {
	position:absolute;
	margin-left:10px;
	margin-top:187px;
	z-index:5;
}
#galleriet #hart {
	position:absolute;
	margin-left:10px;
	margin-top:265px;
	z-index:5;
}
#favoriter #hart {
	position:absolute;
	margin-left:10px;
	margin-top:405px;
	z-index:5;
}
#lankar #hart {
	position:absolute;
	margin-left:10px;
	margin-top:475px;
	z-index:5;
}
.galleri img {
	padding-left:20px;
	padding-right:20px;
	padding-bottom:10px;
	padding-top:10px;
}
.galleri a:hover p {
	text-decoration:none;
	letter-spacing:0px;
	font-weight:normal;
}
.galleri a {
	text-decoration:none;
}

/* BILDER */

#Framsida {
	position:absolute;
	z-index:2; /* detta gör att bilden hamnar under övrigt innehåll i innehållsrutan */
	left:-50px; /* antal pixlar som bilden sticker ut åt vänster*/
	top:0px; /* antal pixlar som bilden sticker ut uppåt*/
	height:473px;
}
#Framsida_Sara {
	position:absolute;
	z-index:5; /* detta gör att bilden hamnar under övrigt innehåll i innehållsrutan */
	left:210px; /* antal pixlar som bilden sticker ut åt vänster*/
	width:550px;
	top:5px; /* antal pixlar som bilden sticker ut uppåt*/
}
#Framsida_Kitty {
	position:absolute;
	z-index:4; /* detta gör att bilden hamnar under övrigt innehåll i innehållsrutan */
	left:220px; /* antal pixlar som bilden sticker ut åt vänster*/
	width:50px;
	top:433px; 
}
#Framsida_text {
	position:absolute;
	left:20px; /* antal pixlar som bilden sticker ut åt vänster*/
	width:250px;
	top:45px; /* antal pixlar som bilden sticker ut uppåt*/
	z-index:7;
}
#Galleri_text {
	position:absolute;
	left:110px;
	width:490px;
	top:40px; /* antal pixlar som bilden sticker ut uppåt*/
	z-index:7;
}

#Favoriter_text {
	position:absolute;
	left:20px; /* antal pixlar som bilden sticker ut åt vänster*/
	width:350px;
	top:5px; /* antal pixlar som bilden sticker ut uppåt*/
	z-index:7;
}
#Framsida_text #Favoriter_text p{
	font-size:15px;
}
#ruta {
	position:absolute;
	background-color:#FFF;
	width:720px;
	height:550px;
	z-index:2; /* detta gör att bilden hamnar under övrigt innehåll i innehållsrutan */
	left:200px; /* antal pixlar som bilden sticker ut åt vänster*/
	bottom:0;
}
#vanner #ruta {
	background-color:#FFF;
}
#galleriet #ruta {
	background-color:#FFF;
}
#lankar #ruta {
	background-color:#FFCCCC;
}
#logo {
	position:absolute;
	width:350px;
	margin-left:190px;
	margin-top:-29px;
}
#memorytext {
	position:absolute;
	margin-left:-17px;
	margin-top:-45px;
	z-index:90;
}
#sign {
        position:fixed;
        height:488px;
        top: 50%;
        margin-top:-203px;
        margin-left:915px;
        z-index:98;
}
#sign img {
        position:absolute;
        height:115px;
        bottom:0px;
}
#skugga {
	position:absolute;
	z-index:-3; /* detta gör att bilden hamnar under övrigt innehåll i innehållsrutan */
	left:-220px; /* antal pixlar som bilden sticker ut åt vänster*/
	top:-190px; /* antal pixlar som bilden sticker ut uppåt*/
}
#brevpapper {
	position:absolute;
	z-index:2; /* detta gör att bilden hamnar under övrigt innehåll i innehållsrutan */
	left:280px; /* antal pixlar som bilden sticker ut åt vänster*/
	top:5px; /* antal pixlar som bilden sticker ut uppåt*/
	width:420px;
}
#Skylt {
	position:absolute;
	z-index:2; 
	left:150px;
	top:130px; 
	width:300px;
}
#books {
	position:absolute;
	z-index:20;
	left:10px; 
	top:110px; 
	width:300px;
}
#rullar {
	position:absolute;
	z-index:20;
	left:110px; 
	top:80px;
	width:80px;
}
#idoler {
	position:absolute;
	z-index:20;
	left:5px; 
	top:200px;
}
#lollo {
	position:absolute;
	z-index:20;
	left:5px; 
	top:70px;
	width:300px;
}
#bakning {
	position:absolute;
	z-index:20;
	left:10px; 
	top:110px; 
}
#rain {
	position:absolute;
	z-index:20;
	left:60px; 
	top:120px; 
	width:200px;
	z-index:50;
}
#lankbild {
	position:absolute;
	left:300px;
	top:300px;
	z-index:20;
}

/* -----------------------INNEHÅLL------------------------- */

#innehall {
	position:relative;
	width:720px; /* bredden minus lagom högermarginal */
	height:550px; /* sluthöjd minus summan av padding */
	padding:5px; /* textens marginal */
	padding-bottom:5px;
	overflow:hidden; /* skroll-lister ifall innehållet inte får plats */
}
#innehall h2 {
	font-size:17px;
	padding:0;
	margin:0px;
	margin-top:12px;
	font-weight:bold;
}
#innehall p {
	margin-top:5px;
	margin-left:0px;       
}		
#innehall p a {
	font-size:17px;
	text-decoration:none;       
}	
#innehall li {
	list-style-type:none; /* inga punkter */
	margin-top:15px;
	margin-left:-30px;
	font-size:16px;
}
#innehall, #ruta, #dekorruta {
	position:absolute;
	bottom:0;
	left:200px; /* samma som menyns bredd */
}
#ruta, #dekorruta {
	height:550px;
}
#lankarna {
	position:absolute;
	margin-top:30px;
	margin-left:30px;
	font-size:18px;
	font-weight:bold;
	z-index:12;
}
#lankarna li{
	list-style-type:none; /* inga punkter */
	margin-bottom:35px;
}
#lankarna a{
	text-decoration:none;
	color:#BB0000;
}
#lankarna a:hover {
	text-decoration:none;
	letter-spacing:3px;	
}
/* Knapparna */
#innehall a {
	text-decoration:none; /* ingen understrykning */
}
#innehall a:hover { /* när man pekar på en knapp */
	text-decoration:none; /* ingen understrykning */
	font-weight:bold;	
}
#tillbaka {
	position:absolute;
	font-size:24px;
	font-weight:bold;
	margin-left:655px;
	margin-top:475px;
}
#tillbaka a{
	font-size:24px;
	color:#FF66CC;
	text-decoration:none;
}
#tillbaka a:hover { /* när man pekar på en knapp */
	text-decoration:none;
	font-weight:bold;
	letter-spacing:3px;	
}
a:hover {
	letter-spacing:3px;
}
/* -------------------------GRUND--------------------------- */
body {
	overflow:hidden; /* så att IE inte visar skroll-list i onödan */
	margin:0; /* marginal på sidan, bör vara 0 */
	z-index:-2;
}

/* LAYOUTRUTA */
#layout {
	/* Positionering */
	width: 920px; /* bredd */
	height:565px; /* höjd */
	position:absolute;
	left: 50%; top: 50%; /* tillsammans med margin gör detta layouten centrerad */
	margin-left:-460px; /* hälften av bredden så blir det centrerat */
	margin-top:-282px; /* hälften av höjden så blir det centrerat */
}
#memo #layout {
	margin-top:-360px;
}

/* HUVUD */
#huvud {
	height:15px; 
	position:relative;
	overflow:visible;
}

/* MENY */
#meny, #menybakgrund {
	position:absolute;
	width:200px;
	height:550px;
	bottom:0;
}
#meny {
	z-index:100;
}
#menybakgrund {
	z-index:-1;
}
#meny ul {
	margin:5px;
	padding:10px;
}

/* GALLERI VANNER */

.galleri .bildruta {
	float: left;
	width: 150px;
	background: #FFF;
	margin-bottom:5px;
	margin-left:10px;
	margin-right:10px;
	margin-top:5px;
	z-index:20;
}
.galleri .avdelning.bildruta.active {
	width:150px;
	height:32px;
	overflow: hidden;
	background: url(Tillbaka_knapp.png);
	z-index:22;
}
.galleri .avdelning.bildruta.active .bild {
	opacity: 0; filter: alpha(opacity=0);
}
.galleri .bildruta.hidden {
	display: none;
	border:none;
}

.galleri .bild {
	width: 150px;
	border: none;
	z-index:21;
}
/* Knapparna Saras sida*/

#pluppar {
	position:absolute;
	width:720px; /* bredden minus lagom högermarginal */
	height:550px; /* sluthöjd minus summan av padding */
	padding:25px; /* textens marginal */
	padding-bottom:5px;
	left:200px;
	z-index:110;
}

.button {
	display:block;
	border:none;
	width:120px;
	height:120px;
}

#text1knapp {
	background:url("Bilder/plupp1.png");
}
#text2knapp {
	background:url("Bilder/plupp3.png");
}
#text3knapp {
	background:url("Bilder/plupp2.png");
}
#text4knapp {
	background:url("Bilder/plupp4.png");
}
#text5knapp {
	background:url("Bilder/plupp5.png");
}
#text6knapp {
	background:url("Bilder/plupp6.png");
}
#text7knapp {
	background:url("Bilder/plupp8.png");
}
#text8knapp {
	background:url("Bilder/plupp9.png");
}
#text1knapp:hover {
	background:url("Bilder/plupp1b.png");
}
#text2knapp:hover {
	background:url("Bilder/plupp3b.png");
}
#text3knapp:hover {
	background:url("Bilder/plupp2b.png");
}
#text4knapp:hover {
	background:url("Bilder/plupp4b.png");
}
#text5knapp:hover {
	background:url("Bilder/plupp5b.png");
}
#text6knapp:hover {
	background:url("Bilder/plupp6b.png");
}
#text7knapp:hover {
	background:url("Bilder/plupp8b.png");
}
#text8knapp:hover {
	background:url("Bilder/plupp9b.png");
}
#text1knapp.visible {
	background:url("Bilder/plupp1b.png");
}
.text {
	position:absolute;
	left:320px; 
	top:100px; 
	width:340px;
	z-index:90;
} 
.hidden.text {
	display:none;
}
#musikintresse {
	position:absolute;
	top:150px;
}
/* Saras TV favoriter - bildgalleri*/
#bilgalleri_tvfavoriter_1 {
	position:absolute;
	margin-top:25px;
	margin-left:590px;
	width:300px;
	height:440px;
	z-index:99;	
}
#textilgalleri {
	position:absolute;
	margin-top:150px;
	margin-left:300px; /* hälften av bredden så blir det centrerat */
	width:500px;
	height:361px;
	z-index:97;
}

