@font-face { font-family: 'Futura'; src: url('../../fonts/FuturaStd-CondensedLight.otf'); }

table { border-spacing: 0px; }
div.centered { padding-bottom: 15px }
table.centered { margin: 0 auto }
table td.header h1 { margin: 0px!important; padding: 0px!important; font-family: 'Open Sans Condensed', sans-serif;  }

table.singleHouse { margin-top: 10px; }
table td.date { vertical-align: center; height: 40px ; line-height: 40px; color: #944a87; font-family: 'Open Sans Condensed', sans-serif; font-size: 21px; font-weight: bold }
table td.date > img { padding-left: 24px }
table td.bold { font-weight: normal; font-size: 20px; font-family: 'Open Sans Condensed', sans-serif;  }
table td.star { width: 50px }
table td.textc { vertical-align: middle; color: #944a87; font-size: 20px }
table tr, table td { vertical-align: top; padding: 0px!important; }
table td.houseImage img { height: 212px; width: 214px; display: inline-block;}
table td.spaceleft { width: 50px; text-align: right }
table td.spaceright { width: 50px; }
h2 { color: #944a87; }
h3 { color: #944a87; }

hr.seperator { margin: 40px 0; }

div.regards { margin-top: 40px }

.nospace { margin: 0px!important ; padding: 0px!important }
.super { font-size: 0.8em; position: relative; bottom: 0.5em; }

#xMasWrapper a { cursor: pointer; }

#xMasWrapper { width: 700px; margin:auto; background-repeat-x: inherit; background: url('/templates/bj/images/xmas/final/rahmen_mitte_final.jpg'); font-family: 'Arial', sans-serif; font-size: 14px; }

#xMasPlainText { width: 547px; margin: auto; padding: 0px 20px 20px 20px; }
#xMasPlainText a { font-weight: bold; text-decoration:underline; }

.xMasPrices div.price { margin-top: 40px!important; }
.xMasPrices div.padding { padding-top: 15px }

div.xMasPictureHouse { position: relative; width: 210px; /*top: 330px; right: 460px;*/  margin-top: -31px; margin-right: -47px; float: right; height: 200px;  }


#xMasWrapper .textWrap { margin: 0; }
#xMasWrapper .textWrap .text { margin-bottom: 30px; }
#xMasWrapper div.question.star { margin: 25px 0px }
#xMasWrapper a.underlined { text-decoration: underline }
#xMasWrapper span.text { display: inline-block; margin-bottom: 40px; text-align: justify; }

#xMasWrapper span.seperator { margin: 20px 0px; }
#xMasWrapper span.reminder { font-weight: bold; }
#xMasWrapper span.regards { font-style: italic; text-align: left; padding-left: 30px;   }
#xMasWrapper span.nospace { padding-left: 0px!important }
#xMasWrapper span.sub { padding-left: 0px!important }

#xMasWrapper div.low-opacity { background-color: rgba(255,255,255, 0.7)!important }
#xMasWrapper div.content { background-color: rgba(255, 255, 255, 1); width: 547px; margin: auto; padding: 0px 20px 20px 20px; }
#xMasWrapper div.sponsors { padding: 20px 20px 20px 20px; font-weight: bold; }
#xMasWrapper > .sponsors > div.sponsors { margin: 10px 0px 10px 0px; font-weight: bold; }

#xMasWrapper > .content h1 { padding: 0; padding-top: 15px; }

#xMasWrapper .wrapping #xMasPicture { position: relative; width: 270px; margin: 0; margin-top: -31px; margin-right: -55px; margin-left: 25px; float: right; }
#xMasWrapper .wrapping #xMasPicture img { width: 100%; }
#xMasPictureHouse { position: relative; width: 210px; margin-top: -31px; margin-right: -47px; float: right; height: 200px; }
#xMasWrapper div.innercontent { padding: 20px 0px 0px 0px }

#xMasLyrics { text-align: center; margin: 20px 0px }

#xMasReminder { margin: 40px 0px }

#xMasHouses { width: 642px;  margin: 20px 40px;  }
#xMasHouses div.doubleHouse { width: 515px; margin: auto }

#xMasHouses div.mid { margin-top: 50px }

#xMasHouses .left { float: left; }
#xMasHouses .middle { float: left;  }
#xMasHouses .right { float: right; }
#xMasHouses .bottom { }

#xMasSponsors {  width: 547px; margin:auto  }
#xMasCpright { width: 547px; margin: 109px auto 0px auto; }

#xMasWrapper div.wrapping.rules { margin-bottom: 20px }

#xMasWrapper div.wrapping.button { padding: 20px 15px 20px 0px }

#xMasContent .text .image img { width: 100%; }

.singleHouse.active,
.houseImage.active,
.houseImageRight.active,
.date.active{ cursor: pointer;}

#xMasWrapper .wrapping { padding: 0; }
#xMasWrapper .wrapping > div,
#xMasWrapper .wrapping > p { margin: 0; margin-bottom: 30px; }
#xMasWrapper .wrapping .xMasPictureHouse { margin-bottom: 0; }
#xMasWrapper .wrapping .introText { margin-bottom: 50px; }
#xMasWrapper .wrapping > div p { margin: 0; margin-bottom: 10px; }

#xMasWrapper ul { margin: 0; }
#xMasWrapper ul.bjBullet { padding-left: 0; list-style: none; }
#xMasWrapper ul.bjBullet > li { padding-left: 15px;
	background-image: url('/templates/bj/images/xmas/bullet.png');
	background-repeat: no-repeat;
	background-position: 0 9px;
}
#xMasWrapper ul.bjBullet.star > li { padding-left: 20px;
	background-image: url('/templates/bj/images/xmas/star_big.png');
	background-size: 15px;
	background-position: 0 2px;
}
#xMasWrapper ul.spaced.sm > li { margin-bottom: 10px; }
#xMasWrapper ul.spaced.lg > li { margin-bottom: 20px; }
#xMasWrapper ul.spaced > li:last-child { margin-bottom: 0; }

#xMasWrapper .floatbox {  }
#xMasWrapper .floatbox::after { content: ''; display: block; height: 0; visibility: hidden; clear: both; }
#xMasWrapper .floatbox.imgLeft .imgWrap { margin-right: 20px; float: left; }
#xMasWrapper .floatbox.imgRight .imgWrap { margin-right: 20px; float: right; }
#xMasWrapper .floatbox .text { overflow: hidden; }

.questionHint { text-align:center; display: block; }
.questionHint.letters { font-size: 24px; }
#xMasWrapper .underline { text-decoration: underline; }
.bold { font-weight:bold; }
.priceToWin h2 { margin-top: 0; font-family: 'Open Sans Condensed'; font-weight: normal; font-size: 21px; line-height: 25px; display: block; position: relative; top: 6px; }
.priceToWin h2::after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.priceToWin h2.nomobile { padding-left: 46px; }
.priceToWin img.star { display: inline-block; margin-right: 8px; float: left; }
.articleImage span.heading { display: inline-block; width: 54%; font-size: 11px; }
.articleImage img { display: inline-block; width: 100%; margin-right: 20px; vertical-align: top; }
.articleImage .center img { margin: 0; }
.xMasCopyright { display: block; margin: auto; position: relative; top: 80px; width: 587px; }
.sideImage + .sideText { display:inline-block; width: 66%; vertical-align: bottom; height: 290px; }
.sideImage + .sideText.fatImage { display:inline-block; width: 52%; vertical-align: bottom; height: 290px; }
.sideImage.special + .sideText.fatImage.special { display: block; width: 100%; vertical-align: top; }

.sideImage + .sideText.overImage { height:370px; width:70%; position: absolute; left:32%; top: 93px; }
.bjtCompetitionComponent .smallInput { width: 45px!important; margin: 10px 20px 10px 0; }
.bjtCompetitionComponent .tinyInput { width: 35px!important; margin: 10px 10px 10px 0; }
.articleImage span.heading.long { width:90%; }
.bjtCompetitionComponent .mediumInput { width: 221px!important; margin: 10px 0; }
.overviewXmas #xMasFooter { background: url('/templates/bj/images/xmas/final/rahmen_unten_final.jpg'); height:220px; margin-top:-200px; }
#xMasFooter { background: url('/templates/bj/images/xmas/final/rahmen_unten_final.jpg'); height:220px; margin-top:-40px; }
#xMasHead { background: url('/templates/bj/images/xmas/final/rahmen_oben_final.jpg'); height:155px; width: 100%;}
.relative { position:relative; }

.mobile { display: none; }
.bjtCompetitionComponent input.special { width: 500px!important }
.noHeight { height: auto!important; }

.sideText.special { width: 100%; }
.sideText.fatImage.specialMode { width: 43%; }
.specialImage { position: relative; }

div.center { text-align: center!important; }

.sponsorThanks {  }
.sponsorThanks span,
.xMasCopyright span { display: block; }
.sponsorThanks span a span,
.xMasCopyright span a span { display: inline-block; }


#xMasWrapper { position: relative; }
#xMasHead { position: absolute;  }
#xMasContent { position: relative; top: 60px; }
#xMasHouses { position: relative; z-index: 10; top: 50px; }

.textWrap img { max-width: 100%; }

#xMasWrapper .articleImage .imgContainer { margin: 20px 0; font-size: 0; }
#xMasWrapper .articleImage .imgContainer .sideText { font-size: 14px; }
#xMasWrapper .articleImage .imgContainer.textOverlap { position: relative; }
#xMasWrapper .articleImage .imgContainer.textOverlap .sideText { position: absolute; }
#xMasWrapper .articleImage .imgContainer.full img { width: 100%; }

#xMasWrapper .registered { position: relative; font-size: 0.9rem; top: -5px; }
#xMasWrapper .sponsorThanks .registered,
#xMasWrapper .xMasCopyright .registered { display: inline-block; }

#xMasWrapper .bjtCompetitionComponent .radioGroup { display: table; }
#xMasWrapper .bjtCompetitionComponent .radioGroup label { display: table-row; }
#xMasWrapper .bjtCompetitionComponent .radioGroup label .cell { display: table-cell; }
#xMasWrapper .bjtCompetitionComponent .radioGroup label .cell:nth-child(1) { width: 25px; }
#xMasWrapper .bjtCompetitionComponent .radioGroup label .cell input { width: 20px!important; margin: 0; vertical-align: middle; }
#xMasWrapper .bjtCompetitionComponent .radioGroup label .cell span { vertical-align: middle; }

#xMasWrapper .iframeWrap { width: 100%; height: 0; padding-bottom: 51%; position: relative; }
#xMasWrapper .iframeWrap iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }

.bjtCompetitionComponent .label.nick { width: 250px!important; }
.bjtCompetitionComponent input#bjusername { width: 250px!important; }

div.mOpti > input[type="checkbox"] { display: block; float: left; margin-right: 8px; }

@media (max-width:759px) {

	#xMasWrapper { font-size: 15px; z-index: 1; }
	#xMasWrapper > .content h1 { background-color: transparent; color: black; }
	#xMasWrapper span.text { font-size: 15px; }

	#xMasWrapper .wrapping { padding: 0 10px; }

	#xMasWrapper { width: 100%; }
	#xMasContent { width: 100%!important; }
	#xMasWrapper div.content  { width: 100%; margin: 0px; padding-left: 0; padding-right: 0px; }
	#xMasHead { max-height: 85px; }
	#xMasFooter { height: 120px; margin-top: 0px; }
	#xMasWrapper .wrapping #xMasPicture { margin-right: 0; margin-top: 0; height: auto; width: 47%; }
	#xMasPicture > img { width: 185px; }
	td.header { width: 100%; }
	tr.fixedHeight td.header h1, table.mOpti tr td h1{ padding: 10px!important }
	tr.fixedHeight { height: 60px; }
	#xMasWrapper .introText { padding: 10px 0; font-size: 15px; }
	#xMasWrapper .introText br { display: none; }
	table.mOpti { width: 100%; }
	button { margin-left: 10px; background-color: transpaRrent; border: none; outline: none; }
	button { color: #924887; font-size: 11px; font-weight: bold; padding: 0; cursor: pointer; }

	.articleImage img.star { float: none; }

	h2.mOpti {  display: inline-block; max-width: 82%; text-align: left; }
	.articleImage .sideImage { max-width: 100%; display: block; margin-left: auto!important; margin-right: auto; }

	#xMasWrapper .wrapping .introText { margin-bottom: 15px }

	#xMasWrapper .articleImage .imgContainer { padding-left: 0; }
	#xMasWrapper .articleImage .imgContainer.textOverlap {  }
	#xMasWrapper .articleImage .imgContainer.textOverlap .sideText { position: static; }

	#xMasWrapper .floatbox.imgLeft .imgWrap,
	#xMasWrapper .floatbox.imgRight .imgWrap { width: 100%; margin: 0 auto 10px; float: none; }

	.textWrap { padding: 10px; }
	div.mOpti.marg { margin-top: 10px; display: block; vertical-align: top;  }
	div.mOpti > input, div.mOpti > span { display: inline-block; text-align: left; vertical-align: top; }
	div.mOpti > span { max-width: 87%; }
	.sideText.fatImage { padding-right: 10px; }
	.sideText { padding-right: 8px; }
	.sideImage + .sideText.fatImage { width: 100%; display: block; height: auto; font-size: 15px; }
	div.xMasPictureHouse { width: 160px; height: auto!important; }

	#xMasWrapper span.text { text-align: left; }

	.bjtCompetitionComponent input.special { width: 93%!important }
	.bjtCompetitionComponent .smallInput { display: inline-block; }
	.reducedSize { width: 100%!Important }
	.specialImage >  .sideText.fatImage.reducedSize { position: static!important; }
	.sideImage + .sideText.overImage { position: static!important; display: block; width: 100%; height: 220px; }
	.sideImage + .sideText { display: block; width: 100%; height: auto; }
	.specialMode { display: block!important; width: 100%!important; }

	p.label { margin-bottom: 7px; }

	.bjtCompetitionComponent input#bjusername { width: 93%!important; }

	table.singleHouse { margin-left: auto; margin-right: auto; }
	.mobile { display: block; }
	#xMasHouses { margin: 0px; width: 100%; }
	.xMasCopyright { font-size: 13px!important; }

	#xMasWrapper .bjtCompetitionComponent .radioGroup { margin-bottom: 30px; }
	#xMasWrapper .bjtCompetitionComponent .radioGroup label .cell { padding-bottom: 10px; }
}