@charset "utf-8";
/* styles for www.click-solutions.de      */
/*                                        */
/* media:	screen                        */
/* use:		on every page                 */
/* author:	click solutions GmbH          */
/*          Holger Bluethmann             */
/*                                        */


center, isindex, menu, dir, html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 101%; font-family: inherit; font-variant: inherit; vertical-align: baseline; }

strong {
	font-weight: bold; }
body {
	line-height: 1; color: black; background: white; }

ol, ul {
	list-style: none }

table {
	border-collapse: separate; border-spacing: 0; }

caption, th, td {
	text-align: left; font-weight: normal; }

blockquote:before, blockquote:after, q:before, q:after {
	content: none }

blockquote, q  {
	quotes: none }

ul, ol, dl {
	position: relative }

a, a:hover {
	text-decoration: none; }

html { 
	overflow-y: scroll; }

.clear {
	clear: both; font-size: 1px; line-height: 1px; height: 1px; }

body {
	color: black; background-color: #0a3369; background-image: url(../images/body_bg.jpg); background-repeat: no-repeat; background-position: center top; font-family: Arial, Helvetica, sans-serif; }

/*                                        */
/* basic layout                           */
/*                                        */

div#navi-categories {
	margin: 20px auto 0px auto; width: 960px; height: 87px; background-image: url(../images/mainnavi_bg.gif); background-repeat: no-repeat; }

div#header {
	position: relative; margin: 0px auto 0px auto; width: 960px; height: 300px; background-image: url(../images/header_bg.jpg); background-repeat: no-repeat; }

body.sh div#header {
	display: none; }

div#content {
	position: relative; margin: 10px auto 0px auto; width: 960px; min-height: 300px; background-image: url(../images/content_bg.gif); background-repeat: repeat-y; }

div#content-shadow {
	position: relative; width: 960px; min-height: 300px; background-image: url(../images/content_shadow_bg.gif); background-position: bottom left; background-repeat: no-repeat; }

div#navi-breadcrumb {
	margin: 0px 0px 0px 0px; }

div#navi-pages {
	float: left; width: 210px; margin-top: 10px; }

div#text {
	float: left; width: 480px; margin-top: 10px; padding-bottom: 20px; }

body.start div#text {
	width: 345px; }

body.start div#news {
	float: left; width: 345px; }

div#sidenotes {
	float: left; margin: 0px; width: 270px; padding-bottom: 250px; }

body.reference div#sidenotes {
	padding-bottom: 20px; }

div#footer {
	margin: 10px auto 0px auto; width: 960px; min-height: 260px; background-image: url(../images/footer_bg.jpg); background-repeat: no-repeat; }


/*                                        */
/* navi-categories layer                  */
/*                                        */

div#navi-categories a#logo {
	display: block; float: left; width: 166px; height: 87px; text-indent: -20000px; }

div#navi-categories ul {
	float: left; }

div#navi-categories ul li {
	float: left; height: 87px; margin-left: 1px; }
	
div#navi-categories ul li a {
	display: block; height: 87px; text-indent: -20000px; }

div#navi-categories ul li a:hover, div#navi-categories ul li.selected a {
	background-image: url(../images/mainnavi_bg_o.gif); background-repeat: no-repeat; }

div#navi-categories ul li#navi-internetecommerce a {
	width: 192px; }

div#navi-categories ul li#navi-internetecommerce a:hover, div#navi-categories ul li#navi-internetecommerce.selected a {
	background-position: -1px top; }

div#navi-categories ul li#navi-kampagnencrm a {
	width: 169px; }

div#navi-categories ul li#navi-kampagnencrm a:hover, div#navi-categories ul li#navi-kampagnencrm.selected a {
	background-position: -194px top; }

div#navi-categories ul li#navi-softwareit a {
	width: 130px; }

div#navi-categories ul li#navi-softwareit a:hover, div#navi-categories ul li#navi-softwareit.selected a {
	background-position: -364px top; }

div#navi-categories ul li#navi-ueberclicksolutions a {
	width: 131px; }

div#navi-categories ul li#navi-ueberclicksolutions a:hover, div#navi-categories ul li#navi-ueberclicksolutions.selected a {
	background-position: -495px top; }

