/* FRAMEWORK ________________________________________________________________________*/ body { background: #DAD7C8 url(/sitefiles/13/gfx/body-bg.png) 0 0 repeat-x; font-family: Tahoma, Arial, "Bitstream Vera Sans", "Lucida Grande", sans-serif; color: #1A1A1A; font-size: 62.5%; } .clear { clear: both; } #wrap { width: 788px; padding: 6px; *padding: 6px 6px 0; margin: 30px auto; background: #D4D0C3 url(/sitefiles/13/gfx/container-frame-gradient.png) 0 0 repeat-x; } #wrap #container { width: 760px; float: left; clear: both; background: #FFF; padding: 0 14px 14px; overflow: hidden; } #wrap #container #top { width: 760px; height: 37px; padding: 98px 0 10px; float: left; clear: both; position: relative; overflow: hidden; } #wrap #container #top h1 { display: block; width: 135px; height: 76px; position: absolute; bottom: 56px; left: 22px; clear: both; overflow: hidden; } #wrap #container #top h1 a { display: block; width: 110px; height: 62px; float: left; clear: both; text-indent: -9999px; background: url(/sitefiles/13/gfx/proteket_logo.jpg) 0 0 no-repeat; } #wrap #container #col-wrap { width: 740px; padding: 0 0 0 20px; float: left; clear: both; position: relative; background: url(/sitefiles/13/gfx/col-wrap-bg.png) 0 0 no-repeat; } #wrap #container #col-wrap #side-col { width: 200px; float: left; clear: left; padding: 40px 0 0; } #wrap #container #col-wrap #main-col { width: 500px; float: right; clear: right; padding: 145px 20px 0 0; position: relative; } #wrap #container #content { width: 760px; float: left; clear: both; padding: 5px 0 0; } /* MAIN MENU ________________________________________________________________________*/ #main-menu { width: 760px; height: 35px; float: left; clear: both; background: url(/sitefiles/13/gfx/main-menu-bg.png) 0 0 no-repeat; padding: 2px 0 0; } #main-menu li { float: left; display: block; height: 35px; position: relative; } #main-menu li a { display: block; height: 35px; text-indent: -9999px; position: absolute; overflow: hidden; top: 0; left: 0; clear: both; padding: 0 22px; background: 50% 0 no-repeat; } #main-menu li a span { display: block; height: 35px; width: 100%; position: absolute; top: 0; left: 0; background: #FFF; opacity: 0; *filter:alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; cursor: pointer; } #main-menu li a:hover span, #main-menu li.active a span { opacity: .2; *filter:alpha(opacity=20); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"; } #main-menu li span.left { width: 4px; height: 35px; position: absolute; top: 0; left: 0; clear: both; overflow: hidden; background: url(/sitefiles/13/gfx/main-menu-item-left.png) 0 0 no-repeat; display: none; } #main-menu li.after-active span.left { display: block; } #main-menu li span.right { height: 35px; position: absolute; top: 0; right: 0; clear: both; overflow: hidden; background: url(/sitefiles/13/gfx/main-menu-item-right.png) 0 0 no-repeat; display: block; } #main-menu li.active span.right { display: none; } #main-menu li.last span.right { display: block; } /* EXTRA INFORMATION MENU ________________________________________________________________________*/ #extra-menu { float: right; clear: both; position: absolute; right: 2px; bottom: 46px; height: 20px; line-height: 20px; list-style: none; } #extra-menu li { float: left; display: inline; padding: 0 0 0 20px; background: url(/sitefiles/13/gfx/extra-menu-separator.png) 8px 55% no-repeat; } #extra-menu li.first { padding: 0; background: none; } #extra-menu li a { color: #333; text-decoration: none; } #extra-menu li a:hover { text-decoration: underline; } #extra-menu li.active a { color: #B44008; } /* LANGUAGE MENU ________________________________________________________________________*/ #languages { float: right; clear: both; position: absolute; right: 2px; bottom: 70px; height: 14px; line-height: 14px; list-style: none; } #languages li { float: left; display: inline; margin: 0 10px 0 0; } #languages li#swe { margin: 0; } #languages li a { position: relative; padding: 0 20px 0 0; display: block; float: left; color: #808080; text-decoration: none; } #languages li a span { display: block; width: 14px; height: 14px; position: absolute; top: 0; right: 0; clear: both; background: url(/sitefiles/13/gfx/lang.png) 0 0 no-repeat; opacity: .5; *filter:alpha(opacity=50); } #languages li#swe a span { background-position: 0 -14px; } #languages li a:hover { text-decoration: underline; } #languages li a:hover span, #languages li.active a span { opacity: 1; *filter:alpha(opacity=100); } /* SUB MENU ________________________________________________________________________*/ #sub-menu { width: 200px; float: left; clear: both; background: url(/sitefiles/13/gfx/side-menu-structure.png) 0 0 no-repeat; padding: 11px 0 0; } #sub-menu h2 { width: 138px; height: 28px; padding: 0 31px; line-height: 28px; float: left; clear: both; font-size: 1.1em; color: #FFF; text-transform: uppercase; font-weight: normal; } #sub-menu ul { width: 178px; float: left; clear: both; padding: 0 0 93px; margin: 0 11px; _margin: 0 11px 0 5px; _left: 1px; _position: relative; _height: 110px; min-height: 110px; background: #BCB7B1 url(/sitefiles/13/gfx/side-menu-fading.png) bottom left repeat-x; list-style: none; border-top: 4px solid #BCB7B1; } #sub-menu ul li { width: 178px; float: left; clear: both; height: 22px; line-height: 21px; display: block; } #sub-menu ul li a { width: 136px; height: 21px; line-height: 21px; padding: 0 21px; color: #000; font-size: 1.1em; text-decoration: none; position: relative; display: block; float: left; clear: both; overflow: hidden; } #sub-menu ul li a:hover { text-align: left; } #sub-menu ul li a span { display: none; width: 21px; height: 21px; line-height: 19px; text-align: center; color: #EF8522; position: absolute; top: 0; left: 0; clear: both; float: left; font-size: .6em; overflow: hidden; } #sub-menu ul li a:hover span, #sub-menu ul li.active a span { display: block; } /* CONTENT TEMPLATE: PAGE TOP ________________________________________________________________________*/ #page-top { width: 520px; height: 130px; position: absolute; top: 0; right: 0; clear: both; overflow: hidden; background: 100% 0 no-repeat; } #page-top h2 { font-size: 1.2em; line-height: 1.6; font-weight: bold; color: #000; text-transform: uppercase; padding: 0 220px .5em 0; position: absolute; bottom: 0; left: 0; clear: both; } /* CONTENT TEMPLATE: PAGE BANNER ________________________________________________________________________*/ .page-banner { display: block; width: 760px; float: left; clear: both; background: 0 0 no-repeat; text-indent: -9999px; margin: 0 0 15px; } /* CONTENT TEMPLATE: FRONT BOXES ________________________________________________________________________*/ .front-boxes { width: 760px; float: left; clear: both; margin: 0 0 15px; } .front-boxes .front-box { width: 240px; float: left; margin: 0 20px 20px 0; background: #E4E1DE url(/sitefiles/13/gfx/front-box-bottom.png) 0 100% no-repeat; padding: 0 0 10px; min-height: 162px; _height: 162px; position: relative; } .front-boxes .right { margin: 0 0 20px; } .front-boxes .front-box h3 { padding: 19px 35px 0; height: 28px; line-height: 28px; text-align: center; font-size: 1.2em; font-weight: normal; color: #FFF; text-transform: uppercase; margin: 0 0 20px; background: url(/sitefiles/13/gfx/front-top3.png) 0 0 no-repeat; } .front-boxes .front-box p.excerpt { font-size: 1.1em; line-height: 1.5; padding: 0 25px 10px; } .front-boxes .front-box p.read-more { padding: 0 25px; font-size: 1.2em; line-height: 1.5; text-align: right; font-weight: bold; } .front-boxes .front-box p.read-more a { color: #EA6623; text-decoration: none; padding: 0 20px 0 0; background: url(/sitefiles/13/gfx/read-more-arrows.png) 100% 70% no-repeat; } .front-boxes .front-box p.read-more a:hover { text-decoration: underline; } .front-boxes .login a { display: block; width: 110px; height: 70px; text-indent: -9999px; position: absolute; top: 50%; left: 50%; margin: 0 0 0 -55px; background: url(/sitefiles/13/gfx/login.png) 0 0 no-repeat; } .front-boxes .login-se a { background-image: url(/sitefiles/13/gfx/login-se.png); } /* CONTENT TEMPLATE: REFERENCES ________________________________________________________________________*/ .references { width: 500px; float: left; clear: both; } .references .ref { width: 150px; float: left; margin: 0 25px 25px 0; line-height: 1.5; } .references .right { margin: 0 0 25px; } .references .ref a { color: #1A1A1A; text-decoration: none; font-size: 1.4em; font-weight: normal; } .references .ref a:hover { text-decoration: underline; } .references .ref img { display: block; float: left; clear: both; padding: 0 0 .5em; } /* GENERIC TEXT CONTENT ________________________________________________________________________*/ .infobox1 h2, .infobox1 h3, .infobox1 h4 { font-size: 1.2em; font-weight: bold; padding: 0 0 .5em; } .infobox1 h2 { color: #EA6623; } .infobox1 p, .infobox1 ul, .infobox1 ol, .infobox1 dl { font-size: 1.1em; line-height: 1.5; margin: 0 0 1.5em; } .infobox1 ul p, .infobox1 ol p, .infobox1 ul ul, .infobox1 ul ol, .infobox1 ol ol, .infobox1 ol ul { font-size: 1em; margin: 0 0 .5em; } .infobox1 ul { list-style-type: square; padding: 0 0 0 1.1em; _padding: 0 0 0 1.5em; } .infobox1 ol { list-style-type: decimal; padding: 0 0 0 1.5em; _padding: 0 0 0 2.2em; } .infobox1 ul ul, .infobox1 ol ul { padding: 0 0 0 1.6em; _padding: 0 0 0 2em; } .infobox1 ul ol, .infobox1 ol ol { padding: 0 0 0 2em; _padding: 0 0 0 2.7em; } .infobox1 dl dt { font-weight: bold; } .infobox1 dl dd { padding: 0 0 0.5em 2em; } .infobox1 img { float: left; margin: 0 20px 20px 0; } .infobox1 em { font-style: italic; } .infobox1 strong { font-weight: bold; } .infobox1 a { color: #EA6623; text-decoration: none; } .infobox1 a:hover { text-decoration: underline; }