.mobicon { display: none; position: absolute; right: 20px; top: 52px; height: 30px; width: 30px; }
.mobicon span { position: absolute; width: 30px; height: 4px; left: 0px; background-color: #081d61; }
.mobicon span.first { top: 0px; }
.mobicon span.sec { top: 11px; }
.mobicon span.third { top: 21px; }
.mobicon.open span.sec{ opacity: 0; }
.mobicon.open span.first {-webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: 10px;   }
.mobicon.open span.third { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); margin-top: -10px; }

@media ( max-width : 1200px ) {
    header + nav { display: none; position: absolute; z-index: 2; width: 100%; }
    .mobicon { display: block; }
    .inner-1200, .inner, nav > ul, main { max-width: 100%; padding-left: 20px; padding-right: 20px; }
    main .inner-1200 { padding-left: 0; padding-right: 0; }
    .inner-1200 .inner-1200, .inner .inner { padding-left: 0; padding-right: 0; }
    #logo { right: 20px; }
    header .inner { justify-content: flex-start; }
    header .inner .logo { margin: 0 auto; }
    body > nav ul { height: auto; flex-direction: column; align-items: flex-start; padding-bottom: 20px; }
    body > header { margin-bottom: 0; }
    main { margin-top: 2.5rem; }
}

@media ( max-width: 1000px ) {
    .grid_30_30_30 > .row > .col,
    .grid_25_25_25_25 > .row > .col,
    .grid_20_20_20_20_20 > .row > .col,
    .grid_50_50 > .row > .col,
    .grid_70_30 > .row > .col_70,
    .grid_70_30 > .row > .col_30,
    .grid_30_70 > .row > .col_30,
    .grid_30_70 > .row > .col_70,
    .grid_40_60 > .row > .col_40,
    .grid_40_60 > .row > .col_60,
    .grid_60_40 > .row > .col_40,
    .grid_60_40 > .row > .col_60,
    .tx-powermail .powermail_fieldwrap,
    .grid_50_50 > .row > .col:last-of-type,
    .grid_50_50 > .row > .col:first-of-type{ width: 100%; padding-right: 0; padding-left: 0; }
    .grid > .row { flex-direction: column; }
}

@media ( max-width: 950px ) {
    #headerContent h3 { font-size: 25px; }
    #logo { top: 29px; }
}

@media ( max-width: 820px ) {
    #headerContent h3 { font-size: 20px; }
    #logo { max-width: 200px; }

    /* margins */
    .margin-20, .space-after-small, .tabOut > .tabnavi { margin-bottom: 20px; }
    .margin-40, .space-after-medium { margin-bottom: 40px; }
    .margin-80, .space-after-large { margin-bottom: 80px; }
    .margin-16, #content p, #content ul, #content ol, #content hr { margin-bottom: 16px; }
}

@media ( max-width: 640px )  {
    #headerContent h3 { display: none; }
    #logo { right: auto; left: 20px; top: 20px; }
    header .inner { height: 5rem; }
    header .inner > div:not(.logo) { display: none; }
    header .inner .logo { margin: 0; max-width: 230px; }
    .mobicon { top: 22px; }
    #footerCon, #navFooter { float: none; }
    #navFooter ul { padding: 0; }
    main > div { margin-bottom: 2.5rem; }
    .grid .col_50_1, .grid .col_60 { margin-bottom: 2.5rem; }
}