/* ----- Reset----- */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td {margin: 0; padding: 0;}
table {border-collapse: collapse; border-spacing: 0;}
fieldset,img {border: 0;}
address,caption,cite,code,dfn,em,strong,th,var {font-style: normal; font-weight: normal;}
ol,ul {list-style: none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%;}
q:before,q:after {content:'';}

/* --- over coming the styles that Typo3 makes until I can turn them off... ---- */

#sidebar dl, #sidebar dt, #content dl, #content dt {padding: 0; margin: 0;}



/* ----- Grid ----- */
p, ul, ol {margin: 0 0 18px 0;}

/* ----- CSS ----- */

*{
}	
html {
}	
body {font-family: "Lucida Grande", sans-serif; font-size: 12px; line-height: 18px; 
  background-color: #313131; color: #fff; margin: 0 0 54px 0; text-shadow: 0 0 0 #313131;}

/* ----- IDS ----- */
	
#content {margin: 37px 160px 0 304px; text-align: left;}	
#content img {margin: 0 0 18px 0;} 
#content p {margin-right: 20px;}
#content a.collectionLink, #content a.downloads, #downloads #content a, #content a.download {display: block; float: right; padding: 0 0 0 18px; text-transform: uppercase;
  text-decoration: none; background: url('images/pfeil_small.png') 0 3px no-repeat;}
#content a.collectionLink, #content a.downloads {margin-right: 20px;}
#content a.collectionLink:hover, #downloads #content a:hover {text-decoration: underline;}

#referenzen #content {  }
#referenzen #content p {margin: 0; width: 158px; float: right;}
#referenzen #content p img { margin: 0 0 14px 14px; float: right;} 
#referenzen #content p a.download { display: static; background: none; padding: 0}

#referenzen #content { margin-right: 0; }
#referenzen #content img {}


#display {height: 304px; overflow: hidden;}

#header {height: 304px; overflow: hidden;}

a#home {display: block; position: absolute; top: 0; left: 0; width: 304px; height: 144px; z-index: 1; text-indent: -10000px;
  background: url('images/logo.png') no-repeat;}

#navigation {height: 30px; margin: 10px 0 0 0;}	

#subnav {position: absolute; left: 0; top: 376px; width: 290px;}

#sidebar {position: absolute; left: 780px; -26px; top: 381px; width: 170px; font-size: 11px; text-align: left; 
  padding-bottom: 80px; }
#sidebar h2 {margin-top: 10px;}
#sidebar img { margin-bottom: 14px;}



#sidebar a {text-decoration: underline;}
#sidebar a:hover {text-decoration: underline;}
#sidebar h2 {margin: 0 0 0 0;}

#teamPhoto {width: 462px; height: 280px; background: #313131 url('images/team_foto.png') no-repeat;}
#teamPhoto ul {margin: 0 10px 0 30px;}
#teamPhoto ul li {display:block; float: left; width: 100px; height: 200px; text-indent: -10000px; cursor: pointer;}

#teamMenu li a {position: absolute;  display: block; background: url('images/transparent.gif'); height: 80px; width: 60px; text-indent: -10000px;}

#teamMenu li a#felixBuechi { left: 480px; top: 400px; }
#teamMenu li a#gillesGobet { left: 590px; top: 420px; }
#teamMenu li a#rolfHintermann { left: 350px; top: 400px; }
#teamMenu li a#claudineCarre { left: 420px; top: 430px; }
#teamMenu li a#regulaBuechi { left: 530px; top: 430px; }
#teamMenu li a#irinaBaumgartner { left: 670px; top: 430px; }


/* ----- CLASSES ----- */

.container { position: relative; width: 924px; margin:0 auto; }
.csc-header {  }
hr.clearboth { clear: both; visibility: hidden; height: 2px; margin: 0 0 16px 0; }



/* ----- HEADINGS ----- */


h1, h2 {font-size: 12px; font-weight: normal; text-transform: uppercase; margin: 0 0 0 0; line-height: 18px;}
h2 {margin: 0 0 18px 0;}
h2 a {text-decoration: none;}
h2 a:hover {text-decoration: underline;}



h3 {font-size: 11px; font-weight: normal; text-transform: uppercase; margin: 0 0 0 0; line-height: 18px;}
h4 {font-size: 11px; font-weight: normal; margin: 0 0 18px 0; line-height: 18px;}


/* ----- PARAGRAPHS ----- */

p {margin: 0 0 18px 0;}


/* ----- QUOTES ----- */

blockquote {}
blockquote p {}
cite {}
blockquote cite {}

/* ----- CODE ----- */

pre {}
code {}
p code {}
pre code {}

/* ----- LISTS ----- */

li {}
li p {}
ol {}
ul {}
ol li {}
ul li {}


/* ---- MainNav ---- */

