/* The fonts included are copyrighted by the vendor listed below.
 *
 * Vendor:      FontSite Inc.
 * License URL: http://www.fontspring.com/fflicense/fontsite
 *
 */
@font-face {
    font-family: 'franklin_gothic_fsbook';
    src: url('/fonts/webfonts/franklingothicfs_book_macroman/FranklinGothic-Book-webfont.eot');
    src: url('/fonts/webfonts/franklingothicfs_book_macroman/FranklinGothic-Book-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/webfonts/franklingothicfs_book_macroman/FranklinGothic-Book-webfont.woff') format('woff'),
         url('/fonts/webfonts/franklingothicfs_book_macroman/FranklinGothic-Book-webfont.ttf') format('truetype'),
         url('/fonts/webfonts/franklingothicfs_book_macroman/FranklinGothic-Book-webfont.svg#franklin_gothic_fsbook') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'franklin_gothic_fsmedium';
    src: url('/fonts/webfonts/franklingothicfs_medium_macroman/FranklinGothic-Med-webfont.eot');
    src: url('/fonts/webfonts/franklingothicfs_medium_macroman/FranklinGothic-Med-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/webfonts/franklingothicfs_medium_macroman/FranklinGothic-Med-webfont.woff') format('woff'),
         url('/fonts/webfonts/franklingothicfs_medium_macroman/FranklinGothic-Med-webfont.ttf') format('truetype'),
         url('/fonts/webfonts/franklingothicfs_medium_macroman/FranklinGothic-Med-webfont.svg#franklin_gothic_fsmedium') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'franklin_gothic_fsdemi';
    src: url('/fonts/webfonts/franklingothicfs_demi_macroman/FranklinGothic-Demi-webfont.eot');
    src: url('/fonts/webfonts/franklingothicfs_demi_macroman/FranklinGothic-Demi-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/webfonts/franklingothicfs_demi_macroman/FranklinGothic-Demi-webfont.woff') format('woff'),
         url('/fonts/webfonts/franklingothicfs_demi_macroman/FranklinGothic-Demi-webfont.ttf') format('truetype'),
         url('/fonts/webfonts/franklingothicfs_demi_macroman/FranklinGothic-Demi-webfont.svg#franklin_gothic_fsdemi') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'pwiconsmedium';
    src: url('/fonts/webfonts/pwicons/pwicons-webfont.eot');
    src: url('/fonts/webfonts/pwicons/pwicons-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/webfonts/pwicons/pwicons-webfont.woff') format('woff'),
         url('/fonts/webfonts/pwicons/pwicons-webfont.ttf') format('truetype'),
         url('/fonts/webfonts/pwicons/pwicons-webfont.svg#pwiconsmedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

*, *:after, *:before {
    box-sizing: border-box;
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

html, body {
    height: 100%;
}

body {
    font-family: franklin_gothic_fsbook, Arial, Helvetica, sans-serif;
    color: #222;
    font-size: 16px;
    /*background-color: F9F9F9;*/
	background-color:#ECECEC;
    margin: 0;
    padding: 0;
}
a {
    text-decoration: none;
    color: #074367;
    margin-bottom: -1px;
    border-bottom: 1px dotted currentColor;
}
.icon a {
    font-weight: normal;
    border-bottom: none;
}
h1, h2, h3, h4 {
    font-family: franklin_gothic_fsmedium, Arial, Helvetica, sans-serif;
}


/** header **/

header {
    position: relative;
    margin: 20px 4% 0 4%;
}
@media all and (min-width: 800px) {
    header {
        margin: 15px 0 0 0;
        max-width: 800px;
    }
}

/** logo **/

header .logo {
    font-family: franklin_gothic_fsmedium, Arial, Helvetica, sans-serif;
    font-weight: 500;
    font-size: 1.5625rem;
    margin-left: 0;
}
@media all and (min-width: 800px) {
    header .logo {
        margin-left: 30px;
    }
}
header .logo a {
    border-bottom: none;
    font-weight: normal;
    color: #785f92;
    display: inline-block;
    overflow: hidden;
}
header .logo a div {
    margin-top: 82px;
    float: left;
}
header .logo .highlight {
    color: #525B88;
}
header .logo .highlight-at {
    font-family: franklin_gothic_fsbook, Arial, Helvetica, sans-serif;
    color: #525B88;
}
header .logo a svg {
    float: left;
    margin-left: -15px;
    margin-top: -3px;
}

/** flag **/

/*
@media all and (min-width: 800px) {
    header .flag {
        left: 650px;
    }
}
@media all and (max-width: 799px) {
    header .flag {
        right: 10px;
    }
}
*/
header .flag {
    /* relative to document */
    position: absolute;
    float: none;
    top: 25px;
    right: 0;
    /* relativ to viewport
    position: fixed;
    z-index: 99;
    float: none;
    top: 25px;
    */
    padding: 3px;
    font-size: 0.875rem;
    line-height: 1.125rem;
    color: #393939;
    border-style: solid solid solid solid;
    border-width: 0 1px 1px 0;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 7px;

    /* old
    background: #1e5799; /* Old browsers */
    background: -moz-linear-gradient(left,  #ECECEC 0%, #dde4e2 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#1e5799), color-stop(0%,#ECECEC), color-stop(100%,#dde4e2)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #ECECEC 0%,#dde4e2 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, #ECECEC 0%,#dde4e2 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, #ECECEC 0%,#dde4e2 100%); /* IE10+ */
    background: linear-gradient(to right, #ECECEC 0%,#dde4e2 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ECECEC', endColorstr='#dde4e2',GradientType=1 ); /* IE6-9 */
    */
    background: #1e5799; /* Old browsers */
    background: -moz-linear-gradient(left,  #e32914 0%, #fc9f95 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#1e5799), color-stop(0%,#e32914), color-stop(100%,#dde4e2)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, #e32914 0%,#fc9f95 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, #e32914 0%,#fc9f95 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, #e32914 0%,#fc9f95 100%); /* IE10+ */
    background: linear-gradient(to right, #e32914 0%,#fc9f95 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e32914', endColorstr='#fc9f95',GradientType=1 ); /* IE6-9 */
}
@media all and (min-width: 800px) {
    header .flag {
        float: right;
        padding: 6px;
    }
}
header .flag strong {
    font-family: franklin_gothic_fsmedium, Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-style: normal;
    color: #333;
}
header .flag a {
    text-decoration: none;
    border-bottom: 0px;
}

/** navigation **/

.site-nav {
    margin: 0;
    overflow: visible;
    position: absolute;
    top: 80px;
    z-index: 1;
    right: 0;
}
.site-nav .menu-icon {
    border-bottom: none;
    font-weight: 500;
    padding: 10px 0 10px 10px;
}
.site-nav .menu-icon svg {
    display: inline-block;
    vertical-align: middle;
    height: 27px;
    width: 27px;
    margin-top: -3px;
}
.site-nav .menu-icon svg path {
    fill: #074367;
}

.menu-pane {
    width: 230px;
    position: fixed;
    top: 0;
    bottom: 0;
    left: -240px;
    background-color: white;
    box-shadow: 0 0 6px #999;
    transition: left .5s ease 0s;
    color: #074367;
    overflow-y: auto;
}
.menu-pane.visible {
    left: 0;
}

.menu-pane a {
    color: currentColor;
    white-space: nowrap;
    font-weight: normal;
}

.menu-pane .menu-pane-close {
    display: block;
    text-align: right;
    font-weight: 700;
    font-size: 2rem;
    padding-right: 10px;
    color: #074367;
    border-bottom: 1px solid #074367;
    margin-bottom: 10px;
}
.menu-list {
    padding: 0 5px 20px 5px;
}
.menu-list a {
    display: block;
    padding: 8px 5px;
    border-bottom: none;
}
.menu-list > li {
    border-bottom: 1px dotted currentColor;
    padding-top: 5px;
    padding-bottom: 5px;
}
.menu-list ul {
    margin-left: 20px;
    padding-left: 8px;
    list-style: disc;
}
.menu-list .menu-item {
    font-weight: 700;
    font-size: 1.125rem;
}

@media all and (min-width: 800px) {
    .site-nav {
        left: 172px;
        right: 0;
    }
    .menu-pane {
        display: block;
        position: relative;
        left: 0;
        background-color: transparent;
        width: auto;
        box-shadow: none;
        transition: none;
        overflow: visible;
    }
    .menu-icon,
    .menu-pane .menu-pane-close {
        display: none;
    }
    .menu-list {
        overflow: visible;
        padding: 0;
    }
    .menu-list a:hover {
        text-decoration: none;
    }
    .menu-list .menu-item {
        padding: 6px 8px 4px;
        font-weight: normal;
        font-size: 1.0625rem;
    }
    .menu-list > li {
        float: left;
        position: relative;
        margin-right: 8px;
        margin-bottom: 0;
        border: 2px solid transparent;
        border-bottom-width: 0;
        border-left-width: 0;
        border-top-left-radius: 3px;
        border-top-right-radius: 7px;
        border-bottom-right-radius: 3px;
        font-size: 1.0625rem;
    }
    .menu-list > li a {
        padding: 5px 9px;
        display: block;
    }
    .menu-list > li > ul {
        display: none;
        position: absolute;
        font-size: 0.9375rem;
        margin-left: 0;
        padding-left: 0;
        list-style: none;
    }
    .menu-list > .expanded ul {
        display: block;
        border-bottom-left-radius: 7px;
        border-bottom-right-radius: 7px;
        border-top-right-radius: 7px;
        overflow: hidden;
    }
    .menu-list .green {
        border-top-color: #a5c400;
        border-right-color: #a5c400;
    }
    .menu-list .green:hover,
    .menu-list .green.expanded > *,
    .menu-list .green.current {
        background-color: #DAE98A;
    }
    .menu-list .green.expanded a:hover,
    .menu-list .green ul li:hover {
       background-color: #CCE548;
    }
/*    .menu-list .green.current ul li.current {
        background-color: #BD91;
    }
    */
    .menu-list .blue {
        border-top-color: #45a12a;
        border-right-color: #45a12a;
    }
    .menu-list .blue:hover,
    .menu-list .blue.expanded > *,
    .menu-list .blue.current {
        background-color: #C3DEBB;
    }
    .menu-list .orange {
        border-top-color: #006d2b;
        border-right-color: #006d2b;
    }
    .menu-list .orange:hover,
    .menu-list .orange.expanded > *,
    .menu-list .orange.current {
        background-color: #C1DDCD;
    }
    .menu-list .orange.expanded a:hover,
    .menu-list .orange ul li:hover {
        background-color: rgb(224, 189, 174);
    }
    .menu-list .orange.current ul li.current {
        background-color: rgb(202, 167, 152);
    }
    .menu-list .red {
        border-top-color: #005240;
        border-right-color: #005240;
    }
    .menu-list .red:hover,
    .menu-list .red.expanded > *,
    .menu-list .red.current {
        background-color: #A6CCCE;
    }
    .menu-list .red.expanded a:hover,
    .menu-list .red ul li:hover {
        background-color: #86ACAE;
    }
    .menu-list .red.current ul li.current {
        background-color: #769C9E;
    }
    .menu-list .violet {
        border-top-color: #00431d;
        border-right-color: #00431d;
    }
    .menu-list .violet:hover,
    .menu-list .violet.expanded > *,
    .menu-list .violet.current {
        background-color: #ADC8BC;
    }
    .menu-list .violet.expanded a:hover,
    .menu-list .violet ul li:hover {
        background-color: #70A186;
    }
    .menu-list .violet.current ul li.current {
        background-color: #7D988C;
    }
}


/** breadcrumb navigation **/

.breadcrumb {
    position: static;
    margin-bottom: 20px;
    overflow: hidden;
    font-size: 0.875rem;
    border: 1px solid transparent;
    border-bottom: 1px solid #a5c400;
    border-bottom-right-radius: 7px;
    padding-right: 2px;
}
.breadcrumb .current {
    display: none;
}
.green .breadcrumb {
    border-bottom-color: #a5c400;
}
.blue .breadcrumb {
    border-bottom-color: #45a12a;
}
.orange .breadcrumb {
    border-bottom-color: #006d2b;
}
.red .breadcrumb {
    border-bottom-color: #005240;
}
.violet .breadcrumb {
    border-bottom-color: #00431d;
}
.breadcrumb a {
    display: inline-block;
    border-bottom: none;
    padding-bottom: 3px;
}
.breadcrumb li {
    float: left;
    display: inline-block;
    margin-right: 5px;
}
.breadcrumb li:first-child {
    padding-left: 0;
}
.breadcrumb li:first-child:before {
    content: " ";
    margin-right: 0;
}
.breadcrumb li:before {
    content: "\2022";
    margin-right: 3px;
}
@media all and (min-width: 800px) {
    .breadcrumb {
        position: absolute;
        left: 172px;
        top: 121px;
        margin-bottom: 0;
    }
    .breadcrumb .current {
        display: block;
    }
    .breadcrumb li:first-child {
        padding-left: 6px;
    }
}


/** main content **/

.content {
    max-width: 800px;
    min-height: 90%;
    height: auto !important;
    height: 90%;
    margin-top: 38px;
    margin-bottom: -290px;     /*Negates #push on longer pages*/
}
.content .push {
    height: 290px;
    clear: both;
}
.content .main {
    font-size: 1rem;
    /*font-size: 0.875rem;*/
    /*font-size: 1.0625rem;*/
    /* dieter meinte 2-4px weniger für den text,
    daher statt 22px probiere ich 20px
    line-height: 1.375rem; */
    line-height: 1.25rem;
    color: #44476d;
    margin: 0 4% 0 4%;
}
@media all and (min-width: 800px) {
    .content .main {
        float: left;
        margin-left: 147px;
        margin-right: 0;
        max-width: 480px;
    }
}
.content .main h1,
.content .main h2,
.content .main h3,
.content .main h4 {
    color: #444444;
}

.content .main h1 {
    font-size: 1.625rem;
    line-height: 2rem;
}
.content .main h4 {
    border-bottom: 2px dotted #A5C400;
    font-size: 1.125rem;
    line-height: 3.75rem;
    margin-bottom: 1rem;
    margin-top: 1.125rem;

}
.content .main h1.front {
    font-family: franklin_gothic_fsbook, Arial, Helvetica, sans-serif;
    font-size: 1.875rem;
    line-height: 2.125rem;
    margin-top: -3px;
    font-weight: bold;
}
@media all and (min-width: 800px) {
    .content .main h1.front {
        font-size: 2.125rem;
        line-height: 2.375rem;
        margin-bottom: 22px;
    }
}
.content .main h2 {
    font-size: 1.5rem;
    margin-top: 1.75rem;
    line-height: 1.625rem;
}
.content .main h3 {
    font-size: 1.125rem;
    margin-top: 1rem;
}
.content .main p {
    margin-top: 0.5625rem;
    /* besser bottom höher als top höher, weil unter der überschrift sollte
    weniger abstand sein, als beim letzten absatz vor der nächsten überschrift */
    margin-bottom: 0.6875rem;
}

.content .main video {
    width: 100% !important;
    height: auto;
    margin-top: 0.5rem;
    margin-bottom: 0.375rem;
}

.content .main p img {
    max-width: 100%;
}
.content .main .opener {
    background: transparent url('/images/usbstick.png') no-repeat;
    background-size: auto 100%;
    background-position: -35px 0;
    padding: 0 0 0 100px;
    margin: 20px 0;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}
@media all and (min-width: 800px) {
    .content .main .opener {
        margin-left: -71px;
        background-size: 200px;
        padding: 0 0 0 200px;
        background-position: 0 0;
    }
}
.content .main .opener:hover a {
    background-color: #A5C400;
}
.content .main .opener a {
    display: block;
    padding: 15px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    background: #95B400 linear-gradient(to bottom, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
    font-weight: normal;
    border-bottom: none;
}
.content .main .opener h2 {
    font-size: 2rem;
    line-height: 2.5rem;
    margin-top: 0;
}
.content .main .opener h3 {
    font-size: 1.3rem;
    line-height: 1.7rem;
    margin-top: 5px;
}
.content .main .opener .disclaimer {
    font-size: 0.875rem;
    margin: 5px 0 0 0px;
    color: #444;
}

@media all and (min-width: 800px) {
    .content .main p img {
        max-width: 123%;
    }
}

.content .main ul {
    font-size: 1rem;
    margin-top: 0.5625rem;
    margin-bottom: 0.6875rem;
}

.content .main h2 + ul {
    margin-top: 0.875rem;
    margin-bottom: 1.6875rem;
}

.content .main p + ul {
    margin-top: 0.5625rem;
    margin-bottom: 0.6875rem;
}
.content .main ul li {
    list-style: circle;
    margin: 0 0 0.1875rem 1rem;
}
.content .main strong {
    /* fsmedium looks bad with 16px :( */
        /*
    font-family: franklin_gothic_fsmedium, Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-style: normal;
*/
    font-family: franklin_gothic_fsbook, Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-style: normal;
}

.content .main em {
    font-weight: normal;
    font-style: italic;
}
.content .main ol {
    list-style: decimal;
    margin-top: 0.5625rem;
    margin-bottom: 0.6875rem;
}
.content .main ol li {
    margin-left: 1.25rem;
    margin-bottom: 0.3125rem;
    line-height: 1.125rem;
}

/** sitebar **/

.sitebar {
    width: auto;
    margin: 24px 4% 10px 4%;
    /*margin-left: 630px;*/
    font-size: 0.75rem;
    color: #4c4c4c;
    line-height: 1rem;
}
.sitebar ul {
    border: 1px solid #ccc;
    border-bottom-width: 3px;
    border-right-width: 3px;
    border-radius: 7px 3px;
    padding: 4%;
    margin-bottom: 30px;
    overflow: hidden;
}
.sitebar ul li {
    float: left;
    width: 48%;
}
.sitebar ul li:first-child {
    margin-right: 4%;
}
@media all and (min-width: 800px) {
    .sitebar {
        float: right;
        width: 125px;
        margin: 0 0 0 8px;
    }
    .sitebar ul {
        border: none;
        padding: 0;
        margin: 0;
    }
    .sitebar ul li {
        float: none;
        width: auto;
    }
    .sitebar ul li:first-child {
        margin-right: 0;
    }
}

.sitebar img {
    width: 78px;
    display: block;
    margin-left: 16px;
}
.sitebar h3 {
    font-family: franklin_gothic_fsmedium, Arial, Helvetica, sans-serif;
    color: #181818;
    font-size: 0.875rem;
    margin-top: 5px;
    font-weight: normal;
}
.sitebar h4 {
    font-weight: normal;
}
/** h6 for icon font **/
.sitebar h6:first-child {
    margin-top: 60px;
}
.sitebar h6 {
    font-family: pwiconsmedium;
    font-size: 65px;
    margin-top: 80px;
    margin-bottom: 30px;
    text-align: center;
}
.sitebar blockquote {
    margin-top: 10px;
    margin-bottom: 30px;
    line-height: 0.9375rem;
}
.sitebar blockquote p:before {
    content: "\201e";
}
.sitebar blockquote p:after {
    content: "\201c";
}

/** inline-sitebar **/

.inline-sitebar {
    display: block;
    float: left;
    margin-left: 0;
    width: auto;
    padding: 0 10px 10px 0;
    text-align: center;
    cursor: default;
    font-size: 0.8125rem;
    line-height: 0.8125rem;
    max-width: 100px;
}
.inline-sitebar.icon,
.inline-sitebar .icon {
    font-family: pwiconsmedium;
    font-size: 50px;
    line-height: 50px;
    display: block;
    color: #A5C400;
}
.inline-sitebar a,
.inline-sitebar.icon a,
.inline-sitebar .icon a {
    color: #A5C400;
    border-bottom: none;
}
.inline-sitebar .icon:hover a {
    color: #006d2b;
}
@media all and (min-width: 800px) {
    .inline-sitebar {
        float: none;
        position: absolute;
        margin-left: 535px;
        min-width: 125px;
        padding: 0;
    }
    .inline-sitebar.icon,
    .inline-sitebar .icon {
        font-size: 75px;
        line-height: 75px;
    }
}


/** frontpage video buttons **/

.videobuttons {
    overflow: hidden;
    margin-top: 34px;
    line-height: 1.375rem;
}

.videobuttons a {
    display: block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 12px 10px 13px 10px;
    text-align: center;
    border-radius: 7px 3px 7px 3px;
    border-width: 1px 3px 3px 1px;
    border-style: solid;
    color: #17204c;
    margin-bottom: 10px;
}
.videobuttons strong {
    font-family: franklin_gothic_fsmedium, Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 1.4375rem;
}
.videobuttons .green {
    border-color: #a5c400;
}
.videobuttons .green:hover {
    -webkit-box-shadow: 0 0 3px #a5c400;
    -moz-box-shadow: 0 0 3px #a5c400;
    box-shadow: 0 0 3px #a5c400;
}
.videobuttons .green strong {
    color: #a5c400;
}
.videobuttons .blue {
    border-color: #45a12a;
}
.videobuttons .blue:hover {
    -webkit-box-shadow: 0 0 3px #45a12a;
    -moz-box-shadow: 0 0 3px #45a12a;
    box-shadow: 0 0 3px #45a12a;
}
.videobuttons .blue strong {
    color: #45a12a;
}
.videobuttons .orange {
    border-color: #006d2b;
}
.videobuttons .orange:hover {
    -webkit-box-shadow: 0 0 3px #006d2b;
    -moz-box-shadow: 0 0 3px #006d2b;
    box-shadow: 0 0 3px #006d2b;
}
.videobuttons .orange strong {
    color: #006d2b;
}

@media all and (min-width: 700px) {
    .videobuttons a {
        width: 30%;
        float: left;
    }
    .videobuttons .center {
        margin-left: 5%;
    }
    .videobuttons .right {
        margin-left: 5%;
    }
}

/** suppportpage support buttons **/

.supportbuttons {
    overflow: hidden;
    margin-top: 34px;
    margin-bottom: 28px;
    line-height: 1.375rem;
}

.supportbuttons a {
    display: block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 12px 10px 13px 10px;
    text-align: center;
    border-radius: 7px 3px 7px 3px;
    border-width: 1px 3px 3px 1px;
    border-style: solid;
    color: #17204c;
    margin-bottom: 10px;
}
.supportbuttons strong {
    font-family: franklin_gothic_fsmedium, Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 1.125rem;
}
.supportbuttons .green {
    border-color: #a5c400;
}
.supportbuttons .green:hover {
    -webkit-box-shadow: 0 0 3px #a5c400;
    -moz-box-shadow: 0 0 3px #a5c400;
    box-shadow: 0 0 3px #a5c400;
}
.supportbuttons .green strong {
    color: #a5c400;
}
.supportbuttons .blue {
/*    border-color: #45a12a; */
}
.supportbuttons .blue:hover {
    -webkit-box-shadow: 0 0 3px #45a12a;
    -moz-box-shadow: 0 0 3px #45a12a;
    box-shadow: 0 0 3px #45a12a;
}
.supportbuttons .blue strong {
/*    color: #45a12a; */
}
.supportbuttons .orange {
    border-color: #006d2b;
}
.supportbuttons .orange:hover {
    -webkit-box-shadow: 0 0 3px #006d2b;
    -moz-box-shadow: 0 0 3px #006d2b;
    box-shadow: 0 0 3px #006d2b;
}
.supportbuttons .orange strong {
    color: #006d2b;
}

@media all and (min-width: 700px) {
    .supportbuttons a {
        width: 30%;
        float: left;
    }
    .supportbuttons .center {
        margin-left: 5%;
    }
    .supportbuttons .right {
        margin-left: 5%;
    }
}



/** slideshow **/

.slideshow {
    width: 100%;
    padding: 30px 0 5px 0;
    margin-top: 25px;
}
@media all and (min-width: 800px) {
    .slideshow {
        width: auto;
        margin-right: -110px;
    }
}
.slideshow img {
    width: 100%;
}
.slideshow figcaption {
    margin-top: 3px;
    font-size: 0.875rem;
    color: #777;
    font-family: franklin_gothic_fsbook, Arial, Helvetica, sans-serif;
    font-style: italic;
    white-space: normal;
}
.slideshow .owl-controls {
    position: absolute;
    top: 0;
    width: 100%;
    margin-top: 0;
}
.slideshow .owl-controls .owl-buttons > div {
    position: absolute;
    top: 0;
    margin: 0;
    padding: 3px 20px;
}
.slideshow .owl-controls .owl-buttons .owl-prev {
    left: 0;
    padding-left: 0;
}
.slideshow .owl-controls .owl-buttons .owl-next {
    right: 0;
    padding-right: 0;
}
.slideshow .owl-controls .owl-buttons div {
    background: none;
}
.slideshow .owl-controls .owl-buttons div svg path {
    fill: #869791;
}

/** footer **/

footer {
    clear: both;
    padding-left: 4%;
    height: 290px;
    width: 100%;
}
@media all and (min-width: 800px) {
    footer {
        padding: 20px 0 20px 147px;
    }
}
body.green footer {
    background: #ECECEC; /* Old browsers */
    background: -moz-linear-gradient(top, #ECECEC 0%, #A5C400 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(0%,#ECECEC), color-stop(100%,#A5C400)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ECECEC 0%,#A5C400 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ECECEC 0%,#A5C400 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ECECEC 0%,#A5C400 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ECECEC 0%,#A5C400 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ECECEC', endColorstr='#A5C400',GradientType=0 ); /* IE6-9 */
}
body.blue footer {
    background: #ECECEC; /* Old browsers */
    background: -moz-linear-gradient(top, #ECECEC 0%, #45A12A 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(0%,#ECECEC), color-stop(100%,#45A12A)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ECECEC 0%,#45A12A 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ECECEC 0%,#45A12A 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ECECEC 0%,#45A12A 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ECECEC 0%,#45A12A 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ECECEC', endColorstr='#45A12A',GradientType=0 ); /* IE6-9 */
}
body.orange footer {
    background: #ECECEC; /* Old browsers */
    background: -moz-linear-gradient(top, #ECECEC 0%, #006D2B 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(0%,#ECECEC), color-stop(100%,#006D2B)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ECECEC 0%,#006D2B 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ECECEC 0%,#006D2B 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ECECEC 0%,#006D2B 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ECECEC 0%,#006D2B 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ECECEC', endColorstr='#006D2B',GradientType=0 ); /* IE6-9 */
}
body.red footer {
    background: #ECECEC; /* Old browsers */
    background: -moz-linear-gradient(top, #ECECEC 0%, #005240 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(0%,#ECECEC), color-stop(100%,#005240)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ECECEC 0%,#005240 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ECECEC 0%,#005240 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ECECEC 0%,#005240 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ECECEC 0%,#005240 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ECECEC', endColorstr='#005240',GradientType=0 ); /* IE6-9 */
}
body.violet footer {
    background: #ECECEC; /* Old browsers */
    background: -moz-linear-gradient(top, #ECECEC 0%, #00431D 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ECECEC), color-stop(100%,#00431D)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ECECEC 0%, #00431D 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ECECEC 0%,#00431D 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ECECEC 0%,#00431D 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ECECEC 0%,#00431D 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ECECEC', endColorstr='#00431D',GradientType=0 ); /* IE6-9 */
}
footer ul {
    display: inline-block;
    overflow: hidden;
}
footer ul li {
    float: left;
    font-size: 0.825rem;
    margin-right: 20px;
}
footer ul li:first-child {
    margin-left: 0;
}
footer ul li a {
    color: #666;
}

/** prices table **/

.prices {
    border: none;
    width: 300px;
    margin: 21px auto;
 }

.prices th {
    padding: 2px 15px;
    text-align: center;
    font-weight: normal;
}
.prices thead tr {
    font-size: 0.8125rem;
    color: #666;
}
.prices thead tr:first-child {
    font-size: inherit;
    color: inherit;
}
.prices thead tr.level2 th {
    text-align: right;
}

.prices td {
    padding: 4px 8px;
}
.prices tbody tr {
    border-top: 1px solid #ccc;
}
.prices tbody td {
    text-align: right;
    border-left: 1px solid #ccc;
}
.prices tbody td:first-child {
    text-align: left;
    border-left: none;
}
.prices tfoot td {
    border-top: 1px solid #ccc;
    font-size: 0.6525rem;
    text-align: right;
    color: #666;
}

/** actuality table **/

.act {
    border: none;
    margin-top: 10px;
    margin-bottom: 30px;
    font-size: 1rem;
 }

.act td {
    padding: 4px 8px;
}
.act tbody tr {
    border-top: 0px solid #ccc;
}
.act tbody td {
    text-align: left;
    border-left: 0px solid #ccc;
    padding-right: 0px;
    /* font-family: franklin_gothic_fsmedium, Arial, Helvetica, sans-serif; */
}
.act tbody td:first-child {
    text-align: left;
    border-left: none;
    min-width: 7rem;
    padding-left: 0px;
    font-family: franklin_gothic_fsbook, Arial, Helvetica, sans-serif;
}

/** scanner table **/

.scanner {
    border: none;
    margin-top: 15px;
    margin-bottom: 20px;
    font-size: 0.75rem;
}
.scanner th {
    padding: 2px 15px;
    text-align: center;
    line-height: 1rem;
}
.scanner thead tr {
    font-size: 0.8125rem;
    color: #666;
}
.scanner thead tr:first-child {
    font-weight: bold;
    font-size: inherit;
    color: inherit;
}
.scanner thead tr.level2 th {
    text-align: right;
}

.scanner td {
    padding: 4px 8px;
}
.scanner tbody tr {
    border-top: 1px solid #ccc;
}
.scanner tbody td {
    text-align: right;
    line-height: 1rem;
    border-left: 1px solid #ccc;
}
.scanner tbody td:first-child {
    text-align: left;
    font-weight: bold;
    border-left: none;
}
.scanner tfoot td {
    border-top: 1px solid #ccc;
    font-size: 0.6525rem;
    text-align: right;
    color: #666;
}

/** order form **/

.order fieldset {
    margin-top: 20px;
}
.order fieldset p {
    margin: 3px !important;
}
.order fieldset legend {
    font-family: franklin_gothic_fsmedium, Arial, Helvetica, sans-serif;
    color: #666;
    margin-bottom: 5px;
}
.order p {
    margin-bottom: 0;
    margin-top: 0.4rem;
    clear: left;
    overflow: hidden;
}
.order p.hint {
    font-size: 0.75rem;
    line-height: 1.125rem;
    color: #666;
}
.order p.buttons {
    margin-top: 20px;
}
.order label {
    display: inline-block;
    vertical-align: middle;
    width: 8rem;
}
.order label.long {
    width: auto;
}
.order input,
.order select {
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
}
.order input[type=checkbox],
.order input[type=submit] {
    margin-left: 0;
    margin-right: 10px;
}
.order textarea {
    display: block;
    overflow: hidden;
    clear: left;
    width: 26rem;
}
.order p.error {
    color: #c41700;
}
.order p input.error {
    background-color: #ffd8dc;
    border: 1px solid #ffa59e;
    box-shadow: inset 1px 1px 2px #ffb2a8;
    padding: 3px;
}
.order label.required:after {
    content: '*';
    color: #6daacf;
    margin-left: 3px;
}
.order sup.required {
    color: #6daacf;
    font-size: 1.2rem;
    padding: 5px;
}
.order p.required {
    font-size: 0.75rem;
    color: #666;
}
.order p.message {
    display: none;
    color: #017619;
}
.order p.message:before {
    background-color: green;
    border-radius: 8px 8px 8px 8px;
    color: white;
    margin-right: 4px;
    padding: 0 8px;
    content: "\2713";
}
.order p.message.error {
    color: #c41700;
}
.order p.message.error:before {
    content: "!";
    background-color: #c41700;
}
.order button {
    font-size: .925rem;
}
.order button img {
    width: auto;
    height: auto;
    margin-right: 7px;
    vertical-align: top;
    display: none;
}
.order.active button img {
    display: inline-block;
}

/**** Accordion Shortcode **********/
.accordion-header {
    /*padding: 6px 0 6px 10px;*/
	/*font-weight:bold;*/
	color: #074367;
	cursor:pointer;
    margin-top: -6px; /* p-tag fix */
    margin-bottom:-6px; /* p-tag fix */
}
.accordion-header-open {
    background:#f5f5f5;
	font-weight:bold;
    margin-top:20px;
    padding-top:8px;
}

.accordion-symbol {
    float:left;
	padding-right: 6px;
	width:16px;
}
.accordion-header-open .accordion-symbol {
    text-align:center;
    margin-top:2px;
    padding-left:2px;
}


.accordion-title {
	padding-left:16px;
}
.accordion-title:hover {
    text-decoration:underline;
}
.accordion-header .clearfix {
	clear:both;
}
.accordion-panel {
    background:#f5f5f5;
	padding: 2px 10px 2px 16px;
    margin-bottom:20px;
}
/*accordion imgages - produkt seite*/
.img-resize {
	width:100%;
	border: 1px solid #c3c3c3;
}

/*lightbox*/
.lightbox-modal {
	width:100%;
	height:100%;
	top:0;
	left:0;
	position:fixed;
	z-index:10000;
	background:rgba(0,0,0,0.7);
	display:none;
}
.lightbox-close-button {
	position:absolute;
	top:0;
	right:12px;
	text-align: center;
	width:22px;
	font-weight:bold;
	color:#F9F9F9;
	background:#005240;
	cursor:pointer;
}
.lightbox-imgbox {
	margin:auto;
	width:auto;
	position:relative;
	top:25%;
	bottom:25%;
	padding: 0 12px;
	max-width:700px;
}

.lightbox-img {
	width:100%;
}


/**** Softwarewartungsvertrag Feature Table **********/

.swv-feature-table {
  width: 100%;
  margin-top:8px;
  margin-bottom:8px;
}

.swv-feature-table td, .swv-feature-table th {
  text-align: center;
  border: solid 1px #aaaaaa;
  height: 42px;
  word-wrap: break-word;
  vertical-align: middle;
}

.swv-feature-table td:first-child {
  color: #444444;
}

.swv-feature-table th {
    font-weight:bold;
}

.swv-feature-table .swv-check {
  background: transparent url('/images/hacken.png') no-repeat center center;
}

.swv-feature-table .swv-nocheck {
  background: transparent url('/images/x.png') no-repeat center center;
}


@media screen and (max-width: 768px) {

  .swv-feature-table tr {
    display: -ms-flexbox;
    display: -webkit-flex; 
    display: flex;
    -webkit-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
  }

  .swv-feature-table td, .swv-feature-table th {
    display: block;
    width: 33.333333333333%;
  }

  .swv-feature-table th:first-child, .swv-feature-table td:first-child {
    background: #efefef;
    width: 100%;
    height:auto;
    padding: 2px 0;
  }

  .swv-feature-table th:first-child {
    display: none;
  }
}