@media all {
.hlist {
width : 56%;
overflow : hidden;
float : left;
display : inline;
position : relative;
background : center right repeat-x #f0f0f0;
line-height : 1.2em;
}
.hlist ul {
display : inline;
float : left;
margin : 0;
margin-left : 20px;
padding : 0;
border-left : 1px solid #aaa;
border-right : 1px solid #fff;
}
.hlist ul li {
border-left : 1px solid #fff;
border-right : 1px solid #aaa;
display : inline;
float : left;
font-size : 0.875em;
line-height : 0;
list-style-type : none;
margin : 0;
padding : 0;
}
.hlist ul li a, .hlist ul li strong {
background : transparent;
transition : background-color 0.6s ease-in;
display : block;
font-size : 0.92em;
font-weight : normal;
margin : 0;
padding : 0.8em 1em 0.8em 1em;
text-decoration : none;
width : auto;
}
.hlist ul li a:focus, .hlist ul li a:hover, .hlist ul li a:active {
background-color : #96C11F;
color : #fff;
transition : background-color 0.6s;
}
.hlist ul li.active {
border-left : 1px solid #444;
border-right : 1px solid #888;
}
.hlist ul li.active strong, .hlist ul li.active a:focus, .hlist ul li.active a:hover, .hlist ul li.active a:active {
background : transparent;
color : #fff;
text-decoration : none;
}
}


/**
@font-face {
{
font-family : "'fontello'";
src : url("fonts/fontello.eot");
src : url("fonts/fontello.eot?#iefix") format('embedded-opentype'), url("fonts/fontello.woff") format('woff'), url("fonts/fontello.ttf") format('truetype'), url("fonts/fontello.svg#fontello") format('svg');
font-weight : normal;
font-style : normal;
}
}
[class^="icon-fontello"]:before, [class*=" icon-fontello"]:before {
font-family : 'fontello';
font-style : normal;
font-weight : bold;
speak : none;
display : inline-block;
text-decoration : inherit;
width : 1em;
margin-right : 0.2em;
text-align : center;
line-height : 1em;
}
.icon-fontello-down:before {
content : '\2193';
}
.icon-fontello-resize-full:before {
content : '\e744';
}
.icon-fontello-github:before {
content : '\f308';
}
.icon-fontello-thumbs-up:before {
content : '\2a';
}
@font-face {
{
font-family : "'icomoon'";
src : url('fonts/icomoon.eot');
src : url('fonts/icomoon.eot?#iefix') format('embedded-opentype'), url('fonts/icomoon.svg#icomoon') format('svg'), url('fonts/icomoon.woff') format('woff'), url('fonts/icomoon.ttf') format('truetype');
font-weight : normal;
font-style : normal;
}
}
[class^="icon-icomoon"]:before, [class*=" icon-icomoon"]:before {
font-family : 'icomoon';
font-style : normal;
speak : none;
font-weight : normal;
}
.icon-icomoon-tablet:before {
content : "\e000";
}
.icon-icomoon-desktop:before {
content : "\e002";
}
.icon-icomoon-phone:before {
content : "\e001";
}
.icon-icomoon-bx-star:before {
content : "\e004";
}
.icon-icomoon-github:before {
content : "\e005";
}
.icon-icomoon-beer:before {
content : "\e003";
}
.icon-icomoon-double-arrow:before {
content : "\e006";
}
@font-face {
{
font-family : "'KievitWeb'";
src : url('fonts/KievitWeb.eot');
src : url('fonts/KievitWeb.eot?#iefix') format('embedded-opentype'), url('fonts/KievitWeb.woff') format('woff'), url('fonts/kievitcomp-bold-webfont.svg#KievitComp-BoldRegular') format('svg');
font-weight : normal;
}
}
@font-face {
{
font-family : "'KievitWeb'";
src : url('fonts/KievitWeb-Bold.eot');
src : url('fonts/KievitWeb-Bold.eot?#iefix') format('embedded-opentype'), url('fonts/KievitWeb-Bold.woff') format('woff'), url('fonts/kievitcomp-bold-webfont.svg#KievitComp-BoldRegular') format('svg');
font-weight : bold;
}
}

**/
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;
}
article, aside, body, details, figcaption, figure, footer, header, hgroup,
menu, nav, section {
display : block;
}

