/** * @site Moed site * @media screen * @revision $Revision: 1.2 $ * @styleguide: * colors { * white: #fff; * black: #000; * orange: #f60; * blue: #003384; * } * fonts { * logo: Eurostile Bold; * headers: Arial, Helvetica, sans-serif; * text: Arial, Helvetica, sans-serif; * } */ /** * 'baseline' style sheet: resets browser styles * Don't forget to set a foreground and background color on the 'html' or 'body' element! */ body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, caption, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; line-height: inherit; font-family: Verdana; text-align: left; vertical-align: baseline; } a img, :link img, :visited img { border: 0; } table { border-collapse: collapse; border-spacing: 0; border: 1px solid black;} table td { border: 1px solid black; } p { margin-bottom:1em; } ol, ul { list-style: none; } q:before, q:after, blockquote:before, blockquote:after { content: ""; } a:focus, a:hover, a:active { outline: none; } #content .contenttext ul { margin-left:2em; list-style-type:disc; color:black;} #content .contenttext ul li { } #content .contenttext ol { margin-left:2.5em; list-style-type:decimal; } /** * Default style for content */ /* links */ #content a {color: #000; } #content a:visited { } #content a:active { } #content a:hover { text-decoration:underline; } /* headers */ #content h1, #content h2, #content h3, #content h4, #content h5, #content h6 { margin-bottom: 2px; color: #003384; font-weight: bold; } #content h1 { font-size: 1.2em; } #content h2 { font-size: 1.1em; } /* this is needed for positioning elements inside the header */ #content h1 { position: relative; padding-right: 20px; background-color: transparent; background-repeat: no-repeat; background-position: left top; text-indent: -9000px; } /* forms and input */ #content input, #content select, #content textarea {border: 1px solid #c0c4c7; color:black; padding: .1em 0; font: inherit 1em Arial, Helvetica, sans-serif; width:100%; margin-bottom:10px;} #content input:focus, #content textarea:focus { border-style: inset; } #content input[disabled], #content select[disabled], #content textarea[disabled] { cursor: default; background-color: #e8e8e8; } #content fieldset { border: 1px solid #003384; padding: 0 1em 1em 1em; } #content fieldset legend { margin: 0 0 .5em .4em; padding: .1em .7em; color: white; font-weight: bold; background-color: #003384; } #content label { cursor: pointer; } #content label:hover {} /* minimum height for iframes */ #content iframe { min-height: 35em; } /* more: paragraph with a "read more" link */ #content .more { clear: both; margin: 0.5em 0em; } #content .more a {text-decoration:none !important; font-weight:bold; background-repeat:no-repeat; background-position:0 5px; padding-left:10px; } #content .more a:hover { background-image: url(/assets/demo1/images/default/arrow_right_over.gif); } #content a.feed { position: absolute; top: 0; right: 0; border: 0; padding: 0; } #content a.permalink { clear: both; padding-left: 20px; background: url(/assets/demo1/images/default/i_permalink.gif) left center no-repeat; } #content .date { margin: 0; color: #999; } /* button: transforms a normal button to a styled button */ #content input[type='submit'] { width: auto; border:none; background-color:none; cursor: pointer; padding: 2px 1.5em; font-weight: bold; color: #003384; background-color:inherit; text-aling:right; } #content input[type='submit']:active { border-style: inset; } .subsite #content .first { width:55%; float:left; } .subsite #content .second { float:right; width:230px; } .subsite #content .second .banner { display:block;} #content input.button { border:0 none; color:white; cursor:pointer; font-weight:bold; padding:0.3em 1em; width:auto; text-align:right; background-repeat: no-repeat; background-position:5px 50%; } #content input.button:hover { text-decoration:underline; } /** * Page layout */ html { font: normal .7em/1.6 Arial, Helvetica, sans-serif; color: black; background-color: white; } #body { min-width: 960px; background: transparent url(/assets/moed/images/default/bg_shadow.gif) repeat-y center top; } #container { position: relative; margin: 0 auto; padding: 18px 7px 0 7px; width: 942px; background: transparent url(/assets/moed/images/default/bg_top.gif) no-repeat left top; } #content { float: right; margin: 0; padding:310px 295px 16px 0; width: 422px; min-height:550px; } .subsite #content { padding:310px 295px 16px 0; width:630px; } .contentcolumn { float: left; margin: 0; } .subsite #content .first { width:55%; float:left; } .subsite #content .second { float:right; width:235px;} .subsite #content .second .banner { } .contentcolumn { float: left; margin: 0; width: 423px; } .sidecolumn { float: right; margin: 0; width: 250px; } .file #content div { padding:25px 0 25px; width:401px; text-align:center; background: transparent url(/assets/moed/images/default/bg_mediaplayer.jpg) no-repeat left bottom; padding-bottom:25px;} #header { position: absolute; top: 0; left: 7px; height: 290px; width: 942px; } #header h2 { position: absolute; top: 20px; left: 14px; width: 248px; height: 73px; background: transparent url(/assets/moed/images/default/logo.jpg) no-repeat left top; } #header h2 a { display: block; height: 100%; text-decoration: none; } #header h2 a span { visibility: hidden; } #header #slogan { position: absolute; top: 58px; left: 270px; width: 342px; height: 20px; background: transparent url(/assets/moed/images/default/slogan.gif) no-repeat left top; } #header #slogan span { visibility: hidden; } #header .headerlink { position: absolute; top: 40px; left: 645px; } #header .headerlink h3 { background-color: transparent; background-repeat: no-repeat; background-position: left top; } #header .headerlink h3 a { display: block; width: 100%; height: 100%; text-decoration: none; } #header .headerlink h3 a span { visibility: hidden; } #header .headerlink p { margin-top: 4px; padding-left: 15px; background-color: transparent; background-repeat: no-repeat; background-position: 0 10px; } #header .headerlink p a { display: block; border-bottom: 1px solid black; padding-bottom:1px; background-color: transparent; background-repeat: no-repeat; background-position: left top; text-decoration: none; } #header .headerlink p a:hover { } #header .headerlink p a span { visibility: hidden; } #header #headervisual { position: absolute; top: 106px; left: 16px; width: 911px; height: 184px; background-color: transparent; background-repeat: no-repeat; background-position: left top; } #header #subsitetitle { position: absolute; bottom: 0; right: 32px; padding-left: 6px; background: transparent url(/assets/moed/images/default/tab_left_white.gif) no-repeat left top; } #header #subsitetitle-inner { padding: 3px 12px 0 6px; background: transparent url(/assets/moed/images/default/tab_right_white.gif) no-repeat right top; } #header #subsitetitle h4 { text-indent: -9000px; background-color: transparent; background-repeat: no-repeat; background-position: left top; } #homenav { margin-top:10px; list-style-type: none !important; margin:0 !important; } #homenav li {margin-top:10px; clear:both;} #homenav li div.small { width:240px; } #homenav li a {color:black; font-size:1.3em; font-weight:bold; text-decoration:none !important; } #homenav li a:hover { text-decoration:underline; } #homenav li img { margin:0 0.3em 0.5em 0.5em; float:right;} #homenav li p.more { margin:.5em 0 2em; padding-left:0; } #homenav li p.more a { font-size:1em; padding-left:15px; padding-top:.2em; } #mainnav { float: left; margin: 0 0 1em 0; padding: 290px 0 0 16px; width: 194px; } #mainnav .banner { margin:10px 0 10px; } #mainnav ul { width: 100%; } #mainnav li { width: 100%; } #mainnav li.bannermainnav { margin-top:30px; } #mainnav li .roundedbox { width: 100%; } #mainnav li:hover .roundedbox, #mainnav li.selected .roundedbox { background-color: #e3e3e3; } #mainnav li a { color:black; font-size:1.3em; font-weight:bold; display: block; text-decoration: none; background-color: transparent; background-position: left top; background-repeat: no-repeat; } #mainnav li a span { visibility: hidden; } #mainnav li ul li a { font-size:0.95em; font-weight:normal; } .subnav { } .subnav li { margin-top: .1em; } .subnav li a { color: black; padding-bottom:0px !important; padding-left: 15px; margin: .5em 0; background: transparent url(/assets/moed/images/default/bullet_red_greybg.gif) no-repeat 0 .3em !important; } .subnav li a span { display:block; line-height:1.3em; visibility: visible !important; } .subnav li a:hover { text-decoration: underline !important; } #aside { position: absolute; right: 0; top: 317px; width: 255px; margin: 1em 20px; padding: 0 0 .3em 1em; } #aside a { border: 0; } #aside img#pagevisual { margin-bottom: 3em;} #aside img { margin-bottom: 0.5em; } #aside object { margin-bottom: 6em; } #aside .banner { text-align: right; margin-right:5px;} #breadcrumbs { position: absolute; top: 300px; left: 230px; right: 7px; height: 20px; } #breadcrumbs h2 { display: none; } #breadcrumbs ul { } #breadcrumbs ul li { display: inline; font-size: .9em; color: black; margin-right:5px; } #breadcrumbs li a { font-weight: bold; color: black; text-decoration: none; background:url(/assets/moed/images/default/breadcrumb_arrow.gif) no-repeat right 3px; padding-right:10px; } #breadcrumbs li a:hover { text-decoration: underline; } #globalnav-outer { position: absolute; top: 0; right: 7px; margin: 0; padding: 0 0 0 16px; height: 41px; background: #d21602 url(/assets/moed/images/default/bg_globalnav_left.png) no-repeat left top; } #globalnav { float: left; padding: 0 20px 0 4px; height: 100%; background: transparent url(/assets/moed/images/default/bg_globalnav_right.png) no-repeat right top; } #globalnav h2 { display: none; } #globalnav ul { float: left; margin: 9px 0 0 0; } #globalnav ul li { float: left; margin: 0 1em 0 0; padding: 0 1em 0 0; border-right: 1px solid white; line-height: 1; } #globalnav ul li a { display: block; text-decoration: none; color: white; } #globalnav ul li a:hover { text-decoration: underline; } #quicksearch { float: left; margin: 6px 4px 4px 0; background: none; } #quicksearch h3 { float: left; color: white; margin: 0 0.5em 0 0; } #quicksearch h3 label { font-weight: normal !important; } #quicksearch h3 label:hover { color: white; cursor: pointer; text-decoration: underline; } #quicksearch input { float: left; clear: none; margin: 0; padding: 0 20px 0 0; border: 1px solid #d6d8de; height: 17px; } #quicksearch input.submit { color: white; cursor: pointer; font-size: 0; margin: 1px 0 0 -19px; border: 0; width: 18px; height: 17px; background: white url(/assets/moed/images/default/button_search.gif) no-repeat center center; } #footer-container { clear: both; background: transparent url(/assets/moed/images/default/bg_shadow.gif) repeat-y center top; } #footer { background: transparent url(/assets/moed/images/default/bg_ladybug.gif) no-repeat 50% 40px; } #footer-content { position: relative; margin: 0 auto; padding: 0 7px 100px 8px; width: 943px; background: transparent url(/assets/moed/images/default/bg_bottom.gif) no-repeat 2px 100%; } #footer-info { position:absolute; right:25px; bottom:28px; font-weight:bold;} #footerzone-1 { float:left; margin-bottom:10px; position: relative; padding: 16px 0 16px 16px; width: 926px; background: #dbdbdb url(/assets/moed/images/default/bg_footer.gif) no-repeat left bottom; } #footerzone-1 .banner { margin-bottom: 1em; } #footerzone-1 .footer-section { position: relative; float: left; margin-bottom: 1em; width: 276px; } #footerzone-1 .footer-section h2 { font-size: 1.2em; font-weight: bold; color: #d21602; padding-right: 20px; margin-bottom:10px; } #footerzone-1 .footer-section h2 a { display:block; color: #d21602; text-decoration: none; border-bottom:1px solid #dbdbdb; background-repeat: no-repeat; } #footerzone-1 .footer-section h2 a:hover { text-decoration: none; border-bottom:1px solid; } #footerzone-1 .footer-section h2 a span { visibility:hidden } #footerzone-1 .footer-section h2 a.feed { border:none; position: absolute; top: 0; right: 0; } #footerzone-1 .footer-section ul { } #footerzone-1 .footer-section ul li { } #footerzone-1 .footer-section ul li a { display: block; color: black; font-weight: bold; text-decoration: none; padding: 0 0 0 15px; background: transparent url(/assets/moed/images/default/bullet_grey_greybg.gif) no-repeat 0 6px; } #footerzone-1 .footer-section ul li a:hover { color: #d21602; text-decoration: underline; background-image: url(/assets/moed/images/default/bullet_red_greybg.gif); } #footerzone-1 .footer-section ul li img { float: right; margin: -1.2em 5px 2px 5px; padding: 0; border: 0; } #footerzone-1 .footer-section ul li.rich-item { margin-bottom: .5em; } #footerzone-1 .footer-section ul li.rich-item a { background-image: url(/assets/moed/images/default/bullet_red_greybg.gif); } #footerzone-1 .footer-section ul li.rich-item a:hover { color: black; text-decoration: underline; } #footerzone-1 .footer-section ul li.rich-item h3 a { font-size:1.2em; display: block; color: black; font-weight: bold; text-decoration: none !important; padding: 0; background: none !important; } #footerzone-1 .footer-section ul li.rich-item p { width: 75%;} #footer-column1, #footer-column2, #footer-column3 { float: left; width: 276px; min-height: 10px; margin-right: 32px; } .subscribe-button { width:160px; } .subscribe-button a { color: white; font-size: 1.3em; font-weight: bold; text-decoration: none; border-bottom: 1px solid #d21602; } .subscribe-button a:hover { border-bottom-color: white; } #footerzone-2 { margin: 16px 16px 0 16px; } #footerzone-2 .footer-section { position: relative; float: left; margin-right: 32px; width: 195px; } #footerzone-2 .footer-section h2 { font-size: 1.3em; font-weight: bold; color: #d21602; padding-right: 20px; margin-bottom:10px;} #footerzone-2 .footer-section h2 a { display:block; color: #d21602; text-decoration: none; border-bottom:1px solid #ffffff; background-repeat: no-repeat; } #footerzone-2 .footer-section h2 a:hover { border-bottom:1px solid; text-decoration: none; } #footerzone-2 .footer-section h2 a span { visibility:hidden } #footerzone-2 .footer-section h2 a.feed { border:none; position: absolute; top: 0; right: 0; } #footerzone-2 .footer-section ul { } #footerzone-2 .footer-section ul li { } #footerzone-2 .footer-section ul li a { display: block; color: black; text-decoration: none; padding: 0 0 0 15px; background: transparent url(/assets/moed/images/default/bullet_black_whitebg.gif) no-repeat 0 6px; } #footerzone-2 .footer-section ul li a:hover { color: #d21602; text-decoration: underline; background-image: url(/assets/moed/images/default/bullet_red_whitebg.gif); } #props { margin: 0 auto 0 auto; padding-bottom: 2em; width: 942px; text-align: right; } #props a { color: #ababab; text-decoration: none; } #props a:hover { text-decoration: underline; } #ladybug { position: absolute; top: 230px; right: -17px; width: 63px; height: 63px; background: transparent url(/assets/moed/images/default/ladybug.png) no-repeat left top; } /* portal */ .subsite-portal #content { float: left; padding: 290px 3px 16px 16px; width: 924px; min-height: 0; } .subsite-portal #content .content-block { float: left; background: transparent url(/assets/moed/images/default/bg_content_portal.gif) repeat-y left top; } .subsite-portal #content .first-column { float: left; margin-right: 10px; width: 310px; } .subsite-portal #content .second-column { float: left; margin-right: 45px; width: 280px; } .subsite-portal #content .third-column { float: right; width: 260px; } #mainnav-portal { float: left; margin: 4em 0 2em 0; width: 100%; } #mainnav-portal ul { } #mainnav-portal ul li { float: left; margin-right: 12px; width: 120px; } #mainnav-portal ul li .roundedbox-left-bottom { padding: 0; } #mainnav-portal ul li img { display: block; position: relative; top: -2px; } #mainnav-portal ul li span { display: block; color: white; font-weight: bold; padding: 0 5px 2px 20px;} #mainnav-portal ul li a:hover span { text-decoration: underline; } .inline-sections-portal .inline-section h2 { margin-bottom: 1.5em !important; } .inline-sections-portal .inline-section h2 a { background-color: transparent; background-repeat: no-repeat; background-position: left top; } .inline-sections-portal .inline-section ul { margin:0; } .inline-sections-portal .inline-section ul li h3 a { background-position:left 7px; padding-left:15px; } .iframe #mainnav, .iframe #aside { display: none; } .iframe #breadcrumbs { left: 23px; } .iframe #content { float: left; padding: 310px 0 16px 16px; width: 911px; } /** * Content types */ /* rounded box */ /* delete float left here */ .roundedbox { clear: both; } .roundedbox-left-top { background: transparent url(/assets/moed/images/default/corner_left_top_white.gif) no-repeat left top; } .roundedbox-right-top { background: transparent url(/assets/moed/images/default/corner_right_top_white.gif) no-repeat right top; } .roundedbox-right-bottom { background: transparent url(/assets/moed/images/default/corner_right_bottom_white.gif) no-repeat right bottom; } .roundedbox-left-bottom { padding: 3px 12px; background: transparent url(/assets/moed/images/default/corner_left_bottom_white.gif) no-repeat left bottom; } .roundedbox span { } .redfg { background-color: #d21602; } .redfg:hover, .subscribe-button a:hover { background-color: #000000;} .greyfg { background-color: #e3e3e3 } .greybg .roundedbox-left-top { background-image: url(/assets/moed/images/default/corner_left_top_grey.gif); } .greybg .roundedbox-right-top { background-image: url(/assets/moed/images/default/corner_right_top_grey.gif); } .greybg .roundedbox-right-bottom { background-image: url(/assets/moed/images/default/corner_right_bottom_grey.gif); } .greybg .roundedbox-left-bottom { background-image: url(/assets/moed/images/default/corner_left_bottom_grey.gif); } /* inline sections on the homepage */ .inline-sections { margin-right: 2%;} .inline-sections .inline-section { } #content .inline-section h2 { height:15px; background-repeat:no-repeat; position: relative; margin-bottom:0.2em; } .inline-section a.link_to { text-decoration:none !important; margin-left: 10px; font-weight: bold; } .subsite-portal .inline-section a.link_to { margin-left: 0; } .inline-section a.link_to:hover { text-decoration:underline !important; } .inline-section h2 a { border: 0; display:block; text-decoration:none !important; } .inline-section h2 span { visibility:hidden;} .inline-section h2 a span { visibility:hidden;} #content .inline-section h2 a:hover { text-decoration:none; } .inline-section h2 a.feed { position: absolute; top: 0; right: 0; } .inline-section ul { margin: 0.5em 0 1em 1em; padding: 0; list-style-type: none; } #content .inline-section ul li h3 { margin-bottom:.1em; font-weight:normal; } .inline-section ul li h3 a { display:block; background-position:left 0.5em; background-repeat:no-repeat; padding-left:20px; text-decoration:none !important; } #visuals a { margin-right:10px; } /* chapters in documents */ #chapters { clear: both; } #chapters .contenttext { margin-bottom:3em;} #chapters ul.chapters { margin: 0; padding:0; list-style-type: none; } #chapters li.chapter { padding:0; } #chapters li.chapter a { display:block; padding-left: 15px; background-position:0; background-repeat:no-repeat;} #chapters li a:hover { } #chapters .imgbox { overflow: hidden; } li.chapter { margin: .2em 0 0em 0; } #chapters .contenttext h2.chapter { color:black; font-size:1.5em; font-weight:bold; margin-bottom:0em; } #chapters .contenttext { position:relative; } #chapters .contenttext .img { position:absolute; top:0; right:0;} #chapters .contenttext .visual p { width:70%; } /* default and rich menu */ .menu-default { clear: both; margin: 0; padding: .5em .5em; list-style-type: none; } .menu-default li { margin:.2em 0; } #content .menu-default li a { padding-left: 15px; background-repeat:no-repeat; background-position:0 5px; display:block; text-decoration:none !important;} #content .menu-default li a:hover { text-decoration: underline !important; } ul.menu-rich { clear: both; margin: 0 !important; padding: 0; list-style-type: none !important; } .menu-rich li { padding: 0; width: 195px; height: 130px; margin: 1em 0 3em 0; text-align: right; } .menu-rich li.menu0 { float:left; } .menu-rich li.menu1 { float:right; } .menu-rich li img { margin: -2px 0 0 0; } .menu-rich li a { border: 0; display:block; padding:0; margin:0; text-decoration:none !important;} .menu-rich span { display:block; margin: 0 0 0 1em; } .menu-rich span span { visibility:hidden; } .menu-rich a:hover span { } .menu-rich li .roundedbox.menu_visual_background .roundedbox-left-bottom { height:120px } .roundedbox.menu_visual_background .roundedbox-left-bottom { padding:0; padding:0 0 0.5em; } /* Default and rich lists */ .list-default { clear: both; margin: 0; padding: 0; list-style-type: none; } #content .list-default li a { display:block; padding-left: 16px; background: url(/assets/demo1/images/default/arrow_right.gif) left 5px no-repeat; text-decoration: none; } #content .list-default li a span { margin-right:5px; color:black;} .list-default li a:hover { background-image: url(/assets/demo1/images/default/arrow_right_over.gif); text-decoration: underline !important; } .list-rich { clear: both; margin: 0; padding: 0; list-style-type: none; } .list-rich li { position:relative; min-height: 150px; margin-bottom: 2em; padding:0; } #content .list-rich li h2 { padding: 0; margin:0;} .list-rich li h2 a { text-decoration: none; border: 0; font-size: 1.2em;} .list-rich li img { margin: 0 .3em .5em .5em; position:absolute; right:0; top:5px; } .list-rich li p { margin-top:0; } .list-rich li p.small { width:300px; } .list-download { width:100%; clear: both; margin: 0; padding: 0; list-style-type: none; } .list-download li { float:left; width: 190px; height: 140px; margin: 1em .9em 3em 0; text-align: right; } .list-download li img { display: block; margin: 0; } .list-download li a { text-decoration:none !important; border: 0; display:block; padding:0; margin:0;} .list-download li a:hover { text-decoration:none !important; } .list-download a span { color:white; font-size:1.2em; font-weight:bold; display:block; padding-left: 1.5em; background-repeat:no-repeat; background-position:10px 8px;} .list-download li .roundedbox-left-bottom { padding: 0; } /* default and rich group */ dl.group { clear: both; } dl.group dt { margin: 1em 0 .5em 0; } dl.group dt a { font-weight: bold; font-size:1.5em; } dl.group dd { margin-left: .3em; } #content dl.group dd a { padding-left: 15px; background-position:0; background-repeat:no-repeat;} .group_rich { clear: both; } .group_rich dt { height:100%; clear: both; font-weight:bold; font-size:1.5em; } .group_rich dt .menu_title { } #content .group_rich dt a { text-decoration:none; color:white; border: 0; font-weight:bold;} .group_rich h2 { margin-bottom: .2em; } .group_rich dd { position:relative; min-height: 150px; margin:10px 0 0 0; padding:0; } .group_rich dd a { font-size:1.4em; font-weight:bold;} .group_rich dd p.more a { font-size:1em; font-weight:bold;} .group_rich dd p { width:270px; } .group_rich img { margin: 0; position: absolute; right:0; top:0; vertical-align: top; margin: .2em 0 1em 1em; padding: 5px; } /* basicform styles form elements, marked up in a definition list */ .basicform dl input, .basicform dl textarea, .basicform dl select { width: 100%; color: #003384; } .radio, .radio:hover, .checkbox, .checkbox:hover { width: auto !important; border: 0 !important; } .basicform dl dt { clear: both; width: 40%; float: left; color: #003384; } .basicform dl dd { width: 60%; float: left; margin: 0 0 1em 0; color: #003384; } .errors { font-style: italic; color: red; } .header { margin: 1em 0; } .header.formpage { display: block; width: auto; float: none; border-bottom: 1px solid #003384; } .header.formpage+dd { display: none; } .basicform .element.top { height:10px;} .basicform .element.top .input { height:10px;} .basicform .notice {background-color:transparent; color:white; display:inline-block; margin-left:1em; position:relative; top:-35px;} .basicform .input { background-color:#efefef; float:right; padding:0.2em 10px; width:256px; border-left:4px solid white;} .basicform .element { clear:both; margin:0; overflow:hidden; padding:0; background-color:#e3e3e3;} .basicform .label {background-color:#e3e3e3; float:left; padding:0.2em 10px 1.3em 10px; width:122px; } .basicform .element .group {float:right; width:255px; background-color:#efefef; padding:0.5em 10px; border-left:4px solid white;} .basicform .submit { text-align:right;} .basicform .element.header { font-weight:bold; } .basicform .element .label label { } .basicform .input.datecal { } #content .basicform .input.datecal input.hasDatepicker { width:80%; } .basicform .input.datecal img { float:right } .ui-datepicker-trigger { margin-top:3px; } .ui-datepicker-calendar { background-color:#efefef; width:200px;} .hasDatepicker { float:left; widht:40%; } .basicform .submit input { margin:0; background-color: transparent; } /* sitemap */ ul.sitemap { margin:1em 0 0 0; padding: 0em; list-style-type: none; } ul.sitemap ul { margin: 0 1em 0em 1em; padding: 0; list-style-type: none; } ul.sitemap li {font-weight:bold; } ul.sitemap li a { font-size:1.5em; text-decoration:none !important; } ul.sitemap li a:hover { text-decoration:underline !important; } ul.sitemap li ul li { padding-left: 15px; background: url(/assets/moed/images/default/bullet_black_whitebg.gif) 0 5px no-repeat; } ul.sitemap li ul li a { font-size:1em; } ul.sitemap li ul li ul li { margin-left: 1.5em; font-weight:normal; background: url(/assets/moed/images/default/bullet_small_black_whitebg.gif) 0 5px no-repeat;} ul.sitemap li ul li ul li a { font-size:1em; } ul.sitemap li ul li ul li a:hover { } /* search styles: form, info and results */ #resultsinfo { padding-bottom: .2em; height:15px; width:100%; } #resultsinfo h2 { float: right; font-size: 0.1em; visibility:hidden; display:none } #resultsinfo p { float: left; margin: 0; } #resultsinfo h2, #resultsinfo p { margin:0; padding:0; } #resultsinfo p { } #searchform { margin: .3em 0 1em; padding-bottom: 1em; } #searchform label { float: left; } #searchform div { float: left; margin: 0 0 .7em .1em; height:20px; } #searchform div label { margin-top:.3em; display: block; clear: both; } #searchform div label span { visibility:hidden; } #searchform div input { width:275px; float: left; clear: none; margin-left: 15px; padding: 0 0 0 0.5em; border: 1px solid #d6d8de; height: 17px; } #searchform div input.button { color: white; cursor: pointer; font-size: 0; margin: 1px 0 0 -19px; border: 0; width: 18px; height: 17px; background: white url(/assets/moed/images/default/button_search.gif) no-repeat center center; } #searchform div p { margin: 0 0 .5em 0; } #searchresults { clear: both; margin: 1.5em 0 2em 0; } #searchresults dt { margin: 2em 0 .6em 0; font-weight:bold; } #searchresults dt a { margin-left:10px; } #searchresults dd { margin: .3em 0 0 1.4em; } #searchresults dd a { font-weight:bold; } #searchresults .highlight { background-color: #e8e8e8; } /** * Common objects */ /* text block on pages */ .contenttext { margin-bottom: 1em; } /* page visual box */ #pagevisual-box { float:right; text-align: right; overflow: hidden; margin-bottom:25px; } #pagevisual { } /* imgbox */ .imgbox {} .imgbox img { display: block; } .imgbox p { padding: .3em; font: bold .8em/1.2 Arial, Helvetica, sans-serif; color: #003384; background-color: #e8e8e8; } /* linkbox */ .linkbox { clear: both; margin:0; padding: 0px; } .linkbox li { margin: 0.3em 0 0.3em; padding: 0; overflow: hidden; } .linkbox li:hover { background-color: transparent; } #content .linkbox li a { padding-left: 15px; text-decoration: none; background-repeat:no-repeat; background-position:0; } #content .linkbox li a:hover { text-decoration:underline; } .linkbox_margin { margin-top:10px; } #aside .linkbox_container { margin-bottom:10px; } #aside .linkbox_title {display:block; background-repeat:no-repeat; height:23px; margin:0; padding:0; } #aside .linkbox li { width:255px; list-style-type: none; margin-left:10px; } #aside .linkbox li a { display:block; line-height:1.2em; text-decoration:none; color:black; padding-left:15px; background-repeat:no-repeat; background-position:0;} #aside .linkbox li a:hover { text-decoration:underline;} #aside h5 { display:block; margin:2px 0;} #aside h5 span { visibility: hidden; } /* progress bar */ .progress { text-align: right; font-weight: bold; width: 100%; } .progresstext { color: #003384; font-weight: bold; } .progressbar { width: 92%; height: .7em; margin: 0 0 1em 0; border: 1px solid #f60; border-left-width: 5px; background-color: white; } #progressfill { height: 100%; background-color: #f60; } /* navbox, for displaying next/previous/index links */ .navbox { padding: .3em .2em; text-align: center; } .navbox a { border: 0; } .navbox .prev { float: left; } .navbox .next { float: right; } .navbox .index { text-align: center; } .navbox .page { margin: 0 .2em; } .navbox .page a { font-size:2em; padding: 2px 6px; } .navbox span { font-size:1em; font-weight:bold; } .navbox .pages { padding-left: .5em; text-align:center; } .navbox .pages a { font-weight:bold;} .listnav { width: 410px; } .listnav p { margin: 0; } /* forum list */ .forum, .topic, .pollarchive { width: 97%; margin: 0 0 2em 0; border: 1px solid #e8e8e8; } .forum thead th, .topic thead th, .pollarchive thead th { margin-bottom: .2em; color: #003384; background-color: #e8e8e8; } .forum tbody th, .forum tbody td, .pollarchive tbody th, .pollarchive tbody td { border-right: 1px solid #e8e8e8; } .forum tr, .topic tr, .pollarchive tr { border-bottom: 1px solid #e8e8e8; } .forum td, .forum th, .topic td, .topic th, .pollarchive td, .pollarchive th { vertical-align: top; padding: .3em; } .forum img, .topic img { vertical-align: top; } .forum p, .pollarchive p { margin-top: 0; } .forum a, .pollarchive a { font-weight: bold; color: #f60; border-color: #f60; } .post { } .post th { border-right: 1px solid #e8e8e8; } .author { } .postform { } .postform .basicform dt, .postform .basicform dd { float: none; width: auto; } .postform .basicform dt { font-weight: bold; margin-top: .5em; padding: .1em .3em; } .postform .basicform dd { margin: 0 0 1em 0; padding: 0; } .postform .basicform textarea { width: 100%; } .postform .basicform input.submit { width: auto; } .basicform .element.submit { background: no-repeat url(/assets/moed/images/default/bg_green_form.png); } td.first .date { color: #aaa; } /* special icons for announcements, sticky topics and locked topics */ td.announcement, td.sticky, td.locked, td.default { padding-left: 20px; background-position: 0 5px; background-repeat: no-repeat; } td.announcement { background-image: url(/assets/demo1/images/default/i_announce.gif); } td.sticky { background-image: url(/assets/demo1/images/default/i_sticky.gif); } td.locked { background-image: url(/assets/demo1/images/default/i_locked.gif); } .announcement { font-weight: bold; } .locked, .locked a { color: #afafaf; border-color: #afafaf; background-color: #e8e8e8; } .pollresults { width: 100%; } .pollresults tr { } .pollresults td { text-align: right; } .pollresults td span { float: left; } .pollresults dt, .pollresults dd { margin: .3em 0 0 0; padding: 0; float: left; } .pollresults dt { clear: both; width: 20%; } .pollresults dd { width: 20%; } .pollresult { width: 55% !important; background-color: #e8e8e8; } .pollresult div { border: 2px solid #003384; background-color: #ffdfca; } .pollresults, #pollform { margin-bottom: 2em; } /* jargon */ a#translate { display: block; margin-bottom: 1em; padding: .5em; background: url(/assets/demo1/images/default/b_nicetitle_bottom.gif) right bottom no-repeat white; } .jargonterm { cursor: help; font-weight: bold; border-bottom: dotted 1px #003384; } div.nicetitle { position: absolute; padding-top: 4px; top: 0px; left: 0px; border: 1px solid #e8e8e8; border-width: 1px 0 0 1px; color: #003384; background: url(/assets/demo1/images/default/b_nicetitle_bottom.gif) right bottom no-repeat #efefef; } div.nicetitle p { margin: 4px; padding: 4px; } .overlay { position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; opacity: 0.2; background-color: #ffdfca; } .translation-status { position: absolute; width: 300px; height: 30px; top: 0; right: 1em; border: 2px solid white; padding: 1em; background-color: #ffdfca; } .close { position: absolute; top: 0; right: 0; color: red; font-weight: bold; background-color: white; } /* ecard styles */ #ecardlist { list-style: none; margin: 0; padding: 0; } #ecardlist li { float: left; margin: 1em; width: 150px; } #ecardform .header { font-weight: bold; margin: 1em 0; } .ecardview img { margin-bottom: 1em; } .ecardview h2, .ecardview p { padding: 0; margin: 0; } .ecardview p.message { margin: 0 0 1em 15px; } .ecardview .links a { font-weight: bold; padding-left: 15px; background: transparent url(/assets/demo1/images/default/arrow_right.gif) no-repeat left center; } .ecardview .links a:hover { background-image: url(/assets/demo1/images/default/arrow_right_over.gif); } /* slideshow */ .slideshow-title { text-align: center; } #slideshow-progress { margin-top: -2em; text-align: right; border-bottom: 1px solid #003384; color: #afafaf; } #slide { text-align: center; height: 300px; padding: 1em 0; } #slide.imgbox { float: none; margin: 0 auto; width: 100%; text-align: center; } #slide.imgbox a, #slide.imgbox a:hover { border-bottom: 0; } #slide.imgbox img { display: inline; } #nav-slideshow { clear: both; border-top: 2px solid #003384; margin-top: 1em; padding: .5em; text-align: center; background-color: #e8e8e8; } #nav-slideshow a { border-bottom: 0px; } /* feed */ ul.feed { margin: 0; padding: 0; list-style-type: none; } ul.feed li { margin-bottom: 2em; border-bottom: 1px solid #e8e8e8; } .feed-contents .summary { margin-bottom: 2em; font-style: italic; color: #aaa; } /* slimbox */ #lbOverlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #e3e3e3 ; cursor: pointer; z-index: 9999; } #lbTopContainer, #lbCenter, #lbBottomContainer { position: absolute; overflow: hidden; background-color: #fff; z-index: 9999; } #lbTopContainer { display:block; } #lbBottomContainer { } #lbImage { position: absolute; top: 0; left: 0; border: 10px solid #fff; background-repeat: no-repeat; } #lbPrevLink, #lbNextLink {text-decoration: none; position: absolute; top: 10px; padding: 8px 10px 8px 5px; color: black; font-weight: bold; display: block; border: 0; outline: none; } #lbPrevLink span, #lbNextLink span { } #lbPrevLink:hover, #lbNextLink:hover { } #lbPrevLink { left: 0; background: url(/assets/moed/images/default/slide_button_left.png) no-repeat; } #lbPrevLink span { visibility:hidden; } #lbNextLink { right: 0; text-align: right; background: url(/assets/moed/images/default/slide_button_right.png) no-repeat right top; } #lbNextLink span { right:0; visibility:hidden; } #lbTop { height: 32px; text-align: left; border: 10px solid #fff; border-top-style: none; background: url(/assets/moed/images/default/slide_moed_logo.jpg) no-repeat left 2px; } #lbBottom { padding:0 0 25px 10px; min-height: 60px; text-align: left; border-top-style: none; background: url(/assets/moed/images/default/slide_moed_payoff.jpg) no-repeat right bottom #ffffff;} #lbCloseLink { position: absolute; top: 5px; right: 10px; display: block; width: 18px; height: 18px; background: transparent url(/assets/moed/images/default/lightbox_close.jpg) no-repeat 100% 0; outline: none; } #lbNumber { position: absolute; top: 5px; right: 35px; font-size: .9em; font-weight: bold; color: black; padding: 0 .3em 0 .2em; } #lbInfo { margin: 0 80px 0 95px; border-right: 1px dotted #ddd; } #lbCaption { } #lbCaption h3 {color:red; font-size:1.3em; font-weight:bold;} #lbCaption p { } /* preview bar */ #preview-bar { position: fixed; left: 0; right: 0; top: 0; margin: 0; padding: 0; border-bottom: 2px solid #003384; text-align: center; background-color: white; } #preview-bar #previewselect { margin: 0; padding: .5em 0; background-color: #ffa; opacity: .5; } #preview-bar:hover #previewselect { opacity: .8; } #preview-bar #previewselect input, #preview-bar #previewselect select { margin: 0 1em; } /* webshop */ .articles { width: 100%; margin-left: 0 !important; list-style-type: none !important; min-height: 78px;} .articles .infopage-article { border-bottom: 1px solid #e6e6e6; display: block; padding: 20px 0;} .articles .infopage-article li { display: block; } .articles .infopage-article p { margin: 10px 0; } .articles .infopage-article .amount .quantityselect { float:left; width:25px !important; height: 14px; } .articles .infopage-article .amount .quantitybutton {height: 22px; margin-top: -2px; line-height: 5px; float:left; width:173px !important; border: 0 !important; background-color: transparent; color: #ffffff !important; } .articles .infopage-article .amount a { color: #fff !important; font-weight: bold; text-decoration: none; } .articles .infopage-article .amount { color: #fff !important; margin-top: 10px; padding: 3px 0 0 5px; width:201px !important; height: 21px; background: url(/assets/moed/images/default/webshop_button_naar_winkelwagen.gif) no-repeat left top; } .articles .infopage-article .img { float: left; width: 78px; height:auto; } .articles .infopage-article .article_content { margin-left: 95px; } .articles .infopage-article .article_content a { text-decoration: none; } .articles .infopage-article .article_content a:hover { text-decoration: none; } .articles .infopage-article .article_content .articlesize { width: 250px !important; padding: 0 !important;} .articles .infopage-article .price { color: #f00; font-weight: bold; display: inline; } #pagebody { margin-bottom:1em; } #pagebody ul { list-style: disc inside none; } #pagebody ol { list-style: decimal inside none; } .page-informationsheet h1 { margin-bottom: 20px !important; } .article-article { width: 100%; margin-left: 0 !important; min-height: 132px; } .article-article li { display: block; } .article-article p { margin: 10px 0; } .article-article select { width:40px !important; height: 20px; margin-right: 8px; } .article-article .amount { color: #fff !important; margin-top: 10px; padding: 3px 0 0 5px; width:201px !important; height: 21px; background: url(/assets/moed/images/default/webshop_button_naar_winkelwagen.gif) no-repeat left top; } .article-article .amount #quantity { float:left; width:25px; height: 14px; } .article-article .amount .quantitybutton { margin-left: 16px; height: 22px; margin-top: -32px; line-height: 5px; float:left; width:173px; border: 0 !important; background-color: transparent; color: #ffffff !important; } .article-article .amount a { color: #fff !important; font-weight: bold; text-decoration: none; } .article-article .img { float: left; width: 132px;} .article-article .article_content { margin-left: 152px; } .article-article .article_content .articlesize {width: 250px !important; padding: 0 !important;} .article-article .price { color: #f00; font-weight: bold; display: inline; } .cartview { width: 249px; } .cartview .shoplink { text-decoration: none; color: #fff; } .cartview #cartbody { width: 245px; margin-top: 15px; } .cartview #cartbody .item { height: 60px; } #cartview_title { font-size: 1.2em; padding-left: 10px; width:239px; height: 24px; background: url(/assets/moed/images/default/webshop_bg_titel_right.gif) no-repeat left top; color: #ffffff; font-weight: bold; } .cartview #cartview_empty { text-align: center; } .cartview img { float: left; } .cartview #cartdesc { margin-left: 50px; } .cartview table { border-collapse: collapse; border-spacing: 0; border: none; } .cartview td { border: none; } .cartview .pad1 { padding-top: 10px; } .cartview .pad2 { padding-bottom: 10px; } .cartview .separator { border-bottom: 2px dotted #e6e6e6; } .cartview #pay { float:right; color: #fff; font-weight: bold; border: 0; width: 97px; height: 24px; background-image: url(/assets/moed/images/default/webshop_button_betalen.gif); background-color:Transparent; } .shop-cartview {} /*vertical-align for th td tr ?*/ .shop-cartview .img { float: left; } .shop-cartview thead { font-weight: bold; color: #ff0000; } .shop-cartview .articles { border: none; vertical-align: none; } .shop-cartview .articles td { border: none; vertical-align: top; padding: 10px 0; margin: 10px 0;} .shop-cartview .articles .price { font-weight: bold; } .shop-cartview .articles .total { font-weight: bold; padding-top: 10px !important; width: 100px !important;} .shop-cartview .articles tr { border: none; vertical-align: top; } .shop-cartview .articles tr .quantity { width: 25px !important; } .shop-cartview .articles .articlerow { border-bottom:2px dotted #E6E6E6; } .shop-cartview .articles .articlerow .delete { width:90px !important; border-style:none !important; margin: 10px 0 0 0 !important; padding: 0 0 0 15px !important; font-family: Verdana; font-size: 1em; color: #000 !important; font-weight: normal !important; background: url(/assets/moed/images/default/webshop_button_verwijderen.gif) no-repeat left center; } .shop-cartview .articles .total1 { border-bottom:none; } .shop-cartview .articles .total1 td{ padding: 1px 0; } .shop-cartview .articles .total2 { border-bottom:2px dotted #E6E6E6; } .shop-cartview .articles .total2 td{ padding: 1px 0; } .shop-cartview .articles .total3 { border-bottom: none; } .shop-cartview .articles .total3 td{ padding: 1px 0; } .shop-cartview .order-more{ font-weight: bold; border: none !important; width:97px !important; height:24px; color: #fff !important; background: url(/assets/moed/images/default/webshop_button_bijwerken.gif) no-repeat left center; } .shop-cartview .update-order{ margin: 0 5px 0 5px !important; border-style:none !important; font-weight: bold; border: none !important; width:97px !important; height:24px; color: #fff !important; background: url(/assets/moed/images/default/webshop_button_bijwerken.gif) no-repeat left center; } .shop-cartview .proceed-order{ margin: 0 10px 0 0 !important; border-style:none !important; font-weight: bold; border: none !important; width:97px !important; height:24px; color: #fff !important; background: url(/assets/moed/images/default/webshop_button_betalen.gif) no-repeat left center; } .cartview-options { text-align: right; } .shop-checkout {} /*vertical-align for th td tr ?*/ .shop-checkout .img { float: left; } .shop-checkout thead { font-weight: bold; color: #ff0000; } .shop-checkout .articles { border: none; vertical-align: none; } .shop-checkout .articles td { border: none; vertical-align: top; padding: 10px 0; margin: 10px 0;} .shop-checkout .articles .price { font-weight: bold; } .shop-checkout .articles .total { font-weight: bold; padding-top: 10px !important; width: 100px !important;} .shop-checkout .articles tr { border: none; vertical-align: top; } .shop-checkout .articles tr .quantity { width: 25px !important; } .shop-checkout .articles .articlerow { border-bottom:2px dotted #E6E6E6; } .shop-checkout .articles .articlerow .delete { border-style:none !important; margin: 10px 0 0 0 !important; padding: 0 0 0 15px !important; font-family: Verdana; font-size: 1em; color: #000 !important; font-weight: normal !important; background: url(/assets/moed/images/default/webshop_button_verwijderen.gif) no-repeat left center; } .shop-checkout .articles .total1 { border-bottom:none; } .shop-checkout .articles .total1 td{ padding: 1px 0; } .shop-checkout .articles .total2 { border-bottom:2px dotted #E6E6E6; } .shop-checkout .articles .total2 td{ padding: 1px 0; } .shop-checkout .articles .total3 { border-bottom: none; } .shop-checkout .articles .total3 td{ padding: 1px 0; } .shop-checkout .order-more { font-weight: bold; border: none !important; width:140px !important; height:24px; color: #fff !important; background: url(/assets/moed/images/default/webshop_button_winkelen.gif) no-repeat left center; } .shop-checkout .update-order { margin: 0 5px 0 5px !important; border-style:none !important; font-weight: bold; border: none !important; width:97px !important; height:24px; color: #fff !important; background: url(/assets/moed/images/default/webshop_button_bijwerken.gif) no-repeat left center; } .shop-checkout .proceed-order { margin: 0 10px 0 0 !important; border-style:none !important; font-weight: bold; border: none !important; width:97px !important; height:24px; color: #fff !important; background: url(/assets/moed/images/default/webshop_button_betalen.gif) no-repeat left center; } .shop-checkout .adress_title { display: block; font-weight: bold; color: #f00; } .shop-checkout .adress_head { display: block; font-weight: bold; } .shop-checkout #divider { margin: 20px 0; color: #E6E6E6; background-color: #E6E6E6; height:1px; border:none; } .shop-checkout .submitpay { float:right; color: #fff !important; font-weight: bold !important; border: 0 !important; width: 97px !important; height: 24px; background-image: url(/assets/moed/images/default/webshop_button_betalen.gif); background-color: Transparent !important; } .idealform { clear: both; } .idealform .submit { text-align: center !important; padding: 0 !important; float:right; color: #fff !important; font-weight: bold !important; border: 0 !important; width: 97px !important; height: 24px; background-image: url(/assets/moed/images/default/webshop_button_betalen.gif); background-color: Transparent !important; background-position: 0 !important; } .order-summary {} .order-summary .element { clear: both; } .order-summary .element .label { float: left; width: 200px; } .order-summary .element .group { float: left; width: 220px; } .order-summary .element input[type=checkbox] { width: auto !important; } .order-summary .element .group div { float: left; } .order-summary .element .input { float: left; width: 220px; } .order-summary .submit .submit { background-position: 0 !important; float:right; width: 97px !important; height: 24px; background-image: url(/assets/moed/images/default/webshop_button_betalen.gif); } .order-summary #use_alt { padding-top: 20px; } #content h2.markerheader { color:red; font-size:1.3em; margin:0; } /* style twitterfeed */ #footerzone-1 #footer-column1 h2.twitter { display:block; margin-bottom:10px;} #footerzone-1 #footer-column1 h2.twitter span { visibility: hidden; } #twtr-widget-1 .twtr-bd, #twtr-widget-1 .twtr-timeline i a, #twtr-widget-1 .twtr-bd p { color:#000000 !important; font-size:0.96em; font-weight:normal !important; } /** * Very often used classes */ /* positioning and visibility */ .clear-both { clear: both; } .inline { display: inline; } .block-level { display: block; } .nodisplay { display: none; } .show { visibility: visible; } .hide { visibility: hidden; } .clearnone { clear:none; } /* coloring and text decoration/transformation */ .no-border { text-decoration: none; } .back { padding-left: 15px !important; background: url(/assets/demo1/images/default/arrow_left.gif) center left no-repeat; } .back:hover { background-image: url(/assets/demo1/images/default/arrow_left_over.gif); } .red { color: red; } .req { color: inherit; } .err { color: red; font-weight: bold; } input.err { font-weight: normal; background-color: #ffbfbf; } .notice { color: #000; padding: .3em; } .chosen { color: #f60; font-weight: bold; } strong { font-weight:bold; } em { font-style:italic; } /* odd, even and first for row coloring (zebra tables and distinctive first row) */ .odd { background-color: #fff; } .even { background-color: #ffdfca; } .first { } .second { }