05@charset "UTF-8";
/* CSS Document */

/*
	NAME //  ALEX SCHMID DIRECT
	AUTHOR // Mathias Kaelin
	VERSION // 1.0
	DATE // 2008-10-1
	
	*********************
	IMPORTANT INFORMATION
	
	Colors // 	Gray rgb(230, 230, 230)		(light)
				Gray rgb(190, 190, 190)		(middel)
				Gray rgb(120, 120, 120)		(dark)
				Blue rgb(125, 150, 205)
				
	Screen Grösse // 650px x 490px
	Cases Grösse // 208px x 155px
	
	 Bildgrösse // 650px x 465px
	
*/

/* HTML Tags */

#preload {
	display:none;
}

* {
	padding:0px;
	margin:0px;
}

a img {
	border:none;
}

a:link {
	color: rgb(125, 150, 205);
	text-decoration:none;
}

a:visited {
	color: rgb(125, 150, 205);
	text-decoration:none;
}

a:hover {
	color: rgb(120, 120, 120);
	text-decoration:none;
}

a:active {
	color: rgb(125, 150, 205);
	text-decoration:none;
}

body {
	font-family: DIN, "Trebuchet MS", Helvetica, Verdana, Arial, sans-serif;
	font-size: 12px;
	line-height: 15px;
	color: rgb(0, 0, 0);
	background:url(../_img/page/background.jpg) no-repeat center top;
}

p {
	margin-bottom:8px;
}

/* Zentrierhilfe */
#center {
	position:absolute;
	height:700px;
	width:1000px;
	top:100px;
	left:50%;
	margin-left: -500px;
	z-index:0;
	}

#maincontainer {
	position:absolute;
	left:0px;
	top:0px;
	height:700px;
	width:1000px;
	background:url(../_img/page/cam_clean.png) no-repeat 0 0;
}

/* Bildschirm */
#screen {
	position:absolute;
	left:92px;
	top:102px;
	width:650px;
	height:490px;
	background-color:rgb(255, 255, 255);
	z-index:1;
}
	
/* Menubar */
#menubar {
	position:absolute;
	left:0px;
	top:0px;
	height:25px;
	width:100%;
	background-color:rgb(230, 230, 230);
	color:rgb(120, 120, 120);
	border-bottom: 1px solid rgb(120, 120, 120);
	}
	
#menubar p {
	padding:6px 0 0 20px;
	letter-spacing:1px;
	font-weight:bold;
}

/* Printer */

#printer {
	position:absolute;
	top:0px;
	right:0;
	height:100%;
	width:99px;
	border-left: 1px solid rgb(120, 120, 120);
	background:url(../_img/buttons/printer.jpg);
}
	
#printer:hover {
	background:url(../_img/buttons/printer_hover.jpg);
}
	
/* Inhalt und scrollbar */
#scrollbar_container {
	position:absolute;
	top:26px;
	width:100%;
	height:465px;
}

#scrollbar_content {
	position:absolute !important;
	top:50px;
	left:20px;
	width:580px;
	height:425px;
	overflow:hidden;
	display:none;
	}
	
#scrollbar_content p {
	padding-bottom:7px;
	}

#more_sites {
	position:absolute;
	top:0px;
	right:99px;
	height:100%;
	width:200px;
	z-index:6;
	border-right: 1px solid rgb(120, 120, 120);
	text-align:right;
	}
	
#more_sites p {
	padding:5px 20px 0 5px;
	font-weight:bold;
	}
	
#more_sites p span {
	cursor:pointer;
}

/* Scrollbar */
#scrollDiv {
	position:absolute;
	top:26px;
	width:100%;
	height:465px;
}

#scrollDiv .viewport {
	position: relative;
	width: 635px;
	height:100%;
	overflow: hidden;
}
#scrollDiv .overview {
	position: absolute;
	left: 0;
	top: 0;
	padding: 20px 20px 20px 20px;
	margin: 0;
	list-style: none;
}

#scrollDiv .scrollbar {
	background: rgb(230, 230, 230);
	position: relative;
	float: right;
	width: 10px;
}
#scrollDiv .track {
	height: 100%;
	width:10px;
	position: relative;
}
	