ol, ul {
list-style : none;
}
blockquote, q {
quotes : none;
}
blockquote:before, blockquote:after, q:before, q:after {
content : '';
content : none;
}
table {
border-collapse : collapse;
border-spacing : 0;
}
.clearfix:after {
content : "";
display : table;
clear : both;
}
a {
color : #5280dd;
text-decoration : none;
}
a:hover {
text-decoration : none;
}
em {
font-style : italic;
}
strong {
font-weight : bold;
}
h1, h2, h3, h4, h5, h6 {
font-family : "KievitWeb", "Arial";
font-weight : bold;
}
h1 {
font-size : 2.5em;
margin-bottom : 25px;
}
h2 {
font-size : 1.75em;
margin-bottom : 18px;
}
h2:after {
content : "";
width : 0;
height : 0;
border-width : 10px;
border-style : solid;
border-color : #048753 #048753 transparent;
}
h3 {
font-size : 1.375em;
margin-bottom : 14px;
}
h4 {
font-size : 1.12em;
margin-bottom : 11px;
}
h5 {
font-size : 0.92em;
margin-bottom : 9px;
}
h6 {
font-size : 0.875em;
margin-bottom : 9px;
}
p {
font-size : 0.82em;
line-height : 1.53em;
color : #555;
margin-bottom : 8px;
}
p.intro {
font-size : 1.125em;
margin-bottom : 35px;
}
pre {
margin : 15px 0;
overflow : auto;
}
.inner {
width : 900px;
position : relative;
margin : 0 auto;
}
.innerb20 {
width : 740px;
position : relative;
margin : 0 auto;
margin-bottom : 20px;
}
#main {
padding : 40px;
}
#primary {
margin-top : 0;
margin-bottom : 0;
margin-left : 500px;
margin-right : 0;
position : relative;
}
#primary2 {
margin-top : 0;
margin-bottom : 0;
margin-left : 500px;
margin-right : 0;
position : relative;
}
aside {
width : 520px;
float : left;
}
.home h1 {
text-align : center;
line-height : 1.25em;
font-size : 3.75em;
}
.home .bx-wrapper {
margin : 30px auto 40px;
}
.home #primary ul {
margin : 0 0 40px 16px;
}
.home #primary li {
list-style : disc;
margin-bottom : 5px;
color : #555;
font-size : 1em;
}
.pictogram {
padding : 20px 0;
text-align : center;
}
.pictogram div {
display : inline-block;
position : relative;
}
.pictogram .icon-icomoon-desktop {
font-size : 8em;
}
.pictogram .icon-icomoon-tablet {
font-size : 6em;
top : -15px;
}
.pictogram .icon-icomoon-phone {
font-size : 4em;
top : -30px;
}
.pictogram .icon-fontello-thumbs-up {
font-size : 7em;
top : -30px;
}
.pictogram .operator {
color : #c5c5c5;
margin : 0 20px;
top : -45px;
font-size : 3.5em;
font-weight : bold;
}
.step {
margin-bottom : 45px;
}
.home p.pop {
color : #de3329;
text-align : center;
font-size : 1.5em;
font-weight : bold;
margin : 6px 0 80px;
font-family : "KievitWeb", "Arial";
}
.example-item h1 {
font-size : 2.5em;
margin-bottom : 30px;
}
.code-switch {
margin-top : 20px;
height : 25px;
}
.code-switch a {
display : block;
width : 70px;
color : #fff;
text-align : center;
float : left;
background : #989898;
padding : 5px 0;
font-family : "Consolas", "Monaco", "Courier", serif;
font-size : 0.875em;
}
.code-switch a.active {
background : #5280dd;
}
.code-switch .js {
border-radius : 5px 0 0 5px;
}
.code-switch .html {
border-radius : 0 5px 5px 0;
}
.code-wrap .code {
display : none;
}
.code-wrap .code.active {
display : block;
}
.example-item .examples-list {
margin-top : 60px;
}
.examples-list ol {
margin-left : 30px;
}
.examples-list ol li {
list-style : decimal;
color : #666;
margin-bottom : 4px;
}
.example-item ol li {
font-size : 0.875em;
}
.example-item .slider a {
line-height : 1.5em;
}
.example-item #bx-pager {
text-align : center;
margin-top : -30px;
}
.example-item #bx-pager a {
margin : 0 3px;
}
.example-item #bx-pager a img {
padding : 3px;
border : #ccc solid 1px;
}
.example-item #bx-pager a:hover img, .example-item #bx-pager a.active img {
border : #5280DD solid 1px;
}
.options h1 {
margin-bottom : 10px;
}
.options h2 {
font-size : 1.5em;
margin-bottom : 15px;
}
.option-name {
font-weight : bold;
font-size : 0.875em;
margin-bottom : 2px;
}
.option-desc {
font-size : 0.8em;
line-height : 1.25em;
color : #666;
}
.options pre {
margin : 10px 0 25px;
}
.category-wrap {
margin-bottom : 40px;
}
.reference-wrap {
position : absolute;
top : 0;
right : 0;
background : #e4e4e4;
border-radius : 10px;
}
.reference-wrap h3 {
font-size : 1.125em;
margin : 0;
background : #e4e4e4;
padding : 10px 15px;
border-radius : 10px;
cursor : pointer;
text-align : right;
}
.reference-wrap h3 span {
color : #939393;
position : relative;
top : 2px;
margin-left : 5px;
}
.reference-content {
padding : 20px;
display : none;
}
.reference-content h4 {
margin-bottom : 5px;
}
.reference-content a {
display : block;
font-size : 0.8em;
padding : 3px 0;
}
.reference-content .col {
margin-bottom : 20px;
}
.reference-content .col-wrap.last {
margin-right : 0;
}
.reference-content-inner {
height : 300px;
overflow : auto;
}
.faqs h3 {
font-size : 1.15em;
line-height : 1.25em;
margin-bottom : 3px;
}
.faqs .questions p {
margin-bottom : 10px;
}
.faqs .question {
margin-bottom : 30px;
}
.faqs ul, .about ul {
margin : 0 0 20px 20px;
}
.faqs ul li, .about ul li {
color : #555;
font-size : 0.875em;
list-style : disc;
margin-bottom : 7px;
line-height : 1.25em;
}
.about h3 {
margin-top : 50px;
}
aside .block {
padding : 30px 0;
border-bottom : 8px solid #c2c2c2;
}
aside .block-advert {
padding-top : 0;
}
aside .block-advert .bsa_it_ad {
margin-bottom : 5px;
}
aside .block-advert .one .bsa_it_ad .bsa_it_i {
margin-right : 25px;
}
aside .block-advert .yoggrt-link {
font-size : 0.875em;
}
aside .block-buttons {
padding-bottom : 35px;
}
aside .block-buttons form {
display : none;
}
aside .btn {
display : block;
border-radius : 10px;
box-shadow : 0 5px 0 #9f9f9f;
background : #d8d8d8;
color : #414141;
padding : 5px 14px 3px;
font-weight : bold;
font-size : 1.5em;
font-family : "KievitWeb", "Arial";
position : relative;
}
aside .btn span {
font-weight : normal;
position : relative;
top : 2px;
padding-right : 4px;
}
aside .btn-donate {
margin-bottom : 20px;
}
aside .btn-donate span {
font-size : 1.1em;
padding-right : 6px;
}
aside .btn:hover {
color : #5280dd;
text-decoration : none;
}
aside .btn:hover span {
color : #414141;
}
aside .btn:active {
top : 5px;
box-shadow : none;
}
aside h4 {
font-size : 1.375em;
line-height : 1.25em;
margin-bottom : 8px;
}
aside .block-about {
border-bottom : 0;
margin-bottom : 0;
}
aside .block p {
font-size : 1em;
line-height : 1.25em;
}
aside input[type="text"] {
border : #c2c2c2 solid 1px;
padding : 3px 5px;
display : block;
width : 78%;
margin-bottom : 10px;
}
aside label {
font-size : 0.875em;
margin-bottom : 3px;
display : block;
}
aside input[type="submit"] {
border-radius : 5px;
transition : background-color 0.6s ease-in;
background : #5280dd;
color : #fff;
padding-top : 2px;
padding-left : 10px;
padding-right : 10px;
padding-bottom : 4px;
border : none;
font-size : 0.875em;
cursor : pointer;
}
aside input[type="submit"]:hover {
transition : background-color 0.03s;
background : #72cb76;
}
aside .block-signup .error {
display : none;
color : red;
font-size : 0.875em;
margin-bottom : 10px;
}
header {
background : #f7f7f7;
border-top : 0 solid #c3c3c3;
padding : 30px 40px;
border-bottom : 0 solid #c3c3c3;
}
.logo {
float : left;
font-size : 2.25em;
font-family : "KievitWeb", "Arial";
padding : 18px 0;
}
.logo a {
color : #414141;
font-weight : bold;
}
.logo a:hover {
text-decoration : none;
}
.icon-icomoon-bx-star {
color : #de3329;
position : relative;
top : 4px;
}
header .download {
position : absolute;
font-style : italic;
top : 4px;
right : 114px;
}
nav {
position : absolute;
top : 31px;
right : 170px;
font-family : "KievitWeb", "Arial";
}
nav a {
font-size : 1.1em;
font-weight : bold;
padding : 0 10px;
color : #414141;
}
nav a.active, nav a:hover {
color : #de3329;
text-decoration : none;
}
header .btn {
border-radius : 10px;
box-shadow : 0 2px 0 #365491;
background : #5280dd;
color : #fff;
padding : 5px 14px 3px;
font-weight : normal;
font-size : 0.875em;
position : relative;
font-family : "KievitWeb", "Arial";
}
header .btn:hover {
background : #72cb76;
box-shadow : 0 2px 0 #549557;
}
header .btn:active {
top : 5px;
box-shadow : none;
}
footer {
background : #f7f7f7;
border-top : 0 solid #c3c3c3;
border-bottom : 0 solid #c3c3c3;
padding : 30px 0 40px;
font-family : "KievitWeb", "Arial";
}
footer h4 {
font-size : 1.25em;
font-weight : bold;
}
footer .left {
float : left;
width : 500px;
}
footer .time {
position : absolute;
font-style : italic;
top : 12px;
right : 114px;
}
footer .first h4 {
padding-top : 3px;
}
footer .icon-icomoon-bx-star {
top : 2px;
}
footer p.pix {
margin-top : 35px;
}
@media (max-width:1040px) {
.inner {
width : 100%;
}
.reference-wrap {
right : 20px;
}
aside {
padding-right : 20px;
}
#primary {
padding : 0 20px;
}
.home h1 {
width : 90%;
font-size : 3em;
margin : 0 auto;
}
.home .bx-wrapper {
width : 90%;
}
.pictogram .operator {
margin : 0 18px;
}
header .logo {
padding-left : 20px;
}
header .download {
right : 20px;
}
header nav {
right : 170px;
}
footer .left {
width : auto;
float : none;
padding-left : 20px;
}
footer .first {
margin-bottom : 30px;
}
footer p.pix {
padding-left : 20px;
}
}
@media (max-width:700px) {
#primary {
margin : 0 0 750px 0;
}
aside {
float : none;
position : absolute;
bottom : 0;
width : 70%;
padding : 0 20px;
}
header .logo {
margin : 0 auto;
float : none;
text-align : center;
padding : 10px 0;
}
header nav {
position : static;
text-align : center;
}
header .download {
position : static;
text-align : center;
margin : 25px 0;
}
.home h1 {
font-size : 2.25em;
}
#main {
padding-top : 20px;
}
}
@media (max-width:500px) {
.example-item h1 {
font-size : 2em;
line-height : 1.25em;
}
aside {
font-size : 90%;
}
.home p.pop {
font-size : 1.25em;
margin-bottom : 30px;
}
.reference-wrap {
display : none;
}
footer {
font-size : 85%;
}
}
@media (max-width:400px) {
h1 {
font-size : 2.5em;
}
.example-item h1 {
font-size : 1.5em;
line-height : 1.25em;
}
.pictogram {
font-size : 45%;
}
.home h1 {
font-size : 1.75em;
}
nav a {
padding : 0 5px;
}
#primary {
font-size : 100%;
margin-bottom : 850px;
}
}
html, body {
color : #697170;
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 11px;
font-size-adjust : none;
font-style : normal;
font-variant : normal;
font-weight : normal;
line-height : 22px;
}
a, p, h1, h2, h3, h4, h5, h6, td, tr, ul, li {
margin : 0;
padding : 0;
}
#img_float_left {
border : #cecece solid 1px;
float : left;
margin : 0 20px 20px 20px;
}
#img_float_right {
border : #cecece solid 1px;
float : right;
margin : 0 20px 20px 20px;
}
.imgcontainer {
margin : 0 20px 20px;
border : #cecece solid 1px;
float : left;
background-color : #fafafa;
}

