html {
height:100%;
}
/*
#####################################################
TYPOGRAPHY
c’t FONTS
#####################################################
*/
@font-face {
font-family: 'mono';
src: url('../fonts/FreeMono.ttf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'monobold';
src: url('../fonts/FreeMonoBold.ttf');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'regular';
src: url('../fonts/DejaVuSansCondensed.ttf');
}
@font-face {
font-family: 'regularitalic';
src: url('../fonts/DejaVuSansCondensed-Oblique.ttf');
}
@font-face {
font-family: 'regularbold';
src: url('../fonts/DejaVuSansCondensed-Bold.ttf');
}
@font-face {
font-family: 'regularbolditalic';
src: url('../fonts/DejaVuSansCondensed-BoldOblique.ttf');
}
/*
#####################################################
TYPOGRAPHY
fonts, sizes, colors, decoration, styles
#####################################################
*/
body {
font-family: 'regular', sans-serif;
font-size: 16px;
line-height: 1.5em;
}
body.fontSize12 {
font-size: 12px;
}
body.fontSize14 {
font-size: 14px;
}
body.fontSize16 {
font-size: 16px;
}
body.fontSize20 {
font-size: 20px;
}
body.fontSize24 {
font-size: 24px;
}
article {
position:relative;
}
article,
.kasten {
font-size: 0.95em;
}
h1, h2, h3, h4, h5, h6,
.article_head h1,
.article_kurz_vorgestellt h3.z,
.article_kurz_vorgestellt h3.z1,
.article_kurz_vorgestellt .tel,
.body_autoinhalt p.rubric,
.article_text .kasten_link .kasten_title,
strong, .vorspann strong, .b1 {
font-family: 'regularbold', sans-serif;
}
pre, code,
.l, .lf,
.span[name=lf],
.box_code,
.text_editorial,
.text_editorial h4,
textarea.pre {
font-family: 'mono', monospace;
font-size: 1.1em;
}
a {
text-decoration: none;
}
.p a,
.fussnote a,
span[name="a"],
span a,
.kasten a,
.tel a {
text-decoration: underline;
}
.textkaesten a,
.kasten_img a {
text-decoration: none;
}
h1 {
font-size: 2.7em;
line-height: 4.3em;
}
h2, h3, h4, h5 {
font-size: 1.3em;
line-height: 1.3em;
}
h5 {
font-size: 1.1em;
line-height: 1.2em;
}
.content_text h3 {
margin: 1.2em 0 0.6em 0;
}
.body_hotline .content_text h3,
.faq_thema h3,
.hotline_thema h3 {
clear:both;
}
.text_editorial h4 {
font-size: 1em;
}
.article_kurz_vorgestellt h4 {
font-size: 1.8em;
}
h1, h2, h3, h4, h5, h6,
p,
a,
.fussnote a,
.figcaption {
word-break: break-word;
-ms-word-break: break-all;
-moz-hyphens: auto;
-webkit-hyphens: auto;
-ms-hyphens: auto;
-hyphens: auto;
hyphens: auto;
hyphenate-lines: 4;
/** android test **/
overflow-wrap: hyphenate;
}
.figcaption,
.play_text {
padding: 0.313em 0;
text-align: left;
font: 0.95em/1.5em 'regularbold',sans-serif;
}
.figcaptionQuelle{
font-size:70%;
font-family: 'regularbold', sans-serif;
}
/* seitennummern */
.seite {
float:right;
margin-right:-50px;
display:none;
text-decoration:none;
font-size:75%;
}
.article_head h1 {
line-height: 1em;
}
.aufmacher3_headline,
.aufmacher5_headline {
font-size: 0.95em;
}
p.article_description {
font-family: 'regularbold',sans-serif;
font-weight: 600;
line-height: 1.95em;
}
.webcode p {
padding: 1em 0;
text-indent: 0;
font-size: 0.95em;
}
.fussnote {
font-size: 0.86em;
line-height:1.3em;
}
.fussnote li {
padding:0 0 0.625em 1.875em;
}
.faq_headline {
float: left;
height: 18em;
width: 21em;
line-height: 1.2em;
padding-bottom: 0;
text-indent:0;
}
.faq_headline img {
max-width: 100%;
}
.faq_title {
padding-bottom:0.3em;
line-height: 1.1em;
font-size: 400%;
}
p.question {
padding-bottom:0em;
}
.icon_replace {
float:left;
display: inline-block;
height: 2.7em;
width: 1.763em;
padding:0.2em 0.5em 0 0;
margin-right:0.5em;
background-size: contain;
background-repeat: no-repeat;
background-position: 0 0.2em;
}
.question .icon_replace {
background-image: url("../../../assets/ct/images/hotline_fragezeichen.png");
}
.answer .icon_replace {
background-image: url("../../../assets/ct/images/hotline_ausrufezeichen.png");
}
.frage,
.italic,
.redaktion,
em {
font-family: 'regularitalic';
font-style:italic;
}
.zit {
font:normal 1.8em/1.1em 'regularbold',sans-serif;
text-align:center;
}
sup {
font-size:0.7em;
vertical-align:baseline;
}
sub {
font-size:0.7em;
vertical-align:baseline;
}
span[name="Initial"],
span.Initial {
float: left;
display: inline-block;
font: 3.21em/0.7em 'regularbold', sans-serif !important;
padding: 0.18em 0.1em 0 0;
text-indent: 0;
}
span.InitialBild {
float:left;
max-width:4.39em;
padding:0.2em 0.5em 0 0;
}
.NormalBlau {
font-family: 'regularbold',sans-serif;
}
.article_text .kasten_link {
font-style: italic;
}
.article_text .kasten_link .kasten_title{
font-style: normal;
}
.vita {
font-style:italic;
}
.article_leserbriefe h1 {
line-height: 1em;
}
.servicebox_leserbriefe {
font-size: 0.86em;
}
.body_aktuell h2 {
line-height: 1.4em;
}
.webcode a,
.Softnicht a {
font-family: 'regularbolditalic',sans-serif;
text-decoration: none;
}
.spaltenkasten h2 {
color:#fff;
font-size: 1.466em;
}
.spaltenkasten h3 {
font-size: 1.2em;
}
/* listings */
.box_code {
background: #f0f1e2 url("../../images/copy_button.png") no-repeat 95% bottom;
font-size: 0.95em;
overflow-x: auto;
padding: 1em;
white-space: pre;
}
pre {
margin:1.5em 0;
border:1px solid rgba(0, 0, 0, .02);
}
.listingsliderbuttons {
margin:-1.5em 0 1.5em 0;
text-align: center;
}
.listingsliderbuttons span {
margin-left:1em;
}
#htmlId_1370575256623714 pre,
.rubrik_magazin pre{
white-space: pre-wrap;
}
pre::-webkit-scrollbar {
-webkit-appearance: none;
width: 5px;
height: 5px;
background-color: rgba(0, 0, 0, .02);
}
pre::-webkit-scrollbar-thumb {
border-radius: 3px;
border: 1px solid rgba(0, 0, 0, .05);
background-color: rgba(0, 0, 0, .05);
}
/** aufmacher **/
p.article_description {
font-size: 0.95em;
font-weight: inherit;
line-height: 1.5em;
}
.vorspann {
font: 1.075em/1.5em 'regularbold',sans-serif;
}
/* impressum **/
.box_impressum .headline {
font-size: 3.5em;
line-height: 2.0em;
}
.box_impressum h3 {
font-family: 'regularbold',sans-serif;
font-size: 1.2em;
color:#030303;
}
.box_impressum p {
padding-bottom:0;
font-size: 0.9em;
}
.ib {
display:block;
font-family: 'regularbold',sans-serif;
}
.NormalSchwarz {
font-family: 'regularbold',sans-serif;
}
/*
#####################################################
COLORS
#####################################################
*/
body,
a {
color: #373737;
}
.z1 {
color: #0071a1;
}
.webcode a,
.Softnicht a {
color: #0070CF;
}
.article_leserbriefe h1,
.article_leserbriefe .colored,
.rubrik_standard .colored,
.rubrik_standard .z1,
.rubrik_standard .zit,
.rubrik_standard .article_aktuell p.Initial span[name=Initial],
.rubrik_standard .article_aktuell p.Initial .Initial,
.rubrik_standard .article_text .Initial span[name=Initial],
.rubrik_standard .article_text .Initial .Initial,
.rubrik_standard .infobar,
.rubrik_standard .kastenspalte h3 {
color: #ab8036;
}
.rubrik_aktuell .colored,
.rubrik_aktuell .z1,
.rubrik_aktuell .zit,
.rubrik_aktuell .article_aktuell p.Initial span[name=Initial],
.rubrik_aktuell .article_aktuell p.Initial .Initial,
.rubrik_aktuell .article_text .Initial span[name=Initial],
.rubrik_aktuell .article_text .Initial .Initial,
.rubrik_aktuell .infobar,
.rubrik_aktuell .kastenspalte h3 {
color: #9b4334;
}
.rubrik_hardware .colored,
.rubrik_hardware .z1,
.rubrik_hardware .zit,
.rubrik_hardware .article_aktuell p.Initial span[name=Initial],
.rubrik_hardware .article_aktuell p.Initial .Initial,
.rubrik_hardware .article_text .Initial span[name=Initial],
.rubrik_hardware .article_text .Initial .Initial,
.rubrik_hardware .infobar,
.rubrik_hardware .kastenspalte h3 {
color: #0071a1;
}
.rubrik_software .colored,
.rubrik_software .z1,
.rubrik_software .zit,
.rubrik_software .article_aktuell p.Initial span[name=Initial],
.rubrik_software .article_aktuell p.Initial .Initial,
.rubrik_software .article_text .Initial span[name=Initial],
.rubrik_software .article_text .Initial .Initial,
.rubrik_software .infobar,
.rubrik_software .kastenspalte h3 {
color: #0093a2;
}
.rubrik_magazin .colored,
.rubrik_magazin .z1,
.rubrik_magazin .zit,
.rubrik_magazin .article_aktuell p.Initial span[name=Initial],
.rubrik_magazin .article_aktuell p.Initial .Initial,
.rubrik_magazin .article_text .Initial span[name=Initial],
.rubrik_magazin .article_text .Initial .Initial,
.rubrik_magazin .infobar,
.rubrik_magazin .kastenspalte h3 {
color: #746177;
}
.rubrik_praxis .colored,
.rubrik_praxis .z1,
.rubrik_praxis .zit,
.rubrik_praxis .article_aktuell p.Initial span[name=Initial],
.rubrik_praxis .article_aktuell p.Initial .Initial,
.rubrik_praxis .article_text .Initial span[name=Initial],
.rubrik_praxis .article_text .Initial .Initial,
.rubrik_praxis .infobar,
.rubrik_praxis .kastenspalte h3,
.b1 {
color: #58b6dd;
}
.rubrik_know-how .colored,
.rubrik_know-how .z1,
.rubrik_know-how .zit,
.rubrik_know-how .article_aktuell p.Initial span[name=Initial],
.rubrik_know-how .article_aktuell p.Initial .Initial,
.rubrik_know-how .article_text .Initial span[name=Initial],
.rubrik_know-how .article_text .Initial .Initial,
.rubrik_know-how .infobar,
.rubrik_know-how .kastenspalte h3 {
color: #769b42;
}
.rubrik_internet .colored,
.rubrik_internet .z1,
.rubrik_internet .zit,
.rubrik_internet .article_aktuell p.Initial span[name=Initial],
.rubrik_internet .article_aktuell p.Initial .Initial,
.rubrik_internet .article_text .Initial span[name=Initial],
.rubrik_internet .article_text .Initial .Initial,
.rubrik_internet .infobar,
.rubrik_internet .kastenspalte h3 {
color: #efac1f;
}
/** trenner **/
.body_kurz_vorgestellt .trenner_color {
display:none;
}
.rubrik_standard .trenner_color,
.rubrik_standard .spaltenkasten h2,
.rubrik_standard .blauerBalken {
background-color: #ab8036;
}
.rubrik_aktuell .trenner_color,
.rubrik_aktuell .spaltenkasten h2,
.rubrik_aktuell .blauerBalken {
background-color: #9b4334;
}
.rubrik_hardware .trenner_color,
.rubrik_hardware .spaltenkasten h2,
.rubrik_hardware .blauerBalken {
background-color: #0071a1;
}
.rubrik_software .trenner_color,
.rubrik_software .spaltenkasten h2,
.rubrik_software .blauerBalken {
background-color: #0093a2;
}
.rubrik_magazin .trenner_color,
.rubrik_magazin .spaltenkasten h2,
.rubrik_magazin .blauerBalken {
background-color: #746177;
}
.rubrik_praxis .trenner_color,
.rubrik_praxis .spaltenkasten h2,
.rubrik_praxis .blauerBalken {
background-color: #58b6dd;
}
.rubrik_know-how .trenner_color,
.rubrik_know-how .spaltenkasten h2,
.rubrik_know-how .blauerBalken {
background-color: #769b42;
}
.rubrik_internet .trenner_color,
.rubrik_internet .spaltenkasten h2,
.rubrik_internet .blauerBalken {
background-color: #efac1f;
}
.article_buchkritik .caption_source {
background-color: #746177;
color:#fff;
}
.rubrik_standard .spaltenkasten {
border:1px solid #ab8036;
}
.rubrik_aktuell .spaltenkasten {
border:1px solid #9b4334;
}
.rubrik_hardware .spaltenkasten {
border:1px solid #0071a1;
}
.rubrik_software .spaltenkasten {
border:1px solid #0093a2;
}
.rubrik_magazin .spaltenkasten {
border:1px solid #746177;
}
.rubrik_praxis .spaltenkasten {
border:1px solid #58b6dd;
}
.rubrik_know-how .spaltenkasten {
border:1px solid #769b42;
}
.rubrik_internet .spaltenkasten {
border:1px solid #efac1f;
}
.rubrik_standard .kastenspalte {
border-top:1px solid #ab8036;
}
.rubrik_aktuell .kastenspalte {
border-top:1px solid #9b4334;
}
.rubrik_hardware .kastenspalte {
border-top:1px solid #0071a1;
}
.rubrik_software .kastenspalte {
border-top:1px solid #0093a2;
}
.rubrik_magazin .kastenspalte {
border-top:1px solid #746177;
}
.rubrik_praxis .kastenspalte {
border-top:1px solid #58b6dd;
}
.rubrik_know-how .kastenspalte {
border-top:1px solid #769b42;
}
.rubrik_internet .kastenspalte {
border-top:1px solid #efac1f;
}
/* kaesten und links zum kasten */
.rubrik_standard .kasten,
.rubrik_standard .textkaesten,
.servicebox_leserbriefe {
background-color: #E4DDD3;
}
.rubrik_aktuell .kasten,
.rubrik_aktuell .textkaesten {
background-color: #f0f0ea;
}
.rubrik_hardware .kasten,
.rubrik_hardware .textkaesten {
background-color: #e7eada;
}
.rubrik_software .kasten,
.rubrik_software .textkaesten {
background-color: #eff2f9;
}
.rubrik_magazin .kasten,
.rubrik_magazin .textkaesten {
background-color: #e2ebf2;
}
.rubrik_praxis .kasten,
.rubrik_praxis .textkaesten {
background-color: #f2f3ef;
}
.rubrik_know-how .kasten,
.rubrik_know-how .textkaesten {
background-color: #eaebdf;
}
.rubrik_internet .kasten,
.rubrik_internet .textkaesten {
background-color: #f5f3ea;
}
.textkaesten.spalten {
background:none !important;
}
.rubrik_aktuell .box_yellow {
background: #f0f1e2;
}
/* schlagseite */
.body_schlagseite #singleImage {
margin:0.5em;
-moz-transform: rotate(1deg);
-ms-transform: rotate(1deg);
-webkit-transform: rotate(1deg);
transform: rotate(1deg);
}
/* zett kasten */
#zett_kasten ul {
padding:0.3em 0;
}
#zett_kasten li {
padding:0.2em 0.5em;
}
#zett_kasten .asset_position {
margin: 0;
}
.kasten h3 {
padding:1em 0 0.5em;
}
.textkaesten a {
display:block;
}
.kasten_img {
padding-top:2em;
}
.kasten_img img {
border:0;
}
.kasten .kBlCBottom {
padding-top:1em;
}
.kasten .kastenBacklink {
padding: 5px 15px 4px;
background: linear-gradient(to top, rgba(0, 0, 0, 0.12) 0%, transparent 100%) repeat;
border-bottom: 1px solid #A0A2A5;
border-radius: 5px 5px 5px 5px;
color: #666666;
font-size: 0.75em;
font-weight: bold;
text-shadow: 0 1px 0 #EEEEEE;
text-transform: uppercase;
text-decoration: none;
}
/* verzeichniskasten */
.box_verzeichnis {
padding:0.5em;
}
.box_verzeichnis li{
padding:0.3em 0;
}
.box_verzeichnis .nobr{
float:right;
}
.article.notiz .box_yellow.inline_pic,
.article.notiz .box_yellow.only_inline_pic {
padding:1.5em 2em 0.75em 2em;
}
.article.notiz .box_yellow {
padding: 1em;
}
.box_yellow .pen {
display: block;
margin-bottom: 1em;
padding: 0.5em 0 0.1em 1.5em;
background: url("../../images/note_pen.png") no-repeat left bottom;
}
.box_yellow .pen span{
margin-left:-1.25em;
padding:0 0 0.08em 1.25em;
border-bottom:1px solid #373737;
}
.box_yellow .pen img {
display:none;
}
.kasten_img.kasten_inline_pic img {
max-width: 100%;
}
.kasten_inline_pic {
clear:both;
padding-bottom:1.5em;
}
.spiele_tabelle,
.asset_link_tabellen{
padding-top:1.5em;
}
/* editorial */
.image_editorial{
text-align:center;
}
.text_editorial {
padding:0 1em 0.5em 1em;
}
.text_editorial h4 {
padding:1.5em 0em;
}
.unterschrift {
float:right;
max-width:20.625em;
padding:2em 0 1em 0;
}
.unterschrift img {
display:block;
max-width:100%;
}
.text_editorial .button {
clear: both;
float:left;
display:block;
margin:2em 0;
}
.article .pict {
display:inline-block;
float:left;
padding:0.3em 0.5em 0 0;
}
.article .os {
/*
position: relative;
float: left;*/
max-height: 40px;
max-width: 40px;
/*bottom: -4px;
margin-bottom: 7px;*/
}
.article .picto_00,
.article .picto_01,
.article .picto_02,
.article .picto_03,
.article .picto_04,
.article .picto_05 {
text-indent: 0;
}
/* kids bits */
.box_kids {
background:#1d98a7 url("../images/kids_bits_box_bg.png") no-repeat right center;
}
/* impressum */
.box_impressum {
padding:1.875em;
font-size: 0.7em;
background-color: #F1E6D5;
}
.impressum_text{
margin-top:2.813em;
padding:1.875em;
font-size: 0.7em;
background:#fff;
}
.box_impressum .headline {
padding-bottom:0.25em;
font-size: 1.9em;
}
.box_impressum .z,
.box_impressum p,
.impressum_text h3,
.impressum_text p {
margin:0.75em 0;
}
/** spaltenkasten **/
.article .asset_position.spalten {
display:block;
float: none !important;
width:auto !important;
background:none;
}
.spaltenkasten {
margin-top: 1.5em;
padding-bottom: 1em;
text-align: left;
}
.spaltenkasten h2 {
margin:0;
padding:0.3em 0.5em;
}
.spaltenkasten h3 {
min-height: 3em;
}
.spaltenkasten_img {
height:auto;
text-align:center;
margin-top:1em;
}
.kastenspalte {
margin:0 1.5% 1em 1.5%;
text-align:left;
}
.kastenspalte:first-child {
border-top:none;
}
.kastenspalte img {
max-width:100%;
max-height:30em;
}
.kastenspalte p {
margin:0;
line-height: 1.4em;
}
/* KIDS BITS */
.box_kids {
clear:both;
color: #FFF;
background-color: #1d98a7;
padding: 18px 80px 18px 10px;
margin: 25px 0;
background-image: url(../images/kids_bits_box_bg.png);
background-repeat: no-repeat;
background-position: right center;
text-align: center;
}
.box_kids p {
display:inline;
margin:0 0.1em;
}
/** hotline / FAQ **/
.article_hotline {
background: url("../images/hotline_bg.png") no-repeat;
padding-top: 65px;
}
.hotline_headline {
float: left;
height: 3.875em;
width: 12em;
margin-top: 0 !important;
background: url("../images/hotline_headline.png") no-repeat;
overflow: hidden;
text-indent: -9999px;
}
.article_hotline .tel {
text-indent:0;
clear: both;
}
.hotline_buttons {
float: left;
margin:1.25em 0;
}
.hotline_buttons a {
float: left;
margin-right: 1.25em;
}
p.question {
margin-bottom: 1.5em;
text-indent: 0;
}
p.answer {
margin-bottom: 1em;
text-indent: 0;
}
.faq_headline {
height: 13em;
width: 15em;
}
.faq_header_text {
float:left;
padding-bottom:2em;
max-width:100%;
}
p.faq_headline, .faq_header_text p {
text-indent: 0;
}
.faq_autor {
font-family: 'regularbold', sans-serif;
}
/* internet web-tipps */
.artrubrik_internet .tel{
font-family: 'regularbold', sans-serif;
text-indent:0;
}
/* story */
.rubrik_magazin p.Initial {
padding-top:1em;
}
.rubrik_magazin .preListingBox pre {
border:none;
}
/* ct 19/13, s.36, htmlId_1378457475761129 */
.linksbuendig{
display:inline-block;
width:50%;
}
.tb .rechtsbuendig{
display:inline-block;
width:20%;
text-align:right;
}
/** form elements **/
.button {
background:#e1e6ea;
border-bottom: 1px solid #a0a2a5;
border-radius: 0.5em 0.5em 0.5em 0.5em;
box-shadow: 0 0.063em 0.063em rgba(0, 0, 0, 0.2);
color: #8c96c0;
font-size: 0.9em;
font-family: 'regularbold',sans-serif;
padding: 0.5em 1.875em 0.3em 1.875em;
text-shadow: 0 0.063em 0 #fff;
text-transform: uppercase;
}
.button.small {
padding: 0.375em 0.9375em 0.3em 0.9375em;
}
.button.deactivated {
background:#f3f3f3;
color: #ddd;
border-bottom: 1px solid #c0c2c5;
box-shadow: none;
}
.forum_button {
width:100%;
margin-top: 3em;
}
.content_text,
.content_text_vorgestellt {
padding-bottom: 1em;
}
.leserbriefContent .italic a{
text-decoration: underline;
}
.leserbriefKontextUndContent a {
text-decoration: underline;
}
.leserbriefKontextUndContent a.asset_link {
text-decoration: none !important;
}
.leserbriefContent .leser{
text-align:right;
}
.servicebox_leserbriefe ul {
padding-bottom:1em;
}
.servicebox_leserbriefe li {
margin-left: 1em;
text-indent:-0.7em;
}
.servicebox_leserbriefe li:before {
position:relative;
left:-0.3em;
content:"– ";
}
/** trennlinien **/
.trenner_hotline,
.trenner_vorgestellt,
.trenner_grau,
.trenner_spiele,
.trenner_vorschau {
clear:both;
height: 5px;
margin-top: 50px;
margin-bottom: 50px;
}
.trenner_grau {
margin-bottom: 0;
}
.trenner_hotline {
margin-top: 25px;
margin-bottom: 30px;
}
/*.trenner_spiele {
margin-top: 25px;
margin-bottom: 30px;
}*/
.trenner_vorschau {
background: none;/*#eadbc4;*/
padding: 0 20px 0 20px;
margin-top: 20px;
margin-bottom: 20px;
}
.trenner_grau {
background-color: #e1e1e1;
}
/** aufmacher **/
.figcaptionAufmacher {
position: absolute;
display:inline-block;
background:rgba(255, 255, 255, 0.75);
bottom: 0.5em;
right: 0;
padding: 0 10px;
z-index:100;
}
/* stoerer */
.stoerer {
display:none;
}
/** sonderlocken **/
#htmlId_1383133630883033 .question .TypeSpecial,
#htmlId_1383133630883033 .answer .TypeSpecial {
float:left;
height: 35px;
width: 25px;
padding-right: 10px;
margin-top: 7px;
display: inline-block;
background: url(../images/hotline_fragezeichen.png) no-repeat;
overflow:hidden;
text-indent: -9999px;
}
#htmlId_1383133630883033 .question {
margin-bottom: 1em;
padding-top:1em;
}
#htmlId_1383133630883033 .answer .TypeSpecial {
background-image: url(../images/hotline_ausrufezeichen.png);
}
/* ct 23/13 htmlId_1383305441483503 */
#box_1381906492.kasten .box_meldungen_zweispaltig .kasten_default_pic {
width: auto !important;
margin: 0 0 10px 0 !important;
}
#box_1381906492 .kasten_img img {
max-width: 150px;
margin: 0 1em 0 0;
}
.body_aktuell .question .TypeSpecial,
.body_aktuell .answer .TypeSpecial,
.artrubrik_praxis .question .TypeSpecial,
.artrubrik_praxis .answer .TypeSpecial{
float:left;
height: 35px;
width: 25px;
padding-right: 10px;
margin-top: 7px;
display: inline-block;
overflow:hidden;
text-indent: -9999px;
background-repeat: no-repeat;
}
.body_aktuell .question,
.artrubrik_praxis .question {
min-height: 2.5em;
margin-bottom: 1em;
padding-top:1em;
}
.artrubrik_praxis .question,
.artrubrik_praxis .answer {
display:inline-block;
}
.body_aktuell p.answer,
.artrubrik_praxis p.answer {
margin-bottom: 0 !important;
}
.body_aktuell .question .TypeSpecial {
background: url(../images/aktuell_fragezeichen.png) no-repeat;
}
.body_aktuell .answer .TypeSpecial {
background-image: url(../images/aktuell_ausrufezeichen.png);
}
.rubrik_hardware .question .TypeSpecial {
background: url(../images/hardware_fragezeichen.png) no-repeat;
}
.rubrik_hardware .answer .TypeSpecial {
background-image: url(../images/hardware_ausrufezeichen.png);
}
.rubrik_internet .question .TypeSpecial {
background: url(../images/internet_fragezeichen.png) no-repeat;
}
.rubrik_internet .answer .TypeSpecial {
background-image: url(../images/internet_ausrufezeichen.png);
}
.rubrik_know-how .question .TypeSpecial {
background: url(../images/know-how_fragezeichen.png) no-repeat;
}
.rubrik_know-how .answer .TypeSpecial {
background-image: url(../images/know-how_ausrufezeichen.png);
}
.rubrik_magazin .question .TypeSpecial {
background: url(../images/magazin_fragezeichen.png) no-repeat;
}
.rubrik_magazin .answer .TypeSpecial {
background-image: url(../images/magazin_ausrufezeichen.png);
}
.artrubrik_praxis .question .TypeSpecial {
background: url(../images/praxis_fragezeichen.png) no-repeat;
}
.artrubrik_praxis .answer .TypeSpecial {
background-image: url(../images/praxis_ausrufezeichen.png);
}
.rubrik_software .question .TypeSpecial {
background: url(../images/software_fragezeichen.png) no-repeat;
}
.rubrik_software .answer .TypeSpecial {
background-image: url(../images/software_ausrufezeichen.png);
}
.rubrik_staendige_rubriken .question .TypeSpecial {
background: url(../images/standard_fragezeichen.png) no-repeat;
}
.rubrik_staendige_rubriken .answer .TypeSpecial {
background-image: url(../images/standard_ausrufezeichen.png);
}
/* ct 24/13 */
.inlineimage {
padding-bottom:3em;
}
.inlineimage img {
max-width:100%;
}
.inlineimage .figcaption {
font-weight:bold;
}
#htmlId_1384416577427034 .forum_button {
display:none;
}
/*
##############################
MEDIA QUERIES
##############################
*/
@media screen and (max-width: 512px) {
h1 {
font-size: 2.0em;
}
}
@media (min-width: 640px) {
/*article:after{content:"> 640px"}*/
article,
.article_head,
#appInhalt {
padding:1em 3em;
}
.article_head {
padding:1em 3em 0 3em;
}
.article.notiz .box_yellow {
padding: 1.5em 2em;
}
/* faq/hotline */
.faq_header_text {
position:absolute;
left:21em;
max-width:100%;
padding-right:3em;
}
.hotline_buttons {
margin:1.25em 0 1.25em 3.75em;
}
}
@media screen and (min-width: 768px) {
/*article:after{content:"ct/min-width: 768px"}*/
article,
#appInhalt,
.article_editorial {
padding: 1.875em 3.5em;
}
.article_aufmacher_headline .article_head,
.aufmacher2_headline,
.aufmacher3_headline,
.aufmacher4_headline,
.aufmacher5_headline,
.body_artikel_gross .article {
padding:0.5em 3.5em 1em 3.5em;
}
.text_editorial {
padding: 0 3em 1em;
}
.leserbrief {
clear:both;
}
.leserbrief .asset_link {
width: 13em;
margin: 0.5em 0 2em -16em !important;
}
.asset_position img,
.asset_link img,
.small_col_picture img {
max-height: 22em;
}
.kasten {
margin-left:16.9em;
}
.article_kurz_vorgestellt .kasten {
margin-left:0;
}
.aufmacher3_holder,
.aufmacher5_holder {
margin-bottom:2em;
}
.aufmacher3_headline,
.aufmacher5_headline {
position: absolute;
margin-bottom: 0;
padding: 1em 3.5em;
width: 100%;
font-size: 1em;
color:#fff;
background:rgba(0,0,0,0.5);
}
.aufmacher3_headline {
bottom: 10%;
}
.aufmacher5_headline {
top:10%;
}
.text_editorial .kasten {
margin-left: -17em;
}
.article.notiz .box_yellow.inline_pic,
.article.notiz .box_yellow.only_inline_pic {
padding:20px 30px 10px 30px !important;
margin: 0 0 10px 360px !important;
}
/* pro und contra
.body_pro_und_contra*/
.kasten.hasAsset .kasten_default_pic .asset_link,
.kasten.hasAsset .kasten_default_pic .asset_link_tabellen {
float:none;
margin: 0 0 1.5em 0 !important;
width:inherit !important;
max-width:100%;
}
.basisartikel_image_aufmacherbild .asset_link {
margin-left: 0 ! important;
}
/* faq/hotline */
.faq_headline {
height: 18em;
width: 20em;
}
.faq_header_text {
left:25em;
}
.faq_thema.hasAsset p,
.hotline_thema.hasAsset p {
padding-right:2em;
overflow:hidden;
}
.faq_thema.hasAsset p.question,
.hotline_thema.hasAsset p {
padding-right:0;
}
.image_rechts {
clear:right;
float:right;
margin:0 0 1em 1.5em;
}
.spiele_tabelle,
.asset_link_tabellen{
padding-top:0;
}
.articel_kids_bits, .article_kids_bits,
.websites_aktuell {
padding-right:23em;
}
.articel_kids_bits .bilder, .article_kids_bits .bilder,
.websites_aktuell .bilder {
clear:both;
position:relative;
float:right;
margin-right:-20em;
width:15em;
}
.articel_kids_bits .bilder a, .article_kids_bits .bilder a,
.websites_aktuell .bilder a {
width:15em;
}
.box_kids {
margin-right:-18em;
}
/* seitennummern */
.seite {
display:block;
}
.Initial .seite,
.article_hotline .seite,
.body_faq .seite,
.pvmaker .seite,
.body_leserbriefe .seite,
pre .seite,
.preListingBox .seite {
display:none;
}
}
@media screen and (min-width: 801px) {
/*article:after{content:"ct/min-width: 801px"}*/
.aufmacher3_image,
.aufmacher5_image {
float: left;
max-width: 19em;
width: 40%;
}
.aufmacher3_headline,
.aufmacher5_headline {
bottom: 0;
padding: 0;
color:#373737;
background:none;
}
.aufmacher3_headline h1,
.aufmacher5_headline h1 {
font-size:2.4em
}
.aufmacher3_holder .figcaptionQuelle,
.aufmacher5_holder .figcaptionQuelle {
left:0;
}
.text_editorial {
padding: 0 6em 1em;
}
.article_buchkritik .no_margin_top {
max-width: 100% !important;
}
}
@media screen and (min-width: 916px) {
/*article:after{content:"ct/min-width: 900px"}*/
.leserbrief .asset_link {
width: 14em !important;
margin: 0.3em 0 2em -20em !important;
}
.aufmacher3_headline,
.aufmacher5_headline {
margin-left: 28.9em;
font-size: 1em;
}
.aufmacher3_image,
.aufmacher5_image {
max-width: 23.5em;
}
.aufmacher3_headline h1,
.aufmacher5_headline h1 {
font-size:3.5em
}
.kasten {
margin-left:22em;
}
.article.notiz .box_yellow,
.article_kurz_vorgestellt .kasten {
margin-left:22em;
}
.box_kids {
margin-right:-20em;
}
}
@media screen and (min-width: 1040px) {
/*article:before{content:"ct/min-width: 1040px"}*/
.image_editorial,
.text_editorial {
width:64em;
margin:0 auto;
}
.article_aufmacher_headline {
padding: 0 !important;
}
.aufmacher4_headline {
padding:0.5em 0 1em 0;
}
.kasten {
margin-left:30em;
}
.article.notiz .box_yellow,
.article_kurz_vorgestellt .kasten {
margin-left:30em;
}
.articel_kids_bits, .article_kids_bits,
.websites_aktuell {
padding: 1.875em 32em 3.75em 0 !important;
width: 64em;
}
.articel_kids_bits .bilder, .article_kids_bits .bilder,
.websites_aktuell .bilder {
margin-right:-32em;
}
.cover_box {
margin: 0 3.5em 1.5em 0;
}
.box_kids {
margin-right:-32em;
}
}
/*************************
HIRES
**************************/
@media screen and (-webkit-min-device-pixel-ratio: 1.5), screen and (min-device-pixel-ratio: 1.5) {
/*article:after{content:"min-ratio 1.5"}*/
.box_code {
background-image: url(../../images/copy_button@2x.png);
background-size: 42px 42px;
}
}
/*************************
PHABLETS
**************************/
@media screen and (max-width: 640px) {
/* article:after{content:"< 640px, landscape"}*/
h1 {
font-size: 2.0em;
}
h2, h3, h4 {
font-size: 1.15em;
}
h5 {
font-size: 1.0em;
}
p.article_description {
font-size: 0.85em;
}
pre, code, .l, .lf, .span[name="lf"], .box_code, .text_editorial, .text_editorial h4, textarea.pre {
font-size:0.95em;
}
pre {
margin: 1em 0;
}
.trenner_hotline, .trenner_vorgestellt, .trenner_grau, .trenner_spiele, .trenner_vorschau {
margin-bottom: 1em;
margin-top: 1em;
}
.box_impressum .z, .box_impressum p, .impressum_text h3, .impressum_text p {
margin: 1em 0 0 0;
line-height: 1.5em;
}
.ib {
margin-top:1em;
}
.impressum_text {
margin-top: 0;
padding: 0;
}
.hotline_headline {
width:100%;
}
.faq_title {
font-size: 200%;
}
.faq_headline, .faq_headline img {
max-height: 120px;
}
}
@media screen and (max-width: 640px) and (orientation: landscape) {
/* article:after{content:"< 640px, landscape"}*/
article,
#appInhalt {
padding:1em 3em !important;
}
.cover_box {
margin: 0 0 1.5em 0;
text-align:center;
}
.article_big_image, .aufmacher2_image, basisartikel_image_aufmacherbild, .image_editorial img {
float: left;
max-width:300px;
max-height:280px;
margin:0 1em 0.5em 0;
overflow: hidden;
}
.asset_position img, .asset_link img, .small_col_picture img {
max-height: 20em;
}
}
@media screen and (max-width: 600px) and (orientation: portrait) {
/*article:after{content:"< 600px"}*/
.article_big_image, .aufmacher2_image, basisartikel_image_aufmacherbild {
max-width:600px;
max-height:300px;
overflow: hidden;
}
.asset_position img, .asset_link img, .small_col_picture img {
max-height: 25.5em;
}
.spiele_tabelle, .asset_link_tabellen {
padding-top: 0;
}
.webcode p {
padding: 0em 0;
}
.vorschau_box_header h1 {
margin-bottom: 1em;
font-size: 1.5em;
line-height: 0;
}
.box_impressum {
padding: 1.5em;
}
.kasten {
margin: 0 0 0 1em;
}
.unterschrift {
padding: 1em;
}
.trenner_hotline, .trenner_vorgestellt, .trenner_grau, .trenner_spiele, .trenner_vorschau {
margin-bottom: 1em;
margin-top: 1em;
}
.article_hotline {
padding-top: 2em;
}
.hotline_headline {
background-position: center center;
}
.hotline_buttons {
float:none;
margin:1.25em;
text-align: center;
}
.hotline_buttons a {
display:inline-block;
float: none;
margin: 0.5em 0;
}
.faq_title {
font-size: 200%;
}
.faq_headline, .faq_headline img {
max-height: 120px;
}
}
/************
FONT RESIZE
*************/
@media screen and (min-width: 768px) {
.fontSize20 article,
.fontSize20 .article_aufmacher_headline,
.fontSize20 #appInhalt,
.fontSize24 article,
.fontSize24 .article_aufmacher_headline,
.fontSize24 #appInhalt {
max-width: 49.6em;
padding: 1.875em 3.5em !important;
}
/*.fontSize20 .aufmacher1,
.fontSize24 .aufmacher1 {
max-width:64em;
}*/
.fontSize20 .aufmacher3_headline,
.fontSize20 .aufmacher5_headline,
.fontSize24 .aufmacher3_headline,
.fontSize24 .aufmacher5_headline {
position: absolute;
max-width:100%;
margin-left:0;
padding: 0.5em 3.5em 1em !important;
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
color: #fff !important;
}
.fontSize20 .aufmacher3_image,
.fontSize20 .aufmacher5_image,
.fontSize24 .aufmacher3_image,
.fontSize24 .aufmacher5_image {
float: none !important;
max-width: 100% !important;
width: auto;
}
.fontSize20 div.content_text.hasAsset,
.fontSize20 div.content_text_vorgestellt,
.fontSize20.body_artikel_gross div.content_text,
.fontSize24 div.content_text.hasAsset,
.fontSize24 div.content_text_vorgestellt,
.fontSize24.body_artikel_gross div.content_text {
padding-left:0 !important;
}
.fontSize20 .asset_link,
.fontSize20 .asset_position,
.fontSize20 .asset_link_tabellen,
.fontSize20 .possible_gallery,
.fontSize20 a[data-pattern="bottom_table"],
.fontSize20 .box_right,
.fontSize24 .asset_link,
.fontSize24 .asset_position,
.fontSize24 .asset_link_tabellen,
.fontSize24 .possible_gallery,
.fontSize24 a[data-pattern="bottom_table"],
.fontSize24 .box_right {
float:none !important;
margin-left: 0 !important;
width: 100% !important;
}
.fontSize20 .kasten,
.fontSize24 .kasten{
margin-left: 0 !important;
}
.fontSize20 #appToc .teaserimg,
.fontSize24 #appToc .teaserimg {
width: 15em;
}
.fontSize20.body_jetzt_im_netz .kasten.hasAsset .kasten_img {
float:none;
max-width: 12em;
}
.fontSize24.body_jetzt_im_netz .kasten.hasAsset .kasten_img {
float:none;
max-width: 100%;
text-align:center;
}
.fontSize20.body_pro_und_contra .kasten h5,
.fontSize24.body_pro_und_contra .kasten h5{
margin-left: 0;
}
.fontSize20.body_pro_und_contra .kasten_img,
.fontSize24.body_pro_und_contra .kasten_img {
float:none;
min-height:11em;
width:100%;
margin: 0 !important;
padding:0 !important;
}
.fontSize20.body_pro_und_contra .kasten img,
.fontSize24.body_pro_und_contra .kasten img{
float:left;
}
.fontSize20.body_pro_und_contra .kasten .figcaption,
.fontSize24.body_pro_und_contra .kasten .figcaption{
bottom:0 !important;
margin-left: 11em;
}
.fontSize20.body_pro_und_contra .pucAmp {
top:0.5em;
font-size:28em;
line-heigth:0 !important;
}
.fontSize24.body_pro_und_contra .pucAmp {
top:0.35em;
font-size:25em;
line-heigth:0 !important;
}
.fontSize24 .leserbrief {
padding-left:0;
}
.fontSize20 .faq_headline {
height:16em;
width:20em;
}
.fontSize20 .faq_title {
font-size: 330%;
}
}
@media screen and (min-width: 916px) {
/*.fontSize20 article,
.fontSize20 .article_aufmacher_headline,
.fontSize20 #appInhalt {
max-width: 49.6em;
padding: 1.875em 3.5em !important;
}*/
.fontSize20 article,
.fontSize20 .article_aufmacher_headline,
.fontSize20 #appInhalt {
max-width: 52.5em;
}
.fontSize24 article,
.fontSize24 .article_aufmacher_headline,
.fontSize24 #appInhalt {
max-width: 44.5em;
}
.fontSize20 .aufmacher3_headline,
.fontSize20 .aufmacher5_headline {
position: relative;
max-width:50%;
margin-left:23em;
padding: 0.5em 3.5em 1em 0 !important;
background: none;
color: #8c8c8c !important;
}
.fontSize20 .aufmacher3_headline h1,
.fontSize20 .aufmacher5_headline h1 {
font-size: 2.4em;
}
.fontSize20 .article_head h2,
.fontSize20 .kasten h5 {
font-size: 1.9em;
}
.fontSize20 p.article_description {
font-size: 1.1em;
}
.fontSize20 .aufmacher3_image,
.fontSize20 .aufmacher5_image {
float: left !important;
max-width: 22.8em !important;
width: 43%;
}
.fontSize20 div.content_text.hasAsset,
.fontSize20 div.content_text_vorgestellt,
.fontSize20.body_artikel_gross div.content_text {
padding-left:18em !important;
}
.fontSize20 .asset_link,
.fontSize20 .asset_position,
.fontSize20 .asset_link_tabellen,
.fontSize20 .possible_gallery,
.fontSize20 a[data-pattern="bottom_table"],
.fontSize20 .box_right {
float:left !important;
margin-left: -18em !important;
width: 16em !important;
}
.fontSize20 .asset_position .asset_link,
.fontSize20 .asset_position .asset_link_tabellen {
margin-left: 0 !important;
}
.fontSize20 .kasten {
margin-left: 18em !important;
}
.fontSize20.body_jetzt_im_netz .kasten {
margin-left: 0 !important;
}
.fontSize20.body_pro_und_contra .kasten h5 {
margin-left: -9.5em;
}
.fontSize20.body_pro_und_contra .kasten_img {
float:left;
width:18em;
margin: 0 0 0 -18em !important;
padding:0 !important;
}
.fontSize20.body_pro_und_contra .kasten .figcaption {
clear:both;
bottom:0 !important;
margin-left: 0;
}
.fontSize20.body_pro_und_contra .pucAmp {
top:0.5em;
font-size:28em;
line-heigth:0 !important;
}
}