#scrollDiv .thumb {
	background:rgb(125, 150, 205);
	height: 20px;
	width: 10px;
	cursor: pointer;
	overflow: hidden;
	position: absolute;
	top: 0;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
}
#scrollDiv .disable { display: none; }

/* MENU PUNKTE */

/* Button Popup */
#loader {
	position:absolute;
	top:230px;
	left:790px;
	height:30px;
	width:30px;
	background:url(../_img/page/loader.png) 0 0 no-repeat;
}

.button {
	position:absolute;
	height:76px;
	width:76px;
}

#home {
	left:870px;
	top:100px;
	background:url(../_img/buttons/home.png) 0 0 no-repeat;
}

#team {
	left:880px;
	top:185px;
	background:url(../_img/buttons/team.png) 0 0 no-repeat;
}

#news {
	left:882px;
	top:452px;
	background:url(../_img/buttons/news.png) 0 0 no-repeat;
}

#kontakt {
	left:870px;
	top:535px;
	background:url(../_img/buttons/kontakt.png) 0 0 no-repeat;
}

.button:hover {
	background-position: 0 -76px !important;
}

.popup {
	position:absolute;
	left:0;
	top:0;
	width:76px;
	height:76px;
	display:none;
	background:rgb(125, 150, 205);
	border-radius: 40px; /* W3C Standard, Opera */
	-moz-border-radius :  40px; /* Firefox */
	-webkit-border-radius: 40px; /* Safari, Chrome */
	z-index:15;
	text-align:center;
	cursor:pointer;

}

.popup span {
	position: absolute;
	top:30px;
	left:0;
	width:100%;
	text-align:center;
	font-size:15px;
	color:rgb(255, 255, 255);
}
	
/* old popups
.popup {
	position:absolute;
	left:-135px;
	width:135px;
	top:15px;
	height:50px;
	background:url(../_img/page/pupup.png) 0 0 no-repeat;
	display:none;
	z-index:15;
}

.popup span {
	position:absolute;
	margin:14px 0 0 14px; !important;
	font-size:16px;
	color:rgb(255, 255, 255);
}*/
	
#ok-button {
	position:absolute;
	left:49px;
	top:46px;
	height:59px !important;
	width:59px !important;
	background:url(../_img/buttons/ok.png) 0 0 no-repeat;
	}

#ok-button:hover {
	cursor:default;
	background:url(../_img/buttons/ok.png) 0 -59px no-repeat;
}

/* WHEEL */

#wheel {
	position:absolute;
	left:801px;
	top:279px;
	height:154px;
	width:157px;
}
	
#wheel>div {
	position:absolute;
	cursor:pointer;
}
	
/* WHEEL SENSOREN */
	
#wheel-up {
	height:40px;
	width:60px;
	left:49px;
	top:0px;
}
	
#wheel-right {
	height:60px;
	width:40px;
	top:45px;
	right:0px;
}
			
#wheel-down {
	height:40px;
	width:60px;
	left:49px;
	bottom:0px;
}
	
#wheel-left {
	height:60px;
	width:40px;
	top:45px;
	left:0px;
}
	
/* Navitation */
/* Menu */
.menu  {
	position:absolute;
	top:10px;
	left:0px;
	height:100%;
	width:100%;
	overflow:none;
}

.menu li.four {
	list-style:none;
	height:230px;
	width:323px;
	float:left;
	border:1px solid rgb(190, 190, 190);
	background-position: 0 -230px;
}

.menu li.four:hover, li.four.hover {
	background-position: 0 0 !important;
	border:1px solid rgb(125, 150, 205) !important;
}

/* einzelne Menupunkte */
.kompetenzen {
	background-image:url(../_img/navigation/kompetenzen.jpg);
}

.referenzen {
	background-image:url(../_img/navigation/referenzen.jpg);
}

.news {
	background-image:url(../_img/navigation/news.jpg);
}

.agentur {
	background-image:url(../_img/navigation/agentur.jpg);
}

.facts {
	background-image:url(../_img/navigation/facts.jpg);
}

.team {
	background-image:url(../_img/navigation/team.jpg);
}

.jobs {
	background-image:url(../_img/navigation/jobs.jpg);
}

