/***********************************************************************************************

*  Common Style Definitions

***********************************************************************************************/

html,

body {

  padding: 0;

  margin: 0;

  height: 100%;

  width: 100%;

}

html{

  overflow-y: scroll;

  overflow-x: auto;

}

body{

  text-align: center;

  background: url(../img/body-bg.png) repeat-x #f0f0f0;

}

/***********************************************************************************************

*  Main Layout Definitions

***********************************************************************************************/

#mainarea-box{

	text-align: center;

}

#mainarea{

	position: realtive;

	width: 1000px;

	overflow: hidden;

	margin: 0 auto;

	text-align: left;

}

#mainarea-top,

#mainarea-center,

#mainarea-bottom{

	overflow: hidden;

	position: relative;

	padding: 0 20px;

}

#mainarea-top{

	width: 100%;

	height: 40px;

	background: url(../img/mainarea-top.png) no-repeat;

}

#mainarea-center{

	width: 100%;

	background: url(../img/mainarea-center.png) repeat-y;

}

#mainarea-bottom{

	width: 100%;

	height: 70px;

	background: url(../img/mainarea-bottom.png) no-repeat;

}



#teamproq-login{

	display: block;

	width: 163px;

	height: 41px;

	position: absolute;

	top: 0;

	right: 32px;

	font-weight: bold;

	font-size: 14px;

	color: #404040;

	text-decoration: none;

	text-align: center;

	line-height: 30px;

	overflow: hidden;

	background: url(../img/teamproq-login.png) no-repeat;

}

#teamproq-login:hover{

	background: url(../img/teamproq-login-hover.png) no-repeat;

}

/***********************************************************************************************

*  Header Layout Definitions

***********************************************************************************************/

#header{

	position: relative;

	width: 958px;
	
	height: auto;

	margin: 0 1px;

}

#header-logo-link,

#header-languages,

#header-menu,

#header-search,

#header-grey-box,

#header-buttons,

#header-image-box{

	position: absolute;

	overflow: hidden;

}



#header-logo-link{

	top: 0;

	left: 30px;

	display: block;

	width: 199px;

	height: 64px;

	line-height: 1000px;

	background: url(../img/teamproq-logo.png) no-repeat;

}



#header-languages{

  top: 44px;

  right: 12px;

}

#header-languages a,

#header-languages div{

  display: block;

  float: left;

  width: 22px;

  height: 17px;

  overflow: hidden;

  border: 1px solid white;

  margin-right: 5px;

  line-height: 1000px;

}

#header-languages a.active-de,

#header-languages a.inactive-de{

  background: url(../img/flags/de.gif) no-repeat 2px 2px;

}

#header-languages div.disabled-de{

  background: url(../img/flags/de-disabled.gif) no-repeat 2px 2px;

}

#header-languages a.active-ru,

#header-languages a.inactive-ru{

  background: url(../img/flags/ru.gif) no-repeat 2px 2px;

}

#header-languages div.disabled-ru{

  background: url(../img/flags/ru-disabled.gif) no-repeat 2px 2px;

}

#header-languages a.active-pl,

#header-languages a.inactive-pl{

  background: url(../img/flags/pl.gif) no-repeat 2px 2px;

}

#header-languages div.disabled-pl{

  background: url(../img/flags/pl-disabled.gif) no-repeat 2px 2px;

}

#header-languages a.active-de,

#header-languages a.active-ru,

#header-languages a.active-pl{

  border: 1px dotted #75858f;

}



#header-menu{
	top: 38px;
	right: 0;
	width: 640px;
	height: 29px;
	padding-left: 52px;
	overflow: visible;
	background: url(../img/header-menu-bottom.png) no-repeat right bottom;
	z-index: 10;
}
.header-menu a.header-menu-link-active,
.header-menu a.header-menu-link-inactive,
.header-submenu-box{
	position: relative;
	display: block;
	float: left;	
}
.header-menu a.header-menu-link-active,
.header-menu a.header-menu-link-inactive{
	padding: 0 10px;
	margin-right: 2px;
	border-top: 2px solid #AAA;
	border-left: 2px solid #AAA;
	border-right: 2px solid #AAA;
}