div#navi-categories ul li#navi-search {
	width: 155px; position: relative; }

div#navi-categories ul li#navi-search input.searchtext {
	position: absolute; top: 58px; left: 10px; padding: 2px 4px 0px 4px; width: 110px; border: 1px solid #b2d4ec; background-color: #b2d4ec; color: #0a3369; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 14px;  }

div#navi-categories ul li#navi-search input.searchbutton {
	position: absolute; top: 58px; right: 0px; width:20px; height:18px; background-color:none; border:none; background-image:url(../images/search_button.gif); }


/*                                        */
/* header layer                           */
/*                                        */

div#header h1 {
	margin: 25px 20px 10px 235px; font-size: 20px; line-height: 19px; font-family: Georgia, "Times New Roman", Times, serif; color: #ffffff; font-weight: normal; }

body.start div#header h1 {
	margin-left: 25px; }

div#header-coverflow {
	position: absolute; top: 0px; width: 960px; height: 300px; left:0px; }

div#header-contact{
	position:absolute; right:0px; top:0px; height:300px; width:270px; }

div#header-coverflow div#header-coverflow-images {
	position: absolute; top: 13px; left: 110px; width: 511px; height: 237px; }

div#header-coverflow div#header-coverflow-menu {
	position: absolute; top: 20px; left: 25px; width: 160px; height: 200px; }

body.start div#header-coverflow div#header-coverflow-images {
	left: 179px; }

div#header-coverflow div#fallback div.image{
	width:690px; position:absolute; left:0px; top:0px; }

div#header-coverflow div#fallback div.contact{
	width:268px; position:absolute; right:0px; top:0px; }

div#header-coverflow div#fallback div.contact h2, div#header div#flash-contact h2{
	font-family:Georgia, "Times New Roman", Times, serif; color:#FFF; font-size:16px; padding:0 0 0 35px; line-height:29px; margin:20px 0 0px 9px; background-image:url(../images/contact_fallback_bg.jpg); background-repeat:no-repeat; }

div#header-coverflow div#fallback div.contact p, div#header div#flash-contact p{
	font-size:12px; color:#b2d4ec; margin:3px 25px 3px 25px; line-height:15px; }

div#header-coverflow div#fallback div.contact h3, div#header div#flash-contact h3{
	font-family:Georgia, "Times New Roman", Times, serif; color:#FFF; font-size:19px; margin:20px 0 0px 25px; }
	
div#header-coverflow div#fallback div.contact h3 a, div#header div#flash-contact h3 a{
	color:#FFF; }

/*                                        */
/* navi-breadcrumb layer                  */
/*                                        */

div#navi-breadcrumb p {
	padding: 15px 0px 5px 25px; font-size: 12px; line-height: 14px; color: #0071c1; }

div#navi-breadcrumb p a {
	color: #546069; }

div#navi-breadcrumb p a:hover {
	color: #0a3369; }


/*                                        */
/* navi-pages layer                       */
/*                                        */

div#navi-pages h2 {
	margin: 19px 20px 5px 25px; font-size: 14px; line-height: 17px; font-family: Georgia, "Times New Roman", Times, serif; color: #0071c1; font-weight: normal; }



div#navi-pages ul {
	margin: 15px 10px 0px 25px; }

div#navi-pages ul li {
	font-size: 12px; line-height: 14px; background-image: url(../images/navi_pages_li_bg.gif); background-repeat: no-repeat; background-position: left bottom; }

div#navi-pages ul li.last {
	background: none; }

div#navi-pages ul li a {
	display: block; padding: 6px 10px 6px 0px; color: #546069; }

div#navi-pages ul li.selected a {
	color: #0071c1; }

div#navi-pages ul li a:hover, div#navi-pages ul li.selected a:hover {
	color: #0a3369; }

div#navi-pages ul li.selected ul {
	margin: 0px 10px 10px 10px; }

div#navi-pages ul li.selected ul li {
	background: none; }

div#navi-pages ul li.selected ul li a {
	padding: 4px 10px 4px 0px; color: #546069; }

div#navi-pages ul li.selected ul li.selected a {
	color: #0071c1; }

div#navi-pages ul li.selected ul li a:hover, div#navi-pages ul li.selected ul li.selected a:hover {
	color: #0a3369; }