.kundenliste {
	background-image:url(../_img/navigation/kundenliste.jpg);
}

.polygraf {
	background-image:url(../_img/navigation/polygraf.jpg);
}

.planer {
	background-image:url(../_img/navigation/planer.jpg);
}

.screendesigner {
	background-image:url(../_img/navigation/screendesigner.jpg);
}

.praktikant {
	background-image:url(../_img/navigation/praktikant.jpg);
}
	
.menuNine li {
	display:block;
	width:214px;
	height:153px;
	background-position: 0 -153px;
	background-repeat:no-repeat;
	float:left;	
	border: 1px solid rgb(120, 120, 120) !important;
}

.menuNine li:hover, .menuNine li.hover {
	background-position:0 0 !important;
	border: 1px solid rgb(125, 150, 205) !important;

}
.menuNine li.sbb {
	background-image:url(../referenzen/_img/sbb.png);
}
.menuNine li.manor {
	background-image:url(../referenzen/_img/manor.png);
}
.menuNine li.healthcare {
	background-image:url(../referenzen/_img/healthcare.png);
}
.menuNine li.gauloises {
	background-image:url(../referenzen/_img/gauloises.png);
}
.menuNine li.ubs {
	background-image:url(../referenzen/_img/ubs.png);
}
.menuNine li.mercedesbenz {
	background-image:url(../referenzen/_img/mercedesBenz.png);
}
.menuNine li.ringier {
	background-image:url(../referenzen/_img/ringier.png);
}
.menuNine li.nespresso {
	background-image:url(../referenzen/_img/nespresso.png);
}
.menuNine li.swissindoors {
	background-image:url(../referenzen/_img/swissindoors.png);
}

/* weitere Elemente */
#FlashID {
	margin-bottom:15px;
}
#skip {
	position:relative;
	padding:22px 0 0 590px;
	z-index:500;
}

#skip a {
	background:rgb(230, 230, 230);
	font-size:13px;
	font-weight:bold;
	padding:5px 10px 5px 10px;
	color:rgb(120, 120,120);
}

#skip a:hover {
	background:rgb(125, 150, 205);
	color:rgb(255,255,255)
}

#kundenlisteList li {
	list-style:none;
	margin:0 15px 15px 0;
	float:left;
}

#kundenlisteList td img {
	margin:0 15px 15px 0;
}

#photo {
	position:absolute;
	bottom:0px;
	left:0px;
	width:650px;
	height:464px;
	z-index:2;
	}

#info {
	position:absolute;
	bottom:0px;
	left:0px;
	width:100%;
	z-index:10;
	background:#000000;
	filter: alpha(opacity=70); -moz-opacity: 0.70; opacity: 0.70;
	}

#info p {
	padding: 5px 10px 10px 10px;
	color:rgb(255, 255, 255);
	}


/* wird gelöscht */
#kundentext {
	position:absolute;
	bottom:20px;
	left:20px;
	width:600px;
	background-color:#000000;
	color:rgb(255, 255, 255);
	padding:12px 10px 10px 10px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	filter: alpha(opacity=80); -moz-opacity: 0.80; opacity: 0.80;
	z-index:10;
}

#kundentext-close {
	position:absolute;
	left:0;
	top:0;
	height:100%;
	width:100%;
	z-index:9;
}

#kundentext h1 {
	font-size:20px;
	font-weight:normal;
	color:#fff;
	border-bottom:1px solid #fff;
	padding:4px 0 2px 0;
	margin:0;
	width:100%;
	}

#kundentext p {
	color:#FFF;
}

#kundentext .close {
	position:absolute;
	top:0px;
	right:0px;
	height:17px;
	width:17px;
	background-color:#FFF;
	background-image:url(../_img/page/close.png);
}

#jobDetail {
	padding:20px !important;
}
/* Formulare */
#formular {
	height:100%;
	width:100%;
	margin:15px 0 0 0;
	}
	
#formular td {
	padding:3px 0 3px 5px;
	}

#formular h2 {
	font-size:16px;
	font-weight:normal;
	color:rgb(120, 120, 120);
	padding: 20px 0 5px 0;
	}
	