.header-menu a.header-menu-link-active{
	font-weight: bold;
	height: 28px;
	line-height: 28px;
}
.header-menu a.header-menu-link-active,
.header-menu a.header-menu-link-inactive:hover{
	border-top: 2px solid #707070;
	border-left: 2px solid #707070;
	border-right: 2px solid #707070;
	color: #404040;
	background: #EEE;
}
.header-menu a.header-menu-link-inactive{
	height: 25px;
	line-height: 25px;
	margin-top: 3px;
}
.header-submenu-box{
	height: 29px;
}
.header-submenu{
	position: absolute;
	display: none;
	left: 0;
	top: 29px;
	border-bottom: 2px solid #707070;
	border-left: 2px solid #707070;
	border-right: 2px solid #707070;
	background: white;

	-moz-box-shadow: 0px 5px 7px #888;
	-webkit-box-shadow: 0px 5px 7px #888;
	-khtml-box-shadow: 0px 5px 7px #888;
	box-shadow: 0px 5px 7px #888;

}
.header-submenu a.header-submenu-link-inactive,
.header-submenu a.header-submenu-link-active{
	color: #404040;
	display: block;
	white-space: nowrap;
	padding: 10px;
}
.header-submenu a.header-submenu-link-active{
	font-weight: bold;
}
.header-submenu a.header-submenu-link-inactive:hover,
.header-submenu a.header-submenu-link-active:hover{
	background: #EEE;
}



#header-search{

	top: 7px;

	right: 19px;

	width: 147px;

	height: 22px;

}

#header-search input.header-search-text{

	position: absolute;
	top: 0;
	left: 0;

	width: 123px;

	height: 22px;

	line-height: 21px;

	border: 0;

	padding-left: 5px;

	vertical-align: middle;

	background: url(../img/header-search-text.png) no-repeat;

}

#header-search input.header-search-submit{

	position: absolute;
	top: 0;
	right: 0;

	width: 24px;

	height: 22px;

	border: 0;

	cursor: pointer;

	background: url(../img/header-search-submit.png) no-repeat;

}

#header-grey-box{

	top: 82px;

	left: 0;

	width: 100%;

	height: 228px;

	overflow: hidden;

	background: url(../img/header-grey-box.png) repeat-x;

}

#header-buttons{

	top: 11px;

	left: 51px;

	width: 277px;

	height: 209px;

	background: url(../img/header-buttons-bg.png) no-repeat;

}

#header-buttons a.header-button,

#header-buttons a.header-button-active{

	display: relative;

	display: block;

	width: 221px;

	height: 37px;

	overflow: hidden;

	text-decoration: none;

	cursor: pointer;

}

#header-buttons a.header-button span.header-button-left,

#header-buttons a.header-button span.header-button-center,

#header-buttons a.header-button span.header-button-right,



#header-buttons a.header-button-active span.header-button-left,

#header-buttons a.header-button-active span.header-button-center,

#header-buttons a.header-button-active span.header-button-right{

	display: block;

	float: left;

}



#header-buttons a.header-button span.header-button-left,

#header-buttons a.header-button-active span.header-button-left{

	width: 5px;

	height: 53px;

	background: url(../img/header-button-silver-left.png) no-repeat;

}

#header-buttons a.header-button span.header-button-center,

#header-buttons a.header-button-active span.header-button-center{

	width: 211px;

	height: 37px;

	text-align: left;

	text-decoration: none;

	line-height: 37px;

	font-weight: normal;

	font-size: 18px;

	padding-left: 15px;

	background: url(../img/header-button-silver-center.png) repeat-x;

}

#header-buttons a.header-button span.header-button-right,

#header-buttons a.header-button-active span.header-button-right{

	width: 5px;

	height: 37px;

	background: url(../img/header-button-silver-right.png) no-repeat;

}



#header-buttons a.header-button-active span.header-button-left,

