/*
  Theme Name: Roboro NewStyle 2016
  Theme URI: www.roboro.de
  Description: Roboro
  - Agentur für Marketing und Mediengestaltung
  Author: Alexander Gérard
  Author
  URI: www.roboro.de
*/

* {
    margin: 0;
    padding: 0;
}
body, html {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
}
body {
    color: #6F6F6E;
    text-shadow: 0 0 1px rgba(51, 51, 51, 0.2);
    font-family: "Roboto", "Droid Sans", Arial, Helvetica, sans-serif!important;
    font-size: 1.0em!important;
    font-style: normal;
    font-weight: 300;
    list-style-type: none!important;
}
h1, h2, h5, h6 {
    color: #374E5D;
    font-weight: 300!important;
    letter-spacing: 0.1em;
    font-family: "Roboto", "Droid Sans", Arial, Helvetica, sans-serif!important;
}

h3, h4 {
    font-family: "Roboto", "Droid Sans", Arial, Helvetica, sans-serif!important;
}


h1 {
    margin-bottom: 10px;
    color: #B69F0C;
    font-family: "Roboto", "Droid Sans", Arial, Helvetica, sans-serif!important;
    font-size: 3.0em;
}
h2 {
    color: #374E5D;
    font-size: 1.6em;
}
h5 {
    color: #3c3c3b;
    font-size: 1.6em;
}
h6 {
    margin: 25px 0px 5px 0px;
    padding: 0px;
    color: #efce5e;
    font-size: 1.5em;
    font-weight: 400;
}
img {
    border: none;
}

p {
    line-height: 1.8!important;
    font-size: 1.03vw!important;
    font-weight: 300!important;
}
.white {
    color: #fff!important;
}

/* H1 Überschriften */
h1 { margin: 0!important; }

.colorgold {color: #b49d10!important; }

.back:before, .back_eng:before {
    content: "> ";
}
.back {
    float: right;
    margin-right: 24%;
    color: rgb(186, 162, 51)!important;
}
.back_eng {
    float: right;
    margin-right: 25%;
    color: rgb(186, 162, 51)!important;
}
.back:hover, .back_eng:hover {
    color: #999!important;
}
a.button {
    width: 100%;
    margin: 0px 0px 0px 0px;
    padding: 10px 20px;
    color: #374E5D!important;
    background: none repeat scroll 0% 0% rgb(217, 226, 231);
    text-shadow: none!important;
    font-weight: normal;
}
.zentriert {
    position: relative!important;
    top: 50%!important;
    -ms-transform: translateY(-50%)!important;
    -webkit-transform: translateY(-50%)!important;
    transform: translateY(-50%)!important;
}
.zentriert1 {
    position: relative !important;
    top: 31% !important;
    -ms-transform: translateY(-50%)!important;
    -webkit-transform: translateY(-50%)!important;
    transform: translateY(-50%)!important;
}
.trennlinie {
    margin: 0 5px;
    color: #374E5D;
}
.bold1 {
    color: #374E5D;
    font-size: 500!important;
}
.lighter {
    margin-right: 2px;
    color: #999;
    font-size: 0.8em;
}
.left {
    float: left;
}
.right {
    float: right;
}
.clear {
    clear: both;
}
.txtleft {
    text-align: left;
}
.txtright {
  text-align: right;
}
.txtcenter {
  text-align: center;
}
span.zitat {
    color: #ccc;
}
.responsive_pic {
    width: 90%;
    height: auto;
}
#sidr-id-navigation_adresse {
    margin: 50px 0px 0px 30px;
    color: #ECECEC;
}
#navigation_adresse {
    display: none;
}
span.kontakt_abstand {
    display: inline-block;
    width: 50px!important;
}


/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  HEADER
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/

header {
    z-index: 102;
    position: absolute;
    width: 100%;
    height: auto;
    padding-bottom: 30px;
    background-color: transparent;
    -webkit-transform: none !important;
    transform: none !important;
    transition: opacity .8s, visibility 0s;
}
#navigation {
    height: 100px;
    text-transform: uppercase;
    list-style-type: none;
}
.nav_scroll {
    height: 60px;
    padding: 0px !important;
    border-bottom: 1px solid #000 !important;
    background: rgba(0, 0, 0, 0.8);
    transition: all 0.7s ease-in-out 0s;
    position: fixed;


}
.nav_scroll .nav_logo {
    margin-top: 0px!important;
    margin-left: -13px;
}
.nav_scroll ul#menu-mainmenu, ul#menu-mainmenue {
    margin-top: 20px !important;
}
ul#menu-mainmenu, ul#menu-mainmenue {
    float: right;
    margin-top: 50px !important;
    border: none !important;
    text-align: right;
    font-size: 1.4em;
    margin-right: 0px;
}
#main_nav_content {
    margin: 0px auto;
    text-transform: uppercase;
    list-style-type: none;
}
#menu-mainmenu li, #menu-mainmenue li {
    display: inline;
    position: relative;
    width: auto;
    float: left;
    margin-right: 20px;
    padding: 0px;
    background: none !important;
    text-align: center;
    text-transform: uppercase;
    font-family: "Roboto", "Droid Sans", Arial, Helvetica, sans-serif!important;
    font-weight: 300;
    letter-spacing: .1em;
    list-style-type: none;
}
#menu-mainmenu li a, #menu-mainmenue li a {
    color: #ccc;
    background: none !important;
    background: none !important;
    text-decoration: none !important;
    text-transform: uppercase;
    font-weight: 300;
    letter-spacing: .1em;
}
#menu-mainmenu li:hover {
    color: #fff!important;
    background: none!important;
    text-decoration: none!important;
    transition: color 1.5s;
}
#menu-mainmenu li a:hover {
    color: #fff!important;
    background: none!important;
    text-decoration: none!important;
    transition: color 1.5s;
}
.main_nav {
    width: 90%;
    margin: 0px auto !important;
    padding-top: 60px;
}
.nav_logo {
    margin-top: 30px;
    margin-left: -13px;

}
.menu-mainmenueffects:after, .menu-mainmenueffects:before {
    content: ' ';
    display: block;
    position: absolute;
    width: 0px;
    height: 0px;
    opacity: 0;
    text-align: center;
    -moz-transition: width 0.5s ease 0s;
    transition: width 0.5s ease 0s;
}
.menu-mainmenueffects:after {
    top: 24px;
    margin: 0px;
    padding: 1px 0px;
    background: #fff;
}
.menu-mainmenueffects:before {
    top: 24px;
    margin: 0px;
    padding: 1px 0px;
    background: #fff;
}
.menu-mainmenueffects:hover:after, .menu-mainmenueffects:hover:before {
    width: 100%;
    height: 1px;
    margin: 0px;
    padding: 1px 0px;
    opacity: 1;
    border: none!important;
    border: none!important;
}
.menu_special1 {
    margin-top: -7px!important;
    padding: 5px 10px!important;
    border: 2px solid #ccc!important;
    text-decoration: none!important;
    transition: color 2s, border2s!important;
}
.menu_special1:hover {
    padding: 5px 10px;
    color: #fff;
    border: 2px solid #fff!important;
    background: none!important;
    text-decoration: none!important;
    transition: color 2s, border2s;
}
.menu_special1:hover a {
    color: #fff;
    background: none!important;
    text-decoration: none!important;
    transition: color 2s, border2s;
}
.menu_special1:hover:after, .menu_special1:hover:before {
    background: none!important;
    text-decoration: none!important;
}
.menu_special2 {
    margin-right: 4px!important;
}
.menu_special2 a:after {
    content: " | "!important;
    color: #828282!important;
}
.main_nav_logo {
    position: absolute;
    margin: 20px 0px 30px 50px;
    list-style-type: none!important;
}
.main_nav ul li {
    list-style-type: none!important;
}