.gray1 {
	background-color:#f7f7f7;
	}
	
.gray2 {
	background-color:#efefef;
	}
	
input {
	font-family: DIN, "Trebuchet MS", Helvetica, Verdana, Arial, sans-serif;
	font-size:12px;
	border:none;
	padding:5px;
	margin:2px 0 2px 0;
	color: rgb(125, 150, 205);
	width:230px;
	background-color:rgb(255, 255, 255);
	}
	
textarea {
	font-family: DIN, "Trebuchet MS", Helvetica, Verdana, Arial, sans-serif;
	font-size:12px;
	border:none;
	padding:5px;
	margin:2px 0 5px 0;
	color: rgb(125, 150, 205);
	width:200px;
	background-color:rgb(255, 255, 255);
	}

select {
	font-family: DIN, "Trebuchet MS", Helvetica, Verdana, Arial, sans-serif;
	font-size:12px;
	line-height: 15px;
	border:1px solid rgb(120, 120, 120);
	padding:8px 0 0 5px;
	margin:2px 0 5px 0;
	color: rgb(125, 150, 205);
	height:28px;
	background-color:rgb(255, 255, 255);
	}

select option {
	padding:5px;
	}

.checkbox {
	border:none;
	margin:0 5px 0 0;
	}
	
.radio {
	margin:0 3px 0 15px ;
	display:inline;
	width:10px;
	}
	
.star {
	color:#CC0000;
	}

.select {
	height:28px;
	width:95px;
	padding:4px 0 0 0;
	margin-bottom:5px;
	}
	
.blue {
	color: rgb(125, 150, 205);
	}

/* Schriften */
h1 {
	font-size:20px;
	font-weight:normal;
	color:rgb(125, 150, 205);
	border-bottom:1px solid rgb(125, 150, 205);
	padding:4px 0 2px 0;
	margin:0;
	width:100%;
	}
	
h1+p {
	padding:15px 0 0 0;
	}

h2 {
	font-size:16px;
	font-weight:normal;
	color:rgb(120, 120, 120);
	padding: 15px 0 5px 0;
	}

h3 {
	font-size:12px;
	color:rgb(120, 120, 120);
	padding: 10px 0 0px 0;
	}
	
.img-right {
	display:block;
	margin-left:10px;
	margin-bottom:10px;
	}
	
.img-left {
	display:block;
	margin-right:10px;
	margin-bottom:10px;
	}
		
.important {
	font-weight:bold;
	color:rgb(120, 120, 120);
}


/* NEWS */
.monat {
	text-align:right;
	background-color:rgb(120, 120, 120);
	color:rgb(255, 255, 255);
	padding:8px 20px 4px 2px;
}
	
.monat a:link, .monat a:visited, .monat a:hover, .monat a:active {
	color: rgb(125, 150, 205);
	text-decoration:none;
	}

.content {
	margin: 8px 0 8px 0;
	border-bottom: solid 1px rgb(190, 190, 190);
	border-top: solid 1px rgb(190, 190, 190);
	padding:8px 0 0px 0;
	}
	
.content h1 {
	border:none;
	font-size:16px;
	color:rgb(125, 150, 205);
	padding: 0 0 8px 0;
	}
	
.content h2 {
	border:none;
	font-size:12px;
	color:rgb(125, 150, 205);
	padding: 4px 0 4px 0;
	}
	
.content p {
	padding: 0;
	padding: 0 0 8px 0;
	}

.content img {
	padding: 0 0 8px 0;
	}
	
.news-link, .news-link a, .news-link a:link, .news-link a:visited, .news-link a:hover, .news-link a:active {
	display:inline-block;
	background-color:rgb(230, 230, 230);
	color:rgb(255, 255, 255);
	padding:2px 5px 2px 5px;
	margin: 0 0 3px 0;
	}
	
.frage {
	font-weight:bold;
	font-style:italic;
	color:rgb(120, 120, 120);
	margin:15px 0 5px 0;
	}
	
.italic {
	font-style:italic;
	}

/* Tabellen */

table {
	vertical-align:top;
	}
	
td {
	vertical-align:top;
	}

.table td {
	padding:4px 0 4px 4px;
	}

