/**
 * @project       beck
 * @package       html-css-js
 * @author        VI-jw
**/

/* IE < 9 are prefixed with .old-ie */

@font-face {
	font-family: 'Roboto Bold Condensed';
	src: url('../font/roboto-condensed/robotocondensed-bold-webfont.eot');
    src: url('../font/roboto-condensed/robotocondensed-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/roboto-condensed/RobotoCondensed-Bold.ttf') format('truetype'),
         url('../font/roboto-condensed/robotocondensed-bold-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: 'Roboto Condensed';
	src: url('../font/roboto-condensed-regular/RobotoCondensed-Regular-webfont.eot');
    src: url('../font/roboto-condensed-regular/RobotoCondensed-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/roboto-condensed-regular/RobotoCondensed-Regular-webfont.ttf') format('truetype'),
         url('../font/roboto-condensed-regular/RobotoCondensed-Regular-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 1;
	color: #000;
	-webkit-font-smoothing: antialiased;
}

/* general */
h1 {
	font-family: 'Roboto Bold Condensed', Arial, sans-serif;
	font-weight: normal;
	margin: 0;
	padding: 0;
	font-weight: normal;
	line-height: 1;
}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

a {
	text-decoration: none;
	color: #000;
}

a.button {
	font-family: 'Roboto Bold Condensed', Arial, Helvetica, sans-serif;
	font-size: 14px;
	display: inline-block;
	color: #fff;
	text-align: center;
	padding: 7px 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-moz-box-shadow: 0px 2px 4px 0px rgba( 0, 0, 0, 0.3 );
	-webkit-box-shadow: 0px 2px 4px 0px rgba( 0, 0, 0, 0.3 );
	box-shadow: 0px 2px 4px 0px rgba( 0, 0, 0, 0.3 );
	margin: 0 0 1px 0;
}

a.button:active {
	margin: 1px 0 0 0;
	-moz-box-shadow: 0px 1px 2px 0px rgba( 0, 0, 0, 0.3 );
	-webkit-box-shadow: 0px 1px 2px 0px rgba( 0, 0, 0, 0.3 );
	box-shadow: 0px 1px 2px 0px rgba( 0, 0, 0, 0.3 );
}

footer a.button {
	-moz-box-shadow: 0px 2px 4px 0px rgba( 0, 0, 0, 0.2 );
	-webkit-box-shadow: 0px 2px 4px 0px rgba( 0, 0, 0, 0.2 );
	box-shadow: 0px 2px 4px 0px rgba( 0, 0, 0, 0.2 );
}

footer a.button:active {
	-moz-box-shadow: 0px 1px 2px 0px rgba( 0, 0, 0, 0.2 );
	-webkit-box-shadow: 0px 1px 2px 0px rgba( 0, 0, 0, 0.2 );
	box-shadow: 0px 1px 2px 0px rgba( 0, 0, 0, 0.2 );
}

.ie-9 a.button {
	box-shadow: 0px 1px 6px 0px rgba( 0, 0, 0, 0.3 );
}

.ie-9 a.button:active {
	box-shadow: 0px 1px 2px 0px rgba( 0, 0, 0, 0.3 );
}

.old-ie a.button {
	border-width: 1px;
	border-style: solid;
	filter: none !important;
}

.textshadow {
	text-shadow: 0 -1px 1px rgba(0,0,0,0.3);
}

/* natural boxsizing */
.full-width,
.half-width,
.actions,
.rectBoxes,
.squareBoxes,
.box-publikumsverlag {
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
}

/* generic classes (used for a.buttons)*/
.full-width {
	width: 100%;
}

.half-width {
	width: 47%;
}

/* a.button wrapper */
.actions {
	padding: 0 17px;
	position: absolute;
	bottom: 16px;
	width: 100%;
}

.rectBoxes .actions {
	left: 0;
}


/* defaults (init and no-js version) */
.page-wrapper {
	min-width: 872px;
	width: 872px;
	margin: 0 auto;
}

.main {
	height: 508px;
}


/* header */
header {
	padding: 0;
	margin-bottom: 20px;
}

.header-logo-wrapper,
.header-meta-wrapper {
	border-bottom: 1px solid #b2b2b2;
}

.header-logo-wrapper {
	width: 610px;
	padding: 0 0 9px;
}

.header-meta-wrapper {
	width: 241px;
	margin-left: 20px;
	padding: 20px 0 8px;
}

/* header meta nav */

.header-meta-nav ul {
	float: right;
	padding: 0;
	margin: 21px 0 4px 0;
	display: block;
}

.header-meta-nav ul li {
	display: inline-block;
	margin-left: 18px;
}

.header-meta-nav ul li:first-child {
	margin-left: 0;
}

.header-meta-nav ul li a {
	color: #666;
	text-decoration: none;
	font-size: 12px;
	line-height: 1;
	position: relative;
}

.header-meta-nav ul li a:active,
footer ul a:active {
	position: relative;
	top: 1px;
	zoom: 1;
}

.header-meta-nav ul li a:hover {
	color: #999;
}

.header-meta-nav ul li a:before {
	content: "";
	width: 4px;
	height: 7px;
	background-color: #fff;
	position: relative;
	top: -1px;
	left: 0;
	background-image: url(../img/link-arrows.png);
	display: inline-block;
	margin-right: 5px;
}

.header-meta-nav ul li a:hover:before {
	background-position: -4px 0;
}


/* content boxes */
.box + .box {
	margin-left: 20px;
}

.squareBoxes {
	width: 295px;
	height: 270px;
	background-image: url(../img/highlight_164.png);
}

.squareBoxes ul {
	margin: 10px 0 10px;
}

.squareBoxes ul a {
	display: block;
	text-decoration: none;
	color: #fff;
	padding: 7px 17px;
	font-size: 14px;
}

.squareBoxes ul a:hover {
	background-color: rgba(255,255,255,0.15);
}

.squareBoxes ul a:active {
	background-color: rgba(255,255,255,0.25);
}

/* ie8 fallback */
.old-ie .box-shop ul a {
	zoom: 1;
}

.old-ie .box-shop ul a:hover {
	background-color: #90989e;
}

.old-ie .box-shop ul a:active {
	background-color: #9da4aa;
}

.old-ie .box-online ul a:hover {
	background-color: #e54f57;
}

.old-ie .box-online ul a:active {
	background-color: #e6656c;
}

.squareBoxes ul a:before {
	content: "";
	width: 6px;
	height: 10px;
	position: relative;
	top: 0;
	left: 0;
	background-image: url(../img/arrow_link.png);
	display: inline-block;
	margin-right: 5px;
}

.squareBoxes,
.rectBoxes,
.box-publikumsverlag {
	background-repeat: no-repeat;
	background-position: top right;
}


/* rectBoxes */
.rectBoxes {
	width: 137px;
	height: 218px;
	padding: 20px 17px;
	color: #fff;
	font-size: 12px;
	line-height: 18px;
	position: relative;
	background-image: url(../img/highlight_133.png);
}

.rectBoxes h1 {
	color: #fff;
	font-size: 16px;
	line-height: 20px;
}

.rectBoxes h1 + p {
	margin-top: 25px;
}

.box-publikumsverlag {
	height: 508px;
	width: 241px;
}

.squareBoxes,
.box-publikumsverlag {
	padding: 12px 0;
	font-size: 15px;
	line-height: 18px;
	position: relative;
}

.squareBoxes a.button,
.box-publikumsverlag a.button {
	padding: 11px 0;
	font-size: 16px;
}


/* footer */
footer {
	margin-top: 20px;
}

footer article {
	padding: 22px 17px 20px;
	font-size: 12px;
	line-height: 18px;
	position: relative;
}

footer h1 + p {
	margin-top: 17px;
	height: 100px;
}

footer h1 + ul {
	margin-top: 17px;
}

footer p + a {
	margin-top: 10px;
}

footer h1 {
	font-size: 14px;
	color: #333;
}

footer ul li {
	margin-top: 8px;
}

footer ul li:first-child {
	margin-top: 0;
}

footer ul a {
	display: inline-block;
	text-indent: -9px;
	margin-left: 9px;
}

footer ul a:hover {
	color: #666;
}

footer ul a:before {
	content: "";
	width: 4px;
	height: 7px;
	position: relative;
	top: -1px;
	left: 0;
	background-image: url(../img/link-arrows.png);
	background-position: 0 -7px;
	display: inline-block;
	margin-right: 5px;
}

footer ul a:hover:before {
	background-position: -4px -7px;
}

/* list in 2nd column */
footer ul.top-spacer {
	display: inline-block;
	margin-top: 31px;
}


.filled,
.column {
	background-color: #ececec;
}

.column {
	margin-left: 20px;
}

.row {
	margin-top: 20px;
}

.row:first-child {
	margin-top: 0;
}

.column:first-child {
	margin-left: 0;
}

.span-4 {
	width: 100%;
}

.span-4 .span-1 {
	width: 203px;
}

.span-1,
.span-4 {
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
}

/* imprint */
.imprint-wrapper {
	text-align: center;
	margin: 33px 0;
	color: #848484;
	font-size: 11px;
	line-height: 19px;
}

.imprint-wrapper a {
	color: #848484;
	text-decoration: none;
}

.imprint-wrapper a:hover {
	color: #999;
}

/* 1st row */
.box-shop h1,
.box-online h1,
.box-publikumsverlag h1 {
	background-repeat: no-repeat;
	text-indent: -2000px;
	height: 56px;
	background-position: 17px 0;
}

.box-shop h1 {
	background-image: url(../img/logo_beckshop.png);
}

.box-online h1 {
	background-image: url(../img/logo_beck-online.png);
}

.box-publikumsverlag h1 {
	background-image: url(../img/logo_chbeck_lsw_white.png);
	background-position: 17px 10px;
}

/* buttons in colors */
.box-shop {
	background-color: #7c868d;
}

.box-shop a.button {
	background-color: #91999f; /* Old browsers */
  	background-image: -moz-linear-gradient( 90deg, rgb(124,134,141) 0%, rgb(163,170,175) 100%);
  	background-image: -webkit-linear-gradient( 90deg, rgb(124,134,141) 0%, rgb(163,170,175) 100%);
  	background-image: -ms-linear-gradient( 90deg, rgb(124,134,141) 0%, rgb(163,170,175) 100%);
}

.box-shop a.button:hover {
	background-color: #9da4a9; /* Old browsers */
  	background-image: -moz-linear-gradient( 90deg, rgb(139,148,155) 0%, rgb(177,184,189) 100%);
  	background-image: -webkit-linear-gradient( 90deg, rgb(139,148,155) 0%, rgb(177,184,189) 100%);
  	background-image: -ms-linear-gradient( 90deg, rgb(139,148,155) 0%, rgb(177,184,189) 100%);
}

.old-ie .box-shop a.button {
	background-color: #91999f;
	border-color: #a7adb2 #a7adb2 #4f565a #4f565a;
}

.old-ie .box-shop a.button:hover {
	background-color: #9da4a9;
}

.box-online {
	background-color: #de313b;
}

.box-online a.button {
	background-color: #e54f57; /* Old browsers */
	background-image: -moz-linear-gradient( 90deg, rgb(224,47,56) 0%, rgb(233,107,114) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(224,47,56) 0%, rgb(233,107,114) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(224,47,56) 0%, rgb(233,107,114) 100%);
}

.box-online a.button:hover {
	background-color: #e7636a; /* Old browsers */
  	background-image: -moz-linear-gradient( 90deg, rgb(228,58,67) 0%, rgb(236,126,132) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(228,58,67) 0%, rgb(236,126,132) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(228,58,67) 0%, rgb(236,126,132) 100%);
}

.old-ie .box-online a.button {
	background-color: #e54f57;
	border-color: #e86168 #e86168 #c7262e #c7262e;
}

.old-ie .box-online a.button:hover {
	background-color: #e7636a;
}

.box-publikumsverlag {
	background-color: #95664c;
	background-image: url(../img/highlight_225.png);
}

.box-publikumsverlag a.button {
	background-color: #a57d67; /* Old browsers */
	background-image: -moz-linear-gradient( 90deg, rgb(149,102,76) 0%, rgb(181,148,130) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(149,102,76) 0%, rgb(181,148,130) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(149,102,76) 0%, rgb(181,148,130) 100%);
}

.box-publikumsverlag a.button:hover {
	background-color: #ad8975; /* Old browsers */
	background-image: -moz-linear-gradient( 90deg, rgb(157,113,88) 0%, rgb(191,161,145) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(157,113,88) 0%, rgb(191,161,145) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(157,113,88) 0%, rgb(191,161,145) 100%);
}

.old-ie .box-publikumsverlag a.button {
	background-color: #a57d67;
	border-color: #ae8a76 #ae8a76 #81553e #81553e;
}

.old-ie .box-publikumsverlag a.button:hover {
	background-color: #ad8975;
}


/* 2nd row */
.box-aktuell {
 	background-color: #de313b;
}

.box-aktuell a.button {
	background-color: #e54f57; /* Old browsers */
	background-image: -moz-linear-gradient( 90deg, rgb(224,47,56) 0%, rgb(233,107,114) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(224,47,56) 0%, rgb(233,107,114) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(224,47,56) 0%, rgb(233,107,114) 100%);
}

.box-aktuell a.button:hover {
	background-color: #e7636a; /* Old browsers */
  	background-image: -moz-linear-gradient( 90deg, rgb(228,58,67) 0%, rgb(236,126,132) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(228,58,67) 0%, rgb(236,126,132) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(228,58,67) 0%, rgb(236,126,132) 100%);
}

.old-ie .box-aktuell a.button {
	background-color: #e54f57;
	border-color: #e86168 #e86168 #c7262e #c7262e;
}

.old-ie .box-aktuell a.button:hover {
	background-color: #e7636a;
}

.box-akademie {
	background-color: #333;
}

.box-akademie a.button {
	background-color: #4e4e4e; /* Old browsers */
  	background-image: -moz-linear-gradient( 90deg, rgb(51,51,51) 0%, rgb(110,110,110) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(51,51,51) 0%, rgb(110,110,110) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(51,51,51) 0%, rgb(110,110,110) 100%);
}

.box-akademie a.button:hover {
	background-color: #595959; /* Old browsers */
	background-image: -moz-linear-gradient( 90deg, rgb(61,61,61) 0%, rgb(120,120,120) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(61,61,61) 0%, rgb(120,120,120) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(61,61,61) 0%, rgb(120,120,120) 100%);
}

.old-ie .box-akademie a.button {
	background-color: #4e4e4e;
	border-color: #606060 #606060 #242424 #242424;
}

.old-ie .box-akademie a.button:hover {
	background-color: #595959;
}

.box-stellenmarkt {
	background-color: #ec661c;
}

.box-stellenmarkt a.button {
	background-color: #ef7c3d; /* Old browsers */
	background-image: -moz-linear-gradient( 90deg, rgb(236,102,28) 0%, rgb(242,146,94) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(236,102,28) 0%, rgb(242,146,94) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(236,102,28) 0%, rgb(242,146,94) 100%);
}

.box-stellenmarkt a.button:hover {
	background-color: #f08a52; /* Old browsers */
	background-image: -moz-linear-gradient( 90deg, rgb(238,112,42) 0%, rgb(242,159,114) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(238,112,42) 0%, rgb(242,159,114) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(238,112,42) 0%, rgb(242,159,114) 100%);
}


.old-ie .box-stellenmarkt a.button {
	background-color: #ef7c3d;
	border-color: #f18951 #f18951 #dc5a18 #dc5a18;
}

.old-ie .box-stellenmarkt a.button:hover {
	background-color: #f08a52;
}

.box-community {
	background-color: #bd2726;
}

.box-community a.button {
	background-color: #c64746; /* Old browsers */
	background-image: -moz-linear-gradient( 90deg, rgb(189,39,38) 0%, rgb(208,102,101) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(189,39,38) 0%, rgb(208,102,101) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(189,39,38) 0%, rgb(208,102,101) 100%);
}

.box-community a.button:hover {
	background-color: #ca5756; /* Old browsers */
	background-image: -moz-linear-gradient( 90deg, rgb(192,48,47) 0%, rgb(213,117,116) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(192,48,47) 0%, rgb(213,117,116) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(192,48,47) 0%, rgb(213,117,116) 100%);
}

.old-ie .box-community a.button {
	background-color: #c64746;
	border-color: #cc5a59 #cc5a59 #b02321 #b02321;
}

.old-ie .box-community a.button:hover {
	background-color: #ca5756;
}



/* buttonlinks in footer */
footer a.button {
	color: #333;
	background-image: -moz-linear-gradient( 90deg, rgb(236,236,236) 0%, rgb(245,245,245) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(236,236,236) 0%, rgb(245,245,245) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(236,236,236) 0%, rgb(245,245,245) 100%);
}

footer a.button:hover {
	background-color: #fdfdfd; /* Old browsers */
	background-image: -moz-linear-gradient( 90deg, rgb(246,246,246) 0%, rgb(255,255,255) 100%);
	background-image: -webkit-linear-gradient( 90deg, rgb(246,246,246) 0%, rgb(255,255,255) 100%);
	background-image: -ms-linear-gradient( 90deg, rgb(246,246,246) 0%, rgb(255,255,255) 100%);
}


.old-ie footer a.button {
	background-color: #f7f7f7;
	border-color: #fff #fff #d4d4d4 #d4d4d4;
}

.old-ie footer a.button:hover {
	background-color: #fdfdfd;
}


@media screen and (min-height: 680px) and (min-width: 1280px) {

	.squareBoxes ul {
		margin-top: 24px;
	}

	.squareBoxes ul a {
		font-size: 16px;
	}

	.rectBoxes h1 {
		font-size: 18px;
	}

	.rectBoxes p {
		font-size: 14px;
		line-height: 19px;
	}

	.footer-row1 h1 {
		font-size: 16px;
	}

	.footer-row1 p {
		font-size: 14px;
		line-height: 19px;
	}
}




/* debugger */
#debugger {
	position: absolute;
	top: 0;
	left: 0;
	background-color: #333;
	color: #fff;
	padding: 3px;
}