/*                                        */
/* text layer                             */
/*                                        */

div#text h1 {
	margin: 15px 20px 10px 25px; font-size: 20px; line-height: 22px; font-family: Georgia, "Times New Roman", Times, serif; color: #0071c1; font-weight: normal; }

div#text h2 {
	margin: 10px 20px 5px 25px; font-size: 16px; line-height: 19px; font-family: Georgia, "Times New Roman", Times, serif; color: #0071c1; font-weight: normal; }

div#text h3 {
	margin: 15px 20px 5px 25px; font-size: 14px; line-height: 17px; font-family: Georgia, "Times New Roman", Times, serif; color: #0071c1; font-weight: normal; }

div#text h4 {
	margin: 0px 20px 0px 25px; font-size: 12px; line-height: 17px; color:#122C5B; font-weight: bold; }

div#text p {
	margin: 5px 20px 15px 25px; font-size: 13px; line-height: 18px; color: #546069; }

div#text ul {
	margin: 5px 20px 10px 45px; font-size: 13px; line-height: 18px; color: #546069; list-style-type: disc; }

div#text a {
	color: #0071c1; text-decoration: underline; }

div#text a:hover {
	color: #0a3369; }

div#text div#nexttopics {
	margin: 25px 15px 0px 25px; padding-top: 10px; background-image: url(../images/next_topics_bg.gif); background-repeat: no-repeat; }

div#text div#nexttopics h3 {
	margin: 0px 20px 10px 0px; font-size: 13px; line-height: 15px; font-family: Georgia, "Times New Roman", Times, serif; color: #122c5b; font-weight: normal; }

div#text div#nexttopics ul {
	margin: 5px 20px 0px 0px; font-size: 12px; line-height: 17px; color: #546069; list-style-type: none; }

div#text div#nexttopics ul li {
	margin-bottom: 5px; }

div#text div#nexttopics ul li a {
	display: block; padding-left: 20px; background-image: url(../images/button_next_topics.gif); background-position: 0px 3px; background-repeat: no-repeat; text-decoration: none; color: #a7b1b8; }

div#text div#nexttopics ul li a strong {
	margin-right: 3px; color: #122c5b; font-weight: normal; }

div#text div#nexttopics ul li a:hover {
	color: #122c5b; background-position: 0px -54px; }


/*                                        */
/* news layer                             */
/*                                        */

div#news h2 {
	margin: 28px 20px 10px 10px; font-size: 16px; line-height: 19px; font-family: Georgia, "Times New Roman", Times, serif; color: #0071c1; font-weight: normal; }

div#news p.all-news{
	font-size:12px; margin:15px 0px 10px 20px; border-bottom:none; padding:3px 0px 0px 0px; }

div#news p.all-news a{
	color:#546069; text-decoration:none; height:auto; }

div#news p.all-news a:hover{
	color: #0071c1; }

/*                                        */
/* sidenotes layer                        */
/*                                        */

h3#sidenotes-teaser a {
	position: absolute; bottom: 0px; right: 0px; display: block; height: 240px; width: 270px; background-image: url(../documents/teaser/conterior.png); background-repeat: no-repeat; background-position: left bottom; text-indent: -20000px; }


div#sidenotes h3 {
	margin: 55px 20px 5px 25px; font-size: 14px; line-height: 17px; font-family: Georgia, "Times New Roman", Times, serif; color: #0071c1; font-weight: normal; }

body.reference div#sidenotes h3 {
	margin-top: 25px; }

div#sidenotes p {
	margin: 15px 20px 5px 25px; font-size: 12px; line-height: 18px; color: #546069; }

div#sidenotes ul {
	margin: 5px 20px 10px 40px; font-size: 12px; line-height: 17px; color: #546069; list-style-type: disc; }

div#sidenotes ul li {
    margin-top: 4px; }

div#sidenotes a {
	color: #0071c1; text-decoration: underline; }

div#sidenotes a:hover {
	color: #0a3369; }





/*                                        */
/* footer layer                           */
/*                                        */

div#footer div.column {
	clear: both; margin: 5px 25px 0px 25px; }
	