.table_gray {
	background-color:rgb(190, 190, 190);
	color:#ffffff;
	}
	
.white {
	background-color:#ffffff;
	color:#949494;
	}
	
.legende {
	font-size:8px;
	color:#AAAAAA;
	font-style:oblique;
	letter-spacing:1px;
	padding:3px 0 5px 0;
	}
	
.hidden {
	visibility:hidden;
	}
	
.nodisplay {
	display:none;
}
	
.job {
	color:rgb(125, 150, 205);
	font-weight:bold;
	}

ul {
	display: block;
	list-style-position: inside;
	list-style-type:disc;
}

/* team und so */
#teamOverview ul {
	height:100%;
	width:652px;
}

#teamOverview ul li {
	width:163px;
	height:116px;
	float:left;
	list-style:none;
	background-position:0 0 ;
}

#teamOverview ul li:hover, #teamOverview ul.menu li.hover {
	background-position: 0 -116px;
}

.teamInfo  {
	position:absolute;
	left:0;
	width:100%;
	padding: 8px 0 5px 20px;
	bottom:20px;
	background: rgba(0, 0, 0, 0.6);
	color: rgb(255, 255, 255);
	font-size:13px;
	line-height:17px;
}
.teamInfo h1 {	
	font-size:16px;
}

.teamInfo p {
	color:#FFF;
	padding-top:5px !important;
}
#referenzenDetail ul li img {
	position:absolute;
	left:0;
	top:0;
}

#personel-info {
	position:absolute;
	bottom:20px;
	left:20px;
	width:600px;
	background-color:#000000;
	color:rgb(255, 255, 255);
	padding:12px 10px 10px 10px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	filter: alpha(opacity=70); -moz-opacity: 0.70; opacity: 0.70;
	visibility:hidden;
}
	
#personel-info p {
	}
	
.name {
	font-family:Arial, Helvetica, sans-serif;
	font-size:24px;
	color:rgb(125, 150, 205);
	padding:0 0 5px 0;
	}
	
.pfeil {
	font-size:20px;
	font-weight:bold;
}

#stoerer {
	position:absolute;
	top:410px;
	left:-38px;
	height:145px;
	width:148px;
	background:url(../_img/dialogin_stoerer.png) no-repeat 0 0 ;
	z-index:30;
	cursor:pointer;
}

/* Referenzen neu */
#referenzenOverview {
	height:100%;
	width:650px;
	background:rgb(0, 0, 0);
}

#referenzenOverview ul li {
	list-style:none !important;
}

#referenzenDetail, #teamDetail {
	position:absolute;
	height:465px;
	width:650px;
	overflow:hidden;
}

#referenzenDetail ul, #teamDetail ul {
	position:absolute;
	top:0;
	left:0;
	width:6000%;
	overflow:hidden;
}

#referenzenDetail ul:first-child {
	background:url(../referenzen/_img/consumer_background.png) no-repeat;
}

#referenzenDetail ul li, #teamDetail ul li {
	position:relative;
	list-style:none;
	display:block;
	width:650px;
	height:465px;
	margin:0;
	float:left;
	overflow:hidden;
	border:none !important;
}

#referenzenDetail ul li p.refInfo {
	position:absolute;
	left:0;
	width:100%;
	padding: 8px 20px 5px 20px;
	bottom:20px;
	background: rgba(255, 255, 255, 0.6);
	
	color: rgb(120, 120, 120);
	font-size:16px;
}

#consumerName {
	margin:300px 20px 10px 40px;
	color:#FFF;
	font-size:24px;
	letter-spacing:1px;
	font-weight:bold;
	border:none !important;
}

#consumerInfo {
	margin:0 20px 20px 40px;
	font-size:13px;
	color:#FFF;
}

/* Prizes */
.prize {
	color:rgb(125, 150, 205);
	margin-left:20px;
	padding: 10px 20px 5px 32px;
	background:url(../referenzen/_img/dm_small.png) no-repeat left top;
}

.prize:before {
	content:' ';
	height:100%;
	background:rgb(120,120,120)
}

.submit {
	margin:10px 0 10px 0;
	padding:5;
	color:white;
	background:rgb(125, 150, 205);
}