
/* CSS
Author: Frederik Ventzke - Ventzke & Partner
Client: KISS-SECURITY.DE
Created: 25.08.2008
Modified: 27.08.2008
*/


html,body { 
	margin: 0 0 0 0; 
	padding: 0 0 0 0;
	font-family:  Verdana, Helvetica, sans-serif; 
	text-align: left;
	color: #9a9a9a;
	background: url(../img/bg.jpg) repeat-x #0f0f0f;
	font-size: 11px;
}


/* generals */
a			{text-decoration: none; color: #e3e3e3;}
a:hover	{color: #9a9a9a; text-decoration:none;}
b,strong	{font-weight: bold;}
i,em		{font-style: italic;}
img 		{border: 0px;}
form		{display: inline;}
ul			{padding: 0px; margin: 7px 0 12px 0;}
li			{text-align: left; margin: 4px 0 0 12px;}
ul.liste li	{text-align: left; color: #888; padding: 0 0 0 20px; margin: 7px 0 5px 7px;; background: transparent url(../img/lilogo.gif) no-repeat; list-style: none;}
hr			{margin: 0px; color: #9DB3C8;}
span.kontakt {display: block; float: left; padding: 0px; margin: 0px;}


/* special divs */
#gesamt {width: 865px; height: 566px; margin: auto; padding: 40px 0 20px 0; position: relative;}
#header {width: 865px; height: 133px; display: block; background-image: url(../img/bg_header.jpg);}
#header div {padding: 14px 0 0 390px;}
#subheader {width: 865px; height: 145px; background-image: url(../img/subheader.jpg); margin: 0px; padding: 0px;}
#contentstart {width: 856px; height: 400px; background-image: url(../img/content.gif); padding: 0 0 0 9px; margin: 0px; float: left;}
#content {width: 850px; height: auto; background-image: url(../img/content.gif); padding: 0 0 20px 15px;}
#links {width: 560px; float: left; padding: 0 0 0 10px;}
#dienst {padding: 0 0 0 65px;}
.ver a {float:left; display:block; width:125px; height:125px; margin: 0 20px 10px 0; background:url("../img/dienstleistungen/veranstaltungsschutz.jpg") no-repeat;}
.ver a:hover {background-position:-125px;}
.per a {float:left; display:block; width:125px; height:125px; margin: 0 20px 10px 0; padding: 0px; background:url("../img/dienstleistungen/personen_begleitschutz.jpg") no-repeat;}
.per a:hover {background-position:-125px;}
.obj a {float:left; display:block; width:125px; height:125px; margin: 0 20px 10px 0; padding: 0px; background:url("../img/dienstleistungen/objektschutz.jpg") no-repeat;}
.obj a:hover {background-position:-125px;}
.vip a {float:left; display:block; width:125px; height:125px; margin: 0 20px 10px 0; padding: 0px; background:url("../img/dienstleistungen/vip_security_shuttle.jpg") no-repeat;}
.vip a:hover {background-position:-125px;}
.hos a {float:left; display:block; width:125px; height:125px; margin: 0 20px 10px 0; padding: 0px; background:url("../img/dienstleistungen/hostessen_service.jpg") no-repeat;}
.hos a:hover {background-position:-125px;}
.obs a {float:left; display:block; width:125px; height:125px; margin: 0 20px 10px 0; padding: 0px; background:url("../img/dienstleistungen/observationen.jpg") no-repeat;}
.obs a:hover {background-position:-125px;}
.gas a {float:left; display:block; width:125px; height:125px; margin: 0 20px 10px 0; padding: 0px; background:url("../img/dienstleistungen/gastronomieabsicherung.jpg") no-repeat;}
.gas a:hover {background-position:-125px;}
.hot a {float:left; display:block; width:125px; height:125px; margin: 0 20px 10px 0; padding: 0px; background:url("../img/dienstleistungen/hotelsicherheit.jpg") no-repeat;}
.hot a:hover {background-position:-125px;}
.sic a {float:left; display:block; width:125px; height:125px; margin: 0 20px 10px 0; padding: 0px; background:url("../img/dienstleistungen/sicherheitstechnik.jpg") no-repeat;}
.sic a:hover {background-position:-125px;}
#rechts {width: 230px; float: right;}
#rechts h2 {text-align: right; padding: 0 30px 0 0;}
#rechts ul {width: 200px; padding: 0px; margin: 0px;}
#rechts li {border-bottom: 1px solid #484848; text-align: right; list-style: none; padding: 2px; margin: 4px 0 4px 0;}
#rechts li a {color: #9a9a9a; background: transparent url(../img/lirechts.gif) no-repeat; display: block; background-position: left 0px;}
#rechts li a:hover {color: #e3e3e3; background: transparent url(../img/lirechts2.gif) no-repeat; display: block; background-position: left 0px;}
#rechts li a.aktiv {color: #e3e3e3; background: transparent url(../img/lirechts2.gif) no-repeat; display: block; background-position: left 0px;}
.referenzdiv {width: 120px; height: 190px; background-color: #272727; margin: 0 20px 20px 0; text-align: center; float: left;}
.galeriediv {width: 120px; height: 145px; background-color: #272727; margin: 0 20px 10px 0; text-align: center; float: left;}
#footer {width: 865px; height: 13px; background-image: url(../img/footer.gif);  padding: 11px 0 0 0; color: #686868; float: left;}
#videos {padding: 20px 0 0 20px;}
#footer p {color: #686868; font-size: 0.9em; margin: 0px; padding: 0px; text-align: right;}
#footer a {color: #686868;}
#footer span {float: left;}
div#zaehler {display: none;}

#vp {position:absolute; left:770px; top:25px; width: 91px; height: 7px; padding: 0; margin: 0;}
#vp  p {margin: 0; padding: 0;}
#vp  p a {width: 91px; height: 7px; background: url(../img/vp.gif); display: block; font-size: 0px; float: left; text-indent: -3000px; color: #000;}
#vp  p a span {display: none;}
#vp  p a:hover {background-position: right;}




/* menu */
div#nav {width: 865px; height: 23px; padding: 0px; margin:0px; background-image: url(../img/nav.gif); float: left;}
div#nav ul {padding: 0px; margin: 4px 0 0 7px;}
div#nav li {width: 121px; float: left; list-style-type: none; text-align: center; color: #9a9a9a; padding: 0px; margin: 0px; }
div#nav li a {}
div#nav li a:hover {color: #e3e3e3;}



/* images */
img.logo {width: 84px; height: 84px; margin: 0px; text-align: center;}
img.start {width: 847px; height: 400px; padding: 0px;}
img.referenzschreiben {width: 120px; height: 155px;}
img.dienst {display:block; width: 125px; height:125px; margin: 0 0 8px 10px; float: right; border: 1px solid #272727;}
img.galerie {width: 120px; height: 90px;}



/* content */
h1, h2 {font-family: Trebuchet MS, Lucida Grande, Helvetica; font-weight: normal;}

h1 {font-size: 1.7em; letter-spacing: 0.09em;  color: #e3e3e3; margin: 18px 0 10px 10px;}
h2 {font-size: 1.3em; letter-spacing: 0.09em;  color: #e3e3e3; margin: 18px 0 2px 0;}
h3 {font-size: 1.0em; letter-spacing: 0.09em;  color: #e3e3e3; margin: 18px 0 2px 0;}
p {margin: 0 0 9px 0;  font-size: 1.0em; line-height: 1.45em; color: #9a9a9a;}
p.small {font-size: 0.8em;}



/* form elements */
input.text, textarea.text {font-family: Verdana, Helvetica, sans-serif; font-size:11px; border: none; width: 250px; height: 16px; background-color: #272727; color: #fff; display: block; margin: 0 0 3px; font-size: 1.0em;}
input.text-plz {font-family: Verdana, Helvetica, sans-serif; font-size:11px; border: none; width: 50px; height: 16px; background-color: #272727; color: #fff; display: block; margin: 0 8px 0 0; font-size: 1.0em;}
input.text-ort {font-family: Verdana, Helvetica, sans-serif; font-size:11px; border: none; width: 189px; height: 16px; background-color: #272727; color: #fff; display: block; margin: 0 0 3px; font-size: 1.0em;}
textarea.nachricht {font-family: Verdana, Helvetica, sans-serif; font-size:11px; border: none; width: 250px; height: 120px; background-color: #272727; color: #fff; display: block; margin: 0 0 3px; overflow: auto; font-size: 1.0em;}
input.submit {border: none; background-color: #282828; padding: 3px; width: 150px; height: 26px; color: #e3e3e3; float: right; display: block;}
label {display: block; float: left; clear: both;  white-space: nowrap; width: 100px; color: #9a9a9a;}
fieldset {border: none; width: 352px; padding: 10px 0;}



/* tables */
td {padding: 2px 0px 2px 0px; text-align: left; vertical-align: top; font-size: 100%; line-height: 155%; }
table.refer {width: 100%;}
table.refer td {border-bottom: 1px solid #636363; width: 450px;}
table.refer td.auftrag {width: 100px; border: 1px solid #fff;}
table.refer td.datum {text-align: right; width: 120px;}




/* links */
a.lvl1, a.lvl1a:visited {text-decoration: none; font-size: 11px;}

a.lvl1 {color: #9a9a9a; margin: 0px; padding: 0px;}
a.lvl1a {color: #e3e3e3; margin: 0px; padding: 0px;}
a.externer-link {padding: 0 14px 0 0; margin: 0px; background: url(../img/extern.gif) no-repeat right;}
a.externer-link:hover, a.externer-link:aktive {}


.clearfix:after {
 content: ".";
   display: block; 
   height: 0; 
   clear: both; 
   visibility: hidden;
}
 
.clearfix {
 display: inline-block;
}
 
/* Hides from IE-mac \*/
* HTML .clearfix {height: 1%; display: block;}
/* End hide from IE-mac */


.mask{
	position:relative;
	width:847px;
	height:400px;
	overflow:hidden;
}
.mask img{
	position:absolute;
	display:block;
	border:none;
}

#box1 {position:absolute;}