div#footer h2 {
	float: left; margin: 3px 10px 0px 0px; font-size: 11px; line-height: 15px; color: #6eafdc; font-weight: bold; }

div#footer h2 a {
	color: #58a4d6; }

div#footer h3 a:hover {
	color: #ffffff; }

div#footer h3 {
	float: left; margin: 3px 10px 0px 0px; font-size: 11px; line-height: 15px; color: #6eafdc; font-weight: normal; }

div#footer h3 a {
	color: #58a4d6; }

div#footer h3 a:hover {
	color: #ffffff; }

div#footer div.extra h1, div#footer div.extra h2, div#footer div.extra h3, div#footer div.extra h4, div#footer div.extra p {
	float: left; margin: 3px 10px 0px 0px; font-size: 11px; line-height: 14px; color: #6eafdc; font-weight: normal; }

div#footer div.extra h1 a, div#footer div.extra h2 a, div#footer div.extra h3 a, div#footer div.extra h4 a, div#footer div.extra p a {
	color: #4962a7; }

div#footer div.extra h1 a:hover, div#footer div.extra h2 a:hover, div#footer div.extra h3 a:hover, div#footer div.extra h4 a:hover, div#footer div.extra p a:hover {
	color: #ffffff; }


div#footer p {
	float: left; margin: 5px 5px 0px 5px; font-size: 12px; line-height: 15px; color: #6eafdc; }

div#footer p a {
	color: #58a4d6; }

div#footer p a:hover {
	color: #ffffff; }

div#footer p.actions {
	float: none; margin: 0px 25px 3px 25px; padding: 15px 0px 15px 0px; border-bottom: 1px solid #356799; color: #6eafdc; }

div#footer p.actions a {
	margin-right: 30px; padding-left: 20px; background-image: url(../images/footer_buttons.gif); background-repeat: no-repeat; color: #ffffff; }

div#footer p.actions a.rss {
	background-position: 0px 0px; }

div#footer p.actions a.contact {
	background-position: 0px -75px; }

div#footer p.actions a.facebook {
	background-position: 0px -25px; }

div#footer p.actions a.twitter {
	background-position: 0px -50px; }

div#footer p.actions a:hover {
	color: #b2d5ec; }

/*                                        */
/* Referenzen Liste, News Liste           */
/*                                        */
div#list{
	margin: 0px 20px 0px 25px; }
	
div#list div.list-item a{
	text-decoration:none; }

div#list div.list-item a:hover{
	color: #0071c1;}

div#list div.list-item h4{
	margin:0; font-size: 12px; line-height: 16px; color:#122C5B; font-weight: bold; }

div#list div.list-item h3{
	margin:0; padding: 0px; font-size: 12px; line-height: 16px; color:#666; font-weight: bold; font-family: Arial, Helvetica, sans-serif; }

div#list div.list-item p{
	margin:0; font-size:12px; line-height:16px; }
	
div#list div.list-item a.img{
	display:block; width:140px; height:95px; float:left; margin-right:14px; margin-bottom:12px; border: 1px solid #e8ebed; }

div#list div.list-item p a{
	color: #546069; }

div#list div.list-item p a span {
	color: #0071c1; }

div#list div.list-item h4 a{
	color:#0071c1; }

div#list div.list-item h3 a{
	color:#122C5B; }

div#list div.list-item:hover a {
	color:#122C5B; }

div#list div.list-item{
	background-image:url("../images/next_topics_bg.gif"); background-repeat:no-repeat; margin:0px 0 0 0; height:95px; padding:12px 20px 12px 0; }

div#list div.news{
	height:auto; clear:both; }

div#list div.start-list{
	background:none; border-top:1px solid #d4d4d4; padding:7px 0px 7px 0; margin-right:10px; }

div#list div.list-item.first{
	background:none; border:none; }

div#news div.news-start {
	margin: 0px 10px 0px 10px; height: 230px; overflow-y: scroll; }

div#news div.news-start a.img{
	width:81px; height:58px; margin-right:8px; }

/*                                        */
/* Referenzen Header layer                */
/*                                        */
div#reference-images{
	width:690px; height: 300px; position:absolute; }

div#reference-images div.thumbs{
	width:140px; height:260px; overflow:hidden; position:absolute; top:20px; left:25px; }