.imgcontainerr80 {
margin : 0 20px 20px;
border : #cecece solid 1px;
float : left;
background-color : #fafafa;
margin-right: 80px;
}

.imgcontainerhp {
margin : 0 30px 20px 30px;
border : #cecece solid 1px;
float : left;
background-color : #fafafa;
}
.imgcontainerhp80 {
margin : 0 30px 20px 80px;
border : #cecece solid 1px;
float : left;
background-color : #fafafa;
}
.imgcontainer p {
font-size : 0.82em;
line-height : 1.4em;
padding : 0;
margin : 0.5em;
}
.imgcontainerhp p {
font-size : 0.8em;
line-height : 1.4em;
padding : 0;
margin : 0.5em;
}
.imgcaption {
margin : 7px;
}
.imgcaptionsmall {
margin : 3px;
}
#inhalt {
background : none 0% repeat scroll #F7F7F7;
margin-left : 14%;
margin-right : 16%;
padding : 10px;
border : #cecece solid 1px;
text-align : left;
width : auto;
}
#suche, #block {
margin-left : 24px;
margin-right : 24px;
margin-top : 10px;
margin-bottom : 10px;
}
.navi {
margin-left : 24px;
margin-top : 26px;
margin-bottom : 10px;
}

.hlist {
width : 74%;
}

