
/*
 * MON DUESSELDORF CSS
 *
 * @filename    mon-duesseldorf.css
 * @author      Philip Mews
 * @date        29-03-2007
 * @copyright   mon.de GmbH / Düsseldorf
 * @url         http://www.mon-duesseldorf.de
 */



* {
margin : 0;
padding : 0;
border : 0;
}
html {
height : 100%;
}
body {
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 0.8em;
background : #7186a0 url(../img/bg_body.jpg) repeat-x;
color : #333;
text-align : center;
}
:focus { 
outline: 0;
}
img {
border : none;
}
ul, li {
list-style : none;
}
.clearfix:after {
content : ".";
display : block;
height : 0;
clear : both;
visibility : hidden;
}
.clearfix {
display : inline-block;
}
.clearfix {
display : block;
}
* html .clearfix {
height : 1px;
}
#head {
height : 99px;
}
#navi {
height : 32px;
background : url(../img/bg_navi.jpg) no-repeat 50% 0;
}
#navi.homepage {
height : 32px;
background : url(../img/bg_navi_home.jpg) no-repeat 50% 0;
}
#banner {
height : 100px;
padding : 0;
}
#main {
background : #fff;
padding : 20px 0 20px 0;
margin : 0 auto;
}

#noflash {
width : 640px;
height : 100px;
margin : 0;
padding : 0;
overflow : hidden;
}
.fix900 {
width : 900px;
text-align : left;
margin : 0 auto;
padding : 0;
}
.fix900ref {
padding-left : 20px;
}
.fix640 {
width : 640px;
float : left;
}
.fix600 {
width : 600px;
float : left;
}
.fix450 {
width : 450px;
float : left;
}
.fix380 {
width : 380px;
float : left;
}
.fix320 {
width : 320px;
float : left;
}
.fix300 {
width : 300px;
float : left;
}
.fix260 {
width : 260px;
float : left;
}
#headright.homepage {
width : 260px;
height : 100px;
float : left;
text-align : center;
background : url(../img/bg_head-right.jpg) no-repeat;
}
.headright {
width : 260px;
height : 100px;
float : left;
text-align : center;
}
a:link, a:visited, a:active {
color : #0099ff;
text-decoration : none;
}
a:hover {
color : #ff6633;
text-decoration : none;
}
h1, h2, h3, h4, h5 {
font-family : "Lucida Sans Unicode", "Lucida Grande", "Trebuchet MS", sans-serif;
font-weight : normal;
color : #2a57a5;
}
h1 {
margin : 0;
font-size : 1.4em;
}
h2 {
margin : 10px 20px 10px 20px;
font-size : 1.4em;
}
h3 {
margin : 10px 20px 10px 20px;
font-size : 1.4em;
}
h4 {
margin : 10px 0 0 0;
font-size : 1.4em;
}
h5 {
margin : 10px 20px 10px 40px;
font-size : 1em;
}
p {
padding : 10px 20px 10px 20px;
line-height : 1.6em;
}
p.intro {
padding : 10px 20px 10px 20px;
line-height : 1.6em;
}
p.box {
padding : 10px 20px 10px 20px;
line-height : 1.6em;
}
p.info {
padding : 0 10px 10px 5px;
}
p.info a {
background : transparent url(../img/news_pfeil.gif) no-repeat 15px 50%;
color : #0099ff;
border : 0;
padding : 0 0 0 35px;
}
p.info a:hover {
background : transparent url(../img/news_pfeil2.gif) no-repeat 15px 50%;
color : #ff6633;
border : 0;
}
em {
font-style : italic;
}
.left {
float : left;
}
.right {
float : right;
}
.hide {
display : none;
}
.clear {
clear : both;
}
.col-right-innen {
margin : 0 10px 0 10px;
}
.border-bot {
border-bottom : 2px solid #e0e6ec;
}
.border-box {
border-top : 1px solid #e0e6ec;
}
.border-box2 {
border-top : 1px solid #e0e6ec;
border-left : 1px solid #e0e6ec;
}
hr {
margin : 1em 0;
display : none;
}
.imgleft {
float : left;
padding: 10px 20px 0px 20px;
}
.imgright {
float : right;
padding: 10px 20px 0px 20px;
}
.imgrightbo {
float : right;
padding: 5px;
margin: 10px 20px 10px 20px;
border:1px solid #e0e6ec;
}
.imgleftbo {
float : left;
padding: 5px;
margin: 10px 20px 10px 0px;
border:1px solid #e0e6ec;
}
.imgcenter {
background-position : center 0%;
}
#head div.homepage {
width : 900px;
height : 99px;
margin : 0 auto;
position : relative;
background : url(../img/bg_header_div.gif) no-repeat 50% 0;
}
#head div {
width : 900px;
height : 99px;
margin : 0 auto;
position : relative;
}
#head div a.mon-logo {
width : 201px;
height : 47px;
left : 40px;
top : 30px;
border : none;
background : url(../img/MON-Duesseldorf-Webdesign.gif) no-repeat 0 0;
position : absolute;
}
#head div a:hover.mon-logo {
background : url(../img/MON-Duesseldorf-Webdesign.gif) no-repeat 0 -47px;
}
#head div a.mon-kontakt {
width : 201px;
height : 47px;
position : absolute;
right : 35px;
top : 30px;
border : none;
background : url(../img/MON-kontakt.gif) no-repeat 0 0;
}
#head div a:hover.mon-kontakt {
background : url(../img/MON-kontakt.gif) no-repeat 0 -47px;
}
menu {
background : url(../img/bg_navi.jpg) no-repeat 0 0;
width : 900px;
height : 32px;
margin : 0 0 0 0;
}
#menu span {
display : none;
}
#menu li, #menu a {
height : 32px;
display : block;
border : none !important;
text-decoration : none;
}
#menu li {
float : left;
list-style : none;
display : inline;
}
#menu-start {
width : 157px;
}
#menu-leistungen {
width : 133px;
}
#menu-referenzen {
width : 136px;
}
#menu-agentur {
width : 109px;
}
#menu-kontakt {
width : 105px;
}
#menu-start a:hover, #start #menu-start a:visited, #menu-start.selected {
background : transparent url(../img/bg_navi.jpg) no-repeat 0 -32px;
}
#menu-leistungen a:hover, #leistungen #menu-leistungen a:visited, #menu-leistungen.selected {
background : transparent url(../img/bg_navi.jpg) no-repeat -157px -32px;
}
#menu-referenzen a:hover, #referenzen #menu-referenzen a:visited, #menu-referenzen.selected {
background : transparent url(../img/bg_navi.jpg) no-repeat -290px -32px;
}
#menu-agentur a:hover, #agentur #menu-agentur a:visited, #menu-agentur.selected {
background : transparent url(../img/bg_navi.jpg) no-repeat -426px -32px;
}
#menu-kontakt a:hover, #kontakt #menu-kontakt a:visited, #menu-kontakt.selected {
background : transparent url(../img/bg_navi.jpg) no-repeat -535px -32px;
}
#footer {
color : #333;
clear : both;
line-height : 1.5em;
margin : 10px 0px 0px 0px;
padding : 20px;
}
#footer p {
color : #e0e6ec;
}
#footer a, #footer a:visited, #footer a:active {
color : #e0e6ec;
text-decoration : underline;
}
#footer a:hover {
color : #ff6633;
text-decoration : none;
}
div.mon-portfolio {
float : left;
margin : 10px 10px 30px 0;
}
div.mon-portfolio img {
margin : 0;
padding : 0;
}
div.mon-portfolio p {
margin : 0;
padding : 0;
}
div.mon-portfolio p a:link, div.mon-portfolio p a:visited, div.mon-portfolio p a:active {
border : 1px solid #e0e6ec;
display : block;
}
div.mon-portfolio p a:hover {
border : 1px solid #0099ff;
display : block;
}
ul.thumbs {
list-style : none;
margin : 10px 0 5px 30px;
padding : 0;
}
ul.thumbs li {
float : left;
padding : 0;
margin : 5px;
position : relative;
}
ul.thumbs li a img {
border : 1px solid #e0e6ec;
}
ul.thumbs li a:hover img {
border : 1px solid #ff6633;
}
ul.mon-nachrichten {
clear : both;
margin : 1.4em 0;
}
ul.mon-nachrichten li.weihnachten {
border : 3px dotted #fff;
background: #AAB6C6;
color: #ffffff;
display : block;
margin : 0.5em 0;
padding : 5px;
}
ul.mon-nachrichten li {
border : 1px solid #e0e6ec;
display : block;
margin : 0.5em 0;
padding-right : 0;
}
ul.mon-nachrichten li span {
color : #0099ff;
padding-right : 2em;
}
ul.mon-nachrichten li strong {
background : url(../img/news_eck.gif) no-repeat 0% 50%;
color : #2a57a5;
padding-left : 1em;
font-weight : normal;
}
ul.mon-nachrichten li a {
background : url(../img/news_pfeil.gif) no-repeat 95% 50%;
color : #333;
display : block;
margin : 0;
padding : 0.5em 3em 0.5em 0.5em;
}
ul.mon-nachrichten li a:visited {
background : url(../img/news_pfeil.gif) no-repeat 95% 50%;
color : #333;
}
ul.mon-nachrichten li a:hover {
background : #e0e6ec url(../img/news_pfeil2.gif) no-repeat 95% 50%;
border : 0;
color : #2a57a5;
display : block;
}
ul.mon-content {
clear : both;
margin : 20px 0 40px 0;
width : 320px;
}
ul.mon-content li {
border : 1px dotted #e0e6ec;
display : block;
margin : 10px 10px 10px 10px;
padding : 0.5em 0.5em 0.5em 3.5em;
background : transparent url(../img/list_pfeil.gif) no-repeat 20px 50%;
}
ul.mon-content li span {
margin : 0;
}
ul.mon-content li span.blau {
margin : 0;
color : #2a57a5;
}
ul.mon-content li a {
color : #0099ff;
display : block;
margin : 0;
}
ul.mon-content li a:visited {
color : #0099ff;
}
ul.mon-content li a:hover {
border : 0;
color : #ff6633;
display : block;
}
ul.content-norm {
clear : both;
margin : 20px 0 20px 0;
}
ul.content-norm li {
display : block;
margin : 0 0 0.5em 0;
padding : 0 0 0 20px;

}
ul.content-norm li strong {
color : #2a57a5;
padding-left : 2em;
}
ul.content-norm li span {
color : #2a57a5;
padding-right : 2em;
}
ul.content-norm li a {
color : #0099ff;
font-weight : normal;
margin : 0;
padding : 0 0 0 0px;
}
ul.content-norm li a:visited {
color : #0099ff;
}
ul.content-norm li a:hover {
border : 0;
color : #ff6633;
}
ul.mon-navi-right {
clear : both;
margin : 20px 0 20px 0;
}
ul.mon-navi-right li {
border : 1px solid #e0e6ec;
display : block;
margin : 0 0 0.5em 0;
padding : 0 0 0 40px;
background : transparent url(../img/news_pfeil.gif) no-repeat 20px 50%;
}
ul.mon-navi-right li span {
color : #2a57a5;
font-weight : normal;
display : block;
margin : 0;
padding : 0.2em 0.5em 0.2em 0.5em;

}
ul.mon-navi-right li a {
color : #0099ff;
font-weight : normal;
display : block;
margin : 0;
padding : 0.2em 0.5em 0.2em 0.5em;
}
ul.mon-navi-right li a {
color : #0099ff;
font-weight : normal;
display : block;
margin : 0;
padding : 0.2em 0.5em 0.2em 0.5em;
}