/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Index (Section1)
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/
#slide01 h2 {
    margin: 0 !important;
    padding: 55px;
    color: rgb(255, 255, 255);
    background: rgb(0, 0, 0) none repeat scroll 0% 0%;
    background-color: rgba(0, 0, 0, 0.85);
    text-transform: uppercase;
    font-size: 3.2vw;
    font-weight: 500 !important;
    line-height: 1.3;
    height: 25vw;
}
#slide01 p {
    width: 100%;
    height: 25vw;
    padding: 60px 60px !important;
    color: rgb(255, 255, 255);
    background: rgb(0, 0, 0) none repeat scroll 0% 0%;
    background-color: rgba(0, 0, 0, 0.85);
    vertical-align: middle !important;
    font-size: 1.3vw !important;
    font-weight: 300 !important;
    line-height: 1.7 !important;
    letter-spacing: 0.08em;
}
#section1 {
    z-index: 2!important;
    position: relative;
    width: 100%;
    height: 100%;
    background: url('pics/dottedbackground.png');
    text-align: center;
}
#section1 h2.headline {
    margin: 0 0 15px 0;
    color: #fff;
    font-size: 3.429em!important;
    font-weight: 400!important;
    line-height: 1.333em!important;
}
#section1 p {
    margin: 0 0 50px 0;
    color: #fff;
    font-size: 2.5em!important;
    font-weight: 400!important;
    line-height: 1.333em!important;
}
#section1 h2 small {
    color: #fff;
    font-weight: 400!important;
    letter-spacing: 0.04em!important;
}
.sect1_txt1, .sect1_txt2, .sect1_txt3, .sect1_txt4 {
    margin: 0 0 15px 0;
    color: #fff;
    text-transform: uppercase;
    font-size: 4em;
}
.sect1_txt1 {
    display: -moz-inline-box;
    margin-bottom: 0px;
    padding-top: 10px;
    padding-left: 4px;
    border-top: 8px solid #fff;
    font-size: 6.2vw!important;
    font-weight: 400!important;
    letter-spacing: 0.01em;
    display: inline;
}
.sect1_txt2 {
    margin: 0;
    padding-left: 2px;
    font-size: 5.6vw!important;
    font-weight: 400 !important;
    letter-spacing: -0.03em;
}
.sect1_txt3 {
    display: -moz-inline-box;
    margin-top: 3px;
    padding-bottom: 10px;
    padding-left: 4px;
    border-bottom: 8px solid #fff;
    font-size: 3.4vw !important;
    font-weight: 400!important;
    letter-spacing: 0.03em;
    letter-spacing: 0.05em;
    display: inline;
}
.sect1_txt4 {
    margin-top: 40px;
    padding-top: 10px;
    padding-left: 4px;
    font-size: 2.0vw !important;
    font-weight: 400!important;
    display: -moz-box;
}





/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Index (Section2)
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/
#slide02 h2 {
    display: -moz-box;
    margin: 0 !important;
    padding: 40px;
    width: 430px;
    color: rgb(255, 255, 255);
    background: rgb(0, 0, 0) none repeat scroll 0% 0%;
    background-color: rgba(0, 0, 0, 0.85);
    text-transform: uppercase;
    font-size: 1.8vw;
    font-weight: 500 !important;
    line-height: 1.4;
}
#slide02 .header {
    position: static!important;
}
#slide02 p.content, #slide02 p.teaser {
    position: static !important;
    width: 430px;
    padding: 20px 40px!important;
    color: rgb(255, 255, 255);
    background: rgb(0, 0, 0) none repeat scroll 0% 0%;
    vertical-align: middle !important;
    font-weight: 500 !important;
    line-height: 1.5;
    letter-spacing: 0.1em;
    margin: 0!important;
    min-height: auto!important;
}
#slide02 p.teaser {
    background-color: rgba(102, 35, 130, 0.85);
    font-size: 1.2vw !important;
    margin-bottom: 5px;
    line-height: 1.6em !important;
    text-transform: uppercase;
}
#slide02 p.content {
    background-color: rgba(0, 0, 0, 0.85);
    font-size: 1.2vw !important;
    font-weight: 300 !important;
    line-height: 1.6 !important;
}
#section2 {
    width: 100%;
    height: 100%;
}
#section2 h2.headline {
    margin: 0;
    color: #fff;
    font-size: 4.2vw!important;
    font-weight: 400!important;
    line-height: 1.333em;
    letter-spacing: 0.02em !important;
}
#section2 h2 small {
    color: #fff;
    font-size: 1.3vw !important;
    font-weight: 300;
    letter-spacing: 0.05em;
}
#section2 p {
    color: #fff;
    font-size: 1.28vw !important;
    font-weight: 300 !important;
    line-height: 1.5em !important;
}
#slide-2 .hsContent {
    position: fixed;
    width: 100%!important;
}





/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Index (Section3)
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/
#slide03 h2 {
    color: rgb(255, 255, 255);
    font-size: 2.0vw;
    font-weight: 500 !important;
    letter-spacing: 0.05em;
}
#slide03, .scrollmagic-pin-spacer {
    margin-top: -4px!important;
}
#section3 {
    width: 100%;
    height: 100%;
    background: #ccc;
}
#section3 h2.headline {
    margin: 0 0 15px 0;
    color: #fff;
    font-size: 4.2vw!important;
    font-weight: 400!important;
    line-height: 1.333em;
    letter-spacing: 0.02em !important;
}
#section3 h2 small {
    color: #fff;
    font-size: 1.4vw!important;
    font-weight: 400;
    letter-spacing: 0.04em;
}
#section3 p {
    margin: 0 0 50px 0;
    color: #fff;
    font-size: 1.7vw!important;
    font-weight: 500;
    line-height: 1.333em;
}
#section3.s_noeffect {
    background: #211!important;
    transition: 1s background;
}
#section3.s_yeseffect {
    background: #0b7a33!important;
    transition: 1s background;
}