#einruck {
margin-left : 60px;
}
.inner {
width : 860px;
}
.text-window {
padding : 4px;
}
.slide-window90 {
padding : 4px;
padding-left : 8px;
width : 90%;
}
.slide-window100 {
padding : 4px;
padding-left : 8px;
width : 100%;
}
#main {
padding-top : 40px;
padding-bottom : 40px;
padding-right : 60px;
padding-left : 60px;
}
#primary {
margin-left : 500px;
margin-right : 0;
}
aside {
width : 500px;
}
#header, #footer {
margin : 52px;
}
.redlineheader {
background-color : #b22222;
width : 500px;
height : 10px;
padding : 0;
margin : 0;
}
.greenlineheader {
background-color : #006758;
width : 400px;
height : 10px;
padding : 0;
margin-left : 10px;
}
.redlinefooter {
background-color : #b22222;
width : 600px;
height : 10px;
padding : 0;
margin : 0;
}
.greenlinefooter {
background-color : #006758;
width : 400px;
height : 10px;
padding : 0;
margin-left : 10px;
}
h1 {
font-size : 160%;
line-height : 170%;
font-weight : bold;
padding-bottom : 8px;
}
h2 {
font-size : 130%;
line-height : 120%;
font-weight : bold;
padding-bottom : 8px;
}
h3 {
font-size : 120%;
line-height : 120%;
font-weight : bold;
padding-top : 12px;
padding-bottom : 8px;
}
h4 .anreisser {
font-size : 110%;
line-height : 120%;
font-weight : bold;
padding-bottom : 6px;
}
.datum {
font-size : 80%;
line-height : 100%;
font-weight : 400;
font-style : italic;
padding-bottom : 8px;
}
p {
font-size : 100%;
line-height : 140%;
font-weight : 400;
padding-bottom : 12px;
}
p.clearfloatleft {
clear : left;
}
td.ul {
margin : 0 0 12px 24px;
padding : 4px;
border : #ddd solid 1px;
}
ol {
margin : 0 0 12px 24px;
padding : 0;
}
li {
display : inline;
margin : 0;
}
.navilink {
font-size : 0.875em;
}
em {
font-style : italic;
}
a:link {
text-decoration : none;
font-weight : 500;
color : #050;
transition : background-color 0.6s ease-in;
}
a:visited {
color : #050;
background-color : #72cb00;
}
a:hover {
background-color : #96C11F;
color : #fff;
transition : background-color 0.03s;
}
a:active {
color : #0cc;
}
a:link.hc {
text-decoration : none;
font-weight : 500;
color : #050;
}
a:visited.hc {
color : #050;
}
a:hover.hc {
color : #050;
}
a:active.hc {
color : #0cc;
}
header .btn {
background : #5280dd;
color : #fff;
padding : 5px 14px 3px;
font-weight : normal;
font-size : 1.1em;
}
header .btn:hover {
background : #72cb76;
font-size : 1.1em;
}
hr {
background : none 0 0 repeat scroll transparent;
border-style : none none solid;
border-width : 0 0 1px;
color : #FFFFFF;
margin : 0 0 0.5em;
padding : 0 0 0.5em;
}