diff css/mpiwg.css @ 2:ddf6c1a27a4b

new version with main_template and css in product.
author casties
date Thu, 07 Feb 2013 19:50:39 +0100
parents
children 1a895905f7ca
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/css/mpiwg.css	Thu Feb 07 19:50:39 2013 +0100
@@ -0,0 +1,1149 @@
+/* MPIWG website style sheet 
+ * 
+ * (c) 2013 Robert Casties
+ */
+
+
+
+body {
+    margin: 0;
+    font-family: Verdana, Arial, sans-serif; 
+    background-color: #fdf8ef;
+    font-size: 12px;
+}
+
+/* 
+ * global styles
+ */
+
+img {
+    border: none;
+}
+
+a {
+    color: #ee802d;
+    text-decoration: none;
+}
+
+a:hover {
+    text-decoration: underline;
+}
+
+/*  new link-classes (with icons)  */
+
+a.internal {
+    background: url(../images/arr_more.gif) no-repeat;    
+    padding-left: 12px;
+    padding-top: 1px;
+}
+
+a.download {
+    background: url(../images/download.gif) no-repeat;    
+    padding-left: 17px;
+/* padding-top:1px; */
+}
+
+a.external {
+    background: url(../images/external.gif) no-repeat;    
+    padding-left: 15px;
+/* padding-top:1px; */
+}
+a.pdf {
+    background: url(../images/pdf.gif) no-repeat;    
+    padding-left: 15px;
+/* padding-top:1px; */
+}
+
+a.audio {
+    background: url(../images/audio.gif) no-repeat;    
+    padding-left: 15px;
+/* padding-top:1px; */
+}
+
+a.book {
+    background: url(../images/book.gif) no-repeat;    
+    padding-left: 20px;
+    margin-left: -5px;
+    margin-top: -1px;
+}
+
+a.maillink {
+    color: #485297 !important;
+}
+
+h1 a {
+    /* a header with a link looks like a header */
+    color: inherit;
+    font-weight: inherit;
+    text-decoration: none;
+}
+
+img.pic_large {
+    /* class for wide pictures used for example on institute/addres.html etc. */
+    margin-bottom: 20px;
+}
+
+
+/* 
+ * header and wrapper 
+ */
+
+#wrapper {
+    /* float: left; */
+    width: 960px;
+    margin: 0 auto;
+    padding: 20px 0 0 20px;
+    background-color: #fcf2df;
+}
+
+#header {
+    /* float: left; */
+    width: 900px;
+    margin: 0 0 10px 0;
+}
+
+#header div.title {
+	display: inline;
+    /* float: left; */
+    width: 661px;
+    height: 40px;
+}
+
+#header div.title img {
+	margin-bottom: 30px;
+}
+
+#header div.logo {
+	display: inline;
+	/* float: right; */
+	width: 87px;
+	height: 88px;
+}
+
+#header div.logo img {
+	margin-left: 145px;
+}
+
+/* Main Navigation */
+
+#mainnav {
+    /* float: left; */
+    width: 900px;
+    font-size: 12px;
+	border-top: 8px solid #fab775;
+    margin-bottom: 20px;
+    padding-top: 5px;
+}
+
+#mainnav div.sec {
+	display: inline;
+    /* float: left; */
+    border-top: 8px solid #fab775;
+    margin-top: -0px;
+    margin-right: 35px;
+    padding-top: 5px;
+}
+
+#mainnav div.sec:hover {
+    border-top: 8px solid #ea8500;
+}
+	
+#mainnav a {
+    color: #666666;
+    outline: none;
+}
+
+#mainnav a:hover {
+    color: #000000;
+    text-decoration: none;
+}
+
+#mainnav div.sec.on {
+	border-top: 8px solid #ea8500;
+}
+
+#mainnav div.sec.on a {
+    color: #ea8500;
+    outline: none;
+    font-weight: bold;
+}
+
+#mainnav div.sec.lang {
+    float: right;
+    margin-top: -13px;
+    margin-right: 0;
+}
+
+
+
+
+
+
+/* Search */    
+
+div.search {
+    float: left;
+    width: 900px;
+    height: 25px;
+}
+
+#wrapper_home div.search {
+    float: right;
+    width: 220px;
+}
+
+.searchform {
+    float: right;
+}
+
+input.searchinput {
+    width: 211px;
+    padding-left: 18px;
+    border: 1px solid #dccbae;
+    background: url(../images/search.gif) no-repeat #FFFFFF;
+    color: #EA8500;
+}
+
+
+
+
+
+
+/* Breadcrumbs & Quicklinks */
+
+div.quicklinks {
+    float: left;
+    width: 900px;
+    border-bottom: 3px solid #dccbae;
+    color: #EA8500;
+}
+
+#wrapper_home div.quicklinks {
+    float: right;
+    width: 230px;
+    border-bottom: none;
+}
+
+div.breadcrumbs {
+    float: left;
+    font-size: 10px;
+    color: #6a4d3c;
+}
+
+div.breadcrumbs a {
+    color: #6a4d3c;
+    text-decoration: none;
+}
+
+div.breadcrumbs .selected {
+    color: #6a4d3c;
+    font-weight: bold;
+}
+
+select.quickfind {
+    float: right;
+    width: 230px;
+    height: 20px;
+    padding: 2px 2px 2px 18px;
+    color: #EA8500;
+    font-size: 11px;
+    border: none;
+    background: url(../images/arr_qf.gif) no-repeat #f4daae;
+}
+
+
+
+
+
+
+
+
+
+/*
+ * Content 
+ */
+
+/* frontpage */
+
+div.feature, div.feature .thumbnails {
+    float: left;
+    width: 650px;
+/*    margin-right: 20px; */
+    font-size: 12px;
+    line-height: 1.6;
+}
+
+div.feature .thumb {
+    float: left;
+    width: 129px;
+    margin-right: 1px;
+    margin-bottom: 1px;
+}
+
+div.feature .feature_image {
+    float: left;
+    width: 650px;
+    margin-bottom: 15px;
+}
+
+div.feature .caption {
+    text-align: right;
+    font-size: 10px;
+    color: #b69f7b;
+    margin-top: 5px;
+}
+
+div.feature h1 {
+    color: #485297;
+    font-size: 15px;
+    font-weight: bold;
+    margin: 10px 2px 2px 2px;
+}
+
+div.feature h2 {
+    color: #485297;
+    font-size: 15px;
+    font-weight:normal;
+    margin: 10px 2px 2px 2px;
+}
+
+div.feature p {
+/*    margin-top: 0.5em;
+    margin-bottom: 0.5em; */
+}
+
+
+
+
+/*
+ *  main section 
+ */
+
+div.content {
+    float: left;
+    width: 900px;
+}
+
+div.main {
+    float: left;
+    width: 720px;
+    background-color: #FFFFFF;
+    margin-bottom: 10px;
+    padding-right: 10px;
+    font-size: 12px;
+}
+
+div.main div.center {
+    float: left;
+    width: 460px;
+    padding: 20px;
+}
+
+
+div.center, div.center_wide {
+    line-height: 1.6;
+}
+div.center ul {
+    list-style: none;
+    margin-left: 0;
+    padding: 0;
+}
+
+div.center li {
+    margin-bottom: 10px;
+}
+
+
+div.main div.center_wide {
+    float: left;
+    width: 710px;
+/*    padding: 20px 0 0 20px; */
+    padding: 20px;
+}
+
+
+div.main h1 {
+    color: #485297;
+    font-size: 15px;
+    font-weight: bold;
+    margin: 10px 2px 10px 2px;
+}
+
+div.main h2 {
+    color: #485297;
+    font-size: 15px;
+    font-weight: normal;
+    margin: 2px;
+}
+
+div.main h3 {
+    color: #485297;
+    font-size: 13px;
+    font-weight: normal;
+    margin: 2px;
+}
+
+
+
+
+
+/*
+ * subnavigation
+ */
+
+div.leftbox {
+    float: left;
+    width: 170px;
+}
+
+div.subnav {
+    float: left;
+    width: 170px;
+    font-size: 11px;
+}
+
+div.subnav .sn_off, .subnavbox .sn_off {
+    float: left;
+    width: 164px;
+    border-bottom: 1px solid #dccbae;
+    padding: 3px 6px 6px 0;
+}
+
+div.subnav .sn_on {
+    float: left;
+    width: 158px;
+    border-bottom: 1px solid #dccbae;
+    padding: 3px 6px 6px 6px;
+    background: #EA8500;
+}
+
+div.subnav .sn_on a {
+    color: #FCF2DF;
+    font-weight: bold;
+}
+
+div.subnav .sn_off .dept {
+    font-style: italic;
+    color: #b69f7b;
+}
+
+div.subnav .sn_on .dept {
+    font-style: italic;
+    color: #f9f4e1;
+}
+
+div.subnavbox {
+    /* navigation below e.g. research projects */ 
+    float: left;
+    width: 170px;
+    font-size: 11px;
+    margin-top: 30px;
+}
+
+div.subnavbox h2 {
+    float: left;
+    width: 170px;
+    height: 20px;
+    font-size: 11px;
+    color: #b69f7b;
+    margin-bottom: 0px;
+    padding-bottom: 3px;
+    margin-top: 20px;
+    background: transparent url(../images/side.gif) repeat-x;
+}
+
+
+
+
+
+
+/*
+ * research section
+ */
+
+div.center_wide.dept {
+    padding-left: 16px !important;
+    padding-right: 0 !important;
+}
+
+div.center.dept {
+    padding-left: 16px !important;
+    padding-right: 0 !important;
+    width: 480px !important;
+}
+
+div.dept_block {
+    float: left;
+    width: 221px;
+    min-height:420px;
+    border-bottom: 2px solid #979CE0;
+    margin-right: 15px;
+    margin-bottom: 20px;
+    font-size: 11px;
+}
+
+div.dept_block.clear {
+    clear:left;
+}
+
+div.dept_block.wide {
+    width: 460px !important;
+    min-height:0px !important;
+    height: auto  !important;
+}
+
+div.dept_block.short {
+    min-height: 290px !important;
+    border-bottom: None;
+}
+
+div.dept_block h2 {
+    margin: 0 0 5px 0;
+    font-size: 13px;
+    font-weight: normal;
+    color: #485297;
+}
+
+div.dept_block.wide h2 {
+    margin: 0 0 5px 0;
+    font-size: 16px;
+    color: #485297;
+}
+
+div.dept_block h1 {
+    font-size: 13px;
+    font-weight: bold;
+    color: #485297;
+}
+
+div.dept_block.wide h1 {
+    font-size: 16px;
+}
+
+div.dept_block h2 a, div.dept_block h1 a {
+    color: #485297;
+}
+
+div.dept_block p {
+    font-size: 11px;
+    line-height: 1.6;
+}
+
+p.dept_leader, p.dept_summary {
+    /* legacy */
+    font-size: 11px;
+    line-height:1.4;
+}
+
+
+
+/* 
+ * people list 
+ */
+
+div.namelist {
+    float: left;
+    clear: left;
+    padding-top: 10px;
+}
+
+div.namelist.line {
+    border-top: 3px solid #dccbae;
+}
+/* NEW */
+div.namelist h2 {
+    border-bottom: 3px solid #dccbae;
+}
+div.namelist h2.noline {
+    border-bottom: none;
+}
+div.namelist.small {
+    font-size: 11px;
+}
+
+div.center_wide div.namelist {
+    width: 700px;
+}
+div.center div.namelist div.row {
+    width:100%;
+}
+div.namelist div.row {
+    float: left;
+    border-bottom: 1px solid #dccbae;
+    margin-top: 5px;
+    padding-bottom: 7px;
+}
+div.namelist div.row.noline {
+    border-bottom: none;
+}
+
+div.center_wide div.namelist div.row {
+    width: 700px;
+}
+
+div.namelist div.row:last-child {
+    border-bottom: none;
+}
+
+div.namelist .name {
+    display: block; 
+    float: left;
+    width: 30%;
+}
+
+div.namelist.namelinks .name a {
+    color: #485297;
+}
+
+div.namelist .definition {
+    display: block;
+    float: left;
+    width: 70%;
+}
+
+div.namelist.namelinks .definition a {
+    color: #485297;
+}
+
+/* legacy */
+div.namelist.namelinks .definition.normallinks a {
+    color: #EA8500;
+}
+
+div.list_disclaimer {
+    float: left;
+    width: 180px;
+    font-size: 10px;
+    margin-right: 20px;
+}
+
+div.letters {
+    float: left;
+    margin-right: 10px;
+    color: #EA8500;
+}
+div.letters a {
+    margin-left: 0.2em;
+    margin-right: 0.2em;
+}
+
+div.letter {
+    float: left;
+    width: 700px;
+    margin-top: 20px;
+    padding-bottom: 3px;
+    border-bottom: 3px solid #dccbae;
+    font-weight: bold;
+    font-size: 13px;
+    color: #dccbae;
+}
+
+div.jump_top {
+    float: left;
+    width: 700px;
+    text-align: right;
+    font-size: 10px;
+}   
+
+
+
+
+/* bios */
+
+p.bio_section_header {
+    color: #485297;
+    padding-bottom: 5px;
+    margin-bottom: 5px;
+    border-bottom: 1px solid #dccbae;
+}
+
+
+
+/*
+ * right sidebar
+ */
+
+div.sidebar {
+    float: right;
+    width: 220px;
+    font-size: 10px;
+    line-height: 1.6;
+/*    margin-right: 10px; */
+}
+
+#wrapper_home .sidebar {
+    width: 230px;
+}   
+
+div.sideblock {
+/*    border-bottom: 1px solid #dccbae; */
+    float: left;
+    clear: left;
+}
+
+div.sideblock h2 {
+    padding-bottom: 5px;
+    margin: 18px 0px 0px 0px;
+    /* brown bottom line
+    background: transparent url(../images/side.gif) repeat-x;
+    */
+    border-bottom: 3px solid #dccbae;
+    font-size: 12px;
+    color: #485297;
+    /*float:left;
+    clear:both;*/
+    font-weight: normal;
+}
+
+div.sideblock h2 a {
+    /* no longer so ugly hack to have right-adjust link... */
+    float: right;
+    color: #EA8500;
+    font-size: 10px;
+}
+
+div.sideblock h2 .proj_state {
+    /* right-adjusted block besides the title */
+    float: right;
+    font-size: 10px;
+    color: #b69f7b;
+    font-weight: bold;
+}
+div.sideblock h2 .proj_state a {
+    /* inside should not float */
+    float: none;
+}
+
+div.sideblock a.maillink {
+    color: #ea8500 !important;
+}
+
+div.sideblock .item, div.sideblock p {
+    float:left;
+    width:220px;
+    margin: 5px 0 0 0;
+    padding: 0 0 5px 0;
+    border-bottom: 1px solid #dccbae;
+
+}
+
+div.sideblock .item.noline {
+    border-bottom: none;
+}
+
+div.sideblock .project {
+    background: url(../images/arr_right.gif) no-repeat #f5daaf;
+    padding: 6px 6px 6px 20px;
+    border-bottom: 1px solid #f3be7c;
+    width:194px;
+}
+
+div.sideblock .project.inactive {
+    background: url(../images/arr_right.gif) no-repeat #f6e6cc;
+    width:194px;
+}
+
+div.sideblock .project.parent {
+    background: url(../images/arr_up.gif) no-repeat #f9f4e1;
+    color: #666666;
+    border-bottom: 1px solid #dccbae;
+    margin-top:20px;
+}
+
+div.sideblock .project a {
+    color: #333;
+}
+
+div.sideblock .item.featurearchive {
+    border-bottom:none;
+    float:left;
+    margin: 5px 0 10px 0;
+    padding: 0 0 5px 0;
+    border-bottom: None; 
+}
+
+div.sideblock .item img {
+    margin-right: 8px;
+}
+
+div.sideblock .item.link, div.sideblock .item.internal {
+    padding: 0 0 10px 20px;
+    background: url(../images/arr_more.gif) no-repeat;
+    width: 200px;
+}
+div.sideblock .item.book {
+    padding: 0 0 10px 20px;
+    background: url(../images/book.gif) no-repeat;
+    width: 200px;
+}
+
+div.sideblock .item.external {
+    padding: 0 0 10px 20px;
+    background: url(../images/external.gif) no-repeat;
+        width: 200px;
+}
+
+div.sideblock .item.video {
+    padding: 0 0 10px 20px;
+    background: url(../images/vid.gif) no-repeat;
+        width: 200px;
+}
+
+div.sideblock .item.audio {
+    padding: 0 0 10px 20px;
+    background: url(../images/audio.gif) no-repeat;
+        width: 200px;
+}
+
+div.sideblock .item.download {
+    padding: 0 0 10px 20px;
+    background: url(../images/download.gif) no-repeat;
+        width: 200px;
+}
+
+
+
+
+/*
+ * footer
+ */
+
+.footer {
+    float: left;
+    width: 700px;
+    background-color: #FFFFFF;
+    margin: 0 10px 20px 20px;
+    border-top: 1px solid #485297;
+}
+
+#wrapper_home .footer {
+    float: left;
+    width: 900px;
+    margin: 0 10px 20px 20px;
+    border-top: 1px solid #dccbae;
+}
+
+div.services {
+    float: right;
+    font-size: 11px;
+    margin-top: 5px;
+}
+
+.services a {
+    color: #485297;
+}
+
+div.serviceprint {
+    float: left;
+    margin-left: 20px;
+    padding-left: 20px;
+    height: 25px;
+    background: url(../images/print.gif) no-repeat;
+}
+
+div.serviceforward {
+    float: left;
+    margin-left: 20px;
+    padding-left: 20px;
+    height: 25px;
+    background: url(../images/forward.gif) no-repeat;
+}
+
+div.servicepdf {
+    float: left;
+    margin-left: 20px;
+    padding-left: 20px;
+    height: 25px;
+    background: url(../images/pdf.gif) no-repeat;
+}
+
+div.boilerplate {
+    float: left;
+    margin: 0 0 50px 170px;
+    width: 730px;
+}
+
+#wrapper_home div.boilerplate {
+    float: left;
+    margin: 30px 0 50px 0px;
+    width: 900px;
+    border-top: 1px solid #dccbae;
+    padding-top: 10px;
+}
+
+div.legal {
+    float: left;
+    font-size: 11px;
+    color: #EA8500;
+}
+
+div.mpg_signet {
+    float: right;
+}
+
+
+/* more generic lists */
+
+ul.big {
+    width:100%;
+}
+
+ul.big li {
+    border-bottom: 1px solid #dccbae;
+    margin-top: 5px;
+    padding-bottom: 7px;
+}
+ul.big li:last-child {
+    border-bottom: none;
+}
+
+
+
+/* Sitemap */
+div.dept_block_sitemap {
+    float: left;
+    width: 221px;
+    font-size: 11px;
+}
+
+.dept_title_sitemap {
+    margin: 0 0 5px 0;
+    font-size: 13px;
+    color: #485297;
+    width: 221px;
+    padding-top: 5px;
+    border-top: 2px solid #979CE0;
+}
+
+.dept_title a, .dept_title_sitemap a, .dept_headline a {
+    color: #485297;
+}
+
+
+div.banner_large .caption {
+    font-size: 10px;
+    color: #b69f7b;
+    margin-top: 5px;
+}
+
+
+div.image_large .caption {
+    font-size: 10px;
+    color: #b69f7b;
+    margin-top: 5px;
+}
+div.image_small {
+    width: 230px;
+    padding: 10px;
+}
+div.image_small.left {
+    float: left;
+    padding-left: 0px;
+}
+div.image_small.right {
+    float: right;
+    padding-right: 0px;
+}
+div.image_small .caption {
+    font-size: 10px;
+    color: #b69f7b;
+    margin-top: 5px;
+}
+
+
+
+/* projects */
+
+div.projectlist {
+    width:100%;
+}
+
+div.projectlist h2 {
+    width:700px;
+    font-size: 13px;
+    border-bottom: 2px solid #dccbae;
+    font-weight:normal;
+}
+div.projectlist h2 a {
+    color: #485297;
+}
+div.projectlist h2 a .dep {
+    font-weight:bold;
+    color: #485297;
+    margin-right:10px;
+}
+div.project_block {
+    margin-top:10px;
+    margin-bottom:14px;
+}
+
+ul.projectlist {
+    list-style-image:url(../images/arr_more.gif);
+/*    line-height: 20px; */
+}
+ul.projectlist a{
+    color: #485297;
+}
+
+
+p.maintext_more {
+    font-size: 12px;
+    margin-top: -10px;
+    padding-left: 15px;
+    background: url(../images/arr_more.gif) no-repeat;
+}
+p.maintext_authors {
+    font-size: 12px;
+    font-weight: bold;
+}
+
+
+div.caption_inline {
+    /* caption for images on project pages */
+    float: left;
+    width: 208px;
+    font-size: 9px;
+    color: #b69f7b;
+    margin-top: 5px;
+}
+
+div.pic_inline {
+    float: left;
+    width: 220px;
+}
+div.pic_inline_container {
+    float: left;
+    width: 220px;
+    margin: 5px 15px 0 0;
+}
+
+
+
+/* Research Units */
+li.level_1 {
+    margin-left:2px;
+}
+li.level_2 {
+    margin-left:22px;
+    border-bottom: 1px solid #dccbae;
+    font-weight:bold;
+}
+li.level_3 {
+    margin-left:52px;
+    font-weight:bold;
+}
+li.level_4 {
+    margin-left:82px;
+}
+
+a.expand {
+    margin-left:45px;
+    margin-top:10px;
+}
+
+
+
+
+
+
+
+/* Events */
+
+div.event {
+    margin-bottom: 44px;
+}
+
+div.event span.category{
+    border-bottom:1px solid #dccbae;
+    color: #485297;
+
+    font-size:12px;
+}
+div.event h2 {
+    margin-left:0px;
+/*    color: #dccbae;
+    font-weight:bold;
+    border-bottom:2px solid #dccbae;
+       */
+    color: #485297;
+    font-weight:normal;
+}
+
+div.event h1{
+    margin-left:0px;
+}
+
+div.event p {
+        font-size: 11px;
+
+    margin-left:82px;
+}
+
+
+div.event div.row {
+    width:100%;
+    float: left;
+    border-bottom: 1px solid #dccbae;
+    margin-bottom: 5px;
+    padding-bottom: 7px;
+}
+
+
+div.event div.row div.name {
+    float:left;
+    width:80px;
+    color:#485297;
+}
+
+div.event div.row div.definition {
+    float:left;
+    margin-left:20px;
+    width:300px;
+}
+
+
+
+/*  mediathek  */
+
+div.media_nav {
+    background-color:#ffffff;
+}
+
+div.media_nav div.element {
+    float:left;
+    margin-left:8px;
+    margin-right:8px;
+}
+
+
+
+/* unknown */
+div.line{
+    border-bottom: 3px solid #dccbae;
+    margin-bottom:10px;
+    margin-top:10px;
+    width:700px;
+}
+/* used e.g. on staff-pages 'kollegium/board of directors' */
+
+.deptlink {
+    color:  #485297;
+    margin:20px;
+}
+
+ul.presse li {
+    border-top: 1px solid #dccbae;
+    font-size: 11px;
+    padding-left:8px;
+    padding-top: 8px;
+}
+
+h2.line {
+    border-bottom:2px solid #dccbae;
+    margin-bottom:8px;
+}
+h1.line {
+    border-bottom:3px solid #dccbae;
+    padding-bottom:5px;
+}
+