/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */


/*
    Gray 1 rgb(30,30,30)
    Gray 2 rgb(50,50,50)
    Gray 3 rgb(75,75,75)
    Gray 4 rgb(115,115,115)
    Gray 5 rgb(185,185,185)
    Gray 6 rgb(232,232,232)
    Gray 7 rgb(243,243,243)

    Orange 1 rgb(255,153,0)
    Orange 2 rgb(255,218,174)
    Orange 3 rgb(254,237,217)
    Orange 4 rgb(243,148,24)
 */


/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

* {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

html {
    font-size: 62.5%;
}

html,
button,
input,
select,
textarea {
    color: rgb(30,30,30);
}

body {
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 1.4;
    background-image: url("/preview/obo-bettermann/img/bg_texture.jpg");
    background-repeat: repeat;
    overflow-y: scroll;
    font-family: Arial, Helvetica, sans-serif;
}

p {
    margin-top: 0;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

img {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

h2, h3 {
    line-height: 1.2;
}

/* ==========================================================================
   Links
   ========================================================================== */

a {
    text-decoration: none;
    color: rgb(255,153,0);
}

a:hover,
a:focus {
    text-decoration: underline;
}

a:focus {
    outline: 0; /*Focus needs Hover-Style always*/
}


/* ==========================================================================
   Layout Wrapper
   ========================================================================== */

.wrapper {
    width: 1020px;
    padding: 0 10px;
    margin: 0 auto;
}

/* ==========================================================================
   Info Layer
   ========================================================================== */

.language-info {
    width: 100%;
    background-color: rgb(255,153,0);
    height: 0;
    overflow: hidden;
}

.language-info.visible {
    height: auto;
    padding-top: 60px;
}

.language-info .inside {
    width: 1000px;
    background-color: rgb(255,255,255);
    border: 1px solid rgb(30,30,30);
    padding: 10px 40px 10px 10px;
    position: relative;
    height: 0;
    transform: translateY(100%);
    transition: all 0.3s ease;
    overflow: hidden;
}

.language-info.visible .inside {
    transform: translateY(0);
    height: auto;
}

.language-info .close-icon {
    width: 19px;
    height: 19px;
    text-indent: -9999px;
    display: block;
    background: transparent url(/preview/obo-bettermann/img/close.png) center center no-repeat;
    position: absolute;
    top: 10px;
    right: 10px;
}

.language-info .close-icon:hover,
.language-info .close-icon:focus {
    background: transparent url(/preview/obo-bettermann/img/close_over.png) center center no-repeat;
}

.language-info .inside p {
  margin: 0;
}

.language-info .inside p + p,
.language-info .inside p + .web-select {
    margin-top: 10px;
}

.language-info .web-select {
    position: relative;
    padding-left: 20px;
    padding-top: 4px;
    padding-bottom: 4px;
}

.language-info .web-select .flag {
    vertical-align: 0px;
    margin-right: 10px;
    border: 1px solid rgb(255,255,255);
    outline: 1px solid rgb(232,232,232);
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    display: block;
    position: absolute;
    left: 0;
    top: 13px;
    margin-top: -7px;
}

.language-info .web-select .global {
    background: url("/preview/obo-bettermann/img/global.png") no-repeat;
}

.language-info .web-select a {
    display: inline-block;
    border-right: 1px solid rgb(185,185,185);
    padding: 0 5px;
}

.language-info .web-select a:last-child {
    border-right: 0;
}

.language-info .web-select a {
    color: rgb(75,75,75);
}

.language-info .web-select a:hover,
.language-info .web-select a:focus {
    color: rgb(255,153,0);
}

/* ==========================================================================
   Transition Layer
   ========================================================================== */

.transition-layer {
    background-color: black;
    background-color: rgba(0, 0, 0, 0.8);
    padding: 15px 0;
    position: fixed;
    bottom: 0;
    width: 100%;
    color: #fff;
    z-index: 999999;
    display: none;
}

.transition-layer.visible {
    display: block;
}

.transition-layer .inside {
    width: 1000px;
    color: rgb(255,255,255);
    padding: 10px 40px 10px 10px;
    position: relative;
}

.transition-layer .close-icon {
    width: 19px;
    height: 19px;
    text-indent: -9999px;
    display: block;
    background: transparent url(/preview/obo-bettermann/img/close_white.png) center center no-repeat;
    position: absolute;
    top: 10px;
    right: 10px;
}

.transition-layer .close-icon:hover,
.transition-layer .close-icon:focus {
    background: transparent url(/preview/obo-bettermann/img/close_over.png) center center no-repeat;
}

.transition-layer .inside p {
  margin: 0;
}

.transition-layer p + p {
    margin-top: 10px;
}

/* ==========================================================================
   Header & Navigation Bar
   ========================================================================== */

.header {
    background-color: transparent;
    background-image: url("/preview/obo-bettermann/img/bg_header.png");
    background-repeat: repeat-x;
    background-position: left bottom;
    height: 268px;
    padding-top: 60px;
}

.nav-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: rgb(255,153,0);
    z-index: 99;
}

.line-width {
    background-image: url("/preview/obo-bettermann/img/bg_nav-wide.png");
    background-repeat: no-repeat;
    background-position: center bottom;
}

.nav-bar .wrapper {
    position: relative;
}

/* ==========================================================================
   Main Navigation
   ========================================================================== */

.nav-main {
    float: left;
    border-bottom: 1px solid rgb(30,30,30);
    width: 716px;
    height: 32px;
}

.nav-main > ul {
    padding: 0;
    margin: 0;
}

.nav-main > ul > li {
    float: left;
}

.nav-main > ul > li > a {
    color: rgb(75,75,75);
    font-weight: bold;
    font-size: 13px;
    display: block;
    padding: 7px 10px 6px 10px;
    min-height: 31px;
}

.lt-ie9 .nav-main > ul > li > a {
    min-height: 0;
}

.nav-main > ul > li > a:hover,
.nav-main > ul > li > a:focus {
    background-color: rgb(243,148,24); /* Orange 4 */
    box-shadow: 0px 3px 4px rgba(0,0,0,0.2) inset;
    outline: 0;
}

.nav-main > ul > li.active > a,
.nav-main > ul > li.current > a,
.nav-main.is-on > ul > li.current.active > a {
    color: rgb(255,255,255);
    background-color: rgb(75,75,75); /* Gray 3 */
    box-shadow: 0px 3px 4px rgba(0,0,0,0.2) inset;
}

.nav-main.is-on > ul > li.current > a {
    color: rgb(75,75,75);
    background-color: rgb(255,153,0);
    box-shadow: 0 0 0 rgba(0,0,0,0) inset;
}

.nav-main .icon-home {
    display: block;
}

.nav-main li.active .icon-home,
.nav-main li.current .icon-home {
    background-position:-3748px -10px;
}

.nav-main li.active .icon-pen,
.nav-main li.current .icon-pen {
    background-position: -3694px -10px;
}

.nav-main.is-on li.current .icon-home {
    background-position: -3776px -10px;
}

.nav-main.is-on li.current .icon-pen {
    background-position: -3721px -10px;
}

.nav-main .mega-menu {
    position: absolute;
    background-color: transparent;
    padding-top: 1px;
    top: -999px;
    left: 10px;
    width: 1000px;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.3s 0.1s ease;
    -moz-transition: opacity 0.3s 0.1s ease;
    transition: opacity 0.3s 0.1s ease;
}

.lt-ie9 .nav-main .mega-menu {
    width: 1002px;
    left: 9px;
}

.nav-main .mega-menu > .inside {
    background-color: rgb(255,255,255);
    padding-top: 30px;
    padding-bottom: 30px;
    box-shadow: 0 12px 10px -10px rgba(0,0,0,0.7);
    min-height: 200px;
}

.lt-ie9 .nav-main .mega-menu > .inside {
    border-left: 1px solid rgb(243,243,243);
    border-right: 1px solid rgb(243,243,243);
    border-bottom: 1px solid rgb(243,243,243);
}

.lt-ie9 .nav-main .mega-menu {
    background-image: url("/preview/obo-bettermann/img/shadow_megamenu.png");
    background-position: center bottom;
    background-repeat: no-repeat;
    padding-bottom: 18px;
}

.nav-main > ul > li.active .mega-menu,
.nav-main > ul > li > a:focus .mega-menu,
.no-js .nav-main > ul > li:hover .mega-menu {
    top: 31px;
    opacity: 1;
    visibility: visible;
}

.mega-menu a:hover,
.mega-menu a:focus {
    text-decoration: underline;
    outline: 0;
    color: rgb(255,153,0);
}

.mega-menu .current > a {
    color: rgb(255,153,0);
}

.mega-menu .heading {
    margin: 0 20px 15px 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgb(185,185,185);
}

.mega-menu .heading h2,
.mega-menu .heading h3 {
    color: rgb(255,153,0);
    font-size: 14px;
    font-size: 1.4rem;
    margin: 0;
}

.mega-menu .heading h3 {
    font-weight: normal;
}

.mega-menu.worldwide .heading {
    margin-left: 0px;
    margin-right: 0px;
}
.mega-menu.worldwide .worldmap {
    float: left;
    margin-left: 20px;
    width: 400px;
}

.mega-menu.worldwide .flag-list {
    float: left;
    margin-right: 20px;
    width: 560px;
}

.mega-menu.worldwide .flag-list {
    width: 560px;
}

/* Nav Grid */

.nav-grid a {
    display: block;
}

.nav-grid ul {
    margin: 0;
    padding: 0;
}

.nav-grid .nav-submenu {
    float: left;
    width: 200px;
}

.nav-grid .nav-teaser {
    float: left;
    width: 800px;
}

.nav-grid .tab-content {
    width: 800px;
    float: right;
}

.nav-grid .tab-content .nav-teaser {
    float: none;
    width: auto;
}

.nav-grid ul li {
    display: inline-block;
    vertical-align: top;
    float: none;
    width: 160px;
    padding: 15px 0;
    margin: 0 20px;
    /*border-bottom: 1px solid rgb(185,185,185);*/
}

.nav-grid ul li img,
.nav-grid ul li span {
    display: block;
}

.nav-grid ul li img + span,
.nav-grid ul li span + span {
    margin-top: 15px;
}


.nav-grid ul li a {
    color: rgb(50,50,50);
}


.nav-grid .active > a {
    color: rgb(255,153,0);
}

#nav-overlay {
    display: none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(30,30,30,0.8);
    z-index: 50;
    opcacity: 0;
    -webkit-transition: opacity 0.3s 0.1s ease;
    -moz-transition: opacity 0.3s 0.1s ease;
    transition: opacity 0.3s 0.1s ease;
}

.lt-ie9 #nav-overlay {
    background-image: url("/preview/obo-bettermann/img/bg_overlay.png");
}

#nav-overlay.is-on {
    display: block;
    opacity: 1;
}



/* ==========================================================================
   Tab Widget
   ========================================================================== */

.tab-content > .tab-pane {
  display: none;
}

.tab-content > .active {
  display: block;
}