/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Index (Section Einstellungen)
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/
.mousedown_button {
    top: 40%;
    margin: 0 auto;
}
video#bgvid {
    z-index: -100;
    position: absolute;
    right: 0;
    bottom: 0;
    width: auto;
    min-width: 100%;
    height: auto;
    min-height: 100%;
}
.videoblendung {
    z-index: 0!important;
    position: absolute;
    top: 0;
    width: auto;
    min-width: 100%;
    height: auto;
    min-height: 100%;
}
.videoblendung_verlauf {
    z-index: 1!important;
    position: absolute;
    top: 0;
    width: auto;
    min-width: 100%;
    height: auto;
    min-height: 100%;
    background: rgba(60,2,40,0.52);
  	background: -moz-linear-gradient(-45deg, rgba(60,2,40,0.52) 0%, rgba(55,6,48,0.49) 32%, rgba(62,19,34,0.49) 38%, rgba(55,60,2,0.46) 70%, rgba(1,14,55,0.44) 100%);
  	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(60,2,40,0.52)), color-stop(32%, rgba(55,6,48,0.49)), color-stop(38%, rgba(62,19,34,0.49)), color-stop(70%, rgba(55,60,2,0.46)), color-stop(100%, rgba(1,14,55,0.44)));
  	background: -webkit-linear-gradient(-45deg, rgba(60,2,40,0.52) 0%, rgba(55,6,48,0.49) 32%, rgba(62,19,34,0.49) 38%, rgba(55,60,2,0.46) 70%, rgba(1,14,55,0.44) 100%);
  	background: -o-linear-gradient(-45deg, rgba(60,2,40,0.52) 0%, rgba(55,6,48,0.49) 32%, rgba(62,19,34,0.49) 38%, rgba(55,60,2,0.46) 70%, rgba(1,14,55,0.44) 100%);
  	background: -ms-linear-gradient(-45deg, rgba(60,2,40,0.52) 0%, rgba(55,6,48,0.49) 32%, rgba(62,19,34,0.49) 38%, rgba(55,60,2,0.46) 70%, rgba(1,14,55,0.44) 100%);
  	background: linear-gradient(135deg, rgba(60,2,40,0.52) 0%, rgba(55,6,48,0.49) 32%, rgba(62,19,34,0.49) 38%, rgba(55,60,2,0.46) 70%, rgba(1,14,55,0.44) 100%);
  	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3c0228', endColorstr='#010e37', GradientType=1 );
}
.contactform input, .contactform textarea {
    width: 100%;
    margin: 0px auto 10px auto !important;
    padding: 16px 20px;
    color: #777;
    border: 2px solid #ccc;
    border-radius: 15px;
    background-color: rgba(255, 255, 255, 0.8);
    font-size: 1.0em;
    line-height: normal;
    letter-spacing: 0.05em;
}
.contactform {
    width: 100%;
    height: 50%;
}
.contactform h2 {
    margin-top: -20px;
    text-align: center;
}
.wpcf7-submit {
    width: 100%;
    color: #fff !important;
    border: 2px solid #efce5e !important;
    background-color: rgba(239, 206, 94, 0.8) !important;
    font-weight: 600;
}
ul.group {
    margin: 0px!important;
    padding: 0px!important;
}
ul.group li {
    float: left;
    margin: 0px 10px 10px 0px;
    padding: 8px 16px;
    color: #fff;
    border: 3px solid #fff;
    font-size: 1.1vw !important;
    font-weight: 400;
    line-height: 1.333em;
    list-style-type: none;
}
ul.group ul.list1, ul.group ul.list2, ul.group ul.list3, ul.group ul.list4 {
    margin: 0 0 40px 0!important;
    padding: 0!important;
}
.icon1 {
    width: 150px;
    margin-top: 20px;
    padding: 0px 25px;
    border-radius: 100px;
    background: #b17e49;
}
.icon1 object {
    width: 100px;
}
.icon2 {
    width: 150px;
    padding: 0px 25px;
    border-radius: 100px;
    background: #1e294d;
}
.icon2 object {
    width: 100px;
}
.icon3 {
    width: 150px;
    padding: 0px 25px;
    border-radius: 100px;
    background: #951b81;
}
.icon3 object {
    width: 100px;
}

.bcgchange { background: #662382!important;  transition: all 2s; display: inline-block; padding-bottom: 40px !important;}
.bcgchange .icon1 { background: #951b81!important; transition: all 2s; }
.content-block { display: inline-block; padding: 0px 0px 50px 0px !important; }





/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Content
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/
#wrapper {
    height: 100%;
}
#content, .content {
    max-width: 1040px;
    min-height: 250px;
    margin: 80px auto;
    line-height: 2.1em;
}
#content_box {
    max-width: 1040px;
    margin: 0px auto;
}
#content_full {
    width: 100%;
    height: 100%;
}
#content_full_inside {
    width: 1040px;
    margin: 0px auto;
}
* html .clearfix {
    height: 1%;
}
.clearfix {
    display: block;
}

/* Bereich nicht für IE-mac Ende */
.clearfix:after {
    content: ".";
    display: block;
    visibility: hidden;
    height: 0;
    clear: both;
    font-size: 0;
}
.mlp_quicklinks.br, .mlp_quicklinks.tr {
    display: none;
}




/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Kunden / Projekte
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/
.kunden_teaser, .projekte_teaser {
    width: 100%;
    height: 515px;
    padding-top: 300px !important;
    margin-top: -150px;
}
.kunden_teaser {
    background:  #244256;
    margin-bottom: 80px!important;
}
.projekte_teaser {
    background:  #583256;
    background-size: cover cover;
    margin-bottom: -120px!important;
}
.projekte_kacheln {
    height: 515px;
    position: absolute;
    top: 0px;
    width: 100%;
}
.kunden_teaser h2, .projekte_teaser h2, .kunden_teaser h1, .projekte_teaser h1   {
    margin: 0 !important;
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    font-size: 3.4vw;
    font-weight: 500 !important;
    line-height: 1.4;
    letter-spacing: 0.05em;
}

.en .kunden_teaser h2, .projekte_teaser h2, .en .kunden_teaser h1, .projekte_teaser h1  {
    font-size: 2.5vw!important;
}

.kunden_teaser p, .projekte_teaser p {
    text-transform: uppercase;
    font-size: 1.2vw;
    line-height: 1.5;
    font-weight: 300 !important;
}

.kunden_header_pic1 {
    margin: -227px 0px 0px -40px;
}
.kunden_header_pic2 {
    margin: -450px 0px 0px 350px;
}
.kunden_header_pic3 {
    margin: 70px 0px 0px 450px;
}
.projekte_header_pic1 {
    margin: -215px 0px 0px 28px;
}
.pic_kunden { display: none; }

#boxeffect1, #boxeffect2, #boxeffect3 {
    margin-left: 3%;
}

#boxeffect1 h5, #boxeffect2 h5, #boxeffect3 h5 {
    margin: 20px 60px 40px 60px;
    padding-left: 20px;
}

