/* Document : ...::: www.Michael-Kahl.eu.com :::... Created on : 2013.04.29 Author : Rene Kalk Description: That is the Main-Stylesheet of Michael-Kahl.eu.com */ .CLR {clear:both;} 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{ margin:0; padding:0; border:0; font-size:100%; font:inherit; vertical-align:baseline; font-family: Tahoma, "Copperplate Gothic Light", "Times New Roman", Arial; font-size:100%; font-size:1em; line-height:100%; } article,aside,details,figcaption, figure,footer,header,hgroup,menu,nav,section{display:block;} body{line-height:1} blockquote,q{quotes:none;} blockquote:before, blockquote:after, q:before, q:after{ content:''; content:none; } table{ border-collapse:collapse; border-spacing:0; } /* ------------------------- Generic */ .CLR {clear:both;} .floatleft{float:left;} .floatright {float:right;} body { color:#000000; background-color:#999999; width:80%; margin-left:auto; margin-right:auto; margin-top:5px; margin-bottom:10px; } img { /* Needed for mobile */ display:block; margin-left:auto; margin-right:auto; } /* ------------------------- Typography */ strong {font-weight:bold;} p {text-align:left;} h1 {color:#204899;font-size:1em;font-weight:bold;font-family:"Times New Roman",Arial;} h2 {font-size:1.2em;font-weight:bold;color:#ffa500;font-family:"Times New Roman",Arial;} h3 {color:#204899;font-weight:bold;text-transform:uppercase;font-family:"Times New Roman",Arial;} h4 {color:#204899;letter-spacing:2px;font-family:"Times New Roman",Arial;} h5 {color:#ffa500;font-family:"Times New Roman",Arial;} h6 {color:#ffa500;font-style:italic;font-weight:normal;font-family:"Times New Roman",Arial;} address {} pre, code {font-family: monospace;background:#e6e6e6;} /* Links */ a, a:visited, a:active {color:#204899;} a:hover {color:#FFA200;text-decoration:undeline;} /* Images */ img { -moz-box-shadow:5px 5px 5px #888888; -webkit-box-shadow:5px 5px 5px #888888; box-shadow:5px 5px 5px #888888; border:1px solid #e3e3e3; margin:5px; } hr { border-color:#ffa500; -moz-box-shadow:5px 3px 3px #a1a1a1; -webkit-box-shadow:5px 3px 3px #a1a1a1; box-shadow:5px 3px 3px #a1a1a1; } /* ------------------------- Edges */ /* Get Icons as Sprite */ .sprite { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAgCAYAAABgrToAAAAAzUlEQVRYhc3WQQrEIAwF0Nx/Kdl4xaFHCNpVoZSppuabRMiufJ40RkmadE0dv6Nz4V5rHRZ6kRaoRYYCNchw4AyZAjhCpgG+IVMB/yGtec9sM/CJROK4MAZ4D0RvGAa8gtEtQ+imRuJSAd/GVgrgaPCHA2dXZyhQ8/gIA2qfbzT7gAt/Gh/oNQR+xbkCV3BuwFWcC9CC2w604rYCEbhrfFgz7kVInDSBZkmTTuhA9IYJ/UvQLQO/6tCHbisQgdwOtCJdgBakG3AV6QpcQZ4hWPpvf99voAAAAABJRU5ErkJggg==) no-repeat; display: block; } .sprite-top_right { width: 20px; height: 16px; background-position: -0px -0px; } .sprite-top_left { width: 20px; height: 16px; background-position: -0px -16px; } .sprite-bottom_right { width: 20px; height: 16px; background-position: -20px -0px; } .sprite-bottom_left { width: 20px; height: 16px; background-position: -20px -16px; } .edge { clear:both; height:16px; width:100%; } .topedge {} .bottomedge {} .topleftedge { width: 20px; height: 16px; background-position: -0px -16px; float:left; } .bottomleftedge { width: 20px; height: 16px; background-position: -20px -16px; float:left; } .toprightedge { width: 20px; height: 16px; background-position: -0px -0px; float:right; } .bottomrightedge { width: 20px; height: 16px; background-position: -20px -0px; float:right; } #middleline .topedge {margin-bottom:-10px;} #middleline .bottomedge {margin-top:-5px;} /* ------------------------- Layout */ #header { background-color:#ffffff; margin-bottom:10px; clear:both; } #header_content_wrap { width:100%; padding-left:50px; padding-right:50px; } #logo { float:left; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; border:0; margin:0; margin-top:-5px; } #middleline { width:100%; background-color:#ffffff; margin-bottom:10px; clear:both; } #headline { clear:both; text-align:center; } #content { background:#ffffff; margin-bottom:10px; clear:both; line-height:100%; } .pane { width:80%; text-align:left; float:left; padding:10px; padding-left:100px; padding-right:100px; margin-left:auto; margin-right:auto; background-color:#ffffff; } .pane li { line-height:150%; } #footer { background-color:#ffffff; } #impressum {float:right;} /* ------------------------- Navigation */ #navigation ul, #navigation li {margin:0;padding:0;} #navigation, #navigation ul {float:left;} #navigation .tabs li { float:left; padding-left:20px; padding-top:20px; max-width:200px; text-align:center; vertical-align:bottom; list-style-type:none; } #navigation .tabs #logolink {padding-top:0;} #navigation .tabs #startlink {padding-top:35px;} #navigation .tabs a, #bottom_navigation li a { vertical-align:bottom; text-align:center; color:#204899; text-transform:uppercase; text-decoration:none; font-weight:bold; font-size:0.9em; font-family:"Copperplate Gothic Light"; } #navigation .tabs a:hover { color:#ffa500; } #toplink1 {margin-top:-3em;} #toplink2, #toplink3, #toplink4, #toplink5 {margin-bottom:-2em;} #bottom_navigation { width:auto; text-align:center; margin-left:auto; margin-right:auto; } #bottom_navigation li { display:inline; list-style-type:none; } /* --------------------------------------------*/ /* Content ------------------------------------*/ /* First Page */ /* Ticker Styling */ .ticker-wrapper.has-js { margin-left:auto; margin-right:auto; display: block; width:350px; } .ticker { width: 90%; height:1.2em; margin-left:auto; margin-right:auto; display: block; position: relative; overflow: hidden; } .ticker-title { color: #990000; font-weight: bold; text-transform: uppercase; } .ticker-content { margin-left: auto; margin-right:auto; color: #204899; font-weight: bold; overflow: hidden; white-space: nowrap; line-height: 1.2em; font-family:"Copperplate Gothic Light"; } .ticker-content:focus { none; } .ticker-content a { text-decoration: none; color: #1F527B; } .ticker-content a:hover { text-decoration: underline; color: #0D3059; } .ticker-swipe { padding-top: 9px; position: absolute; top: 0px; background-color: #fff; display: block; width: 800px; height: 23px; } .ticker-swipe span { margin-left: 1px; background-color: #fff; border-bottom: 1px solid #1F527B; height: 12px; width: 7px; display: block; } .ticker-controls { padding: 8px 0px 0px 0px; list-style-type: none; float: left; display:none; } .ticker-controls li { padding: 0px; margin-left: 5px; float: left; cursor: pointer; height: 16px; width: 16px; display: block; } .ticker-controls li.jnt-play-pause { background-image: url('../images/controls.png'); background-position: 32px 16px; } .ticker-controls li.jnt-play-pause.over { background-position: 32px 32px; } .ticker-controls li.jnt-play-pause.down { background-position: 32px 0px; } .ticker-controls li.jnt-play-pause.paused { background-image: url('../images/controls.png'); background-position: 48px 16px; } .ticker-controls li.jnt-play-pause.paused.over { background-position: 48px 32px; } .ticker-controls li.jnt-play-pause.paused.down { background-position: 48px 0px; } .ticker-controls li.jnt-prev { background-image: url('../images/controls.png'); background-position: 0px 16px; } .ticker-controls li.jnt-prev.over { background-position: 0px 32px; } .ticker-controls li.jnt-prev.down { background-position: 0px 0px; } .ticker-controls li.jnt-next { background-image: url('../images/controls.png'); background-position: 16px 16px; } .ticker-controls li.jnt-next.over { background-position: 16px 32px; } .ticker-controls li.jnt-next.down { background-position: 16px 0px; } .js-hidden { display: none; } .no-js-news { padding: 10px 0px 0px 45px; color: #F8F0DB; } .left .ticker-swipe { /*left: 80px;*/ } .left .ticker-controls, .left .ticker-content, .left .ticker-title, .left .ticker { float: left; } .left .ticker-controls { padding-left: 6px; } .right .ticker-swipe { /*right: 80px;*/ } .right .ticker-controls, .right .ticker-content, .right .ticker-title, .right .ticker { float: right; } .right .ticker-controls { padding-right: 6px; } #index a img {float:left;} #index a p { padding-top:150px; float:right; font-family:"Times New Roman",Arial; color:#808080; text-transform:uppercase; font-weight:bold; } #index a p span {font-size:0.8em;} /*TABCONTENT2*/ #topcontent2 ul li { list-style-type:none; padding-bottom:30px; } #Haus_Bleistift {margin-left:120px;} /* ------------------------- Forms */ #kontaktform form { padding:3px; margin:5px; background:#e3e3e3; border:1px dotted #ffa500; font-size:0.7em; font-style:italic; float:left; } #kontaktform li { line-height:20px; clear:both; list-style-type:none; } #kontaktform label { width:100px; float:left; } #kontaktform input { width:150px; float:right; } #kontaktform textarea { width:97%; clear:both; } .label { width:150px; } input, textarea { border:1px solid #204899; padding:3px; } input:hover, input:active, input:focus, textarea:hover, textarea:active, textarea:focus {border:1px solid #ffa500;} select { padding:3px; background:#e3e3e3; border:1px solid #888888; } label {} input.button { background:#e3e3e3; color:#204899; } input.button:hover, input.button:active, input.button:focus {color:#ffa500;} .kontaktdaten {width:100px;float:left;} #email:after {content:"info@michael-kahl.eu.com";} .bottom_close{ margin: 15px auto 5px auto; text-align: center; color: #ff0000; font-size: 120%; } /* ------------------------- Popups */ /* Colorbox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay {background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVQImWNgYGCYCgAAmgCW6Y/gJgAAAABJRU5ErkJggg==);background-repeat:repeat;width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;border:1px solid #000;} #cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;} .cboxIframe{width:100%; height:100%; display:block; border:0;} #colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;} #colorbox{outline:0;} #cboxContent{margin-top:32px; overflow:visible; background:#fff;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{background:#fff; padding:1px;} #cboxLoadingGraphic{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAqCAYAAADFw8lbAAACfklEQVRYhe2WzWrqQBiGEwaZMEgwiCSEEEZCyMaFriylm67ahQgigsvsFBehpRR3ongVXkIghIYuSpe9hBJ6Pe9ZHAxJ29MafyIc8sK7mZ/kmZnvm/kEoVSpUicVzuwStAQtQev1OmazGVzXRbVaPS9oo9HAzc0N2u12pl0URSyXS7y/vyOOY3iedz5QSikWiwWiKEIQBBgMBkkfYwxBECCOY3x8fGC5XH5ZSGGg9Xodm80GYRgiiiKEYYjhcJiA+r6fgI7H48y8ZrMJXddBCDk9KCEEnufB932EYYjn52dEUYTLy0sIggDXdfH29obX11c4jgNBEFCr1eA4TmJZlouJUVVVsV6v4fs+np6e8PLykolHzjlM08yMT4MyxorLetM0sVqt4Ps+giBAr9f759harQbbtuE4DjRNKy7rt1YUBbe3t7i+vv417iRJynNdHQ5KKQVjDJIk5cnijHeYtz8oIQRXV1eYTqfwPA+e52E0Gu0SbxlAXddhWRY45z/N3R/Usizc3d3h/v4eDw8PeHx8xHw+R6fT2RlUUZRMUqUT7mignHNMJhNMp9PEk8kErVZrZ9DP19RJQEVRRLfbxXA4xGAwQL/fx8XFBSqVSq6j1zQNnHMYhnGao9+aUgpKaS7APXw4aNqEEMiyDEmSfh3LGMuTeMcDFUURpmnCcRzYtv3js6goSnLh67peLOjnZ1FV1aSvUqlkQkPTtPM9oZzz5Me2bSevznb3LMtKQuJsRYkg/C2et5CKony7gPQxb8s8wzCKKfPSZoyBUpppazabCahhGF/iesdvHxf0O6fjMb3TOX16UEIIVFU9BLIY0CO5BC1B/xvQUqVK5dQfWG2EXUStnDMAAAAASUVORK5CYII=) no-repeat center center;} #cboxLoadingOverlay{background:#000;} #cboxTitle{position:absolute; top:-22px; left:0; color:#fff;} #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;} #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAH0AAAAyCAYAAABxjtScAAAC9UlEQVR4nO2bPW7CQBCFX5mSMuWWKSlTTklJmXLLlCnp8BE4AkfIEXyEHIUbkMI7yrJeiGPPLIp4nzRCGqQ33n3ePxsAQgghhBDyELw6az856nsTADw76q8AxBSScq9ZbmVd8AnAO4C9tXDGPtWwNF6ve4exIc8pb1VTMLRhbaBVIyT9PQaTkT41FyyLaeeouBeqXzNoLnJFt2yTGNfaGOiVBDQyfY3LztGCGm8LtLeF1r4IixFTmrvDuE1WN5ng8vrfYDtrBTQwXTA2ohZzmaJtMWJK4/PwmlU03mG31gY4m77BNFO8Tfc23nLjJRV9vbEsjA+ZZky5mOXC0gKC6abM5VFMtxrtIdOMKRezXDCogTXub7rHut5yeo+wW9cDGpgO1Dtsg6GBGnPJNcrlxMqM2kZOKjmPjdzWQDMnoJHpwDA16Rl9ycj+DY/Nj6BurveRzeOsHtDQdGCYorbwN936mKPm3no4YznSd3Do/ERAY9MVz8ewXk+yVrg+c9z67q8EQ60aK/wshy8p95LlPGsTQgghhBBCCCGEEEIIIYSQJXw4a//nN0UCvzeFwPAWr0/RpdxHlgvWBVcAvgCcrYUzzqmGpfF63SeMDVmnvFXNDkMbooFWDUn6ZwwmI31qTiyLaeeouBeqXzNoLt0V3bJNnXGtg4FeiaCR6RGXnaMFNT4XaB8LrXMRcYG2Upp7wrhNVjdZh8vr/4TtrCVoYHqHsRG1mMsUbYsRUxqfh9esovEFu7VW4Gz6AdNM8Tbd23jLjVdX0dcbKxjoS6bZp1yf5WRpgQ7TTZnLo5huNdol0+xTrs9yYlADEfc3PS7QV+45vfew/Tm3u+lAvcMOGBqoMZdco1xOrMyobeS6Ss5jI3c00MwRNDIdGKYmPaMvGdm/4bH56VA31/vIFg30SgQNTQeGKeoIf9Otjzlq7q2HM5Yj/QSHzk8IGpuueD6GjU66Addnjlvf/RUx1KoR8LMc6v/ktlnOszYhhBBCCCGEEEKc+Abs0cVAnDitAwAAAABJRU5ErkJggg==) no-repeat 0 0;} #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;} #cboxPrevious{background-position:0px 0px; right:44px;top:-25px;} #cboxPrevious:hover{background-position:0px -25px;} #cboxNext{background-position:-25px 0px; right:22px;top:-25px;} #cboxNext:hover{background-position:-25px -25px;} #cboxClose{background-position:-50px 0px; right:0;top:-25px;} #cboxClose:hover{background-position:-50px -25px;} .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;} .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;} .cboxSlideshow_on #cboxSlideshow:hover{background-position:-100px -25px;} .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;} .cboxSlideshow_off #cboxSlideshow:hover{background-position:-75px -25px;}