.fade {
  opacity: 0;
  -webkit-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear;
}

.fade.in {
  opacity: 1;
}


/* ==========================================================================
   Sitetools in Navigation Bar
   ========================================================================== */

.sitetools {
    float: left;
    border-bottom: 1px solid rgb(30,30,30);
    width: auto;
}

.sitetools ul {
    padding: 0;
    margin: 0;
}

.sitetools ul li {
    float: left;
    list-style-type: none;
}

.sitetools .nav-grid ul li {
    float: none;
}

.sitetools > ul > li > a {
    color: rgb(75,75,75);
    font-weight: bold;
    font-size: 13px;
    font-size: 1.3rem;
    display: block;
    padding: 7px 10px 6px 10px;
    min-height: 31px;
}

/* Worldwide */

.mega-menu.worldwide .heading {
    margin-left: 0px;
    margin-right: 0px;
}

.worldmap {
    float: left;
    margin-left: 20px;
    width: 400px;
}

.feature-box .worldmap {
    margin-left: 0;
    width: 360px;
    margin-top: 22px;
}

.feature-box .worldmap .heading h2,
.feature-box .worldmap .heading h3,
.section-fellow .flag-list .heading h2,
.section-fellow .flag-list .heading h3 {
    font-size: 13px;
    font-size: 1.3rem;
    margin: 0;
    color: rgb(255,153,0);
}

.fellow-teaser .flag-list .heading h3,
.feature-box .worldmap .heading h3 {
    font-weight: normal;
    text-transform: none;
}

.fellow-teaser .flag-list .heading {
    margin-bottom: 15px;
}

.feature-box .worldmap .heading {
    padding-bottom: 15px;
    border-bottom: 1px solid rgb(232,232,232);
}


.flag-list {
    float: left;
    margin-right: 20px;
    width: 560px;
}

.section-fellow .flag-list {
    float: none;
    width: auto;
    margin-right: 0;
}

.flag-list .panel {
    display: none;
}

.flag-list .panel.active {
    display: block;
}

.flag-list .panel ul {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 10px;
    -moz-column-gap: 10px;
    column-gap: 10px;
    margin: 0;
    padding: 0;
}

.flag-list .panel ul li {
    display: inline-block;
    width: 98%;
    float: none;
}

.no-csscolumns .flag-list .panel ul li {
    width: 180px;
}

.flag-list .panel ul li {
    position: relative;
    padding-left: 25px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.flag-list .panel ul li a {
    font-weight: normal;
    color: rgb(75,75,75);
    padding-left: 0px;
    display: inline;
}

.flag-list .panel ul li a:hover,
.flag-list .panel ul li a:focus {
    color: rgb(255,153,0);
}

.flag-list .flag {
    vertical-align: 0px;
    margin-right: 10px;
    border: 1px solid rgb(255,255,255);
    outline: 1px solid rgb(232,232,232);
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    display: block;
    position: absolute;
    left: 0;
    top: 13px;
    margin-top: -7px;
}

.flag-list .flag.flag-ch {
    width: 11px;
}

.flag-list  .heading + ul {
    margin-left: 0px;
}

.areaselector {
    position: relative;
    height: 260px;
    width: 360px;
    top: 0;
    left: 0;
}

.areaselector .img-world-map {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 360px;
    height: 260px;
}

.areaselector .img-world-map.active {
    display: block;
    z-index: 1;
}

.areaselector .img-world-map.hover {
    display: block;
    z-index: 2;
}

.worldwide .areaselector + .heading,
.feature-box .areaselector + .heading {
    border-bottom: 0;
    border-top: 1px solid rgb(185,185,185);
    padding-top: 20px;
    padding-bottom: 0;
    margin-right: 20px;
}

.feature-box .areaselector + .heading  {
    margin-right: 0;
    border-top: 1px solid rgb(232,232,232);
    margin-bottom: 10px;
}

.globalselector ul {
    margin: 0;
    padding: 0;
}

.globalselector ul li {
    border-right: 1px solid rgb(185,185,185);
    margin-right: 10px;
    display: inline-block;
}

.globalselector ul li:last-child {
    border-right: 0;
}

.globalselector ul li a {
    padding-left: 0;
    padding-top: 2px;
    padding-bottom: 2px;
    min-height: 0;
    margin-right: 10px;
    color: rgb(75,75,75);
}


/* ==========================================================================
   Global Search
   ========================================================================== */

.search {
    float: right;
    border-bottom: 1px solid rgb(30,30,30);
    border-left: 1px solid rgb(30,30,30);
    width: 200px;
}

.search form.has-focus {
    background-color: rgb(254,237,217);
}

.search input {
    background: transparent;
    border: 0;
    width: 144px;
    padding-top: 8px;
    padding-left: 10px;
    display: block;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-size: 1.3rem;
    border-radius: 0;
}


.search input:focus {
    outline: 0;
}

.search ::-webkit-input-placeholder {
   color: rgb(75,75,75);
   font-weight: bold;
}

.search :-moz-placeholder { /* Firefox 18- */
   color: rgb(75,75,75);
   font-weight: bold;
}

.search ::-moz-placeholder {  /* Firefox 19+ */
   color: rgb(75,75,75);
   font-weight: bold;
}

.search :-ms-input-placeholder {
   color: rgb(75,75,75);
   font-weight: bold;
}

.search input:focus::-webkit-input-placeholder {
   opacity: 0;
}

.search input:focus:-moz-placeholder { /* Firefox 18- */
   opacity: 0;
}

.search input:focus::-moz-placeholder {  /* Firefox 19+ */
   opacity: 0;
}

.search input:focus:-ms-input-placeholder {
   opacity: 0;
}

.search button {
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0;
    display: block;
    width: 31px;
    height: 31px;
    float: right;
}

.search button .icon {
    margin-left: 7px;
}

.search:hover button,
.search input:focus ~ button {
    background-color: rgb(75,75,75);
}
.search:hover button .icon-search,
.search input:focus ~ button .icon-search {
    background-position:-3640px -10px;
}

/* ==========================================================================
   Branding & Logo
   ========================================================================== */

.logo {
    float: right;
}

.logo a {
    display: block;
}

.branding .heading {
    margin-right: 200px;
    position: relative;
    height: 73px;
}

.branding .heading h1,
.branding .heading span {
    font-size: 32px;
    line-height: 1.1;
    color: rgb(50,50,50);
    margin: 0;
    padding: 0;
    font-weight: bold;
}

.branding .claim {
    background-image: url("/preview/obo-bettermann/img/building_connections.png");
    background-repeat: no-repeat;
    height: 25px;
    width: 256px;
    position: absolute;
    bottom: -7px;
    left: 0;
    margin: 0;
}

/* ==========================================================================
   Page Body
   ========================================================================== */

.section-body {
    margin-top: -110px;
}

.section-body > .wrapper > .inside {
    background-color: rgb(255,255,255);
    box-shadow: 0px 0px 12px rgba(0,0,0,0.1);
    padding-bottom: 20px;
    min-height: 780px;
}

/* ==========================================================================
   Footer
   ========================================================================== */

.footer {
    font-size: 11px;
    font-size: 1.1rem;
    padding-top: 30px;
    padding-bottom: 40px;
}

.footer ul {
    margin: 0 0 30px 0;
    padding: 0;
}

.footer ul li {
    list-style-type: none;
    color: rgb(115,115,115);
    margin: 5px 0;
}

.footer a {
    color: rgb(115,115,115);
    display: block;
}

.language-select .footer {
    color: rgb(115,115,115);
}

.footer a:focus,
.footer a:hover {
    color: rgb(255,153,0);
}

.footer ul li:first-child a {
    font-weight: bold;
}

.footer .col {
    width: 200px;
    padding: 0 20px;
}

.footer .phone {
    font-size: 15px;
    font-size: 1.5rem;
    font-weight: bold;
    display: block;
}

.footer li.contact a,
.footer li.newsletter a  {
    padding-left: 40px;
    position: relative;
}

.footer li.contact a .icon,
.footer li.newsletter a .icon  {
    position: absolute;
    left: 0px;
}

.footer .social-media li a {
    float: left;
    display: block;
    margin-right: 8px;
    margin-bottom: 8px;
}

/* ==========================================================================
   Grids, Cols
   ========================================================================== */


.row:before,
.row:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.row:after {
    clear: both;
}

.row {
    *zoom: 1;
}

.col {
    float: left;
}

.col-1-2 {
    width: 500px;
}

.col-1-3 {
    width: 33.3333333333%;
}

.col-1-4 {
    width: 250px;
}

.col-1-5 {
    width: 200px;
}

.col-2-4 {
    width: 335px;
}

.col-2-5 {
    width: 400px;
}

.col-3-5 {
    width: 600px;
}

.col-content-1-2 {
    width: 335px;
}

.col-content-1-5 {
    width: 20%;
}

.col-content-2-5 {
    width: 40%;
}

.col-content-3-5 {
    width: 60%;
}

.col-content-1-8 {
    width: 12.5%;
}

.col-content-2-8 {
    width: 25%;
}

.col-content-5-8 {
    width: 62.5%;
}

/* ==========================================================================
   Toolbar
   ========================================================================== */

.section-toolbar {
    border-bottom: 1px solid rgb(185,185,185);
    min-height: 49px;
}

/* ==========================================================================
   Subnavigation horizontal
   ========================================================================== */

.nav-sub-bar {
    float: left;
}

.nav-sub-bar ul {
    margin: 0;
    padding: 0;
}

.nav-sub-bar ul li {
    list-style-type: none;
    float: left;
}

.nav-sub-bar ul li a {
    display: block;
    padding: 15px 20px 15px 52px;
    font-size: 14px;
    font-size: 1.4rem;
    color: rgb(75,75,75);
    position: relative;
}

.nav-sub-bar ul li a:focus,
.nav-sub-bar ul li a:hover {
    background-color: rgb(243,243,243);
    text-decoration: none;
}

.nav-sub-bar ul li.current a {
    background-color: rgb(232,232,232);
    box-shadow: 0px 1px 6px rgba(0,0,0,0.2) inset;
}

.nav-sub-bar .icon {
    position: absolute;
    display: block;
    left: 20px;
    top: 50%;
    margin-top: -11px;
}

.nav-sub-bar ul li:first-child a {
    padding-left: 57px;
}

.nav-sub-bar .icon-overview {
    margin-top: -8px;
}

.nav-sub-bar .icon-file {
    left: 25px;
}

.nav-sub-bar .icon-book {
    margin-top: -8px;
}

/* ==========================================================================
   Tools
   ========================================================================== */

.tools {
    float: right;
    margin-top: 10px;
}

.tools ul {
    margin: 0;
    padding: 0;
}

.tools ul:before,
.tools ul:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.tools ul:after {
    clear: both;
}

.tools ul {
    *zoom: 1;
}

.tools ul li {
    list-style-type: none;
    float: left;
    border-left: 1px solid rgb(185,185,185);
    margin-right: 10px;
}

.tools ul li:first-child {
    border-left: 0;
}

.tools ul li a {
    display: block;
    height: 28px;
    padding: 5px 0px;
    position: relative;
    padding-left: 35px;
    color: rgb(75,75,75);
    font-weight: bold;
    max-width: 0px;
    overflow: hidden;
    -webkit-transition: max-width 0.25s ease 0.1s;
    -moz-transition: max-width 0.25s ease 0.1s;
    -ms-transition: max-width 0.25s ease 0.1s;
    transition: max-width 0.25s ease 0.1s;
}

.lt-ie9 .tools ul li a {
    max-width: none;
    width: 20px;
}

.tools ul li a:focus,
.tools ul li a:hover {
    text-decoration: none;
    max-width: 150px;
    color: rgb(255,153,0);
}

.lt-ie9 .tools ul li a:focus,
.lt-ie9 .tools ul li a:hover  {
    max-width: none;
    width: auto;
}

.tools ul li:first-child a {
    border-left: 0;
}

.tools .icon {
    position: absolute;
    left: 10px;
}

.tools .link-text {
    display: block;
    opacity: 0;
    -webkit-transition: opacity 0.15s ease 0.2s;
    -moz-transition: opacity 0.15s ease 0.2s;
    -ms-transition: opacity 0.15s ease 0.2s;
    transition: opacity 0.15s ease 0.2s;
}

.tools ul li a:focus .link-text,
.tools ul li a:hover .link-text {
    display: block;
    opacity: 1;
}

.tools a:focus .link-text,
.tools a:hover .link-text {
    overflow: visible;
    opacity: 1;
    max-width: 100px;
}


/* ==========================================================================
   Breadcrumbs
   ========================================================================== */

.section-breadcrumbs {
    border-bottom: 1px solid rgb(185,185,185);
    padding-left: 10px;
}

.section-breadcrumbs ul {
    margin: 0;
    padding: 0;
    overflow: auto;
}

.section-breadcrumbs ul li {
    list-style-type: none;
    float: left;
    background-image: url("/preview/obo-bettermann/img/icon-seperator.png");
    background-repeat: no-repeat;
    background-position: right center;
    padding-right: 10px;
}

.section-breadcrumbs ul li:last-child {
    background-image: none;
    padding-right: 0;
}

.section-breadcrumbs ul li a {
    display: block;
    padding: 6px 10px;
    font-size: 11px;
    font-size: 1.1rem;
    color: rgb(75,75,75);
    font-weight: bold;
}
.section-breadcrumbs ul li a:hover,
.section-breadcrumbs ul li a:focus {
    color: rgb(255,153,0);
}

/* ==========================================================================
   Stage
   ========================================================================== */

.section-stage {
    height: 356px;
    -webkit-transition: height 0.1s 0s ease;
    -moz-transition: height 0.1s 0s ease;
    transition: height 0.1s 0s ease;
}

.stage .slides,
.slider .slides {
    margin: 0;
    padding: 0;
    width: 100%;
    zoom: 1;
    list-style-type: none;
}

.stage-item {
    position: relative;
}

.stage-item .stage-figure {
    width: 1000px;
    height: 356px;
    overflow: hidden;
}

.stage-item .stage-figure img {
    display: block;
    width: 100%;
}

.feature-box {
    position: absolute;
    background-color: rgb(255,255,255);
    width: 400px;
    min-height: 300px;
    max-height: 500px;
    overflow: auto;
    top: 250px;
    padding: 20px;
    z-index: 3;
    line-height: 1.4;
    -webkit-transition: top 0.1s 0s ease;
    -moz-transition: top 0.1s 0s ease;
    transition: top 0.1s 0s ease;
}

.language-select .feature-box {
    max-height: inherit;
}

.section-expository {
    position: relative;
    margin-bottom: 20px;
    padding-bottom: 6px;
    background-image: url("/preview/obo-bettermann/img/shadow_promotional.png");
    background-position: bottom center;
    background-repeat: no-repeat;
}

.section-expository .feature-box {
    top: 0;
    min-height: 0;
    width: 500px;
}

.feature-box .teaser:last-child {
    margin-bottom: 0;
}

.feature-box .segment {
    border-bottom: 1px solid rgb(185,185,185);
    padding: 15px 0;
}

.feature-box .segment:first-child {
    padding-top: 0;
}

.feature-box .segment .icon,
.feature-box .segment .icon + .inside,
.feature-box .segment .inside + .inside {
    float: left;
}

.feature-box .segment .icon {
    margin-top: 3px;
}

.feature-box .segment .icon + .inside {
    margin-left: 20px;
}

.feature-box .segment .inside + .inside {
    margin-left: 30px;
}

.feature-box .segment .inside p {
    margin: 0;
}

.feature-box .segment .inside .contact {
    color: rgb(75,75,75);
    font-size: 1.385em;
    font-weight: bold;
}

.feature-box .segment .inside .contact a {
    color: rgb(75,75,75);
}

.feature-box .segment .inside .contact a:hover {
    color: rgb(75,75,75);
    text-decoration: underline;
}

.feature-box .segment .inside .contact + p {
    margin-top: 1em;
}

.feature-box .segment p:last-child {
    margin-bottom: 0;
}

.feature-box .teaser + .teaser {
    margin-top: 20px;
}

.section-fellow {
    padding: 20px 0px 40px 400px;
    margin: 0 0 20px;
    background-image:
        url("/preview/obo-bettermann/img/shadow_main-feature.png"),
        url("/preview/obo-bettermann/img/shadow_promotional.png");
    background-position: 400px 0px, bottom center;
    background-repeat: no-repeat;
    min-height: 400px;
    position: relative;
}

.language-select .section-fellow {
    min-height: 400px;
    margin: 0;
}

.lt-ie9 .section-fellow {
    background-image: url("/preview/obo-bettermann/img/shadow_main-feature.png");
    background-position: 400px 0px;
}


.section-fellow.no-shadow {
    background-image:  url("/preview/obo-bettermann/img/shadow_main-feature.png");
    padding-bottom: 20px;
}

.disclaimer {
    width: 300px;
    position: absolute;
    bottom: 2.5em;
    left: 2em;
    z-index: 3;
}

.disclaimer.wysiwyg p {
    font-size: 11px;
    font-size: 1.1rem;
}

/* ==========================================================================
   Slider
   ========================================================================== */

.slider {
    position: relative;
    zoom: 1;
    line-height: 0;
}

.slider .slides:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.slider .flex-control-nav {
    margin: 0;
    padding: 6px 25px;
    position: absolute;
    right: 0;
    list-style-type: none;
    display: block;
    height: auto;
    text-align: right;
    background-color: rgba(0,0,0,0.5);
    z-index: 2;
}

.lt-ie9 .slider .flex-control-nav {
    background-image: url("/preview/obo-bettermann/img/bg_overlay_50.png");
}

.slider .flex-control-nav li {
    display: inline-block;
    margin: 0 6px;
    width: 14px;
    height: 14px;
    zoom: 1;
    *display: inline;
    text-align: left;
}

.slider .flex-control-paging li a {
    width: 14px;
    height: 14px;
    display: block;
    text-indent: -9999px;
    background: rgb(232,232,232);
    cursor: pointer;
    overflow: hidden;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    -o-border-radius: 7px;
    border-radius: 7px;
    -moz-box-shadow: inset 2px 2px 3px rgba(0,0,0,0.7);
    -webkit-box-shadow: inset 2px 2px 3px rgba(0,0,0,0.7);
    -o-box-shadow: inset 2px 2px 3px rgba(0,0,0,0.7);
    box-shadow: inset 2px 2px 3px rgba(0,0,0,0.7);
}

.slider .flex-control-paging li a:hover,
.slider .flex-control-paging li a.flex-active {
    background: rgb(243,148,24);
    -moz-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.5);
    -webkit-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.5);
    -o-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.5);
    box-shadow: inset 1px 1px 1px rgba(0,0,0,0.5);
}