.mouse_down1 {  width: 100px;  margin: 0 auto!important; }
.mouse_down1 object{
    -webkit-filter: drop-shadow( 0px 1px 2px #000 );
            filter: drop-shadow( 0px 1px 2px #000 );
             width: 60px;
    -ms-filter: drop-shadow( 0px 1px 2px #000 );
            filter: drop-shadow( 0px 1px 2px #000 );
            width: 60px;


}
.mouse_down1 img{  width: 50px; }

/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Agentur
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/

.agentur_content_wrapper {
    width: 100%;
    height: 100% !important;
}
.agentur_content_pic {
    width: 100%;
    height: 100%;
    background-size: cover;
}

.agentur .box0 h4 {
  color: #3c3c3b !important;
padding: 50px;
font-size: 7.2vw;
border-bottom: 7px solid #3c3c3b;
border-top: 7px solid #3c3c3b;
padding: 2vw 0px !important;
margin: 18vw 0vw 5vw 0vw;
}

.agentur .box0 h4 .h4bold {
  font-weight: 500;
}
.agentur .box1 {
    background: #3c3c3b;
    color: #fff !important;
    padding: 45px 55px;
    margin-top: 28px;
}
.agentur .box1 p, .agentur .box1 h1 {
    text-transform: uppercase;
    font-size: 1.5vw !important;
    text-align: left;
    margin-bottom: 0px !important;
    color: #fff !important;
    line-height: 1.7em !important;
    letter-spacing: 0.02em;
}
.agentur .box1 h4 {
  color: #fff !important;
  font-size: 6vw;
  text-align: left;
}
.agentur h5 {
    color: #fff !important;
}

.agentur .box4 h2, .agentur .box5 h2 {
  color: #fff !important;
  text-transform: uppercase;
font-size: 1.5vw;
}



.agentur .box2 p {
  text-align: left;
line-height: 2.2vw !important;
margin: 1.7vw;
}

.agentur .short {
margin: 1vw 0vw !important;
}
.agentur .box3, .agentur .box4, .agentur .box5 {
    color: #fff !important;
    text-align: left;
    padding: 58px 50px !important;
    min-height: 330px;
    margin-left: 1.2%;
    width: 32%;
}
.agentur .box3 p, .agentur .box4 p, .agentur .box5 p {
    line-height: 1.8vw !important;
    text-align: left;
    word-wrap: break-word !important;
}
.agentur .box3 h6 {
    font-size: 5vw!important;
    color: rgb(255, 255, 255);
    margin: 0px!important;
}
.agentur .box3 {
  background: #925f36;
}
.agentur .box4 {
  background: #c99d66;
  padding: 40px 40px 30px 40px !important;
}
.agentur .box4 {
    background: #c99d66;
    padding: 40px 55px 30px 55px !important
}
.agentur .box5 {
    background: #c99d66;
    padding: 40px 55px 30px 55px !important
}
.agentur_img {
    float: left;
    margin: 20px 32px 0px 5px;
}
.agentur_img2 {
    float: left;
    margin: 20px 20px 0px -4px;
}
#agentur_leistungen {
  background: #925f36;
  margin: 6vw 0px;
  height: 100%;
}
#leistungen_pic {
    width: 100%;
    min-height: 28vw !important;
    margin: 5vw 0px 4vw 0px;
    background: url("pics/leistungen.png") center top no-repeat;
    background-size: 100% auto;
}

#leistungen_pic_en {
    width: 100%;
    min-height: 28vw !important;
    margin: 80px 0px;
    background: url("pics/leistungen_en.png") center top no-repeat;
    background-size: 100% auto;
}


.chart .percent {
    font-size: 50px;
    text-align: center;
    vertical-align: super;
    display: -moz-box;
    position: absolute;
    margin: 62px 0px 0px 55px;
}

.chart canvas {
    top: 0;
    left: 0;
    text-align: center;
}


.agenturicon1 {
width: 100%;
}
.agenturicon1 object {
    width: 10vw;
    height: auto;
    margin-bottom: -12px;
}
.agentur, .agentur p {
    text-align: center;
    font-size: 1.1vw !important;
    line-height: 1.9em !important;
}
.agentur h4 {
    font-family: "Roboto", "Droid Sans", Arial, Helvetica, sans-serif!important;
    text-transform: uppercase;
    font-size: 3vw;
    color: #951b81;
    font-weight: 100;
    letter-spacing: 0.05em;
    margin: 20px 0px;
}
.agentur h5 {      text-transform: uppercase; font-size: 2vw; font-size: 1.5vw;
}
.agentur h6 {
      text-transform: uppercase;
      font-size: 2vw;
      color: #951b81;
      font-weight: 100!important;
      letter-spacing: 0.05em;
      margin: 100px 0px 20px 0px;
  }
  #agenturliste p {
      font-size: 0.98vw !important;
      letter-spacing: 0.02em;
      line-height: 1.6em !important;
      padding: 0px 20px;
      color: #909090 !important;
  }
  #agenturliste h2 {
      font-size: 1.55vw !important;
      letter-spacing: 0.03em;
  }


  .agentur_profil {
    height: 800px;
    width: 100%;
    margin-top: 50px;

}
.agentur_profil_box1 {
padding: 45px 45px !important;
color: rgb(255, 255, 255);
background: rgba(201, 157, 102, 0.9);
vertical-align: middle !important;
font-weight: 500 !important;
line-height: 1.5;
letter-spacing: 0.1em;
margin: 80px 0px;
}
.agentur_profil_box1 h4 {
    font-size: 1.5vw;
    color: #fff;
    margin-bottom: 5px;
    line-height: 1.25em;
    font-weight: 300;
}


/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Portfolio (Projekte) - Liste
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/

.portfolio_wrapper {
border: 5px solid rgb(255, 255, 255);
box-shadow: 0px 0px 8px rgb(204, 204, 204);
}

.portfolio_logo_wrapper {
  margin: 21% auto 0% auto !important;
  vertical-align: middle !important;
}
.portfolio_pic {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  margin: 0 auto;
  -webkit-filter: sepia(1) opacity(28%) brightness(0.5) blur(0.5px)!important;
  -ms-filter: sepia(1) opacity(28%) brightness(0.5) blur(0.5px)!important;
  filter: sepia(1) opacity(28%) brightness(0.5) blur(0.5px)!important;
  position: absolute;
    }

.portfolio_pic:hover {
    -webkit-filter: sepia(0) opacity(60%) brightness(1.2) blur(0.05px)!important;
    -ms-filter: sepia(0) opacity(60%) brightness(1.2) blur(0.05px)!important;
    filter: sepia(0) opacity(60%) brightness(1.2) blur(0.05px)!important;
    transition: all 1s;
    }

.portfolio_wrapper p.teaser {
    visibility: hidden!important;
    transition: all 2s;
    text-transform: uppercase;
    color: #fff;
    font-size: 0.8vw!important;
    font-weight: 500 !important;
    line-height: 1.4;
    text-align: center;
    padding: 10px;
    transition: all 1s;
    bottom: 0 !important;
    position: absolute;
    filter: blur(0px);
    width: 100%;
}
.portfolio_wrapper:hover p.teaser {
  visibility: visible!important;
  background: rgba(45,45,45,0.6);
  filter: blur(0px);
  transition: all 1s;
}

.portfolio_logo {
  vertical-align: center;
  margin: 0 auto;
  margin: auto auto !important;
  display: inherit;
  -webkit-filter: sepia(0) opacity(100%) brightness(1);
  -ms-filter: sepia(0) opacity(100%) brightness(1);
  filter: sepia(0) opacity(100%) brightness(1);
}


.projekte_content_wrapper { width: 100%; height: 100%!important; }



.projekte_content_pic { width: 100%; height: 100%; background-size: cover;  }
.projekte_content_box1 {
padding: 10px 35px !important;
color: rgb(255, 255, 255);
background: rgba(201, 157, 102, 0.9);
vertical-align: middle !important;
font-weight: 500 !important;
line-height: 1.5;
letter-spacing: 0.1em;
margin-bottom: 10px;
}
.projekte_content_box1 h6 {
    font-size: 1.2vw !important;
    margin-bottom: 5px;
    text-transform: uppercase;
    color: #fff;
}

.iconmore {
  font-size: 2.6vw !important;
margin-left: -17px;
text-transform: uppercase;
color: #fff !important;
line-height: 1.2em;
  }

  .projekte_content1 p {
      font-size: 1vw !important;
      line-height: 1.5em !important;
      margin-top: 20px;
  }

.breadcrumb {
    padding: 0px;
    margin-bottom: 0px;
    list-style: none;
    background-color: transparent;
    border-radius: 0px;
    font-size: 0.9vw !important;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 20px;
}

.breadcrumb a { color: #5c5c5c!important; }

.proj_auftraggeber_name {font-weight: 500; }
.proj_auftraggeber_ort {}
.proj_auftraggeber_tel {margin-top: 10px; display: -moz-box;}
.proj_auftraggeber_fax {}
.proj_auftraggeber_land {display: -moz-box;}
.proj_auftraggeber_mail, .proj_auftraggeber_mail a {margin-top: 6px; display: -moz-box; color: #fff!important;}
.proj_auftraggeber_web, .proj_auftraggeber_web a {color: #fff!important;}

a .pdf-button {
    font-size: 3vw;
    margin: -22px -10px -10px -17px;
    color: #fff;
}

.projekte_kunden_nav_button {
  background: rgba(0, 0, 0, 0.80)!important;
  border: none!important;
  border-radius: 0px!important;
  font-size: 18px;
}

#projekte_kunden_nav {
    position: fixed;
    padding: 30px 0px;
    text-align: right;
    font-size: 1.3em;
    z-index: 999;
    right: 0;
    margin-top: 100px;
}

#projekte_kunden_navi {
     list-style-type: none;
     margin: 0px!important;
     background: rgba(0, 0, 0, 0.80)!important;
     margin-right: 43px !important;
     padding: 20px 0px;
}

#projekte_kunden_navi li {
     margin-bottom: 0px;
     list-style-type: none;
     border-bottom: 1px solid #333;
     margin: 0px!important;
     padding: 0px 30px;
}
#projekte_kunden_navi li a {
     color: #fff!important;
   }
#projekte_kunden_navi li:hover {
  background: rgba(201, 157, 102, 0.7);
  color: #fff!important;
  font-weight: 500;
}
#projekte_kunden_navi li a:hover {
  font-weight: 500;
}



