/*
Style.css für netselection.de
*/

/* Eric Meyer's Reset CSS v2.0 - http://cssreset.com */
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,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

/* Scrollbar im Firefox erzwingen*/
html { height:101%; }

body { font-family:Verdana, Arial, sans-serif; font-size:100%; color:#303030; /*background:url(bilder/background.jpg) repeat;*/ background:#555F55; }
body a, body a:visited { color:#AC0000; font-weight:bold; text-decoration:none; }
body a:hover { color:#AC0000; font-weight:bold; text-decoration:underline; }
img { height:auto; max-width:100%; }
img.bor { border:1px solid #ADDCB2; padding:2px; height:auto; max-width:98%; }
.clear { clear:both; }

.netselection-oben-resp { width: 200px; height: 200px; }
@media(min-width: 301px) { .netselection-oben-resp { width: 250px; height: 250px; } }
@media(min-width: 401px) { .netselection-oben-resp { width: 300px; height: 250px; } }
@media(min-width: 501px) { .netselection-oben-resp { width: 336px; height: 280px; } }
.netselection-unten-resp { width: 200px; height: 200px; }
@media(min-width: 301px) { .netselection-unten-resp { width: 250px; height: 250px; } }
@media(min-width: 401px) { .netselection-unten-resp { width: 300px; height: 250px; } }
@media(min-width: 501px) { .netselection-unten-resp { width: 336px; height: 280px; } }

        
#page { width:980px; margin:0 auto; display:table; }
@media only screen and (max-width:1015px) { #page { width:96%; } }

/** Header **/
header { width:100%; }
#header { width:100%; background:#ADDCB2; margin-top:12px; position:relative; }
.header-bild { position:absolute; top:9px; left:3.5%; width:25.5102041%; }
.header-text { text-align:center; font-size:125%; font-weight:bold; padding:1.5%; margin-left:15%; color:#AC0000; }
.navi { display:none; }
@media only screen and (max-width:810px) { .header-text { font-size:112.5%; padding:1.75%; } }
@media only screen and (max-width:740px) { .htw { font-size:87.5%;} }
@media only screen and (max-width:700px) { .header-bild { display:none; } }
@media only screen and (max-width:700px) { .header-text { margin-left:0; padding:2.5%; } }
@media only screen and (max-width:700px) { #header { margin-top:32px; } }
@media only screen and (max-width:700px) { .navi { display:block; width:100%; margin:0 auto; text-align:center; background:#D5EED7; position:fixed; top:0; left:0; } .navi a { display:block; padding:8px; } .navi a:hover, .navi a:focus, .navi a:visited { background:#ADDCB2; text-decoration:none; } }

@media only screen and (max-width:580px) { .htw { display:none; } }
@media only screen and (max-width:580px) { .header-text { font-size:137.5%; } }
@media only screen and (max-width:400px) { .header-text { padding:3% 1%; } }


#wrapper { width:100%; margin:0 auto; background:#FFF; }
  
/** Content **/
#content { width:64%; float:right; padding:2%; }
@media only screen and (max-width:700px) { #content { float:none; width:96%; margin:0 auto; padding:2%; } }

#content h1 { font-size:125%; font-weight:bold; line-height:1.4; text-align:left; margin-bottom:0.7em; color:#AC0000; }
@media only screen and (max-width:700px) { #content h1 { margin:0.2em 0 0.2em; } }

.content-text { line-height: 1.6; text-align: justify; }
.content-text p { margin-bottom:1em; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; left: 200px; }
.content-text h2, .content-text h3 { font-size:112.5%; font-weight:bold; line-height:1.4; text-align:left; margin:1.2em 0 0.2em 0; }
.content-text p strong { font-weight:bold; }
.content-text p em { font-style:italic; }
.content-text ul, .content-text ol { list-style:disc; margin:0.2em 0 1.2em 20px; }
.content-text ul li, .content-text ol li { text-align:left; padding-bottom:3px; }
.content-text ol.non { list-style:none; margin:0.2em 0 1.2em 0; }
.content-text ol.non li { padding-bottom:0.75em; }
.content-text ol.non strong { font-weight:bold; }
.content-text ul em, .content-text ol em {  font-style:italic; }
.content-text a { padding:4px; }
.content-text a:hover, .content-text a:focus { background:#D5EED7; text-decoration:none; }
@media only screen and (max-width:700px) { .content-text a { background:#D5EED7; } .content-text a:hover, .content-text a:focus { background:#ADDCB2; } }

.via { font-size:75%; font-style:italic; text-align:right; }
.surftipp { font-style:italic; font-size:81.25%; }
.surftipp:before { content:"Surftipp: "; font-weight:bold; }

.tipp { width:80%; margin:0 auto; background:#D5EED7; padding:2%; margin-bottom:2em; }
.tipp ul { list-style-type:none; margin:0; }
.tipp ul li a:before { content:"\00BB"; padding-right:5px; font-weight:bold; color:#303030; }
.tipp ul li a { display:block; padding:5px 0; }
.tipp ul li a:hover, .tipp ul li a:focus, .tipp ul li:hover { background: #ADDCB2; text-decoration:none; }
.weiter { font-weight:bold; }
@media only screen and (max-width:600px) { .tipp ul li { text-align:center; line-height:1.2; } .tipp ul li a { padding:7px 0; } .tipp ul li a:before { content: ""; padding:0; } }
@media only screen and (max-width:600px) { .weiter { text-align:center; } }

code { background-color:#F3F3F3; font-family:monospace; text-align:left; }
pre { border:1px solid #CCCCCC; background:#F3F3F3; color:#67675F; padding:5px; margin:12px 12px 20px 12px; white-space:pre-wrap; text-align:left; }
* html pre { white-space:normal; text-align:left; }
* + html pre { white-space:normal; text-align:left; }

.oben { font-weight:normal; font-size:68.75%; float:right; background:#D5EED7; border:1px solid #ADDCB2; }
.oben a { font-weight:normal; padding:3px; display:block; }
.oben a:hover { font-weight:normal; background:#ADDCB2; }

table { width:100%; border-collapse:collapse; border:1px solid #D5EED7; margin: 1em 0 1.5em 0; text-align: left; font-size: 87.5%; }
table td  { border-collapse:collapse; border:1px solid #D5EED7; padding:2px 4px; }
table tr.ungerade { background: #E2F3E3; }

/** Sidebar **/
#sidebar { width:30%; font-size:85.7%; background:#D5EED7; padding:21.6% 1% 10px 1%; }
@media only screen and (max-width:750px) { #sidebar { padding-top:21%; } }
@media only screen and (max-width:700px) { #sidebar { width:96%; margin:0 auto; padding:2%; padding-top:30px; } }

.sidebar-nav { margin-bottom:1em; }
.sidebar-nav ul { list-style-type:none; }
.sidebar-nav li { border-bottom:1px solid #ADDCB2; line-height:1.3; }
.sidebar-nav li:last-child { border:none; }
.sidebar-nav li a { display:block; padding:6px 5px;  }
.sidebar-nav li:nth-child(2n+1) a { color:#3C6B3B; }
.sidebar-nav li a:hover, .sidebar-nav ul li a:focus { background:#ADDCB2; text-decoration:none; }
.sb-ueb { font-style:italic; margin-bottom:3px; font-size:95%; padding-left:5px; }
@media only screen and (max-width:700px) { .sidebar-nav li { font-size: 114.3%; } .sidebar-nav li a { text-align:center; padding: 1.5% 0.5%; } .sidebar-nav { margin-bottom: 1.75em; } }
@media only screen and (max-width:700px) { .sb-ueb { font-size:110%; text-align:center; padding:0; } }
@media only screen and (max-width:480px) { .sidebar-nav li a { padding:3% 0.5%; } }


/** Footer **/
footer { width:100%; }
#footer { width:100%; background:#ADDCB2; margin-bottom:1em; }

.footer-text { font-size:75%; color:#3C6B3B; text-align:center; padding:1.5% 1% 1% 1%; line-height: 1.5; }
.footer-text a { color:#3C6B3B; text-decoration:none; font-weight:normal; }
.footer-text a:hover { color:#3C6B3B; text-decoration:underline; font-weight:normal; } 
@media only screen and (max-width:400px) { .footer-text { /*font-size: 68.75%;*/ padding:2.5%; line-height:3; } .footer-text a { padding:5px 2px; } }