.slider .flex-direction-nav {
    position: absolute;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 0;
    top: 50%;
    left: 0;
    margin-top: -30px;
    z-index: 2;
    display: none;
}

.slider .flex-direction-nav li {
    display: inline-block;
    zoom: 1;
    *display: inline;
    height: 60px;
    width: 40px;
    float: right;
}

.slider .flex-direction-nav li:first-child {
    float: left;
}

.slider .flex-direction-nav li a {
    display: block;
    height: 60px;
    width: 40px;
    text-indent: -9999px;
    cursor: pointer;
    background-image: url(/preview/obo-bettermann/img/slider_navigation.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.slider .flex-direction-nav li a:focus {
    outline: 0;
}

.slider .flex-direction-nav li:first-child a {
    background-position: left center;
}

.slider .flex-pauseplay {
    position: absolute;
    right: 6px;
    width: 14px;
    height: 14px;
    display: inline-block;
    z-index: 3;
}

.slider .flex-pause,
.slider .flex-play {
    display: block;
    width: 14px;
    height: 14px;
    text-indent: -9999px;
    cursor: pointer;
    background-image: url(/preview/obo-bettermann/img/slider_pause-play.png);
    background-repeat: no-repeat;
}

.slider .flex-pause {
    background-position: top center;
}

.slider .flex-play {
    background-position: bottom center;
}

/* ==========================================================================
   Stage Slider
   ========================================================================== */

.stage-slider .slides {
    width: 1000px;
    height: 356px;
}

.stage-slider .stage-item {
    background-color: rgb(0,0,0);
}

.stage-slider .fp-controls,
.stage-slider .fp-time {
    display: none;
}

.stage-slider:hover .flex-direction-nav,
.content-slider:hover .flex-direction-nav {
    display: block;
}

.stage-slider .flex-control-nav {
    width: 600px;
    bottom: 0;
}

.stage-slider .flex-pauseplay {
    bottom: 6px;
}

/* ==========================================================================
   Stage when video is playing
   ========================================================================== */

.section-stage.video-is-playing {
    height: 562px;
}

.section-stage.video-is-playing .stage-slider .slides {
    height: 562px;
}

.section-stage.video-is-playing .stage-item .stage-figure {
    height: 562px;
}

.section-stage.video-is-playing .feature-box {
    top: 562px;
}

.section-stage.video-is-playing .stage-slider .flex-control-nav {
    width: 1000px;
}

.section-stage.video-is-playing .stage-slider .fp-controls,
.section-stage.video-is-playing .stage-slider .fp-time {
    display: block;
}

/* ==========================================================================
   Lists
   ========================================================================== */

.nav-list ul {
    margin: 0;
    padding: 0;
}

.nav-list ul li {
    position: relative;
}

.nav-list ul li a {
    display: block;
    font-size: 14px;
    font-size: 1.4rem;
    color: rgb(75,75,75);
    padding: 5px 0;
    border-bottom: 1px solid rgb(185,185,185);
}

.nav-list ul li a:hover,
.nav-list ul li a:focus {
    color: rgb(255,153,0);
}

.nav-list ul li a:hover .linkdetails {
    text-decoration: none;
}

.nav-list ul li a:after {
    content: url("/preview/obo-bettermann/img/icon-arrow-right.png");
    display: block;
    position: absolute;
    right: 5px;
    top: 50%;
    margin-top: -10px;
}

.nav-list ul li a .linkdetails {
    font-size: 11px;
    font-size: 1.1rem;
    display: block;
    margin-top: 2px;
}

.section-fellow .nav-list {
    margin: 0 20px;
}

/* ==========================================================================
   Teaser Items
   ========================================================================== */

.teaser {
    margin-bottom: 20px;
}

.teaser .title p {
    font-size: 11px;
    font-size: 1.1rem;
    text-transform: uppercase;
    font-weight: bold;
    color: rgb(255,153,0);
}

.teaser .subtitle p {
    font-weight: bold;
    margin-bottom: 0;
}

.teaser .subtitle + .more {
    margin-top: 5px;
}

.teaser .heading h2 {
    font-size: 23px;
    font-size: 2.3rem;
    color: rgb(255,153,0);
    margin-top: 10px;
    margin-bottom: 10px;
}

.teaser .heading h2 span {
    display: block;
}

.teaser .heading h3 {
    font-size: 13px;
    font-size: 1.3rem;
    margin-bottom: 10px;
}

.teaser .heading h4 {
    margin-top: 0;
    color: rgb(75,75,75);
    font-size: 1.154em;
    margin-bottom: 1em;
}

.teaser a.more-inline,
.teaser .more a:not(.button) {
    color: rgb(255,153,0);
    background-image: url("/preview/obo-bettermann/img/icon-arrow-right.png");
    background-repeat: no-repeat;
    background-position: right 6px;
    display: inline-block;
    padding-right: 10px;
}

.teaser .more a.button {
    display: inline-block;
}

.lt-ie9 .teaser a.more-inline,
.lt-ie9 .teaser .more a {
    color: rgb(255,153,0);
    background-image: url("/preview/obo-bettermann/img/icon-arrow-right.png");
    background-repeat: no-repeat;
    background-position: right 6px;
    display: inline-block;
    padding-right: 10px;
}

.lt-ie9 .teaser .more a.button {
    background-image: url("/preview/obo-bettermann/img/bg_button.png");
    padding: 4px 12px 4px 32px;

}

.teaser figure {
    margin-bottom: 15px;
    position: relative;
}

.teaser.video figure a {
    display: block;
}

.teaser.video figure a:after {
    content: url("/preview/obo-bettermann/img/video_play.png");
    position: absolute;
    top: 50%;
    left: 50%;
    height: 40px;
    margin: -20px 0 0 -20px;
}

.teaser figure img {
    max-width: 100%;
}

.teaser .meta {
    font-size: 0.85em;
    color: rgb(115,115,115);
    margin-bottom: .2em;
    display: block;
}

.fellow-teaser {
    padding: 20px 20px 40px 420px;
}

.fellow-teaser .heading h3 {
    margin: 0 0 15px;
    padding: 0 0 15px;
    color: rgb(255,153,0);
    border-bottom: 1px solid rgb(232,232,232);
    text-transform: uppercase;
    font-size: 0.85em;
}

.teaser .figure-third {
    width: 210px;
}

.fellow-teaser .teaser .figure-third {
    width: 160px;
}

.teaser .figure-third + .teaser-text {
    margin-left: 250px;
}

.fellow-teaser .teaser .figure-third + .teaser-text {
    margin-left: 180px;
}

.fellow-teaser .teaser {
    border-bottom: 1px solid rgb(232,232,232);
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.fellow-teaser .teaser:last-child {
    border-bottom: 0;
    margin-bottom: 0;
}

.lt-ie9 .fellow-teaser .teaser.last-child {
    border-bottom: 0;
    margin-bottom: 0;
}

/* All teaser elements within the grid */

.section-fellow > .row > .col > .teaser,
.section-teasergroup > .row > .col > .teaser,
.section-teasergroup > .row > .col > .row > .col > .teaser  {
    border-right: 1px solid rgb(185,185,185);
}

/* Teaser 1-2 high */
.section-teasergroup > .row > .col > .row > .teaser {
    border-right: 1px solid rgb(185,185,185);
    min-height: 450px;
}

.col-main .section-teasergroup > .row > .col {
    margin-left: 40px;
}

.col-main .section-teasergroup > .row > .col-1-4 {
    width: 210px;
}

.col-main .section-teasergroup > .row > .col-1-2 {
    width: 460px;
}

.col-main .section-teasergroup > .row > .col .teaser {
    border: 0;
    padding: 0;
}

.col-main .section-teasergroup > .row > .col:first-child {
    margin-left: 0;
}

.section-fellow > .row > .col:last-child > .teaser,
.no-line > .row > .col > .teaser,
.section-teasergroup > .row > .col:last-child > .teaser,
.section-teasergroup > .row > .col > .row > .col:last-child > .teaser {
    border-right: 0;
}

.lt-ie9 .section-fellow > .row > .col.last-child > .teaser,
.lt-ie9 .no-line > .row > .col > .teaser,
.lt-ie9 .section-teasergroup > .row > .col.last-child > .teaser,
.lt-ie9 .section-teasergroup > .row > .col > .row > .col.last-child > .teaser {
    border-right: 0;
}

.col .teaser {
    padding: 0 20px;
}

.group-title {
    padding: 0 20px;
}

.group-title h3 {
    margin: 0 0 20px;
    color: rgb(255,153,0);
    text-transform: uppercase;
    font-size: 0.846em;
}

.section-pagecontent .section-teasergroup .col {
    position: relative;
}

.section-pagecontent .section-teasergroup .col:after {
    content:"";
    width: 1px;
    height: 100%;
    position: absolute;
    right: -20px;
    top: 0;
    border-right: 1px solid rgb(185,185,185);
}

.section-pagecontent .section-teasergroup .col:last-child:after {
    content: none;
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.button {
    background-color: rgb(115,115,115);
    background-image: url("/preview/obo-bettermann/img/bg_button.png");
    background-repeat: repeat-x;
    background-position: left center;
    color: rgb(255,255,255);
    padding: 4px 12px 4px 32px;
    border: 1px solid rgb(115,115,115);
    border-radius: 4px;
    font-size: 12px;
    font-size: 1.2rem;
}

.lt-ie9 .button {
    padding: 4px 12px 4px 12px;
}

.button:after {
    content: url("/preview/obo-bettermann/img/icon-arrow-right.png");
    margin-left: 20px;
}

input.button {
    padding: 4px 12px 4px 12px;
}

.button:hover:after {
    content: url("/preview/obo-bettermann/img/icon-arrow-right-active.png");
}

.button:hover {
    background-color: rgb(255,153,0);
    border: 1px solid rgb(243,148,24);
    text-decoration: none;
}

.button.light {
    background-color: rgb(219,219,219);
    background-image: url("/preview/obo-bettermann/img/bg_button_light.png");
    border: 1px solid rgb(215,215,215);
    color: rgb(75,75,75);
    font-size: 1.15em;
    font-weight: bold;
    padding: 4px 12px 4px 12px;
}

.button.light:hover {
    background-color: rgb(229,140,33);
    border: 1px solid rgb(207,135,0);
    color: rgb(255,255,255);
}

.button.light:after {
    content: "";
    margin-left: 0;
}

.teaser .more a.button {
    color: rgb(255,255,255);
}

/* ==========================================================================
   Page Content
   ========================================================================== */

.section-breadcrumbs + .section-pagecontent {
    margin-top: 30px;
}

.col-main {
    float: right;
    width: 750px;
    padding: 0 20px;
    margin-bottom: 10px;
}
.col-aside {
    float: left;
    width: 250px;
    padding: 0 20px;
}

/* ==========================================================================
   Subnavigation in Sidebar
   ========================================================================== */

.nav-back {
    margin-top: 5px;
}

.nav-back .button {
    padding: 4px 32px 4px 12px;
    color: rgb(255,255,255);
}

.lt-ie9 .nav-back .button {
    padding: 4px 12px 4px 12px;
}

.nav-back .button::before {
    content: url("/preview/obo-bettermann/img/icon-arrow-left.png");
    margin-right: 20px;
}

.nav-back .button:focus::before,
.nav-back .button:hover::before {
    content: url("/preview/obo-bettermann/img/icon-arrow-left-active.png");
}

.nav-back .button::after {
    content: none;
}

.nav-subnav {
    margin-top: 42px;
    margin-bottom: 20px;
}

.nav-back + .nav-subnav {
    margin-top: 22px;
}

.nav-subnav ul {
    margin: 0;
    padding: 0;
}

.nav-subnav ul li {
    list-style-type: none;
}

.nav-subnav ul li a {
    padding: 7px 0px;
    display: block;
    border-bottom: 1px solid rgb(185,185,185);
    color: rgb(75,75,75);
}

.nav-subnav ul li a:hover,
.nav-subnav ul li a:focus {
    color: rgb(255,153,0);
}

.nav-subnav > ul > li:first-child > a {
    border-top: 1px solid rgb(185,185,185);
}

.nav-subnav > ul > li > a {
    font-weight: bold;
}

.nav-subnav > ul > li > ul > li > a {
    padding-left: 10px;
    background-image: url("/preview/obo-bettermann/img/icon-listbullet.png");
    background-repeat: no-repeat;
    background-position: left center;
}

.nav-subnav > ul > li > ul {
    display: none;
}

.nav-subnav > ul > li.open > ul {
    display: block;
}

.nav-subnav .open > a,
.nav-subnav .active > a {
    color: rgb(255,153,0);
}

/* ==========================================================================
   Page Content
   ========================================================================== */

.col-main .heading {

}

.col-main .heading h1,
.col-main .heading h2 {
    margin-top: 0;
    color: rgb(255,153,0);
    font-size: 1.5em;
}

.col-main .heading .meta {
    float: right;
    margin-top: 0.6em;
    font-size: 0.846em;
}

.col-main .heading p {
    margin: 0;
    font-weight: bold;
}

.col-main .heading h3 {
    margin-top: 0;
    padding: 10px 0;
    color: rgb(255,153,0);
    border-top: 1px solid rgb(232,232,232);
    border-bottom: 1px solid rgb(232,232,232);
    text-transform: uppercase;
    font-size: 0.846em;
}

.group {
    margin-bottom: 20px;
}

.group h4 {
    margin: 0 0 1em;
    color: rgb(75,75,75);
    font-size: 1.154em;
}

.group h5 {
    margin-top: 0;
    padding: 10px 0;
    color: rgb(255,153,0);
    border-top: 1px solid rgb(232,232,232);
    border-bottom: 1px solid rgb(232,232,232);
    text-transform: uppercase;
    font-size: 0.846em;
}

.group h6 {
    margin: 0 0 1em;
    font-size: 1em;
}

.group.underlined {
    border-bottom: 1px solid rgb(185,185,185);
    padding-bottom: 20px;
}

.group.overlined {
    border-top: 1px solid rgb(185,185,185);
    padding-top: 10px;
}

.teaser.underlined {
    border-bottom: 1px solid rgb(232,232,232);
    padding-bottom: 10px;
}

.article.underlined {
    padding-bottom: 20px;
}

.article figure {
    max-width: 66%;
}

.article figure img {
    max-width: 100%;
}

.article figure.pull-right {
    margin-left: 20px;
}

.pro-list ul {
    margin: 0;
    padding: 0;
    font-weight: bold;
    list-style-type: none;
}

.pro-list li {
    margin-bottom: 1em;
    padding: 0 0 0 23px;
    background: transparent url("/preview/obo-bettermann/img/icon-plus.png") left 2px no-repeat;
}

.pro li:last-child {
    margin-bottom: 0;
}

/* ==========================================================================
   Content Slider
   ========================================================================== */

.content-slider .slides {
    width: 710px;
    height: 538px;
    overflow: hidden;
}

.content-slider .content-item {
    display: none;
}

.content-slider.slider-low .slides {
    width: 710px;
    height: 251px;
    overflow: hidden;
}

.content-slider .flex-control-nav {
    width: auto;
    top: 476px;
    width: 100%;
}

.content-slider .imagemask {
    width: 710px;
    height: 502px;
    overflow: hidden;
}

.slider-low .imagemask {
    height: 251px;
}

.slider-low .flex-control-nav {
    top: 225px
}

.content-slider figure img {
    display: block;
    width: 100%;
}

.content-slider .flex-pauseplay {
    top: 482px;
}

.slider-low .flex-pauseplay {
    top: 231px;
}

.col-main .silder .figure-article {
    margin-bottom: 0;
}

.col-main .silder figcaption {
    height: 20px;
}

.col-main .slider figcaption p {
    line-height: 1.4;
}

.content-slider .download {
    position: absolute;
    top: 476px;
    left: 0px;
    font-size: 0.85em;
    color: rgb(255,255,255);
    height: 26px;
    width: 100%;
    background-color: rgba(0,0,0,0.5);
    line-height: 1;
    padding: 8px;
 }

/* ==========================================================================
   Figures
   ========================================================================== */

.fp-context-menu{display: none;}

.wysiwyg + .figure-article {
    margin-top: 20px;
}

.figure-article figcaption,
.gallery figcaption  {
    margin-top: 10px;
    font-size: 11px;
    font-size: 1.1rem;
    color: rgb(115,115,115);
}

.gallery figure {
    width: 210px;
    float: left;
    margin-left: 40px;
}

.gallery figure:first-child {
    margin-left: 0;
}

.grid figure img,
.gallery figure img {
    max-width: 100%;
}

.one-third,
.one-third img {
    width: 210px;
}

.two-third,
.two-third img {
    width: 460px;
}

.one-half,
.one-half img {
    width: 350px;
}

.two-third.pull-right,
.one-third.pull-right,
.one-half.pull-right {
    margin: 0 0 5px 20px;
}

.two-third.pull-left,
.one-third.pull-left,
.one-half.pull-left {
    margin: 0 20px 5px 0;
}

.two-third,
.one-half figcaption p,
.one-third figcaption p {
    margin-bottom: 0;
}

/* ==========================================================================
   Grid
   ========================================================================== */

.grid figure img {
    margin-bottom: 10px;
    border: 1px solid rgb(185,185,185);
}

.grid ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.grid ul li,
.columns ul {
    display: inline-block;
    margin-right: 40px;
    margin-bottom: 30px;
    vertical-align: top;
    width: 210px;
}

.grid ul li.last-child,
.columns ul.last-child {
    margin-right: 0;
}

.grid ul li p {
    margin: 0;
}

.grid ul li:nth-child(3n),
.columns ul:last-child {
    margin-right: 0;
}

.grid .product-list li {
    border-bottom: 1px solid rgb(185,185,185);
}

.grid .product-list figure img {
    float: left;
    margin-right: 10px;
}

/* ==========================================================================
   Content Filter
   ========================================================================== */

.tabs ul {
    margin: 0;
    padding: 0;
    float: left;
    width: 100%;
    list-style-type: none;
    border-bottom: 1px solid rgb(185,185,185);
}

.tabs li {
    display: block;
    float: left;
    cursor: pointer;
    margin: 0;
}

.tabs li a {
    color: rgb(30,30,30);
    text-decoration: none;
    display: block;
    padding: 6px 18px;
}

.tabs li.active a,
.tabs li.active:hover a {
    background-color: rgb(232,232,232);
    box-shadow: 0px 1px 6px rgba(0,0,0,0.2) inset;
    cursor: default;
}

.tabs li:hover a {
    background-color: rgb(243,243,243);
}

.search-content {
    float: right;
    border: 1px solid rgb(185,185,185);
    border-top: 0;
    width: 350px;
}

.search-content input {
    background: transparent;
    border: 0;
    width: 306px;
    min-height: 29px;
    padding-left: 10px;
    display: block;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-size: 1.3rem;
}

.search-content input:focus {
    background-color: rgb(254,237,217);
    outline: 0;
}

.search-content ::-webkit-input-placeholder {
   color: rgb(75,75,75);
}

.search-content :-moz-placeholder { /* Firefox 18- */
   color: rgb(75,75,75);
}

.search-content ::-moz-placeholder {  /* Firefox 19+ */
   color: rgb(75,75,75);
}

.search-content :-ms-input-placeholder {
   color: rgb(75,75,75);
}

.search-content input:focus::-webkit-input-placeholder {
   opacity: 0;
}

.search-content input:focus:-moz-placeholder { /* Firefox 18- */
   opacity: 0;
}

.search-content input:focus::-moz-placeholder {  /* Firefox 19+ */
   opacity: 0;
}

.search-content input:focus:-ms-input-placeholder {
   opacity: 0;
}

.search-content button {
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0;
    display: block;
    width: 31px;
    height: 31px;
    float: right;
}

.search-content button .icon {
    margin-left: 7px;
}

.search-content:hover button,
.search-content input:focus ~ button {
    background-color: rgb(75,75,75);
}
.search-content:hover button .icon-search,
.search-content input:focus ~ button .icon-search {
    background-position:-3640px -10px;
}

.toggle-content {
    visibility: hidden;
    height: 0;
    margin-bottom: 0;
    overflow: hidden;
}

.toggle-content.active {
    visibility: visible;
    height: auto;
    margin-bottom: 20px;
}

.toggle-content .adr {
    margin-bottom: 10px;
}

/* ==========================================================================
   map
   ========================================================================== */

.map {
    width: 710px;
    height: 502px;
}

/* ==========================================================================
   forms
   ========================================================================== */

.form fieldset {
    padding: 30px 0;
}

.form fieldset:first-child {
    padding-top: 0;
}

.form fieldset.col-content-1-2:first-child {
    padding-top: 30px;
}

.form fieldset.underlined {
    border-bottom: 1px solid rgb(185,185,185);
}

.form fieldset.overlined {
    border-top: 1px solid rgb(185,185,185);
}

.form .field {
    margin-top: 10px;
}

.form .field:first-child,
.form .field.first-child {
    margin-top: 0;
}

.form .field.event-date:first-child,
.form .field.event-date:first-child {
    margin-top: 5px;
}

.form .field.event-date label {
    font-weight: bold;
}

.form .field.event-date .wysiwyg {
    padding-left: 20px;
}

.form .heading h3 {
    margin-bottom: 0;
}

.form .order-field {
    padding: 15px 10px;
    border-bottom: 1px solid rgb(232,232,232);
    position: relative;
}

.form .order-field.active {
    background-color: rgb(243,243,243);
}

.form .heading .legend {
    font-weight: bold;
    font-size: 1.2em;
    margin-bottom: 15px;
}

.form .field label,
.form .field .label {
    display: block;
    margin-bottom: 2px;
}

.form .field input + label {
    display: inline;
}

.form .field input[type="radio"],
.form .field input[type="checkbox"] {
    margin-right: 5px;
    margin-left: 20px;
}

.form .field input:first-of-type,
.form .field input.first-child {
    margin-left: 0;
}

.form select,
.form textarea,
.form input[type="text"] {
    width: 100%;
}

.form select,
.form textarea,
.form input[type="text"] {
    border: 1px solid rgb(185,185,185);
}

.form select {
    padding: 1px;
}

.form .required:after {
    content: " *";
    color: rgb(255,153,0);
}

.form input[type="text"].width-20 {
    width: 20%;
}

.form input[type="text"].width-79 {
    width: 79%;
}

.form input[type="text"].width-49,
.form input[type="text"].width-50 {
    width: 49%;
}

.form input[type="text"].width-20 + input[type="text"].width-79,
.form input[type="text"].width-79 + input[type="text"].width-20,
.form input[type="text"].width-49 + input[type="text"].width-50,
.form input[type="text"].width-50 + input[type="text"].width-49 {
    margin-left: 1%;
}

.form input[type="text"].width-20,
.form input[type="text"].width-79,
.form input[type="text"].width-49,
.form input[type="text"].width-50 {
    float: left;
}

.form .validate-error {
    color: #ff0000;
}

.form .validate-error input[type="text"],
.form .validate-error select {
    border-color: #ff0000;
}

.product-image {
    float: left;
    margin-right: 15px;
    border: 1px solid rgb(185,185,185);
}

.product-volume {
    position: absolute;
    bottom: 15px;
    right: 10px;
}

.product-volume label {
    color: rgb(255,153,0);
    margin-right: 5px;
}

.product-volume input.volume {
    width: 50px;
    text-align: center;
}

.panel-list {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.panel-item {
    display: block;
    color: rgb(75,75,75);
    padding: 5px 5px 5px 0;
    border-bottom: 1px solid rgb(185,185,185);
}

.panel-item .col-content-1-5,
.panel-item .col-content-2-5 {
    padding-left: 10px;
}

.panel-item .col:first-child {
    padding: 0;
}

.panel-item:hover {
    text-decoration: none;
    background-color: rgb(243,243,243);
}

.panel-item figure {
    margin-right: 10px;
}

.panel-list li:first-child .panel-item {
    border-top: 1px solid rgb(185,185,185);
}

.panel-list .panel-list li .panel-item {
    border-top: 0;
}

.panel-list .panel-list li:last-child .panel-item {
    border-bottom: 0;
}

.toggle-accordion {
    border-bottom: 1px solid rgb(185,185,185);
}

.toggle-accordion .inside {
    padding: 15px 0;
}

/* ==========================================================================
   List styles sitemap
   ========================================================================== */

.nav-sitemap ul {
    margin: 0;
    padding: 0;
}

.nav-sitemap ul li {
    list-style-type: none;
}

.nav-sitemap ul li a {
    padding: 8px 0px;
    display: block;
    color: rgb(75,75,75);
}

.nav-sitemap ul li a:hover {
    color: rgb(255,153,0);
    text-decoration: none;
}
.nav-sitemap ul li a:hover:before {
    background-color: rgb(255,153,0);
}

.nav-sitemap > ul > li:first-child > a {
    border-top: 1px solid rgb(232,232,232);
}

/* Level 1 */
.nav-sitemap > ul > li > a {
    font-weight: bold;
    border-bottom: 1px solid rgb(232,232,232);
    font-size: 15px;
    font-size: 1.5rem;
}
.nav-sitemap > ul > li > ul {
    border-bottom: 1px solid rgb(232,232,232);
    padding-bottom: 20px;
}

/* Level 2 */
.nav-sitemap > ul ul > li > a {
    padding-top: 6px;
    padding-bottom: 6px;
    padding-left: 15px;
    position: relative;
}
.nav-sitemap > ul ul > li > a:before {
    content: "";
    display: inline-block;
    position: absolute;
    left: 3px;
    top: 1em;
    width: 3px;
    height: 3px;
    background-color: rgb(75,75,75);
    border-radius: 2px;
}
.nav-sitemap > ul > li > ul > li > a {
    font-weight: bold;
}

/* Level 3 */
.nav-sitemap > ul ul ul > li {
    margin-left: 15px;
}

/* Level 4 */
.nav-sitemap > ul ul ul ul > li > a {
    color: rgb(115,115,115);
}
.nav-sitemap > ul ul ul ul > li > a:before {
    background-color: rgb(115,115,115);
}

/* Level 5 */
.nav-sitemap > ul ul ul ul ul > li > a {
    padding-left: 0px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 11px;
    font-size: 1.1rem;
}
.nav-sitemap > ul ul ul ul ul > li > a:before {
    display: none;
}

/* ==========================================================================
   wysiwyg content
   ========================================================================== */

.wysiwyg {

}

.wysiwyg p {

}

.wysiwyg p:last-child {
    margin-bottom: 0;
}

.wysiwyg + .more {
    margin-top: 10px;
}

.wysiwyg table {
    width: 100%;
    margin-bottom: 1em;
}

.wysiwyg table th,
.wysiwyg table td {
    text-align: left;
    border: 1px solid rgb(232,232,232);
    padding: 0.4em;
}

.wysiwyg table th {
    background-color: rgb(243,243,243);
    font-family: "Arial Narrow", Arial, sans-serif;
    font-weight: normal;
    font-size: 13px;
    font-size: 1.3rem;
}

.wysiwyg table td {
    font-size: 12px;
    font-size: 1.2rem;
}
.wysiwyg h1,
.wysiwyg h2,
.wysiwyg h3,
.wysiwyg h4,
.wysiwyg h5,
.wysiwyg h6 {
    font-size: 13px;
    font-size: 1.3rem;
    margin: 1em 0;
    line-height: 1.2;
}

/* ==========================================================================
   intro content
   ========================================================================== */

.intro {

}

.intro strong {
    display: block;
    font-size: 1.15em;
}

/* ==========================================================================
   list index
   ========================================================================== */

.list-index {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.list-index li {
    display: inline-block;
    margin-right: 20px;
}

.list-index li span {
    vertical-align: middle;
}

/* ==========================================================================
   description list
   ========================================================================== */

.description-list {
    margin: 0;
}

.description-list dt {
    display: inline-block;
    width: 10%;
    font-size: 0.846em;
    font-weight: bold;
    color: rgb(255,153,0);
    text-transform: uppercase;
    vertical-align: top;
    line-height: 18px;
    margin-bottom: 3px;
}

.description-list dd {
    display: inline-block;
    margin: 0;
    width: 90%;
}

/* ==========================================================================
   css shapes
   ========================================================================== */

.shape {
    display: inline-block;
    vertical-align: middle;
}

.shape-arrow-down {
    width: 0;
    height: 0;
    border-bottom: 0;
    border-top: 7px solid rgb(255,153,0);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}

.shape-arrow-up,
.active > .shape-arrow-down {
    width: 0;
    height: 0;
    border-top: 0;
    border-bottom: 7px solid rgb(255,153,0);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
}

.shape-arrow-right {
   width: 0;
   height: 0;
   border-left: 7px solid rgb(255,153,0);
   border-top: 5px solid transparent;
   border-bottom: 5px solid transparent;
}

.panel-item .shape-arrow-right {
    margin-top: 5px;
    margin-left: 5px;
}

.panel-item .shape-arrow-down{
    margin-top: 7px;
}

.active > .shape-arrow-down,
.panel-item .shape-arrow-up {
    margin-top: 5px;
}

.shape-spot-blue {
    width: 6px;
    height: 6px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    background-color: rgb(25,156,215);
}

.shape-spot-grey {
    width: 4px;
    height: 4px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background-color: rgb(75,75,75);
}

.shape-spot-orange {
    width: 4px;
    height: 4px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background-color: rgb(255,153,0);
}

.panel-item .shape-spot-orange,
.panel-item .shape-spot-grey,
.list-index .shape-spot-orange,
.list-index .shape-spot-grey {
    margin-right: 7px;
    margin-bottom: 4px;
}

.panel-item .shape-spot-blue,
.list-index .shape-spot-blue {
    margin-right: 5px;
    margin-bottom: 3px;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}


.hidden {
    display: none !important;
    visibility: hidden;
}

.vhidden, .emailfieldtextbox {
    border: 0 !important;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px !important;
}

.vhidden.focusable:active,
.vhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

.pull-left {
    float: left;
}

.pull-right {
    float: right;
}

.set-right {
    text-align: right;
}

.upper-case {
    text-transform: uppercase;
}

.orange {
    color: rgb(255,153,0);
}

.lower-font {
    font-size: 0.846em;
    font-weight: bold;
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 1.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }

    .wrapper {
        width: auto;
        padding: 0;
    }

    .header .heading h1 {
        font-size: 2em;
        line-height: 1.1;
    }

    .feature-box {
        background: rgb(255,255,255) !important;
    }

    .nav-bar,
    #nav-overlay,
    .section-toolbar,
    .section-breadcrumbs,
    .col-aside,
    .footer,
    .tabs,
    .logo a img {
        display: none;
    }

    .header {
        height: auto;
        padding-top: 0;
    }

    .section-body {
        margin-top: 0;
    }

    .section-breadcrumbs + .section-pagecontent {
        margin-top: 0px;
    }

    .logo {
        float: none;
        text-align: right;
    }

    .logo a:before {
        content: url('../img/logo_print.png');
        width: 80px;
        height: auto;
    }

    .col-main {
        float: none;
        width: auto;
        padding: 0;
    }

    .accordion {
        page-break-before: avoid;
    }

    .accordion,
    .accordion li {
        page-break-inside: auto;
    }

    .grid ul li, .columns ul {
        width: 28%;
    }

    .section-teasergroup .row .col-1-5 {
        width: 20%;
    }

    .section-teasergroup > .group-title,
    .section-teasergroup > .row > .col:first-child .teaser {
        padding-left: 0;
    }

    .section-teasergroup > .group-title,
    .section-teasergroup > .row > .col:last-child .teaser {
        padding-right: 0;
    }

    .col-content-1-2 {
        width: 48%;
    }
}

/* ==========================================================================
   Icons
   ========================================================================== */

.icon { background:url("/preview/obo-bettermann/img/icon-sprites.png") top left no-repeat; display: block;}

/*Icons Service Menu*/

.icon-big-links-active{ width:64px; height:63px; background-position:-10px -10px; }
.icon-big-links{ width:64px; height:63px; background-position:-84px -10px; }
li.current > a .icon-big-links,
a:hover > .icon-big-links,
a:focus > .icon-big-links { background-position:-10px -10px; }

.icon-big-fair-active{ width:68px; height:73px; background-position:-158px -10px; }
.icon-big-fair{ width:68px; height:73px; background-position:-236px -10px; }
li.current > a .icon-big-fair,
a:hover > .icon-big-fair,
a:focus > .icon-big-fair{ background-position:-158px -10px; }

.icon-big-training-active{ width:69px; height:70px; background-position:-314px -10px; }
.icon-big-training{ width:69px; height:70px; background-position:-393px -10px; }
li.current > a .icon-big-training,
a:hover > .icon-big-training,
a:focus > .icon-big-training { background-position:-314px -10px; }

.icon-big-conference-active{ width:93px; height:66px; background-position:-472px -10px; }
.icon-big-conference{ width:93px; height:66px; background-position:-575px -10px; }
li.current > a .icon-big-conference,
a:hover > .icon-big-conference,
a:focus > .icon-big-conference { background-position:-472px -10px; }

.icon-big-plan-active{ width:68px; height:68px; background-position:-678px -10px; }
.icon-big-plan{ width:68px; height:68px; background-position:-756px -10px; }
li.current > a .icon-big-plan,
a:hover > .icon-big-plan,
a:focus > .icon-big-plan { background-position:-678px -10px; }

.icon-big-newsletter-active{ width:64px; height:64px; background-position:-834px -10px; }
.icon-big-newsletter{ width:64px; height:64px; background-position:-908px -10px; }
li.current > a .icon-big-newsletter,
a:hover > .icon-big-newsletter,
a:focus > .icon-big-newsletter { background-position:-834px -10px; }

.icon-big-fire-active{ width:58px; height:72px; background-position:-982px -10px; }
.icon-big-fire{ width:58px; height:72px; background-position:-1050px -10px; }
li.current > a .icon-big-fire,
a:hover > .icon-big-fire,
a:focus > .icon-big-fire { background-position:-982px -10px; }

.icon-big-downloads-active{ width:57px; height:67px; background-position:-1118px -10px; }
.icon-big-downloads{ width:57px; height:67px; background-position:-1185px -10px; }
li.current > a .icon-big-downloads,
a:hover > .icon-big-downloads,
a:focus > .icon-big-downloads { background-position:-1118px -10px; }

.icon-big-press-active{ width:84px; height:61px; background-position:-1252px -10px; }
.icon-big-press{ width:84px; height:61px; background-position:-1346px -10px; }
li.current > a .icon-big-press,
a:hover > .icon-big-press,
a:focus > .icon-big-press { background-position:-1252px -10px; }

.icon-big-contact-active{ width:63px; height:70px; background-position:-1440px -10px; }
.icon-big-contact{ width:63px; height:70px; background-position:-1513px -10px; }
li.current > a .icon-big-contact,
a:hover > .icon-big-contact,
a:focus > .icon-big-contact { background-position:-1440px -10px; }

/* Icons for Social Media in Footer */

.icon-social-xi-medium-active{ width:24px; height:24px; background-position:-1586px -10px; }
.icon-social-xi-medium{ width:24px; height:24px; background-position:-1620px -10px; }
a:hover > .icon-social-xi-medium,
a:focus > .icon-social-xi-medium { background-position:-1586px -10px; }

.icon-social-yt-medium-active{ width:24px; height:24px; background-position:-1654px -10px; }
.icon-social-yt-medium{ width:24px; height:24px; background-position:-1688px -10px; }
a:hover > .icon-social-yt-medium,
a:focus > .icon-social-yt-medium { background-position:-1654px -10px; }

.icon-social-tw-medium-active{ width:24px; height:24px; background-position:-1722px -10px; }
.icon-social-tw-medium{ width:24px; height:24px; background-position:-1756px -10px; }
a:hover > .icon-social-tw-medium,
a:focus > .icon-social-tw-medium { background-position:-1722px -10px; }

.icon-social-gp-medium-active{ width:24px; height:24px; background-position:-1790px -10px; }
.icon-social-gp-medium{ width:24px; height:24px; background-position:-1824px -10px; }
a:hover > .icon-social-gp-medium,
a:focus > .icon-social-gp-medium { background-position:-1790px -10px; }

.icon-social-fb-medium-active{ width:24px; height:24px; background-position:-1858px -10px; }
.icon-social-fb-medium{ width:24px; height:24px; background-position:-1892px -10px; }
a:hover > .icon-social-fb-medium,
a:focus > .icon-social-fb-medium { background-position:-1858px -10px; }

.icon-social-li-medium-active{ width:24px; height:24px; background-position:-1586px -44px; }
.icon-social-li-medium{ width:24px; height:24px; background-position:-1620px -44px; }
a:hover > .icon-social-li-medium,
a:focus > .icon-social-li-medium { background-position:-1586px -44px; }

.icon-social-bl-medium-active{ width:24px; height:24px; background-position:-1654px -44px; }
.icon-social-bl-medium{ width:24px; height:24px; background-position:-1688px -44px; }
a:hover > .icon-social-bl-medium,
a:focus > .icon-social-bl-medium { background-position:-1654px -44px; }

/*Icons for Social Media in Tools */

a:focus > .icon-social-xi,
a:hover > .icon-social-xi,
.icon-social-xi-active{ width:16px; height:16px; background-position:-1926px -10px; }
.icon-social-xi{ width:16px; height:16px; background-position:-1952px -10px; }

a:focus > .icon-social-yt,
a:hover > .icon-social-yt,
.icon-social-yt-active{ width:16px; height:16px; background-position:-1978px -10px; }
.icon-social-yt{ width:16px; height:16px; background-position:-2004px -10px; }

a:focus > .icon-social-tw,
a:hover > .icon-social-tw,
.icon-social-tw-active{ width:16px; height:16px; background-position:-2030px -10px; }
.icon-social-tw{ width:16px; height:16px; background-position:-2056px -10px; }

a:focus > .icon-social-gp,
a:hover > .icon-social-gp,
.icon-social-gp-active{ width:16px; height:16px; background-position:-2082px -10px; }
.icon-social-gp{ width:16px; height:16px; background-position:-2108px -10px; }

a:focus > .icon-social-fb,
a:hover > .icon-social-fb,
.icon-social-fb-active{ width:16px; height:16px; background-position:-2134px -10px; }
.icon-social-fb{ width:16px; height:16px; background-position:-2160px -10px; }

a:focus > .icon-mail-medium,
a:hover > .icon-mail-medium,
.icon-mail-medium-active{ width:30px; height:30px; background-position:-2186px -10px; }
.icon-mail-medium{ width:30px; height:30px; background-position:-2226px -10px; }

a:focus > .icon-contact-medium,
a:hover > .icon-contact-medium,
.icon-contact-medium-active{ width:30px; height:34px; background-position:-2266px -10px; }
.icon-contact-medium{ width:30px; height:34px; background-position:-2306px -10px; }

.icon-mail-small-active{ width:23px; height:17px; background-position:-2346px -10px; }
.icon-mail-small{ width:23px; height:17px; background-position:-2379px -10px; }
.icon-fax-small-active{ width:25px; height:21px; background-position:-2412px -10px; }
.icon-fax-small{ width:25px; height:21px; background-position:-2447px -10px; }
.icon-contact-small-active{ width:21px; height:24px; background-position:-2482px -10px; }
.icon-contact-small{ width:21px; height:24px; background-position:-2513px -10px; }
.icon-arrow-left-active{ width:5px; height:8px; background-position:-2544px -10px; }
.icon-arrow-left{ width:5px; height:8px; background-position:-2559px -10px; }
.icon-play-active{ width:38px; height:38px; background-position:-2574px -10px; }
.icon-play{ width:38px; height:38px; background-position:-2622px -10px; }
.icon-x-small-active{ width:15px; height:15px; background-position:-2670px -10px; }
.icon-x-small{ width:15px; height:15px; background-position:-2695px -10px; }
.icon-plus-small-active{ width:15px; height:15px; background-position:-2720px -10px; }
.icon-plus-small{ width:15px; height:15px; background-position:-2745px -10px; }
.icon-download-active{ width:20px; height:20px; background-position:-2770px -10px; }
.icon-download{ width:20px; height:20px; background-position:-2800px -10px; }
.icon-x-active{ width:20px; height:20px; background-position:-2830px -10px; }
.icon-x{ width:20px; height:20px; background-position:-2860px -10px; }
.icon-plus-active{ width:20px; height:20px; background-position:-2890px -10px; }
.icon-plus{ width:20px; height:20px; background-position:-2920px -10px; }
.icon-search-alt-active{ width:17px; height:17px; background-position:-2950px -10px; }
.icon-search-alt{ width:17px; height:17px; background-position:-2977px -10px; }
.icon-arrow-down-active{ width:10px; height:7px; background-position:-3004px -10px; }
.icon-arrow-down{ width:10px; height:7px; background-position:-3024px -10px; }

a:focus > .icon-facebook,
a:hover > .icon-facebook,
.icon-facebook-active{ width:18px; height:16px; background-position:-3042px -10px; }
.icon-facebook{ width:18px; height:16px; background-position:-3068px -10px; }

a:focus > .icon-print,
a:hover > .icon-print,
.icon-print-active{ width:19px; height:17px; background-position:-3096px -10px; }
.icon-print{ width:19px; height:17px; background-position:-3125px -10px; }

a:focus > .icon-pen-alt,
a:hover > .icon-pen-alt,
.icon-pen-alt-active{ width:20px; height:17px; background-position:-3151px -10px; }
.icon-pen-alt{ width:20px; height:17px; background-position:-3178px -10px; }

a:focus > .icon-document,
a:hover > .icon-document,
.icon-document-active{ width:18px; height:17px; background-position:-3204px -10px; }
.icon-document{ width:18px; height:17px; background-position:-3228px -10px; }

a:focus > .icon-book,
a:hover > .icon-book,
.icon-book-active{ width:19px; height:18px; background-position:-3256px -9px; }
.icon-book{ width:19px; height:18px; background-position:-3285px -9px; }
.icon-file-active{ width:12px; height:22px; background-position:-3314px -10px; }
.icon-file{ width:12px; height:22px; background-position:-3336px -10px; }

.icon-route-active{ width:20px; height:18px; background-position:-3358px -10px; }
.icon-route{ width:20px; height:18px; background-position:-3388px -10px; }
.icon-choose-active{ width:23px; height:21px; background-position:-3418px -10px; }
.icon-choose{ width:23px; height:21px; background-position:-3451px -10px; }
.icon-overview-active{ width:26px; height:15px; background-position:-3484px -10px; }
.icon-overview{ width:26px; height:15px; background-position:-3520px -10px; }
.icon-seperator-active{ width:8px; height:15px; background-position:-3556px -10px; }
.icon-seperator{ width:8px; height:15px; background-position:-3574px -10px; }

a:focus > .icon-start,
a:hover > .icon-start,
.icon-start-active{ width:14px; height:14px; background-position:-3592px -10px; }
.icon-start{ width:14px; height:14px; background-position:-3616px -10px; }

.icon-search-active{ width:17px; height:17px; background-position:-3640px -10px; }
.icon-search{ width:17px; height:17px; background-position:-3667px -10px; }

.icon-pen-active{ width:17px; height:17px; background-position:-3694px -10px; }
.icon-pen{ width:17px; height:17px; background-position:-3721px -10px; }

.icon-home-active{ width:18px; height:17px; background-position:-3748px -10px; }
.icon-home{ width:18px; height:17px; background-position:-3776px -10px; }


/* Extended */

.icon-envelope { width:16px; height:12px; background-position: -3804px -10px; }
.icon-envelope-active { width:16px; height:12px; background-position: -3830px -10px; }

.icon-phone { width:15px; height:14px; background-position: -3856px -10px; }
.icon-phone-active { width:15px; height:14px; background-position: -3881px -10px; }

.icon-comment { width:17px; height:15px; background-position: -3906px -10px; }
.icon-comment-active { width:17px; height:15px; background-position: -3993px -10px; }

.icon-pdf { width:19px; height:19px; background-position: -3960px -10px; }
.icon-pdf-active { width:19px; height:19px; background-position: -3989px -10px; }

.icon-print { width:20px; height:17px; background-position: -4018px -10px; }
.icon-print-active { width:20px; height:17px; background-position: -4048px -10px; }

.icon-arrow-right-small { width:7px; height:10px; background-position: -4078px -10px; }
.icon-arrow-right-small-active { width:7px; height:10px; background-position: -4095px -10px; }

.icon-ext { width:22px; height:22px; background-position: -4112px -10px; }
.icon-ext-active { width:22px; height:22px; background-position: -4144px -10px; }

.icon-arrow-down-small { width:8px; height:5px; background-position: -4176px -10px; }
.icon-arrow-down-small { width:8px; height:5px; background-position: -4195px -10px; }

/* Icons in Buttons */

.button {
    position: relative;
}

.button .icon {
    position: absolute;
    left: 10px;
    left: 1rem;
    top: 50%;
    margin-top: -10px;
}

.button .icon + span {
    padding-left: 28px;
    padding-left: 2.8rem;
}

.button .icon-ext {
    margin-top: -11px; /* half of its height */
}

.button:hover .icon-ext {
    background-position: -4144px -10px;
}

/* Flags */


.flag {
    width: 16px;
    height: 11px;
    background:url("/preview/obo-bettermann/img/flags.png") no-repeat;
    display: inline-block;
}

.flag.AD {background-position: -16px 0;}
.flag.AE {background-position: -32px 0;}
.flag.AF {background-position: -48px 0;}
.flag.AG {background-position: -64px 0;}
.flag.AI {background-position: -80px 0;}
.flag.AL {background-position: -96px 0;}
.flag.AM {background-position: -112px 0;}
.flag.AN {background-position: -128px 0;}
.flag.AO {background-position: -144px 0;}
.flag.AR {background-position: -160px 0;}
.flag.AS {background-position: -176px 0;}
.flag.AT {background-position: -192px 0;}
.flag.AU {background-position: -208px 0;}
.flag.AW {background-position: -224px 0;}
.flag.AZ {background-position: -240px 0;}
.flag.BA {background-position: 0 -11px;}
.flag.BB {background-position: -16px -11px;}
.flag.BD {background-position: -32px -11px;}
.flag.BE {background-position: -48px -11px;}
.flag.BF {background-position: -64px -11px;}
.flag.BG {background-position: -80px -11px;}
.flag.BH {background-position: -96px -11px;}
.flag.BI {background-position: -112px -11px;}
.flag.BJ {background-position: -128px -11px;}
.flag.BM {background-position: -144px -11px;}
.flag.BN {background-position: -160px -11px;}
.flag.BO {background-position: -176px -11px;}
.flag.BR {background-position: -192px -11px;}
.flag.BS {background-position: -208px -11px;}
.flag.BT {background-position: -224px -11px;}
.flag.BV {background-position: -240px -11px;}
.flag.BW {background-position: 0 -22px;}
.flag.BY {background-position: -16px -22px;}
.flag.BZ {background-position: -32px -22px;}
.flag.CA {background-position: -48px -22px;}
.flag.catalonia {background-position: -64px -22px;}
.flag.CD {background-position: -80px -22px;}
.flag.CF {background-position: -96px -22px;}
.flag.CG {background-position: -112px -22px;}
.flag.CH {background-position: -128px -22px;}
.flag.CI {background-position: -144px -22px;}
.flag.CK {background-position: -160px -22px;}
.flag.CL {background-position: -176px -22px;}
.flag.CM {background-position: -192px -22px;}
.flag.CN {background-position: -208px -22px;}
.flag.CO {background-position: -224px -22px;}
.flag.CR {background-position: -240px -22px;}
.flag.CU {background-position: 0 -33px;}
.flag.CV {background-position: -16px -33px;}
.flag.CW {background-position: -32px -33px;}
.flag.CY {background-position: -48px -33px;}
.flag.CZ {background-position: -64px -33px;}
.flag.DE {background-position: -80px -33px;}
.flag.DJ {background-position: -96px -33px;}
.flag.DK {background-position: -112px -33px;}
.flag.DM {background-position: -128px -33px;}
.flag.DO {background-position: -144px -33px;}
.flag.DZ {background-position: -160px -33px;}
.flag.EC {background-position: -176px -33px;}
.flag.EE {background-position: -192px -33px;}
.flag.EG {background-position: -208px -33px;}
.flag.EH {background-position: -224px -33px;}
.flag.england {background-position: -240px -33px;}
.flag.ER {background-position: 0 -44px;}
.flag.ES {background-position: -16px -44px;}
.flag.ET {background-position: -32px -44px;}
.flag.EU {background-position: -48px -44px;}
.flag.FI {background-position: -64px -44px;}
.flag.FJ {background-position: -80px -44px;}
.flag.FK {background-position: -96px -44px;}
.flag.FM {background-position: -112px -44px;}
.flag.FO {background-position: -128px -44px;}
.flag.FR {background-position: -144px -44px;}
.flag.GA {background-position: -160px -44px;}
.flag.GB {background-position: -176px -44px;}
.flag.GD {background-position: -192px -44px;}
.flag.GE {background-position: -208px -44px;}
.flag.GF {background-position: -224px -44px;}
.flag.GG {background-position: -240px -44px;}
.flag.GH {background-position: 0 -55px;}
.flag.GI {background-position: -16px -55px;}
.flag.GL {background-position: -32px -55px;}
.flag.GM {background-position: -48px -55px;}
.flag.GN {background-position: -64px -55px;}
.flag.GP {background-position: -80px -55px;}
.flag.GQ {background-position: -96px -55px;}
.flag.GR {background-position: -112px -55px;}
.flag.GS {background-position: -128px -55px;}
.flag.GT {background-position: -144px -55px;}
.flag.GU {background-position: -160px -55px;}
.flag.GW {background-position: -176px -55px;}
.flag.GY {background-position: -192px -55px;}
.flag.HK {background-position: -208px -55px;}
.flag.HM {background-position: -224px -55px;}
.flag.HN {background-position: -240px -55px;}
.flag.HR {background-position: 0 -66px;}
.flag.HT {background-position: -16px -66px;}
.flag.HU {background-position: -32px -66px;}
.flag.IC {background-position: -48px -66px;}
.flag.ID {background-position: -64px -66px;}
.flag.IE {background-position: -80px -66px;}
.flag.IL {background-position: -96px -66px;}
.flag.IM {background-position: -112px -66px;}
.flag.IN {background-position: -128px -66px;}
.flag.IO {background-position: -144px -66px;}
.flag.IQ {background-position: -160px -66px;}
.flag.IR {background-position: -176px -66px;}
.flag.IS {background-position: -192px -66px;}
.flag.IT {background-position: -208px -66px;}
.flag.JE {background-position: -224px -66px;}
.flag.JM {background-position: -240px -66px;}
.flag.JO {background-position: 0 -77px;}
.flag.JP {background-position: -16px -77px;}
.flag.KE {background-position: -32px -77px;}
.flag.KG {background-position: -48px -77px;}
.flag.KH {background-position: -64px -77px;}
.flag.KI {background-position: -80px -77px;}
.flag.KM {background-position: -96px -77px;}
.flag.KN {background-position: -112px -77px;}
.flag.KP {background-position: -128px -77px;}
.flag.KR {background-position: -144px -77px;}
.flag.kurdistan {background-position: -160px -77px;}
.flag.KW {background-position: -176px -77px;}
.flag.KY {background-position: -192px -77px;}
.flag.KZ {background-position: -208px -77px;}
.flag.LA {background-position: -224px -77px;}
.flag.LB {background-position: -240px -77px;}
.flag.LC {background-position: 0 -88px;}
.flag.LI {background-position: -16px -88px;}
.flag.LK {background-position: -32px -88px;}
.flag.LR {background-position: -48px -88px;}
.flag.LS {background-position: -64px -88px;}
.flag.LT {background-position: -80px -88px;}
.flag.LU {background-position: -96px -88px;}
.flag.LV {background-position: -112px -88px;}
.flag.LY {background-position: -128px -88px;}
.flag.MA {background-position: -144px -88px;}
.flag.MC {background-position: -160px -88px;}
.flag.MD {background-position: -176px -88px;}
.flag.ME {background-position: -192px -88px;}
.flag.MG {background-position: -208px -88px;}
.flag.MH {background-position: -224px -88px;}
.flag.MK {background-position: -240px -88px;}
.flag.ML {background-position: 0 -99px;}
.flag.MM {background-position: -16px -99px;}
.flag.MN {background-position: -32px -99px;}
.flag.MO {background-position: -48px -99px;}
.flag.MP {background-position: -64px -99px;}
.flag.MQ {background-position: -80px -99px;}
.flag.MR {background-position: -96px -99px;}
.flag.MS {background-position: -112px -99px;}
.flag.MT {background-position: -128px -99px;}
.flag.MU {background-position: -144px -99px;}
.flag.MV {background-position: -160px -99px;}
.flag.MW {background-position: -176px -99px;}
.flag.MX {background-position: -192px -99px;}
.flag.MY {background-position: -208px -99px;}
.flag.MZ {background-position: -224px -99px;}
.flag.NA {background-position: -240px -99px;}
.flag.NC {background-position: 0 -110px;}
.flag.NE {background-position: -16px -110px;}
.flag.NF {background-position: -32px -110px;}
.flag.NG {background-position: -48px -110px;}
.flag.NI {background-position: -64px -110px;}
.flag.NL {background-position: -80px -110px;}
.flag.NO {background-position: -96px -110px;}
.flag.NP {background-position: -112px -110px;}
.flag.NR {background-position: -128px -110px;}
.flag.NU {background-position: -144px -110px;}
.flag.NZ {background-position: -160px -110px;}
.flag.OM {background-position: -176px -110px;}
.flag.PA {background-position: -192px -110px;}
.flag.PE {background-position: -208px -110px;}
.flag.PF {background-position: -224px -110px;}
.flag.PG {background-position: -240px -110px;}
.flag.PH {background-position: 0 -121px;}
.flag.PK {background-position: -16px -121px;}
.flag.PL {background-position: -32px -121px;}
.flag.PM {background-position: -48px -121px;}
.flag.PN {background-position: -64px -121px;}
.flag.PR {background-position: -80px -121px;}
.flag.PS {background-position: -96px -121px;}
.flag.PT {background-position: -112px -121px;}
.flag.PW {background-position: -128px -121px;}
.flag.PY {background-position: -144px -121px;}
.flag.QA {background-position: -160px -121px;}
.flag.RE {background-position: -176px -121px;}
.flag.RO {background-position: -192px -121px;}
.flag.RS {background-position: -208px -121px;}
.flag.RU {background-position: -224px -121px;}
.flag.RW {background-position: -240px -121px;}
.flag.SA {background-position: 0 -132px;}
.flag.SB {background-position: -16px -132px;}
.flag.SC {background-position: -32px -132px;}
.flag.scotland {background-position: -48px -132px;}
.flag.SD {background-position: -64px -132px;}
.flag.SE {background-position: -80px -132px;}
.flag.SG {background-position: -96px -132px;}
.flag.SH {background-position: -112px -132px;}
.flag.SI {background-position: -128px -132px;}
.flag.SK {background-position: -144px -132px;}
.flag.SL {background-position: -160px -132px;}
.flag.SM {background-position: -176px -132px;}
.flag.SN {background-position: -192px -132px;}
.flag.SO {background-position: -208px -132px;}
.flag.somaliland {background-position: -224px -132px;}
.flag.SR {background-position: -240px -132px;}
.flag.SS {background-position: 0 -143px;}
.flag.ST {background-position: -16px -143px;}
.flag.SV {background-position: -32px -143px;}
.flag.SX {background-position: -48px -143px;}
.flag.SY {background-position: -64px -143px;}
.flag.SZ {background-position: -80px -143px;}
.flag.TC {background-position: -96px -143px;}
.flag.TD {background-position: -112px -143px;}
.flag.TF {background-position: -128px -143px;}
.flag.TG {background-position: -144px -143px;}
.flag.TH {background-position: -160px -143px;}
.flag.TJ {background-position: -176px -143px;}
.flag.TK {background-position: -192px -143px;}
.flag.TL {background-position: -208px -143px;}
.flag.TM {background-position: -224px -143px;}
.flag.TN {background-position: -240px -143px;}
.flag.TO {background-position: 0 -154px;}
.flag.TR {background-position: -16px -154px;}
.flag.TT {background-position: -32px -154px;}
.flag.TV {background-position: -48px -154px;}
.flag.TW {background-position: -64px -154px;}
.flag.TZ {background-position: -80px -154px;}
.flag.UA {background-position: -96px -154px;}
.flag.UG {background-position: -112px -154px;}
.flag.UM {background-position: -128px -154px;}
.flag.US {background-position: -144px -154px;}
.flag.UY {background-position: -160px -154px;}
.flag.UZ {background-position: -176px -154px;}
.flag.VA {background-position: -192px -154px;}
.flag.VC {background-position: -208px -154px;}
.flag.VE {background-position: -224px -154px;}
.flag.VG {background-position: -240px -154px;}
.flag.VI {background-position: 0 -165px;}
.flag.VN {background-position: -16px -165px;}
.flag.VU {background-position: -32px -165px;}
.flag.wales {background-position: -48px -165px;}
.flag.WF {background-position: -64px -165px;}
.flag.WS {background-position: -80px -165px;}
.flag.YE {background-position: -96px -165px;}
.flag.YT {background-position: -112px -165px;}
.flag.ZA {background-position: -128px -165px;}
.flag.zanzibar {background-position: -144px -165px;}
.flag.ZM {background-position: -160px -165px;}
.flag.ZW {background-position: -176px -165px;}