#header-buttons #header-button-13.header-button-active span.header-button-left,

#header-buttons #header-button-133.header-button-active span.header-button-left,

#header-buttons #header-button-139.header-button-active span.header-button-left,

#header-buttons #header-button-145.header-button-active span.header-button-left,

#header-buttons #header-button-160.header-button-active span.header-button-left{

	color: black;

	background: url(../img/header-button-brown-left.png) no-repeat;

}

#header-buttons a.header-button-active span.header-button-center,

#header-buttons #header-button-13.header-button-active span.header-button-center,

#header-buttons #header-button-133.header-button-active span.header-button-center,

#header-buttons #header-button-139.header-button-active span.header-button-center,

#header-buttons #header-button-145.header-button-active span.header-button-center,

#header-buttons #header-button-160.header-button-active span.header-button-center{

	color: black;

	background: url(../img/header-button-brown-center.png) repeat-x;

}

#header-buttons a.header-button-active span.header-button-right,

#header-buttons #header-button-13.header-button-active span.header-button-right,

#header-buttons #header-button-133.header-button-active span.header-button-right,

#header-buttons #header-button-139.header-button-active span.header-button-right,

#header-buttons #header-button-145.header-button-active span.header-button-right,

#header-buttons #header-button-160.header-button-active span.header-button-right{

	color: black;

	background: url(../img/header-button-brown-right.png) no-repeat;

}



/* Special for header-button IDs */

#header-buttons a.header-button,

#header-buttons a.header-button-active{

	position: absolute;

}

#header-buttons #header-button-13,

#header-buttons #header-button-133,

#header-buttons #header-button-139,

#header-buttons #header-button-145,

#header-buttons #header-button-160{

	top: 46px;

	left: 28px;

}

#header-buttons #header-button-14,

#header-buttons #header-button-132,

#header-buttons #header-button-138,

#header-buttons #header-button-144,

#header-buttons #header-button-161{

	top: 7px;

	left: 8px;

}

#header-buttons #header-button-15,

#header-buttons #header-button-131,

#header-buttons #header-button-137,

#header-buttons #header-button-143,

#header-buttons #header-button-162{

	top: 85px;

	left: 48px;

}

#header-buttons #header-button-16,

#header-buttons #header-button-130,

#header-buttons #header-button-136,

#header-buttons #header-button-142,

#header-buttons #header-button-163{

	top: 124px;

	left: 28px;

}

#header-buttons #header-button-17,

#header-buttons #header-button-129,

#header-buttons #header-button-135,

#header-buttons #header-button-141,

#header-buttons #header-button-164{

	top: 163px;

	left: 8px;

}



#header-buttons #header-button-13 span.header-button-left,

#header-buttons #header-button-133 span.header-button-left,

#header-buttons #header-button-139 span.header-button-left,

#header-buttons #header-button-145 span.header-button-left,

#header-buttons #header-button-160 span.header-button-left{

	background: url(../img/header-button-orange-left.png) no-repeat;

}

#header-buttons #header-button-13 span.header-button-center,

#header-buttons #header-button-133 span.header-button-center,

#header-buttons #header-button-139 span.header-button-center,

#header-buttons #header-button-145 span.header-button-center,

#header-buttons #header-button-160 span.header-button-center{

	color: black;

	background: url(../img/header-button-orange-center.png) repeat-x;

}

#header-buttons #header-button-13 span.header-button-right,

#header-buttons #header-button-133 span.header-button-right,

#header-buttons #header-button-139 span.header-button-right,

#header-buttons #header-button-145 span.header-button-right,

#header-buttons #header-button-160 span.header-button-right{

	background: url(../img/header-button-orange-right.png) no-repeat;

}



#header-image-box{

	top: 16px;

	right: 18px;

	width: 570px;

	height: 196px;

	padding: 1px;

	background: url(../img/header-image-bg.png) repeat-x;

}

#header-image{

	width: 568px;

	height: 194px;

}



/***********************************************************************************************

*  Content Layout Definitions

***********************************************************************************************/

#contents,

