/* general architecture -------------------------------------------------------*/ * { margin: 0; padding: 0; } html, body { height: 100%; } body { height: 100%; text-align: center; background: #000 url(../img/bgstriped.jpg) repeat top; font: 12px Arial, Verdana, Helvetica, sans-serif; color: #ccc; } #bg { position: relative; min-height: 100%; /* has to be here for the footer to work */ margin: auto; /* has to be here for the center align to work */ text-align: left; } .b-clothes { background: #000 url(../img/bg_clothes.jpg) repeat; position: relative; width: 886px; min-height: 100%; /* has to be here for the footer to work */ } .b-1700 { background: url(../img/bg_1700rub.jpg) no-repeat; position: relative; width: 886px; min-height: 100%; /* has to be here for the footer to work */ } .b-kostym { background: url(../img/bg_kostymrub.jpg) no-repeat; position: relative; width: 886px; min-height: 100%; /* has to be here for the footer to work */ } .b-17 { background: url(../1700/img/bg.jpg) no-repeat top; } .b-kost { background: url(../kostymer/img/bg.jpg) no-repeat top; } .b-mode { background: url(../mode/img/mode_bg.jpg) no-repeat top; } .b-hd { background: url(../img/bg_hd.jpg) no-repeat top; } .b-contact { background: url(../img/bg_contact.jpg) no-repeat top; } .b-brud { background: url(../img/bg_brud.jpg) no-repeat top; } .b-scen { background: url(../img/bg_scen.jpg) no-repeat top; } .b-monster table { margin: 0px 0 0px 0; font-size:100%; } * html #bg { height: 100%; } #site { width: 886px; position: relative; min-height: 100%; /* has to be here for the footer to work */ margin: auto; /* has to be here for the center align to work */ text-align: left; } .clear { clear: both; } .clearW { width: 3px; height: 1px; clear: both; } .p { font: 14px Arial, Verdana, Helvetica, sans-serif; } /* general styling -------------------------------------------------------*/ a { text-decoration: none; color: #000; } p { padding-bottom: 10px; } h1 { font-size: 22px; letter-spacing: 0.4em; padding-bottom: 10px; } h2 { font: 20px Georgia, Times, serif; letter-spacing: 0em; color: #993300; padding-bottom: 9px; } h3 { font: 14px Georgia, Times, serif; letter-spacing: 0em; padding: 10px 0px; color: #A94800; padding-bottom:4px; } ul { padding-left: 25px; } ol { padding-left: 35px; } ul li, ol li { padding-bottom: 8px; } /* header architecture -------------------------------------------------------*/ #header { height: 116px; width: 800px; position: relative; } /* header navigation styling -------------------------------------------------------*/ #navigation { width: 639px; height: 25px; background: url(../img/mainmenu.png) no-repeat; list-style: none; position: absolute; } /* menu -------------------------------------------------------*/ #menu { text-align: center; list-style: none; position: absolute; margin-left: 80px; margin-top: 22px; } #navigation li { position: absolute; top: 4; text-indent: -2400px; } #navigation li, #navigation a { height: 20px; display: block; } #navbar1700 { left: 0px; width: 76px;} #navbarHistoriska { left: 76px; width: 140px; } #navbarMode { left: 216px; width: 50px; } #navbarKorsetter { left: 266px; width: 80px; } #navbarBrud { left: 356px; width: 80px; } #navbarKostymer { left: 436px; width: 80px; } #navbarScen { left: 516px; width: 50px; } #navbarKontakt { left: 566px; width: 80px; } #navbar1700 a:hover { background: transparent url(../img/mainmenu.png) 0px -18px no-repeat; } #navbarHistoriska a:hover { background: transparent url(../img/mainmenu.png) -76px -18px no-repeat; } #navbarMode a:hover { background: transparent url(../img/mainmenu.png) -216px -18px no-repeat; } #navbarKorsetter a:hover { background: transparent url(../img/mainmenu.png) -266px -18px no-repeat; } #navbarBrud a:hover { background: transparent url(../img/mainmenu.png) -356px -18px no-repeat; } #navbarKostymer a:hover { background: transparent url(../img/mainmenu.png) -436px -18px no-repeat; } #navbarScen a:hover { background: transparent url(../img/mainmenu.png) -516px -18px no-repeat; } #navbarKontakt a:hover { background: transparent url(../img/mainmenu.png) -566px -18px no-repeat; } /* ENGLISH -------------------------------------------------------*/ #navigation_en { width: 639px; height: 25px; background: url(../img/mainmenuen.png) no-repeat; list-style: none; position: absolute; } #navigation_en li { position: absolute; top: 0; text-indent: -2400px; } #navigation_en li, #navigation_en a { height: 20px; display: block; } #navbar1700en { left: 0px; width: 76px;} #navbarHistoriskaen { left: 76px; width: 140px; } #navbarModeen { left: 216px; width: 50px; } #navbarKorsetteren { left: 266px; width: 80px; } #navbarBruden { left: 356px; width: 80px; } #navbarKostymeren { left: 436px; width: 80px; } #navbarKontakten { left: 516px; width: 130px; } #navbar1700en a:hover { background: transparent url(../img/mainmenuen.png) 0px -18px no-repeat; } #navbarHistoriskaen a:hover { background: transparent url(../img/mainmenuen.png) -76px -18px no-repeat; } #navbarModeen a:hover { background: transparent url(../img/mainmenuen.png) -216px -18px no-repeat; } #navbarKorsetteren a:hover { background: transparent url(../img/mainmenuen.png) -266px -18px no-repeat; } #navbarBruden a:hover { background: transparent url(../img/mainmenuen.png) -356px -18px no-repeat; } #navbarKostymeren a:hover { background: transparent url(../img/mainmenuen.png) -436px -18px no-repeat; } #navbarKontakten a:hover { background: transparent url(../img/mainmenuen.png) -516px -18px no-repeat; } #mainpicmenu { text-align: left; position: absolute; width: 140px; height: 510px; top: 80px; left: 80px; overflow: auto; } * html #mainpicmenu { overflow-y: auto; overflow-x: hidden; } /* bildmenu1700 -------------------------------------------------------*/ #picmenu { list-style: none; width: 80px; height: 1500px; } #picmenu li { position: absolute; text-indent: -2400px; } #picmenu li, #picmenu a { height: 120px; width: 80px; display: block; } #navbar15 { background: transparent url(../1700/img/th/thbw/IMG_0003.jpg) no-repeat; height: 120px; width: 80px; top: 0px; } #navbar16 { background: transparent url(../1700/img/th/thbw/IMG_0168.jpg) no-repeat; height: 120px; width: 80px; top: 130px; } #navbar17 { background: transparent url(../1700/img/th/thbw/IMG_0652.jpg) no-repeat; height: 120px; width: 80px; top: 260px; } #navbar13 { background: transparent url(../1700/img/th/thbw/IMG_6769.jpg) no-repeat; height: 120px; width: 80px; top: 390px; } #navbar3 { background: transparent url(../1700/img/th/thbw/IMG_6833.jpg) no-repeat; height: 120px; width: 80px; top: 520px; } #navbar6 { background: transparent url(../1700/img/th/thbw/IMG_5875.jpg) no-repeat; height: 120px; width: 80px; top: 650px; } #navbar7 { background: transparent url(../1700/img/th/thbw/IMG_6934.jpg) no-repeat; height: 120px; width: 80px; top: 780px; } #navbar8 { background: transparent url(../1700/img/th/thbw/18th_flow.jpg) no-repeat; height: 120px; width: 80px; top: 910px; } #navbar9 { background: transparent url(../1700/img/th/thbw/IMG_6307.jpg) no-repeat; height: 120px; width: 80px; top: 1040px; } #navbar10 { background: transparent url(../1700/img/th/thbw/IMG_9298.jpg) no-repeat; height: 120px; width: 80px; top: 1170px; } #navbar11 { background: transparent url(../1700/img/th/thbw/IMG_9226.jpg) no-repeat; height: 120px; width: 80px; top: 1300px; } #navbar12 { background: transparent url(../1700/img/th/thbw/18th_pink.jpg) no-repeat; height: 120px; width: 80px; top: 1430px; } #navbar4 { background: transparent url(../1700/img/th/thbw/IMG_0423.jpg) no-repeat; height: 120px; width: 80px; top: 1560px; } #navbar14 { background: transparent url(../1700/img/th/thbw/IMG_6541.jpg) no-repeat; height: 120px; width: 80px; top: 1690px; } #navbar5 { background: transparent url(../1700/img/th/thbw/18th_red.jpg) no-repeat; height: 120px; width: 80px; top: 2080px; } #navbar1 { background: transparent url(../1700/img/th/thbw/IMG_6467.jpg) no-repeat; height: 120px; width: 80px; top: 1950px; } #navbar2 { background: transparent url(../1700/img/th/thbw/IMG_6129.jpg) no-repeat; height: 120px; width: 80px; top: 1820px; } #navbar1 a:hover { background: transparent url(../1700/img/th/IMG_6467.jpg) no-repeat; } #navbar2 a:hover { background: transparent url(../1700/img/th/IMG_6129.jpg) no-repeat; } #navbar3 a:hover { background: transparent url(../1700/img/th/IMG_6833.jpg) no-repeat; } #navbar14 a:hover { background: transparent url(../1700/img/th/IMG_6541.jpg) no-repeat; } #navbar4 a:hover { background: transparent url(../1700/img/th/IMG_0423.jpg) no-repeat; } #navbar12 a:hover { background: transparent url(../1700/img/th/18th_pink.jpg) no-repeat; } #navbar6 a:hover { background: transparent url(../1700/img/th/IMG_5875.jpg) no-repeat; } #navbar5 a:hover { background: transparent url(../1700/img/th/18th_red.jpg) no-repeat; } #navbar7 a:hover { background: transparent url(../1700/img/th/IMG_6934.jpg) no-repeat; } #navbar8 a:hover { background: transparent url(../1700/img/th/18th_flow.jpg) no-repeat; } #navbar9 a:hover { background: transparent url(../1700/img/th/IMG_6307.jpg) no-repeat; } #navbar10 a:hover { background: transparent url(../1700/img/th/IMG_9298.jpg) no-repeat; } #navbar11 a:hover { background: transparent url(../1700/img/th/IMG_9226.jpg) no-repeat; } #navbar13 a:hover { background: transparent url(../1700/img/th/IMG_6769.jpg) no-repeat; } #navbar15 a:hover { background: transparent url(../1700/img/th/IMG_0003.jpg) no-repeat; } #navbar16 a:hover { background: transparent url(../1700/img/th/IMG_0168.jpg) no-repeat; } #navbar17 a:hover { background: transparent url(../1700/img/th/IMG_0652.jpg) no-repeat; } /* bildmenuhd -------------------------------------------------------*/ #picmenuhd { list-style: none; width: 80px; height: 495px; } #picmenuhd li { position: absolute; text-indent: -2400px; } #picmenuhd li, #picmenuhd a { height: 120px; width: 80px; display: block; } #navbarhd1 { background: transparent url(../hd/img/th/thbw/IMG_5810.jpg) no-repeat; height: 120px; width: 80px; top: 0px; } #navbarhd2 { background: transparent url(../hd/img/th/thbw/skokl_red.jpg) no-repeat; height: 120px; width: 80px; top: 128px; } #navbarhd3 { background: transparent url(../hd/img/th/thbw/medieval.jpg) no-repeat; height: 120px; width: 80px; top: 256px; } #navbarhd1 a:hover { background: transparent url(../hd/img/th/IMG_5810.jpg) no-repeat; } #navbarhd2 a:hover { background: transparent url(../hd/img/th/skokl_red.jpg) no-repeat; } #navbarhd3 a:hover { background: transparent url(../hd/img/th/medieval.jpg) no-repeat; } /* bildmenuKostymer -------------------------------------------------------*/ #picmenuk { list-style: none; width: 80px; height: 300px; } #picmenuk li { position: absolute; text-indent: -2400px; } #picmenuk li, #picmenuk a { height: 120px; width: 80px; display: block; } #navbark1 { background: transparent url(../kostymer/img/th/thbw/image025.jpg) no-repeat; height: 120px; width: 80px; top: 0px; } #navbark2 { background: transparent url(../kostymer/img/th/thbw/image037.jpg) no-repeat; height: 120px; width: 80px; top: 130px; } #navbark1 a:hover { background: transparent url(../kostymer/img/th/image025.jpg) no-repeat; } #navbark2 a:hover { background: transparent url(../kostymer/img/th/image037.jpg) no-repeat; } /* bildmenuMode -------------------------------------------------------*/ #picmenum { list-style: none; width: 80px; height: 495px; } #picmenum li { position: absolute; text-indent: -2400px; } #picmenum li, #picmenum a { height: 120px; width: 80px; display: block; } #navbarm1 { background: transparent url(../mode/img/th/thbw/img_9386.jpg) no-repeat; height: 120px; width: 80px; top: 508px; } #navbarm2 { background: transparent url(../mode/img/th/thbw/img_9532.jpg) no-repeat; height: 120px; width: 80px; top: 128px; } #navbarm3 { background: transparent url(../mode/img/th/thbw/img_9393.jpg) no-repeat; height: 120px; width: 80px; top: 256px; } #navbarm4 { background: transparent url(../mode/img/th/thbw/img_9446.jpg) no-repeat; height: 120px; width: 80px; top: 382px; } #navbarm5 { background: transparent url(../mode/img/th/thbw/IMG_0484.jpg) no-repeat; height: 120px; width: 80px; top: 0px; } #navbarm1 a:hover { background: transparent url(../mode/img/th/img_9386.jpg) no-repeat; } #navbarm2 a:hover { background: transparent url(../mode/img/th/img_9532.jpg) no-repeat; } #navbarm3 a:hover { background: transparent url(../mode/img/th/img_9393.jpg) no-repeat; } #navbarm4 a:hover { background: transparent url(../mode/img/th/img_9446.jpg) no-repeat; } #navbarm5 a:hover { background: transparent url(../mode/img/th/IMG_0484.jpg) no-repeat; } /* bildmenuIndex -------------------------------------------------------*/ #picmenui { list-style: none; width: 100px; height: 300px; } /* content architecture -------------------------------------------------------*/ #contentMain { width: 886px; min-height: 100%; background: #000 url(../img/bg_clothes.jpg) repeat; } #content { padding-bottom: 59px; /* footer height +10px */ width: 886px; min-height: 100%; } #main { display: inline; clear: both; float: left; width: 535px; top: 5px; height: auto !important; min-height: 100%; position: relative; padding: 5px 0px 10px 12px; } #maintext { width: 377px; height: 257px; position: relative; top: 60px; left: 290px; } #maintext_brud { width: 530px; height: 503px; position: absolute; top: 60px; left: 140px; overflow-y: auto; overflow-x: hidden; } #bilder { width: 433px; position: relative; text-align: right; left: 340px; top: 60px; } #hide { visibility: hidden } /* content styling -------------------------------------------------------*/ .firstLetter { font-size: 48px; font-weight: bold; display: block; float: left; line-height: 1em; margin: 0 .1em 0 0; } .imgCenter { text-align: center; margin: auto; padding-bottom: 10px; } .menulist { width:125px; text-align: left; vertical-align: top; padding: 50px 14px 0px 0px; } .menulist ul { list-style: none; margin-left: 0; padding-left: 1em; } #number ul { list-style-type: decimal } /* side column architecture -------------------------------------------------------*/ #sub { width: 255px; float: right; } /* gallery -------------------------------------------------------*/ #gallery { font-family: sans-serif; font-size: medium; } #mainview { margin: 3px; background: url(http://www.kjellsdotter.se/img/b_clothes.jpg) repeat; } #mainview p { padding: 3px; margin: 3px; height: 100%; } #mainview div { border: 0; float: left; margin: 4px; padding: 1px; background: url(http://www.kjellsdotter.se/img/b_clothes.jpg) repeat; } #mainview img { margin: 3px; padding: 1px; } #thumbs img { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0.5; opacity: 0.5; border: 0px; padding: 0px 0px 15px 0px; } #thumbs img:hover { filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity: 1; opacity: 1; border: 0px; padding: 0px 0px 15px 0px; }