/* =========================================================
Stylesheet für Ihre neue Website
Datei: screen.css
Datum: 03. November 2009
Autor: Oliver Wild - based on Peter Müller's Little Boxes
Aufbau 1. Kalibrierung und allgemeine Styles
2. Styles für Layoutbereiche
3. Sonstige Styles
========================================================== */
/* ======================================
1. Kalibrierung und allgemeine Styles
====================================== */
/* Kalibrierung der wichtigsten Abstände */
* { padding: 0; margin: 0; }
h2, h3, p, ul, ol { margin-bottom: 1em; }
h2 {margin-top: 10px}
ul ul { margin-bottom: 0; }
li { margin-left: 2em;}
li li { margin-left: 3em; }
/* Allgemeine Selektoren */
html { height: 101%; } /* erzwingt Scrollbar im Firefox */
body {
color: white;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
h1 { font-size: 130%; }
h2 { font-size: 110%; font-weight: bold; }
h3 { font-size: 100%; font-weight: bold; }
/* Hyperlinks */
a { text-decoration: none; outline: none;}
/* Allgemeine Klassen und IDs */
.skiplink {
position: absolute;
left: -3000px;
top: -2000px;
width: 0px;
height: 0px;
overflow: hidden;
display: inline;
}
.bildrechts {
clear: both;
float:right;
margin-bottom: 10px;
margin-left: 10px;
}
.bildlinks {
float:left;
margin-bottom: 10px;
margin-right: 10px;
}
.new {color: red; font-size:10px; text-transform: upperclass;}
/* ====================================
2. Styles für die Layoutbereiche
==================================== */
#wrapper { /* Das HTML-Element mit dem Attribut id="wrapper" */
color: black;
background-color: white;
width: 960px; /* Breite des Inhaltsbereiches */
}
#navitop {
text-align: right; /* rechtsbündig */
color: black;
padding: 5px 10px 4px 10px;
margin-top:25px;
}
#navitop ul { margin-bottom: 0; }
#navitop li {
display: inline;
list-style-type: none;
list-style-position: inside;
margin: 0 ; /* war vorher 10px für rechts */
}
#navitop a {
color: black;
background: url(images/arrow-blue-off.gif) 0 4px no-repeat;
padding: 1px 0 0 10px;
margin-right:10px;
}
#navitop a:hover,
#navitop a:focus,
#aboutIMS #navitop01 a,
#contactform #navitop02 a,
#supportform #navitop03 a,
#downloads #navitop04 a,
#homepage #navitop05 a {
color: black;
background: url(images/arrow-blue.gif) 0 4px no-repeat;
}
#kopfbereich {
height: 275px;
background: url(images/head-titel.jpg) no-repeat top left;
color: black;
padding: 0;
margin-top:10px;
}
#kopfbereich p {
padding: 5px 0 5px 0;
margin-bottom: 0; /* war 1em */
}
#headlinetop {padding: 120px 0 0 110px;
font-size:18px;}
#content {}
#navileft {float: left;
width:230px;
margin: 30px 10px 20px 20px; }
#navileft ul { margin: 0; padding: 0;
}
#navileft ul ul { padding: 5px 0 0 15px;
}
#navileft ul ul ul { padding: 5px 0 0 30px;
}
#navileft li {
list-style-type: none;
margin: 0; /* war vorher 10px für rechts */
padding: 4px 0;
}
#navileft li li {
margin: 0; /* war vorher 10px für rechts */
padding: 2px;
}
#navileft li a {
color: black;
padding: 1px 0 3px 10px;
display: block;
}
#navileft a {
color: black;
padding: 1px 0 0 60px;
border-bottom: 1px solid silver;
display: block;
}
#navileft a:hover,
#navileft a:focus,
#breastcare #navileft0101 a,
#digitalmammography #navileft0102 a,
#excellentimagequality #navileft0103 a,
#insightview #navileft0104 a,
#tomosynthesis #navileft0105 a,
#manyquestions-oneanswer #navileft0106 a,
#digitalbreastbiopsy #navileft0201 a,
#betteraccess #navileft0202 a,
#safeprocedures #navileft0203 a,
#confirm-x #navileft0204 a,
#analogmammography #navileft0301 a,
#analogbiopsy #navileft0302 a
{
color: black;
background: url(images/arrow-blue.gif) 0 4px no-repeat;
}
#headline {float: right;
width: 650px;
padding: 30px 10px 20px 20px;
color: #476987}
#text { float: right;
width: 650px;
padding: 10px 10px 20px 10px;
background: url(images/background-content.jpg) top left no-repeat;
min-height:400px;}
#text ul {list-style-type: bullet;
margin-left: 25px;
}
#text p {
line-height: 150%;
}
#text a {
border-bottom: 1px dotted #EBEAEC;
}
#text a:hover,
#text a:focus {
border-bottom: 1px solid #EBEAEC;
}
.em {line-height: 150%;
font-size: 110%;
font-weight: bold;
color: #476987;}
#boxright {float: right;
padding: 0 10px;
margin-left: 10px;
width: 200px;
background: white;}
#boxright p {margin: 0;
padding: 0;
line-height:10px;
font-size:10px;}
#boxright ul { margin: 0;
}
#boxright li {
list-style-type: none;
margin: 8px 0 /* war vorher 10px für rechts */
}
#boxright li a {
border-bottom: 0;
color: black;
background: url(images/arrow-blue-off.gif) 0 4px no-repeat;
padding: 1px 0 0 10px;
display: block;
}
#boxright a {
border-bottom: 0;
color: black;
background: url(images/arrow-blue-off.gif) 0 4px no-repeat;
padding: 1px 0 0 60px;
display: block;
}
#boxright a:hover,
#boxright a:focus,
#aboutIMS-location #boxright01 a,
#aboutIMS-patent #boxright02 a,
#aboutIMS-bologna #boxright03 a
{
color: black;
background: url(images/arrow-blue.gif) 0 4px no-repeat;
border-bottom: 0;
}
/*
Where we are
Giotto Image patent
More about Bologna
*/
#newslinks {float: left;
width: 300px;
background: url(images/background-news.jpg) top left no-repeat;
padding: 10px 0 0 10px;}
#newsrechts {float: right;
width: 300px;
background: url(images/background-news.jpg) top left no-repeat;
padding: 10px 0 0 10px;}
#fussbereich {
clear: both;
padding: 10px 10px 10px 30px;
background: #EBEAEC;
}
/* ====================================
3. Sonstige Styles
==================================== */
/* Das Kontaktformular */
form {
background-color: #fff;
width: 500px; /* Breite des Formulars */
padding: 20px;
/*border: 1px solid #8c8c8c;*/
}
/* Beschriftung auf eigener Zeile */
label {
display: block;
cursor: pointer;
}
input#absender,
textarea {
width: 400px;
border: 1px solid #8c8c8c;
margin-bottom: 1em;
}
textarea {
height: 7em;
}
input#input {width: 400px}
input#absender:focus,
textarea:focus {
background-color: #d9d9d9;
}
/* =======================================
E N D E D E S S T Y L E S H E E T S
======================================= */