#content-all{

	position: relative;

}

#content-all,

#content-after-all{

	width: 920px;

	overflow: hidden;

	margin: 0 20px 20px;

}

#content-left{

	float: left;

	width: 321px;

	margin-left: 20px;

	overflow: hidden;

}

#content-right{

	float: right;

	width: 569px;

	margin-right: 20px;

	overflow: hidden;

}

div.grey-box,

div.brown-box{

	padding: 10px 20px;

}

div.grey-box{

	background: url(../img/grey-box.png) repeat-x #FFFFFF;

}

div.brown-box{

	background: url(../img/brown-box.png) repeat-x #FFFFFF 0 bottom;

}

div.brown-box-content{

	position: relative;

}

div.brown-box-content p{

	margin: 0;

}

div.brown-box a.angebot-special-link{

	position: absolute;

	top: 0;

	left: 0;

	display: block;

	width: 100%;

	height: 106px;

	overflow: hidden;

	line-height: 1000px;

}

div.grey-box-special{

	padding: 15px 20px;

	border: 1px solid #f2f2f2;

	background: url(../img/grey-box-special.png) repeat-x left bottom #ededed;

}

div.grey-box-special div.grey-box-special-content p.bodytext{

	margin: 0;

}



div.grey-box,

div.two-boxes-container,

div.three-boxes-container{

	margin-bottom: 20px;

	_margin-bottom: 40px;

}

div.three-boxes-1,

div.three-boxes-2,

div.three-boxes-3{

	float: left;

	width: 183px;

	overflow: hidden;

	margin-right: 10px;

	padding: 10px 20px;

	background: url(../img/grey-box.png) repeat-x;

}

div.three-boxes-3{

	margin-right: 0;

}


div.two-boxes-1,

div.two-boxes-2{

	float: left;

	width: 279px;

	overflow: hidden;

	margin-right: 11px;

	padding: 10px 20px;

	background: url(../img/grey-box.png) repeat-x;

}

div.two-boxes-2{

	margin-right: 0;

}



/***********************************************************************************************

*  Startpage Modules List Right Layout Definitions (Esp. for f***ing dumb IE)

***********************************************************************************************/

#c1 div.csc-textpic-intext-left-nowrap{

	margin-bottom: 6px;

}

#c1 div.csc-textpic-intext-left-nowrap,

#c1 div.csc-textpic-intext-left-nowrap *{

	background: transparent;

}

/***********************************************************************************************

*  Screentour Browsemenu Layout Definitions

***********************************************************************************************/

#browse-box{

	width: 920px;

	height: 140px;

	margin: 0 20px;

	padding: 20px 10px 0;

	overflow: hidden;

	background: url(../img/grey-box.png) repeat-x;

}

#browse-headline{

	padding: 0 10px;

}

#browse-prev,

#browse-center,

#browse-next{

	float: left;

	overflow: hidden;

}



#browse-prev,

#browse-next{

	width: 205px;

}

#browse-next{

	text-align: right;

}

#browse-center{

	width: 490px;

	text-align: center;

}

#browsemenu{

	width: 395px;

	margin: 0 auto;

}

#browse-center div.browsemenu-item{

	position: relative;

	width: 28px;

	height: 28px;

	overflow: hidden;

	float: left;

	margin: 0;

}

#browse-center div.browsemenu-item img.browsemenu-item-image,

#browse-center div.browsemenu-item img.browsemenu-item-image-active{

	position: absolute;

	z-index: 1;

	top: 0;

	left: 0;

	width: 28px;

	height: 28px;

	background: url(../img/browsemenu-item-image-inactive.png) no-repeat;

}

#browse-center div.browsemenu-item img.browsemenu-item-image-active{

	background: url(../img/browsemenu-item-image-active.png) no-repeat;

}

#browse-center div.browsemenu-item a.browsemenu-item-link,

#browse-center div.browsemenu-item a.browsemenu-item-link-active{

	position: absolute;

	z-index: 2;

	top: 0;

	left: 0;

	display: block;

	width: 28px;

	height: 28px;

	overflow: hidden;

	line-height: 1000px;

}

