@CHARSET "UTF-8"; /* Style used for all sites */ /* SiteComponents version: Id: style.css,v 1.9 2009/04/14 06:23:40 kurt Exp Name: SC_6_6_0 Disclaimer While we make every effort to ensure that this code is fit for its intended purpose, we make no guarantees as to its functionality. CoreTrek AS will accept no responsibility for the loss of data or any other damage or financial loss caused by use of this code. Copyright This programming code is copyright of CoreTrek AS. Permission to run this code is given to approved users of CoreTrek's publishing system CorePublish. This source code may not be copied, modified or otherwise repurposed for use by a third party without the written permission of CoreTrek AS. Contact webmaster@coretrek.com for information. */ /* The Lyse Font is a fork of the Droid Sans Font which is licensed under the Apache License. We have done some minor changes to make it look more "Sans" and to make it fit the design sketches better. */ @font-face { font-family: Lyse; src: url("/fonts/Lyse.eot") /* EOT file for IE */ } @font-face { font-family: Lyse; font-weight: bold; src: url("/fonts/Lyse-Bold.eot") /* EOT file for IE */ } @font-face { font-family: Lyse; src: url("/fonts/Lyse.ttf") /* TTF file for CSS3 browsers */ } @font-face { font-family: Lyse; font-weight: bold; src: url("/fonts/Lyse-Bold.ttf") /* TTF file for CSS3 browsers */ } /* -------------------------------------------------------------------------- */ /* General HTML elements */ /* -------------------------------------------------------------------------- */ html, body { font: 12px Arial, Verdana, Helvetica, sans-serif; color: #333333; margin: 0; padding: 0; height: 100%; background: #CCCACA;} /* -------------------------------------------------------------------------- */ /* Container/placeholder positioning */ /* -------------------------------------------------------------------------- */ /* width and padding is overrided in style-ie6.css*/ #container { width: 1000px; margin: 0px auto; overflow: hidden; background: #fff; } .placeholder-content-container, #container-placeholder-content { width: 943px; padding: 0px; margin: 0px auto; } #placeholder-content-no-left-no-right, #placeholder-content-no-left, #placeholder-content-no-right, #placeholder-content, #placeholder-right { margin-bottom: 30px;} #placeholder-top { overflow: hidden; margin-bottom: 15px; background: #024732; background-repeat: no-repeat; } #placeholder-top-below { } #placeholder-top-below .placeholder-end { clear: both; } #placeholder-left { clear: both; float: left; width: 173px; overflow: hidden; } #placeholder-content-right-container { float: right; margin-bottom: 20px; width: 722px; overflow: hidden; background: url(images/content-right-border.png) repeat-y; } #placeholder-right { float: right; padding: 25px 20px 0px 20px; width: 190px; min-height: 330px; margin-left: 9px; overflow: hidden; background: url(images/placeholder-right-shadow-bg.png) no-repeat; } #placeholder-right.no-content { background: none; } #placeholder-content { float: right; overflow: hidden; width: 467px; padding-right: 16px; /*16 med strek som bakgrunnsbilde*/ /*=483*/ } #placeholder-content-top-no-left, #placeholder-content-no-left { float: left; width: 704px; overflow: hidden; } #placeholder-content-top, #placeholder-content-top-no-right, #placeholder-content-no-right { float: right; width: 723px; overflow: hidden; } #placeholder-content-top-no-left-no-right, #placeholder-content-no-left-no-right { float: left; width: 100%; overflow: hidden; } #placeholder-bottom-top { float: left; clear: both; padding-top: 35px; width: 100%; background: #e6e6e6 url(images/bg-bottom-top.png) left top repeat-x; border-bottom: 1px solid #f2f0f0; } #placeholder-bottom-top-left { float: left; width: 375px; overflow: hidden; } #placeholder-bottom-top-right { float: right; width: 300px; overflow: hidden; } #placeholder-bottom { clear: both; background: #024732; padding-bottom: 16px; overflow: hidden;} #content-link { display: none; } /* -------------------------------------------------------------------------- */ /* Fonts */ /* -------------------------------------------------------------------------- */ /* Overview over em-values for specific px-values Default: 12px 2.digest 12px = 1em 14px = 1.16em 16px = 1.33em 18px = 1.5em 20px = 1.66em 22px = 1.83em 24px = 2em 28px = 2.33em 30px = 2.5em */ h1, h2, h3, h4, h5, h6 { font-family: Arial, Verdana, Helvetica, sans-serif;} h1,h2,h3,h4,h5 { margin: 0px 0px 0px 0px; color: #666;} h1 { font-size: 1.66em; margin-bottom: 2px; } h2 { font-size: 1.16em; margin-top: 15px; margin-bottom: 5px; } h2.digest { font-size: 1em; margin-top: 0px;} h3 { font-size: 1.16em; color: #666; margin-bottom: 8px;} h4 { font-size: 1.16em; margin-bottom: 8px;} #placeholder-content .vertical-menu a:link, #placeholder-content .vertical-menu a:visited, #placeholder-content .vertical-menu a:hover, #placeholder-content-no-right .vertical-menu a:link, #placeholder-content-no-right .vertical-menu a:visited, #placeholder-content-no-right .vertical-menu a:hover { font-size: 1.66em; } span.clicker, a:visited, a:link, a:hover { color: #00aeef; text-decoration: none; } h3 a:visited, h3 a:link, h3 a:hover { color: #00aeef; font-size: 1.5em; } a:hover { text-decoration: underline; } a img { border: 0; } /* -------------------------------------------------------------------------- */ /* Non tile spesific common styles */ /* -------------------------------------------------------------------------- */ hr { height: 1px; overflow: hidden; border: none; border-bottom: 1px solid #C8C8C8; } /* -- Form and input ---------------------------------------------------------- */ form, input { margin: 0px;} button.submit-button, input { float: left; padding-top: 3px; padding-bottom: 3px;} input, textarea, select { border: 1px solid #C8C8C8;} input[type=checkbox], input[type=radio] { border: none; margin-right: 5px;} #placeholder-bottom input[type=text], #placeholder-bottom input[type=password] { background: #fff url(images/input-bg-shadow.png) left no-repeat; border: 1px solid #577a73; height: 12px;} a.link-button, .cpform-button, input.submit-button, .action-button, button.submit-button, input.submit, input.submit-reset { border: none; height: 23px; overflow: hidden; text-transform: uppercase; color: #323232; font-family: Arial, Verdana, Helvetica, sans-serif; font-weight: bold; background: url(images/submit-middle.png) repeat-x; padding-top: 0px; padding-bottom: 0px; font-size: 1em; display: block;} a.link-button:hover { text-decoration: none;} span.submit-left, span.submit-right, span.link-button-left, span.link-button-right, span.action-button-left, span.action-button-right { float: left; width: 10px; height: 23px; overflow: hidden;} span.submit-left, span.link-button-left, span.action-button-left { background: url(images/submit-left.png) no-repeat; } span.submit-right, span.link-button-right, span.action-button-right { background: url(images/submit-right.png) no-repeat; } .cpform-button, input.submit-button, button.submit-button, .action-button, input.submit, input.submit-reset, span.action-button-left, span.action-button-right, span.submit-left, span.submit-right { margin-top: 10px;} /* -- Tables ---------------------------------------------------------- */ table thead td { font-weight: bold; } table tbody tr.emtpy-header th { height: auto; } table td { padding-right: 3px; valign: bottom; } /* styles for odd table rows */ table tr.odd, table.country_prefix tr.even, .prices-rates table tr.priceplan-table-row-odd, .prices-rates table tr.priceplan-table-row-odd th, .tile-article-mobile tr.even { background: #fff; } /* styles for even table rows */ table tr.even, .prices-rates .priceplan-table-row-even, .prices-rates .priceplan-table-row-even th, .tile-article-mobile tr.odd { background: #f2f2f2; } /* Tables from with predefined style - tables from WYSIWYG in CP, where special predefined wysiwyg content template is used - the css class common-table-style can also be set in programmatic tables to get this style */ table.common-table-style { width: 100%; } table.common-table-style th.empty { border: none; background: #fff; /*white instead of none, because we don't want hover color for tr to affect this one*/ } #container table.common-table-style th, #container table.common-table-style td { height: 34px; border-width: 2px; padding: 1px 10px 1px 10px; } #container .lyseform2 table.common-table-style td { vertical-align: middle; } table.common-table-style th a:link, table.common-table-style th a:visited, table.common-table-style th a:hover, table.common-table-style th, table.common-table-style thead td { color: #4a4a4a; font-size: 1.09em; font-weight: bold; height: 34px; text-align: center; background: #f2f2f2; } table.common-table-style th, table.common-table-style thead td { border-bottom: 1px solid #ceced0; } table.common-table-style tr:hover { background: #dde5dc; } table.common-table-style tr.no-hover:hover { background: none; } /* -- Navigation bar --------------------------------------------------- */ .page-navigation { margin-top: 10px; } /* -- Tooltip ---------------------------------------------------------- */ #tooltip-top { background: url(images/tooltip/tooltip-top.gif) no-repeat 5px 0; overflow: hidden; height: 14px; width: 33px; } #tooltip-bottom { background: url(images/tooltip/tooltip-bottom.gif) no-repeat 5px 0; overflow: hidden; height: 14px; width: 33px; display: none; } #tooltip-content { background: #fff588; padding: 10px; border-right: 1px solid #ccc255; border-bottom: 1px solid #ddd366; } .flipped-y #tooltip-bottom { display: block; } .flipped-y #tooltip-top { display: none; } .flipped-y #tooltip-content { border-bottom: none; } /* -- Clearing div ---------------------------------------------------------- */ .clear-both { height: 0px; width: 0px; clear: both;} /* -------------------------------------------------------------------------- */ /* General tile */ /* -------------------------------------------------------------------------- */ /* Tiles in top, bottom and content placeholders should not be styled using the general styles, so we reset these styles here. HTML element ID spesific styling, using the #html-element-id notion has precendence over styles set generally using only the css-class. If we want to override these styles later in the stylesheet, we must remember to use the full element path. */ #placeholder-top .tile-content, #placeholder-top .tile-common, #placeholder-bottom .tile-content, #placeholder-bottom .tile-common, #placeholder-content .tile-content, #placeholder-content .tile-common, #placeholder-content .tile-common h3, #placeholder-content-no-right .tile-content, #placeholder-content-no-right .tile-common { background: none; border: none; padding: 0; } #placeholder-top .tile-common { margin: 0;} #placeholder-content-top h3, #placeholder-content-top-no-left h3, #placeholder-content-top-no-right h3 { display: none;} .tile-common { margin-bottom: 20px; } .tile-bottom { clear: both; } .label, td.label { font-weight: bold; } /* -------------------------------------------------------------------------- */ /* General inline listing (eg. horizontal menu, linktoolbar, sitelocator) */ /* -------------------------------------------------------------------------- */ .horizontal-menu h3, .linktoolbar h3, .sitelocator h3 { display: inline; float: left; padding: 0; } #placeholder-top .vertical-menu ul, .horizontal-menu ul, .linktoolbar ul, .sitelocator ul { display: inline; float: left; margin: 0; list-style-type: none; padding: 0; } #placeholder-top .vertical-menu li, .horizontal-menu li, .full-category-article-list .category-headers li, .articlelist-tabbed .article-tabs li, .tile-article-mobile .page_selector li, .linktoolbar li, .sitelocator li { display: inline; padding: 0px; } /* -------------------------------------------------------------------------- */ /* General bullet-less listing (eg. verical menu and small article list) */ /* -------------------------------------------------------------------------- */ .lyseform2 ul, .full-articlelist ul, .articlelist-link-internal ul, .articlelist-link-external ul, .small-category-article-list ul, .articlelist-tabbed .article-tabs ul, .full-category-article-list ul, .tile-article-mobile .page_selector ul, .login-form .login-status-container ul, .userinfo ul, .small-articlelist ul, .positionsvacant ul, .vertical-menu ul { list-style-type: none; margin: 0; padding: 0; } .lyseform2 li, .userinfo li, .metadatarelationlist li, .positionsvacant li, .small-category-article-list li, .login-form .login-status-container li, .small-articlelist li { margin-bottom: 3px;} /* -------------------------------------------------------------------------- */ /* Styling for spesific elements */ /* -------------------------------------------------------------------------- */ /* Some of these elements have been styled using id-context above. We therefore need to use the full id-element path to override these styles. */ /****** Tiles in placeholder-top *******************************************/ #placeholder-top .vertical-menu h3, #placeholder-top .horizontal-menu h3, #placeholder-top .small-searchinput h3 { display: none;} #placeholder-top .horizontal-menu a { font-size: 1.83em;} /* Comment about small-searchinput and vertical-menu: Because of floating bug in IE, we need to set a specific width and heigth to force logo-tile to "jump" on the line below. All elements in placeholder-top is floating, and it's not possible to set clear: right; on logo-tile to make it jump to the next line. */ #placeholder-top .loginstatus, #placeholder-top .small-searchinput, #placeholder-top .vertical-menu { float: right; margin-top: 10px; } #placeholder-top .loginstatus, #placeholder-top .vertical-menu { margin-top: 13px; } #placeholder-top .vertical-menu a { font-size: 1.16em; } /* -- Small searchinput and vertical menu (quicklaunch) --------------------------------- */ #placeholder-top .small-searchinput { width: 224px; } .small-searchinput input.submit { width: 47px; height: 23px; display: block; float: left; } .small-searchinput input.submit, .small-searchinput span.submit-left, .small-searchinput span.submit-right { margin-top: 0px;} span.submit-left, span.submit-right { float: left; width: 10px; height: 23px; overflow: hidden;} span.submit-left { background: url(images/submit-left.png) no-repeat; } span.submit-right { background: url(images/submit-right.png) no-repeat; } /* -- Vertical menu ("quicklaunch") -------------------- */ #placeholder-top .vertical-menu { width: 650px; margin-right: 30px; width: 250px; } #placeholder-top .loginstatus a:link, #placeholder-top .loginstatus a:visited, #placeholder-top .loginstatus a:hover, #placeholder-top .vertical-menu a:link, #placeholder-top .vertical-menu a:visited, #placeholder-top .vertical-menu a:hover { color: #A9D5E1; } #placeholder-top .vertical-menu ul { float: right; } #placeholder-top .vertical-menu li { margin-right: 30px; display: block; float: left; /*padding-top: 6px; margin-top: 2px;*/ } #placeholder-top .vertical-menu li.first { padding-top: 0px; } a.link-button { float: left; height: 23px; overflow: hidden; padding: 4px 8px 0px 8px; text-decoration: none; color: #323232; text-transform: uppercase; font-family: Arial, Verdana, Helvetica, sans-serif; font-weight: bold; background: url(images/submit-middle.png) repeat-x; } #placeholder-top .vertical-menu li.last { margin-right: 0px; } /* -- Login status -------------------------------------- */ #placeholder-top .cplibajaxtilecontainer-loading, #placeholder-top .cplibajaxtilecontainer, #placeholder-top .loginstatus { float: left; width: 400px; height: 28px; overflow: hidden; } #placeholder-top .loginstatus a { float: right; } #placeholder-top .loginstatus span { float: left; display: block; margin: 0px 5px 0px 0px; color: #fff; } #placeholder-top .loginstatus span.prefix { font-weight: bold; } #placeholder-top .loginstatus span.submit-left, #placeholder-top .loginstatus span.submit-right { margin: 0px; } /* -- Logo tile ----------------------------------------------------------- */ #placeholder-top .logo-tile { float: left; height: 75px; width: 110px; overflow: hidden; margin-top: 10px; margin-bottom: 7px;} #placeholder-top .logo-tile .cp-mmarchive-image-default { margin: 0px; } .logo-tile .logo { font-size: 1.85em; font-weight: bold; } /* -- Horizontal menu ------------------------------------------------------ */ #placeholder-top .horizontal-menu { float: right; clear: right; margin: 40px 0px 0px 0px; width: 820px; } #placeholder-top .horizontal-menu ul { float: right; clear: right; } #placeholder-top .horizontal-menu a:link, #placeholder-top .horizontal-menu a:visited, #placeholder-top .horizontal-menu a:hover { font-weight: bold; color: #fff;} /*Set different font color based if backgroundimage is dark or light*/ #placeholder-top.dark .horizontal-menu a:link, #placeholder-top.dark .horizontal-menu a:visited { color: #fff; } #placeholder-top.light .horizontal-menu a:link, #placeholder-top.light .horizontal-menu a:visited { color: #243c32; } #placeholder-top.dark .horizontal-menu a:hover, #placeholder-top.light .horizontal-menu a:hover { color: #74cc62; } #placeholder-top.dark .horizontal-menu .slidedown-toplevel li.active a:link, #placeholder-top.dark .horizontal-menu .slidedown-toplevel li.active a:visited, #placeholder-top.dark .horizontal-menu .slidedown-toplevel li.active a:hover, #placeholder-top.dark .horizontal-menu .slidedown-toplevel li.main-active a:link, #placeholder-top.dark .horizontal-menu .slidedown-toplevel li.main-active a:visited, #placeholder-top.dark .horizontal-menu .slidedown-toplevel li.main-active a:hover, #placeholder-top.light .horizontal-menu .slidedown-toplevel li.active a:link, #placeholder-top.light .horizontal-menu .slidedown-toplevel li.active a:visited, #placeholder-top.light .horizontal-menu .slidedown-toplevel li.active a:hover, #placeholder-top.light .horizontal-menu .slidedown-toplevel li.main-active a:link, #placeholder-top.light .horizontal-menu .slidedown-toplevel li.main-active a:visited, #placeholder-top.light .horizontal-menu .slidedown-toplevel li.main-active a:hover { color: #74cc62; } /* Here is some special style if we uses images in menu instead of text Then, the a-tag has no text, but a background image(from cp) is set as inline style on this specific a-tag The background image is "double" meaning that one image contain the text and description in two variants, one ordinary and one for active and mousehover - we then use background position to decide what part of the image to show Notice: this a-tag has width set as inline style in html code - the width is the width from background image */ #placeholder-top .horizontal-menu a.image-link:link, #placeholder-top .horizontal-menu a.image-link:visited, #placeholder-top .horizontal-menu a.image-link:hover { display: block; float: left; height: 19px; overflow: hidden; margin-left: 15px; background-repeat: no-repeat; } #placeholder-top .horizontal-menu li.last a.image-link:link, #placeholder-top .horizontal-menu li.last a.image-link:visited, #placeholder-top .horizontal-menu li.last a.image-link:hover { margin-left: 60px; } #placeholder-top .horizontal-menu .slidedown-toplevel li.slidedown-active a:link, #placeholder-top .horizontal-menu .slidedown-toplevel li.slidedown-active a:visited, #placeholder-top .horizontal-menu .slidedown-toplevel li.slidedown-active a:hover, #placeholder-top .horizontal-menu .slidedown-toplevel li.active a:link, #placeholder-top .horizontal-menu .slidedown-toplevel li.active a:visited, #placeholder-top .horizontal-menu .slidedown-toplevel li.active a:hover, #placeholder-top .horizontal-menu .slidedown-toplevel li.sub-active a:link, #placeholder-top .horizontal-menu .slidedown-toplevel li.sub-active a:visited, #placeholder-top .horizontal-menu .slidedown-toplevel li.sub-active a:hover, #placeholder-top .horizontal-menu .slidedown-toplevel li.main-active a:link, #placeholder-top .horizontal-menu .slidedown-toplevel li.main-active a:visited, #placeholder-top .horizontal-menu .slidedown-toplevel li.main-active a:hover, #placeholder-top .horizontal-menu .slidedown-toplevel li.sub-active a:link, #placeholder-top .horizontal-menu .slidedown-toplevel li.sub-active a:visited, #placeholder-top .horizontal-menu .slidedown-toplevel li.sub-active a:hover { background-position: left -19px; } #placeholder-top .horizontal-menu .slidedown-toplevel a.image-link:hover, #placeholder-top .horizontal-menu .slidedown-toplevel li.active a:hover, #placeholder-top .horizontal-menu .slidedown-toplevel li.sub-active a:hover, #placeholder-top .horizontal-menu .slidedown-toplevel li.main-active a:hover, #placeholder-top .horizontal-menu .slidedown-toplevel li.sub-active a:hover { background-position: left -38px; } /* We also set display none on the ordinary a-tag that contains text since the background image should replace this text */ #placeholder-top .horizontal-menu span.nodisplay, #placeholder-top .horizontal-menu a.nodisplay:link, #placeholder-top .horizontal-menu a.nodisplay:visited, #placeholder-top .horizontal-menu a.nodisplay:hover { display: none;} #placeholder-top .horizontal-menu .slidedown-toplevel { float: right; clear: both; width: 820px; height: 19px; margin: 0px 0px 28px 0px; overflow: hidden; } #placeholder-top .horizontal-menu .slidedown-content a { font-size: 1em; } #placeholder-top .horizontal-menu .slidedown-content ul { float: left; } #placeholder-top .horizontal-menu .slidedown-content li { display: block; float: left; margin-bottom: 1px; margin-right: 55px; } #placeholder-top .horizontal-menu .slidedown-content li li { clear: both; width: 100%; margin-right: 0px; padding-left: 10px; background: url(images/slidedown-menu-arrow.png) left no-repeat; } #placeholder-top .horizontal-menu .slidedown-content ul ul { float: left; clear: both; width: 100%; margin-top: 4px; margin-left: 2px; } #placeholder-top .horizontal-menu .slidedown-container { float: left; /*overrided in style-ie.css*/clear: both; width: 1001px; margin-left: -152px; /*overrided in style-ie6.css*/ height: 130px; /*this is acting as a min-height property in the javascript for the slidedown menu*/ background: #f2f2f2; border-top: 1px solid #dbdbdb; } #placeholder-top .horizontal-menu .slidedown-content { float: left; /*overrided in style-ie6.css*/ clear: both; padding: 18px 30px 17px 30px; width: 940px; /*Must have background here to prevent ugly fonts in ie. This "hack" must be done since the js that slide down the menu has an appear-effect on this div when showing it, and this effect give the div an opacity. Without background set on this div fonts in ie doesn't look good */ background: #f2f2f2; } #placeholder-top .horizontal-menu .slidedown-content .slidedown-menu { float: left; overflow: hidden; } #placeholder-top .horizontal-menu .slidedown-menu li a:link, #placeholder-top .horizontal-menu .slidedown-menu li a:visited, #placeholder-top .horizontal-menu .slidedown-menu li a:hover { color: #000; font-size: 1.33em; text-transform: uppercase; float: left; border-bottom: 1px solid #00aff0; } #placeholder-top .horizontal-menu .slidedown-menu li a:hover { text-decoration: none; } #placeholder-top .horizontal-menu .slidedown-menu li li a:link, #placeholder-top .horizontal-menu .slidedown-menu li li a:visited, #placeholder-top .horizontal-menu .slidedown-menu li li a:hover { color: #00aeef; font-size: 1em; text-transform: none; border: none; } #placeholder-top .horizontal-menu .slidedown-menu li li a:hover { text-decoration: underline; } #placeholder-top .horizontal-menu .slidedown-content .slidedown-banner { float: right; width: 299px; overflow: hidden; } #placeholder-top .horizontal-menu .slidedown-content .banner-top, #placeholder-top .horizontal-menu .slidedown-content .banner-bottom, #placeholder-top .horizontal-menu .slidedown-content .banner-content { float: left; clear: both; width: 299px; overflow: hidden;} #placeholder-top .horizontal-menu .slidedown-content .banner-top { height: 2px; background: url(images/slidedown-banner-top.png) repeat-y; } #placeholder-top .horizontal-menu .slidedown-content .banner-bottom { height: 5px; background: url(images/slidedown-banner-bottom.png) repeat-y; } #placeholder-top .horizontal-menu .slidedown-content .banner-content { padding: 12px 21px 0px 23px; width: 255px; background: url(images/slidedown-banner-content.png) repeat-y; } #placeholder-top .horizontal-menu .slidedown-content .slidedown-banner h3 { display: block; float: none; color: #55a72a; } #placeholder-top .horizontal-menu .slidedown-content .slidedown-banner p, #placeholder-top .horizontal-menu .slidedown-content .slidedown-banner .cp-mmarchive-image-right, #placeholder-top .horizontal-menu .slidedown-content .slidedown-banner .cp-mmarchive-image-left { margin-top: 0px; } /*Set different font color based if backgroundimage is dark or light*/ #placeholder-top.dark .horizontal-menu span { color: #a9d5e1;} #placeholder-top.light .horizontal-menu span { color: #00aeef;} /* -- Articledisplay and Articlelist ----------------------------------------------------------- */ #placeholder-top .full-articledisplay, #placeholder-top .small-articlelist { overflow: hidden; background: #fff; } #placeholder-top .full-articledisplay { float: left; clear: both; width: 640px; padding-top: 0px; height: 400px; background: top no-repeat; } #placeholder-top .full-articledisplay p, #placeholder-top .small-articlelist p { margin-top: 0px; } #placeholder-top .small-articlelist { float: right; width: 260px; overflow: hidden; padding: 20px; color: #cccccc; background: #1a1a1a; } #placeholder-top .small-articlelist .tile-content { height: 360px; overflow: hidden; } #placeholder-top .small-articlelist h3 { display: none; } #placeholder-top .small-articlelist span.entry-postfix { display: block; float: left; clear: left; margin-right: 3px;} #placeholder-top .small-articlelist a:link, #placeholder-top .small-articlelist a:visited, #placeholder-top .small-articlelist a:hover { display: block; color: #fff; font-size: 1.5em; } /* -- Linktoolbar ----------------------------------------------------------- */ .linktoolbar h3 { display: none; } .linktoolbar ul { float: right; } /* -- Sitelocator and articledisplay in placeholder-top-below ------------------------- */ #placeholder-top-below .full-articledisplay, #placeholder-top-below .sitelocator { width: 100%; margin: 0px auto; overflow: hidden; } #placeholder-top-below .full-articledisplay p, #placeholder-top-below .full-articledisplay .cp-mmarchive-image-default, #placeholder-top-below .full-articledisplay .cp-mmarchive-image-left, #placeholder-top-below .full-articledisplay .cp-mmarchive-image-right { margin: 0px;} #placeholder-top-below .sitelocator { padding-left: 35px; color: #69BD27;} #placeholder-top .sitelocator { clear: both; color: #69BD27; width: 966px; padding-left: 35px; margin-left: -29px; /* using minus margin to override the position of placeholder-content-container inside #placeholder-top.*/ background: #f2f2f2; border-top: 1px solid #cecfd4; border-bottom: 1px solid #ebebeb; } .sitelocator ul { height: 100%; } .sitelocator li { display: block; float: left; height: 20px; padding-top: 8px; padding-left: 34px; margin-right: 20px; background: url(images/sitelocator-li-bg.png) no-repeat left; } .sitelocator li.first { width: 15px; height: 28px; margin-right: 9px; padding: 0px; background: url(images/sitelocator-house.png) no-repeat center; } /* put background with house-image on the a-tag, making it clickable*/ .sitelocator li.first a { display: block; width: 15px; height: 28px; background: url(images/sitelocator-house.png) no-repeat center; } /* don't show text for the first link, since it has clickable image set as background on a-tag*/ .sitelocator li.first span { display: none; } .sitelocator li.last { margin-right: 0px; } .sitelocator h3, .sitelocator span.seperator { display: none; } /* Datepicker -------------------------------------------------------------> */ .datepicker-popup div.calendar-layout { background: #f2f2f2; border: 1px solid #c2c2c2; width: 180px; padding: 10px; text-align: center; } /* Padding for a.datepicker-select is overridden in IE stylesheets */ a.datepicker-select span { display: none; } /* There are padding adjustements in stylesheet for IE6 and 7 */ a.datepicker-select { border: 0; display: block; background: url(images/calendar-icon.png) no-repeat; width: 23px; height: 23px; padding: 0; margin: 0; } .datepicker-nextyear, .datepicker-previousyear { margin-bottom: 5px; } .datepicker-nav span { display: none; } .datepicker-nav a { display: block; } .datepicker-nextyear a, .datepicker-previousyear a { width: 10px; height: 6px; } .datepicker-nextmonth a, .datepicker-previousmonth a { width: 6px; height: 8px; } .datepicker table { border-collapse: collapse; border-spacing: 0; padding: 0; } .datepicker-popup .calendar-header td { padding: 2px; vertical-align: top; } .datepicker-popup .calendar-header, .datepicker-popup .calendar-layout { width: 100%; } .datepicker label { display: block; } .datepicker td { vertical-align: bottom; } .datepicker td.previous, .datepicker td.next { width: 5px; } .datepicker td.header { font-size: 1.16em ; color: #666666; font-weight: bold; } .datepicker-popup .calendar-layout .today a { color: #69BD27; font-weight: bold; } .datepicker-popup .calendar-layout .day-link { font-weight: bold; } .datepicker-popup .calendar-layout th { color: #4A4A4A; } .datepicker label { margin-top:5px; } .datepickerinput { width: 80px; } /* Buttons are fixed to use gif's in IE6 stylesheet */ .button-small-next { display: block; height: 8px; width: 5px; background: url(images/buttons-blue.png) no-repeat -5px top; } .button-small-previous { display: block; height: 8px; width: 5px; background: url(images/buttons-blue.png) no-repeat; } .button-small-last { display: block; height: 8px; width: 9px; background: url(images/buttons-blue.png) no-repeat -19px top; } .button-small-first { display: block; height: 8px; width: 9px; background: url(images/buttons-blue.png) no-repeat -10px top; } /****** Tiles in placeholder-bottom *****************************************/ #placeholder-bottom, #placeholder-bottom h3 { color: #d2d2d2; } #placeholder-bottom h3 { font-size: 1.33em; } #placeholder-bottom .tile-common { margin: 25px 0px 0px 0px; } #placeholder-bottom .small-articledisplay { float: left; width: 335px; } #placeholder-bottom .vertical-menu { float: left; width: 276px; } #placeholder-bottom .vertical-menu li { float: left; clear: both; width: 100%; height: 20px; margin-top: 5px; margin-bottom: 5px; } #placeholder-bottom .vertical-menu a:link, #placeholder-bottom .vertical-menu a:visited, #placeholder-bottom .vertical-menu a:hover { color: #c8c8c8; display: block; float: left; height: 12px; padding-top: 6px; margin-right: 10px; } #placeholder-bottom .vertical-menu .category-thumb a:link, #placeholder-bottom .vertical-menu .category-thumb a:visited, #placeholder-bottom .vertical-menu .category-thumb a:hover { padding-top: 0px; } #placeholder-bottom .cplibajaxtilecontainer, #placeholder-bottom .login-form { float: left; width: 330px; /*overrided in style-ie6.css*/ } #placeholder-bottom .login-form a { color: #a9d5e1; text-decoration: underline; } /****** Tiles in placeholder-bottom-top *******************************************/ /* Notice: If we don't have tiles in #placeholder-bottom-top-left and #placeholder-bottom-top-right, tiles are printed in their own div's (common class for them is .bottom-tile). The reason for this is to set correct width on each tile, so that we have dynamic width based on numer of tiles. This width is set as inline styling in grid. */ #placeholder-bottom-top .tile-common { margin-right: 20px; margin-bottom: 40px; } #placeholder-bottom-top p { margin: 0px; } #placeholder-bottom-top .bottom-tile { float: left; overflow: hidden; } /*width set as inline style in grid*/ #placeholder-bottom-top-left .tile-common, #placeholder-bottom-top-right .tile-common { float: none; clear: both; margin-right: 0px;} #placeholder-bottom-top .full-articlelist { float: left; } #placeholder-bottom-top .full-articlelist p { margin: 0px;} #placeholder-bottom-top .full-articlelist li { float: none; clear: none; width: 260px; overflow: hidden; padding-right: 65px; } #placeholder-bottom-top .full-articlelist li.last { margin-right: 0px; padding-right: 0px; } #placeholder-bottom-top-left .full-articlelist ul, #placeholder-bottom-top-right .full-articlelist ul { margin-top: 15px;} #placeholder-bottom-top-left .full-articlelist li, #placeholder-bottom-top-right .full-articlelist li { margin-right: 0px; margin-bottom: 15px; clear: both; width: 100%; } #placeholder-bottom-top-left .full-articlelist li.last, #placeholder-bottom-top-right .full-articlelist li.last { margin-bottom: 0px; } #placeholder-bottom-top .small-category-article-list ul { margin-bottom: 25px; } /****** Tiles in placeholder-left *****************************************/ /* -- Vertical menu ------------------------------------------------------- */ #placeholder-left .vertical-menu { border: 1px solid #ebebeb; } #placeholder-left .vertical-menu .tile-bottom { clear: both; } #placeholder-left .vertical-menu h3 { display: none; } /* floating becuase of ie */ #placeholder-left .vertical-menu li { display: block; float: left; clear: both; width: 100%; padding: 3px 0px 5px 0px; background: #f2f2f2; border-top: 1px solid #C8C8C8; } #placeholder-left .vertical-menu li.expanded li.last { margin-bottom: -5px; /*hack to get correct styling when given number of levels in menu and the last level has child*/} #placeholder-left .vertical-menu li.first { border: none; padding-top: 10px; } #placeholder-left .vertical-menu li li, #placeholder-left .vertical-menu li li.first { padding-top: 3px; background: #fff; border-top: 1px solid #f2f2f2; } #placeholder-left .vertical-menu li.active, #placeholder-left .vertical-menu li li.active, #placeholder-left .vertical-menu li.sub-active.collapsed { background: #dde5dc; border-top: 1px solid #69bd27; } #placeholder-left .vertical-menu li a { font-size: 1.16em; color: #666; display: block; padding-left: 14px; background: url(images/blue-arrow-aside.png) left center no-repeat; } /* switch background image down in li-list */ #placeholder-left .vertical-menu li.sub-active a { background: url(images/blue-arrow-down.png) left center no-repeat; } #placeholder-left .vertical-menu li.sub-active li a { background: url(images/blue-arrow-aside.png) left center no-repeat; } #placeholder-left .vertical-menu li li.sub-active a { background: url(images/blue-arrow-down.png) left center no-repeat; } #placeholder-left .vertical-menu li li.sub-active li a { background: url(images/blue-arrow-aside.png) left center no-repeat; } #placeholder-left .vertical-menu li li li.sub-active a { background: url(images/blue-arrow-down.png) left center no-repeat; } #placeholder-left .vertical-menu li li li.sub-active li a { background: url(images/blue-arrow-aside.png) left center no-repeat; } #placeholder-left .vertical-menu li li li li.sub-active a { background: url(images/blue-arrow-down.png) left center no-repeat; } #placeholder-left .vertical-menu li li li li.sub-active li a { background: url(images/blue-arrow-aside.png) left center no-repeat; } #placeholder-left .vertical-menu li.collapsed a, #placeholder-left .vertical-menu li li.collapsed a, #placeholder-left .vertical-menu li li li.collapsed a, #placeholder-left .vertical-menu li li li li.collapsed a, #placeholder-left .vertical-menu li li li li li.collapsed a { background: url(images/blue-arrow-aside.png) left center no-repeat; } /* switch margin left on a tag down in li-list */ #placeholder-left .vertical-menu li a { margin-left: 10px; } #placeholder-left .vertical-menu li li a { margin-left: 24px; } #placeholder-left .vertical-menu li li li a { margin-left: 38px; } #placeholder-left .vertical-menu li li li li a { margin-left: 52px; } #placeholder-left .vertical-menu li li li li li a { margin-left: 66px; } /* floating becuase of ie */ #placeholder-left .vertical-menu ul ul { margin: 6px 0px 0px 0px; float: left; clear: both; width: 100%; border-top: 1px solid #C8C8C8; } #placeholder-left .vertical-menu ul ul ul { border: none; } /****** Tiles in placeholder-content-xxx *****************************************/ /* -- Vertical menu ------------------------------------------------------- */ #placeholder-content .vertical-menu h3, #placeholder-content-no-right .vertical-menu h3 { display: none; } #placeholder-content .vertical-menu .category-thumb, #placeholder-content-no-right .vertical-menu .category-thumb { float: left; margin-right: 10px; } #placeholder-content .vertical-menu a:link, #placeholder-content .vertical-menu a:visited, #placeholder-content .vertical-menu a:hover, #placeholder-content-no-right .vertical-menu a:link, #placeholder-content-no-right .vertical-menu a:visited, #placeholder-content-no-right .vertical-menu a:hover { display: block; font-weight: bold; } #placeholder-content .vertical-menu li, #placeholder-content-no-right .vertical-menu li { float: left; clear: both; width: 100%; margin-bottom: 25px; } #placeholder-content .vertical-menu li.last, #placeholder-content-no-right .vertical-menu li.last { margin-bottom: 0px; } /* -- Article display ------------------------------------------------------- */ #placeholder-content-no-left-no-right .full-articledisplay, #placeholder-content-no-left .full-articledisplay, #placeholder-content-no-right .full-articledisplay { clear: both; margin-bottom: 20px;} #placeholder-content-no-left-no-right .full-articledisplay p, #placeholder-content-no-left .full-articledisplay p, #placeholder-content-no-right .full-articledisplay p { margin-top: 0px;} .cp-mmarchive-image-default { margin: 10px; } .cp-mmarchive-image-left { margin: 10px 10px 10px 0px; } .cp-mmarchive-image-right { margin: 10px 0px 10px 10px; } .full-articledisplay .additional-image { float: right; } .full-articledisplay .image-below-header { float: left; clear: both; margin-bottom: 16px; width: 100%; } .full-articledisplay .image-below-header .image { float: left; } .full-articledisplay .image-below-header .image-text { float: left; margin-left: 10px; width: 168px; } #placeholder-top .full-articledisplay .cp-mmarchive-image-default, #placeholder-top .full-articledisplay .cp-mmarchive-image-left, #placeholder-top .full-articledisplay .cp-mmarchive-image-right, .full-articledisplay table .cp-mmarchive-image-default, .full-articledisplay table .cp-mmarchive-image-left, .full-articledisplay table .cp-mmarchive-image-right, .full-articlelist .cp-mmarchive-image-default, .full-articlelist .cp-mmarchive-image-left, .full-articlelist .cp-mmarchive-image-right { margin: 0px; } h2.digest { text-transform: none; font-family: Arial, Verdana, Helvetica, sans-serif; } #placeholder-content-top-no-left-no-right .full-articledisplay { float: left; width: 613px; overflow: hidden; } /* -- Article display as banners ---------------------------------------------------------------- */ #placeholder-top-below .full-articlelist li, #placeholder-top-below .full-articlelist .full-articledisplay p, #placeholder-content-top .full-articlelist li, #placeholder-content-top-no-right .full-articlelist li, #placeholder-content-top-no-left .full-articlelist li, #placeholder-content-top-no-right .full-articlelist .full-articledisplay p, #placeholder-content-top-no-left .full-articlelist .full-articledisplay p, #placeholder-content-top .full-articlelist .full-articledisplay p { margin: 0px; } /* -- Mobile shop --------------------------------------------------------------------- */ .tile-article-mobile .page_selector { background: #e6e6e6; } .tile-article-mobile .page_selector_and_display .article_display { float: left; width: 676px; padding-bottom: 10px; overflow: hidden; background: #f2f2f2; border-left: 1px solid #e6e6e6; border-right: 1px solid #e6e6e6; border-top: none; } .tile-article-mobile .page_selector, .tile-article-mobile .article_display { width: 640px; padding: 0px 20px 0px 20px;} .tile-article-mobile .page_selector { padding-bottom: 15px;} .full-category-article-list .articles p { margin-top: 0px;} .full-category-article-list .articles h3, .full-category-article-list .articles h3 a { font-size: 1em; color: #00aeef; } .tile-article-mobile .page_selector li, .tile-article-mobile .page_selector ul, .tile-article-mobile .page_selector a:link, .tile-article-mobile .page_selector a:visited, .tile-article-mobile .page_selector a:hover { padding-top: 15px; } .tile-article-mobile .page_selector a:link, .tile-article-mobile .page_selector a:visited, .tile-article-mobile .page_selector a:hover { margin-right: 50px; font-weight: bold; white-space: nowrap; } .tile-article-mobile .page_selector li.active a:link, .tile-article-mobile .page_selector li.active a:visited, .tile-article-mobile .page_selector li.active a:hover { background: url(images/horizontal-menu-content-active.png) center top no-repeat; color: #666;} .tile-article-mobile .page_selector a:link, .tile-article-mobile .page_selector a:visited, .tile-article-mobile .page_selector a:hover { font-weight: bold; white-space: nowrap; } /* -- Tabbed lists -------------------------------------------------------------------------------------------------------*/ .tile-common .tabs-common li { padding: 6px 9px 10px 9px; height: 10px; display: block; float: left; margin-right: 2px; border: 1px solid #ceced0; border-bottom: none; background: #f2f2f2; } .tile-common .tabs-common { clear: both; overflow: hidden; width: 100%; height: 28px; background: url(images/tabs-border.png) repeat-x; /*bg position set in style-ie6.css*/} .tile-common .tabs-common li.active { color: #69BD27; border-color: #69BD27; border-bottom: 1px solid #fff; background: #fff; } .tile-common .tabs-common li.active a { color: #69BD27; } .tile-common .tab-content { clear: both; padding: 20px 25px 10px 25px; border: 1px solid #ceced0; border-top: none; } #container .full-category-article-list .tab-content { padding-bottom: 20px; } /* -- small category article list in placeholder-content ---------------------------------------------------------------- */ #placeholder-content .small-category-article-list ul, #placeholder-content-no-right .small-category-article-list ul { margin-bottom: 20px;} /* -- Metadatarelationlist, Full articlelist and Userinfo ---------------------------------------------------------------- */ #container-placeholder-content .userinfo, #container-placeholder-content .dls-customer-information-container, #container-placeholder-content .full-articlelist.extralayout, #container-placeholder-content .metadatarelationlist.extralayout, #container-placeholder-content .meter-history .meter-content { padding: 10px; background: #f5f5f5; } #container-placeholder-content .userinfo .tile-content, #container-placeholder-content .dls-customer-information-container .customer-information-content, #container-placeholder-content .full-articlelist.extralayout ul, #container-placeholder-content .metadatarelationlist.extralayout .tile-content { clear: both; width: 100%; background: transparent; /* must have this because of IE-bug. Without this the text disappears*/ } #container-placeholder-content .dls-customer-information-container .customer-information, #container-placeholder-content .dls-customer-information-container .tile-create-alias { clear: none; margin-bottom: 10px; } #placeholder-content-no-left .metadatarelationlist .article-content ul, #placeholder-content-no-right .metadatarelationlist .article-content ul { width: 265px; margin-bottom: 10px;} #placeholder-content-no-left .metadatarelationlist .article-content ul, #placeholder-content-no-right .metadatarelationlist .article-content ul { display: inline; } /* Adding float and width to ul make bullets disappear in IE, so this one fix the problem */ #placeholder-right .userinfo { padding: 10px; background: #f5f5f5; float: left; clear: both; } #container-placeholder-content .login-form .login-form-link-prefix, #container-placeholder-content .login-form .login-form-link { margin-right: 8px; } #container-placeholder-content .userinfo h1 { font-size: 1.16em; } #container-placeholder-content .userinfo h3 { font-size: 1em; } #container-placeholder-content .userinfo ul { padding-bottom: 10px; } #container-placeholder-content .userinfo .userinfo-list { float: left; } #container-placeholder-content .userinfo .update-contact-info { padding-right: 10px; } #container-placeholder-content .userinfo .full-articledisplay { width: 50%; float: right; margin: 0px 10px; } #placeholder-content .userinfo ul, #placeholder-content .userinfo ul { float: none; margin-bottom: 20px; width: auto;} /* #placeholder-content-no-left .userinfo .update-contant-info, #placeholder-content-no-right .userinfo .update-contant-info { float: right; } */ /*Se more styling for metadata, small-articlelist and small-articledisplay used in placeholder-content-top-no-left-no-right under section Tiles in placeholder-right */ #placeholder-content-top-no-left-no-right .metadatarelationlist, #placeholder-content-top-no-left-no-right .small-articlelist, #placeholder-content-top-no-left-no-right .small-articledisplay { float: right; clear: none;} #placeholder-content-top-no-left-no-right .metadatarelationlist .cp-mmarchive-image-left, #placeholder-content-top-no-left-no-right .metadatarelationlist .cp-mmarchive-image-default, #placeholder-content-top-no-left-no-right .small-articledisplay .cp-mmarchive-image-left, #placeholder-content-top-no-left-no-right .small-articledisplay .cp-mmarchive-image-default { margin: 0px 0px 0px 0px;} #placeholder-content-top-no-left-no-right .metadatarelationlist .cp-mmarchive-image-left, #placeholder-content-top-no-left-no-right .small-articledisplay .cp-mmarchive-image-left { margin-right: 15px; } #placeholder-content-top-no-left-no-right .metadatarelationlist .cp-mmarchive-image-right, #placeholder-content-top-no-left-no-right .small-articledisplay .cp-mmarchive-image-right { margin-left: 15px; } #placeholder-content-top-no-left-no-right .metadatarelationlist .tile-top, #placeholder-content-top-no-left-no-right .metadatarelationlist .tile-bottom { display: none; } #container #placeholder-content-top-no-left-no-right .metadatarelationlist p { margin-top: 10px; margin-bottom: 0px; float: none;} #container #placeholder-content-top-no-left-no-right .metadatarelationlist .tile-content { float: none; width: auto; padding: 0px; border: none; background: none; } #placeholder-content-top-no-left-no-right .metadatarelationlist .small-articlelist { background: none; padding: 0px; margin: 0px; border: none; background: none;} /* -- Article list, Search result, Small article list ---------------------------------------------------------- */ .full-articlelist img { border: 1px solid #C8C8C8; } .full-articlelist h3, .full-articlelist h4 { margin: 0px; } .full-articlelist .newsarchivelink, .small-articlelist .newsarchivelink { float: left; } .full-articlelist ul li { clear: both; float: left; width: 100%; margin-bottom: 20px; } .full-articlelist.extralayout ul li { margin-bottom: 10px; } .full-articlelist p { margin: 0px; float: left; clear: both; width: 100%; } .full-articlelist .articlelist-link-internal, .full-articlelist .articlelist-link-external { clear: both; } .full-articlelist .articlelist-link-internal li, .full-articlelist .articlelist-link-external li { clear: both; float: none; width: auto; margin: 0px;} /* internal and external links with button design */ .articlelist-link-internal.button-style, .articlelist-link-external.button-style { margin-top: 15px; float: left; /*overrided in style-ie.css*/} /*above thumb */ .articlelist-link-internal.button-style span.link-text, .articlelist-link-internal.button-style span.link-start, .articlelist-link-internal.button-style span.link-end, .articlelist-link-external.button-style span.link-text, .articlelist-link-external.button-style span.link-start, .articlelist-link-external.button-style span.link-end { display: block; float: left; height: 27px; } .articlelist-link-internal.button-style span.link-start, .articlelist-link-internal.button-style span.link-end, .articlelist-link-external.button-style span.link-start, .articlelist-link-external.button-style span.link-end { width: 13px; background: url(images/articlelist-link-edges.png) no-repeat; } .articlelist-link-internal.button-style span.link-start, .articlelist-link-external.button-style span.link-start { background-position: 0px center; } .articlelist-link-internal.button-style span.link-end, .articlelist-link-external.button-style span.link-end { background-position: -13px center; } .articlelist-link-internal.button-style span.link-text, .articlelist-link-external.button-style span.link-text { padding-top: 6px; height: 21px; background: url(images/articlelist-link-text.png) repeat-x; } .articlelist-link-internal.button-style a, .articlelist-link-external.button-style a, .full-articlelist.extralayout .articlelist-link-internal li a, .full-articlelist.extralayout .articlelist-link-external li a { color: #323232; font-size: 1.16em; } .full-articlelist ul, .full-articlelist-twocolumn ul { list-style-type: none; padding: 0; margin: 0; } .full-articlelist span.date { float: left; margin-right: 3px; } .full-articlelist.several-columns td { padding: 0px; overflow: hidden; border-right: 1px solid #C8C8C8; } .full-articlelist.several-columns td { padding: 0px 16px 0px 16px; } #placeholder-content .full-articlelist.several-columns td.last-on-row, #placeholder-content .full-articlelist.several-columns td.emtpy-td, #placeholder-content-no-right .full-articlelist.several-columns td.last-on-row, #placeholder-content-no-right .full-articlelist.several-columns td.emtpy-td, #placeholder-content-no-left-no-right .full-articlelist.several-columns td.last-on-row, #placeholder-content-no-left-no-right .full-articlelist.several-columns td.emtpy-td { border: none; padding-right: 0px; } .full-articlelist.several-columns tr.space-tr { height: 36px; } .full-articlelist.several-columns tr.space-tr td { border: none; vertical-align: top; } .full-articlelist.several-columns td.first-on-row { padding-left: 0px; } .full-articlelist.several-columns tr.space-tr .td-content { margin-top: 17px; border-top: 1px solid #C8C8C8; } /* using .td-content to set width since it's difficult to trust width on td */ #placeholder-content-no-left .full-articlelist.columns-2 td .td-content { width: 327px; overflow: hidden; } #placeholder-content-no-right .full-articlelist.columns-2 td .td-content { width: 337px; width: 344px; overflow: hidden; } #placeholder-content-no-left-no-right .full-articlelist.columns-2 td .td-content { width: 457px; overflow: hidden; } .full-articlelist.extralayout .articlelist-link-internal, .full-articlelist.extralayout .articlelist-link-external { float: left; width: auto; clear: none; margin-top: 28px; } .full-articlelist.extralayout p { float: none; clear: none; float: none; width: auto; } .full-articlelist.extralayout img { border: 1px solid #00adef; } .full-articlelist.extralayout h3 { margin-top: 12px; } .full-articlelist.extralayout h3 a { font-size: 1em; } #container-placeholder-content .full-articlelist.extralayout .articlelist-link-internal ul, #container-placeholder-content .full-articlelist.extralayout .articlelist-link-external ul { padding: 0px; clear: both;} .full-articlelist.extralayout .articlelist-link-internal li, .full-articlelist.extralayout .articlelist-link-external li { padding: 2px 5px 1px 2px; float: left; clear: both; border-top: 1px solid #c8c8c8; border-bottom: 1px solid #c8c8c8; } .full-articlelist.extralayout .articlelist-link-internal li a, .full-articlelist.extralayout .articlelist-link-external li a { padding-top: 4px; padding-right: 35px; display: block; height: 20px; background: url(images/articlelist-extralayout-link.png) right center no-repeat; } .list-thumbnail-left { float: left; margin-right: 10px;} .full-articlelist.extralayout .list-thumbnail-left { margin-right: 46px;} .list-thumbnail-right { float: right; margin-left: 10px;} .full-articlelist.extralayout .list-thumbnail-right { margin-left: 46px;} .list-thumbnail-center { text-align: center; } .list-thumbnail-left, .list-thumbnail-right, .list-thumbnail-center { margin-bottom: 11px; } .full-articlelist.header-above-thumb .list-thumbnail-left, .full-articlelist.header-above-thumb .list-thumbnail-right, .full-articlelist.header-above-thumb .list-thumbnail-center { margin-top: 11px; } .error, .error h2, .full-articlelist-message { font-weight: bold; color: red; } .notification { font-weight: bold; color: green; } /* Productlist page */ .full-articlelist .connection-category-children { float: left; margin-top: 11px; overflow: hidden; } #placeholder-content-no-left .full-articlelist .connection-category-children { width: 110px; } #placeholder-content-no-right .full-articlelist .connection-category-children { width: 120px; } .full-articlelist.header-above-thumb .connection-category-children { margin-top: 21px;} .full-articlelist .connection-category-children a { font-weight: bold; } .full-articlelist .connection-category-children li { margin: 0px; width: 100%; } /****** Tiles in placeholder-right *****************************************/ #placeholder-right p { margin-top: 0px; } #placeholder-right .tile-bottom { clear: both; } #placeholder-right .tile-common { margin-bottom: 70px; } /* -- Metadatarelationlist and small articlelist ------------------------------------------------------- */ #placeholder-right .metadatarelationlist.extralayout, #placeholder-right .metadatarelationlist.extralayout .tile-content { background: none; padding: 0px; } #placeholder-right .extralayout h3, .metadatarelationlist.extralayout h3, .small-articledisplay.extralayout h3, .small-articlelist.extralayout h3 { color: #e05206; } /* #placeholder-right not added because this rule should work for all placeholders */ .full-articlelist .connection-category-children li, .small-articlelist li { padding-left: 10px; background: url(images/li-arrow.png) left 5px no-repeat; } /* -- Searchinput ---------------------------------------------------------- */ #container .full-searchinput { clear: both; width: 723px; height: 36px; padding: 9px 0px 0px 20px; margin-bottom: 15px; background: #024732; } .full-searchinput input.textinput, .small-searchinput input.textinput { width: 138px; float: left; height: 15px; margin-right: 10px; } .full-searchinput input.textinput { width: 300px; } .full-searchinput input.submit, .full-searchinput span.submit-left, .full-searchinput span.submit-right { margin-top: 0px;} .searchinput-article-searchdescription { color: #fff; font-weight: bold; padding-top: 4px; text-align: right; margin-right: 10px; font-size: 1.2em; } /* --- Customer infomation - change form ---------------------------------------------------------*/ .customer-profile-template .new-contact .toggler-button { margin-top: 20px; } .customer-profile-template .new-contact .toggler-button span.clicker { float: right; } .customer-profile-template .dls-customer-information-container { clear: both; float: left; width: 100%; margin-top: 20px; } .customer-profile-template .customer-information { width: 340px; overflow: hidden; float: left; } .customer-profile-template .customer-information table { margin-top: 10px;} .customer-profile-template .tile-create-alias { float: right; width: 278px; } .customer-profile-template .tile-create-alias-error { color: red; } .customer-profile-template h4 { width: 100%; clear: both; margin: 10px 0px 10px 0px; } .customer-profile-template .tile-create-alias-username { width: 100%; clear: both; } /* --- Login form ---------------------------------------------------------*/ #lightbox-content .login-form { width: 360px; margin: 0px auto; } #lightbox-content .iframe-tile { margin: 0px auto; } .login-form .tile-bottom { clear: both; } #lightbox-content .login-form h3, #container .login-form h3, .login-form .login-form-error { margin-bottom: 10px;} .login-form .login-form-link-container { clear: both; } /*This style is overrides in style-ie.css*/ .login-form .row { margin-bottom: 5px; float: left; clear: both; width: 100%; } .login-form span.input-explanation { margin-left: 130px; } .login-form input.textinput { width: 150px; } .login-form label, #hourmeterexport-timeselector label { font-weight: bold; width: 130px; float: left; } .login-form .radio label { width: auto; margin: 0px 5px 0px 5px; } .login-form .login-form-link-prefix, .login-form .login-form-link { width: auto; margin-right: 15px; padding-top: 10px; float: left; } .login-form .login-status-container { margin-top: 10px; } .login-form .login-status-container li { padding-bottom: 20px;} .login-form .login-status-container .status-loading-text, .login-form .login-status-container .status-loading-img { float: left; margin-right: 10px; } .login-form .login-status-container .status-loading-img { clear: both; } /* --- LIGHTBOX ---------------------------------------------------------*/ /* Because of a Firefox bug (Linux/OS X) causing Flash to become invisible when rendered above a fixed layer with background opacity. This will happen when e.g. displaying an article with Flash content inside the lightbox. To fix this the lightbox javascript will override the background color setting it to a transparent PNG image. Make sure that the image has the same color and opacity as the background styled here. The lightbox.js will by default set opacity to 80% and set background image to: projectroot/html/images/lightbox/ff-overlay-img.png More info: http://www.findmotive.com/2006/10/02/firefox-flash-bug-update/ */ #lightbox-overlay { z-index: 999; background-color: #000; width: 100%; height: 100%; position: absolute; top: 0; left: 0; } #lightbox { width: 100%; height: 100%; padding: 0; margin: 0; position: absolute; top: 0; left: 0; } #lightbox-container { z-index: 1000; position: relative; margin: auto; } #lightbox-spinner { background: url(images/spinner-large.gif) no-repeat center center; } #lightbox-container { padding: 0; top: 25px; } #lightbox-close-container { z-index: 1000; position: absolute; right: 0; } #lightbox-close span { display:none; } #lightbox-close { display: block; width: 30px; height: 30px; margin: 3px 12px 0 0; } #lightbox-start { height: 26px; background: url(images/lightbox/start-center.png) repeat-x; position: relative; margin: 0 51px 0 39px; } #lightbox-start div.left { background: url(images/lightbox/start-left.png) no-repeat; position: absolute; left: -38px; top: 0px; bottom: -6px; width: 38px; } #lightbox-start div.right { z-index: 100; background: url(images/lightbox/start-right.png) no-repeat; position: absolute; right: -50px; top: 0px; bottom: -24px; width: 50px; } #lightbox-outer-content { border: 1px solid #fff; padding: 0 10px 0 10px; background: #fff; position: relative; margin: 0 26px 0 14px; } #lightbox-content { } #lightbox-content-left { background: url(images/lightbox/content-left.png) repeat-y; position: absolute; left: 0px; top: 32px; bottom: 34px; width: 14px; } #lightbox-content-right { background: url(images/lightbox/content-right.png) repeat-y; position: absolute; right: 12px; top: 50px; bottom: 34px; width: 14px; } #lightbox-end { height: 34px; background: url(images/lightbox/end-center.png) repeat-x; position: relative; margin: 0 50px 0 38px; } #lightbox-end div.left { background: url(images/lightbox/end-left.png) no-repeat; position: absolute; left: -38px; top: 0px; bottom: 0px; width: 38px; } #lightbox-end div.right { background: url(images/lightbox/end-right.png) no-repeat; position: absolute; right: -38px; top: 0px; bottom: 0px; width: 38px; } #lightbox .tile-common { border: 0px; } /* --- CONTENT PLACEHOLDER IN LIGHTBOX ------------------------------------- */ #lightbox-placeholder-content, #lightbox-placeholder-content-no-left, #lightbox-placeholder-content-no-right, #lightbox-placeholder-content-no-left-no-right { width: 800px; } #lightbox-placeholder-content .tile-content, #lightbox-placeholder-content-no-left .tile-content, #lightbox-placeholder-content-no-right .tile-content, #lightbox-placeholder-content-no-left-no-right .tile-content { padding: 0; } /* --- Forms - Din Lyse Side (DLS) --- */ table.invoiceListTable { width: 100%; clear: both;} .selfCare2 .pdf-download-info { float: right; clear: both; width: 250px; margin: 0px 0px 5px 0px;} .selfCare2 .pdf-download-info .pdf-icon { float: left; margin-right: 5px;} .selfCare2 .pdf-download-info .pdf-text { margin-top: 2px;} #container .lyseform2 h2, #container .lyseform2 h3, #container .lyseform2 h4 { margin-top: 10px;} .lyseform2 .input input { margin-right: 10px; } .lyseform2 .submit-button, .lyseform2 .action-button, .lyseform2 .submit-reset, .lyseform2 a.link-button, .lyseform2 input.submit { margin-right: 0px; margin-top: 0px; } .lyseform2 span.action-button-right, .lyseform2 span.link-button-right, .lyseform2 span.submit-right { margin-right: 10px; margin-top: 0px; } .lyseform2 span.action-button-left, .lyseform2 span.link-button-left, .lyseform2 span.submit-left { margin-top: 0px; } .lyseform2 .required { color: red; display: inline; } .lyseform2 textarea { height: 75px; width: 400px; } .lyseform2 .reg-info { margin: 10px 0px 10px 0px; } #tile-sc-sr-overview-request_list { float: left; clear: both; margin-top: 10px;} .tile-order-form span.link-button-right { margin-right: 10px; } .lyseform2 table { margin-bottom: 20px; width: 100%;} .lyseform2 table td { padding: 3px 3px 0px 0px;} .lyseform2 table tbody td, .lyseform2 table tr.even td, .lyseform2 table tr.odd td { vertical-align: top; } .meter-history .meter-content table, .MoveOut table, .Elnet table, .Pvr table, .Decoder table, .SmartFamily table, .Inquiry table, .Mobile table, .Construction table, .hundred_percent_renewable_energy table, .electricity_order table, .Alarm table { width: auto; } .lyseform2 .updated_meters { color: green; } .selfCare2 table { margin-bottom: 0px; } .selfCare2 input.meter-input { float: none; } .lyseform2.hundred_percent_renewable_energy table.lyseform2-OrderElectricity-products-price_system tr td, .lyseform2.electricity_order table.lyseform2-OrderElectricity-products-price_system tr td { padding: 6px 5px 6px 5px; vertical-align: top; } .form-tile .tile-order-form-product-info { margin-bottom: 10px; } .form-tile .tile-order-form-product-line-right-nav { margin-top: 10px; } .hundred_percent_renewable_energy .accept, .electricity_order .accept { margin-bottom: 10px; } .SmartFamily input.text { display: block; clear: both; float: left; margin-bottom: 5px;} .lyseform2.Alarm .contact-me label { color: #666; font-size: 1.5em; } .lyseform2.Alarm .contact-me input { margin-top: 3px; } .lyseform2.Alarm .contact-me { margin-bottom: 20px; } .lyseform2.Alarm textarea { width: 300px; height: 50px; } /* meter history */ #container .meter-content h3 { margin-top: 0px; } .meter-history .meter-content { margin-bottom: 20px; overflow: hidden; /*float: left;*/ clear: both; /*width: 100%;*/ } .meter-history .meter-content .button-row { padding-top: 10px; } .meter-history .meter-content .left-content { float: left; } .meter-history .meter-selector .button-row { float: right; } .meter-history .meter-selector span.submit-right { margin-right: 0px; } .meter-history .meter-content .right-content { float: right; overflow: hidden; } .meter-history .meter-articlebanner { padding: 10px 10px 0px 10px; background: #fff; float: left; clear: both; } /* ========================== Mobile phone order pages ========================== */ /* See more styling above in stylesheet */ .tile-article-mobile .phone-image { width: 270px; overflow: hidden; padding: 0px 15px 0px 10px; max-height: 270px; background: #fff; float: left; } .tile-article-mobile .phone-image div { display: none; } .tile-article-mobile .phone-image div.active { display: block; height: 270px; } .tile-article-mobile .phone-image div img { display: block; margin: auto; max-width: 270px; max-height: 270px; } .tile-article-mobile .top_right_column { float: right; width: 295px; width: 320px; } .tile-article-mobile .subscription_chooser { padding: 0px 8px 13px 12px; width: 275px; width: 300px; height: 143px; float: right; } .tile-article-mobile .subscription_chooser div.row { padding: 2px 0px 0px 0px; clear: both; } .tile-article-mobile .subscription_chooser div.row .order_price { padding-top: 6px; width: 170px; height: 20px; float: left; font-weight: bold; } .tile-article-mobile .subscription_chooser div.row .order_price .right { float: right; padding-right: 4px; } .tile-article-mobile .subscription_chooser div.row .order_price .left { float: left; padding-left: 4px; } .tile-article-mobile .subscription_chooser div.row .order_link { float: right; } .order_link .submit-left, .order_link .submit-right, .order_link .submit-button { margin: 0px; } .tile-article-mobile .subscription_chooser p { text-align: right; padding-right: 10px; } .tile-article-mobile .image_selector { float: left; padding: 12px 8px 8px 12px; width: 275px; overflow: hidden; } .tile-article-mobile .image_selector ul { margin: 0px; padding: 0px; } .tile-article-mobile .image_selector ul li { float: left; list-style: none; } .tile-article-mobile .image_selector ul li img { height: 51px; margin-right: 10px; } .tile-article-mobile .page_selector_and_display { margin-top: 30px; } .tile-article-mobile .page_selector { float: left; width: 100%;} .tile-article-mobile .page_selector_and_display { float: left; width: 678px; } .tile-article-mobile .article_display { padding-top: 10px; } .tile-article-mobile .article_display .internal { display: none; } .tile-article-mobile .article_display .internal.active { display: block; } /* ================ Pricelist ================= */ .price-details h2 { width: 200px; } .tile-article-mobile .price-details table { width: 640px; margin-top: 10px; } .price-details table tbody tr.emtpy-header th { height: auto; } .price-details table tr td.col2, .price-details table tr td.col3, .price-details table tr td.col4 { padding-left: 13px; } .price-details table tr td a { font-weight: bold; } table tr td.number { text-align: right; } /* --- Price List Table --- */ /* can be removed after livesetting of new table style?*/ .lyse_price_list_table { color: #494949; border-collapse: collapse; border-spacing: 0px 0px; margin-left: 1px; /*width: 678px;*/ } .price-list-header-background { background: #4B4B4B;/*url('images/pricelist/prisliste_table_header.png') no-repeat top*/; height: 34px; } .price-list-header-grey { background: #d4d4d4; border: 1px solid #e6e6e6; height: 32px; } .price-list-border { border: 1px solid #e6e6e6; padding: 0px 10px; } .price-list-header-background h1 { padding: 8px 10px; font-size: 1.33em; color: #fff; font-weight: bold; float: left; } .price-list-header-background h2 { padding: 8px 10px; /*width: 450px;*/ margin-top: 0px; color: #fff; font-weight: bold; float: left; } .price-list-td { padding: 8px 10px; width: 200px; } .price-list-td-left { padding: 8px 10px; width: 210px; border-left: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; } .price-list-td-middle { padding: 8px 10px; width: 118px; border-bottom: 1px solid #e6e6e6; } .price-list-td-right { padding: 8px 10px; width: 118px; border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; } .lyse_price_list_table h3 { font-weight: bold; } .lyse_price_list_table strong { font-weight: bold; } .lyse_price_list_table .pricetable_row_content { border: 1px solid #e6e6e6; } .vertical-align-top { vertical-align: top; } /* Prices rates, html import from altibox */ .prices-rates table td { text-align: center; } .prices-rates .priceplan-table-row-odd th, .prices-rates .priceplan-table-row-even th { color: #000; text-align: left;} .prices-rates .priceplan-table-row-odd th, .prices-rates .priceplan-table-row-even th { color: #000; text-align: left;} /* Error container, caused by print_error */ #container.error-container { min-width: 500px; width: 500px; margin-top: 40px; padding: 20px; } #container.error-container #placeholder-top { display: none; } #container.error-container .logo { float: left; margin-right: 40px; } #container.error-container .error-content { float: left; width: 350px; } /* ========== Configurator Selfcare2 ======*/ .selfCare2 .tile-config-tree ul { display: block; margin-left: 20px; list-style-type: disc; } .selfCare2 .tile-config-tree ul li ul { padding-top: 5px; } .selfCare2 .tile-config-tree ul li table, .selfCare2 .tile-config-tree ul li ul { display: none; } .selfCare2 .tile-config-tree ul li img { border: 0px; height: 12px; } /* ========== Export for hour based meters ======*/ #container table.hourmeterexport tr .checkbox { width: 20px; } #container table.hourmeterexport tr .street { width: 400px ;} #container table.common-table-style.hourmeterexport label, #hourmeterexport-formatselector label { cursor: hand; cursor: pointer; } #hourmeterexport-timeselector, #hourmeterexport-meterselector, #hourmeterexport-formatselector { clear: both; margin-bottom: 20px; } #hourmeterexport-timeselector .row.first { margin-bottom: 5px; float: left; width: 33%; } #hourmeterexport-timeselector .row.last { margin-bottom: 5px; float: right; width: 67%; } #hourmeterexport-formatselector .row { margin-bottom: 5px; clear: both; height: 20px; } #hourmeterexport-timeselector .row label { width: 90px; } #hourmeterexport-status { font-weight: bold; } #hourmeterexport-status, #hourmeterexport-status2 { float: right; height: 23px; vertical-align: middle; margin-top: 15px; margin-right: 20px; } #hourmeterexport-status img, #hourmeterexport-status2 img { float: left; border: 0; margin-right: 5px; } #hourmeterexport-buttons, #hourmeterexport-buttons2 { float: right; } /*#hourmeterexport-meterselector .tablescroll { height:300px; overflow:auto; }*/