ul.mon-navi-right li a:visited {
color : #0099ff;
}
ul.mon-navi-right li a:hover {
border : 0;
color : #ff6633;
display : block;
}

ul.mon-team {
clear : both;
margin : 20px 0 40px 0;
width : 620px;
}
ul.mon-team li {
border-left : 1px solid #e0e6ec;
border-bottom : 1px solid #e0e6ec;
display : block;
margin : 10px 10px 10px 10px;
padding : 0.5em 0.5em 0.5em 3.5em;
background : transparent;
}
ul.mon-team li span {
margin : 0;
}
ul.mon-team li span.blau {
margin : 0;
color : #2a57a5;
}
ul.mon-team li a {
color : #0099ff;
display : block;
margin : 0;
}
ul.mon-team li a:visited {
color : #0099ff;
}
ul.mon-team li a:hover {
border : 0;
color : #ff6633;
display : block;
}
ul.mon-info-right {
border : 1px solid #e0e6ec;
clear : both;
margin : 20px 0 20px 0;
}
ul.mon-info-right li {
display : block;
margin : 5px 0 5px 0;
padding : 0 0 0 40px;
}
ul.mon-info-right li span {
color : #0099ff;
padding-right : 2em;
}
ul.mon-info-right li a {
color : #0099ff;
font-weight : normal;
}
ul.mon-info-right li a:visited {
color : #0099ff;
}
ul.mon-info-right li a:hover {
border : 0;
color : #ff6633;
}
.KONTAKTFORM {
width : 470px;
float : left;
margin : 24px 0 0 20px;
padding : 0;
}
.red {
color : #ff6633;
font-weight : normal;
}
fieldset#mon-kontaktform {
padding : 0;
margin : 0 0 15px 0;
border : none;
position : relative;
}
fieldset#mon-kontaktform input.text {
width : 250px;
border-top : 1px solid #999999;
border-right : 1px solid #cccccc;
border-bottom : 1px solid #cccccc;
border-left : 1px solid #999999;
background : #fff;
padding : 0 5px;
margin : 0 0 15px;
font : normal 0.9em Verdana, Arial, Helvetica, sans-serif;
color : #555555;
height : 19px;
}
fieldset#mon-kontaktform textarea {
width : 250px;
border-top : 1px solid #999999;
border-right : 1px solid #cccccc;
border-bottom : 1px solid #cccccc;
border-left : 1px solid #999999;
background : #fff;
padding : 0 5px;
margin : 0 0 15px;
font : normal 0.9em Verdana, Arial, Helvetica, sans-serif;
color : #555555;
height : 100px;
}
fieldset#mon-kontaktform input.text:focus {
border : 1px solid #0099ff;
background : #fff;
}
fieldset#mon-kontaktform textarea:focus {
border : 1px solid #0099ff;
background : #fff;
}
fieldset#mon-kontaktform select {
width : 100px;
height : 19px;
border-top : 1px solid #999999;
border-right : 1px solid #cccccc;
border-bottom : 1px solid #cccccc;
border-left : 1px solid #999999;
background : #fff;
padding : 0;
margin : 0 0 15px;
font : normal 0.9em Verdana, Arial, Helvetica, sans-serif;
color : #555555;
}
fieldset#mon-kontaktform input.button-kontakt {
border : none;
padding : 20px 0 0;
margin : 0 0 30px 200px;
height : 47px;
width : 201px;
overflow : hidden;
background : url(../img/button-kontaktform.gif) no-repeat left top;
cursor : pointer;
}
fieldset#mon-kontaktform input.button-kontakt:hover {
background : url(../img/button-kontaktform.gif) no-repeat 0 -47px;
}
fieldset#mon-kontaktform select:focus {
border : 1px solid #0099ff;
background : #fff;
}
fieldset#mon-kontaktform label {
border-bottom : 1px solid #e0e6ec;
height : 20px;
margin : 0 0 10px;
width : 200px;
padding : 0 5px 0 0;
clear : left;
display : block;
float : left;
text-align : right;
}
fieldset#mon-kontaktform input.checkbox {
padding : 5px;
margin : 0 100px 15px 20px;
height : 20px;
}