#browse-prev a.browsemenu-nav-prev{

	display: block;

	padding-left: 30px;

	background: url(../img/browsemenu-prev.png) no-repeat 0 2px;

	height: 30px;

}

#browse-next a.browsemenu-nav-next{

	display: block;

	padding-right: 30px;

	text-align: right;

	background: url(../img/browsemenu-next.png) no-repeat right 2px;

	height: 30px;

}



#browse-backtocategories{

	border-top: 1px solid #bebebe;

	padding-top: 10px;

	text-align: center;

}

#browse-backtocategories a.browse-backtocategories{

	font-weight: bold;

	margin: 0 5px;

}



/***********************************************************************************************

*  Modules Menu Layout Definitions

***********************************************************************************************/

#modules-menu div.modulesmenu-item{

	clear: both;

	height: 26px;

	margin-bottom: 7px;

}

#modules-menu a{

	display: block;

	float: left;

	line-height: 26px;

	font-weight: bold;

}

#modules-menu a.active{

	color: #e78000;

	font-weight: bold;

}

#modules-menu a img.modulesmenu-item-image{

	margin-right: 10px;

}



/***********************************************************************************************

*  Copyright Layout Definitions

***********************************************************************************************/

#copyright{

	position: absolute;

	top: 40px;

	left: 40px;

	font-size: 11px;

	color: #646464;

}

#copyright a{

	font-size: 11px;

	color: #646464;

}

/***********************************************************************************************

*  Footer Menu Layout Definitions

***********************************************************************************************/

#footermenu{

	position: absolute;

	top: 40px;

	right: 40px;

}

#footermenu a{

	font-size: 11px;

	font-weight: normal;

	text-decoration: none;

	color: #646464;

	margin-left: 10px;

}

#footermenu a.active{

	text-decoration: underline;

	font-weight: bold;

}



/***********************************************************************************************

*  Social Bookmarks Layout Definitions

***********************************************************************************************/

#socialbookmarks{
	position: absolute;
	left: 100px;
	top: 30px;
}
#socialbookmarks div.facebook-likes-teamproq{
	position: absolute;
	top: 7px;
	left: 0;
	width: 120px;
	overflow: hidden;
}
#socialbookmarks div.tx-sexybookmarks-pi1{
	position: absolute;
	top: 11px;
	left: 130px;
	width: 360px;
}

/***********************************************************************************************

*  Deeplinks Layout Definitions

***********************************************************************************************/

#deeplinks-box{

	width: 100%;

	min-height: 165px;

	_height: 185px;

	text-align: center;	

	background: url(../img/deeplinks.png) repeat-x #f0f0f0;

}

#deeplinks{

	width: 920px;

	margin: 0 auto;

	padding-top: 30px;

	padding-bottom: 20px;

	text-align: left;

}

#deeplinks,

#deeplinks *{

	color: #888;

	font-size: 10px;

	line-height: 12px;

}

#deeplinks div.deeplinks-section{

	margin-bottom: 10px;

}

#deeplinks a.deeplinks-link{

	white-space: nowrap;

	margin-right: 5px;

}

#deeplinks a.deeplinks-link:hover{

	text-decoration: underline;

}
#deeplinks .likebuttons{
	height: 25px;
}
#deeplinks .likebuttons .facebook-likes-teamproq,
#deeplinks .likebuttons .googlesplusone,
#deeplinks .likebuttons .tweetthis{
	float: right;
	margin-left: 10px;
}

/***********************************************************************************************

*  Typo3 Content Elements Layout Definitions

**********************************************************************************************/

dl.csc-textpic-image{

	overflow: hidden;

}

dd.csc-textpic-caption{

	padding-top: 3px;

	padding-left: 5px;

	font-size: 11px;

	font-style: italic;

}

.csc-frame-invisible{

	padding: 0 20px;

}



/***********************************************************************************************

*  Special Layout Definitions

**********************************************************************************************/

.clearer,

.cleaner{

  clear: both;

}


