/* "body" syftar på hela hemsidan. Här ställer vi in bakgrundsfärg, ytfinish, eventuell bakgrundsbild, typsnitt, och hemsidans eventuella kanter och marginaler. */ body { background-color:#ff7fff; background-image:url('http://www.zoomin.se/static/png24/finish/tassar.png'); color:#000000; font-family:Comic Sans MS; font-size:13px; border:0px; padding:0px; margin:0px; } #fck { background-image:none; background-color:#ff7fff; color:#000000; } /* "body.plain" är en variant av ovanstående, utan bakgrundsbild. Den används på bland annat informationssidan om Zoomin Plus. */ body.plain { background:#eeeeee; background-image:url('http://www.zoomin.se/static/png24/finish/tassar.png'); color:#000000; font-family:Comic Sans MS; font-size:13px; border:0px; padding:0px; margin:0px; } body.plain a { color:#332211; } body.plain h1 { color:#332211; } /* "p" står för paragraph och betyder "stycke". Här ställer vi alltså in allt som är specifikt för textstycken, dvs marginaler och linjeavstånd. */ p,li { margin:0px; margin-top:4px; margin-bottom:4px; padding:0px; line-height:1.6; } /* "blockquote" användes av en tidigare version av redigeringsverktyget för att skapa indrag. Den finns kvar här för bakåtkompabilitet. */ blockquote { margin-top:4px; margin-bottom:0px; } /* "a" är länkar. Här ställer vi in vilken färg länkar ska ha. */ a { color:#332211; } /* "h1" till och med "h5" är rubriker. Standardstorleken för typsnitt är 13px (det ställde vi in ovan, vid "body") så här beskriver vi hur stora rubrikerna ska vara. Vi ställer dessutom in att vissa av rubrikerna ska vara understrukna, ha olika marginaler, och justeras. */ h1 { font-size:21px; color:#332211;; } h2 { font-size:18px; border-bottom:1px; } h3 { font-size:9px; border-bottom:1px; margin-top:2px; margin-bottom:2px; text-align:center; } h4 { font-size:9px; border-bottom:0px; margin-top:2px; margin-bottom:2px; text-align:center; } h5 { font-size:9px; border-bottom:1px; margin-top:2px; margin-bottom:2px; text-align:center; } div#body { width:1000px; } /* Nedanstående är en "behållare" för menyraden. Vi väljer att i första hand ha typsnittet Arial (och i andra hand Helvetica, om Arial inte finns tillgängligt på besökarens dator) samt textstorlek 11px. */ div#mainMenu { font-family:Lucida Grande,Lucida Sans Unicode,arial,helvetica; font-size:11px; height:28x; padding-top:4px; } /* Behållare för sidhuvudet. Inga inställningar här än så länge. */ div#headerContainer { } /* Behållare för topboxen och topplistorna. Vi väljer här att behållaren för topbox och topplistor ska placeras 32 pixlar från vänsterkanten och vara 168 pixlar bred. */ div#topTenContainer { position:absolute; left:32px; width:168px; font-size:11px; } /* Behållare för sidans innehåll. Vi placerar den 240 pixlar från vänsterkanten, och gör den 740 pixlar bred. */ div#contentContainer { position:absolute; margin-top:8px; left:240px; width:740px; } /* Behållare för respektive topplista och topboxen. Vi väljer att inte ange bakgrundsfärg eller textfärg, på så sätt får topbox och topplistor samma färg och bakgrund som hemsidan. */ div.topten { position:relative; margin-bottom:8px; padding:2px; width:160px; text-align:left; overflow-x:hidden; } /* ---- Finjusteringar ---- */ /* Huvudmeny */ div.menu_item { white-space:nowrap; position:relative; float:left; margin:4px; z-index:99; height:20px; line-height:16px; } div.menu_item a { text-decoration:none; color:#ccc7c2; } div.menu_item a:hover { text-decoration:underline; } div.menu_icon { float:left;width:16px;height:16px;text-align:center; } div.submenu { white-space:normal; display:none; position:absolute; left:0px; top:19px; z-index:99; } /* Textinnehåll i topplistor */ div.toptentxt { width:140px;height:16px;overflow:hidden;white-space:nowrap;behavior:url("/static/htc/scroller.htc");} div.toptentxt_wrap { width:140px;height:16px;overflow:hidden;behavior:url("/static/htc/scroller.htc");} /* Bilder */ img { border-color:#332211; } .border { border:1px solid #aa9988; border-radius:4px; padding:4px; background:#403b36; } .noborder { background:transparent; padding:0px; margin:0px; border:0px; } .ram { border:1px solid #aa9988; border-radius:4px; padding:4px; background:#403b36; } .ingenram { background:transparent; padding:0px; margin:0px; border:0px; } .png { background:transparent; border:0px; padding:0px; margin:0px;} /* Textstorlekar */ .big { font-size:18px; } .normal { font-size:13px; } .small { font-size:11px; } .minimal { font-size:9px; } /* Stilar som används av Zoomin */ .error { color:red; font-weight:bold; } .underline { border-bottom:1px solid #666666 } .dashed_underline { border-bottom:1px dashed #666666 } .widget { border:1px solid #aa9988; border-radius:4px; padding:4px; background:#403b36;; margin-top:2px; margin-bottom:2px; } /* Bloggens kalender */ table.calendar { margin-top:4px; width:180px; height:160px; font-size:11px; border:0px; border-top:0px; padding:2px; } table.calendar td { text-align:center; font-size:11px; } caption.calendar-month { width:180px; font-size:11px; border:0px; padding:2px; } /* Kommentarer */ div.postit { padding:0px; position:relative; } div.postit_txt { background:#ffffff;border:1px solid #666666;border-bottom:2px solid black;border-right:2px solid black;color:black; } div.postit_txt td { color:#333333; } div.postit_txt p { color:#333333; } div.postit_txt a { color:black; } div.postit_txt > td { color:#333333; } div.postit_txt > p { color:#333333; } div.postit_txt a { color:#333333; } /* Webbläsarens scrollbars */ HTML, BODY { scrollbar-arrow-color : #000000; scrollbar-base-color : #eeddcc; } /* Informationsrutor */ div.infoshadow { clear:both; background:#ffffff;border:1px solid #666666;border-bottom:1px solid black;border-right:1px solid black;color:black; margin:4px; padding:8px; background-image:url(http://www.zoomin.se/static/png24/whiteout.png);background-repeat:no-repeat;background-position:bottom right; } div.infoshadow td { color:#333333; } div.infoshadow p { color:#333333; } div.infoshadow a { color:black; } div.infoshadow > td { color:#333333; } div.infoshadow > p { color:#333333; } div.infoshadow > a { color:black; } a.infoshadow { color:#663333; } /* =========================================== */ /* Redigera ej nedanstående om du inte är 100% */ /* säker på att du vet vad du gör! */ /* =========================================== */ div.body_width { width:auto; height:auto; margin:0px; padding:0px; border:0px; overflow:hidden; } div.overlay { font-size:13px; position: absolute; left:0px; top:0px; filter:alpha(opacity=90); } form { padding:0px; margin:0px; } button { padding:2px; font-size:10px; width:64px; background:#ccc7c2; color:#403b36 } button.logInOut { height:20px; line-height:1.5em; font-size:9px; padding:0px } input { padding:1px; } input.logInOut { width:90px; font-size:9px; height:14px; padding:1px; border:1px; } input.wide { width:200px; } input.small { padding:0px; margin:0px; font-size:9px; width:34px; height:14px; text-align:center; } textarea { padding:1px; width:200px; } select { padding:1px; width:200px; } select.small { font-size:9px; padding:0px; width:140px; border:1px; } div.folder_thumb { position:relative; float:left; text-align:left; width:180px; height:128px; overflow:hidden; overflow-x:hidden; } @media print { div#body { width:100%; } div#mainMenu { display:none; } div#headerContainer { border:0; left:0px; width:100%; } div#topTenContainer { display:none; } div#contentContainer { border:0; left:0px; width:100%; } div#statusBar { display: none; } .imginfo { visibility:hidden; } .dontPrint { display:none; } } /* MENU LAYOUT */ /* All