#navigation ul {margin: 0;}
#navigation li {float: left;}
#navigation li a {display: block; float: left; height: 30px; text-indent: -10000px; 
  background-position: left 0; background-repeat: no-repeat;}
#navigation li.active a {background-position: left -30px;}
#navigation li a:hover {background-position: left -30px;}


/*  ---- German Navigation ---- */

#navigation li a#ueber-uns {width: 87px;  margin: 0 8px 0 -17px; background-image: url('images/ueber_uns.png');}
#navigation li a#produkte {width: 97px; margin: 0 2px 0 0; background-image: url('images/produkte.png');}
#navigation li a#systemloesungen {width: 148px; margin: 0 2px 0 0; background-image: url('images/systemloesungen.png');} 
#navigation li a#referenzen {width: 114px; margin: 0 2px 0 0; background-image: url('images/referenzen.png');} 
#navigation li a#reinegung-pflege {width: 190px; margin: 0 2px 0 0; background-image: url('images/reinigung_pflege.png');} 
#navigation li a#information {width: 132px; margin: 0 2px 0 0; background-image: url('images/information.png');} 
#navigation li a#links {width: 74px; margin: 0 2px 0 0; background-image: url('images/links.png');} 
#navigation li a#kontakt {width: 79px; margin: 0 0 0 0; background-image: url('images/kontakt.png');} 


/*  ---- French Navigation ---- */

#navigation li a#a-notre-sujet {width: 113px;  margin: 0 8px 0 -15px; background-image: url('images/a_notre_sujet.png');}
#navigation li a#produits {width: 87px; margin: 0 2px 0 0; background-image: url('images/produits.png');}
#navigation li a#solutions-technique {width: 170px; margin: 0 2px 0 0; background-image: url('images/solutions_technique.png');} 
#navigation li a#references {width: 107px; margin: 0 2px 0 0; background-image: url('images/references.png');} 
#navigation li a#entretien-et-nettoyage {width: 186px; margin: 0 2px 0 0; background-image: url('images/entretien_nettoyage.png');} 
#navigation li a#informations {width: 120px; margin: 0 2px 0 0; background-image: url('images/informations.png');} 
#navigation li a#liens {width: 62px; margin: 0 2px 0 0; background-image: url('images/liens.png');} 
#navigation li a#contact {width: 72px; margin: 0 0 0 0; background-image: url('images/contact.png');}



#subnav ul { width: 340px; position: absolute; right: 0; text-align: right;  font-size: 24px; margin: -6px -3px 0 0; }
#subnav li { margin: 0 0 12px 0; padding: 8px 0 0 0; text-transform: uppercase; }
#subnav li a { display: block; height: 27px;  background: none; text-decoration: none; 
  padding-left: 20px; color: #5c5c5c; }
#subnav li.active a, #subnav li a:hover { background: none; color: white; }
#subnav li a#magasins-specialises-poseurs, #subnav li a#fachgeschäfte-verleger { display: block; margin: 0 0 36px 0; }   


/* ----- Language Nav ----- */

#languages {position: absolute; right: 0; top: 270px; width: 160px;}
#languages li {float: left;}
#languages li a {display: block; float: left; height: 30px; width: 70px; margin-left: 10px; text-indent: -10000px; 
  background-position: left 0; background-repeat: no-repeat;}
#languages li a:hover {background-position: 0 -30px;}
#languages li a#deutsch {background-image: url('images/deutsch.png');}
#languages li a#francais {background-image: url('images/francais.png');}

/* ----- IMAGES ----- */

img {}
img a {}
img a:hover {}

/* ----- BREAK ----- */

hr {}

/* ----- TEXT FORMATTING ----- */

strong { font-weight: bold; }
em {}
b { font-weight: bold; }
i {}

/* ----- LINKS ----- */

a {color:white; text-decoration: underline;}
a:focus {-moz-outline-style:none}
a:hover {text-decoration: underline;}
a:visited, a:active, a:focus {}
a:visited {}
a:active {}


p a {}
cite a {}
li a {}
dt a {}
dd a {}

/* ----- TABLES ----- */

table {font-family: "Lucida Grande", sans-serif; font-size: 12px; line-height: 18px; }
#referenzen table { margin: 9px 0 36px 0; }
#referenzen table td { padding-right: 27px; vertical-align: top; text-align: left; }

caption {}
thead {}
tbody {}
tfoot {}
tr {}
tr .alt {}
th {}
td {}

td.csc-uploads-fileName a {text-decoration: none; padding: 0 0 0 18px; background: url('images/pfeil_small.png') 0 1px no-repeat;}
td.csc-uploads-fileName a:hover {text-decoration: underline;}

/* ----- FORMS ----- */

form {}
fieldset {}
legend {}
label {}
input {}
textarea {}
input, textarea {}
select {}
optgroup {}
option {}

/* ----- DEFINITIONS ----- */

dl {}
dt {}
dd {}