/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Archiv
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/
.archiv {
    width: 90%;
    margin: 0px auto;
}
.archiv a {
    width: 100px!important;
    height: 100px!important;
    float: left;
    margin: 3px!important;
    overflow: hidden;
    border: 1px solid #d9e2e7!important;
    background: none!important;
}
.archiv a:hover {
    border: 1px solid #374E5D!important;
}
.pic_archiv {
    margin-top: -50px;
    margin-left: -80px;
}





/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Portfolio (Projekte) - Content
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/

.content_full_top { padding-top: 150px;  }


#content_box_portfolio {
    width: 25%;
    float: right;
    margin: 2% 4% 0% 0%;
}
#content_box_portfolio h6 {
    margin-bottom: 10px;
    padding: 15px 0px 5px 0px;
    color: #374E5D;
    border-bottom: 1px solid #374E5D;
    font-size: 1.6em;
    font-weight: 300!important;
    letter-spacing: 0.1em;
}
#content_box_portfolio p {
    margin: 0px 0px 10px 0px;
}
#portfolio_pic {
    width: 66%;
    float: left;
    margin: 4% 0% 0% 0%;
}
#portfolio_pic p {
    color: #999;
}

.projekte1 {
    width: 43%;
    float: left;
    margin: 40px 0px;
    padding: 30px;
    background-image: -webkit-gradient(linear, left top, right bottom, from(#591720), to(#994549));
    background-image: -webkit-linear-gradient(327deg, #591720, #994549);
    background-image: -moz-linear-gradient(327deg, #591720, #994549);
    background-image: -o-linear-gradient(327deg, #591720, #994549);
    background-image: -ms-linear-gradient(327deg, #591720, #994549);
    background-image: linear-gradient(327deg, #591720, #994549);
    -moz-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.43);
    -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.43);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.43);
}
h5.info {
    padding: 15px 0px 5px 0px;
    color: #374E5D;
    border: none;
    text-transform: uppercase;
    font-size: 1em;
    font-weight: 300!important;
    letter-spacing: 0.1em;
}
h5.info:before {
    content: "> ";
}




/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Jobs
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/
#jobs_first {
    width: 70%;
    min-height: 500px;
    float: right;
}
#jobs_first p {
    margin-top: 50px;
}
.jobs h5 { color: #3c3c3b !important; }





/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Kontakt / Impressum
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/
.impressum_liste { list-style-type: none; font-size: 1.7em !important; margin-top: 20px; }
.impressum_widgets { list-style-type: none !important; font-size: 0.9em; text-align: left !important; }
.impressum_widgets .contactform input, .impressum_widgets .contactform textarea {  }
.impressum_widgets .contactform h2, .impressum_widgets .contactform h2 {  text-align: left !important; margin-bottom: 20px; }
.impressum_kontakt h3 { line-height: 1.2em; font-weight: 200; text-transform: uppercase; font-size: 3.2em; letter-spacing: 0.01em;}
.impressum_kontakt h3 small { font-weight: 200; font-size: 0.9em; text-transform: initial;}
#mc_display_rewards { display: none;  }
#mc_signup_form .mc_var_label { font-weight: 300; font-size: 1.3em; }
#mc_signup_submit { width: 100% !important; font-size: 1.4em; font-weight: 400; }
#mc_signup_submit:hover {  background: #efce5e;  }
#mc_signup_form .mc_input {  font-size: 1.4em; }

/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Partner
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/

.partner h4 {
    text-transform: uppercase;
    font-size: 3vw;
    color: #951b81;
    font-weight: 100;
    letter-spacing: 0.05em;
    margin: 20px 0px;
}

.partner, .partner p {
    text-align: center;
    font-size: 1.2vw !important;
    line-height: 1.9em !important;
}


.partner_box {
    background: #fff;
    box-shadow: 0px 0px 5px #ccc;
    text-align: left!important;
    padding: 20px 10px 10px 10px !important;
}

.partner_box p {
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    font-weight: 300;
    color: #999;
    line-height: 1.6em !important;
}
.partner_box h5 {
    text-transform: uppercase;
    font-size: 2vw;
    font-size: 1.5vw;
}


.partner_box h6 {
    text-transform: uppercase;
    font-size: 1.65vw;
    color: #951b81;
    font-weight: 100 !important;
    letter-spacing: 0.05em;
    margin: 10px 0px 10px 0px;
}

.partner_box:hover { background: #15466b; }
.partner_box:hover p { color: #fff; }
.partner_box:hover h5 { color: #fff; }
.partner_box:hover h6 { color: #fff; color: #ccc; }


/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Footer
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
*/
footer {
    bottom: 0;
    left: 0;
    width: 100%;
    height: 370px;
    color: #797979;
    background: #1a1a1a;
    font-size: 1.3em;
    line-height: 2.2em;
    list-style-type: none;
}
footer a {
    color: #797979!important;
}
footer a:hover {
    color: #B69F0C!important;
}
.footer_first_content, .footer_second_content, .footer_third_content {
    margin-top: 50px;
    font-size: 2em!important;
}
.footer_fourth_content {
    bottom: 0;
    padding: 0px;
    background: #252525;
    text-align: center;
    font-size: 1.7em;
    letter-spacing: 0.05em;
}
.footer_first_content ul, .footer_fourth_content ul, .footer_second_content ul, .footer_third_content ul {
    list-style-type: none;
}
.footer_first_content ul li, .footer_fourth_content ul li, .footer_second_content ul li, .footer_third_content ul li {
    display: inline-flex;
    margin-right: 20px;
    text-align: center;
    font-size: 0.6em;
}
.footer_fourth_content ul {
    margin: 0 auto!important;
}
.footer_first_content {}
.footer_first_content h3 {}
.footer_second_content {
    margin-top: 45px;
}
.footer_third_content {}
.footer_third_content i {
    display: block;
    padding: 10px 0px;
}
.footer_copyright {
    bottom: 0;
    padding: 20px 0px;
    background: #151515;
    text-align: center;
    font-size: 1.2em;
    letter-spacing: 0.05em;
    list-style-type: none!important;
}
.footer_googleposition {
    height: 300px;
}


.footer_menu_b1, .footer_menu_b2, .footer_menu_b3 {
    float: left;
    margin: 50px 8px 15px 0px;
    color: #fff;
    font-size: 1.8em;
}
.footer_menu_b1, .footer_menu_b1 a {
    padding: 25px 31.5px;
    color: #fff!important;
    background: #4c67a2;
}
.footer_menu_b2, .footer_menu_b2 a {
    padding: 25px 28.5px;
    color: #fff!important;
    background: #0cadb7;
}
.footer_menu_b3, .footer_menu_b3 a {
    padding: 25px 27.5px;
    color: #fff!important;
    background: #9b59b6;
}
.footer_menu_b1:hover {
    background: #4cb9da;
    transition: background 1s;
}
.footer_menu_b2:hover {
    background: #a5b70c;
    transition: background 1s;
}
.footer_menu_b3:hover {
    background: #753e8b;
    transition: background 1s;
}
.footer_menu_b1 i, .footer_menu_b2 i, .footer_menu_b3 i {
    color: #fff!important;
}
footer h2.widgettitle {
    margin-top: 20px;
    color: #a7a7a7 !important;
    font-size: 0.9em !important;
    font-weight: normal;
    line-height: 1;
    letter-spacing: 0.03em;
}
footer .textwidget {
    font-size: 0.6em;
    line-height: 1.4em;
}
footer h3 {
    color: #f5f5f5;
}
footer h3 small {
    color: #a7a7a7;
}
footer h4 {
    font-weight: 300;
    line-height: 0.9;
}
footer h4 small {
    margin-right: 10px;
    color: #5a5a5a;
    display: inline-block;
    width: 55px;
}
h4.footer_ceo, h4.footer_phone, h4.footer_street {
    margin-top: 20px;
}
label.screen-reader-text {
    display: none;
}
footer input {
    padding: 6px 25px;
    border: none;
    border-top: 1px solid #333333;
    border-radius: 50px;
    background: #252525;
    -moz-box-shadow: inset 0px 5px 5px 0px rgba(0, 0, 0, 0.48);
    -webkit-box-shadow: inset 0px 5px 5px 0px rgba(0, 0, 0, 0.48);
    box-shadow: inset 0px 5px 5px 0px rgba(0, 0, 0, 0.48);
    font-size: 0.5em !important;
}

/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Mailchimp
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------



  .mc_header_email, .mc_header_text {
   visibility: hidden;
  }
  .mc_header_email:after {
    content:'E-Mail Addresse*';
    visibility: visible;
    display: block;
    margin-top: -15px!important; padding: 0px!important;
  }
  .mc_header_text:after {
  content:'Vorname';
  visibility: visible;
  display: block;
  margin-top: -15px!important; padding: 0px!important;
  }
  .mc_header_text:after {
  content:'Nachname';
  visibility: visible;
  display: block;
  margin-top: -15px!important; padding: 0px!important;
  }
*/

#mc-indicates-required {
    margin-bottom: 10px;
}
div.wpcf7-mail-sent-ok {
    border: 2px solid #398f14;
    font-size: 1.3vw;
    padding: 10px 15px;
    border-radius: 20px;
    background: #398f14;
    color: #fff;
    margin: 0px;
}
.mc_success_msg {
    font-size: 1.3vw;
}

/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  404 Seite
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  */
  #site_404 {
      margin-top: 10vw;
  }

  #site_404 h2 {
      color: #374E5D;
      font-size: 18vw;
  }

  #site_404 .site_404_txt {
    margin-top: 3vw;
    font-size: 1.9vw;
}



/*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  OFFCanvas
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  */
.schaltflaeche_menue {
    padding: 10px 0 10px 27px!important;
    background: rgba(0,0,0,0.5)!important;
    color: rgba(255,255,255,0.7)!important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3)!important;
    font-size: 4.8vw!important;
}
.icon_navi { margin-right: 10px; }

.sidr { font-family: "Roboto", "Droid Sans", Arial, Helvetica, sans-serif!important; background: #1d1d20; color: #eee; }
.sidr ul li {  color: #eee; border-bottom: 1px solid #111; border-top: 1px solid #313131; text-shadow: 0 1px 1px rgba(0,0,0,.5); }
.sidr a {  padding: 15px 25px!important; line-height: 1.6em; text-decoration: none; cursor: pointer; text-transform: uppercase; color: #eee; text-shadow: 0 1px 1px rgba(0,0,0,.5);
  -webkit-transition: .2s all ease;
-moz-transition: .2s all ease;
-ms-transition: .2s all ease;
-o-transition: .2s all ease;
transition: .2s all ease; font-size: 0.8em; letter-spacing: 0.1em;}
.sidr a:hover { border: none!important; box-shadow: none!important;  }

  /*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Multilanguage - Englisch
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  */

  .en .kunden_teaser h2, .en .projekte_teaser h2 {  font-size: 2.5vw!important; }
  .lang_eng .sect1_txt2 { font-size: 6.2vw !important; }



  /*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  Farben überschreiben
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  */

  .color1, .color1 a { color: #f0f0f0!important; }
  .color2, .color2 a { color: #4a4a4a!important; }



  .footer_googleposition .textwidget::before { display: none!important;  }



  /*
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  RESPONSIVE DESIGN
  ---------------------------------------------------------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------------------------------
  */

  @media (min-width: 1919px) {
   #mobile-header { display: none; }
   #slide02 h2 { font-size: 1.3vw!important; }
   #slide02 p.teaser {  font-size: 0.85vw !important; }
   #slide02 p.content { font-size: 1vw !important; }
   #leistungen_pic {  min-height: 28vw !important;  }
   .kunden_teaser, .projekte_teaser {  height: 600px!important; }
   .projekte_kacheln {  height: 600px!important; }
   .kunden_header_pic1 { margin: -141px 0px 0px 40px!important;   }
   .kunden_header_pic2 { margin: -550px 0px 0px 460px !important; }
   .kunden_header_pic3 { margin: 70px 0px 0px 500px !important; }
   .portfolio_wrapper p.teaser { font-size: 0.6vw !important; }
   .agentur .box3, .agentur .box4, .agentur .box5  {  min-height: 23vw; }
  }

  @media (min-width: 1599px) {
    #mobile-header { display: none; }
    #leistungen_pic {  min-height: 28vw !important; }
    #slide02 h2 { font-size: 1.5vw; }
    .projekte_content1 p {  font-size: 0.9vw !important; }
    .agentur .box3, .agentur .box4, .agentur .box5  {  min-height: 24vw; }
  }

  @media (min-width: 1199px) {
    #mobile-header { display: none; }
  }


  @media (min-width: 769px) and (max-width: 1199px) {
    #mobile-header { display: none; }
  }

  /* Tablet */
  /* abweichende CSS-Regel für Displays, die kleiner als 768px sind */
  @media screen and (min-width: 620px) and (max-width:768px) {

    #section2 h2.headline {   word-wrap:break-word; }


    #leistungen_pic {  width: 100%; min-height: 58vw !important; margin: 6vw 0px; background: url("pics/leistungen_small1.png") center top no-repeat; background-size: 100%; }
    #leistungen_pic_en {  width: 100%; min-height: 58vw !important; margin: 6vw 0px; background: url("pics/leistungen_small_en1.png") center top no-repeat; background-size: 100%; }
    .agentur, .agentur p { text-align: center; font-size: 1.7vw !important;}
    #agenturliste p {  font-size: 1.7vw !important; }


    #mobile-header { display: none; }
    ul#menu-mainmenu, ul#menu-mainmenue { font-size: 1.2em;}
    #menu-mainmenu li, #menu-mainmenue li {   margin-right: 15px; }
    /* INDEX */
    .sect1_txt1 {font-size: 10.8vw !important; border-top: 7px solid #fff; padding-top: 20px;}
    .sect1_txt2 {font-size: 9.6vw !important; font-weight: 400 !important;}
    .sect1_txt3 {border-bottom: 7px solid #fff; font-size: 6vw !important; margin-top: 10px; padding-bottom: 25px;}
    .sect1_txt4 { margin-top: 54px; font-size: 3.5vw !important; }
    .nav_logo { width: 130px; margin: 34px auto 0px 8px !important; }
    .mousedown_button_obj { width: 60px; margin-top: 64px; }
    #preloader, .txt-perc { font-size: 2vw !important; }

    .icon1, .icon2, .icon3 {  margin: 0 auto; height: 150px; width: 150px; }
    .icon1 object { width: 90px; margin: 0px 0px 0px 10px !important; }
    .icon2 object { width: 90px; margin: 0px 0px 0px 0px !important; }
    .icon3 object { width: 90px; margin: 0px 0px 0px 0px !important; }

    #section2 {  padding: 0px 60px; text-align: center; }
    #section2 h2 small { font-size: 2.8vw !important; }
    #section2 h2.headline { font-size: 8vw !important; }
    #section2 p { font-size: 2.8vw !important; }
    ul.group li { padding: 5px 10px; border: 3px solid #fff; font-size: 2.2vw !important; display: -moz-box; float: none; }
    ul.group ul.list1, ul.group ul.list2, ul.group ul.list3, ul.group ul.list4 { margin: 0!important; }

    #slide01 h2 { margin: -180px auto 0px auto !important; padding: 50px; font-size: 5.3vw; line-height: 1.4; height: 44vw; width: 48vw; }
    #slide01 p { padding: 50px !important; font-size: 3.0vw !important; margin: 10px auto 0px auto !important; line-height: 1.3 !important; height: 58vw; width: 48vw; }

    #slide02 h2 { padding: 20px; width: 420px; font-size: 3.4vw; margin-top: -60px !important;}
    #slide02 p.teaser { font-size: 2.2vw !important; padding: 20px !important; width: 420px; }
    #slide02 p.content { font-size: 2.3vw !important; padding: 30px !important; width: 420px; }
    #slide02 .bcg { transform: none !important; }

    #slide03 h2 {  font-size: 3vw; }
    .contactform input, .contactform textarea { font-size: 2em; }

    footer { height: auto!important; }
    footer h4 small { font-size: 2vw!important; }

    /* Agentur */
    .agentur .box3, .agentur .box4, .agentur .box5  {  min-height: auto!important; width: 100%!important; margin-left: 0%!important;}

    /* Kunden */
    .kunden_header_pic1 {  margin: -120px 0px 0px 0px; }
    .kunden_header_pic1 img { width: 305px !important; }
    .kunden_header_pic2 {  margin: -437px 0px 0px 233px; }
    .kunden_header_pic2 img { width: 190px !important; }
    .kunden_header_pic3 {  margin: 20px 0px 0px 320px; }
    .kunden_header_pic3 img { width: 80px !important; }
    .kunden_teaser p, .projekte_teaser p {  font-size: 1.7vw !important; line-height: 1.5 !important; }
    .pic_kunden {  width: 150px !important; }
    #boxeffect1, #boxeffect2, #boxeffect3 {  margin-left: 4%; width: 700px;}
    .galcolumn { padding-left: 0px!important; width: 32%!important; }
    #boxeffect1 h5, #boxeffect2 h5, #boxeffect3 h5 {  margin: 20px 60px 40px 25px;  }

    /* Projekte */
    .breadcrumb { font-size: 1.5vw!important; }
    .projekte_content_box1 h6 {  font-size: 2.2vw !important; }
    .projekte_content1 p { font-size: 1.6vw !important; line-height: 1.4em !important; }
    a .pdf-button {    font-size: 5vw; } 
    .projekte_teaser { margin-bottom: 0px!important; }


    /* Impressum */
    .impressum p {  font-size: 1.8vw!important;   }




  }


  /* Smartphones */
  /* abweichende CSS-Regel für Displays, die kleiner als 620px sind */
  @media only screen and (max-width: 620px) {
    #slide02 h2 { width: 280px!important;}
    #slide02 p.teaser { font-size: 3.6vw !important; width: 280px!important; }
    #slide02 p.content { font-size: 4vw !important; width: 280px!important; }
    #slide01 p { font-size: 4vw!important; height: 74vw!important; }

    .nav_scroll { display: none!important; }
    /* INDEX */
    #mobile-header { display: block; width: 100%; z-index: 9999; position: fixed; }
    ul#menu-mainmenu, ul#menu-mainmenue { display: none!important; }
    .sect1_txt1 {font-size: 12.8vw !important; border-top: 5px solid #fff;}
    .sect1_txt2 {font-size: 11.6vw !important; font-weight: 400 !important;}
    .sect1_txt3 {border-bottom: 5px solid #fff; font-size: 7vw !important; }
    .sect1_txt4 { margin-top: 25px!important; font-size: 5vw !important; }
    .nav_logo { width: 130px; margin: 64px auto 0px 18px !important; }
    .mousedown_button_obj { width: 45px; margin-top: 35px; }
    #preloader, .txt-perc { font-size: 4vw !important; }

    .icon1, .icon2, .icon3 {  margin: 0 auto; height: 100px; width: 100px; }
    .icon1 object { width: 60px; margin: -22px 0px 0px 0px!important; }
    .icon2 object { width: 60px; margin: -26px 0px 0px -4px !important; }
    .icon3 object { width: 60px; margin: -25px 0px 0px -6px !important; }

    #section2 {   padding: 0px 0px;  text-align: center; }
    #section2 h2 small { font-size: 4.4vw !important; }
    #section2 h2.headline { font-size: 9vw !important; }
    #section2 p { font-size: 4.2vw !important; }
    ul.group li { padding: 5px 10px; border: 3px solid #fff; font-size: 3.5vw !important; display: -moz-box; float: none; }
    ul.group ul.list1, ul.group ul.list2, ul.group ul.list3, ul.group ul.list4 { margin: 0!important; }


    #slide01 h2 { margin-top: -100px !important; padding: 20px; font-size: 8.5vw; line-height: 1.4; height: 61vw; }
    #slide01 p { padding: 20px !important; font-size: 3.8vw !important; margin-top: 10px; line-height: 1.3 !important; height: 58vw;  }

    #slide02 h2 { padding: 20px; width: 256px; font-size: 4.8vw; margin-top: -60px !important;}
    #slide02 p.teaser { font-size: 3.2vw !important; padding: 20px !important; width: 256px; }
    #slide02 p.content { font-size: 3.2vw !important; padding: 20px !important; width: 256px; }
    #slide02 .bcg { transform: none !important; }

    #cb03 { margin: 0px 0px 40px 0px; }
    .content-block {  padding: 40px 0px 40px 0px !important; }

    video#bgvid {  display: none!important; }
    .videoblendung { background: url("pics/video_pic1.jpg") center top no-repeat; }
    #section1 { max-height: 100%; margin-bottom: 50px;  }

    .agentur_profil_box1 h4 {  font-size: 4vw; line-height: 1.5em; }

    #slide03 h2 {  margin-top: -170px; font-size: 5vw; }
    .contactform input, .contactform textarea { font-size: 3.4em; }

    footer { height: auto!important; }
    footer h4 small { font-size: 4vw; }

    .impressum_widgets .contactform { margin-top: 80px!important; }
    .impressum_kontakt h3 { margin-top: -100px; }


    /* Agentur */
    .agentur .box3, .agentur .box4, .agentur .box5  {  min-height: auto!important; width: 100%!important; margin-left: 0%!important; padding: 20px 40px !important;}
    .agentur .box3 p, .agentur .box4 p, .agentur .box5 p { line-height: 6vw !important; }
    .agentur .box2 p { line-height: 6.5vw !important; }
    .agentur .box1 p { font-size: 7vw !important; line-height: 10.3vw !important; }
    .agentur .box1 {  padding: 30px;  margin-bottom: 20px; }
    .agentur .box0 h4 { font-size: 11.2vw; border-bottom: 5px solid #3c3c3b; border-top: 5px solid #3c3c3b; padding: 2vw 0px !important; margin: 30vw 0vw 5vw 0vw; }

    #agenturliste h2 { font-size: 5.65vw !important; }
    .agentur p { font-size: 4.03vw !important; }
    #agenturliste p { font-size: 4.03vw !important; }
    p { font-size: 4.03vw !important; }
    #leistungen_pic {  width: 100%; min-height: 118vw !important; margin: 6vw 0px; background: url("pics/leistungen_small2.png") center top no-repeat; background-size: 100%; }
    #leistungen_pic_en {  width: 100%; min-height: 118vw !important; margin: 6vw 0px; background: url("pics/leistungen_small_en2.png") center top no-repeat; background-size: 100%; }

    .agenturicon1 object { width: 30vw;  }

    /* Kunden */
    .kunden_header_pic1, .kunden_header_pic1 img {  margin: -172px 0px 0px 85px !important width: 150px !important; }
    .kunden_header_pic2, .kunden_header_pic2 img {  margin: -173px 0px 0px 108px !important; width: 110px !important; }
    .kunden_header_pic3, .kunden_header_pic3 img {  margin: -0px 0px 0px 34px !important; width: 60px !important; }
    .en .kunden_teaser h2, .en .projekte_teaser h2 {  font-size: 5.0vw!important; }
    .kunden_teaser h2, .projekte_teaser h2 { font-size: 5.0vw; }
    .pic_kunden {  width: 170px !important; }
    #boxeffect1, #boxeffect2, #boxeffect3 {  margin-left: 20%;   }
    .galcolumn { padding-left: 0px!important;  }
    #boxeffect1 h5, #boxeffect2 h5, #boxeffect3 h5 {  margin: 20px 60px 40px 5px;  }

    /* Partner */
    .partner h4 {  font-size: 5.8vw; }
    .partner, .partner p {  font-size: 4.0vw !important; } 
    .partner_box {   margin: 0px auto 20px auto; width: 95%!important;  }
    .partner_box img { width: 160px; margin-left: 20vw !important; }
    .partner_box h5 { font-size: 4.5vw!important; text-align: center!important; }
    .partner_box h6 { font-size: 5.1vw!important; text-align: center!important; }
    .partner_box p { font-size: 4.4vw !important; text-align: center!important; }


    /* Projekte */
    .projekte_teaser h2 { margin-top: 60px!important; }
    .projekte_header_pic1 { margin: -380px 0px 0px 80px;  }
    .projekte_header_pic1 img { width: 260px;  }
    .projekte_teaser { margin-bottom: 0px!important; }


    /* Projekte - Innenseiten*/
    .projekte_content_wrapper {height: auto!important; width: 100%;    }
    .projekte_content_pic {  width: 100%;   }
    .projekte_content_box1 {   padding: 10px 20px !important; }
    .breadcrumb { font-size: 3vw!important; }
    .projekte_content_box1 h6 {  font-size: 4vw !important; }
    .projekte_content1 p { font-size: 3.6vw !important; line-height: 1.4em !important; }
    .projekte_content1 h3 { margin-top: 50px!important;  }
    .projekte_content_wrapper .zentriert {   position: static !important; top: 0!important; -ms-transform: none!important; -webkit-transform: none!important; transform: none!important; padding-top: 60px; padding-bottom: 60px; }
    a .pdf-button {  font-size: 9vw;  margin-left: -4px; }
    .mouse_down1 {  float: right;   margin-top: -80px;  width: auto;    }
    .portfolio_wrapper p.teaser {  font-size: 2.8vw !important; }
    .iconmore { font-size: 8.6vw !important; margin-left: -5px; line-height: 1.4em; }

}





/* Smartphones */
/* abweichende CSS-Regel für Displays, die kleiner als 479px sind */
  @media only screen and (max-width: 479px) {
  .nav_scroll { display: none!important; }
  /* INDEX */
  #mobile-header { display: block; width: 100%; z-index: 9999; position: fixed; }
  ul#menu-mainmenu, ul#menu-mainmenue { display: none!important; }
  .sect1_txt1 {font-size: 12.8vw !important; border-top: 5px solid #fff;}
  .sect1_txt2 {font-size: 11.6vw !important; font-weight: 400 !important;}
  .sect1_txt3 {border-bottom: 5px solid #fff; font-size: 7vw !important; }
  .sect1_txt4 { margin-top: 25px!important; font-size: 5vw !important; display: block;}
  .nav_logo { display: none!important; }
  .mousedown_button_obj { width: 45px; margin-top: 35px; }
  #preloader, .txt-perc { font-size: 4vw !important; }

  .icon1, .icon2, .icon3 {  margin: 0 auto; height: 100px; width: 100px; }
  .icon1 object { width: 60px; margin: -22px 0px 0px 0px!important; }
  .icon2 object { width: 60px; margin: -26px 0px 0px -4px !important; }
  .icon3 object { width: 60px; margin: -25px 0px 0px -6px !important; }

  #section2 {   padding: 0px 0px;  text-align: center; }
  #section2 h2 small { font-size: 4.4vw !important; }
  #section2 h2.headline { font-size: 9vw !important; }
  #section2 p { font-size: 4.2vw !important; }
  ul.group li { padding: 5px 10px; border: 2px solid #fff; font-size: 2.5vw !important; float: left;  }
  ul.group ul.list1, ul.group ul.list2, ul.group ul.list3, ul.group ul.list4 { margin: 0!important; }


  #slide01 h2 { margin-top: -100px !important; padding: 20px; font-size: 8.5vw; line-height: 1.4; height: 61vw; width: 100%;  }
  #slide01 p { padding: 20px !important; font-size: 3.5vw !important; margin-top: 10px; line-height: 1.3 !important; height: 58vw!important; width: 100%;  }

  #slide02 h2 { padding: 20px; width: 256px; font-size: 4.8vw; margin-top: -60px !important;}
  #slide02 p.teaser { font-size: 3.2vw !important; padding: 20px !important; width: 256px; }
  #slide02 p.content { font-size: 3.2vw !important; padding: 20px !important; width: 256px; }
  #slide02 .bcg { transform: none !important; }

  #cb03 { margin: 0px 0px 40px 0px; }

  #slide03 h2 {  margin-top: -170px; font-size: 5vw; }
  .contactform input, .contactform textarea { font-size: 0.9em; }

  footer { height: auto!important; list-style-type: none!important; }
  footer h4 small { font-size: 4vw!important; }



  /* Agentur */
  .agentur h4 { font-size: 6vw; }
  .agentur h5 { font-size: 4.5vw; }
  .agentur h6 { font-size: 5vw; }

  #agenturliste h2 {  font-size: 5.65vw !important; }
  .agentur, .agentur p, #agenturliste p { font-size: 4.03vw !important; }
  #leistungen_pic {  width: 100%; min-height: 116vw !important; margin: 6vw 0px; background: url("pics/leistungen_small2.png") center top no-repeat; background-size: 100%; }
  #leistungen_pic_en {  width: 100%; min-height: 116vw !important; margin: 6vw 0px; background: url("pics/leistungen_small2.png") center top no-repeat; background-size: 100%; }

  .agenturicon1 object { width: 40vw; margin-top: 20px; }
  .agentur .box4 h2, .agentur .box5 h2 { font-size: 3.5vw!important; }
  .agentur .box1 p, .agentur .box1 h1 { font-size: 3.5vw!important; }

  /* Kunden */
  .kunden_header_pic1, .kunden_header_pic1 img {  margin: -179px 0px 0px 70px!important; width: 150px !important; }
  .kunden_header_pic2, .kunden_header_pic2 img {  margin: -173px 0px 0px 90px !important; width: 110px !important; }
  .kunden_header_pic3, .kunden_header_pic3 img {  margin: -0px 0px 0px 25px !important; width: 60px !important; }

  /* Projekte */
  #projekte_kunden_nav { margin-top: 0px; margin: -1px 1px !important; z-index: 9999 !important; padding: 4px 3px 0px 0px; }
  #projekte_kunden_navi { margin-right: 0px !important; }

  .agentur_profil .projekte_content_pic {  background-position: center !important;  }


}


  /*
    ---------------------------------------------------------------------------------------------------------------------
    ---------------------------------------------------------------------------------------------------------------------
    WINDOWS AUSNAHME
    ---------------------------------------------------------------------------------------------------------------------
    ---------------------------------------------------------------------------------------------------------------------
  */

.win body {
}
.win .agentur h4{
  font-weight: 100!important;
  font-weight: lighter!important;
}
.win .agenturicon1 object {
  height: 100px!important;
}
.win .sect1_txt1 {
    display: inline;
}
.win .sect1_txt3 {
    display: inline;
}
.win .sect1_txt4 {
    display: inline-block;
    margin-top: 40px!important;
}
.win .content-block {
    display: inline-block;
}
.win .bcgchange {
    display: inline-block;
}
.win .portfolio_pic { opacity: 0.1; }
.win .portfolio_pic:hover { opacity: 0.8; }
.win .portfolio_logo_wrapper:hover {  z-index: 9999;  opacity: 1; }
.win .portfolio_logo_wrapper {  z-index: 9999;  opacity: 1; }