div#reference-images div.thumbs div{
	position:absolute; top:0px; left:0px; }

div#reference-images div.zoom{
	width:395px; height:260px; overflow:hidden; position:absolute; top:20px; right:60px; }

div#reference-images div.zoom div{
	position:absolute; display:none; }

div#reference-images div.zoom div.active{
	display:block; z-index:3;  }

div#reference-images div.zoom div.setOnTop{
	 }

div#reference-images div.zoom div a{
	cursor:pointer; }

div#reference-images div.thumbs a{
	margin:0 0 10px 0; display:block; height:95px; width:140px; cursor:pointer; }

div#reference-images div.navi-top{
	width:15px; height:30px; position:absolute; left:183px; top:21px; background-image:url(../images/scrollnavi_btn_top.png); background-repeat:no-repeat; }

div#reference-images div.navi-top a{
	display:block; width:15px; height:30px; cursor:pointer; }

div#reference-images div.navi-bottom{
	width:15px; height:28px; position:absolute; left:183px; top:254px; background-image:url(../images/scrollnavi_btn_bottom.png); background-repeat:no-repeat; }
	
div#reference-images div.navi-bottom a{
	display:block; width:15px; height:30px; cursor:pointer; }

div#flash-contact{
	width:268px; float:right;}

/* Slider
----------------------------------*/
.ui-slider { position: relative; text-align: left; }
.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; }
.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; }

.ui-slider-horizontal { height: .8em; }
.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; }
.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }
.ui-slider-horizontal .ui-slider-range-min { left: 0; }
.ui-slider-horizontal .ui-slider-range-max { right: 0; }

.ui-slider-vertical { width: 15px; height: 206px; top:48px; left:190px; border-left:1px solid #FFF; }
.ui-slider-vertical .ui-slider-handle { left: -8px; margin-left: 0; margin-bottom: -18px; width:15px; height:35px; cursor:pointer; background-image:url(../images/scrollbar.gif); background-repeat:no-repeat; }
.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; }
.ui-slider-vertical .ui-slider-range-min { bottom: 0; }
.ui-slider-vertical .ui-slider-range-max { top: 0; }


/*                                        */
/* Referenzen Sidenotes Projektnavi       */
/*                                        */
div#sidenotes div#project-navi{
	margin: 0px 25px 0 25px; height: 30px; background-image: url(../images/sidenotes_projectnavi_bg.gif); background-repeat: no-repeat; background-position: left bottom; }
	
div#sidenotes div#project-navi a{
	text-decoration:none; font-size:12px; height:16px; line-height:16px; }

div#sidenotes div#project-navi a.next-link{
	background-image:url(../images/projectnavi_next_link.png); background-position:right top; background-repeat:no-repeat; padding:0 25px 0 0; float:right; width:145px; text-align:right; }

div#sidenotes div#project-navi a.prev-link{
	background-image:url(../images/projectnavi_prev_link.png); background-position:center center; background-repeat:no-repeat; float:left; width:16px; }

div#text p.link a {
	display: block; padding: 0px 0px 0px 20px; background-image: url(../images/button_next_topics.gif); background-repeat: no-repeat; background-position: 0px 3px; text-decoration: none; color: #666; }

div#text p.link a:hover {
	color: #122c5b; background-position: 0px -54px; }


/*                                        */
/* Suche		                          */
/*                                        */
div#text p input.searchbox{
	margin:2px 0 0 0; border:1px solid #999; width:150px; height:16px; color:#546069; font-family:Arial, Helvetica, sans-serif; font-size:12px; }

div#text p input.searchbtn{
	width:80px; height:20px; border:none; background-color:none; background-image:url(../images/form_search_button.gif); cursor:pointer;  }

div#text p a.search-text{
	text-decoration:none; color:#546069; }



/*                                        */
/* Kontaktformular		                  */
/*                                        */
div#text div#contact-form p.address span{
	display:block; }

div#text div#contact-form p.address input.text, div#text div#contact-form p.address textarea{
	margin:2px 0 0 0; border:1px solid #999; width:230px; height:16px; color:#546069; font-family:Arial, Helvetica, sans-serif; font-size:12px; }

div#text div#contact-form p.address textarea{
	height:90px; width:auto; }